/* ==========================================================================
   XandraOne Events — dizajnový systém „Vstupenka" + dark mode (spec 001)
   Zdroj pravdy: tokeny (svetlý/tmavý) → Tailwind remap (tailwind.config.js) → komponenty.
   Téma: <html data-theme="light|dark"> (partials/head.php + assets/js/theme.js),
   bez JS platí prefers-color-scheme. Predloha: php-events/.design/demos/c-system.css
   ========================================================================== */


:root{
  --cream:#FBF4E8; --paper:#FFFDF8; --sunk:#F3EADB;
  --ink:#1F1A16; --body:#4A4038; --muted:#7A6F63; --line:#1F1A161a; --line-strong:#1F1A1633;
  --edge:#1F1A16; --shadow:#1F1A16; --on-accent:#fff;
  /* paleta kategórií (spec 003) — admin vyberá z týchto kľúčov */
  --c-blue:#3D5AFE; --c-indigo:#3949AB; --c-violet:#7B3FE4; --c-pink:#C2185B; --c-red:#D32F2F; --c-orange:#F2542D;
  --c-yellow:#F5B400; --c-brown:#8D5A2B; --c-green:#0E9F6E; --c-teal:#00897B; --c-cyan:#0891B2; --c-stone:#7A6F63;
  --ok:#0E9F6E; --warn:#B7791F; --bad:#D32F2F; --info:#3D5AFE;
  --display:'Fraunces', Georgia, serif; --sans:'Manrope', system-ui, sans-serif;
  --r-sm:12px; --r:18px; --r-lg:22px;
  /* stavové rodiny (Tailwind red/green/amber → tieto premenné) */
  --bad-bg:#FDECEA; --bad-line:#F5C2BD; --bad-ink:#9B1C1C;
  --ok-bg:#E3F6EE; --ok-line:#A7E3CB; --ok-ink:#0B5E44;
  --warn-bg:#FFF4D6; --warn-line:#F5D98C; --warn-ink:#7A4A0C;
  --info-bg:#E8ECFF; --info-line:#B9C4FF; --info-ink:#2236B8;
  /* hlavná farba: --brand-base nastavuje partials/brand.php (sysadmin nastavenia) */
  --brand-base:#F2542D;
  --primary:var(--brand-base);
  color-scheme:light;
}
:root[data-theme="dark"]{
  --cream:#16120E; --paper:#211B16; --sunk:#1B1612;
  --ink:#F6EDDF; --body:#D8CCBA; --muted:#B3A795; --line:#F6EDDF1f; --line-strong:#F6EDDF3d;
  --edge:#F6EDDF; --shadow:#F6EDDF33; --on-accent:#16120E;
  --c-blue:#7B8FFF; --c-indigo:#8C9EFF; --c-violet:#B49BFF; --c-pink:#F0609A; --c-red:#FF6B6B; --c-orange:#FF7A57;
  --c-yellow:#FFC93D; --c-brown:#D4A373; --c-green:#33C48E; --c-teal:#4DB6AC; --c-cyan:#4DD0E1; --c-stone:#B3A795;
  --ok:#33C48E; --warn:#FFC93D; --bad:#FF6B6B; --info:#7B8FFF;
  --bad-bg:#3A1D1A; --bad-line:#6B2C27; --bad-ink:#FFB4AB;
  --ok-bg:#12301F; --ok-line:#1F5A3E; --ok-ink:#9BE8C8;
  --warn-bg:#33280E; --warn-line:#6B5317; --warn-ink:#FFE29A;
  --info-bg:#1C2148; --info-line:#38407A; --info-ink:#C3CCFF;
  --primary:color-mix(in srgb, var(--brand-base) 78%, #fff);
  color-scheme:dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --cream:#16120E; --paper:#211B16; --sunk:#1B1612;
    --ink:#F6EDDF; --body:#D8CCBA; --muted:#B3A795; --line:#F6EDDF1f; --line-strong:#F6EDDF3d;
    --edge:#F6EDDF; --shadow:#F6EDDF33; --on-accent:#16120E;
    --c-blue:#7B8FFF; --c-indigo:#8C9EFF; --c-violet:#B49BFF; --c-pink:#F0609A; --c-red:#FF6B6B; --c-orange:#FF7A57;
  --c-yellow:#FFC93D; --c-brown:#D4A373; --c-green:#33C48E; --c-teal:#4DB6AC; --c-cyan:#4DD0E1; --c-stone:#B3A795;
    --ok:#33C48E; --warn:#FFC93D; --bad:#FF6B6B; --info:#7B8FFF;
    --bad-bg:#3A1D1A; --bad-line:#6B2C27; --bad-ink:#FFB4AB;
    --ok-bg:#12301F; --ok-line:#1F5A3E; --ok-ink:#9BE8C8;
    --warn-bg:#33280E; --warn-line:#6B5317; --warn-ink:#FFE29A;
    --info-bg:#1C2148; --info-line:#38407A; --info-ink:#C3CCFF;
    --primary:color-mix(in srgb, var(--brand-base) 78%, #fff);
    color-scheme:dark;
  }
}


/* Odvodené (oba režimy): škála hlavnej farby pre Tailwind blue/indigo/sky a aliasy pre prevzaté šablóny */
:root{
  --p-50:color-mix(in srgb, var(--primary) 8%, var(--paper));
  --p-100:color-mix(in srgb, var(--primary) 14%, var(--paper));
  --p-200:color-mix(in srgb, var(--primary) 28%, var(--paper));
  --p-300:color-mix(in srgb, var(--primary) 48%, var(--paper));
  --p-400:color-mix(in srgb, var(--primary) 74%, var(--paper));
  --p-500:var(--primary);
  --p-600:color-mix(in srgb, var(--primary) 86%, var(--ink));
  --p-700:color-mix(in srgb, var(--primary) 70%, var(--ink));
  --p-800:color-mix(in srgb, var(--primary) 55%, var(--ink));
  --p-900:color-mix(in srgb, var(--primary) 42%, var(--ink));
  /* aliasy pôvodných kategórií (šablóny/JS z plánov 001–002) */
  --c-lecture:var(--c-blue); --c-workshop:var(--c-orange); --c-course:var(--c-green); --c-conf:var(--c-pink);
  --c-net:var(--c-yellow); --c-room:var(--c-violet); --c-studio:var(--c-cyan); --c-other:var(--c-stone);
  --primary-600:var(--p-600);
  --primary-tint:var(--p-100);
  --secondary:var(--c-course);
  --secondary-tint:color-mix(in srgb, var(--c-course) 14%, var(--paper));
  --secondary-ink:var(--ok-ink);
  --bg:var(--cream); --surface:var(--paper);
}

*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background-color .3s,color .3s}
a{color:inherit;text-decoration:none}
.display{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:700;letter-spacing:-.02em}
.kicker{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.muted{color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:inherit;font-weight:700;font-size:14px;padding:11px 20px;border-radius:14px;border:2px solid var(--edge);background:var(--paper);color:var(--ink);cursor:pointer;transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--shadow)}
.btn-ink{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.btn-accent{background:var(--primary);color:var(--on-accent);border-color:var(--edge)}
.btn-ghost{border-color:transparent;background:transparent}
.btn-ghost:hover{box-shadow:none;transform:none;background:var(--sunk)}
.btn-sm{padding:7px 13px;font-size:13px;border-radius:11px}

/* chips / stickers */
.chip{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:13.5px;padding:8px 15px;border-radius:999px;border:2px solid var(--edge);background:var(--paper)}
.chip.on{background:var(--ink);color:var(--cream)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;border:1.5px solid currentColor;white-space:nowrap}

/* cards */
.card{background:var(--paper);border:2px solid var(--edge);border-radius:var(--r-lg)}
.card-lift{transition:transform .2s,box-shadow .2s}
.card-lift:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--shadow)}
.card-flat{background:var(--paper);border:1.5px solid var(--line-strong);border-radius:var(--r)}
.printed{box-shadow:6px 6px 0 var(--shadow)}

/* ticket row */
.ticket{display:grid;grid-template-columns:120px 1fr 190px;background:var(--paper);border:2px solid var(--edge);border-radius:var(--r-lg);overflow:hidden;transition:transform .2s,box-shadow .2s}
.ticket:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--shadow)}
.stub{color:var(--on-accent);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;line-height:1}
.stub b{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:800;font-size:46px}
.stub small{font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-top:6px;opacity:.9}
.stub::after{content:"";position:absolute;right:-1px;top:10px;bottom:10px;border-right:3px dotted var(--cream)}

/* fields */
.field{display:block;margin-bottom:14px}
.field span{display:block;font-size:13px;font-weight:700;margin-bottom:6px}
.input{width:100%;font:inherit;font-size:15px;color:var(--ink);background:var(--paper);border:2px solid var(--line-strong);border-radius:12px;padding:10px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
.input:focus{border-color:var(--edge);box-shadow:3px 3px 0 var(--shadow)}

/* theme toggle */
.theme{width:42px;height:42px;border-radius:14px;border:2px solid var(--edge);background:var(--paper);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .15s}
.theme:hover{transform:rotate(-8deg)}
.theme svg{width:20px;height:20px}
.theme .sun{display:none}
:root[data-theme="dark"] .theme .sun{display:block}
:root[data-theme="dark"] .theme .moon{display:none}

/* logo */
.logo{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:700;font-size:24px;letter-spacing:-.02em;display:flex;align-items:center;gap:10px}
/* spec 007 — značka XEvents (X z loga XandraOne + E) */
.logo .mark-xe{width:38px;height:38px;flex-shrink:0;display:grid;place-items:center;border-radius:11px;background:var(--paper);border:2px solid var(--edge);box-shadow:3px 3px 0 var(--edge);transform:rotate(-6deg)}
.logo .mark-xe img{width:30px;height:auto;display:block}
.logo .mark{width:28px;height:28px;border-radius:9px;background:var(--c-workshop);transform:rotate(-8deg);box-shadow:5px 4px 0 var(--c-lecture);flex-shrink:0}

/* table */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:12px 16px;border-bottom:2px solid var(--line-strong)}
.tbl td{padding:14px 16px;border-bottom:1px solid var(--line)}
.tbl tr:last-child td{border-bottom:0}
.tbl tr:hover td{background:var(--sunk)}

/* ---------- doplnky pre aplikáciu ---------- */
body{font-family:var(--sans)}
h1,h2,h3,.font-display{font-family:var(--display);font-variation-settings:"SOFT" 100;letter-spacing:-.015em}
::selection{background:color-mix(in srgb, var(--primary) 30%, transparent)}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.btn-primary{background:var(--primary);color:var(--on-accent);border:2px solid var(--edge);border-radius:14px;font-weight:700}
.btn-primary:hover{filter:none;transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--shadow)}
.text-primary{color:var(--primary)}
.input-error{border-color:var(--bad)!important}
.error-text{color:var(--bad);font-size:.875rem;margin-top:.25rem}
.flash-message{animation:xeFade .3s ease-in}
@keyframes xeFade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
input,select,textarea{color:var(--ink);background-color:var(--paper)}
input::placeholder,textarea::placeholder{color:var(--muted)}
/* Leaflet v tmavom režime — stlmené dlaždice */
:root[data-theme="dark"] .leaflet-tile-pane{filter:brightness(.72) contrast(1.1) saturate(.75) hue-rotate(180deg) invert(1)}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* ---------- vstupenka v zozname (partials/event-ticket.php) ---------- */
.xe-ticket{grid-template-columns:120px 1fr 200px}
.xe-ticket-mid{padding:18px 24px;min-width:0}
.xe-ticket-title{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:700;font-size:25px;line-height:1.1;letter-spacing:-.015em;margin:6px 0 8px;text-wrap:balance}
.xe-ticket-meta{font-size:14px;color:var(--muted);font-weight:500}
.xe-ticket-meta b{color:var(--ink)}
.xe-ticket-end{border-left:2px dashed var(--line-strong);padding:18px 20px;display:flex;flex-direction:column;justify-content:center;gap:10px}
.xe-ticket-price{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:700;font-size:24px}
.xe-ticket-seats{font-size:12.5px;font-weight:600;color:var(--muted)}
.xe-ticket-seats.is-low{color:var(--bad)}
.xe-ticket-go{font-weight:700;font-size:13px;text-align:center;border:2px solid var(--edge);border-radius:12px;padding:8px}
.xe-ticket:hover .xe-ticket-go{background:var(--ink);color:var(--cream)}
.xe-list{display:flex;flex-direction:column;gap:16px}
@media (max-width:760px){
  .xe-ticket{grid-template-columns:84px 1fr}
  .xe-ticket .stub b{font-size:32px}
  .xe-ticket-mid{padding:14px 16px}
  .xe-ticket-title{font-size:20px}
  .xe-ticket-end{grid-column:1/-1;border-left:0;border-top:2px dashed var(--line-strong);flex-direction:row;align-items:center;justify-content:space-between;padding:12px 16px}
  .xe-ticket-go{display:none}
}
.xe-wrap{max-width:1240px;margin:0 auto;padding:0 40px}
@media (max-width:900px){.xe-wrap{padding:0 16px}}
.xe-h2{font-family:var(--display);font-variation-settings:"SOFT" 100;font-weight:700;font-size:38px;letter-spacing:-.02em;line-height:1.05}
.xe-link{font-weight:700;border-bottom:2px solid var(--edge)}
.xe-empty{border:2px dashed var(--line-strong);border-radius:var(--r-lg);padding:40px;text-align:center;color:var(--muted)}
input[type=file]{font:inherit;font-size:13.5px;color:var(--body)}
input[type=file]::file-selector-button{font:inherit;font-weight:700;font-size:13px;padding:8px 14px;margin-right:12px;border-radius:11px;border:2px solid var(--edge);background:var(--paper);color:var(--ink);cursor:pointer}
input[type=checkbox],input[type=radio]{accent-color:var(--primary)}
select{appearance:auto}

/* spec 004 — pole hesla s tlačidlom zobraziť/skryť */
.pw-wrap{position:relative}
.pw-wrap .input{padding-right:48px}
.pw-toggle{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:var(--muted);cursor:pointer}
.pw-toggle:hover{color:var(--ink);background:var(--sunk)}
.pw-toggle:focus-visible{outline:2px solid var(--primary);outline-offset:1px}
.pw-toggle .pw-hide{display:none}
.pw-toggle[aria-pressed="true"] .pw-show{display:none}
.pw-toggle[aria-pressed="true"] .pw-hide{display:block}
.pw-wrap input::-ms-reveal{display:none}