/*
================================================================
STUDIJNÍ KOMENTÁŘ – wwwroot/css/site.css
----------------------------------------------------------------
Tento soubor řídí vizuální podobu celé aplikace.

Jak CSS číst:
 - :root obsahuje proměnné, např. --blue nebo --radius. Když změníš
   proměnnou, změní se barva/zaoblení na více místech najednou.
 - .sidebar, .topbar, .card tvoří základní layout aplikace.
 - .incidents-table je společná tabulka pro hlavní grid i výsledky hledání.
 - .badge jsou barevné štítky stavu, typu, místa a závažnosti.
 - @media(max-width:850px) upravuje rozložení pro užší obrazovky.

Důležité: CSS neřeší data ani validaci. Pouze říká, jak mají prvky vypadat.
================================================================
*/


:root{
  --blue:#0f7aa8;
  --blue2:#0b5f86;
  --bg:#eef3f7;
  --card:#ffffff;
  --topbar:#f7fbff;
  --topbar-line:#dce8f3;
  --text:#172033;
  --muted:#6b7280;
  --line:#dbe7f0;
  --shadow:0 16px 40px rgba(15, 95, 134, .12);
  --shadow-soft:0 10px 26px rgba(15, 95, 134, .09);
  --radius:18px;
}
*{box-sizing:border-box;font-weight:400}
strong,b{font-weight:400}
body{margin:0;font-family:Aptos,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit}.app-shell{display:grid;grid-template-columns:240px minmax(0,1fr);gap:22px;min-height:100vh;background:var(--bg);padding:22px}.sidebar{background:linear-gradient(180deg,var(--blue),var(--blue2));color:white;padding:24px 18px;border-radius:var(--radius);box-shadow:var(--shadow);align-self:start;min-height:calc(100vh - 44px);position:sticky;top:22px}.brand-small{font-size:26px;letter-spacing:.08em;margin-bottom:28px}.sidebar nav{display:flex;flex-direction:column;gap:8px}.sidebar a{color:white;text-decoration:none;padding:12px 14px;border-radius:14px}.sidebar a:hover{background:rgba(255,255,255,.18)}.main{min-width:0}.topbar{min-height:68px;background:var(--topbar);display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-radius:var(--radius);box-shadow:var(--shadow-soft);border:1px solid var(--topbar-line);position:sticky;top:22px;z-index:10}.app-title{font-size:22px}.user-area{display:flex;align-items:center;gap:14px}.content{padding:22px 0 0}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;margin-bottom:22px}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.toolbar h1,.card h1{margin:0 0 8px}.btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:12px;padding:10px 14px;text-decoration:none;cursor:pointer;margin-left:6px}.btn-primary{background:var(--blue);color:white;box-shadow:0 10px 22px rgba(15,122,168,.18)}.btn-primary:hover{background:var(--blue2)}.btn-outline{background:#e8f6fb;color:var(--blue)}.link-button{background:transparent;border:0;color:var(--blue);cursor:pointer}.table-card{overflow:auto}.incidents-table{width:100%;border-collapse:separate;border-spacing:0}.incidents-table th,.incidents-table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.incidents-table th{font-size:13px;color:var(--muted);background:#f8fafc}.incidents-table tr{cursor:pointer}.incidents-table tr:hover,.incidents-table tr.selected{background:#eaf7fb}.clip{width:34px;text-align:center}.col-description{max-width:420px}.badge{display:inline-block;border-radius:999px;padding:5px 10px;background:#e5e7eb;font-size:12px}.danger{background:#fee2e2;color:#991b1b}.warning{background:#fef3c7;color:#92400e}.success{background:#dcfce7;color:#166534}.purple{background:#ede9fe;color:#5b21b6}.muted{background:#e5e7eb;color:#374151}.detail-head{display:flex;justify-content:space-between;gap:16px}.detail-head h2{margin:0}.detail-head p{color:var(--muted);margin:6px 0}.status-form{display:flex;gap:10px;margin:14px 0 18px;align-items:flex-end;justify-content:flex-start;flex-wrap:wrap}.status-form label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:13px}.status-select{width:auto;min-width:120px;max-width:220px}.record-meta{font-style:italic;color:#6b7280}.record-text{white-space:pre-wrap;line-height:1.55}.attachments{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.attachments a{background:#e8f6fb;padding:7px 10px;border-radius:10px;text-decoration:none;color:var(--blue)}.inline{display:inline}.link-danger{border:0;background:transparent;color:#b91c1c;cursor:pointer}.stack{display:flex;flex-direction:column;gap:12px}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font:inherit;background:white}textarea{resize:vertical}.grid-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.grid-form label input,.grid-form label select,.grid-form label textarea{margin-top:6px}.wide{grid-column:1/-1}.check{display:flex;align-items:center;gap:8px}.check input{width:auto}.actions{display:flex;justify-content:flex-end}.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#e6efff,#f8fafc)}.login-card{width:min(420px,calc(100vw - 32px));background:white;border-radius:24px;box-shadow:var(--shadow);padding:32px;display:flex;flex-direction:column;gap:12px}.login-card h1{margin:0}.login-card p{margin:0 0 10px;color:var(--muted)}.alert{background:#fee2e2;color:#991b1b;padding:10px;border-radius:12px;margin-bottom:16px}.notice{background:#e8f6fb;color:var(--blue2);padding:12px 14px;border-radius:14px;margin-bottom:16px;border:1px solid #cfeaf4}.validation{color:#b91c1c;font-size:13px}.outside-jamu-row{display:none}.form-actions-right{display:flex;justify-content:flex-end}.btn-compact{width:auto}.status-form .btn{width:auto}.phonebook-card{padding:0;overflow:auto}.phonebook-table{width:100%;border-collapse:separate;border-spacing:0}.phonebook-table th,.phonebook-table td{padding:15px 18px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;white-space:nowrap}.phonebook-table th{font-size:13px;color:var(--muted);background:#f8fafc}.phonebook-table a{color:var(--blue);text-decoration:none}.phonebook-table tr:hover{background:#f2fbfe}.contact-name{font-size:17px}.contact-function{font-size:13px;color:var(--muted);margin-top:3px}.admin-edit-table input{min-width:90px}.admin-edit-table input[type=checkbox]{width:auto;min-width:auto}.kop-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px}.kop-list{display:flex;flex-direction:column;gap:8px}.kop-list a{padding:10px 12px;border-radius:12px;text-decoration:none}.kop-list a.active,.kop-list a:hover{background:#e8f6fb;color:var(--blue)}.kop-content{line-height:1.65}.kop-content h1{color:var(--blue)}.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.35);display:grid;place-items:center;z-index:1000}.modal-box{width:min(420px,calc(100vw - 32px));background:white;border-radius:22px;box-shadow:var(--shadow);padding:26px;text-align:center}.modal-box h2{margin:0 0 8px}.modal-box p{color:var(--muted);margin:0 0 18px}@media(max-width:850px){.app-shell{grid-template-columns:1fr;padding:14px}.sidebar{position:static;min-height:auto}.topbar{height:auto;gap:12px;align-items:flex-start;flex-direction:column;padding:16px;top:14px}.grid-form,.kop-layout{grid-template-columns:1fr}.user-area{flex-wrap:wrap}.content{padding-top:14px}}

/* V4 drobné úpravy */
.incidents-table th,
.incidents-table th a,
.phonebook-table th,
.phonebook-table th a{font-weight:600}
.badge.green{background:#dcfce7;color:#166534}
.badge.pink{background:#fce7f3;color:#9d174d}
.badge.blue{background:#d7f0f8;color:#1e40af}
.badge.orange{background:#ffedd5;color:#9a3412}
.badge.yellow{background:#fef3c7;color:#92400e}
.badge.red{background:#fee2e2;color:#991b1b}
.create-incident-page .sidebar,
.create-incident-page .topbar{filter:blur(2.5px);opacity:.72;transition:filter .25s ease,opacity .25s ease}
.create-incident-page .content{position:relative;z-index:20}

/* V5 správa uživatelů a příloh */
.users-admin-table input,
.users-admin-table select{min-width:130px}
.users-admin-table input[type=checkbox]{width:auto;min-width:auto}
.cell-check{justify-content:flex-start}


/* V6 finální drobnosti */
.outside-jamu-badge{margin-left:6px}
input[type="file"]{
  border:1px dashed var(--line);
  background:#f8fbff;
  padding:10px;
  color:var(--muted);
}
input[type="file"]::file-selector-button{
  border:0;
  border-radius:12px;
  padding:9px 14px;
  margin-right:12px;
  background:#e8f6fb;
  color:var(--blue);
  cursor:pointer;
  box-shadow:0 8px 18px rgba(31,79,143,.10);
  font:inherit;
}
input[type="file"]::file-selector-button:hover{
  background:#d7f0f8;
}

/* V7 finální drobnosti */
.record-text a,
.kop-content a {
  color:#1d4ed8;
  text-decoration:underline;
  text-underline-offset:3px;
}
.record-text a:hover,
.kop-content a:hover {
  color:#0f2f75;
}


/* V9 svěží modro-tyrkysové ladění */
.sidebar{background:linear-gradient(180deg,#0f7aa8 0%,#0b5f86 100%);box-shadow:0 18px 38px rgba(15,122,168,.24)}
.topbar{background:var(--topbar);border:1px solid var(--topbar-line);box-shadow:var(--shadow-soft)}
.btn-primary,button[type="submit"].btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover,button[type="submit"].btn-primary:hover{background:var(--blue2)}
.link-button,.phonebook-table a,.kop-list a{color:var(--blue)}
.link-button:hover,.phonebook-table a:hover,.kop-list a:hover{color:var(--blue2)}
.btn-outline:hover,input[type="file"]::file-selector-button:hover{background:#d7f0f8}
.table-card,.card,.phonebook-card{box-shadow:var(--shadow)}

/* V10 stránkování tabulek incidentů */
.pager{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  padding:16px 0 4px;
}
.pager a,
.pager span{
  min-width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  text-decoration:none;
  background:#e8f6fb;
  color:var(--blue);
  border:1px solid #cfeaf4;
}
.pager a:hover{
  background:#d7f0f8;
  color:var(--blue2);
}
.pager .active{
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
}
.pager .disabled{
  opacity:.42;
  cursor:default;
}

/* V12 automatické doplnění a řazení auditních záznamů */
.detail-tools{
  display:flex;
  justify-content:flex-end;
  margin:10px 0 12px;
}
.sort-toggle{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:7px 12px;
  background:#e8f6fb;
  color:var(--blue);
  text-decoration:none;
  border:1px solid #cfeaf4;
}
.sort-toggle:hover{
  background:#d7f0f8;
  color:var(--blue2);
}


/*
V19 pevné šířky vybraných sloupců v gridech incidentů a vyhledávání
----------------------------------------------------------------
Cíl: tabulka má mít stabilní levou a pravou část a pouze popis má pružně
využít zbytek šířky.
 - sloupec s ikonou přílohy má pevnou malou šířku,
 - „Datum a čas“ má pevnou šířku 154 px,
 - „Stav“ má pevnou šířku 136 px,
 - „Místo“, „Typ“ a „Závažnost“ mají také pevnou šířku,
 - „Stručný popis“ nemá pevnou šířku a vezme si zbývající prostor.

Proč pixely, ne znaky:
Různé znaky mají různou šířku: "lll" je mnohem užší než "mmm".
Proto je stabilnější odhad v px.

table-layout: fixed říká prohlížeči, aby šířky sloupců respektoval předvídatelně.
Zkrácení textu řeší overflow:hidden + text-overflow:ellipsis + white-space:nowrap.
Celý text je v Razor view doplněný do atributu title, takže se při najetí myší
zobrazí nativní tooltip prohlížeče.
*/
.incidents-table{
  table-layout:fixed;
}
.incidents-table th.clip,
.incidents-table td.clip{
  width:42px;
  min-width:42px;
  max-width:42px;
  text-align:center;
}

.incidents-table th.col-dbtime,
.incidents-table td.col-dbtime{
  width:132px;
  min-width:132px;
  max-width:132px;
}
.incidents-table td.db-time{
  color:#9ca3af;
  font-size:12px;
}

.incidents-table th.col-date,
.incidents-table td.col-date{
  width:154px;
  min-width:154px;
  max-width:154px;
}
.incidents-table th.col-status,
.incidents-table td.col-status{
  width:136px;
  min-width:136px;
  max-width:136px;
}
.incidents-table th.col-place,
.incidents-table td.col-place{
  width:150px;
  min-width:150px;
  max-width:150px;
}
.incidents-table th.col-type,
.incidents-table td.col-type{
  width:190px;
  min-width:190px;
  max-width:190px;
}
.incidents-table th.col-severity,
.incidents-table td.col-severity{
  width:112px;
  min-width:112px;
  max-width:112px;
}
.incidents-table th.col-user,
.incidents-table td.col-user{
  width:160px;
  min-width:160px;
  max-width:160px;
  text-align:right;
}
/* Stručný popis je jediný pružný sloupec v gridu.
   Necháváme mu zbytek místa; když se nevejde, zkrátí se přes tři tečky. */
.incidents-table th.col-description,
.incidents-table td.col-description{
  width:auto;
  min-width:120px;
  max-width:none;
}
/* Badge uvnitř pevného sloupce nesmí roztáhnout celou tabulku.
   Proto má max-width:100%, overflow:hidden a text-overflow:ellipsis. */
.incidents-table td.col-status .badge,
.incidents-table td.col-place .badge,
.incidents-table td.col-type .badge,
.incidents-table td.col-severity .badge{
  display:inline-block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  vertical-align:middle;
}
.incidents-table th.col-dbtime a,
.incidents-table th.col-date a,
.incidents-table th.col-status a,
.incidents-table th.col-place a,
.incidents-table th.col-type a,
.incidents-table th.col-severity a{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/*
V17 sjednocení vzhledu KOP s aplikací
   KOP HTML soubory se vkládají bez vlastních <style>/<head>/<body> bloků,
   aby jejich CSS nepřebíjelo topbar, sidebar ani nadpisy aplikace. */
.kop-content{
  font-family:Aptos,Segoe UI,Arial,sans-serif;
  color:var(--text);
  line-height:1.65;
}
.kop-content h1{
  margin:0 0 16px;
  color:var(--text);
  font-size:26px;
  line-height:1.2;
  font-weight:400;
}
.kop-content h2{
  margin:24px 0 8px;
  color:var(--blue2);
  font-size:18px;
  line-height:1.3;
  font-weight:400;
}
.kop-content p{
  margin:10px 0;
}
.kop-content .kop-note{
  margin-top:18px;
  padding:13px 16px;
  border-left:4px solid var(--blue);
  background:#f4fbff;
  border-radius:12px;
}

/*
V20 Safari fix – sjednocení výšky formulářových polí
----------------------------------------------------------------
Safari vykresluje nativní <select> prvky nižší než běžná textová pole.
Tato pravidla sjednocují výšku inputů a roletek napříč Chrome/Safari
bez zásahu do checkboxů, file inputů a textarea.
*/
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select {
  min-height:46px;
  height:46px;
  line-height:20px;
  padding:11px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background-color:#fff;
  color:var(--text);
  font:inherit;
  box-sizing:border-box;
}

select {
  -webkit-appearance:none;
  appearance:none;
  padding-right:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M5.5 7.5 10 12l4.5-4.5 1.1 1.1L10 14.2 4.4 8.6z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:14px 14px;
}

select:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
textarea:focus {
  outline:none;
  border-color:#9bd3e7;
  box-shadow:0 0 0 4px rgba(15,122,168,.10);
}

textarea {
  min-height:120px;
  line-height:1.45;
  padding:12px 14px;
}

/* Kompaktní selecty v detailu incidentu mají mít stejnou výšku jako ostatní pole,
   ale ne přes celou obrazovku. */
.status-form select,
.status-select {
  width:auto;
  min-width:120px;
  max-width:220px;
}

/* Safari má u selectu někdy vlastní optické odsazení; tohle drží text uprostřed. */
@supports (-webkit-touch-callout: none) {
  select {
    padding-top:0;
    padding-bottom:0;
    line-height:46px;
  }
}

/* V24 – rozložení formuláře Nový incident: hlavní výběry pod Datum a čas, checkbox mimo objekt vedle Místa. */
.incident-create-form .form-narrow{grid-column:1/2}
.incident-create-form .outside-inline-check{grid-column:2/3;align-self:end;min-height:42px;margin-bottom:1px}
.incident-create-form .outside-jamu-row{display:none}
@media(max-width:850px){.incident-create-form .form-narrow,.incident-create-form .outside-inline-check{grid-column:1/-1}.incident-create-form .outside-inline-check{align-self:auto;min-height:auto;margin-bottom:0}}

/* V27 drobné UI úpravy: rozmazané pozadí modalu vyhledávání a iniciály kontaktů */
.search-no-results-page .sidebar,
.search-no-results-page .topbar,
.search-no-results-page .search-page-underlay{
  filter:blur(2.5px);
  opacity:.72;
  transition:filter .25s ease,opacity .25s ease;
}
.search-no-results-page .modal-backdrop{
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}
.contact-person{
  display:flex;
  align-items:center;
  gap:12px;
}
.contact-avatar{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#d7f0f8,#e8f6fb);
  color:var(--blue2);
  font-size:13px;
  letter-spacing:.03em;
  border:1px solid #cfeaf4;
  box-shadow:0 8px 18px rgba(15,122,168,.10);
}


/* V31 – kompaktní grid pro notebooky: užší sidebar, DB time na dva řádky, bez sloupce „Kdo zadal“. */
.app-shell{
  grid-template-columns:140px minmax(0,1fr);
  gap:18px;
  padding:20px;
}
.sidebar{
  padding:24px 12px;
  min-height:calc(100vh - 40px);
  top:20px;
}
.sidebar a{
  padding:11px 10px;
}
.topbar{
  top:20px;
}
.card{
  padding:20px;
}
.table-card{
  overflow:auto;
}
.incidents-table th,
.incidents-table td{
  padding:9px 8px;
}
.incidents-table th.clip,
.incidents-table td.clip{
  width:30px;
  min-width:30px;
  max-width:30px;
  padding-left:2px;
  padding-right:2px;
}
.incidents-table th.col-dbtime,
.incidents-table td.col-dbtime{
  width:78px;
  min-width:78px;
  max-width:78px;
  padding-left:2px;
  padding-right:4px;
  white-space:normal;
  line-height:1.15;
}
.incidents-table td.db-time{
  color:#9ca3af;
  font-size:11px;
}
.incidents-table td.db-time span{
  display:block;
}
.incidents-table th.col-dbtime a{
  white-space:nowrap;
  line-height:1.05;
}
.incidents-table th.col-date,
.incidents-table td.col-date{
  width:136px;
  min-width:136px;
  max-width:136px;
}
.incidents-table th.col-status,
.incidents-table td.col-status{
  width:106px;
  min-width:106px;
  max-width:106px;
}
.incidents-table th.col-place,
.incidents-table td.col-place{
  width:136px;
  min-width:136px;
  max-width:136px;
}
.incidents-table th.col-type,
.incidents-table td.col-type{
  width:168px;
  min-width:168px;
  max-width:168px;
}
.incidents-table th.col-severity,
.incidents-table td.col-severity{
  width:98px;
  min-width:98px;
  max-width:98px;
}
.incidents-table th.col-description,
.incidents-table td.col-description{
  min-width:220px;
}
.incident-author{
  color:#98a2b3;
  font-style:italic;
  font-weight:400;
}
@media(max-width:850px){
  .app-shell{grid-template-columns:1fr;padding:14px;gap:14px}
  .sidebar{position:static;min-height:auto;padding:18px 14px}
  .topbar{top:14px}
}

/* V33 – hlavička Incidenty + filtr a roztahovatelné šířky sloupců */
.incidents-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.title-filter-row{
  display:flex;
  align-items:center;
  gap:22px;
  min-width:0;
}
.title-filter-row h1{
  margin:0;
}
.invalid-filter-form{
  margin:0;
}
.invalid-filter{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#5f6b7a;
  font-size:0.95rem;
  white-space:nowrap;
  user-select:none;
}
.invalid-filter input{
  width:auto;
  min-height:auto;
  height:auto;
  margin:0;
}

.incidents-table col.col-clip{width:30px}
.incidents-table col.col-dbtime{width:78px}
.incidents-table col.col-date{width:136px}
.incidents-table col.col-status{width:106px}
.incidents-table col.col-place{width:136px}
.incidents-table col.col-type{width:168px}
.incidents-table col.col-severity{width:98px}
.incidents-table col.col-description{width:auto}

.incidents-table th.resizable-th{
  position:relative;
  padding-right:14px;
}
.column-resize-handle{
  position:absolute;
  top:8px;
  right:0;
  width:8px;
  height:calc(100% - 16px);
  cursor:col-resize;
  border-radius:999px;
  opacity:0;
  background:#cfeaf4;
  transition:opacity .15s ease, background .15s ease;
  z-index:2;
}
.incidents-table th.resizable-th:hover .column-resize-handle,
.column-resize-handle:hover{
  opacity:.85;
}
body.is-resizing-column{
  cursor:col-resize;
  user-select:none;
}
body.is-resizing-column *{
  cursor:col-resize !important;
}

@media(max-width:850px){
  .incidents-toolbar,
  .title-filter-row{
    align-items:flex-start;
  }
  .incidents-toolbar{
    flex-direction:column;
  }
  .title-filter-row{
    flex-direction:column;
    gap:8px;
  }
}
/* U roztahovatelných tabulek řídí šířky <colgroup>, ne pevné width/min/max na buňkách. */
.incidents-table.resizable-grid th.clip,
.incidents-table.resizable-grid td.clip,
.incidents-table.resizable-grid th.col-dbtime,
.incidents-table.resizable-grid td.col-dbtime,
.incidents-table.resizable-grid th.col-date,
.incidents-table.resizable-grid td.col-date,
.incidents-table.resizable-grid th.col-status,
.incidents-table.resizable-grid td.col-status,
.incidents-table.resizable-grid th.col-place,
.incidents-table.resizable-grid td.col-place,
.incidents-table.resizable-grid th.col-type,
.incidents-table.resizable-grid td.col-type,
.incidents-table.resizable-grid th.col-severity,
.incidents-table.resizable-grid td.col-severity,
.incidents-table.resizable-grid th.col-description,
.incidents-table.resizable-grid td.col-description{
  width:auto;
  min-width:0;
  max-width:none;
}

/* V35 – Servisní činnosti a bezpečnější přílohy */
.badge.gray{background:#e5e7eb;color:#374151}
.badge.teal{background:#ccfbf1;color:#115e59}
.badge.cyan{background:#cffafe;color:#155e75}
.badge.lime{background:#ecfccb;color:#3f6212}
.badge.brown{background:#f5e6d3;color:#7c2d12}
.service-filter-card{margin-bottom:18px}
.service-table th.col-user,
.service-table td.col-user{text-align:left}
.file-help{display:block;margin-top:6px;color:var(--muted);font-size:13px;line-height:1.35}

/* V36 – kompaktní vyhledávání servisních činností a skrytí pole mimo objekt */
.service-search-panel{margin-bottom:12px;padding:0;overflow:hidden}
.service-search-panel summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;
  color:var(--text);
}
.service-search-panel summary::-webkit-details-marker{display:none}
.service-search-panel summary span{font-weight:600}
.service-search-panel summary small{color:var(--muted);font-size:13px;font-weight:400}
.service-search-panel summary::before{content:'▸';color:var(--primary);font-size:15px;transition:transform .18s ease}
.service-search-panel[open] summary::before{transform:rotate(90deg)}
.service-search-panel form{padding:0 16px 16px 16px}
.compact-service-search{gap:10px}
.outside-jamu-field{transition:opacity .18s ease}


/* V37 – sjednocení ovládacích prvků, formulářů a validačních hlášek */
.validation-summary-valid,
.validation-summary:empty,
.alert:empty{display:none!important}

.toolbar,
.incidents-toolbar,
.detail-head,
.form-actions-right,
.actions{
  gap:12px;
}
.toolbar{
  align-items:center;
}
.toolbar h1,
.card h1{
  line-height:1.2;
}

.btn{
  min-height:42px;
  padding:10px 16px;
  border-radius:12px;
  justify-content:center;
  line-height:1.2;
  white-space:nowrap;
}
.btn-compact{min-height:40px}
.btn + .btn{margin-left:4px}

input,select,textarea{
  min-height:42px;
  line-height:1.25;
}
textarea{min-height:auto}
.grid-form label,
.stack label,
.status-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#344054;
  font-size:14px;
}
.grid-form label input,
.grid-form label select,
.grid-form label textarea{
  margin-top:0;
}
.check,
.invalid-filter,
.outside-inline-check,
.cell-check{
  flex-direction:row!important;
  align-items:center!important;
  gap:8px!important;
}
.check input,
.invalid-filter input,
.outside-inline-check input,
.cell-check input,
input[type="checkbox"]{
  width:auto;
  min-height:auto;
  height:auto;
  margin:0;
}
.form-card .actions,
.form-actions-right,
.actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}
.status-form{
  background:#f8fbff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
}
.status-form select,
.status-select{
  min-width:180px;
}
.table-card{padding:0}
.table-card .pager{padding:16px}
.incidents-table th,
.phonebook-table th{vertical-align:middle}
.incidents-table td,
.phonebook-table td{vertical-align:middle}

.filter-panel{margin-bottom:12px;padding:0;overflow:hidden}
.filter-panel summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 16px;
  color:var(--text);
}
.filter-panel summary::-webkit-details-marker{display:none}
.filter-panel summary span{font-weight:600}
.filter-panel summary small{color:var(--muted);font-size:13px;font-weight:400}
.filter-panel summary::before{content:'▸';color:var(--blue);font-size:15px;transition:transform .18s ease}
.filter-panel[open] summary::before{transform:rotate(90deg)}
.filter-panel form{padding:0 16px 16px 16px}
.filter-form{gap:10px}
.filter-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.filter-actions .btn{margin-left:0}
.service-search-panel summary::before{color:var(--blue)}

@media(max-width:850px){
  .toolbar,.incidents-toolbar,.detail-head{align-items:flex-start;flex-direction:column}
  .actions,.form-actions-right,.filter-actions{justify-content:flex-start}
  .btn{width:100%;margin-left:0}
  .status-form{align-items:stretch}
  .status-form label,.status-form button{width:100%}
}

/*
V38 – zkušební flat styl podle IS JAMU + jemné oranžové bezpečnostní pozadí
----------------------------------------------------------------
Tato verze je čistě vizuální prototyp. Nemění logiku aplikace.
Cíl:
 - plošší, ostřejší a systémovější vzhled,
 - méně stínů a zaoblení,
 - tmavě modrá jako hlavní systémová barva,
 - oranžová jako bezpečnostní akcent,
 - pozadí z KOP grafiky jen jemně, aby nerušilo čitelnost.
*/
:root{
  --blue:#003b7a;
  --blue2:#002e60;
  --orange:#f47b20;
  --orange-soft:#fff3e8;
  --bg:#f5f7fa;
  --card:#ffffff;
  --topbar:#ffffff;
  --topbar-line:#d7dde5;
  --text:#162033;
  --muted:#667085;
  --line:#d9dee7;
  --shadow:none;
  --shadow-soft:none;
  --radius:2px;
}

html{min-height:100%}
body{
  background-color:var(--bg);
  background-image:
    linear-gradient(rgba(245,247,250,.90),rgba(245,247,250,.90)),
    url('/img/kop-orange-background.png');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
}

.app-shell{
  background:transparent;
  grid-template-columns:172px minmax(0,1fr);
  gap:18px;
  padding:18px;
}

.sidebar{
  background:rgba(255,255,255,.92)!important;
  color:var(--blue)!important;
  border-radius:0;
  box-shadow:none!important;
  border-right:1px solid var(--line);
  border-top:4px solid var(--blue);
  min-height:calc(100vh - 36px);
  padding:22px 12px;
}
.sidebar nav{gap:2px}
.sidebar a{
  color:var(--blue)!important;
  border-radius:0;
  padding:11px 12px;
  border-left:3px solid transparent;
  letter-spacing:.01em;
}
.sidebar a:hover{
  background:#eef3f8!important;
  color:var(--blue2)!important;
  border-left-color:var(--orange);
}

.topbar{
  background:rgba(255,255,255,.94);
  border-radius:0;
  border:1px solid var(--line);
  border-top:4px solid var(--blue);
  box-shadow:none!important;
  min-height:58px;
}
.app-title{
  color:var(--blue);
  letter-spacing:.02em;
}
.content{padding-top:18px}

.card,
.table-card,
.phonebook-card,
.filter-panel,
.service-search-panel,
.modal-box,
.login-card{
  border-radius:0!important;
  box-shadow:none!important;
  border:1px solid var(--line);
  background:rgba(255,255,255,.96);
}
.card{padding:20px}
.toolbar h1,
.card h1,
.detail-head h2,
.kop-content h1{
  color:var(--blue);
}

.btn{
  border-radius:0!important;
  box-shadow:none!important;
  border:1px solid transparent;
  min-height:40px;
}
.btn-primary,
button[type="submit"].btn-primary{
  background:var(--blue)!important;
  color:#fff!important;
  border-color:var(--blue)!important;
}
.btn-primary:hover,
button[type="submit"].btn-primary:hover{
  background:var(--blue2)!important;
  border-color:var(--blue2)!important;
}
.btn-outline{
  background:#fff!important;
  color:var(--blue)!important;
  border-color:var(--blue)!important;
}
.btn-outline:hover{
  background:#eef3f8!important;
}
.link-button,
.phonebook-table a,
.kop-list a{
  color:var(--blue)!important;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea,
input,
select,
textarea{
  border-radius:0!important;
  border-color:var(--line);
  background:#fff;
}
select:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
textarea:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(0,59,122,.10);
}
input[type="file"]{
  border-radius:0!important;
  background:#fff;
  border:1px dashed #aeb7c4;
}
input[type="file"]::file-selector-button{
  border-radius:0!important;
  background:#eef3f8;
  color:var(--blue);
  box-shadow:none;
  border:1px solid var(--line);
}

.incidents-table{border-collapse:collapse;border-spacing:0}
.incidents-table th,
.phonebook-table th{
  background:#f0f3f7!important;
  color:#344054;
  border-bottom:2px solid var(--blue);
}
.incidents-table td,
.phonebook-table td{
  border-bottom:1px solid var(--line);
}
.incidents-table tr:hover,
.incidents-table tr.selected,
.phonebook-table tr:hover{
  background:#fff7ef!important;
}
.column-resize-handle{
  background:var(--orange);
  border-radius:0;
}

.badge{
  border-radius:0!important;
  border:1px solid rgba(0,0,0,.06);
  padding:4px 8px;
}
.badge.orange,
.warning{
  background:var(--orange-soft)!important;
  color:#a34b00!important;
}

.filter-panel summary,
.service-search-panel summary{
  border-left:4px solid var(--orange);
  background:#fff;
}
.filter-panel summary::before,
.service-search-panel summary::before{
  color:var(--orange)!important;
}
.status-form{
  border-radius:0!important;
  background:#f8fafc;
  border-left:4px solid var(--orange);
}
.notice{
  border-radius:0!important;
  background:#eef3f8;
  color:var(--blue);
  border-color:#cbd5e1;
}
.alert{
  border-radius:0!important;
  background:#fff1f2;
  border:1px solid #fecdd3;
}
.pager a,
.pager span{
  border-radius:0!important;
  background:#fff;
  color:var(--blue);
  border-color:var(--line);
}
.pager .active{
  background:var(--blue)!important;
  border-color:var(--blue)!important;
  color:#fff!important;
}

.kop-list a{
  border-radius:0!important;
  border-left:3px solid transparent;
}
.kop-list a.active,
.kop-list a:hover{
  background:#fff7ef!important;
  border-left-color:var(--orange);
}
.kop-content .kop-note{
  border-radius:0!important;
  border-left-color:var(--orange);
  background:#fff7ef;
}
.contact-avatar{
  border-radius:0!important;
  background:#eef3f8;
  color:var(--blue);
  box-shadow:none;
}

.login-page{
  background-image:
    linear-gradient(rgba(245,247,250,.88),rgba(245,247,250,.88)),
    url('/img/kop-orange-background.png');
  background-size:cover;
  background-position:center;
}
.login-card{
  border-top:4px solid var(--blue);
}

@media(max-width:850px){
  .app-shell{grid-template-columns:1fr;padding:12px;gap:12px}
  .sidebar{min-height:auto;border-right:1px solid var(--line)}
  .topbar{top:12px}
  body{background-attachment:scroll}
}

/*
V39 – doladění flat IS stylu
---------------------------
Čistě vizuální oprava:
 - přihlašovací inputy a tlačítko mají stejnou šířku a osu,
 - položky levého menu i topbaru jsou vertikálně centrované,
 - oranžové pozadí je o něco viditelnější, ale pracovní panely zůstávají čitelné.
*/
*,*::before,*::after{box-sizing:border-box}

body{
  background-image:
    linear-gradient(rgba(245,247,250,.78),rgba(245,247,250,.78)),
    url('/img/kop-orange-background.png')!important;
}

.app-shell{
  grid-template-columns:190px minmax(0,1fr);
}

.sidebar nav{
  display:flex;
  flex-direction:column;
  gap:0;
}
.sidebar a{
  display:flex;
  align-items:center;
  min-height:44px;
  line-height:1.2;
  white-space:nowrap;
  margin:0;
}

.topbar{
  display:flex;
  align-items:center;
  min-height:62px;
  padding-top:0;
  padding-bottom:0;
}
.user-area{
  display:flex;
  align-items:center;
  gap:12px;
}
.user-area form{
  margin:0;
  display:flex;
  align-items:center;
}
.topbar .btn,
.user-area .btn{
  margin-left:0;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.login-page{
  background-image:
    linear-gradient(rgba(245,247,250,.76),rgba(245,247,250,.76)),
    url('/img/kop-orange-background.png')!important;
  background-size:cover;
  background-position:center center;
}
.login-card{
  width:min(462px,calc(100vw - 32px));
  padding:34px;
  gap:12px;
}
.login-card input,
.login-card .btn{
  width:100%;
  margin-left:0!important;
}
.login-card .btn{
  justify-content:center;
  margin-top:2px;
}
.login-card label{
  display:block;
  margin-top:4px;
}

@media(max-width:850px){
  .app-shell{grid-template-columns:1fr}
  .sidebar a{white-space:normal}
}

/*
V40 – oranžová bezpečnostní větev + příprava na jednoduché barevné přepínání
--------------------------------------------------------------------------------
Tato verze používá NATVRDO jednu barevnou variantu – oranžovou.
Je to záměrně nejjednodušší řešení: žádný přepínač v aplikaci, žádné ukládání
nastavení uživatele, pouze CSS proměnné.

Jak přepnout zpět na modrou variantu:
  1) V bloku :root níže najdi část „AKTUÁLNÍ ORANŽOVÁ VARIANTA“.
  2) Zakomentuj oranžové hodnoty.
  3) Odkomentuj blok „MODRÁ VARIANTA IS“.
  4) Ulož site.css a obnov stránku v prohlížeči přes Ctrl+F5.

Důležité:
  - Většina aplikace pořád používá historické proměnné --blue a --blue2.
  - Proto jsou níže schválně přesměrované na --theme-accent a --theme-accent-dark.
  - Díky tomu není potřeba přepisovat všechny starší selektory v CSS.
*/
:root{
  /* AKTUÁLNÍ ORANŽOVÁ VARIANTA – bezpečnostní barva JAMU */
  --theme-accent:#f47b20;
  --theme-accent-dark:#c75300;
  --theme-accent-soft:#fff3e8;
  --theme-accent-hover:#fff7ef;

  /* MODRÁ VARIANTA IS – pro návrat ke konzervativnímu IS vzhledu odkomentuj:
  --theme-accent:#003b7a;
  --theme-accent-dark:#002e60;
  --theme-accent-soft:#eef3f8;
  --theme-accent-hover:#f4f7fb;
  */

  --blue:var(--theme-accent);
  --blue2:var(--theme-accent-dark);
  --orange:#f47b20;
  --orange-soft:var(--theme-accent-soft);
  --topbar-line:#e6a06b;
}

body{
  /* Pozadí je viditelnější než ve V39, ale karty/tabulky zůstávají bílé kvůli čitelnosti. */
  background-image:
    linear-gradient(rgba(245,247,250,.66),rgba(245,247,250,.66)),
    url('/img/kop-orange-background.png')!important;
}

.login-page{
  background-image:
    linear-gradient(rgba(245,247,250,.62),rgba(245,247,250,.62)),
    url('/img/kop-orange-background.png')!important;
}

/* Sjednocení horní kostry všech hlavních stránek – Servisní činnosti už nesmí opticky ujíždět. */
.app-shell{
  align-items:start;
}
.main{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.topbar{
  flex:0 0 auto;
  margin:0!important;
  top:18px;
  border-top-color:var(--theme-accent)!important;
}
.content{
  padding-top:18px!important;
}
.content > .toolbar:first-child,
.content > .incidents-toolbar:first-child{
  margin-top:0!important;
}
.toolbar,
.incidents-toolbar{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.toolbar h1,
.incidents-toolbar h1{
  margin:0!important;
  line-height:1.15;
}

.sidebar{
  border-top-color:var(--theme-accent)!important;
}
.sidebar a:hover{
  background:var(--theme-accent-hover)!important;
  border-left-color:var(--theme-accent)!important;
}

.card,
.table-card,
.phonebook-card,
.filter-panel,
.service-search-panel,
.modal-box,
.login-card{
  background:rgba(255,255,255,.965)!important;
}

.btn-primary,
button[type="submit"].btn-primary,
.pager .active{
  background:var(--theme-accent)!important;
  border-color:var(--theme-accent)!important;
  color:#fff!important;
}
.btn-primary:hover,
button[type="submit"].btn-primary:hover{
  background:var(--theme-accent-dark)!important;
  border-color:var(--theme-accent-dark)!important;
}
.btn-outline{
  color:var(--theme-accent)!important;
  border-color:var(--theme-accent)!important;
}
.btn-outline:hover,
.pager a:hover,
.sort-toggle:hover,
input[type="file"]::file-selector-button:hover{
  background:var(--theme-accent-soft)!important;
}

.app-title,
.toolbar h1,
.card h1,
.detail-head h2,
.kop-content h1,
.link-button,
.phonebook-table a,
.kop-list a,
.attachments a,
.sort-toggle,
.pager a,
.pager span{
  color:var(--theme-accent)!important;
}

.incidents-table th,
.phonebook-table th{
  border-bottom-color:var(--theme-accent)!important;
}
.incidents-table tr:hover,
.incidents-table tr.selected,
.phonebook-table tr:hover{
  background:var(--theme-accent-hover)!important;
}

.filter-panel summary,
.service-search-panel summary,
.status-form{
  border-left-color:var(--theme-accent)!important;
}
.filter-panel summary::before,
.service-search-panel summary::before{
  color:var(--theme-accent)!important;
}

select:focus,
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
textarea:focus{
  border-color:var(--theme-accent)!important;
  box-shadow:0 0 0 3px rgba(244,123,32,.16)!important;
}
input[type="file"]::file-selector-button{
  color:var(--theme-accent)!important;
}

.login-card{
  border-top-color:var(--theme-accent)!important;
}

.column-resize-handle{
  background:var(--theme-accent)!important;
}

/*
V41 – finální sjednocení levého menu / toolbaru
------------------------------------------------
Důvod: ve starších CSS vrstvách se postupně přepisovaly hodnoty pro sidebar
z více verzí aplikace. Výsledkem bylo drobné optické poskakování položek menu
mezi stránkami Incidenty / Servisní činnosti / Kontakty / KOP.

Tento blok musí zůstat až na konci site.css. Neposouvá jednotlivé stránky,
ale sjednocuje celý levý navigační panel jednou pevnou sadou pravidel.
*/
.app-shell > .sidebar{
  width:190px!important;
  min-width:190px!important;
  padding:0!important;
  margin:0!important;
  top:18px!important;
  align-self:start!important;
  display:block!important;
}

.app-shell > .sidebar > nav{
  width:100%!important;
  margin:0!important;
  padding:31px 0 0 0!important;
  display:grid!important;
  grid-auto-rows:48px!important;
  row-gap:0!important;
  align-items:stretch!important;
}

.app-shell > .sidebar > nav > a{
  box-sizing:border-box!important;
  width:100%!important;
  height:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  margin:0!important;
  padding:0 20px 0 26px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  line-height:1!important;
  position:static!important;
  top:auto!important;
  transform:none!important;
  border-left:4px solid transparent!important;
  border-top:0!important;
  border-right:0!important;
  border-bottom:0!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}

.app-shell > .sidebar > nav > a:hover,
.app-shell > .sidebar > nav > a:focus{
  border-left-color:var(--theme-accent)!important;
  outline:none!important;
}

.app-shell > .main > .topbar{
  margin:0!important;
  top:18px!important;
}

@media(max-width:850px){
  .app-shell > .sidebar{
    width:auto!important;
    min-width:0!important;
    top:auto!important;
  }
  .app-shell > .sidebar > nav{
    padding:12px 0!important;
  }
  .app-shell > .sidebar > nav > a{
    white-space:normal!important;
  }
}

/*
V42 – KOP sjednocení do oranžové + grafické pozadí
--------------------------------------------------
Tento blok sjednocuje vzhled krizových operačních postupů s oranžovou
bezpečnostní větví aplikace. První <h1> v KOP HTML souboru zůstává zachován,
protože z něj aplikace dál bere název položky v levém menu KOP.
*/
.kop-layout{
  align-items:start;
}

.kop-list.card,
.kop-content.card{
  background:rgba(255,255,255,.965)!important;
}

.kop-list h1{
  color:var(--theme-accent)!important;
  margin:0 0 10px 0!important;
}

.kop-list a{
  color:var(--theme-accent)!important;
  border-left:4px solid transparent!important;
  padding:12px 14px!important;
}

.kop-list a.active,
.kop-list a:hover{
  background:var(--theme-accent-soft)!important;
  border-left-color:var(--theme-accent)!important;
}

.kop-content{
  position:relative;
  overflow:hidden;
  padding:28px 30px!important;
  border-top:4px solid var(--theme-accent)!important;
  background:
    linear-gradient(rgba(255,251,247,.90),rgba(255,251,247,.92)),
    url('/img/kop-orange-background.png') no-repeat right bottom / cover !important;
}

.kop-content h1{
  color:var(--theme-accent-dark)!important;
  font-size:2rem;
  line-height:1.12;
  margin:0 0 1rem 0!important;
  padding-bottom:.55rem;
  border-bottom:2px solid rgba(244,123,32,.85);
}

.kop-content h2{
  color:var(--theme-accent-dark)!important;
  font-size:1.05rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
  margin:1.5rem 0 .45rem 0;
}

.kop-content p,
.kop-content li{
  color:#3a2a20;
}

.kop-content ul{
  margin:.5rem 0 .85rem 1.3rem;
  padding:0;
}

.kop-content .kop-note,
.kop-content .kop-alert{
  margin-top:1.15rem;
  padding:1rem 1.05rem;
  border-radius:0!important;
}

.kop-content .kop-note{
  border-left:5px solid var(--theme-accent)!important;
  background:var(--theme-accent-soft)!important;
}

.kop-content .kop-alert{
  border-left:5px solid #cf3f1c!important;
  background:#fff1ed!important;
}

/*
V47 – logo aplikace + sjednocení filtrů servisních činností
-----------------------------------------------------------
- Servisní činnosti používají stejný blok akčních tlačítek filtrů jako Incidenty.
- Do aplikace je doplněné logo s výstražným symbolem: login, topbar a favicon.
*/
.app-title-with-logo{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.app-title-icon{
  width:30px;
  height:30px;
  flex:0 0 auto;
  display:block;
}
.app-title-with-logo span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.login-logo-wrap{
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0 0 6px 0;
}
.login-logo{
  width:min(100%,380px);
  height:auto;
  display:block;
  object-fit:contain;
}
.login-card h1{
  text-align:center;
}
.login-card p{
  text-align:center;
}
.service-search-panel .filter-actions{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
.service-search-panel .filter-actions .btn{
  margin-left:0!important;
}
@media(max-width:850px){
  .app-title-icon{width:28px;height:28px}
  .login-logo{width:min(100%,330px)}
  .service-search-panel .filter-actions{justify-content:flex-start!important}
}

/*
V51 – automatické odhlášení + levé menu zarovnané doprava
---------------------------------------------------------
- po 10 minutách nečinnosti zobrazí aplikace modální okno a rozmaže pozadí,
- levý navigační panel má text položek zarovnaný doprava podle interního IS.
Tento blok je záměrně na konci CSS, aby přebil starší vrstvy sidebaru.
*/
.app-shell > .sidebar > nav > a{
  justify-content:flex-end!important;
  text-align:right!important;
  padding:0 24px 0 14px!important;
}

.session-timeout-modal{
  position:fixed;
  inset:0;
  display:none;
  place-items:center;
  background:rgba(15,23,42,.35);
  z-index:3000;
  padding:22px;
}

.session-timeout-modal.is-visible{
  display:grid;
}

.session-timeout-box{
  width:min(460px,calc(100vw - 44px));
  background:#fff;
  border-radius:24px;
  box-shadow:0 24px 70px rgba(15,23,42,.28);
  padding:30px;
  text-align:center;
  border:1px solid rgba(15,122,168,.18);
}

.session-timeout-box h2{
  margin:0 0 10px;
  color:var(--blue2);
  font-size:24px;
}

.session-timeout-box p{
  margin:0 0 22px;
  color:var(--muted);
  line-height:1.5;
}

body.session-timeout-open .app-shell{
  filter:blur(5px);
  pointer-events:none;
  user-select:none;
}

/* Přihlášení přes Microsoft 365 (SSO) na přihlašovací stránce */
.login-divider{
  display:flex;
  align-items:center;
  gap:12px;
  margin:6px 0;
  color:var(--muted);
  font-size:13px;
}
.login-divider::before,
.login-divider::after{
  content:"";
  flex:1;
  height:1px;
  background:var(--line);
}
.btn-sso{
  justify-content:center;
  width:100%;
  margin-left:0;
}