:root {
  --brand: #009473;
  --brand-dark: #00644f;
  --link: var(--brand-dark);
  --header-bg: rgba(255, 255, 255, .85);
  --header-link: #202020;
  --line: #dde3ea;
  --surface: #fff;
  --muted: #6c757d;
  --day-bg: #f3f5f7;
  --day-weekend: #e9ecef;
  --level-ok: #c8ecd9;
  --level-long: #ffe8a3;
  --level-over: #f8c4c4;
  --level-vacation: #343a40;
  --vacation-fg: #ffffff;
  --holiday-border: #7950c8;
  --msg-assistant: #f1f3f5;
  --msg-info-bg: #fff3cd;
  --msg-info-fg: #664d03;
  --msg-error-bg: #f8d7da;
  --msg-error-fg: #842029;
}

/* tmavý režim (data-bs-theme nastavuje skript v base.html.twig) */
[data-bs-theme=dark] {
  --link: #3fc9a6;
  --header-bg: rgba(33, 37, 41, .9);
  --header-link: #dee2e6;
  --line: #373b3e;
  --surface: #212529;
  --muted: #adb5bd;
  --day-bg: #2b3035;
  --day-weekend: #343a40;
  --level-ok: #1e4d3a;
  --level-long: #5c4a12;
  --level-over: #5e2a2a;
  --level-vacation: #ffffff;
  --vacation-fg: #212529;
  --holiday-border: #b197fc;
  --msg-assistant: #2b3035;
  --msg-info-bg: #332701;
  --msg-info-fg: #ffda6a;
  --msg-error-bg: #2c0b0e;
  --msg-error-fg: #ea868f;
}
[data-bs-theme=dark] body { background: #16191c; }
[data-bs-theme=dark] .app-header .logo { background: #fff; border-radius: 6px; padding: 2px 4px; }
.theme-switch .dropdown-item.active { background: var(--brand); }

body {
  min-height: 100vh;
  background: linear-gradient(to right, #ced6e0, #ffffff);
  background-image: url(../media/wavy2.svg);
  background-size: cover;
  background-position: bottom center;
  background-attachment: fixed;
}

a { color: var(--link); }

.btn-success { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); }
.btn-outline-success { --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); }

/* hlavička */
.app-header { background: var(--header-bg); border-bottom: 1px solid var(--line); }
.app-header .logo { height: 44px; width: auto; }
.app-header .nav-link { color: var(--header-link); }
.app-header .nav-link.active { color: var(--brand); font-weight: 600; }

/* obsah */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 1rem; }
.panel + .panel { margin-top: 1rem; }
.page-title { margin: 1.5rem 0 1rem; }

.filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.filters .form-select { width: auto; min-width: 9rem; }

.stat { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: .75rem 1rem; height: 100%; }
.stat .label { color: var(--muted); font-size: .85rem; }
.stat .value { font-size: 1.5rem; font-weight: 600; }

.table td.desc { white-space: pre-line; min-width: 14rem; }
.table td.nowrap, .table th.nowrap { white-space: nowrap; }

/* kalendář měsíce */
.calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendar .day { border-radius: 6px; padding: .25rem .4rem; font-size: .8rem; background: var(--day-bg); min-height: 3.2rem; }
.calendar .day .num { color: var(--muted); }
button.day { border: 0; text-align: left; color: inherit; cursor: pointer; }
button.day:hover, button.day:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.calendar .day.weekend { background: var(--day-weekend); }
/* odpracováno za den: do 9 h zelená, do 12 h žlutá, nad 12 h červená */
.calendar .day.level-ok, .calendar-legend .level-ok { background: var(--level-ok); }
.calendar .day.level-long, .calendar-legend .level-long { background: var(--level-long); }
.calendar .day.level-over, .calendar-legend .level-over { background: var(--level-over); }
.calendar .day.level-vacation, .calendar-legend .level-vacation { background: var(--level-vacation); }
/* Dovolená má kontrastní text v obou motivech včetně čísla dne a zakázek. */
.calendar .day.level-vacation,
.calendar .day.level-vacation .num { color: var(--vacation-fg); }
.calendar .day.level-vacation [data-project-count] { color: var(--vacation-fg) !important; }
/* Rámeček svátku ponechá výplň podle hodin nebo dovolené. */
.calendar .day.holiday { box-shadow: inset 0 0 0 2px var(--holiday-border); }
.calendar .holiday-label { display: inline-block; margin-left: .25rem; padding: 0 .22rem; border-radius: 3px; background: #6f42c1; color: #fff; font-size: .65rem; line-height: 1.5; }
.calendar-legend .holiday-swatch { background: transparent; border: 2px solid var(--holiday-border); }
.calendar .day .h { display: block; font-weight: 600; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: .25rem .9rem; align-items: center; }
.calendar-legend i { display: inline-block; width: .8rem; height: .8rem; border-radius: 3px; vertical-align: -1px; }

/* formulář záznamu: datum + hodina : minuta */
.datetime-row { display: flex; gap: .5rem; align-items: center; }
.datetime-row input[type=date] { flex: 1 1 auto; min-width: 0; }
.datetime-row select { width: auto; flex: 0 0 auto; }
.datetime-row .sep { font-weight: 600; margin: 0 -.2rem; }
.list-group .desc { white-space: pre-line; }
.calendar .head { text-align: center; font-size: .75rem; color: var(--muted); }

/* reporting */
.report-users { columns: 2 12rem; max-height: 22rem; overflow-y: auto; }
.report-users .form-check { break-inside: avoid; }

/* AI asistent */
.ai-chat-toggle { position: fixed; right: 1rem; bottom: 1rem; z-index: 1030; }
.ai-chat { --bs-offcanvas-width: 440px; }
.ai-messages { overflow-y: auto; display: flex; flex-direction: column; gap: .5rem; }
.ai-msg { max-width: 90%; padding: .5rem .75rem; border-radius: 12px; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .925rem; }
.ai-msg.user { align-self: flex-end; background: var(--brand); color: #fff; border-bottom-right-radius: 4px; }
.ai-msg.assistant { align-self: flex-start; background: var(--msg-assistant); border-bottom-left-radius: 4px; }
.ai-msg.info { align-self: center; background: var(--msg-info-bg); color: var(--msg-info-fg); font-size: .85rem; }
.ai-msg.action { align-self: flex-start; background: var(--msg-assistant); width: 90%; white-space: normal; }
.ai-msg.error { align-self: flex-start; background: var(--msg-error-bg); color: var(--msg-error-fg); }
.ai-msg .ai-status { display: block; color: var(--muted); font-size: .8rem; font-style: italic; }
.ai-form textarea { resize: none; }
.ai-note { font-size: .75rem; }
@media print { .ai-chat-toggle { display: none; } }

/* přihlášení */
.login-card { max-width: 420px; margin: 8vh auto 0; }

/* hotovo */
.checkmark { width: 80px; height: 80px; border-radius: 50%; display: block; stroke-width: 2; stroke: #fff; stroke-miterlimit: 10; margin: 1rem auto; box-shadow: inset 0 0 0 #4bb71b; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; }
.checkmark__circle { stroke-dasharray: 166; stroke-dashoffset: 166; stroke-width: 2; stroke-miterlimit: 10; stroke: #4bb71b; fill: var(--surface); animation: stroke .6s cubic-bezier(.65, 0, .45, 1) forwards; }
.checkmark__check { transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; animation: stroke .3s cubic-bezier(.65, 0, .45, 1) .8s forwards; }
@keyframes stroke { 100% { stroke-dashoffset: 0; } }
@keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } }
@keyframes fill { 100% { box-shadow: inset 0 0 0 30px #4bb71b; } }

.chart-box { position: relative; height: 360px; }

@media (max-width: 576px) {
  .calendar .day { min-height: 2.6rem; font-size: .7rem; }
  .stat .value { font-size: 1.2rem; }
}