/**
 * Styly pro modul Panel (Dashboard) - OPTIMALIZOVANÁ VERZE
 */

/* ========================================
   CSS PROMĚNNÉ
   ======================================== */
:root {
  --modra: #00adff;
  --oranzova: #ffb345;
  --zelena: #5bcb69;
  --fialova: #af00cd;
  --bg-svetla: #fbfbfb;
  --bg-velmi-svetla: #f8f9fa;
  --okraj-svetly: #e9ecef;
  --okraj-tmavsi: #cdcdcd;
  --padding: 20px;
  --padding-maly: 15px;
  --radius: 8px;
  --radius-maly: 4px;
  --gap: 60px;
  --gap-maly: 30px;
}

/* ========================================
   ZÁKLADNÍ LAYOUT
   ======================================== */
.sluzebky-dovca-modul-panel {
  width: 100%;
  margin-top: 50px;
  padding: 0;
}

.sluzebky-dovca-panel-nadpis {
  font-size: 24px;
  color: #333;
  margin: 0 0 10px 0;
  font-weight: 600;
}

.sluzebky-dovca-panel-horni-sekce {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
  margin-bottom: 10px;
}

/* ========================================
   BOXY
   ======================================== */
.sluzebky-dovca-panel-box {
  background: #fafafa;
  border-radius: var(--radius);
  padding: var(--padding);
  margin-bottom: 10px;
  border: 2px solid;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 24px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

.sluzebky-dovca-panel-box h3 {
  margin: 0 0 15px 0;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}

.sluzebky-dovca-panel-box p {
  margin: 0;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}

.sluzebky-dovca-panel-box p strong {
  color: #333;
  font-weight: 500;
  flex: 1;
}

/* Barevné varianty */
.sluzebky-dovca-panel-box-sluzebni-cesty { border-color: var(--modra); }
.sluzebky-dovca-panel-box-sluzebni-cesty h3 { color: var(--modra); }
.sluzebky-dovca-panel-box-dovolena { border-color: var(--oranzova); }
.sluzebky-dovca-panel-box-dovolena h3 { color: #f57c00; }
.sluzebky-dovca-panel-box-uzivatel { border-color: var(--zelena); }
.sluzebky-dovca-panel-box-uzivatel h3 { color: var(--zelena); }

/* ===== KOREKCE ZAROVNÁNÍ OBSAHU A PATIČKY (DESKTOP) ===== */
.sluzebky-dovca-panel-box-dovolena,
.sluzebky-dovca-panel-box-uzivatel {
  position: relative; /* Nutné pro absolutní pozicování patičky */
  min-height: 280px;
  /*padding-bottom: 85px; /* Vytvoří místo pro absolutně pozicovanou patičku */
}

/* Společné marginy pro sjednocení horního odsazení */
.sluzebky-dovca-panel-rychle-akce,
.sluzebky-dovca-panel-statistiky,
.sluzebky-dovca-panel-auto-info,
.sluzebky-dovca-panel-ceny-form {
  margin: 15px 0 0;
}

/* ========================================
   ČÍSELNÉ HODNOTY
   ======================================== */
[class*="sluzebky-dovca-panel-cislo"] {
  background: #fff;
  padding: 2px 10px;
  border-radius: var(--radius-maly);
  font-weight: 600;
  color: #0034fb;
  border: 1px solid var(--okraj-tmavsi);
  min-width: 60px;
  text-align: right;
  display: inline-block;
}

/* Barevné varianty čísel */
.sluzebky-dovca-panel-cislo-ke-schvaleni {
  background: #edffee;
  color: #2e7d32;
  border-color: #4caf50;
}

.sluzebky-dovca-panel-cislo-k-vyuctovani {
  background: #fff8e3;
  color: #f57c00;
  border-color: var(--oranzova);
}

.sluzebky-dovca-panel-cislo-k-zauctovani {
  background: #fbf1fb;
  color: var(--fialova);
  border-color: #ff78e8;
}

.sluzebky-dovca-panel-cislo-k-dispozici {
  background: #fffbca;
  color: #155724;
  border: 1px solid #ffb100;
}

/* Odkazy v číslech */
a[class*="sluzebky-dovca-panel-cislo"] {
  text-decoration: none !important;
  cursor: pointer;
  transition: transform 0.2s ease;
}

a[class*="sluzebky-dovca-panel-cislo"]:hover {
  transform: scale(1.1);
}

/* ========================================
   FORMULÁŘ CENY
   ======================================== */
.sluzebky-dovca-panel-ceny-form {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.sluzebky-dovca-panel-ceny-grid {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 0;
}

.sluzebky-dovca-panel-ceny-radek {
  display: flex;
  align-items: center;
  padding: 4px 0;
}

.sluzebky-dovca-panel-ceny-popisek {
  flex: 1;
  font-size: 14px;
  color: #333;
}

.sluzebky-dovca-panel-ceny-jednotka {
  width: 50px;
  font-size: 14px;
  color: #333;
  margin-right: 10px;
}

input.sluzebky-dovca-panel-input-cena {
  -moz-appearance: textfield;
  -webkit-appearance: none;
  appearance: none;
  background: #fff;
  border: 1px solid var(--okraj-tmavsi);
  border-radius: var(--radius-maly);
  padding: 2px 8px;
  font: inherit;
  font-size: 14px !important;
  font-weight: 600;
  color: #0034fb;
  text-align: right;
  width: 80px;
  margin: 0;
}

input.sluzebky-dovca-panel-input-cena::-webkit-outer-spin-button,
input.sluzebky-dovca-panel-input-cena::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input.sluzebky-dovca-panel-input-cena:focus {
  outline: none;
  border-color: var(--modra);
  box-shadow: 0 0 0 2px rgba(0, 173, 255, 0.1);
}

/* ========================================
   FOOTER BOXU (DESKTOP)
   ======================================== */
.sluzebky-dovca-panel-box-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 15px var(--padding) var(--padding);
  background: #fafafa;
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 40px;
}

/* Oddělovací linka s odsazením (DESKTOP) */
.sluzebky-dovca-panel-box-footer::before {
  content: '';
  position: absolute;
  top: 0;
  left: var(--padding);
  right: var(--padding);
  height: 0;
  border-top: 1px dashed #d9d9d9;
}

.sluzebky-dovca-panel-box-footer-text {
  font-size: 11px;
  color: #666;
  flex: 1;
}

.sluzebky-dovca-panel-box-footer-button {
  margin-left: 10px;
}

/* ========================================
   ROLE BADGE
   ======================================== */
.sluzebky-dovca-role-badge {
  display: inline-block;
  padding: 4px 15px;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 600;
  margin-left: auto;
  min-width: 80px;
  text-align: center;
}

.sluzebky-dovca-role-badge.reditel { background: #ffa700; color: white; }
.sluzebky-dovca-role-badge.ucetni { background: #fbd2ff; color: #9700bb; }
.sluzebky-dovca-role-badge.zamestnanec { background: #caffcc; color: #155724; }

/* ========================================
   NAVIGACE STATISTIK
   ======================================== */
#statistiky { scroll-margin-top: 15px; }

.sluzebky-dovca-panel-statistiky-sekce {
  margin-top: 30px;
  margin-bottom: 20px;
}

.sluzebky-dovca-panel-statistiky-navigace {
  background: var(--bg-velmi-svetla);
  border: 1px solid var(--okraj-svetly);
  border-radius: 6px;
  padding: 10px 20px;
  margin-bottom: 40px;
}

.sluzebky-dovca-panel-statistiky-form {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.sluzebky-dovca-panel-statistiky-label {
  font-weight: 600;
  color: #333;
  font-size: 14px;
}

.sluzebky-dovca-panel-radio-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #333;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: var(--radius-maly);
  transition: background-color 0.2s ease;
}

.sluzebky-dovca-panel-radio-label:hover { background: var(--okraj-svetly); }
.sluzebky-dovca-panel-radio-label input[type="radio"] { margin: 0; cursor: pointer; }
.sluzebky-dovca-panel-radio-neaktivni { color: #6c757d; cursor: not-allowed; }
.sluzebky-dovca-panel-radio-neaktivni:hover { background: transparent; }

/* ========================================
   FORMULÁŘE A FILTRY
   ======================================== */
.sluzebky-dovca-panel-rok-form input[type="number"],
.sluzebky-dovca-panel-rok-form select,
.sluzebky-dovca-panel-filtr-select,
.sluzebky-dovca-panel-filtr-input {
  padding: 6px 8px;
  border: 1px solid var(--modra);
  border-radius: var(--radius-maly);
  font-size: 14px;
  background-color: #fff;
  height: 34px;
}

.sluzebky-dovca-panel-rok-volba {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
}

.sluzebky-dovca-panel-rok-form {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sluzebky-dovca-panel-rok-form label,
.sluzebky-dovca-panel-filtr-skupina label {
  font-weight: 500;
  color: #333;
  font-size: 14px;
}

.sluzebky-dovca-panel-rok-form input[type="number"] {
  width: 80px;
  text-align: center;
}

.sluzebky-dovca-panel-rok-form select {
  cursor: pointer;
  min-width: 120px;
}

.sluzebky-dovca-panel-filtry-wrapper {
  background: var(--bg-velmi-svetla);
  border: 1px solid var(--okraj-svetly);
  border-radius: 6px;
  padding: 15px 20px;
  margin-bottom: 30px;
}

.sluzebky-dovca-panel-filtry-form {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
}

.sluzebky-dovca-panel-filtr-skupina {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.sluzebky-dovca-panel-filtr-select { min-width: 200px; }
.sluzebky-dovca-panel-filtr-input { width: 80px; text-align: center; }

/* Focus stavy */
.sluzebky-dovca-panel-rok-form input[type="number"]:focus,
.sluzebky-dovca-panel-rok-form select:focus,
.sluzebky-dovca-panel-filtr-select:focus,
.sluzebky-dovca-panel-filtr-input:focus {
  outline: none;
  border-color: #0073aa;
}

/* ========================================
   ANIMACE: DÝCHAJÍCÍ ZÁŘE
   ======================================== */

/* 1. Jediná klíčová animace, která využívá CSS proměnnou pro barvu. */
@keyframes dychajici-zare {
  0%, 100% {
    /* Základní, jemný stín + žádná barevná záře */
    box-shadow: 0 1px 3px rgba(0,0,0,0.05), 0 0 0 0 var(--barva-efektu, transparent);
  }
  50% {
    /* Zvýrazněný stín při "nádechu" + maximální barevná záře */
    box-shadow: 0 2px 8px rgba(0,0,0,0.1), 0 0 8px 4px var(--barva-efektu, transparent);
  }
}

/* 2. Aplikace animace a definice barev pro jednotlivé role.
      Tento kód nahrazuje vaše původní pravidla pro animace. */

body.role-reditel a.sluzebky-dovca-panel-cislo-ke-schvaleni,
body.role-reditel span.sluzebky-dovca-panel-cislo-ke-schvaleni {
  --barva-efektu: rgba(91, 203, 105, 0.3); /* Zelená */
  animation: dychajici-zare 2.5s ease-in-out infinite;
}

body.role-ucetni a.sluzebky-dovca-panel-cislo-k-zauctovani,
body.role-ucetni span.sluzebky-dovca-panel-cislo-k-zauctovani {
  --barva-efektu: rgba(175, 0, 205, 0.1); /* Fialová */
  animation: dychajici-zare 2.5s ease-in-out infinite;
}

body.role-zamestnanec a.sluzebky-dovca-panel-cislo-k-vyuctovani,
body.role-zamestnanec span.sluzebky-dovca-panel-cislo-k-vyuctovani {
  --barva-efektu: rgba(255, 179, 69, 0.3); /* Oranžová */
  animation: dychajici-zare 2.5s ease-in-out infinite;
}


/* ========================================
   RESPONZIVNÍ DESIGN
   ======================================== */
/* Tablet */
@media (min-width: 801px) and (max-width: 1200px) {
  .sluzebky-dovca-panel-horni-sekce {
    grid-template-columns: 1fr 1fr;
    gap: var(--gap-maly);
  }
}

/* Mobil */
@media (max-width: 800px) {
  .sluzebky-dovca-modul-panel { margin: 0; padding: 0 10px; }
  .sluzebky-dovca-panel-nadpis { margin: 0 0 10px 7px; }
  .sluzebky-dovca-panel-horni-sekce {
    grid-template-columns: 1fr;
    gap: var(--gap-maly);
    padding: 0 10px;
  }
  .sluzebky-dovca-panel-box { padding: var(--padding-maly); }
  .sluzebky-dovca-panel-box h3 { font-size: 16px; }
  .sluzebky-dovca-modul-panel [class*="sluzebky-dovca-tlacitko-"] { min-width: 100px !important; }
  .sluzebky-dovca-panel-statistiky-navigace { margin: 0 10px 40px; }
  .sluzebky-dovca-panel-statistiky-form,
  .sluzebky-dovca-panel-rok-form { gap: 10px; }
  .sluzebky-dovca-panel-rok-volba { margin-left: 10px; }
  
  /* OPRAVA PRO MOBILNÍ ZOBRAZENÍ */
  .sluzebky-dovca-panel-box-dovolena,
  .sluzebky-dovca-panel-box-uzivatel {
    position: static; /* Vracíme boxy do normálního toku */
    min-height: auto;
    padding-bottom: var(--padding-maly); /* Vracíme původní spodní padding */
  }

  .sluzebky-dovca-panel-box-footer {
    position: static; /* Vracíme patičku do normálního toku */
    margin-top: 20px; /* Přidáme mezeru nad patičkou */
    border-top: 1px dashed #e9ecef; /* Přidáme linku zpět jako obyčejný border */
    padding: 15px 0 0; /* Upravíme padding pro mobil */
    background: transparent; /* Zrušíme pozadí, není třeba */
    border-radius: 0; /* Zrušíme radiusy, které už nejsou na spodní hraně */
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
  }

  .sluzebky-dovca-panel-box-footer::before {
    display: none; /* Skryjeme pseudo-element s linkou pro desktop */
  }
  
  .sluzebky-dovca-panel-box-footer-text {
    width: 100%;
    text-align: left;
  }
}

/* Drobné utility */
.sluzebky-dovca-panel-placeholder {
  font-size: 14px;
  text-align: center;
  padding: 40px 20px;
  color: #6c757d;
  font-style: italic;
}

.sluzebky-dovca-panel-oddelovac {
  margin: 0;
  border-bottom: 0px dashed #c9c9c9;
}