/* Datum a čas v českém zápisu: pole s tlačítkem kalendáře a kalendář s týdnem od pondělí.
   Barvy z proměnných stránky (dvě sady názvů), světlý i tmavý režim přebírá sám. */
.vdat-obal, .vdat-okno {
  --k-plocha: var(--plocha, var(--surface, #fffaf6));
  --k-plocha2: var(--plocha2, var(--surface-2, #f1e7df));
  --k-ink: var(--ink, #2b1a24);
  --k-tlumene: var(--tlumene, var(--muted, #6b5660));
  --k-cara: var(--cara, var(--line-strong, #dccdc2));
  --k-akcent: var(--vino, var(--wine, #3a1626));
  --k-akcent-ink: var(--vino-ink, var(--bg, #fbf1ed));
  --k-fokus: var(--mosaz, var(--brass, #8a6428));
  --k-tap: var(--tap, 44px);
}
.vdat-obal [hidden], .vdat-okno[hidden] { display: none !important; }

.vdat-obal { display: flex; align-items: stretch; min-width: 0; }
.vdat-obal .vdat-vstup { flex: 1 1 auto; width: auto; min-width: 0; }
.vdat-obal:not(.vdat-obal-cas) .vdat-vstup { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.vdat-tlacitko {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  min-width: var(--k-tap); min-height: var(--k-tap); margin: 0; padding: 0 0.6rem;
  border: 1px solid var(--k-cara); border-left: 0; border-radius: 0 10px 10px 0;
  background: var(--k-plocha2); color: var(--k-akcent); font: inherit; cursor: pointer;
}
.vdat-tlacitko:hover { background: var(--k-plocha); }
.vdat-tlacitko[aria-expanded="true"] { background: var(--k-akcent); color: var(--k-akcent-ink); }
.vdat-tlacitko:disabled { cursor: default; opacity: 0.5; }
.vdat-tlacitko:focus-visible { outline: 2px solid var(--k-fokus); outline-offset: 1px; }
.vdat-ikona { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.vdat-okno {
  position: absolute; top: 0; left: 0; z-index: 1000;
  width: 19.5rem; max-width: calc(100vw - 16px); padding: 0.6rem;
  background: var(--k-plocha); color: var(--k-ink);
  border: 1px solid var(--k-cara); border-radius: 12px; box-shadow: 0 12px 32px -8px rgba(0, 0, 0, 0.35);
  font-size: 1rem; line-height: 1.3;
}
.vdat-hlava { display: flex; align-items: center; gap: 0.3rem; margin: 0 0 0.4rem; }
.vdat-hlava select {
  flex: 1 1 auto; min-width: 0; min-height: 40px; margin: 0; padding: 0 0.3rem;
  border: 1px solid var(--k-cara); border-radius: 8px; background: var(--k-plocha); color: var(--k-ink); font: inherit;
}
.vdat-hlava .vdat-rok { flex: 0 0 5.4rem; }
.vdat-sipka {
  flex: none; width: 40px; height: 40px; margin: 0; padding: 0;
  border: 1px solid transparent; border-radius: 8px; background: transparent;
  color: var(--k-akcent); font: inherit; font-size: 1.5rem; line-height: 1; cursor: pointer;
}
.vdat-sipka:hover { background: var(--k-plocha2); }
.vdat-mrizka { width: 100%; margin: 0; border-collapse: collapse; table-layout: fixed; font-size: 1rem; }
.vdat-mrizka th, .vdat-mrizka td { padding: 1px; border: 0; background: none; text-align: center; }
.vdat-mrizka th { padding: 0.25rem 0; font-size: 0.8rem; font-weight: 600; color: var(--k-tlumene); }
.vdat-den {
  display: block; width: 100%; height: 2.4rem; min-width: 0; min-height: 0; margin: 0; padding: 0;
  border: 1px solid transparent; border-radius: 8px; background: transparent;
  color: var(--k-ink); font: inherit; font-variant-numeric: tabular-nums; cursor: pointer;
}
.vdat-den:hover { background: var(--k-plocha2); }
.vdat-mrizka th.vdat-vikend, .vdat-den.vdat-vikend { color: var(--k-akcent); }
.vdat-den.vdat-dnes { border-color: var(--k-akcent); font-weight: 700; }
.vdat-den.vdat-vybrany, .vdat-den.vdat-vybrany:hover { background: var(--k-akcent); color: var(--k-akcent-ink); font-weight: 700; }
.vdat-den:disabled { opacity: 0.35; cursor: not-allowed; background: transparent; }
.vdat-okno button:focus-visible, .vdat-okno select:focus-visible { outline: 2px solid var(--k-fokus); outline-offset: 1px; }
.vdat-pata { display: flex; justify-content: space-between; gap: 0.5rem; margin-top: 0.4rem; }
.vdat-pata button {
  min-height: 40px; margin: 0; padding: 0 0.9rem;
  border: 1px solid var(--k-cara); border-radius: 8px; background: var(--k-plocha2); color: var(--k-ink); font: inherit; cursor: pointer;
}
.vdat-pata button:disabled { opacity: 0.5; cursor: default; }
.vdat-okno:focus { outline: none; }
.vdat-zive { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (forced-colors: active) {
  .vdat-den.vdat-vybrany { outline: 2px solid CanvasText; outline-offset: -2px; }
}
@media print { .vdat-okno, .vdat-tlacitko { display: none !important; } }
