/* SVJ Duhová 2201–2209 — portálový demo web (webpj.cz) */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:#f6f7fb;color:#1d2233;font-size:15.5px;line-height:1.55;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:#4c5fd5}
h1,h2,h3{line-height:1.25;margin:0}
p{margin:0 0 .8em}
select,input,textarea{min-width:0;width:100%;font:inherit;color:inherit}
button{font:inherit;cursor:pointer}
:root{
  --ink:#1d2233;--mut:#6b7280;--ind:#4c5fd5;--ind-d:#3a4bb8;--line:#e5e8f0;
  --sh:0 1px 2px rgba(29,34,51,.05),0 10px 28px rgba(29,34,51,.08);
  --rain:linear-gradient(90deg,#f2545b,#f2994a,#f2c94c,#27ae60,#2f80ed,#7b61ff);
}

/* ------- demo ribbon (nad celým layoutem) ------- */
.demo{background:#4c5fd5;color:#fff;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;text-align:center;padding:9px 14px;font-size:13.5px;font-weight:600;line-height:1.4}
.demo a{background:#fff;color:#4c5fd5;font-weight:700;padding:5px 14px;border-radius:999px;text-decoration:none;font-size:13px;white-space:nowrap}

/* ------- top bar ------- */
.topbar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 20px;min-height:58px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;min-width:0}
.logo{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#f2545b 0%,#f2994a 22%,#f2c94c 42%,#27ae60 62%,#2f80ed 80%,#7b61ff 100%);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex:none;box-shadow:0 4px 12px rgba(76,95,213,.28)}
.bt{display:flex;flex-direction:column;min-width:0}
.bt strong{font-size:15.5px;font-weight:800;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt small{color:var(--mut);font-size:12px;font-weight:600}
.top-badge{font-size:12.5px;font-weight:700;color:var(--ind);background:#eceffb;border:1px solid #dde2f7;padding:6px 13px;border-radius:999px;white-space:nowrap}
@media(max-width:680px){.top-badge{display:none}.topbar{padding:9px 14px}}

/* ------- app layout: sidebar + obsah ------- */
.app{display:flex;align-items:flex-start;gap:24px;max-width:1280px;width:100%;margin:0 auto;padding:22px 20px 44px}
.side{position:sticky;top:74px;width:232px;flex:none;display:flex;flex-direction:column;gap:16px}
.side nav{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh);padding:10px;display:flex;flex-direction:column;gap:2px}
.side nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;text-decoration:none;color:#3c4257;font-weight:600;font-size:14.5px}
.side nav a svg{width:20px;height:20px;flex:none;stroke:#8a90a5}
.side nav a:hover{background:#f2f4fb;color:var(--ink)}
.side nav a.on{background:var(--ind);color:#fff;box-shadow:0 6px 14px rgba(76,95,213,.30)}
.side nav a.on svg{stroke:#fff}
.sos{background:#1d2233;color:#fff;border-radius:16px;padding:15px 16px;position:relative;overflow:hidden}
.sos::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--rain)}
.sos small{display:block;color:#aeb4c9;font-size:12px;font-weight:600;margin-bottom:4px}
.sos a{color:#fff;font-weight:800;font-size:17px;text-decoration:none;white-space:nowrap}
.main{flex:1;min-width:0}

/* ------- ikony ------- */
.ic{fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ------- karty a mřížka ------- */
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh);padding:20px;min-width:0}
.s4{grid-column:span 4}.s5{grid-column:span 5}.s6{grid-column:span 6}.s7{grid-column:span 7}.s8{grid-column:span 8}.s12{grid-column:span 12}
@media(max-width:980px){.s4,.s5,.s6,.s7,.s8{grid-column:span 12}}
.ch{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.ch h2{font-size:16px;font-weight:800;letter-spacing:-.01em}
.ch a{font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap}
.mut{color:var(--mut)}
.note{color:var(--mut);font-size:12.5px;margin:12px 0 0}

/* uvítací pruh */
.hello{grid-column:span 12;background:linear-gradient(120deg,#4c5fd5 0%,#5a54d2 55%,#6a4fd0 100%);border:none;color:#fff;position:relative;overflow:hidden}
.hello::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--rain)}
.hello h1{font-size:24px;font-weight:800;letter-spacing:-.01em;margin-bottom:6px}
.hello p{color:#dfe3ff;max-width:620px;margin-bottom:0}
.search{display:flex;gap:8px;max-width:540px;margin-top:16px}
.search input{flex:1;border:none;border-radius:11px;padding:12px 15px;background:#fff;color:var(--ink)}
.search input::placeholder{color:#8a90a5}
.search button{flex:none;background:#1d2233;color:#fff;border:none;border-radius:11px;padding:12px 18px;font-weight:700;font-size:14px}
@media(max-width:480px){.hello h1{font-size:21px}.search button{padding:12px 14px}}

/* hero obrázek */
.heroimg{padding:0;overflow:hidden;position:relative}
.heroimg img{width:100%;height:100%;min-height:230px;max-height:300px;object-fit:cover}
.heroimg .cap{position:absolute;left:14px;bottom:14px;background:rgba(29,34,51,.74);color:#fff;font-size:12.5px;font-weight:600;padding:6px 13px;border-radius:999px}

/* řádky událostí (dashboard + odstávky) */
.evrow{display:flex;align-items:flex-start;gap:13px;padding:11px 0;border-top:1px solid #eef0f6}
.evrow:first-of-type{border-top:none}
.dchip{width:48px;flex:none;text-align:center;background:#eceffb;border-radius:11px;padding:6px 2px;color:var(--ind)}
.dchip b{display:block;font-size:17px;font-weight:800;line-height:1.1}
.dchip small{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.evrow h3{font-size:14.5px;font-weight:700;margin-bottom:2px}
.evrow p{font-size:13px;color:var(--mut);margin:0}

/* výtahy */
.lift{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.lift>div{border:1px solid #eef0f6;background:#fafbfe;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px;min-width:0}
.lift small{display:block;font-size:11px;font-weight:600;color:var(--mut)}
.dot{width:9px;height:9px;border-radius:50%;background:#27ae60;flex:none;box-shadow:0 0 0 3px rgba(39,174,96,.15)}
.dot.o{background:#f2994a;box-shadow:0 0 0 3px rgba(242,153,74,.18)}
@media(max-width:480px){.lift{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* dokumenty řádky */
.drow{display:flex;align-items:center;gap:13px;padding:11px 0;border-top:1px solid #eef0f6}
.drow:first-of-type{border-top:none}
.fico{width:38px;height:38px;flex:none;border-radius:10px;background:#eceffb;color:var(--ind);display:flex;align-items:center;justify-content:center}
.fico svg{width:19px;height:19px;stroke:var(--ind)}
.drow .dn{min-width:0;flex:1}
.drow h3{font-size:14.5px;font-weight:700;margin-bottom:1px}
.drow p{font-size:12.5px;color:var(--mut);margin:0}
.pdfb{flex:none;font-size:11px;font-weight:800;color:var(--ind);background:#eceffb;border-radius:7px;padding:4px 8px;white-space:nowrap}

/* aktuality */
.arow{display:flex;gap:14px;padding:12px 0;border-top:1px solid #eef0f6;align-items:flex-start}
.arow:first-of-type{border-top:none}
.arow img{width:66px;height:66px;border-radius:12px;object-fit:cover;flex:none}
.arow small{color:var(--ind);font-weight:700;font-size:12px}
.arow h3{font-size:15px;font-weight:700;margin:1px 0 3px}
.arow p{font-size:13.5px;color:var(--mut);margin:0}

/* kontakty rychlé */
.krow{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid #eef0f6}
.krow:first-of-type{border-top:none}
.krow h3{font-size:14px;font-weight:700}
.krow p{font-size:13px;color:var(--mut);margin:0}
.krow a{font-weight:700;text-decoration:none;white-space:nowrap}

/* ------- záhlaví podstránek ------- */
.phead{margin-bottom:20px}
.eb{color:var(--ind);font-weight:800;font-size:12px;letter-spacing:.09em;text-transform:uppercase;display:block;margin-bottom:5px}
.phead h1{font-size:26px;font-weight:800;letter-spacing:-.01em;margin-bottom:7px}
.phead p{color:var(--mut);max-width:660px;margin:0}
@media(max-width:480px){.phead h1{font-size:22px}}

/* ------- tlačítka ------- */
.btn{display:inline-block;background:var(--ind);color:#fff;font-weight:700;border:none;border-radius:11px;padding:12px 20px;font-size:14.5px;text-decoration:none}
.btn:hover{background:var(--ind-d)}
.btn.ghost{background:#eceffb;color:var(--ind)}

/* ------- kalendář ------- */
.calhead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.calnav{display:flex;align-items:center;gap:10px}
.calnav button{width:36px;height:36px;border-radius:10px;border:1px solid #d9ddea;background:#fff;color:#3c4257;font-weight:800;font-size:15px;line-height:1}
.calnav button:disabled{opacity:.35;cursor:default}
.calnav strong{font-size:16.5px;font-weight:800;min-width:150px;text-align:center;text-transform:capitalize}
.fwrap{width:200px;max-width:100%}
.fwrap select,.frow select,.frow input,.frow textarea{border:1px solid #d9ddea;border-radius:10px;padding:11px 12px;background:#fff}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.wd{font-size:11px;font-weight:800;color:#8a90a5;text-align:center;text-transform:uppercase;letter-spacing:.05em;padding:3px 0}
.day{background:#fafbfe;border:1px solid #eef0f6;border-radius:10px;min-height:88px;padding:6px;min-width:0;overflow:hidden}
.day.out{background:transparent;border-color:transparent}
.day .n{font-weight:700;font-size:12.5px;color:var(--mut)}
.day.today{border-color:var(--ind);box-shadow:0 0 0 2px rgba(76,95,213,.16)}
.day.today .n{color:var(--ind)}
.ev{display:block;font-size:10.5px;font-weight:700;color:#fff;border-radius:6px;padding:2.5px 6px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-voda{background:#2f80ed}
.t-vytah{background:#7b61ff}
.t-der{background:#f2994a}
.t-uklid{background:#27ae60}
.leg{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:15px;font-size:13px;font-weight:600;color:#3c4257}
.leg i{width:11px;height:11px;border-radius:3px;display:inline-block;margin-right:7px;vertical-align:-1px}
@media(max-width:560px){
  .cal{gap:3px}
  .day{min-height:52px;padding:4px;border-radius:7px}
  .day .n{font-size:11px}
  .ev{font-size:0;height:6px;padding:0;margin-top:3px;border-radius:3px}
}
.badge{display:inline-block;font-size:11px;font-weight:800;color:#fff;border-radius:999px;padding:3px 10px;white-space:nowrap}

/* ------- formuláře ------- */
.frow{margin-bottom:14px}
.frow label{display:block;font-size:13px;font-weight:700;margin-bottom:5px}
.frow textarea{resize:vertical;min-height:96px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.f2{grid-template-columns:1fr}}
.ok{display:none;background:#e5f6ec;color:#1e8e4d;border:1px solid #bfe8cf;border-radius:11px;padding:12px 15px;font-weight:600;font-size:14px;margin-bottom:16px}

/* ------- tabulka závad ------- */
.ztab{width:100%;border-collapse:collapse;font-size:14px}
.ztab th{text-align:left;font-size:11.5px;color:#8a90a5;text-transform:uppercase;letter-spacing:.05em;padding:8px;border-bottom:1px solid var(--line)}
.ztab td{padding:11px 8px;border-top:1px solid #eef0f6;vertical-align:top}
.ztab td:first-child{white-space:nowrap;color:var(--mut);font-size:13px}
.st{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:3px 11px;white-space:nowrap}
.st-p{background:#eceffb;color:#4c5fd5}
.st-r{background:#fdf0e3;color:#c06a10}
.st-h{background:#e5f6ec;color:#1e8e4d}
@media(max-width:640px){
  .ztab thead{display:none}
  .ztab tbody tr{display:block;border:1px solid #eef0f6;border-radius:12px;padding:9px 12px;margin-bottom:10px;background:#fafbfe}
  .ztab td{display:flex;justify-content:space-between;gap:12px;border:none;padding:4px 0;font-size:13.5px;white-space:normal}
  .ztab td::before{content:attr(data-l);font-weight:700;color:#8a90a5;flex:none}
}

/* ------- dokumenty (stránka) ------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid #d9ddea;background:#fff;border-radius:999px;padding:7px 15px;font-size:13px;font-weight:700;color:#3c4257}
.chip.on{background:var(--ind);border-color:var(--ind);color:#fff}
.dsearch{position:relative;margin-bottom:14px}
.dsearch input{border:1px solid #d9ddea;border-radius:11px;padding:12px 14px 12px 42px;background:#fff}
.dsearch svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:#8a90a5}
.dcount{font-size:12.5px;color:var(--mut);margin:12px 0 4px}

/* ------- kontakty (stránka) ------- */
.vcard{display:flex;gap:13px;align-items:flex-start}
.ava{width:46px;height:46px;flex:none;border-radius:50%;background:#eceffb;color:var(--ind);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
.vcard h3{font-size:15.5px;font-weight:800}
.vcard p{font-size:13px;color:var(--mut);margin:2px 0 6px}
.vcard a{font-weight:700;text-decoration:none;font-size:14px}
.hav{border-top:4px solid var(--ind)}
.hav.b-voda{border-top-color:#2f80ed}
.hav.b-ele{border-top-color:#f2c94c}
.hav.b-vyt{border-top-color:#7b61ff}
.hav.b-plyn{border-top-color:#f2994a}
.hav small{display:block;font-size:12px;font-weight:700;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.hav h3{font-size:16px;font-weight:800;margin-bottom:8px}
.hav a.tel{font-size:22px;font-weight:800;color:var(--ink);text-decoration:none;white-space:nowrap}
.hav p{font-size:13px;color:var(--mut);margin:7px 0 0}
.mapwrap{padding:0;overflow:hidden}
.mapwrap iframe{width:100%;border:0;display:block}
.mapfoot{padding:14px 20px;font-size:13.5px;color:var(--mut)}

/* ------- patička ------- */
.foot{background:#1d2233;color:#c6cadb;margin-top:14px;padding:38px 20px 30px}
.fin{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
.foot h3{color:#fff;font-size:14px;font-weight:800;margin-bottom:12px}
.foot p{font-size:13.5px;margin:0 0 .7em}
.foot a{color:#c6cadb;text-decoration:none;display:block;padding:3px 0;font-size:13.5px}
.foot a:hover{color:#fff}
.fsub{max-width:1280px;margin:28px auto 0;border-top:1px solid rgba(255,255,255,.12);padding-top:16px;font-size:12.5px;color:#8a90a5}
@media(max-width:760px){.fin{grid-template-columns:1fr}}

/* ------- mobilní tab-bar ------- */
.tabbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(29,34,51,.09);height:62px}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;font-weight:700;color:#8a90a5;text-decoration:none;min-width:0}
.tabbar a svg{width:21px;height:21px;stroke:#8a90a5}
.tabbar a.on{color:var(--ind)}
.tabbar a.on svg{stroke:var(--ind)}

@media(max-width:900px){
  .side{display:none}
  .tabbar{display:flex}
  body{padding-bottom:64px}
  .app{padding:18px 14px 30px;gap:0}
  .grid{gap:14px}
  .card{padding:17px}
}