/**
 * Styly pro modul Panel (Dashboard) - OPTIMALIZOVANÁ VERZE
 */

/* ========================================
   CSS PROMĚNNÉ
   ======================================== */
:root {
  --modra: #00adff;
  --oranzova: #ffb345;
  --zelena: #00b116;
  --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
   ======================================== */
.pracovni-evidence-modul-panel {
  width: 100%;
  margin-top: 50px;
  padding: 0;
}

.pracovni-evidence-panel-nadpis {
  font-size: 24px;
  color: #333;
  margin: 0 0 10px 0;
  font-weight: 600;
}

.pracovni-evidence-panel-horni-sekce {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gap);
  margin-bottom: 10px;
}

/* ========================================
   BOXY
   ======================================== */
.pracovni-evidence-panel-box {
  background: #fafafa;
  border-radius: var(--radius);
  padding: var(--padding);
  margin-bottom: 10px;
  border: 2px solid;
  box-shadow: 0px 10px 25px -10px rgba(0, 0, 0, 0.28)
}

.pracovni-evidence-panel-box h3 {
  margin: 0 0 15px 0;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}

.pracovni-evidence-panel-box p {
  margin: 0;
  font-size: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 0;
}

.pracovni-evidence-panel-box p strong {
  color: #333;
  font-weight: 500;
  flex: 1;
}

/* Barevné varianty */
.pracovni-evidence-panel-box-dochazka { border-color: var(--zelena); background: #fdfffd; }
.pracovni-evidence-panel-box-dochazka h3 { color: var(--zelena); }
.pracovni-evidence-panel-box-sluzebni-cesty { border-color: var(--modra); background: #fafdff; }
.pracovni-evidence-panel-box-sluzebni-cesty h3 { color: var(--modra); }
.pracovni-evidence-panel-box-dovolena { border-color: var(--oranzova); background: #fffefd; }
.pracovni-evidence-panel-box-dovolena h3 { color: #f57c00; }
.pracovni-evidence-panel-box-uzivatel { border-color: var(--zelena); background: #f0faf0; }
.pracovni-evidence-panel-box-uzivatel h3 { color: var(--zelena); }

/* ===== KOREKCE ZAROVNÁNÍ OBSAHU A PATIČKY (DESKTOP) ===== */
.pracovni-evidence-panel-box-dochazka,
.pracovni-evidence-panel-box-sluzebni-cesty,
.pracovni-evidence-panel-box-dovolena,
.pracovni-evidence-panel-box-uzivatel {
  position: relative;
  min-height: 280px;
  display: flex;
  flex-direction: column;
}

/* Statistiky sekce - roztáhne se aby footer šel dolů */
.pracovni-evidence-panel-box-dochazka .pracovni-evidence-panel-statistiky,
.pracovni-evidence-panel-box-sluzebni-cesty .pracovni-evidence-panel-statistiky,
.pracovni-evidence-panel-box-dovolena .pracovni-evidence-panel-statistiky {
  flex: 1;
}

/* Placeholder text pro prázdnou kartu */
.pracovni-evidence-panel-prazdny-text {
  color: #999;
  font-style: italic;
  text-align: center;
  padding: 40px 0;
}

/* Rychlé akce - hned pod nadpisem bez mezery */
.pracovni-evidence-panel-rychle-akce {
  margin: 0;
}

/* Statistiky a ostatní sekce - s mezerou od rychlých akcí */
.pracovni-evidence-panel-statistiky,
.pracovni-evidence-panel-auto-info,
.pracovni-evidence-panel-ceny-form {
  margin: 20px 0 0;
}

/* ========================================
   ČÍSELNÉ HODNOTY
   ======================================== */
[class*="pracovni-evidence-panel-cislo"] {
  background: #fff;
  padding: 6px 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 */
.pracovni-evidence-panel-cislo-ke-schvaleni {
  background: #edffee;
  color: #2e7d32;
  border-color: #4caf50;
}

.pracovni-evidence-panel-cislo-k-vyuctovani {
  background: #fff8e3;
  color: #f57c00;
  border-color: var(--oranzova);
}

.pracovni-evidence-panel-cislo-k-zauctovani {
  background: #fbf1fb;
  color: var(--fialova);
  border-color: #ff78e8;
}

.pracovni-evidence-panel-cislo-dochazka-ke-schvaleni {
  background: #fbf1fb;
  color: var(--fialova);
  border-color: #ff78e8;
}

.pracovni-evidence-panel-cislo-k-dispozici {
  background: #fffbca;
  color: #155724;
  border: 1px solid #ffb100;
}

/* Barvy pro docházku */
.pracovni-evidence-panel-cislo-prace {
  background: #e4ffe4;
  color: #2e7d32;
  border-color: #4caf50;
}

.pracovni-evidence-panel-cislo-dovolena {
  background: #d7efff;
  color: #1565c0;
  border-color: #2196f3;
}

.pracovni-evidence-panel-cislo-lekar {
  background: #fff0db;
  color: #e65100;
  border-color: #ff9800;
}

.pracovni-evidence-panel-cislo-nemoc {
  background: #ffe2e2;
  color: #c62828;
  border-color: #f44336;
}

.pracovni-evidence-panel-cislo-ocr {
  background: #fbe4ff;
  color: #7b1fa2;
  border-color: #9c27b0;
}

.pracovni-evidence-panel-cislo-svatek {
  background: #fffbc8;
  color: #827717;
  border-color: #cddc39;
}

.pracovni-evidence-panel-cislo-volno {
  background: #f3ffd7;
  color: #558b2f;
  border-color: #B9D982;
}

.pracovni-evidence-panel-cislo-celkem-ok {
  background: #28a745;
  color: #fff;
  border-color: #28a745;
}

.pracovni-evidence-panel-cislo-zbyva {
  background: #fff3e0;
  color: #e65100;
  border-color: #ff9800;
}

/* Nadpis měsíce v kartě docházky */
.pracovni-evidence-panel-mesic-nadpis {
  font-size: 16px !important;
  font-weight: 600 !important;
  text-align: left;
  margin-bottom: 10px !important;
  padding-bottom: 10px !important;
  justify-content: flex-start !important;
  border-bottom: 1px dashed #d9d9d9;
}

/* Upozornění (fond neexistuje apod.) */
.pracovni-evidence-panel-upozorneni {
  color: #856404;
  background: #fff3cd;
  padding: 10px !important;
  border-radius: 4px;
  text-align: center;
  font-size: 13px;
}

/* Badge stavu docházky */
.pracovni-evidence-panel-box .stav-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  margin-left: 5px;
}

.pracovni-evidence-panel-box .stav-rozpracovano {
  background: #ffc107;
  color: #212529;
}

.pracovni-evidence-panel-box .stav-odeslano {
  background: #fbd2ff;
  color: #9700bb;
}

.pracovni-evidence-panel-box .stav-schvaleno {
  background: #28a745;
  color: #fff;
}

/* Odkazy v číslech */
a[class*="pracovni-evidence-panel-cislo"] {
  text-decoration: none !important;
  cursor: pointer;
  transition: transform 0.2s ease;
}

a[class*="pracovni-evidence-panel-cislo"]:hover {
  transform: scale(1.1);
}

/* ========================================
   FORMULÁŘ CENY
   ======================================== */
.pracovni-evidence-panel-ceny-form {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.pracovni-evidence-panel-ceny-grid {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 0;
}

.pracovni-evidence-panel-ceny-radek {
  display: flex;
  align-items: center;
  padding: 4px 0;
}

.pracovni-evidence-panel-ceny-popisek {
  flex: 1;
  font-size: 14px;
  color: #333;
}

.pracovni-evidence-panel-ceny-jednotka {
  width: 50px;
  font-size: 14px;
  color: #333;
  margin-right: 10px;
}

input.pracovni-evidence-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.pracovni-evidence-panel-input-cena::-webkit-outer-spin-button,
input.pracovni-evidence-panel-input-cena::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input.pracovni-evidence-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)
   ======================================== */
.pracovni-evidence-panel-box-footer {
  margin-top: 20px;
  padding: 15px 0 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 40px;
  border-top: 1px dashed #d9d9d9;
}


.pracovni-evidence-panel-box-footer-text {
  font-size: 11px;
  color: #666;
  flex: 1;
}

.pracovni-evidence-panel-box-footer-button {
  margin-left: 10px;
}

/* ========================================
   NAVIGACE STATISTIK
   ======================================== */
#statistiky { scroll-margin-top: 15px; }

.pracovni-evidence-panel-statistiky-sekce {
  margin-top: 30px;
  margin-bottom: 20px;
}

.pracovni-evidence-panel-statistiky-navigace {
  background: var(--bg-velmi-svetla);
  border: 1px solid var(--okraj-svetly);
  border-radius: 6px;
  padding: 10px 20px;
  margin-bottom: 40px;
}

.pracovni-evidence-panel-statistiky-form {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.pracovni-evidence-panel-statistiky-label {
  font-weight: 600;
  color: #333;
  font-size: 14px;
}

.pracovni-evidence-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;
}

.pracovni-evidence-panel-radio-label:hover { background: var(--okraj-svetly); }
.pracovni-evidence-panel-radio-label input[type="radio"] { margin: 0; cursor: pointer; }
.pracovni-evidence-panel-radio-neaktivni { color: #6c757d; cursor: not-allowed; }
.pracovni-evidence-panel-radio-neaktivni:hover { background: transparent; }

/* ========================================
   FORMULÁŘE A FILTRY
   ======================================== */
.pracovni-evidence-panel-rok-form input[type="number"],
.pracovni-evidence-panel-rok-form select,
.pracovni-evidence-panel-filtr-select,
.pracovni-evidence-panel-filtr-input {
  padding: 6px 8px;
  border: 1px solid var(--modra);
  border-radius: var(--radius-maly);
  font-size: 14px;
  background-color: #fff;
  height: 34px;
}

.pracovni-evidence-panel-rok-volba {
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
}

.pracovni-evidence-panel-rok-form {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pracovni-evidence-panel-rok-form label,
.pracovni-evidence-panel-filtr-skupina label {
  font-weight: 500;
  color: #333;
  font-size: 14px;
}

.pracovni-evidence-panel-rok-form input[type="number"] {
  width: 80px;
  text-align: center;
}

.pracovni-evidence-panel-rok-form select {
  cursor: pointer;
  min-width: 120px;
}

.pracovni-evidence-panel-filtry-wrapper {
  background: var(--bg-velmi-svetla);
  border: 1px solid var(--okraj-svetly);
  border-radius: 6px;
  padding: 15px 20px;
  margin-bottom: 30px;
}

.pracovni-evidence-panel-filtry-form {
  display: flex;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
}

.pracovni-evidence-panel-filtr-skupina {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.pracovni-evidence-panel-filtr-select { min-width: 200px; }
.pracovni-evidence-panel-filtr-input { width: 80px; text-align: center; }

/* Focus stavy */
.pracovni-evidence-panel-rok-form input[type="number"]:focus,
.pracovni-evidence-panel-rok-form select:focus,
.pracovni-evidence-panel-filtr-select:focus,
.pracovni-evidence-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.pracovni-evidence-panel-cislo-ke-schvaleni,
body.role-reditel span.pracovni-evidence-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.pracovni-evidence-panel-cislo-k-zauctovani,
body.role-ucetni span.pracovni-evidence-panel-cislo-k-zauctovani,
body.role-ucetni a.pracovni-evidence-panel-cislo-dochazka-ke-schvaleni,
body.role-ucetni span.pracovni-evidence-panel-cislo-dochazka-ke-schvaleni {
  --barva-efektu: rgba(175, 0, 205, 0.1); /* Fialová */
  animation: dychajici-zare 2.5s ease-in-out infinite;
}

body.role-zamestnanec a.pracovni-evidence-panel-cislo-k-vyuctovani,
body.role-zamestnanec span.pracovni-evidence-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) {
  .pracovni-evidence-panel-horni-sekce {
    grid-template-columns: 1fr 1fr;
    gap: var(--gap-maly);
  }
}

/* Mobil */
@media (max-width: 800px) {
  .pracovni-evidence-modul-panel { margin: 0; }
  .pracovni-evidence-panel-nadpis { margin: 0 0 10px 7px; }
  .pracovni-evidence-panel-horni-sekce {
    grid-template-columns: 1fr;
    gap: var(--gap-maly);
  }
  .pracovni-evidence-panel-box { padding: var(--padding-maly); }
  .pracovni-evidence-panel-box h3 { font-size: 16px; }
  .pracovni-evidence-modul-panel [class*="pracovni-evidence-tlacitko-"] { min-width: 100px !important; }
  /*.pracovni-evidence-panel-statistiky-navigace { margin: 0 10px 40px; }*/
  .pracovni-evidence-panel-statistiky-form,
  .pracovni-evidence-panel-rok-form { gap: 10px; }
  .pracovni-evidence-panel-rok-volba { margin-left: 10px; }
  
  /* OPRAVA PRO MOBILNÍ ZOBRAZENÍ */
  .pracovni-evidence-panel-box-dochazka,
  .pracovni-evidence-panel-box-sluzebni-cesty,
  .pracovni-evidence-panel-box-dovolena,
  .pracovni-evidence-panel-box-uzivatel {
    min-height: auto;
    padding-bottom: var(--padding-maly);
  }

  .pracovni-evidence-panel-box-footer {
    margin-top: 20px; /* Přidáme mezeru nad patičkou */
    border-top: 1px dashed #e9ecef;
    padding: 15px 0 0;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
  }

  .pracovni-evidence-panel-box-footer-text {
    width: 100%;
    text-align: left;
  }
}

/* Drobné utility */
.pracovni-evidence-panel-placeholder {
  font-size: 14px;
  text-align: center;
  padding: 40px 20px;
  color: #6c757d;
  font-style: italic;
}

.pracovni-evidence-panel-oddelovac {
  margin: 0;
  border-bottom: 0px dashed #c9c9c9;
}

/* ========================================
   DOCHÁZKA - POČET DNÍ A VAROVÁNÍ
   ======================================== */

/* Řádek "Do konce měsíce zbývá X dní" */
.pracovni-evidence-panel-zbyva-dni {
  display: block !important;
  font-size: 13px !important;
  color: #666;
  margin-top: 15px !important;
  padding-top: 10px !important;
  border-top: 1px dashed #d9d9d9;
}

.pracovni-evidence-panel-zbyva-dni strong {
  color: #333;
  font-weight: 700;
}

/* CSS tooltip pro ceny PHM */
.pracovni-evidence-panel-phm-tooltip {
  position: relative;
  cursor: help;
  margin-top: auto !important;
}

.pracovni-evidence-panel-phm-tooltip .phm-tooltip-obsah {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  bottom: calc(100% + 15px);
  left: 20%;
  transform: translateX(-50%);
  background: #333;
  color: #ccc;
  padding: 15px 18px;
  border-radius: 6px;
  font-size: 13px;
  white-space: nowrap;
  z-index: 100;
  transition: opacity 0.2s ease, visibility 0.2s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

@media (max-width: 800px) {
	.pracovni-evidence-panel-phm-tooltip .phm-tooltip-obsah {
		left: 26%;
	}
}

.pracovni-evidence-panel-phm-tooltip .phm-tooltip-obsah::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #333;
}

.pracovni-evidence-panel-phm-tooltip:hover .phm-tooltip-obsah {
  visibility: visible;
  opacity: 1;
}

.phm-radek {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}

.phm-nazev {
  color: #FFF3AD;
}

.phm-castka {
  color: #fff;
  font-weight: 600;
  text-align: right;
}

/* Výrazné varování - bílý text na červeném pozadí */
.pracovni-evidence-panel-varovani-odeslat {
  background: #dc3545 !important;
  color: #fff !important;
  font-weight: 700 !important;
  padding: 8px 12px !important;
  border-radius: 4px;
  text-align: center !important;
  margin-top: 10px !important;
  justify-content: center !important;
  animation: varovani-pulzace 1.5s ease-in-out infinite;
}

@keyframes varovani-pulzace {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.4);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(220, 53, 69, 0);
  }
}

