Rozvrhy */
/* dashboard — Prodáš hned (kontingent / sell now) */
.dash-instant{ border:1px solid #bcd29c; border-radius:var(--r-lg); background:var(--ok-tint); overflow:hidden; box-shadow:var(--sh-sm); margin-top:18px; }
.dash-instant-h{ display:flex; align-items:center; gap:9px; padding:12px 16px; border-bottom:1px solid #cdddb4; }
.dash-instant-h .di-ic{ color:var(--ok); display:flex; flex:none; }
.dash-instant-h-tt{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.dash-instant-h-t{ font-weight:700; font-size:14px; color:#38501f; }
.dash-instant-h-s{ font-size:12px; color:#5c7345; font-weight:500; }
.di-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:10px; padding:14px 16px; }
.di-card{ display:flex; flex-direction:column; gap:3px; background:var(--card); border:1px solid #cdddb4; border-radius:var(--r-md); padding:10px 12px; text-decoration:none; transition:border-color .12s, box-shadow .12s, transform .12s; }
.di-card:hover{ border-color:var(--ok); box-shadow:var(--sh-sm); transform:translateY(-1px); }
.di-name{ font-weight:700; font-size:13px; color:var(--ink-1); line-height:1.25; }
.di-ag{ font-size:11.5px; color:var(--ink-3); }
.di-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:3px; gap:6px; }
.di-price{ font-weight:700; font-size:12.5px; color:#38501f; white-space:nowrap; }
.di-price.noprice{ font-weight:600; color:var(--ink-3); font-size:11.5px; }
.di-price small{ display:block; font-weight:600; color:#5c7345; font-size:10.5px; }
.di-go{ color:var(--ok); display:flex; flex:none; }
/* success akční lišta — jednotná velikost tlačítek (overlay 162) */
.savebar.success-actions{ flex-wrap:wrap; align-items:stretch; }
.savebar.success-actions .btn-p,
.savebar.success-actions .btn-s,
.savebar.success-actions .btn-wa,
.savebar.success-actions button{
font-size:14px; font-weight:600; padding:12px 18px; min-height:46px; box-sizing:border-box;
display:inline-flex; align-items:center; justify-content:center; gap:8px; line-height:1; cursor:pointer;
}
/* ===== overlay 163 — UX expert: doladění success lišty (merge-protect na aktuální app.css) ===== */
/* ============================================================
success.php — UX doladění akční lišty + stavové hlášky (nad PTI-162)
Scoped pod .success-wrap / .success-actions. NEMĚNÍ prvky, akce, data
ani třídy tlačítek — jen layout, seskupení a vzhled hlášky. CSP-safe.
Vlož na KONEC app.css.
============================================================ */
/* akční lišta v toku (ne sticky), vzdušná, s mezerou mezi zalomenými řádky */
.savebar.success-actions{ position:static; bottom:auto; border-top:1px solid var(--line);
margin-top:14px; padding:16px 0 0; gap:10px; row-gap:10px; justify-content:flex-start; }
/* logické seskupení BEZ změny DOM: „doručení" vlevo · navigace vpravo
(attribute selektor na „Správa prodeje" odsadí pravou skupinu; robustní
i když se „Poslat agentuře" nezobrazí) */
.success-actions a[href^="/sales.php"]{ margin-left:auto; }
/* drž uniformní velikosti z 162, ať řada nezubatí */
.success-actions .btn-p,
.success-actions .btn-wa,
.success-actions .btn-s{ flex:0 1 auto; }
/* „Nový prodej" = hlavní další krok prodejce → decentní zvýraznění (zůstává odkaz/btn-s) */
.success-actions a[href="/"]{ border-color:var(--brand); color:var(--brand); font-weight:700; }
.success-actions a[href="/"]:hover{ background:var(--brand-tint); color:var(--brand); }
/* e-mail pole těsněji k doručovacím tlačítkům (čte se jako „zadej → pošli") */
.success-wrap form .field{ margin-bottom:10px; }
/* stavová hláška jako čistý pill s ikonou (scoped — .inline-note jinde nedotčen) */
.success-wrap .inline-note.ok,
.success-wrap .inline-note.err{ display:flex; align-items:center; gap:9px;
font-size:14px; font-weight:600; padding:12px 16px; border-radius:var(--r-md); margin:0 0 14px; }
.success-wrap .inline-note.ok::before{ content:'\2713'; font-weight:800; font-size:15px; }
.success-wrap .inline-note.err::before{ content:'!'; flex:none; width:18px; height:18px;
border-radius:50%; background:#c0392b; color:#fff; display:inline-flex; align-items:center;
justify-content:center; font-size:12px; font-weight:800; }
/* ============================================================================
KLIENTSKÝ KATALOG (catalog.php) — redesign 165.
Veřejný kiosk, „native iPad / retina app" pocit. Optimalizace na svislý tablet,
plná responzivita (telefon → tablet → desktop/landscape). Vše tokenizované,
prefix .kat- (.cat-/.attr- jsou cizí). Bez inline stylu (CSP). Hover jen pro myš.
========================================================================== */
/* ---- shell + frosted lišta ---- */
.kat-bar{ position:sticky; top:0; z-index:50; display:flex; align-items:center; gap:12px;
padding:11px 20px; border-bottom:1px solid var(--line);
background:rgba(251,248,241,.82); -webkit-backdrop-filter:saturate(180%) blur(14px);
backdrop-filter:saturate(180%) blur(14px); }
.kat-brand{ display:inline-flex; align-items:baseline; gap:9px; text-decoration:none; flex:none;
-webkit-tap-highlight-color:transparent; }
.kat-brand-mark{ font-family:var(--f-d); font-weight:600; font-size:23px; color:var(--brand); letter-spacing:.4px; }
.kat-brand-t{ font-family:var(--f-u); font-weight:600; font-size:14px; color:var(--ink-3); }
.kat-bar-sp{ flex:1 1 auto; }
.kat-bar-home{ flex:none; font-family:var(--f-u); font-weight:600; font-size:14px; text-decoration:none;
color:var(--brand); padding:0 16px; min-height:48px; display:inline-flex; align-items:center;
border:1px solid var(--line-2); border-radius:999px; background:var(--card);
-webkit-tap-highlight-color:transparent; transition:background .18s, border-color .18s; }
.kat-bar .lang-switch{ flex:none; }
.kat-wrap{ max-width:1040px; margin:0 auto; padding:24px 22px 72px; font-family:var(--f-u); color:var(--ink-1); }
/* ---- vyhledávání v liště (na všech stránkách) ---- */
.kat-search{ position:relative; flex:1 1 auto; max-width:560px; min-width:0; }
.kat-search-ic{ position:absolute; left:16px; top:50%; transform:translateY(-50%); color:var(--ink-4); pointer-events:none; }
.kat-search-input{ width:100%; box-sizing:border-box; height:48px; padding:0 18px 0 44px;
font-family:var(--f-u); font-size:16px; color:var(--ink-1); background:var(--card);
border:1.5px solid var(--line-2); border-radius:999px; box-shadow:var(--sh-sm);
-webkit-appearance:none; appearance:none; transition:border-color .18s, box-shadow .18s; }
.kat-search-input::placeholder{ color:var(--ink-4); }
.kat-search-input:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px var(--brand-tint); }
.kat-search-pop{ position:absolute; left:0; right:0; top:calc(100% + 10px); z-index:60;
background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
box-shadow:var(--sh-lg); max-height:66vh; overflow-y:auto; -webkit-overflow-scrolling:touch;
overflow:hidden auto; }
.kat-sr-list{ display:flex; flex-direction:column; }
.kat-sr-row{ display:flex; align-items:center; gap:14px; padding:15px 18px; text-decoration:none;
color:inherit; border-bottom:1px solid var(--line); -webkit-tap-highlight-color:transparent; }
.kat-sr-row:last-child{ border-bottom:0; }
.kat-sr-row.hi, .kat-sr-row:active{ background:var(--brand-tint); }
.kat-sr-mn{ flex:1 1 auto; min-width:0; }
.kat-sr-name{ font-family:var(--f-d); font-weight:500; font-size:18px; color:var(--brand-2); line-height:1.2; }
.kat-sr-name mark{ background:var(--gold-tint); color:inherit; border-radius:3px; padding:0 1px; }
.kat-sr-meta{ display:flex; align-items:center; gap:7px; margin-top:3px; font-size:14px; color:var(--ink-3); }
.kat-sr-ag{ font-weight:700; letter-spacing:.3px; text-transform:uppercase; font-size:12px; color:var(--ink-3); }
.kat-sr-sep{ color:var(--ink-5); }
.kat-sr-price{ flex:none; font-family:var(--f-m); font-weight:700; font-size:15px; color:var(--brand-2); white-space:nowrap; }
.kat-sr-from{ font-family:var(--f-u); font-weight:500; font-size:13px; color:var(--ink-3); }
.kat-sr-empty{ padding:22px 18px; text-align:center; font-size:16px; color:var(--ink-3); }
/* ---- breadcrumb ---- */
.kat-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:6px 0 16px; font-size:14px; color:var(--ink-3); }
.kat-crumb{ color:var(--brand); text-decoration:none; padding:8px 4px; min-height:40px; display:inline-flex; align-items:center;
-webkit-tap-highlight-color:transparent; }
.kat-crumb[aria-current]{ color:var(--ink-3); }
.kat-crumb-sep{ color:var(--ink-5); }
/* ---- domů: nadpis + dlaždice kategorií ---- */
.kat-hometop{ margin:10px 0 26px; }
.kat-h1{ font-family:var(--f-d); font-weight:400; font-size:44px; line-height:1.08; margin:0 0 8px; color:var(--brand-2);
letter-spacing:-.01em; }
.kat-lead{ font-size:18px; line-height:1.55; color:var(--ink-3); margin:0; max-width:54ch; }
.kat-catgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.kat-cat{ display:flex; flex-direction:column; gap:12px; padding:26px 24px; min-height:178px;
border-radius:var(--r-lg); text-decoration:none; border:1px solid var(--line); box-shadow:var(--sh-sm);
background:linear-gradient(155deg, var(--acc-bg,#F0EADC), var(--card) 78%);
-webkit-tap-highlight-color:transparent; transition:transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s; }
.kat-cat:active{ transform:scale(.98); }
.kat-cat-ic{ display:inline-flex; width:56px; height:56px; align-items:center; justify-content:center;
border-radius:var(--r-md); background:var(--card); color:var(--acc,var(--brand)); box-shadow:var(--sh-sm); }
.kat-cat-name{ font-family:var(--f-d); font-weight:500; font-size:25px; line-height:1.12; color:var(--acc,var(--brand)); margin-top:auto; }
.kat-cat-n{ font-size:14px; font-weight:600; color:var(--ink-3); }
/* ---- mřížka produktů v kategorii ---- */
.kat-cat-title{ font-family:var(--f-d); font-weight:400; font-size:34px; margin:2px 0 20px; color:var(--brand-2); }
.kat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.kat-tile{ display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden;
background:var(--card); border:1px solid var(--line); box-shadow:var(--sh-sm); text-decoration:none; color:inherit;
-webkit-tap-highlight-color:transparent; transition:transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s; }
.kat-tile:active{ transform:scale(.99); }
.kat-tile-ph{ aspect-ratio:4/3; background:var(--tint); overflow:hidden; }
.kat-tile-img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.kat-tile-ph--noimg{ display:flex; align-items:center; justify-content:center;
background:linear-gradient(150deg, var(--brand-tint), var(--tint)); }
.kat-tile-ph--noimg span{ font-family:var(--f-d); font-size:56px; color:var(--brand); opacity:.5; }
.kat-tile-body{ display:flex; flex-direction:column; gap:7px; padding:16px 16px 18px; flex:1 1 auto; }
.kat-tile-ag{ font-size:12px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:var(--ink-3); }
.kat-tile-name{ font-family:var(--f-d); font-weight:500; font-size:22px; line-height:1.16; color:var(--brand-2); }
.kat-tile-foot{ margin-top:auto; padding-top:6px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.kat-tile-from{ font-size:13px; color:var(--ink-3); }
/* ---- detail ---- */
.kat-detail{ display:block; }
.kat-hero{ position:relative; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:16/9; max-height:42vh;
background:var(--tint); box-shadow:var(--sh-md); margin-bottom:18px; }
.kat-hero-img{ width:100%; height:100%; object-fit:cover; display:block; }
.kat-hero::after{ content:''; position:absolute; inset:0; pointer-events:none;
background:linear-gradient(180deg, transparent 58%, rgba(20,12,8,.26)); }
.kat-hero--noimg{ display:flex; align-items:center; justify-content:center;
background:linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 60%, #3c0e18 100%); }
.kat-hero--noimg::after{ display:none; }
.kat-hero-init{ font-family:var(--f-d); font-size:120px; color:#fff; opacity:.85; }
.kat-d-head{ margin-bottom:14px; }
.kat-d-ag{ font-size:13px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--ink-3); margin-bottom:5px; }
.kat-d-title{ font-family:var(--f-d); font-weight:500; font-size:34px; line-height:1.08; margin:0 0 5px; color:var(--brand-2);
letter-spacing:-.01em; }
.kat-d-sub{ font-size:17px; color:var(--ink-3); margin-bottom:10px; }
.kat-pricelead{ display:flex; align-items:baseline; flex-wrap:wrap; gap:10px; margin:0 0 18px; padding:13px 18px;
background:var(--brand-tint); border:1px solid #E7C9CE; border-radius:var(--r-md); }
.kat-pricelead .l{ font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--brand-2); }
.kat-pricelead b{ font-family:var(--f-d); font-size:27px; font-weight:600; color:var(--brand-2); }
.kat-pricelead .eur{ font-family:var(--f-m); font-size:14px; color:var(--ink-3); }
.kat-facts{ display:flex; flex-wrap:wrap; gap:10px; margin:0 0 20px; }
.kat-fact{ display:flex; flex-direction:column; gap:2px; padding:10px 16px; min-height:48px; justify-content:center;
background:var(--tint); border-radius:var(--r-md); border:1px solid var(--line); }
.kat-fact span{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--ink-3); }
.kat-fact b{ font-size:16px; color:var(--ink-1); }
.kat-d-cols{ display:flex; flex-direction:column; gap:16px; }
.kat-d-main{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.kat-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:20px 22px; box-shadow:var(--sh-sm); }
.kat-card h2{ font-family:var(--f-d); font-weight:500; font-size:21px; margin:0 0 12px; color:var(--brand-2); }
.kat-prose{ font-size:17px; line-height:1.62; color:var(--ink-2); margin:0; }
.kat-list{ margin:0; padding-left:20px; font-size:16px; line-height:1.55; color:var(--ink-2); }
.kat-list li{ margin:3px 0; }
/* ceník (read-only) */
.kat-prices{ display:flex; flex-direction:column; gap:14px; }
.kat-px{ font-family:var(--f-m); white-space:nowrap; text-align:right; }
.kat-px b{ font-size:17px; color:var(--brand-2); }
.kat-eur{ font-family:var(--f-m); font-size:12.5px; color:var(--ink-4); margin-left:6px; }
.kat-px--ask{ font-family:var(--f-u); font-size:15px; color:var(--ink-3); font-style:italic; }
.kat-px-solo{ font-size:20px; }
.kat-px-solo .kat-px b{ font-size:29px; }
.kat-from{ font-family:var(--f-u); font-size:14px; color:var(--ink-3); }
.kat-plist{ display:flex; flex-direction:column; }
.kat-prow{ display:flex; align-items:baseline; gap:14px; padding:12px 2px; border-bottom:1px solid var(--line); }
.kat-prow:last-child{ border-bottom:0; }
.kat-prow-l{ font-size:16px; color:var(--ink-2); flex:1 1 auto; min-width:0; }
.kat-prow-l small{ display:block; font-size:12.5px; color:var(--ink-3); }
.kat-mxwrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.kat-matrix{ border-collapse:collapse; width:100%; font-size:15px; }
.kat-matrix th, .kat-matrix td{ border:1px solid var(--line); padding:11px 12px; }
.kat-matrix thead th{ background:var(--tint); color:var(--ink-2); font-weight:700; text-align:right; }
.kat-matrix thead th:first-child{ text-align:left; }
.kat-mx-corner{ background:transparent !important; border:0 !important; }
.kat-mx-row{ text-align:left !important; background:var(--surface); font-weight:600; color:var(--ink-1); }
.kat-mx-row small{ display:block; font-size:12px; font-weight:400; color:var(--ink-4); }
.kat-mxprice{ text-align:right; font-family:var(--f-m); }
.kat-mxprice b{ color:var(--brand-2); }
.kat-matrix tbody tr:nth-child(even) td:not(.kat-mx-row){ background:#FCFAF4; }
.kat-mx-off{ color:var(--ink-5); text-align:right; }
.kat-pgroup{ margin:4px 0 10px; }
.kat-pgroup-h{ font-weight:700; font-size:16px; color:var(--ink-3); margin:0 0 6px; }
.kat-pgroup-h small{ font-weight:400; color:var(--ink-4); }
/* varianta (jediná) */
.kat-vblock{ border:1px solid var(--line-2); border-radius:var(--r-md); padding:16px 18px; background:var(--surface); }
.kat-vhead{ display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-family:var(--f-d); font-weight:500;
font-size:19px; color:var(--brand-2); margin-bottom:8px; }
.kat-vsep{ color:var(--ink-5); }
.kat-vds{ font-size:14.5px; color:var(--ink-3); margin:0 0 10px; line-height:1.5; }
.kat-feats{ display:flex; flex-direction:column; gap:4px; margin:0 0 10px; }
.kat-feat{ display:flex; align-items:center; gap:8px; font-size:14.5px; color:var(--ink-2); }
.kat-feat.off{ color:var(--ink-4); }
.kat-feat b{ margin-left:auto; }
.kat-fic{ font-weight:800; }
.kat-fic.ok{ color:var(--ok); }
.kat-fic.no{ color:var(--bad); }
.kat-vbadges{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.kat-vbadge{ font-size:12px; font-weight:700; padding:3px 9px; border-radius:999px; background:var(--gold-tint); color:#7A5A1F; }
/* hluboký ceník → akordeony (native , bez JS) */
.kat-pacc{ border:1px solid var(--line-2); border-radius:var(--r-md); background:var(--card); margin-bottom:10px; overflow:hidden; }
.kat-pacc > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px;
padding:14px 16px; min-height:56px; -webkit-tap-highlight-color:transparent; }
.kat-pacc > summary::-webkit-details-marker{ display:none; }
.kat-pacc-name{ font-family:var(--f-d); font-weight:500; font-size:18px; color:var(--brand-2); flex:1 1 auto; min-width:0;
display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; }
.kat-pacc-from{ font-family:var(--f-m); font-size:14px; color:var(--ink-3); white-space:nowrap; }
.kat-pacc-from b{ color:var(--brand-2); font-size:16px; }
.kat-pacc-chev{ width:22px; height:22px; color:var(--ink-4); transition:transform .2s cubic-bezier(.2,.7,.2,1); flex:none; }
.kat-pacc[open] > summary{ border-bottom:1px solid var(--line); }
.kat-pacc[open] .kat-pacc-chev{ transform:rotate(180deg); }
.kat-pacc-body{ padding:8px 16px 14px; }
.kat-eurnote{ font-family:var(--f-u); font-size:12.5px; color:var(--ink-3); margin:14px 2px 0; }
/* jazyky výkladu / místo srazu / plán sezení */
.kat-flag{ border-radius:2px; vertical-align:-2px; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.kat-langs{ display:flex; flex-wrap:wrap; gap:10px; }
.kat-lang{ display:inline-flex; align-items:center; gap:7px; padding:9px 14px; min-height:44px; font-size:15px;
font-weight:600; background:var(--tint); border:1px solid var(--line); border-radius:999px; }
.kat-meet-addr{ font-size:16px; font-weight:600; color:var(--ink-1); }
.kat-meet-note{ font-size:15px; color:var(--ink-3); line-height:1.55; margin-top:6px; }
.kat-map{ margin-top:14px; border-radius:var(--r-md); overflow:hidden; border:1px solid var(--line); }
.kat-map img{ display:block; width:100%; height:auto; }
.kat-seatmap{ background:var(--tint); border-radius:var(--r-md); padding:14px; text-align:center; }
.kat-seatmap img{ display:inline-block; max-width:100%; height:auto; max-height:540px; border-radius:var(--r-sm); }
/* highlighty (přehledové body) */
.kat-hl{ background:var(--brand-tint); border-color:var(--brand); }
.kat-hllist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; }
.kat-hllist li{ position:relative; padding-left:28px; font-size:16px; line-height:1.5; color:var(--ink-1); }
.kat-hllist li::before{ content:"✓"; position:absolute; left:2px; top:0; color:var(--brand); font-weight:800; }
/* galerie fotek (vodorovný pruh, scroll-snap, bez JS) */
.kat-gal{ display:flex; gap:12px; overflow-x:auto; padding-bottom:6px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.kat-gal-img{ flex:0 0 auto; height:210px; width:auto; max-width:88%; object-fit:cover; border-radius:var(--r-md);
border:1px solid var(--line); scroll-snap-align:start; }
/* svoz / vyzvednutí */
.kat-meet-pickup{ margin-top:10px; font-size:14.5px; font-weight:600; color:var(--brand-2);
background:var(--brand-tint); border:1px solid var(--brand); border-radius:999px; padding:7px 13px; display:inline-block; }
/* admin: galerie produktu (náhledy + odebrání) */
.pgal-h{ font-family:var(--f-u); font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.04em;
color:var(--ink-3); margin:18px 0 8px; }
.pgal-grid{ display:flex; flex-wrap:wrap; gap:10px; margin:0 0 12px; }
.pgal-item{ display:flex; flex-direction:column; gap:5px; width:120px; cursor:pointer; }
.pgal-thumb{ width:120px; height:90px; object-fit:cover; border-radius:var(--r-sm); border:1px solid var(--line); }
.pgal-rm{ font-size:12px; color:var(--ink-3); display:flex; align-items:center; gap:5px; }
/* prodej (product.php): highlighty */
.pdx-hllist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.pdx-hllist li{ position:relative; padding-left:26px; font-size:15px; line-height:1.5; color:var(--ink-1); }
.pdx-hllist li::before{ content:"✓"; position:absolute; left:0; top:0; color:var(--brand); font-weight:800; }
.kat-empty{ padding:52px 22px; text-align:center; font-size:17px; color:var(--ink-3);
background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); }
/* ---- responzivita ---- */
@media (min-width:840px){
.kat-d-cols{ flex-direction:row; align-items:flex-start; }
.kat-d-side{ flex:0 0 360px; position:sticky; top:78px; }
}
@media (min-width:980px){
.kat-catgrid{ grid-template-columns:repeat(3,1fr); }
.kat-grid{ grid-template-columns:repeat(3,1fr); }
}
/* matice → karty na úzku (portrait kiosk / telefon): žádný vodorovný scroll */
@media (max-width:720px){
.kat-matrix, .kat-matrix thead, .kat-matrix tbody, .kat-matrix tr, .kat-matrix th, .kat-matrix td{ display:block; }
.kat-matrix thead{ display:none; }
.kat-matrix tr{ border:1px solid var(--line-2); border-radius:var(--r-md); overflow:hidden; margin:0 0 12px; }
.kat-matrix .kat-mx-row{ background:var(--tint); padding:11px 14px; }
.kat-matrix td.kat-mxprice, .kat-matrix td.kat-mx-off{ display:flex; justify-content:space-between; align-items:baseline;
gap:14px; border:0; border-top:1px solid var(--line); padding:12px 14px; text-align:right; }
.kat-matrix td.kat-mxprice::before, .kat-matrix td.kat-mx-off::before{ content:attr(data-col); font-family:var(--f-u);
color:var(--ink-3); font-weight:600; text-align:left; }
.kat-matrix tbody tr:nth-child(even) td:not(.kat-mx-row){ background:transparent; }
.kat-mxwrap{ overflow:visible; }
}
@media (max-width:560px){
.kat-catgrid, .kat-grid{ grid-template-columns:1fr; }
.kat-h1{ font-size:34px; }
.kat-brand-t{ display:none; }
.kat-wrap{ padding:18px 16px 64px; }
}
/* ---- hover JEN pro myš; na dotyku tap-feedback (:active) ---- */
@media (hover:hover) and (pointer:fine){
.kat-bar-home:hover{ background:var(--brand-tint); border-color:var(--brand); }
.kat-cat:hover{ transform:translateY(-3px); box-shadow:var(--sh-lg); }
.kat-tile:hover{ transform:translateY(-3px); box-shadow:var(--sh-lg); }
.kat-tile:hover .kat-tile-img{ transform:scale(1.06); }
.kat-pacc > summary:hover{ background:var(--surface); }
.kat-crumb:hover{ text-decoration:underline; }
.kat-sr-row:hover{ background:var(--brand-tint); }
}
/* ---- jemné entrance animace (vypnuté při prefers-reduced-motion) ---- */
@media (prefers-reduced-motion: no-preference){
.kat-detail, .kat-hometop, .kat-cat-title, .kat-crumbs{ animation:katFade .5s cubic-bezier(.2,.7,.2,1) both; }
.kat-cat, .kat-tile{ animation:katRise .5s cubic-bezier(.2,.7,.2,1) both; }
.kat-catgrid .kat-cat:nth-child(1), .kat-grid .kat-tile:nth-child(1){ animation-delay:.02s; }
.kat-catgrid .kat-cat:nth-child(2), .kat-grid .kat-tile:nth-child(2){ animation-delay:.06s; }
.kat-catgrid .kat-cat:nth-child(3), .kat-grid .kat-tile:nth-child(3){ animation-delay:.10s; }
.kat-catgrid .kat-cat:nth-child(4), .kat-grid .kat-tile:nth-child(4){ animation-delay:.14s; }
.kat-catgrid .kat-cat:nth-child(5), .kat-grid .kat-tile:nth-child(5){ animation-delay:.18s; }
.kat-catgrid .kat-cat:nth-child(6), .kat-grid .kat-tile:nth-child(6){ animation-delay:.22s; }
.kat-catgrid .kat-cat:nth-child(n+7), .kat-grid .kat-tile:nth-child(n+7){ animation-delay:.26s; }
}
@keyframes katFade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes katRise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
/* ===== přepínač motivu + TMAVÝ KATALOG (overlay 168) ===== */
.kat-theme{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex:0 0 auto;
border:1px solid var(--line-2); border-radius:999px; background:var(--card); color:var(--ink-1); cursor:pointer; }
.kat-theme .kat-theme-sun{ display:none; }
.kat-theme .kat-theme-moon{ display:inline; }
[data-theme="dark"] .kat-theme .kat-theme-sun{ display:inline; }
[data-theme="dark"] .kat-theme .kat-theme-moon{ display:none; }
/* tmavá paleta: černé pozadí + béžový text + zlatá (nadpisy/ceny přes --brand-2) + burgundy akcenty */
[data-theme="dark"]{
--surface:#0d0b0a; --card:#171210; --tint:#1f1815; --tint-2:#261d18;
--ink-1:#efe6d6; --ink-2:#e3d8c5; --ink-3:#b9aa92; --ink-4:#8c8069; --ink-5:#5f574a;
--line:rgba(237,229,210,.13); --line-2:rgba(237,229,210,.09); --line-3:rgba(237,229,210,.06);
--brand:#a8324c; --brand-2:#d9b65a; --brand-tint:rgba(168,50,76,.20);
--gold:#d9b65a; --gold-tint:rgba(217,182,90,.16);
--sh-sm:0 1px 2px rgba(0,0,0,.5); --sh-md:0 8px 22px rgba(0,0,0,.55); --sh-lg:0 16px 44px rgba(0,0,0,.6);
}
[data-theme="dark"] body{ background:var(--surface); color:var(--ink-1); }
[data-theme="dark"] .kat-bar{ background:rgba(13,11,10,.85); border-bottom-color:var(--line); }
[data-theme="dark"] .kat-cat{ background:var(--card); }
[data-theme="dark"] .kat-matrix tbody tr:nth-child(even) td:not(.kat-mx-row){ background:rgba(255,255,255,.02); }
[data-theme="dark"] .kat-hero-init{ color:var(--gold); opacity:.55; }
[data-theme="dark"] .kat-hllist li::before{ color:var(--gold); }
/* admin: seznam připomínek (aktivace ceníku) */
.rem-list{ margin:8px 0 0; padding-left:18px; }
.rem-list li{ margin:4px 0; }
/* katalog detail: navigace na sousední produkt (swipe / šipky) */
.kat-nav{ position:fixed; top:50%; transform:translateY(-50%); z-index:60; width:52px; height:52px;
display:flex; align-items:center; justify-content:center; border-radius:50%;
background:var(--card); color:var(--brand); border:1px solid var(--line);
box-shadow:var(--sh-md); text-decoration:none; opacity:.92; }
.kat-nav:hover{ opacity:1; }
.kat-nav--prev{ left:10px; }
.kat-nav--next{ right:10px; }
.kat-pager{ position:fixed; left:50%; bottom:14px; transform:translateX(-50%); z-index:60;
font-family:var(--f-m); font-size:12px; color:var(--ink-2); background:var(--card);
border:1px solid var(--line); border-radius:999px; padding:5px 13px; box-shadow:var(--sh-sm); }
@media (max-width:560px){ .kat-nav{ width:44px; height:44px; } }
[data-theme="dark"] .kat-nav{ color:var(--gold); }
/* follow-finger náznak: posuvný obal detailu */
.kat-detail-slide{ transition:transform .26s cubic-bezier(.22,.61,.36,1), opacity .26s ease; will-change:transform; }
.kat-detail-slide.kat-dragging{ transition:none; }
@media (prefers-reduced-motion:reduce){ .kat-detail-slide{ transition:none; } }
.inp-narrow{ width:90px; }
/* historie výplat bonusu (shift) */
.bpay-hist{ margin-top:10px; border-top:1px solid var(--line); padding-top:8px; }
.bpay-h{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3,#5b6b7a); margin-bottom:5px; }
.bpay-row{ display:flex; gap:8px; align-items:baseline; justify-content:space-between; font-size:13px; padding:2px 0; }
.bpay-row b{ font-variant-numeric:tabular-nums; }
/* admin Prodejci: ikony akcí + editační řádek */
.iconbtn{ background:none; border:1px solid var(--line); border-radius:7px; cursor:pointer; font-size:15px; line-height:1; padding:5px 8px; color:var(--ink-2,#444); }
.iconbtn:hover{ background:var(--surface); }
.iconbtn-danger{ color:#a3242f; border-color:#e4c4c7; }
.iconbtn-danger:hover{ background:#fbeced; }
.nowrap{ white-space:nowrap; }
.sed-row > td{ background:var(--surface,#faf7f1); }
.sed-form{ padding:6px 2px; }
.sed-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
.sed-grid label{ display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--ink-3,#5b6b7a); }
.sed-grid input, .sed-grid select{ font-size:14px; padding:7px 9px; }
.sed-actions{ margin-top:10px; }
/* emoji jako ikona atributu (fallback místo SVG) */
.attr-emoji{ display:inline-flex; align-items:center; justify-content:center; width:1.15em; height:1.15em; line-height:1; font-size:1.05em; }
/* admin: výběr ikony z knihovny */
.iconpick{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; max-height:150px; overflow:auto; padding:8px; border:1px solid var(--line); border-radius:8px; background:var(--surface,#faf7f1); }
.iconpick label{ cursor:pointer; border:1.5px solid transparent; border-radius:8px; padding:6px; display:inline-flex; color:var(--ink-2,#333); }
.iconpick label:hover{ background:#fff; }
.iconpick input{ position:absolute; opacity:0; pointer-events:none; }
.iconpick input:checked + svg{ color:var(--brand,#7A1F2E); }
.iconpick label:has(input:checked){ border-color:var(--brand,#7A1F2E); background:#fff; }
.attr-adm-icon{ display:inline-flex; width:26px; justify-content:center; color:var(--ink-2,#333); }
.sed-iconwrap{ margin-top:10px; }
.sed-iconwrap > .muted{ font-size:12px; }
/* --- brand mark = SVG odznak (overlay 193) ---
Marky jsou nově ![]()
s vlastním zaobleným pozadím v SVG; potlač box z původních
.* pravidel (maroon pozadí by vyplnilo průhledné rohy). Specificita img.* > .* */
img.logo-mark, img.adm-side-mark, img.login-mark, img.kat-brand-mark{
background: none; border: 0; padding: 0; object-fit: contain;
display: inline-block; vertical-align: middle;
}
img.kat-brand-mark{ width: 32px; height: 32px; }
/* ===== Admin dashboard (overlay 194) ===== */
.mt-8{ margin-top:8px; }
.dash-period{ display:inline-flex; gap:2px; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:3px; margin:10px 0 16px; }
.dash-period a{ font-family:var(--f-m); font-size:12px; letter-spacing:.04em; padding:6px 15px; border-radius:999px; color:var(--ink-3); text-decoration:none; }
.dash-period a.on{ background:var(--brand); color:#fff; }
.dash-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; margin-bottom:16px; }
.dash-kpi{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; }
.dash-kpi .k-n{ font-family:var(--f-d); font-size:26px; font-weight:350; color:var(--brand); line-height:1.05; }
.dash-kpi .k-l{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-top:8px; }
.dash-kpi .k-sub{ font-size:11px; color:var(--ink-4); margin-top:4px; }
.dash-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:16px; align-items:start; }
.dash-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; }
.dash-card h3{ font-family:var(--f-m); font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); margin:0 0 12px; font-weight:600; }
.dash-chart{ width:100%; height:auto; display:block; }
.dash-bar{ fill:var(--brand); }
.dash-bar-l{ fill:var(--ink-4); font-family:var(--f-m); font-size:9px; }
.dash-bar-v{ fill:var(--ink-3); font-family:var(--f-m); font-size:8.5px; }
.dash-row{ display:flex; align-items:center; gap:10px; padding:6px 0; }
.dash-row .nm{ flex:0 0 36%; font-size:13px; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dash-row .bar{ flex:1 1 auto; min-width:40px; }
.dash-row .v{ flex:0 0 auto; font-family:var(--f-m); font-size:12px; color:var(--ink-2); text-align:right; white-space:nowrap; }
.dash-hbar{ width:100%; height:8px; display:block; }
.dash-hbar-bg{ fill:var(--tint); }
.dash-hbar-fill{ fill:var(--brand); }
.dash-feed{ list-style:none; margin:0; padding:0; }
.dash-feed li{ display:flex; align-items:center; gap:12px; padding:9px 0; border-bottom:1px solid var(--line); }
.dash-feed li:last-child{ border-bottom:0; }
.dash-feed .f-main{ flex:1 1 auto; min-width:0; }
.dash-feed .f-p{ font-size:13px; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dash-feed .f-meta{ font-size:11px; color:var(--ink-4); margin-top:1px; }
.dash-feed .f-amt{ flex:0 0 auto; font-family:var(--f-m); font-size:12.5px; color:var(--brand); }
.dash-split{ display:flex; gap:16px; }
.dash-split .s-item{ flex:1; }
.dash-split .s-n{ font-family:var(--f-d); font-size:21px; color:var(--brand); line-height:1.1; }
.dash-split .s-l{ font-size:11px; color:var(--ink-3); font-family:var(--f-m); text-transform:uppercase; letter-spacing:.05em; margin-top:3px; }
.dash-alert{ display:flex; gap:8px; align-items:center; padding:9px 13px; border-radius:8px; background:var(--surface); margin-top:8px; font-size:13px; color:var(--ink-1); text-decoration:none; }
.dash-alert:first-of-type{ margin-top:0; }
.dash-alert.warn{ background:#FBEEEE; color:#7A2230; }
.dash-alert strong{ font-family:var(--f-m); }
/* ===== Admin sidebar: rozbalovací skupiny + hustota (overlay 195) ===== */
.adm-side-link{ padding:8px 18px; } /* o něco hustší řádky */
.adm-side-group-l{ padding:13px 18px 4px; }
/* nativní skupina — bez JS */
.adm-side-grp{ }
.adm-side-grp > summary.adm-side-sum{ list-style:none; cursor:pointer; user-select:none; }
.adm-side-grp > summary.adm-side-sum::-webkit-details-marker{ display:none; }
.adm-side-grp > summary.adm-side-sum::marker{ content:""; }
.adm-side-chev{ flex:none; color:#6F6452; transition:transform .15s ease, color .12s; }
.adm-side-grp[open] > summary .adm-side-chev{ transform:rotate(90deg); color:#9A8F78; }
.adm-side-grp > summary:hover .adm-side-chev{ color:#fff; }
/* zvýraznění rodiče, když je uvnitř aktivní stránka */
.adm-side-sum.has-active .adm-side-tx{ color:#fff; }
.adm-side-sum.has-active .adm-side-ic{ color:var(--gold); }
/* pod-položky */
.adm-side-sub{ padding:2px 0 4px; }
.adm-side-sublink{ padding-top:6px; padding-bottom:6px; padding-left:30px; font-size:13.5px; }
.adm-side-sublink .adm-side-ic{ width:16px; height:16px; }
/* svislá linka u dětí pro vizuální sounáležitost */
.adm-side-sub{ position:relative; }
.adm-side-sub::before{ content:""; position:absolute; left:25px; top:2px; bottom:6px; width:1px; background:rgba(240,198,116,.14); }
.adm-side-sublink{ border-left-color:transparent; }
.adm-side-sublink.active{ border-left-color:var(--brand); }
.ov-wrap{ max-width:1320px; padding-top:24px; }
/* page heading row: title + period switch + quick context */
.ov-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-bottom:18px; }
.ov-head-l h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.ov-head-l h1 em{ font-style:italic; color:var(--brand); }
.ov-head-sub{ color:var(--ink-3); font-size:13px; margin-top:2px; }
.ov-head-sub b{ color:var(--ink-2); font-weight:600; }
.ov-period{ display:inline-flex; background:var(--card); border:1px solid var(--line-2); border-radius:999px; padding:4px; box-shadow:var(--sh-sm); }
.ov-period a{ padding:8px 18px; border-radius:999px; font-size:13px; font-weight:700; color:var(--ink-3); text-decoration:none; transition:.12s; }
.ov-period a.on{ background:var(--brand); color:#fff; }
.ov-period a:hover:not(.on){ background:var(--tint); color:var(--ink-1); text-decoration:none; }
/* ---------------- HERO command band (dark) ---------------- */
.ov-hero{ position:relative; overflow:hidden; border-radius:var(--r-xl);
background:
radial-gradient(1200px 300px at 85% -40%, rgba(184,137,58,.22), transparent 60%),
radial-gradient(900px 360px at 8% 130%, rgba(184,137,58,.10), transparent 55%),
linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 70%, #4a1019 100%);
color:#fff; box-shadow:var(--sh-lg); margin-bottom:16px; }
.ov-hero::after{ /* subtle gold hairline grid texture */
content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
background-size:48px 48px; mask-image:linear-gradient(180deg, #000, transparent 80%); }
.ov-hero-grid{ position:relative; display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:0; }
.ov-hero-cell{ padding:26px 28px; border-right:1px solid rgba(255,255,255,.10); }
.ov-hero-cell:last-child{ border-right:0; }
.ov-hero-cell--lead{ display:flex; flex-direction:column; justify-content:center;
background:linear-gradient(180deg, rgba(0,0,0,.06), transparent); }
.ov-kl{ font-family:var(--f-m); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.ov-kl .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(184,137,58,.25); }
.ov-hero-num{ font-family:var(--f-d); font-weight:350; letter-spacing:-.02em; line-height:.92; }
.ov-hero-num--giant{ font-size:68px; }
.ov-hero-num--giant .cur{ font-size:30px; color:var(--gold-tint); margin-left:8px; font-weight:400; }
.ov-hero-num--mid{ font-size:40px; }
.ov-hero-num--mid .cur{ font-size:18px; color:var(--gold-tint); margin-left:5px; }
.ov-hero-sub{ margin-top:10px; font-size:13px; color:rgba(255,255,255,.72); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ov-trend{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-weight:700; font-size:12px; padding:3px 9px; border-radius:999px; }
.ov-trend.up{ background:rgba(124,165,90,.22); color:#cfe6b4; }
.ov-trend.down{ background:rgba(168,57,47,.26); color:#f2c2bd; }
.ov-trend.flat{ background:rgba(255,255,255,.12); color:rgba(255,255,255,.8); }
/* mini sparkline area inside lead cell */
.ov-spark{ margin-top:16px; width:100%; height:46px; display:block; }
/* the two right hero cells stack two metrics each */
.ov-hero-mini{ display:flex; flex-direction:column; gap:18px; justify-content:center; height:100%; }
.ov-hero-mini .ov-kl{ margin-bottom:5px; }
.ov-mini-row{ display:flex; align-items:baseline; gap:10px; }
.ov-mini-row .ov-hero-num--mid{ font-size:34px; }
/* warn pill when a hero metric needs attention (e.g. to-collect > 0) */
.ov-flag{ display:inline-flex; align-items:center; gap:6px; font-family:var(--f-m); font-size:11px; font-weight:700;
padding:3px 9px; border-radius:999px; background:rgba(184,137,58,.2); color:var(--gold-tint); }
/* ---------------- reference strip (catalog counts, quiet) ---------------- */
.ov-refs{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:22px; }
.ov-ref{ display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line);
border-radius:var(--r-md); padding:12px 16px; box-shadow:var(--sh-sm); text-decoration:none; color:inherit; transition:.12s; }
.ov-ref:hover{ box-shadow:var(--sh-md); transform:translateY(-1px); border-color:var(--line-3); }
.ov-ref-ic{ width:34px; height:34px; border-radius:9px; background:var(--brand-tint); color:var(--brand);
display:grid; place-items:center; flex:none; }
.ov-ref-n{ font-family:var(--f-d); font-size:24px; font-weight:400; line-height:1; color:var(--ink-1); }
.ov-ref-l{ font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-4); margin-top:3px; }
.ov-ref-go{ margin-left:auto; color:var(--ink-5); }
.ov-ref:hover .ov-ref-go{ color:var(--brand); }
/* ---------------- main work grid ---------------- */
.ov-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:16px; align-items:start; }
.ov-col{ display:flex; flex-direction:column; gap:16px; }
.ov-span2{ grid-column:span 2; }
/* generic panel used across the dashboard */
.ov-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
box-shadow:var(--sh-sm); overflow:hidden; }
.ov-card-h{ display:flex; align-items:center; justify-content:space-between; gap:10px;
padding:14px 18px; border-bottom:1px solid var(--line); }
.ov-card-h-t{ font-family:var(--f-m); font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); font-weight:700;
display:flex; align-items:center; gap:8px; }
.ov-card-h-t .ic{ color:var(--gold); }
.ov-card-h-a{ font-size:12px; font-weight:700; color:var(--brand); text-decoration:none; }
.ov-card-h-a:hover{ text-decoration:underline; }
.ov-card-meta{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:600; }
.ov-card-b{ padding:16px 18px; }
.ov-card-b--flush{ padding:6px 10px; }
/* revenue bar chart (SVG) — gold-tipped burgundy bars */
.ov-chart{ width:100%; height:200px; display:block; }
.ov-chart .bar{ fill:var(--brand); }
.ov-chart .bar.peak{ fill:url(#barGold); }
.ov-chart .axislbl{ font-family:var(--f-m); font-size:10px; fill:var(--ink-4); }
.ov-chart .vallbl{ font-family:var(--f-m); font-size:10px; fill:var(--ink-3); font-weight:700; }
.ov-chart .grid{ stroke:var(--line); stroke-width:1; }
/* leaderboard / top lists with SVG bars */
.ov-rank{ display:flex; flex-direction:column; }
.ov-rrow{ display:grid; grid-template-columns:22px 1fr auto; gap:12px; align-items:center;
padding:10px 8px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.ov-rrow:hover{ background:var(--surface); }
.ov-rk{ font-family:var(--f-m); font-size:12px; font-weight:700; color:var(--ink-4); text-align:center; }
.ov-rrow.top1 .ov-rk{ color:var(--gold); }
.ov-rname{ min-width:0; }
.ov-rname-t{ font-size:14px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ov-rname-s{ font-size:11px; color:var(--ink-4); margin-top:1px; }
.ov-rbar{ height:7px; margin-top:6px; width:100%; display:block; }
.ov-rbar rect.tr{ fill:var(--tint-2); }
.ov-rbar rect.fl{ fill:var(--brand); }
.ov-rrow.top1 .ov-rbar rect.fl{ fill:var(--gold); }
.ov-rval{ font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); white-space:nowrap; text-align:right; }
.ov-rval small{ display:block; color:var(--ink-4); font-weight:600; font-size:11px; }
/* last sales feed */
.ov-feed{ display:flex; flex-direction:column; }
.ov-frow{ display:grid; grid-template-columns:1fr auto; gap:10px; padding:11px 8px; border-top:1px solid var(--line); text-decoration:none; color:inherit; align-items:start; }
.ov-frow:first-child{ border-top:0; }
.ov-frow:hover{ background:var(--surface); }
.ov-frow > span:first-child{ display:flex; flex-direction:column; min-width:0; }
.ov-fn{ display:block; font-size:14px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ov-fm{ display:block; font-size:11px; color:var(--ink-4); margin-top:3px; font-family:var(--f-m); }
.ov-fp{ font-family:var(--f-m); font-size:14px; font-weight:700; color:var(--brand); white-space:nowrap; text-align:right; }
/* payments split (cash vs card) as one SVG stacked bar */
.ov-pay{ display:flex; flex-direction:column; gap:14px; }
.ov-pay-nums{ display:flex; justify-content:space-between; gap:16px; }
.ov-pay-cell .ov-kl{ margin-bottom:4px; }
.ov-pay-v{ font-family:var(--f-d); font-size:26px; font-weight:400; color:var(--ink-1); line-height:1; }
.ov-pay-v small{ font-size:14px; color:var(--ink-3); }
.ov-paybar{ width:100%; height:14px; display:block; }
.ov-paybar .cash{ fill:var(--gold); }
.ov-paybar .card{ fill:var(--brand); }
.ov-pay-leg{ display:flex; gap:18px; font-family:var(--f-m); font-size:11px; color:var(--ink-3); }
.ov-pay-leg i{ width:10px; height:10px; border-radius:3px; display:inline-block; margin-right:6px; vertical-align:middle; }
.ov-pay-leg .l-cash i{ background:var(--gold); }
.ov-pay-leg .l-card i{ background:var(--brand); }
/* alerts — promoted, warm, actionable */
.ov-alert{ display:flex; align-items:center; gap:14px; padding:14px 18px;
background:linear-gradient(180deg,#fff,var(--warn-tint)); border:1px solid var(--line-3);
border-left:4px solid var(--warn); border-radius:var(--r-lg); box-shadow:var(--sh-sm); }
.ov-alert-ic{ width:38px; height:38px; border-radius:10px; background:var(--warn); color:#fff; display:grid; place-items:center; flex:none; }
.ov-alert-b{ flex:1; }
.ov-alert-t{ font-weight:700; color:var(--ink-1); font-size:14px; }
.ov-alert-m{ font-size:13px; color:var(--ink-3); margin-top:2px; }
.ov-alert-m b{ font-family:var(--f-m); color:var(--warn); }
.ov-alert.ok{ background:linear-gradient(180deg,#fff,var(--ok-tint)); border-left-color:var(--ok); }
.ov-alert.ok .ov-alert-ic{ background:var(--ok); }
.ov-alert.ok .ov-alert-m b{ color:var(--ok); }
/* responsive: collapse to 2-col then 1-col */
@media (max-width:1040px){
.ov-hero-grid{ grid-template-columns:1fr 1fr; }
.ov-hero-cell--lead{ grid-column:span 2; }
.ov-grid{ grid-template-columns:1fr 1fr; }
.ov-span2{ grid-column:span 2; }
.ov-refs{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px){
.ov-hero-grid{ grid-template-columns:1fr; }
.ov-hero-cell{ border-right:0; border-bottom:1px solid rgba(255,255,255,.10); }
.ov-hero-cell--lead{ grid-column:auto; }
.ov-grid{ grid-template-columns:1fr; }
.ov-span2{ grid-column:auto; }
.ov-refs{ grid-template-columns:1fr 1fr; }
.ov-hero-num--giant{ font-size:54px; }
}
/* admin: small additions to remove inline styles (CSP) */
.ov-grid + .ov-grid{ margin-top:16px; }
.ov-kl--ink{ color:var(--ink-4); }
.ov-kl--ink .dot{ background:var(--ink-4); }
.ov-kl--ink .dot.gold{ background:var(--gold); }
.wrap--adm2{ max-width:1320px; padding-top:24px; }
/* page header: title + subtitle + primary action */
.adm2-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:8px; }
.adm2-head h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.adm2-head h1 em{ font-style:italic; color:var(--brand); }
.adm2-sub{ color:var(--ink-3); font-size:13.5px; margin-top:6px; max-width:62ch; line-height:1.5; }
.adm2-sub b{ color:var(--ink-2); }
/* ---- ADD panel at TOP (sellers) — compact, collapsible ---- */
.adm2-add{ background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin:18px 0 22px; overflow:hidden; }
.adm2-add > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:15px 20px; }
.adm2-add > summary::-webkit-details-marker{ display:none; }
.adm2-add-ic{ width:34px; height:34px; border-radius:9px; background:var(--brand); color:#fff; display:grid; place-items:center; flex:none; }
.adm2-add-t{ font-weight:700; font-size:15px; color:var(--ink-1); }
.adm2-add-t small{ display:block; font-weight:500; font-size:12px; color:var(--ink-4); margin-top:1px; }
.adm2-add-chev{ margin-left:auto; color:var(--ink-4); transition:transform .15s; }
.adm2-add[open] .adm2-add-chev{ transform:rotate(180deg); }
.adm2-add-body{ padding:4px 20px 20px; border-top:1px solid var(--line); }
/* horizontal field row — uses the wide desktop space */
.adm2-formrow{ display:grid; grid-template-columns:2fr 1.3fr 1.3fr 1.3fr auto; gap:14px; align-items:end; margin-top:16px; }
.adm2-f label{ display:block; font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.adm2-f input, .adm2-f select{ width:100%; height:42px; padding:0 12px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:14px; color:var(--ink-1); transition:.12s; }
.adm2-f input:focus, .adm2-f select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); background:#fff; }
.adm2-f input::placeholder{ color:var(--ink-5); }
.adm2-f-hint{ font-family:var(--f-m); font-size:10px; color:var(--ink-4); margin-top:5px; }
.adm2-add-actions{ display:flex; align-items:center; gap:10px; }
/* ---- toolbar: count + search + filter chips ---- */
.adm2-toolbar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:12px; }
.adm2-count{ font-family:var(--f-m); font-size:12px; color:var(--ink-3); font-weight:700; }
.adm2-count b{ color:var(--ink-1); }
.adm2-search{ position:relative; flex:1; min-width:200px; max-width:340px; }
.adm2-search svg{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ink-4); pointer-events:none; }
.adm2-search input{ width:100%; height:40px; padding:0 12px 0 38px; border:1px solid var(--line-2); border-radius:999px;
background:var(--card); font-family:var(--f-u); font-size:13.5px; color:var(--ink-1); }
.adm2-search input:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.adm2-chips{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.adm2-chip{ font-family:var(--f-m); font-size:11.5px; font-weight:700; letter-spacing:.02em; padding:7px 13px; border-radius:999px;
border:1px solid var(--line-2); background:var(--card); color:var(--ink-3); cursor:pointer; transition:.12s; user-select:none; }
.adm2-chip:hover{ border-color:var(--line-3); color:var(--ink-1); }
.adm2-chip.on{ background:var(--brand); border-color:var(--brand); color:#fff; }
.adm2-chip .n{ opacity:.7; margin-left:5px; }
/* ---- enhanced table ---- */
.adm2-tablewrap{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); overflow:hidden; }
.adm2-table{ width:100%; border-collapse:collapse; }
.adm2-table thead th{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4);
text-align:left; font-weight:700; padding:13px 16px; background:var(--tint); border-bottom:1px solid var(--line-2); white-space:nowrap; }
.adm2-table thead th.sortable{ cursor:pointer; }
.adm2-table thead th.sortable:hover{ color:var(--ink-1); }
.adm2-table thead th .ar{ color:var(--brand); margin-left:4px; }
.adm2-table thead th.num, .adm2-table td.num{ text-align:right; }
.adm2-table tbody td{ padding:13px 16px; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-2); vertical-align:middle; }
.adm2-table tbody tr:last-child td{ border-bottom:0; }
.adm2-table tbody tr:hover{ background:var(--surface); }
.adm2-table tbody tr.dim{ opacity:.62; }
.adm2-table tbody tr.is-archived{ background:repeating-linear-gradient(135deg,transparent,transparent 8px,rgba(154,147,136,.05) 8px,rgba(154,147,136,.05) 16px); }
.adm2-name{ font-weight:700; color:var(--ink-1); }
.adm2-id{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:500; margin-left:5px; }
.adm2-rev{ font-family:var(--f-m); font-weight:700; color:var(--ink-1); }
.adm2-rev small{ color:var(--ink-4); font-weight:500; margin-left:3px; }
.adm2-muted{ color:var(--ink-4); }
.adm2-mono{ font-family:var(--f-m); font-size:13px; color:var(--ink-3); }
/* status / state pills */
.adm2-pill{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; letter-spacing:.04em;
text-transform:uppercase; padding:4px 9px; border-radius:999px; white-space:nowrap; }
.adm2-pill.active{ background:var(--ok-tint); color:var(--ok); }
.adm2-pill.archived{ background:var(--tint-2); color:var(--ink-3); }
.adm2-pill.inactive{ background:var(--bad-tint); color:var(--bad); }
.adm2-pill.dot::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block; }
.adm2-pill.nosales{ background:var(--tint); color:var(--ink-4); }
.adm2-pill.sales{ background:var(--ok-tint); color:var(--ok); }
/* verified vs not-verified — make "not verified" clearly a risk */
.adm2-vbadge{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:4px 9px; border-radius:999px; }
.adm2-vbadge.yes{ background:var(--ok-tint); color:var(--ok); }
.adm2-vbadge.no{ background:var(--warn-tint); color:var(--warn); border:1px dashed var(--warn); }
/* revenue mini-bar in table (SVG, data-driven) */
.adm2-bar{ width:90px; height:6px; display:inline-block; vertical-align:middle; margin-left:10px; }
.adm2-bar rect.tr{ fill:var(--tint-2); }
.adm2-bar rect.fl{ fill:var(--brand); }
tr.top1 .adm2-bar rect.fl{ fill:var(--gold); }
/* row actions */
.adm2-actions{ display:flex; align-items:center; gap:6px; justify-content:flex-end; }
.adm2-iconbtn{ width:34px; height:34px; border-radius:9px; border:1px solid var(--line-2); background:var(--card); color:var(--ink-3);
display:grid; place-items:center; cursor:pointer; transition:.12s; text-decoration:none; }
.adm2-iconbtn:hover{ border-color:var(--line-3); color:var(--ink-1); background:var(--surface); }
.adm2-iconbtn.edit:hover{ border-color:var(--brand); color:var(--brand); background:var(--brand-tint); }
.adm2-iconbtn.danger:hover{ border-color:var(--bad); color:var(--bad); background:var(--bad-tint); }
.adm2-iconbtn[aria-disabled="true"]{ opacity:.4; cursor:not-allowed; }
.adm2-linkbtn{ font-size:13px; font-weight:700; color:var(--brand); text-decoration:none; padding:6px 8px; border-radius:7px; }
.adm2-linkbtn:hover{ background:var(--brand-tint); }
.adm2-linkbtn.warn{ color:var(--warn); }
.adm2-linkbtn.warn:hover{ background:var(--warn-tint); }
/* duplicate hint inline */
.adm2-dup{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; color:var(--warn);
background:var(--warn-tint); padding:3px 8px; border-radius:999px; margin-left:8px; }
/* empty state for a filter that matches nothing */
.adm2-empty{ padding:40px 20px; text-align:center; color:var(--ink-4); }
.adm2-empty h3{ font-family:var(--f-d); font-weight:400; font-size:18px; color:var(--ink-2); margin:0 0 4px; }
/* ============ AGENCIES split: table left + sticky edit panel right ============ */
.adm2-split{ display:grid; grid-template-columns:1fr 420px; gap:18px; align-items:start; }
.adm2-split .adm2-tablewrap{ min-width:0; }
.adm2-edit{ position:sticky; top:18px; background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-lg); box-shadow:var(--sh-md); overflow:hidden; }
.adm2-edit-h{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; padding:16px 20px; }
.adm2-edit-h-t{ font-family:var(--f-d); font-weight:400; font-size:19px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.adm2-edit-h-close{ color:rgba(255,255,255,.8); cursor:pointer; width:28px; height:28px; border-radius:7px; display:grid; place-items:center; }
.adm2-edit-h-close:hover{ background:rgba(255,255,255,.15); color:#fff; }
.adm2-edit-h-sub{ font-size:12px; color:var(--gold-tint); margin-top:3px; font-family:var(--f-m); }
.adm2-edit-b{ padding:18px 20px; max-height:calc(100vh - 130px); overflow-y:auto; }
/* verified banner at top of the edit panel */
.adm2-vbanner{ display:flex; align-items:center; gap:11px; padding:11px 13px; border-radius:var(--r-md); margin-bottom:18px; }
.adm2-vbanner.yes{ background:var(--ok-tint); }
.adm2-vbanner.no{ background:var(--warn-tint); border:1px dashed var(--warn); }
.adm2-vbanner-ic{ width:30px; height:30px; border-radius:8px; display:grid; place-items:center; color:#fff; flex:none; }
.adm2-vbanner.yes .adm2-vbanner-ic{ background:var(--ok); }
.adm2-vbanner.no .adm2-vbanner-ic{ background:var(--warn); }
.adm2-vbanner-t{ font-weight:700; font-size:13.5px; color:var(--ink-1); }
.adm2-vbanner-s{ font-size:11.5px; color:var(--ink-3); margin-top:1px; font-family:var(--f-m); }
.adm2-vbanner label{ margin-left:auto; display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; color:var(--ink-2); cursor:pointer; }
/* edit form fields (2-col grid) */
.adm2-fgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.adm2-fgrid .full{ grid-column:1/-1; }
.adm2-field label{ display:block; font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.adm2-field input, .adm2-field select, .adm2-field textarea{ width:100%; padding:9px 11px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:13.5px; color:var(--ink-1); transition:.12s; }
.adm2-field textarea{ resize:vertical; min-height:64px; line-height:1.45; }
.adm2-field input:focus, .adm2-field select:focus, .adm2-field textarea:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); background:#fff; }
.adm2-field .hint{ font-size:11px; color:var(--ink-4); margin-top:5px; line-height:1.4; }
/* color field with swatch */
.adm2-color{ display:flex; align-items:center; gap:9px; }
.adm2-color .sw{ width:38px; height:38px; border-radius:9px; border:1px solid var(--line-2); flex:none; }
.adm2-sub-h{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); font-weight:700;
margin:20px 0 10px; padding-top:14px; border-top:1px solid var(--line); }
.adm2-sub-h:first-child{ margin-top:0; padding-top:0; border-top:0; }
/* checkbox row */
.adm2-check{ display:flex; gap:11px; align-items:flex-start; padding:12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); margin-top:6px; }
.adm2-check input{ width:18px; height:18px; margin-top:1px; flex:none; accent-color:var(--brand); }
.adm2-check-t{ font-size:13px; font-weight:600; color:var(--ink-1); }
.adm2-check-s{ font-size:11.5px; color:var(--ink-3); margin-top:2px; line-height:1.4; }
/* sticky save bar */
.adm2-savebar{ position:sticky; bottom:0; display:flex; gap:10px; align-items:center; padding:14px 20px; margin:18px -20px -18px;
background:linear-gradient(180deg,rgba(251,248,241,0),var(--surface) 40%); border-top:1px solid var(--line); }
/* empty edit-panel placeholder */
.adm2-edit-empty{ padding:48px 24px; text-align:center; color:var(--ink-4); }
.adm2-edit-empty-ic{ width:48px; height:48px; border-radius:12px; background:var(--tint); color:var(--ink-4); display:grid; place-items:center; margin:0 auto 14px; }
.adm2-edit-empty h3{ font-family:var(--f-d); font-weight:400; font-size:17px; color:var(--ink-2); margin:0 0 4px; }
.adm2-edit-empty p{ font-size:13px; margin:0; line-height:1.5; }
/* responsive */
@media (max-width:1040px){
.adm2-split{ grid-template-columns:1fr; }
.adm2-edit{ position:static; }
.adm2-formrow{ grid-template-columns:1fr 1fr; }
.adm2-add-actions{ grid-column:1/-1; }
}
@media (max-width:720px){
.adm2-formrow{ grid-template-columns:1fr; }
.adm2-fgrid{ grid-template-columns:1fr; }
.adm2-table thead{ display:none; }
.adm2-table tbody td{ display:flex; justify-content:space-between; gap:12px; padding:9px 14px; }
.adm2-table tbody tr{ display:block; padding:8px 0; border-bottom:2px solid var(--line); }
}
/* active editing row highlight (agencies split) */
.adm2-table tbody tr.is-editing{ background:var(--brand-tint); box-shadow:inset 3px 0 0 var(--brand); }
.adm2-table tbody tr.is-editing:hover{ background:var(--brand-tint); }
/* edit-panel color swatch (mockup: AAI brand = --brand). In production the
server sets this per-agency; data-driven color is the one sanctioned el.style
write, or better a CSS custom property set server-side on the element. */
.adm2-color .sw{ background:var(--brand); }
/* ============================================================
DATA QUALITY AUDIT (overlay 199, prefix .ql-)
Read-only katalogová kontrola. CSP-safe, staví na tokenech.
============================================================ */
.ql-wrap{ max-width:1100px; }
.ql-sum{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:18px 0 24px; }
.ql-sumcard{ display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 18px; box-shadow:var(--sh-sm); }
.ql-sumcard .n{ font-family:var(--f-d); font-weight:400; font-size:30px; line-height:1; color:var(--ink-1); }
.ql-sumcard.bad .n{ color:var(--bad); }
.ql-sumcard.warn .n{ color:var(--warn); }
.ql-sumcard.ok .n{ color:var(--ok); }
.ql-sumcard .l{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); line-height:1.3; }
.ql-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin-bottom:14px; overflow:hidden; }
.ql-card-h{ display:flex; align-items:center; gap:11px; padding:13px 18px; border-bottom:1px solid var(--line); }
.ql-card-h .sev{ width:9px; height:9px; border-radius:50%; flex:none; }
.ql-card-h .sev.bad{ background:var(--bad); box-shadow:0 0 0 3px var(--bad-tint); }
.ql-card-h .sev.warn{ background:var(--warn); box-shadow:0 0 0 3px var(--warn-tint); }
.ql-card-h .sev.ok{ background:var(--ok); }
.ql-card-h h3{ flex:1; font-family:var(--f-d); font-weight:500; font-size:16px; margin:0; letter-spacing:-.01em; }
.ql-card-h .cnt{ font-family:var(--f-m); font-weight:700; font-size:13px; color:var(--ink-3); background:var(--tint); padding:2px 10px; border-radius:999px; }
.ql-card-d{ padding:6px 10px; }
.ql-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 10px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.ql-item:hover{ background:var(--surface); }
.ql-item:hover .go{ text-decoration:underline; }
.ql-item .nm{ font-size:13.5px; color:var(--ink-1); }
.ql-item .id{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-left:7px; }
.ql-item .go{ font-family:var(--f-m); font-size:12px; font-weight:700; color:var(--brand); white-space:nowrap; }
.ql-more{ padding:9px 12px; font-family:var(--f-m); font-size:12px; color:var(--ink-4); }
.ql-empty{ padding:18px; color:var(--ok); font-size:14px; font-weight:600; }
/* === AI CTA (tmave vyrazne tlacitko, native dropdown) === */
.ov-head-r{ display:flex; align-items:center; gap:12px; }
.ai-menu{ position:relative; display:inline-block; }
.ai-menu>summary{ list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:7px;
background:var(--ink-1); color:#F4E9CF; padding:9px 15px; border-radius:var(--r-md);
font-family:var(--f-u); font-weight:600; font-size:13.5px; line-height:1;
border:1px solid #000; box-shadow:var(--sh-md); transition:background .15s, transform .15s; }
.ai-menu>summary::-webkit-details-marker{ display:none; }
.ai-menu>summary::marker{ content:''; }
.ai-menu>summary:hover{ background:#2A2118; transform:translateY(-1px); }
.ai-menu[open]>summary{ background:#2A2118; }
.ai-menu>summary .spk{ color:var(--gold); flex:none; }
.ai-menu-pop{ position:absolute; right:0; top:calc(100% + 6px); z-index:40; min-width:250px;
background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-md);
box-shadow:var(--sh-lg); padding:6px; }
.ai-menu-pop a{ display:flex; align-items:center; gap:9px; padding:9px 11px; border-radius:var(--r-sm);
color:var(--ink-1); font-size:13px; text-decoration:none; }
.ai-menu-pop a:hover{ background:var(--tint); }
.ai-menu-pop a .ic{ color:var(--brand); flex:none; }
.ai-menu-pop a.dis{ opacity:.55; pointer-events:none; }
/* === Whats new (novinky v systemu) === */
.whatsnew{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
box-shadow:var(--sh-sm); overflow:hidden; margin:0 0 20px; }
.whatsnew>.wn-head{ display:flex; align-items:center; justify-content:space-between;
padding:12px 18px; border-bottom:1px solid var(--line); background:var(--tint); }
.wn-head h2{ font-family:var(--f-d); font-size:16px; margin:0; color:var(--ink-1); }
.wn-body{ padding:6px 18px 12px; }
.wn-pin{ background:var(--gold-tint); border:1px solid #E6D2A2; border-left:3px solid var(--gold);
border-radius:var(--r-sm); padding:11px 13px; margin:11px 0 6px; }
.wn-pin .wn-t{ font-weight:700; }
.wn-row{ display:flex; gap:14px; padding:9px 0; border-top:1px solid var(--line); }
.wn-row:first-child{ border-top:0; }
.wn-date{ color:var(--ink-4); font-size:11.5px; font-family:var(--f-m); white-space:nowrap;
min-width:78px; padding-top:1px; }
.wn-t{ font-size:13.5px; color:var(--ink-1); }
.wn-d{ font-size:12.5px; color:var(--ink-3); margin-top:2px; line-height:1.45; }
.wn-tag{ display:inline-block; font-size:10px; text-transform:uppercase; letter-spacing:.04em;
padding:1px 7px; border-radius:999px; background:var(--brand-tint); color:var(--brand-2);
font-weight:700; vertical-align:middle; margin-left:3px; }
.wn-tag.major{ background:var(--gold-tint); color:#7A5A1E; }
/* ============================================================
PTI overlay 207 — REPORTS redesign (.rpt-*), prejmenovano z .rep-
============================================================ */
.wrap--rpt{ max-width:1320px; padding-top:24px; }
/* header + filter bar */
.rpt-head{ margin-bottom:16px; }
.rpt-head h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.rpt-head h1 em{ font-style:italic; color:var(--brand); }
.rpt-head-sub{ color:var(--ink-3); font-size:13px; margin-top:4px; }
.rpt-filters{ display:flex; gap:12px; align-items:end; flex-wrap:wrap; background:var(--card); border:1px solid var(--line-2);
border-radius:var(--r-lg); padding:14px 16px; box-shadow:var(--sh-sm); margin-bottom:18px; }
.rpt-fl{ display:flex; flex-direction:column; gap:6px; }
.rpt-fl label{ font-family:var(--f-m); font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4); }
.rpt-fl input, .rpt-fl select{ height:42px; padding:0 12px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:14px; color:var(--ink-1); min-width:150px; }
.rpt-fl input:focus, .rpt-fl select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.rpt-fl-grow{ flex:1; min-width:170px; }
.rpt-filters .btn-p{ height:42px; }
.rpt-filters .rpt-export{ margin-left:auto; }
/* ---------------- HERO: month headline (dark) ---------------- */
.rpt-hero{ position:relative; overflow:hidden; border-radius:var(--r-xl); color:#fff; box-shadow:var(--sh-lg); margin-bottom:16px;
background:
radial-gradient(1100px 320px at 88% -30%, rgba(184,137,58,.24), transparent 60%),
radial-gradient(800px 300px at 5% 130%, rgba(184,137,58,.10), transparent 55%),
linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 72%, #4a1019 100%); }
.rpt-hero::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
background-size:46px 46px; mask-image:linear-gradient(180deg,#000,transparent 85%); }
.rpt-hero-grid{ position:relative; display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; }
.rpt-hero-cell{ padding:24px 26px; border-right:1px solid rgba(255,255,255,.10); }
.rpt-hero-cell:last-child{ border-right:0; }
.rpt-hero-cell--lead{ display:flex; flex-direction:column; justify-content:center; background:linear-gradient(180deg,rgba(0,0,0,.06),transparent); }
.rpt-kl{ font-family:var(--f-m); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.rpt-kl .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(184,137,58,.25); }
.rpt-hnum{ font-family:var(--f-d); font-weight:350; letter-spacing:-.02em; line-height:.92; }
.rpt-hnum--giant{ font-size:60px; } .rpt-hnum--giant .cur{ font-size:26px; color:var(--gold-tint); margin-left:7px; }
.rpt-hnum--mid{ font-size:34px; } .rpt-hnum--mid .cur{ font-size:16px; color:var(--gold-tint); margin-left:4px; }
.rpt-hsub{ margin-top:9px; font-size:12.5px; color:rgba(255,255,255,.72); display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.rpt-trend{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-weight:700; font-size:11.5px; padding:3px 9px; border-radius:999px; }
.rpt-trend.up{ background:rgba(124,165,90,.22); color:#cfe6b4; }
.rpt-trend.down{ background:rgba(168,57,47,.26); color:#f2c2bd; }
.rpt-hero-mini{ display:flex; flex-direction:column; gap:16px; justify-content:center; height:100%; }
/* donut in hero last cell */
.rpt-hero-donut{ display:flex; align-items:center; gap:16px; height:100%; }
.rpt-donut{ width:118px; height:118px; flex:none; }
.rpt-donut .seg{ fill:none; stroke-width:16; }
.rpt-donut .s-cost{ stroke:rgba(255,255,255,.28); }
.rpt-donut .s-margin{ stroke:var(--gold); }
.rpt-donut .s-bonus{ stroke:#cfe6b4; }
.rpt-donut-c{ font-family:var(--f-d); }
.rpt-donut-leg{ display:flex; flex-direction:column; gap:9px; font-size:12px; }
.rpt-donut-leg .lg{ display:flex; align-items:center; gap:8px; color:rgba(255,255,255,.85); }
.rpt-donut-leg .lg i{ width:10px; height:10px; border-radius:3px; flex:none; }
.rpt-donut-leg .lg b{ font-family:var(--f-m); margin-left:auto; padding-left:14px; }
.rpt-donut-leg .lg.l-cost i{ background:rgba(255,255,255,.4); }
.rpt-donut-leg .lg.l-margin i{ background:var(--gold); }
.rpt-donut-leg .lg.l-bonus i{ background:#cfe6b4; }
/* day strip under hero (today snapshot, quiet) */
.rpt-day{ display:grid; grid-template-columns:auto repeat(4,1fr); gap:0; background:var(--card); border:1px solid var(--line);
border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin-bottom:22px; overflow:hidden; }
.rpt-day-lbl{ display:flex; align-items:center; gap:10px; padding:16px 20px; background:var(--tint); border-right:1px solid var(--line); }
.rpt-day-lbl .t{ font-family:var(--f-d); font-size:15px; color:var(--ink-1); }
.rpt-day-lbl .d{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); }
.rpt-day-cell{ padding:14px 20px; border-right:1px solid var(--line); }
.rpt-day-cell:last-child{ border-right:0; }
.rpt-day-cell .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:5px; }
.rpt-day-cell .v{ font-family:var(--f-d); font-size:24px; color:var(--ink-1); line-height:1; }
.rpt-day-cell .v small{ font-size:13px; color:var(--ink-3); }
.rpt-day-cell .v.gold{ color:var(--gold); }
/* ---------------- panels & grid ---------------- */
.rpt-grid{ display:grid; gap:16px; align-items:start; }
.rpt-grid.g-2-1{ grid-template-columns:1.55fr 1fr; }
.rpt-grid.g-1-1{ grid-template-columns:1fr 1fr; }
.rpt-grid + .rpt-grid{ margin-top:16px; }
.rpt-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); overflow:hidden; }
.rpt-card-h{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; border-bottom:1px solid var(--line); }
.rpt-card-h-t{ font-family:var(--f-m); font-size:11px; letter-spacing:.07em; text-transform:uppercase; font-weight:700; color:var(--ink-3); display:flex; align-items:center; gap:8px; }
.rpt-card-h-t .ic{ color:var(--gold); }
.rpt-card-h-meta{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:600; }
.rpt-seg{ display:inline-flex; background:var(--tint); border-radius:999px; padding:3px; }
.rpt-seg a{ font-family:var(--f-m); font-size:11px; font-weight:700; padding:5px 11px; border-radius:999px; color:var(--ink-3); text-decoration:none; }
.rpt-seg a.on{ background:var(--brand); color:#fff; }
.rpt-card-b{ padding:18px; }
/* trend chart (daily revenue across month) */
.rpt-trendchart{ width:100%; height:240px; display:block; }
.rpt-trendchart .grid{ stroke:var(--line); stroke-width:1; }
.rpt-trendchart .gridlbl{ font-family:var(--f-m); font-size:9px; fill:var(--ink-4); }
.rpt-trendchart .axislbl{ font-family:var(--f-m); font-size:9px; fill:var(--ink-4); }
.rpt-trendchart .area{ fill:url(#repArea); }
.rpt-trendchart .line{ fill:none; stroke:var(--brand); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; }
.rpt-trendchart .pt{ fill:#fff; stroke:var(--brand); stroke-width:2; }
.rpt-trendchart .pt.peak{ fill:var(--gold); stroke:var(--gold); }
.rpt-trendchart .avgline{ stroke:var(--gold); stroke-width:1.5; stroke-dasharray:4 4; }
/* KPI mini-cards row */
.rpt-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.rpt-kpi{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--sh-sm); position:relative; overflow:hidden; }
.rpt-kpi::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; }
.rpt-kpi.k-rev::before{ background:var(--brand); }
.rpt-kpi.k-margin::before{ background:var(--gold); }
.rpt-kpi.k-cost::before{ background:var(--ink-4); }
.rpt-kpi.k-bonus::before{ background:var(--ok); }
.rpt-kpi .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.rpt-kpi .v{ font-family:var(--f-d); font-size:26px; color:var(--ink-1); line-height:1; }
.rpt-kpi .v small{ font-size:13px; color:var(--ink-3); }
.rpt-kpi .s{ font-size:11.5px; color:var(--ink-4); margin-top:5px; font-family:var(--f-m); }
.rpt-kpi .s b{ color:var(--ok); }
.rpt-kpi .s b.warn{ color:var(--warn); }
/* agency performance — horizontal bars with margin overlay */
.rpt-agency{ display:flex; flex-direction:column; }
.rpt-arow{ display:grid; grid-template-columns:150px 1fr auto; gap:14px; align-items:center; padding:9px 6px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.rpt-arow:hover{ background:var(--surface); }
.rpt-aname{ font-size:13.5px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rpt-aname small{ display:block; font-family:var(--f-m); font-size:10.5px; color:var(--ink-4); font-weight:500; }
.rpt-abar{ height:22px; width:100%; display:block; }
.rpt-abar .rev{ fill:var(--tint-2); }
.rpt-abar .margin{ fill:var(--brand); }
.rpt-arow.top1 .rpt-abar .margin{ fill:var(--gold); }
.rpt-abar .mlabel{ font-family:var(--f-m); font-size:10px; font-weight:700; fill:#fff; }
.rpt-aval{ text-align:right; white-space:nowrap; }
.rpt-aval .r{ display:block; font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); }
.rpt-aval .m{ display:block; font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-top:2px; }
.rpt-aval .m b{ color:var(--ok); }
/* margin-rate gauge ranking (right panel) */
.rpt-rate{ display:flex; flex-direction:column; gap:2px; }
.rpt-raterow{ display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; padding:8px 4px; }
.rpt-raterow .nm{ font-size:13px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rpt-ratebar{ grid-column:1/-1; height:6px; display:block; width:100%; margin-top:2px; }
.rpt-ratebar rect.tr{ fill:var(--tint-2); }
.rpt-ratebar rect.fl{ fill:var(--ok); }
.rpt-raterow.best rect.fl{ fill:var(--gold); }
.rpt-raterow.low rect.fl{ fill:var(--warn); }
.rpt-ratev{ font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); }
/* seller table with bonus/payout */
.rpt-stable{ width:100%; border-collapse:collapse; }
.rpt-stable thead th{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4);
text-align:right; font-weight:700; padding:10px 14px; background:var(--tint); border-bottom:1px solid var(--line-2); }
.rpt-stable thead th:first-child{ text-align:left; }
.rpt-stable td{ padding:11px 14px; border-bottom:1px solid var(--line); text-align:right; font-family:var(--f-m); font-size:13px; color:var(--ink-2); }
.rpt-stable td:first-child{ text-align:left; }
.rpt-stable tbody tr:last-child td{ border-bottom:0; }
.rpt-stable tbody tr:hover{ background:var(--surface); }
.rpt-sname{ font-family:var(--f-u); font-weight:700; color:var(--ink-1); }
.rpt-sname .rk{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-right:8px; }
tr.top1 .rpt-sname .rk{ color:var(--gold); }
.rpt-srev{ color:var(--ink-1); font-weight:700; }
.rpt-sbar{ width:80px; height:6px; display:inline-block; vertical-align:middle; margin-left:8px; }
.rpt-sbar rect.tr{ fill:var(--tint-2); } .rpt-sbar rect.fl{ fill:var(--brand); }
tr.top1 .rpt-sbar rect.fl{ fill:var(--gold); }
/* payout gap pill */
.rpt-gap{ display:inline-flex; align-items:center; gap:4px; font-family:var(--f-m); font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:999px; }
.rpt-gap.ok{ background:var(--ok-tint); color:var(--ok); }
.rpt-gap.pending{ background:var(--warn-tint); color:var(--warn); }
/* insight callouts */
.rpt-insights{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; }
.rpt-insight{ display:flex; gap:12px; padding:15px 16px; border-radius:var(--r-lg); border:1px solid var(--line); background:var(--card); box-shadow:var(--sh-sm); }
.rpt-insight-ic{ width:36px; height:36px; border-radius:10px; display:grid; place-items:center; color:#fff; flex:none; }
.rpt-insight.good .rpt-insight-ic{ background:var(--ok); }
.rpt-insight.watch .rpt-insight-ic{ background:var(--warn); }
.rpt-insight.info .rpt-insight-ic{ background:var(--brand); }
.rpt-insight-t{ display:block; font-weight:700; font-size:13.5px; color:var(--ink-1); }
.rpt-insight-s{ display:block; font-size:12.5px; color:var(--ink-3); margin-top:3px; line-height:1.45; }
.rpt-insight-s b{ font-family:var(--f-m); }
.rpt-insight.good .rpt-insight-s b{ color:var(--ok); }
.rpt-insight.watch .rpt-insight-s b{ color:var(--warn); }
@media (max-width:1040px){
.rpt-hero-grid{ grid-template-columns:1fr 1fr; }
.rpt-hero-cell--lead{ grid-column:span 2; }
.rpt-grid.g-2-1, .rpt-grid.g-1-1{ grid-template-columns:1fr; }
.rpt-kpis{ grid-template-columns:repeat(2,1fr); }
.rpt-insights{ grid-template-columns:1fr; }
.rpt-day{ grid-template-columns:1fr 1fr; }
.rpt-day-lbl{ grid-column:span 2; border-right:0; border-bottom:1px solid var(--line); }
}
@media (max-width:680px){
.rpt-hero-grid{ grid-template-columns:1fr; }
.rpt-hero-cell{ border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
.rpt-hnum--giant{ font-size:48px; }
.rpt-kpis{ grid-template-columns:1fr; }
}
/* reports: utility classes to replace inline styles (CSP) */
.rpt-insights--stack{ grid-template-columns:1fr; margin-top:0; gap:10px; }
.rpt-card-b--flush{ padding:0; }
.rpt-kpis--2{ grid-template-columns:1fr 1fr; margin-bottom:16px; }
.rpt-mb-10{ margin-bottom:10px; }
.rpt-insight > span:last-child{ display:flex; flex-direction:column; min-width:0; }
/* ============================================================
PTI overlay 208 — AI page redesign (.ai-*) od UX specialisty
(zadne kolize: .ai-menu/.ai-menu-pop z 202 se zde nevyskytuji)
============================================================ */
:root{
--ai-bg-0:#0e0b07; /* darkest */
--ai-bg-1:#171310; /* sidebar-ish */
--ai-bg-2:#1f1a14; /* raised panel */
--ai-line:rgba(255,255,255,.08);
--ai-line-2:rgba(255,255,255,.14);
--ai-green:#7CB342; /* bright accent green */
--ai-green-2:#A8D86A;
--ai-green-deep:#4F6A3D; /* token --ok */
--ai-gold:#D9A441;
--ai-gold-2:#F4E9CF;
--ai-cyan:#5BC6C0; /* extra accent */
--ai-violet:#9B7BD0; /* extra accent */
--ai-txt:#F3EEE4;
--ai-txt-dim:rgba(243,238,228,.62);
--ai-txt-faint:rgba(243,238,228,.4);
}
/* full-bleed dark stage that breaks out of the parchment admin shell */
.ai-stage{ position:relative; margin:-24px -40px -40px; padding:40px 40px 56px; min-height:100vh;
background:var(--ai-bg-1); color:var(--ai-txt); overflow:hidden; isolation:isolate; }
.ai-wrap{ max-width:1180px; margin:0 auto; position:relative; z-index:2; }
/* animated gradient mesh background */
.ai-mesh{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.ai-mesh span{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; mix-blend-mode:screen; }
.ai-mesh .m1{ width:520px; height:520px; left:-120px; top:-140px; background:radial-gradient(circle,#3f5a2a,transparent 70%); animation:aiFloat1 18s ease-in-out infinite; }
.ai-mesh .m2{ width:460px; height:460px; right:-100px; top:-60px; background:radial-gradient(circle,#7a5a1e,transparent 70%); animation:aiFloat2 22s ease-in-out infinite; }
.ai-mesh .m3{ width:420px; height:420px; left:30%; bottom:-160px; background:radial-gradient(circle,#234b48,transparent 70%); animation:aiFloat3 26s ease-in-out infinite; }
.ai-mesh .m4{ width:300px; height:300px; right:18%; bottom:-80px; background:radial-gradient(circle,#3a2c52,transparent 70%); animation:aiFloat1 20s ease-in-out infinite reverse; }
/* fine grid texture on top of mesh */
.ai-grid-tex{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
background-size:44px 44px; mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000,transparent 75%); }
@keyframes aiFloat1{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(40px,30px) scale(1.08);} }
@keyframes aiFloat2{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(-36px,26px) scale(1.1);} }
@keyframes aiFloat3{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(28px,-30px) scale(1.06);} }
/* ---------- hero header ---------- */
.ai-hero{ display:flex; align-items:flex-start; gap:20px; margin-bottom:30px; }
.ai-orb{ position:relative; width:74px; height:74px; flex:none; }
.ai-orb-core{ position:absolute; inset:14px; border-radius:50%;
background:radial-gradient(circle at 35% 30%, #fff, var(--ai-gold) 38%, #9a6b1f 75%);
box-shadow:0 0 24px rgba(217,164,65,.6), inset 0 0 14px rgba(255,255,255,.35);
animation:aiPulse 3.2s ease-in-out infinite; }
.ai-orb-ring{ position:absolute; inset:0; border-radius:50%; border:1.5px solid var(--ai-line-2); }
.ai-orb-ring.r2{ inset:-7px; border-color:rgba(217,164,65,.25); animation:aiSpin 9s linear infinite; border-top-color:var(--ai-gold); }
.ai-orb-ring.r3{ inset:-14px; border-color:rgba(124,179,66,.18); animation:aiSpin 14s linear infinite reverse; border-bottom-color:var(--ai-green); }
@keyframes aiPulse{ 0%,100%{ transform:scale(1); box-shadow:0 0 24px rgba(217,164,65,.55), inset 0 0 14px rgba(255,255,255,.35);} 50%{ transform:scale(1.06); box-shadow:0 0 36px rgba(217,164,65,.8), inset 0 0 18px rgba(255,255,255,.5);} }
@keyframes aiSpin{ to{ transform:rotate(360deg);} }
.ai-hero-txt h1{ font-family:var(--f-d); font-weight:350; font-size:46px; letter-spacing:-.02em; margin:0; line-height:1;
background:linear-gradient(100deg,#fff 10%,var(--ai-gold-2) 40%,var(--ai-gold) 60%,#fff 90%);
background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
animation:aiShimmer 6s linear infinite; }
@keyframes aiShimmer{ to{ background-position:200% center; } }
.ai-hero-txt h1 .sp{ font-style:italic; }
.ai-hero-sub{ color:var(--ai-txt-dim); font-size:14px; margin-top:8px; max-width:54ch; }
.ai-hero-badge{ display:inline-flex; align-items:center; gap:7px; margin-top:12px; font-family:var(--f-m); font-size:11px; font-weight:700;
letter-spacing:.05em; text-transform:uppercase; color:var(--ai-green-2); background:rgba(124,179,66,.12);
border:1px solid rgba(124,179,66,.3); padding:5px 11px; border-radius:999px; }
.ai-hero-badge .pulse{ width:7px; height:7px; border-radius:50%; background:var(--ai-green); box-shadow:0 0 0 0 rgba(124,179,66,.6); animation:aiBlip 2s ease-out infinite; }
@keyframes aiBlip{ 0%{ box-shadow:0 0 0 0 rgba(124,179,66,.6);} 70%{ box-shadow:0 0 0 8px rgba(124,179,66,0);} 100%{ box-shadow:0 0 0 0 rgba(124,179,66,0);} }
/* ---------- panels ---------- */
.ai-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:18px; align-items:start; }
.ai-panel{ position:relative; background:linear-gradient(180deg,var(--ai-bg-2),var(--ai-bg-1));
border:1px solid var(--ai-line); border-radius:var(--r-lg); padding:22px; overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.35); }
/* animated top hairline accent */
.ai-panel::before{ content:""; position:absolute; left:0; right:0; top:0; height:1px;
background:linear-gradient(90deg,transparent,var(--ai-gold),var(--ai-green),transparent);
background-size:200% 100%; animation:aiSweep 5s linear infinite; opacity:.7; }
@keyframes aiSweep{ to{ background-position:200% 0; } }
.ai-panel.span2{ grid-column:1/-1; }
.ai-panel-h{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.ai-panel-h .ic{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; flex:none;
background:rgba(217,164,65,.12); border:1px solid rgba(217,164,65,.28); color:var(--ai-gold); }
.ai-panel-h.green .ic{ background:rgba(124,179,66,.12); border-color:rgba(124,179,66,.3); color:var(--ai-green-2); }
.ai-panel-h.cyan .ic{ background:rgba(91,198,192,.12); border-color:rgba(91,198,192,.3); color:var(--ai-cyan); }
.ai-panel-h h2{ font-family:var(--f-d); font-weight:400; font-size:20px; color:#fff; margin:0; }
.ai-panel-h .sub{ font-size:12px; color:var(--ai-txt-faint); font-family:var(--f-m); }
/* status row */
.ai-status{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.ai-chip-ok{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-m); font-size:12px; font-weight:700;
letter-spacing:.05em; text-transform:uppercase; color:#0e0b07; background:linear-gradient(180deg,var(--ai-green-2),var(--ai-green));
padding:7px 13px; border-radius:999px; box-shadow:0 0 18px rgba(124,179,66,.4); }
.ai-chip-ok .tick{ width:14px; height:14px; }
.ai-model{ font-family:var(--f-m); font-size:15px; color:#fff; }
.ai-model b{ color:var(--ai-gold-2); position:relative; }
.ai-keyline{ margin-top:14px; font-size:13px; color:var(--ai-txt-dim); font-family:var(--f-m); display:flex; align-items:center; gap:8px; }
.ai-keyline code{ background:rgba(255,255,255,.06); border:1px solid var(--ai-line); border-radius:6px; padding:2px 7px; color:var(--ai-gold-2); }
.ai-keyline .lock{ color:var(--ai-green-2); }
/* tiny live latency sparkline */
.ai-latency{ display:flex; align-items:center; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--ai-line); }
.ai-latency .lbl{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ai-txt-faint); }
.ai-eq{ display:inline-flex; align-items:flex-end; gap:3px; height:22px; }
.ai-eq i{ width:3px; background:var(--ai-green); border-radius:2px; animation:aiEq 1.1s ease-in-out infinite; }
.ai-eq i:nth-child(1){ animation-delay:0s; } .ai-eq i:nth-child(2){ animation-delay:.12s; }
.ai-eq i:nth-child(3){ animation-delay:.24s; } .ai-eq i:nth-child(4){ animation-delay:.36s; }
.ai-eq i:nth-child(5){ animation-delay:.48s; } .ai-eq i:nth-child(6){ animation-delay:.6s; }
.ai-eq i:nth-child(7){ animation-delay:.72s; }
@keyframes aiEq{ 0%,100%{ height:5px; opacity:.5;} 50%{ height:22px; opacity:1;} }
/* ---------- tool cards ---------- */
.ai-tools{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; }
.ai-tool{ position:relative; display:flex; flex-direction:column; gap:10px; padding:18px; border-radius:var(--r-md);
background:rgba(255,255,255,.03); border:1px solid var(--ai-line); cursor:pointer; text-decoration:none;
color:var(--ai-txt); overflow:hidden; transition:transform .18s, border-color .18s, background .18s; }
.ai-tool::after{ content:""; position:absolute; inset:0; border-radius:inherit; opacity:0; transition:opacity .2s;
background:radial-gradient(300px circle at var(--mx,50%) var(--my,0%), rgba(217,164,65,.12), transparent 60%); }
.ai-tool:hover{ transform:translateY(-4px); border-color:var(--ai-line-2); background:rgba(255,255,255,.05); text-decoration:none; }
.ai-tool:hover::after{ opacity:1; }
.ai-tool-ic{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; flex:none;
background:linear-gradient(140deg,rgba(217,164,65,.2),rgba(124,179,66,.14)); border:1px solid var(--ai-line-2); color:var(--ai-gold-2); }
.ai-tool.t-green .ai-tool-ic{ background:linear-gradient(140deg,rgba(124,179,66,.22),rgba(91,198,192,.12)); color:var(--ai-green-2); }
.ai-tool.t-cyan .ai-tool-ic{ background:linear-gradient(140deg,rgba(91,198,192,.22),rgba(155,123,208,.12)); color:var(--ai-cyan); }
.ai-tool-t{ font-weight:700; font-size:14.5px; color:#fff; line-height:1.3; }
.ai-tool-d{ font-size:12px; color:var(--ai-txt-dim); line-height:1.45; }
.ai-tool-go{ margin-top:auto; display:inline-flex; align-items:center; gap:6px; font-family:var(--f-m); font-size:11px; font-weight:700;
letter-spacing:.04em; text-transform:uppercase; color:var(--ai-gold); }
.ai-tool:hover .ai-tool-go .arr{ transform:translateX(4px); }
.ai-tool-go .arr{ transition:transform .18s; }
/* ---------- test connection ---------- */
.ai-test{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.ai-test-txt{ flex:1; min-width:220px; }
.ai-test-txt p{ color:var(--ai-txt-dim); font-size:13.5px; margin:0; }
.ai-btn{ display:inline-flex; align-items:center; gap:9px; font-family:var(--f-u); font-weight:700; font-size:14px;
padding:12px 22px; border-radius:var(--r-md); border:0; cursor:pointer; color:#0e0b07;
background:linear-gradient(180deg,var(--ai-gold-2),var(--ai-gold)); box-shadow:0 0 22px rgba(217,164,65,.35); transition:transform .15s, box-shadow .2s; }
.ai-btn:hover{ transform:translateY(-2px); box-shadow:0 0 30px rgba(217,164,65,.55); }
.ai-btn .spark{ width:16px; height:16px; }
.ai-btn-green{ color:#0e0b07; background:linear-gradient(180deg,var(--ai-green-2),var(--ai-green)); box-shadow:0 0 22px rgba(124,179,66,.35); }
.ai-btn-green:hover{ box-shadow:0 0 30px rgba(124,179,66,.55); }
.ai-btn-ghost{ background:transparent; color:var(--ai-txt); border:1px solid var(--ai-line-2); box-shadow:none; }
.ai-btn-ghost:hover{ background:rgba(255,255,255,.05); box-shadow:none; }
/* result line that "types in" */
.ai-test-result{ margin-top:16px; padding-top:16px; border-top:1px solid var(--ai-line); font-family:var(--f-m); font-size:13px; color:var(--ai-green-2); display:flex; align-items:center; gap:8px; }
.ai-typing{ display:inline-flex; gap:4px; }
.ai-typing i{ width:6px; height:6px; border-radius:50%; background:var(--ai-gold); animation:aiType 1.2s ease-in-out infinite; }
.ai-typing i:nth-child(2){ animation-delay:.18s; } .ai-typing i:nth-child(3){ animation-delay:.36s; }
@keyframes aiType{ 0%,60%,100%{ transform:translateY(0); opacity:.4;} 30%{ transform:translateY(-5px); opacity:1;} }
/* ---------- quick prompt ---------- */
.ai-prompt-wrap{ position:relative; }
.ai-prompt{ width:100%; min-height:130px; resize:vertical; padding:16px 18px; border-radius:var(--r-md);
background:rgba(0,0,0,.28); border:1px solid var(--ai-line-2); color:var(--ai-txt); font:inherit; font-size:15px; line-height:1.5; transition:border-color .18s, box-shadow .18s; }
.ai-prompt::placeholder{ color:var(--ai-txt-faint); }
.ai-prompt:focus{ outline:none; border-color:var(--ai-gold); box-shadow:0 0 0 3px rgba(217,164,65,.18), 0 0 30px rgba(217,164,65,.12) inset; }
.ai-prompt-bar{ display:flex; align-items:center; gap:12px; margin-top:14px; }
.ai-prompt-hint{ font-family:var(--f-m); font-size:11px; color:var(--ai-txt-faint); margin-left:auto; }
.ai-prompt-hint kbd{ background:rgba(255,255,255,.07); border:1px solid var(--ai-line); border-radius:5px; padding:2px 6px; color:var(--ai-txt-dim); font-family:var(--f-m); }
/* suggested prompt chips */
.ai-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.ai-prchip{ font-size:12.5px; color:var(--ai-txt-dim); background:rgba(255,255,255,.04); border:1px solid var(--ai-line);
border-radius:999px; padding:7px 13px; cursor:pointer; transition:.15s; }
.ai-prchip:hover{ color:#fff; border-color:var(--ai-gold); background:rgba(217,164,65,.1); }
/* usage stat tiles (new proposed) */
.ai-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ai-stat{ background:rgba(255,255,255,.03); border:1px solid var(--ai-line); border-radius:var(--r-md); padding:15px 16px; }
.ai-stat .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ai-txt-faint); margin-bottom:6px; }
.ai-stat .v{ font-family:var(--f-d); font-size:28px; color:#fff; line-height:1; }
.ai-stat .v.gold{ color:var(--ai-gold-2); } .ai-stat .v.green{ color:var(--ai-green-2); }
.ai-stat .s{ font-size:11px; color:var(--ai-txt-dim); margin-top:5px; font-family:var(--f-m); }
@media (max-width:1040px){
.ai-stage{ margin:-24px -20px -40px; padding:32px 20px 48px; }
.ai-grid{ grid-template-columns:1fr; }
.ai-tools{ grid-template-columns:1fr; }
.ai-stats{ grid-template-columns:1fr; }
.ai-hero-txt h1{ font-size:38px; }
}
/* honor reduced-motion: kill all the animation, keep the look */
@media (prefers-reduced-motion: reduce){
.ai-mesh span, .ai-orb-core, .ai-orb-ring, .ai-hero-txt h1, .ai-panel::before,
.ai-eq i, .ai-typing i, .ai-hero-badge .pulse{ animation:none !important; }
.ai-hero-txt h1{ -webkit-text-fill-color:var(--ai-gold-2); }
}
/* AI page — admin-shell breakout + not-configured states (overlay 208) */
.wrap--admin .ai-stage{ margin:-28px -28px -48px 0; }
.ai-chip-bad{ display:inline-flex; align-items:center; gap:7px; padding:6px 13px; border-radius:999px;
font-weight:700; font-size:13px; background:rgba(168,57,47,.18); color:#ED8B82; border:1px solid rgba(168,57,47,.45); }
.ai-orb.is-off{ filter:grayscale(.85); opacity:.55; }
.ai-tool.is-disabled{ opacity:.5; pointer-events:none; }
.ai-tools{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
/* ============================================================
PTI overlay 211 - AI "magic" sparkle na CTA a tlacitkach
Jemna, vkusna zivost na AI vstupnich bodech v adminu.
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.ai-menu>summary{ position:relative; overflow:hidden; }
.btn-ai{ position:relative; overflow:hidden; }
.btn-ai .spk{ color:var(--gold); flex:none; vertical-align:-2px; margin-right:5px; }
.ai-menu-pop a .ic{ transition:transform .16s ease; }
.ai-menu-pop a:hover .ic{ transform:scale(1.14) rotate(-6deg); }
@media (prefers-reduced-motion: no-preference){
@keyframes aiSpkTwinkle{ 0%,100%{ transform:scale(1) rotate(0); opacity:.82; } 45%{ transform:scale(1.22) rotate(10deg); opacity:1; } }
@keyframes aiSheen{ 0%{ transform:translateX(-150%) skewX(-18deg); } 100%{ transform:translateX(190%) skewX(-18deg); } }
@keyframes aiCtaGlow{ 0%,100%{ box-shadow:var(--sh-md), 0 0 0 0 rgba(184,137,58,0); } 50%{ box-shadow:var(--sh-md), 0 0 18px 1px rgba(184,137,58,.34); } }
@keyframes aiItemIn{ from{ opacity:0; transform:translateY(-5px); } to{ opacity:1; transform:none; } }
.ai-menu>summary{ animation:aiCtaGlow 3.4s ease-in-out infinite; }
.ai-menu>summary .spk{ animation:aiSpkTwinkle 2.4s ease-in-out infinite; transform-origin:center; }
.ai-menu>summary::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:46%; pointer-events:none;
background:linear-gradient(100deg, transparent, rgba(244,233,207,.30), transparent);
animation:aiSheen 5s ease-in-out infinite; animation-delay:1.4s; }
.ai-menu>summary:hover{ animation-duration:1.8s; }
.ai-menu>summary:hover .spk{ animation-duration:1.05s; }
.ai-menu>summary:hover::before{ animation-duration:2.1s; }
.ai-menu[open] .ai-menu-pop a{ animation:aiItemIn .3s ease both; }
.ai-menu[open] .ai-menu-pop a:nth-child(2){ animation-delay:.06s; }
.ai-menu[open] .ai-menu-pop a:nth-child(3){ animation-delay:.12s; }
.btn-ai .spk{ animation:aiSpkTwinkle 2.6s ease-in-out infinite; transform-origin:center; }
.btn-ai::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:46%; pointer-events:none;
background:linear-gradient(100deg, transparent, rgba(184,137,58,.16), transparent);
animation:aiSheen 6s ease-in-out infinite; animation-delay:2s; }
.btn-ai:hover{ box-shadow:0 0 14px 0 rgba(184,137,58,.30); }
.btn-ai:hover .spk{ animation-duration:1.1s; }
}
/* ============================================================
PTI overlay 211 — vice "kouzla" na AI prvcich napric adminem
(zlata AI ikona v sidebaru, idle glow na .btn-ai)
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.adm-side-link[href="/admin/ai.php"] .adm-side-ic{ stroke:var(--gold); }
.adm-side-link[href="/admin/ai.php"].active .adm-side-ic{ stroke:var(--gold); }
@media (prefers-reduced-motion: no-preference){
@keyframes aiNavGlow{ 0%,100%{ filter:drop-shadow(0 0 0 rgba(217,164,65,0)); transform:scale(1); }
50%{ filter:drop-shadow(0 0 4px rgba(217,164,65,.7)); transform:scale(1.1); } }
@keyframes aiBtnBreathe{ 0%,100%{ box-shadow:0 0 0 0 rgba(184,137,58,0); } 50%{ box-shadow:0 0 11px 0 rgba(184,137,58,.28); } }
.adm-side-link[href="/admin/ai.php"] .adm-side-ic{ animation:aiNavGlow 3.2s ease-in-out infinite; transform-origin:center; }
.adm-side-link[href="/admin/ai.php"]:hover .adm-side-ic{ animation-duration:1.4s; }
.btn-ai:not(:disabled){ animation:aiBtnBreathe 3.8s ease-in-out infinite; }
.btn-ai:not(:disabled):hover{ animation-duration:1.5s; }
}
/* ============================================================
PTI overlay 212 — animovane potvrzeni uspechu (.flash-ok)
Kreslici se fajfka + jiskricky u "vytvoreni". Zustava videt,
aby uzivatel nemel pocit, ze akce neprosla (zadne duplicity).
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.flash-ok{ display:flex; align-items:center; gap:13px; padding:13px 18px; margin:0 0 16px;
border-radius:var(--r-md); background:var(--ok-tint); border:1px solid rgba(79,106,61,.35);
color:var(--ink-2); font-weight:500; position:relative; overflow:visible; box-shadow:var(--sh-sm); }
.flash-ok .flash-tx{ flex:1; min-width:0; }
.flash-ok .flash-tx b{ color:var(--ink-1); }
.flash-ic{ flex:none; width:30px; height:30px; display:block; }
.flash-ic svg{ width:30px; height:30px; display:block; overflow:visible; }
.flash-ic .fc{ fill:none; stroke:var(--ok); stroke-width:2.5; opacity:.5; }
.flash-ic .fk{ fill:none; stroke:var(--ok); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.flash-spark{ position:absolute; left:31px; top:50%; width:0; height:0; pointer-events:none; }
.flash-spark i{ position:absolute; width:6px; height:6px; margin:-3px; border-radius:50%; opacity:0; }
.flash-spark i:nth-child(1){ --fly:translate(-22px,-20px); background:var(--gold); }
.flash-spark i:nth-child(2){ --fly:translate(0,-28px); background:var(--ok); }
.flash-spark i:nth-child(3){ --fly:translate(22px,-20px); background:var(--gold); }
.flash-spark i:nth-child(4){ --fly:translate(27px,9px); background:var(--ok); }
.flash-spark i:nth-child(5){ --fly:translate(-27px,9px); background:var(--ok); }
.flash-spark i:nth-child(6){ --fly:translate(2px,25px); background:var(--gold); }
@media (prefers-reduced-motion: no-preference){
@keyframes flashIn{ from{ opacity:0; transform:translateY(-8px) scale(.97); } to{ opacity:1; transform:none; } }
@keyframes flashStroke{ to{ stroke-dashoffset:0; } }
@keyframes flashGlow{ 0%,100%{ box-shadow:var(--sh-sm); } 35%{ box-shadow:var(--sh-sm), 0 0 16px 1px rgba(79,106,61,.42); } }
@keyframes flashSpark{ 0%{ opacity:1; transform:translate(0,0) scale(.3); } 70%{ opacity:1; } 100%{ opacity:0; transform:var(--fly) scale(1); } }
.flash-pop{ animation:flashIn .45s cubic-bezier(.2,.9,.3,1.3) both, flashGlow 1.7s ease .2s 1; }
.flash-pop .fc{ stroke-dasharray:145; stroke-dashoffset:145; animation:flashStroke .5s ease .08s forwards; }
.flash-pop .fk{ stroke-dasharray:42; stroke-dashoffset:42; animation:flashStroke .32s ease .45s forwards; }
.flash-celebrate .flash-spark i{ animation:flashSpark .85s ease-out .4s both; }
}
/* Prodejni sekce: ozivit fajfku po dokonceni prodeje (success.php) — cele CSS, bez zmeny PHP */
.success-check{ position:relative; }
@media (prefers-reduced-motion: no-preference){
@keyframes succPop{ 0%{ transform:scale(0) rotate(-25deg); } 60%{ transform:scale(1.18) rotate(6deg); } 100%{ transform:scale(1) rotate(0); } }
@keyframes succRing{ 0%{ transform:scale(.62); opacity:.5; } 100%{ transform:scale(2.1); opacity:0; } }
@keyframes succGlow{ 0%,100%{ box-shadow:0 0 0 0 rgba(79,106,61,0); } 45%{ box-shadow:0 0 0 7px rgba(79,106,61,.16); } }
.success-check{ animation:succPop .55s cubic-bezier(.2,.9,.3,1.5) both, succGlow 2.4s ease .5s 2; }
.success-check::after{ content:''; position:absolute; inset:0; border-radius:50%; border:2px solid var(--ok);
animation:succRing 1.1s ease-out .25s 2; pointer-events:none; }
}
/* ============================================================
PTI overlay 213 — payment: vyber platby presunut do Summary panelu
Segmentovy prepinac (default Card), echo na tlacitku — VSE pure CSS.
Radia jsou primi potomci .pay-side PRED .paysum-method i .pay-confirm,
takze ~ dosahne na segment i echo (zadny JS, CSP ciste).
============================================================ */
.pay-side > input[name="payment_method"]{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.paysum-method{ margin-top:16px; }
.paysum-method-l{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.paysum-method-l .t{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); font-weight:700; }
.paysum-method-l .hint{ font-size:11px; color:var(--ink-4); }
.paysum-seg{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.paysum-seg label{ display:flex; align-items:center; justify-content:center; gap:9px; height:54px; border-radius:var(--r-md);
border:1.5px solid var(--line-2); background:var(--surface); cursor:pointer; font-weight:700; font-size:15px; color:var(--ink-2);
transition:.14s; user-select:none; }
.paysum-seg label .ic{ color:var(--ink-4); transition:.14s; display:inline-flex; }
.paysum-seg label:hover{ border-color:var(--line-3); background:#fff; }
#pm-card:checked ~ .paysum-method label[for="pm-card"],
#pm-cash:checked ~ .paysum-method label[for="pm-cash"]{ border-color:var(--brand); background:var(--brand); color:#fff; box-shadow:0 4px 12px rgba(122,31,46,.22); }
#pm-card:checked ~ .paysum-method label[for="pm-card"] .ic,
#pm-cash:checked ~ .paysum-method label[for="pm-cash"] .ic{ color:#fff; }
#pm-card:focus-visible ~ .paysum-method label[for="pm-card"],
#pm-cash:focus-visible ~ .paysum-method label[for="pm-cash"]{ box-shadow:0 0 0 3px var(--brand-tint); }
.paysum-method-note{ font-size:11.5px; color:var(--ink-4); margin-top:8px; line-height:1.4; }
.paysum-method-note b{ color:var(--ink-3); font-weight:600; }
.paysum-echo{ font-family:var(--f-m); font-size:13px; font-weight:700; opacity:.9; margin-left:6px; }
.paysum-echo .pe-cash{ display:none; }
#pm-cash:checked ~ .pay-confirm .paysum-echo .pe-card{ display:none; }
#pm-cash:checked ~ .pay-confirm .paysum-echo .pe-cash{ display:inline; }
.pay-moved-note{ color:var(--ink-4); }
/* ============================================================
PTI overlay 214 — AI generovani ikon pro atributy (custom: knihovna)
Custom/gen ikony v palete dedi .iconpick checked-styl (input+svg sousedi).
============================================================ */
.sr-submit{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0; }
.icon-gen{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:12px 0 2px; }
.icon-gen input[name="icon_prompt"]{ flex:1 1 240px; min-width:160px; }
.icon-gen-ok{ font-size:12px; color:var(--ok,#4F6A3D); font-weight:600; }
.iconpick label.ipick-gen, .iconpick label.ipick-custom{ position:relative; }
.iconpick label.ipick-gen::after{ content:""; position:absolute; top:1px; right:1px; width:6px; height:6px; border-radius:50%; background:var(--gold,#B8893A); }
.iconpick label.ipick-custom::after{ content:""; position:absolute; top:1px; right:1px; width:6px; height:6px; border-radius:50%; background:var(--line-3,#cbb5b9); }
/* ============================================================
PTI overlay 215 — fix: "Manage" tlacitko ve sprave adminu
.rowmenu-btn je 32x32 box pro "•••" (products.php). V admins.php
nese cele slovo (Spravovat/Manage), ktere pretekalo. Tahle varianta
necha sirku narust podle textu; base (hover/[open] burgundy) zustava.
============================================================ */
.rowmenu-btn--text{ width:auto; min-width:0; padding:0 14px; letter-spacing:normal; font-weight:600; font-size:13px; white-space:nowrap; }
/* ============================================================
PTI overlay 216 — fix: rozbalovaci menu "Manage" se u spodnich
radku orezavalo. .table ma overflow:hidden (kvuli rohum), coz
veznilo .rowmenu-pop. Tahle tabulka (admins) ma overflow:visible,
aby menu mohlo pretect dolu; rohy dorovnany rozsahem na bunky,
aby nevznikl artefakt. Ostatni .table tabulky se nemeni.
============================================================ */
.table--menus{ overflow: visible; }
.table--menus thead th:first-child{ border-top-left-radius: var(--r-lg); }
.table--menus thead th:last-child{ border-top-right-radius: var(--r-lg); }
.table--menus tbody tr:last-child td:first-child{ border-bottom-left-radius: var(--r-lg); }
.table--menus tbody tr:last-child td:last-child{ border-bottom-right-radius: var(--r-lg); }
skupina — bez JS */
.adm-side-grp{ }
.adm-side-grp > summary.adm-side-sum{ list-style:none; cursor:pointer; user-select:none; }
.adm-side-grp > summary.adm-side-sum::-webkit-details-marker{ display:none; }
.adm-side-grp > summary.adm-side-sum::marker{ content:""; }
.adm-side-chev{ flex:none; color:#6F6452; transition:transform .15s ease, color .12s; }
.adm-side-grp[open] > summary .adm-side-chev{ transform:rotate(90deg); color:#9A8F78; }
.adm-side-grp > summary:hover .adm-side-chev{ color:#fff; }
/* zvýraznění rodiče, když je uvnitř aktivní stránka */
.adm-side-sum.has-active .adm-side-tx{ color:#fff; }
.adm-side-sum.has-active .adm-side-ic{ color:var(--gold); }
/* pod-položky */
.adm-side-sub{ padding:2px 0 4px; }
.adm-side-sublink{ padding-top:6px; padding-bottom:6px; padding-left:30px; font-size:13.5px; }
.adm-side-sublink .adm-side-ic{ width:16px; height:16px; }
/* svislá linka u dětí pro vizuální sounáležitost */
.adm-side-sub{ position:relative; }
.adm-side-sub::before{ content:""; position:absolute; left:25px; top:2px; bottom:6px; width:1px; background:rgba(240,198,116,.14); }
.adm-side-sublink{ border-left-color:transparent; }
.adm-side-sublink.active{ border-left-color:var(--brand); }
.ov-wrap{ max-width:1320px; padding-top:24px; }
/* page heading row: title + period switch + quick context */
.ov-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-bottom:18px; }
.ov-head-l h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.ov-head-l h1 em{ font-style:italic; color:var(--brand); }
.ov-head-sub{ color:var(--ink-3); font-size:13px; margin-top:2px; }
.ov-head-sub b{ color:var(--ink-2); font-weight:600; }
.ov-period{ display:inline-flex; background:var(--card); border:1px solid var(--line-2); border-radius:999px; padding:4px; box-shadow:var(--sh-sm); }
.ov-period a{ padding:8px 18px; border-radius:999px; font-size:13px; font-weight:700; color:var(--ink-3); text-decoration:none; transition:.12s; }
.ov-period a.on{ background:var(--brand); color:#fff; }
.ov-period a:hover:not(.on){ background:var(--tint); color:var(--ink-1); text-decoration:none; }
/* ---------------- HERO command band (dark) ---------------- */
.ov-hero{ position:relative; overflow:hidden; border-radius:var(--r-xl);
background:
radial-gradient(1200px 300px at 85% -40%, rgba(184,137,58,.22), transparent 60%),
radial-gradient(900px 360px at 8% 130%, rgba(184,137,58,.10), transparent 55%),
linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 70%, #4a1019 100%);
color:#fff; box-shadow:var(--sh-lg); margin-bottom:16px; }
.ov-hero::after{ /* subtle gold hairline grid texture */
content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
background-size:48px 48px; mask-image:linear-gradient(180deg, #000, transparent 80%); }
.ov-hero-grid{ position:relative; display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:0; }
.ov-hero-cell{ padding:26px 28px; border-right:1px solid rgba(255,255,255,.10); }
.ov-hero-cell:last-child{ border-right:0; }
.ov-hero-cell--lead{ display:flex; flex-direction:column; justify-content:center;
background:linear-gradient(180deg, rgba(0,0,0,.06), transparent); }
.ov-kl{ font-family:var(--f-m); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.ov-kl .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(184,137,58,.25); }
.ov-hero-num{ font-family:var(--f-d); font-weight:350; letter-spacing:-.02em; line-height:.92; }
.ov-hero-num--giant{ font-size:68px; }
.ov-hero-num--giant .cur{ font-size:30px; color:var(--gold-tint); margin-left:8px; font-weight:400; }
.ov-hero-num--mid{ font-size:40px; }
.ov-hero-num--mid .cur{ font-size:18px; color:var(--gold-tint); margin-left:5px; }
.ov-hero-sub{ margin-top:10px; font-size:13px; color:rgba(255,255,255,.72); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ov-trend{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-weight:700; font-size:12px; padding:3px 9px; border-radius:999px; }
.ov-trend.up{ background:rgba(124,165,90,.22); color:#cfe6b4; }
.ov-trend.down{ background:rgba(168,57,47,.26); color:#f2c2bd; }
.ov-trend.flat{ background:rgba(255,255,255,.12); color:rgba(255,255,255,.8); }
/* mini sparkline area inside lead cell */
.ov-spark{ margin-top:16px; width:100%; height:46px; display:block; }
/* the two right hero cells stack two metrics each */
.ov-hero-mini{ display:flex; flex-direction:column; gap:18px; justify-content:center; height:100%; }
.ov-hero-mini .ov-kl{ margin-bottom:5px; }
.ov-mini-row{ display:flex; align-items:baseline; gap:10px; }
.ov-mini-row .ov-hero-num--mid{ font-size:34px; }
/* warn pill when a hero metric needs attention (e.g. to-collect > 0) */
.ov-flag{ display:inline-flex; align-items:center; gap:6px; font-family:var(--f-m); font-size:11px; font-weight:700;
padding:3px 9px; border-radius:999px; background:rgba(184,137,58,.2); color:var(--gold-tint); }
/* ---------------- reference strip (catalog counts, quiet) ---------------- */
.ov-refs{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:22px; }
.ov-ref{ display:flex; align-items:center; gap:12px; background:var(--card); border:1px solid var(--line);
border-radius:var(--r-md); padding:12px 16px; box-shadow:var(--sh-sm); text-decoration:none; color:inherit; transition:.12s; }
.ov-ref:hover{ box-shadow:var(--sh-md); transform:translateY(-1px); border-color:var(--line-3); }
.ov-ref-ic{ width:34px; height:34px; border-radius:9px; background:var(--brand-tint); color:var(--brand);
display:grid; place-items:center; flex:none; }
.ov-ref-n{ font-family:var(--f-d); font-size:24px; font-weight:400; line-height:1; color:var(--ink-1); }
.ov-ref-l{ font-family:var(--f-m); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-4); margin-top:3px; }
.ov-ref-go{ margin-left:auto; color:var(--ink-5); }
.ov-ref:hover .ov-ref-go{ color:var(--brand); }
/* ---------------- main work grid ---------------- */
.ov-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:16px; align-items:start; }
.ov-col{ display:flex; flex-direction:column; gap:16px; }
.ov-span2{ grid-column:span 2; }
/* generic panel used across the dashboard */
.ov-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
box-shadow:var(--sh-sm); overflow:hidden; }
.ov-card-h{ display:flex; align-items:center; justify-content:space-between; gap:10px;
padding:14px 18px; border-bottom:1px solid var(--line); }
.ov-card-h-t{ font-family:var(--f-m); font-size:11px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); font-weight:700;
display:flex; align-items:center; gap:8px; }
.ov-card-h-t .ic{ color:var(--gold); }
.ov-card-h-a{ font-size:12px; font-weight:700; color:var(--brand); text-decoration:none; }
.ov-card-h-a:hover{ text-decoration:underline; }
.ov-card-meta{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:600; }
.ov-card-b{ padding:16px 18px; }
.ov-card-b--flush{ padding:6px 10px; }
/* revenue bar chart (SVG) — gold-tipped burgundy bars */
.ov-chart{ width:100%; height:200px; display:block; }
.ov-chart .bar{ fill:var(--brand); }
.ov-chart .bar.peak{ fill:url(#barGold); }
.ov-chart .axislbl{ font-family:var(--f-m); font-size:10px; fill:var(--ink-4); }
.ov-chart .vallbl{ font-family:var(--f-m); font-size:10px; fill:var(--ink-3); font-weight:700; }
.ov-chart .grid{ stroke:var(--line); stroke-width:1; }
/* leaderboard / top lists with SVG bars */
.ov-rank{ display:flex; flex-direction:column; }
.ov-rrow{ display:grid; grid-template-columns:22px 1fr auto; gap:12px; align-items:center;
padding:10px 8px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.ov-rrow:hover{ background:var(--surface); }
.ov-rk{ font-family:var(--f-m); font-size:12px; font-weight:700; color:var(--ink-4); text-align:center; }
.ov-rrow.top1 .ov-rk{ color:var(--gold); }
.ov-rname{ min-width:0; }
.ov-rname-t{ font-size:14px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ov-rname-s{ font-size:11px; color:var(--ink-4); margin-top:1px; }
.ov-rbar{ height:7px; margin-top:6px; width:100%; display:block; }
.ov-rbar rect.tr{ fill:var(--tint-2); }
.ov-rbar rect.fl{ fill:var(--brand); }
.ov-rrow.top1 .ov-rbar rect.fl{ fill:var(--gold); }
.ov-rval{ font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); white-space:nowrap; text-align:right; }
.ov-rval small{ display:block; color:var(--ink-4); font-weight:600; font-size:11px; }
/* last sales feed */
.ov-feed{ display:flex; flex-direction:column; }
.ov-frow{ display:grid; grid-template-columns:1fr auto; gap:10px; padding:11px 8px; border-top:1px solid var(--line); text-decoration:none; color:inherit; align-items:start; }
.ov-frow:first-child{ border-top:0; }
.ov-frow:hover{ background:var(--surface); }
.ov-frow > span:first-child{ display:flex; flex-direction:column; min-width:0; }
.ov-fn{ display:block; font-size:14px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ov-fm{ display:block; font-size:11px; color:var(--ink-4); margin-top:3px; font-family:var(--f-m); }
.ov-fp{ font-family:var(--f-m); font-size:14px; font-weight:700; color:var(--brand); white-space:nowrap; text-align:right; }
/* payments split (cash vs card) as one SVG stacked bar */
.ov-pay{ display:flex; flex-direction:column; gap:14px; }
.ov-pay-nums{ display:flex; justify-content:space-between; gap:16px; }
.ov-pay-cell .ov-kl{ margin-bottom:4px; }
.ov-pay-v{ font-family:var(--f-d); font-size:26px; font-weight:400; color:var(--ink-1); line-height:1; }
.ov-pay-v small{ font-size:14px; color:var(--ink-3); }
.ov-paybar{ width:100%; height:14px; display:block; }
.ov-paybar .cash{ fill:var(--gold); }
.ov-paybar .card{ fill:var(--brand); }
.ov-pay-leg{ display:flex; gap:18px; font-family:var(--f-m); font-size:11px; color:var(--ink-3); }
.ov-pay-leg i{ width:10px; height:10px; border-radius:3px; display:inline-block; margin-right:6px; vertical-align:middle; }
.ov-pay-leg .l-cash i{ background:var(--gold); }
.ov-pay-leg .l-card i{ background:var(--brand); }
/* alerts — promoted, warm, actionable */
.ov-alert{ display:flex; align-items:center; gap:14px; padding:14px 18px;
background:linear-gradient(180deg,#fff,var(--warn-tint)); border:1px solid var(--line-3);
border-left:4px solid var(--warn); border-radius:var(--r-lg); box-shadow:var(--sh-sm); }
.ov-alert-ic{ width:38px; height:38px; border-radius:10px; background:var(--warn); color:#fff; display:grid; place-items:center; flex:none; }
.ov-alert-b{ flex:1; }
.ov-alert-t{ font-weight:700; color:var(--ink-1); font-size:14px; }
.ov-alert-m{ font-size:13px; color:var(--ink-3); margin-top:2px; }
.ov-alert-m b{ font-family:var(--f-m); color:var(--warn); }
.ov-alert.ok{ background:linear-gradient(180deg,#fff,var(--ok-tint)); border-left-color:var(--ok); }
.ov-alert.ok .ov-alert-ic{ background:var(--ok); }
.ov-alert.ok .ov-alert-m b{ color:var(--ok); }
/* responsive: collapse to 2-col then 1-col */
@media (max-width:1040px){
.ov-hero-grid{ grid-template-columns:1fr 1fr; }
.ov-hero-cell--lead{ grid-column:span 2; }
.ov-grid{ grid-template-columns:1fr 1fr; }
.ov-span2{ grid-column:span 2; }
.ov-refs{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:720px){
.ov-hero-grid{ grid-template-columns:1fr; }
.ov-hero-cell{ border-right:0; border-bottom:1px solid rgba(255,255,255,.10); }
.ov-hero-cell--lead{ grid-column:auto; }
.ov-grid{ grid-template-columns:1fr; }
.ov-span2{ grid-column:auto; }
.ov-refs{ grid-template-columns:1fr 1fr; }
.ov-hero-num--giant{ font-size:54px; }
}
/* admin: small additions to remove inline styles (CSP) */
.ov-grid + .ov-grid{ margin-top:16px; }
.ov-kl--ink{ color:var(--ink-4); }
.ov-kl--ink .dot{ background:var(--ink-4); }
.ov-kl--ink .dot.gold{ background:var(--gold); }
.wrap--adm2{ max-width:1320px; padding-top:24px; }
/* page header: title + subtitle + primary action */
.adm2-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:8px; }
.adm2-head h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.adm2-head h1 em{ font-style:italic; color:var(--brand); }
.adm2-sub{ color:var(--ink-3); font-size:13.5px; margin-top:6px; max-width:62ch; line-height:1.5; }
.adm2-sub b{ color:var(--ink-2); }
/* ---- ADD panel at TOP (sellers) — compact, collapsible ---- */
.adm2-add{ background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin:18px 0 22px; overflow:hidden; }
.adm2-add > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:15px 20px; }
.adm2-add > summary::-webkit-details-marker{ display:none; }
.adm2-add-ic{ width:34px; height:34px; border-radius:9px; background:var(--brand); color:#fff; display:grid; place-items:center; flex:none; }
.adm2-add-t{ font-weight:700; font-size:15px; color:var(--ink-1); }
.adm2-add-t small{ display:block; font-weight:500; font-size:12px; color:var(--ink-4); margin-top:1px; }
.adm2-add-chev{ margin-left:auto; color:var(--ink-4); transition:transform .15s; }
.adm2-add[open] .adm2-add-chev{ transform:rotate(180deg); }
.adm2-add-body{ padding:4px 20px 20px; border-top:1px solid var(--line); }
/* horizontal field row — uses the wide desktop space */
.adm2-formrow{ display:grid; grid-template-columns:2fr 1.3fr 1.3fr 1.3fr auto; gap:14px; align-items:end; margin-top:16px; }
.adm2-f label{ display:block; font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.adm2-f input, .adm2-f select{ width:100%; height:42px; padding:0 12px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:14px; color:var(--ink-1); transition:.12s; }
.adm2-f input:focus, .adm2-f select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); background:#fff; }
.adm2-f input::placeholder{ color:var(--ink-5); }
.adm2-f-hint{ font-family:var(--f-m); font-size:10px; color:var(--ink-4); margin-top:5px; }
.adm2-add-actions{ display:flex; align-items:center; gap:10px; }
/* ---- toolbar: count + search + filter chips ---- */
.adm2-toolbar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:12px; }
.adm2-count{ font-family:var(--f-m); font-size:12px; color:var(--ink-3); font-weight:700; }
.adm2-count b{ color:var(--ink-1); }
.adm2-search{ position:relative; flex:1; min-width:200px; max-width:340px; }
.adm2-search svg{ position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ink-4); pointer-events:none; }
.adm2-search input{ width:100%; height:40px; padding:0 12px 0 38px; border:1px solid var(--line-2); border-radius:999px;
background:var(--card); font-family:var(--f-u); font-size:13.5px; color:var(--ink-1); }
.adm2-search input:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.adm2-chips{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.adm2-chip{ font-family:var(--f-m); font-size:11.5px; font-weight:700; letter-spacing:.02em; padding:7px 13px; border-radius:999px;
border:1px solid var(--line-2); background:var(--card); color:var(--ink-3); cursor:pointer; transition:.12s; user-select:none; }
.adm2-chip:hover{ border-color:var(--line-3); color:var(--ink-1); }
.adm2-chip.on{ background:var(--brand); border-color:var(--brand); color:#fff; }
.adm2-chip .n{ opacity:.7; margin-left:5px; }
/* ---- enhanced table ---- */
.adm2-tablewrap{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); overflow:hidden; }
.adm2-table{ width:100%; border-collapse:collapse; }
.adm2-table thead th{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4);
text-align:left; font-weight:700; padding:13px 16px; background:var(--tint); border-bottom:1px solid var(--line-2); white-space:nowrap; }
.adm2-table thead th.sortable{ cursor:pointer; }
.adm2-table thead th.sortable:hover{ color:var(--ink-1); }
.adm2-table thead th .ar{ color:var(--brand); margin-left:4px; }
.adm2-table thead th.num, .adm2-table td.num{ text-align:right; }
.adm2-table tbody td{ padding:13px 16px; border-bottom:1px solid var(--line); font-size:14px; color:var(--ink-2); vertical-align:middle; }
.adm2-table tbody tr:last-child td{ border-bottom:0; }
.adm2-table tbody tr:hover{ background:var(--surface); }
.adm2-table tbody tr.dim{ opacity:.62; }
.adm2-table tbody tr.is-archived{ background:repeating-linear-gradient(135deg,transparent,transparent 8px,rgba(154,147,136,.05) 8px,rgba(154,147,136,.05) 16px); }
.adm2-name{ font-weight:700; color:var(--ink-1); }
.adm2-id{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:500; margin-left:5px; }
.adm2-rev{ font-family:var(--f-m); font-weight:700; color:var(--ink-1); }
.adm2-rev small{ color:var(--ink-4); font-weight:500; margin-left:3px; }
.adm2-muted{ color:var(--ink-4); }
.adm2-mono{ font-family:var(--f-m); font-size:13px; color:var(--ink-3); }
/* status / state pills */
.adm2-pill{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; letter-spacing:.04em;
text-transform:uppercase; padding:4px 9px; border-radius:999px; white-space:nowrap; }
.adm2-pill.active{ background:var(--ok-tint); color:var(--ok); }
.adm2-pill.archived{ background:var(--tint-2); color:var(--ink-3); }
.adm2-pill.inactive{ background:var(--bad-tint); color:var(--bad); }
.adm2-pill.dot::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block; }
.adm2-pill.nosales{ background:var(--tint); color:var(--ink-4); }
.adm2-pill.sales{ background:var(--ok-tint); color:var(--ok); }
/* verified vs not-verified — make "not verified" clearly a risk */
.adm2-vbadge{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:4px 9px; border-radius:999px; }
.adm2-vbadge.yes{ background:var(--ok-tint); color:var(--ok); }
.adm2-vbadge.no{ background:var(--warn-tint); color:var(--warn); border:1px dashed var(--warn); }
/* revenue mini-bar in table (SVG, data-driven) */
.adm2-bar{ width:90px; height:6px; display:inline-block; vertical-align:middle; margin-left:10px; }
.adm2-bar rect.tr{ fill:var(--tint-2); }
.adm2-bar rect.fl{ fill:var(--brand); }
tr.top1 .adm2-bar rect.fl{ fill:var(--gold); }
/* row actions */
.adm2-actions{ display:flex; align-items:center; gap:6px; justify-content:flex-end; }
.adm2-iconbtn{ width:34px; height:34px; border-radius:9px; border:1px solid var(--line-2); background:var(--card); color:var(--ink-3);
display:grid; place-items:center; cursor:pointer; transition:.12s; text-decoration:none; }
.adm2-iconbtn:hover{ border-color:var(--line-3); color:var(--ink-1); background:var(--surface); }
.adm2-iconbtn.edit:hover{ border-color:var(--brand); color:var(--brand); background:var(--brand-tint); }
.adm2-iconbtn.danger:hover{ border-color:var(--bad); color:var(--bad); background:var(--bad-tint); }
.adm2-iconbtn[aria-disabled="true"]{ opacity:.4; cursor:not-allowed; }
.adm2-linkbtn{ font-size:13px; font-weight:700; color:var(--brand); text-decoration:none; padding:6px 8px; border-radius:7px; }
.adm2-linkbtn:hover{ background:var(--brand-tint); }
.adm2-linkbtn.warn{ color:var(--warn); }
.adm2-linkbtn.warn:hover{ background:var(--warn-tint); }
/* duplicate hint inline */
.adm2-dup{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-size:10.5px; font-weight:700; color:var(--warn);
background:var(--warn-tint); padding:3px 8px; border-radius:999px; margin-left:8px; }
/* empty state for a filter that matches nothing */
.adm2-empty{ padding:40px 20px; text-align:center; color:var(--ink-4); }
.adm2-empty h3{ font-family:var(--f-d); font-weight:400; font-size:18px; color:var(--ink-2); margin:0 0 4px; }
/* ============ AGENCIES split: table left + sticky edit panel right ============ */
.adm2-split{ display:grid; grid-template-columns:1fr 420px; gap:18px; align-items:start; }
.adm2-split .adm2-tablewrap{ min-width:0; }
.adm2-edit{ position:sticky; top:18px; background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-lg); box-shadow:var(--sh-md); overflow:hidden; }
.adm2-edit-h{ background:linear-gradient(135deg,var(--brand),var(--brand-2)); color:#fff; padding:16px 20px; }
.adm2-edit-h-t{ font-family:var(--f-d); font-weight:400; font-size:19px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.adm2-edit-h-close{ color:rgba(255,255,255,.8); cursor:pointer; width:28px; height:28px; border-radius:7px; display:grid; place-items:center; }
.adm2-edit-h-close:hover{ background:rgba(255,255,255,.15); color:#fff; }
.adm2-edit-h-sub{ font-size:12px; color:var(--gold-tint); margin-top:3px; font-family:var(--f-m); }
.adm2-edit-b{ padding:18px 20px; max-height:calc(100vh - 130px); overflow-y:auto; }
/* verified banner at top of the edit panel */
.adm2-vbanner{ display:flex; align-items:center; gap:11px; padding:11px 13px; border-radius:var(--r-md); margin-bottom:18px; }
.adm2-vbanner.yes{ background:var(--ok-tint); }
.adm2-vbanner.no{ background:var(--warn-tint); border:1px dashed var(--warn); }
.adm2-vbanner-ic{ width:30px; height:30px; border-radius:8px; display:grid; place-items:center; color:#fff; flex:none; }
.adm2-vbanner.yes .adm2-vbanner-ic{ background:var(--ok); }
.adm2-vbanner.no .adm2-vbanner-ic{ background:var(--warn); }
.adm2-vbanner-t{ font-weight:700; font-size:13.5px; color:var(--ink-1); }
.adm2-vbanner-s{ font-size:11.5px; color:var(--ink-3); margin-top:1px; font-family:var(--f-m); }
.adm2-vbanner label{ margin-left:auto; display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; color:var(--ink-2); cursor:pointer; }
/* edit form fields (2-col grid) */
.adm2-fgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.adm2-fgrid .full{ grid-column:1/-1; }
.adm2-field label{ display:block; font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.adm2-field input, .adm2-field select, .adm2-field textarea{ width:100%; padding:9px 11px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:13.5px; color:var(--ink-1); transition:.12s; }
.adm2-field textarea{ resize:vertical; min-height:64px; line-height:1.45; }
.adm2-field input:focus, .adm2-field select:focus, .adm2-field textarea:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); background:#fff; }
.adm2-field .hint{ font-size:11px; color:var(--ink-4); margin-top:5px; line-height:1.4; }
/* color field with swatch */
.adm2-color{ display:flex; align-items:center; gap:9px; }
.adm2-color .sw{ width:38px; height:38px; border-radius:9px; border:1px solid var(--line-2); flex:none; }
.adm2-sub-h{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); font-weight:700;
margin:20px 0 10px; padding-top:14px; border-top:1px solid var(--line); }
.adm2-sub-h:first-child{ margin-top:0; padding-top:0; border-top:0; }
/* checkbox row */
.adm2-check{ display:flex; gap:11px; align-items:flex-start; padding:12px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-md); margin-top:6px; }
.adm2-check input{ width:18px; height:18px; margin-top:1px; flex:none; accent-color:var(--brand); }
.adm2-check-t{ font-size:13px; font-weight:600; color:var(--ink-1); }
.adm2-check-s{ font-size:11.5px; color:var(--ink-3); margin-top:2px; line-height:1.4; }
/* sticky save bar */
.adm2-savebar{ position:sticky; bottom:0; display:flex; gap:10px; align-items:center; padding:14px 20px; margin:18px -20px -18px;
background:linear-gradient(180deg,rgba(251,248,241,0),var(--surface) 40%); border-top:1px solid var(--line); }
/* empty edit-panel placeholder */
.adm2-edit-empty{ padding:48px 24px; text-align:center; color:var(--ink-4); }
.adm2-edit-empty-ic{ width:48px; height:48px; border-radius:12px; background:var(--tint); color:var(--ink-4); display:grid; place-items:center; margin:0 auto 14px; }
.adm2-edit-empty h3{ font-family:var(--f-d); font-weight:400; font-size:17px; color:var(--ink-2); margin:0 0 4px; }
.adm2-edit-empty p{ font-size:13px; margin:0; line-height:1.5; }
/* responsive */
@media (max-width:1040px){
.adm2-split{ grid-template-columns:1fr; }
.adm2-edit{ position:static; }
.adm2-formrow{ grid-template-columns:1fr 1fr; }
.adm2-add-actions{ grid-column:1/-1; }
}
@media (max-width:720px){
.adm2-formrow{ grid-template-columns:1fr; }
.adm2-fgrid{ grid-template-columns:1fr; }
.adm2-table thead{ display:none; }
.adm2-table tbody td{ display:flex; justify-content:space-between; gap:12px; padding:9px 14px; }
.adm2-table tbody tr{ display:block; padding:8px 0; border-bottom:2px solid var(--line); }
}
/* active editing row highlight (agencies split) */
.adm2-table tbody tr.is-editing{ background:var(--brand-tint); box-shadow:inset 3px 0 0 var(--brand); }
.adm2-table tbody tr.is-editing:hover{ background:var(--brand-tint); }
/* edit-panel color swatch (mockup: AAI brand = --brand). In production the
server sets this per-agency; data-driven color is the one sanctioned el.style
write, or better a CSS custom property set server-side on the element. */
.adm2-color .sw{ background:var(--brand); }
/* ============================================================
DATA QUALITY AUDIT (overlay 199, prefix .ql-)
Read-only katalogová kontrola. CSP-safe, staví na tokenech.
============================================================ */
.ql-wrap{ max-width:1100px; }
.ql-sum{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:18px 0 24px; }
.ql-sumcard{ display:flex; align-items:center; gap:13px; background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 18px; box-shadow:var(--sh-sm); }
.ql-sumcard .n{ font-family:var(--f-d); font-weight:400; font-size:30px; line-height:1; color:var(--ink-1); }
.ql-sumcard.bad .n{ color:var(--bad); }
.ql-sumcard.warn .n{ color:var(--warn); }
.ql-sumcard.ok .n{ color:var(--ok); }
.ql-sumcard .l{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); line-height:1.3; }
.ql-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin-bottom:14px; overflow:hidden; }
.ql-card-h{ display:flex; align-items:center; gap:11px; padding:13px 18px; border-bottom:1px solid var(--line); }
.ql-card-h .sev{ width:9px; height:9px; border-radius:50%; flex:none; }
.ql-card-h .sev.bad{ background:var(--bad); box-shadow:0 0 0 3px var(--bad-tint); }
.ql-card-h .sev.warn{ background:var(--warn); box-shadow:0 0 0 3px var(--warn-tint); }
.ql-card-h .sev.ok{ background:var(--ok); }
.ql-card-h h3{ flex:1; font-family:var(--f-d); font-weight:500; font-size:16px; margin:0; letter-spacing:-.01em; }
.ql-card-h .cnt{ font-family:var(--f-m); font-weight:700; font-size:13px; color:var(--ink-3); background:var(--tint); padding:2px 10px; border-radius:999px; }
.ql-card-d{ padding:6px 10px; }
.ql-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 10px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.ql-item:hover{ background:var(--surface); }
.ql-item:hover .go{ text-decoration:underline; }
.ql-item .nm{ font-size:13.5px; color:var(--ink-1); }
.ql-item .id{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-left:7px; }
.ql-item .go{ font-family:var(--f-m); font-size:12px; font-weight:700; color:var(--brand); white-space:nowrap; }
.ql-more{ padding:9px 12px; font-family:var(--f-m); font-size:12px; color:var(--ink-4); }
.ql-empty{ padding:18px; color:var(--ok); font-size:14px; font-weight:600; }
/* === AI CTA (tmave vyrazne tlacitko, native
dropdown) === */
.ov-head-r{ display:flex; align-items:center; gap:12px; }
.ai-menu{ position:relative; display:inline-block; }
.ai-menu>summary{ list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:7px;
background:var(--ink-1); color:#F4E9CF; padding:9px 15px; border-radius:var(--r-md);
font-family:var(--f-u); font-weight:600; font-size:13.5px; line-height:1;
border:1px solid #000; box-shadow:var(--sh-md); transition:background .15s, transform .15s; }
.ai-menu>summary::-webkit-details-marker{ display:none; }
.ai-menu>summary::marker{ content:''; }
.ai-menu>summary:hover{ background:#2A2118; transform:translateY(-1px); }
.ai-menu[open]>summary{ background:#2A2118; }
.ai-menu>summary .spk{ color:var(--gold); flex:none; }
.ai-menu-pop{ position:absolute; right:0; top:calc(100% + 6px); z-index:40; min-width:250px;
background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-md);
box-shadow:var(--sh-lg); padding:6px; }
.ai-menu-pop a{ display:flex; align-items:center; gap:9px; padding:9px 11px; border-radius:var(--r-sm);
color:var(--ink-1); font-size:13px; text-decoration:none; }
.ai-menu-pop a:hover{ background:var(--tint); }
.ai-menu-pop a .ic{ color:var(--brand); flex:none; }
.ai-menu-pop a.dis{ opacity:.55; pointer-events:none; }
/* === Whats new (novinky v systemu) === */
.whatsnew{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
box-shadow:var(--sh-sm); overflow:hidden; margin:0 0 20px; }
.whatsnew>.wn-head{ display:flex; align-items:center; justify-content:space-between;
padding:12px 18px; border-bottom:1px solid var(--line); background:var(--tint); }
.wn-head h2{ font-family:var(--f-d); font-size:16px; margin:0; color:var(--ink-1); }
.wn-body{ padding:6px 18px 12px; }
.wn-pin{ background:var(--gold-tint); border:1px solid #E6D2A2; border-left:3px solid var(--gold);
border-radius:var(--r-sm); padding:11px 13px; margin:11px 0 6px; }
.wn-pin .wn-t{ font-weight:700; }
.wn-row{ display:flex; gap:14px; padding:9px 0; border-top:1px solid var(--line); }
.wn-row:first-child{ border-top:0; }
.wn-date{ color:var(--ink-4); font-size:11.5px; font-family:var(--f-m); white-space:nowrap;
min-width:78px; padding-top:1px; }
.wn-t{ font-size:13.5px; color:var(--ink-1); }
.wn-d{ font-size:12.5px; color:var(--ink-3); margin-top:2px; line-height:1.45; }
.wn-tag{ display:inline-block; font-size:10px; text-transform:uppercase; letter-spacing:.04em;
padding:1px 7px; border-radius:999px; background:var(--brand-tint); color:var(--brand-2);
font-weight:700; vertical-align:middle; margin-left:3px; }
.wn-tag.major{ background:var(--gold-tint); color:#7A5A1E; }
/* ============================================================
PTI overlay 207 — REPORTS redesign (.rpt-*), prejmenovano z .rep-
============================================================ */
.wrap--rpt{ max-width:1320px; padding-top:24px; }
/* header + filter bar */
.rpt-head{ margin-bottom:16px; }
.rpt-head h1{ font-family:var(--f-d); font-weight:350; font-size:34px; letter-spacing:-.02em; margin:0; }
.rpt-head h1 em{ font-style:italic; color:var(--brand); }
.rpt-head-sub{ color:var(--ink-3); font-size:13px; margin-top:4px; }
.rpt-filters{ display:flex; gap:12px; align-items:end; flex-wrap:wrap; background:var(--card); border:1px solid var(--line-2);
border-radius:var(--r-lg); padding:14px 16px; box-shadow:var(--sh-sm); margin-bottom:18px; }
.rpt-fl{ display:flex; flex-direction:column; gap:6px; }
.rpt-fl label{ font-family:var(--f-m); font-size:10px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-4); }
.rpt-fl input, .rpt-fl select{ height:42px; padding:0 12px; border:1px solid var(--line-2); border-radius:var(--r-md);
background:var(--surface); font-family:var(--f-u); font-size:14px; color:var(--ink-1); min-width:150px; }
.rpt-fl input:focus, .rpt-fl select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.rpt-fl-grow{ flex:1; min-width:170px; }
.rpt-filters .btn-p{ height:42px; }
.rpt-filters .rpt-export{ margin-left:auto; }
/* ---------------- HERO: month headline (dark) ---------------- */
.rpt-hero{ position:relative; overflow:hidden; border-radius:var(--r-xl); color:#fff; box-shadow:var(--sh-lg); margin-bottom:16px;
background:
radial-gradient(1100px 320px at 88% -30%, rgba(184,137,58,.24), transparent 60%),
radial-gradient(800px 300px at 5% 130%, rgba(184,137,58,.10), transparent 55%),
linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 72%, #4a1019 100%); }
.rpt-hero::after{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
background-size:46px 46px; mask-image:linear-gradient(180deg,#000,transparent 85%); }
.rpt-hero-grid{ position:relative; display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; }
.rpt-hero-cell{ padding:24px 26px; border-right:1px solid rgba(255,255,255,.10); }
.rpt-hero-cell:last-child{ border-right:0; }
.rpt-hero-cell--lead{ display:flex; flex-direction:column; justify-content:center; background:linear-gradient(180deg,rgba(0,0,0,.06),transparent); }
.rpt-kl{ font-family:var(--f-m); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.rpt-kl .dot{ width:6px; height:6px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 3px rgba(184,137,58,.25); }
.rpt-hnum{ font-family:var(--f-d); font-weight:350; letter-spacing:-.02em; line-height:.92; }
.rpt-hnum--giant{ font-size:60px; } .rpt-hnum--giant .cur{ font-size:26px; color:var(--gold-tint); margin-left:7px; }
.rpt-hnum--mid{ font-size:34px; } .rpt-hnum--mid .cur{ font-size:16px; color:var(--gold-tint); margin-left:4px; }
.rpt-hsub{ margin-top:9px; font-size:12.5px; color:rgba(255,255,255,.72); display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.rpt-trend{ display:inline-flex; align-items:center; gap:5px; font-family:var(--f-m); font-weight:700; font-size:11.5px; padding:3px 9px; border-radius:999px; }
.rpt-trend.up{ background:rgba(124,165,90,.22); color:#cfe6b4; }
.rpt-trend.down{ background:rgba(168,57,47,.26); color:#f2c2bd; }
.rpt-hero-mini{ display:flex; flex-direction:column; gap:16px; justify-content:center; height:100%; }
/* donut in hero last cell */
.rpt-hero-donut{ display:flex; align-items:center; gap:16px; height:100%; }
.rpt-donut{ width:118px; height:118px; flex:none; }
.rpt-donut .seg{ fill:none; stroke-width:16; }
.rpt-donut .s-cost{ stroke:rgba(255,255,255,.28); }
.rpt-donut .s-margin{ stroke:var(--gold); }
.rpt-donut .s-bonus{ stroke:#cfe6b4; }
.rpt-donut-c{ font-family:var(--f-d); }
.rpt-donut-leg{ display:flex; flex-direction:column; gap:9px; font-size:12px; }
.rpt-donut-leg .lg{ display:flex; align-items:center; gap:8px; color:rgba(255,255,255,.85); }
.rpt-donut-leg .lg i{ width:10px; height:10px; border-radius:3px; flex:none; }
.rpt-donut-leg .lg b{ font-family:var(--f-m); margin-left:auto; padding-left:14px; }
.rpt-donut-leg .lg.l-cost i{ background:rgba(255,255,255,.4); }
.rpt-donut-leg .lg.l-margin i{ background:var(--gold); }
.rpt-donut-leg .lg.l-bonus i{ background:#cfe6b4; }
/* day strip under hero (today snapshot, quiet) */
.rpt-day{ display:grid; grid-template-columns:auto repeat(4,1fr); gap:0; background:var(--card); border:1px solid var(--line);
border-radius:var(--r-lg); box-shadow:var(--sh-sm); margin-bottom:22px; overflow:hidden; }
.rpt-day-lbl{ display:flex; align-items:center; gap:10px; padding:16px 20px; background:var(--tint); border-right:1px solid var(--line); }
.rpt-day-lbl .t{ font-family:var(--f-d); font-size:15px; color:var(--ink-1); }
.rpt-day-lbl .d{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); }
.rpt-day-cell{ padding:14px 20px; border-right:1px solid var(--line); }
.rpt-day-cell:last-child{ border-right:0; }
.rpt-day-cell .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:5px; }
.rpt-day-cell .v{ font-family:var(--f-d); font-size:24px; color:var(--ink-1); line-height:1; }
.rpt-day-cell .v small{ font-size:13px; color:var(--ink-3); }
.rpt-day-cell .v.gold{ color:var(--gold); }
/* ---------------- panels & grid ---------------- */
.rpt-grid{ display:grid; gap:16px; align-items:start; }
.rpt-grid.g-2-1{ grid-template-columns:1.55fr 1fr; }
.rpt-grid.g-1-1{ grid-template-columns:1fr 1fr; }
.rpt-grid + .rpt-grid{ margin-top:16px; }
.rpt-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-sm); overflow:hidden; }
.rpt-card-h{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; border-bottom:1px solid var(--line); }
.rpt-card-h-t{ font-family:var(--f-m); font-size:11px; letter-spacing:.07em; text-transform:uppercase; font-weight:700; color:var(--ink-3); display:flex; align-items:center; gap:8px; }
.rpt-card-h-t .ic{ color:var(--gold); }
.rpt-card-h-meta{ font-family:var(--f-m); font-size:12px; color:var(--ink-4); font-weight:600; }
.rpt-seg{ display:inline-flex; background:var(--tint); border-radius:999px; padding:3px; }
.rpt-seg a{ font-family:var(--f-m); font-size:11px; font-weight:700; padding:5px 11px; border-radius:999px; color:var(--ink-3); text-decoration:none; }
.rpt-seg a.on{ background:var(--brand); color:#fff; }
.rpt-card-b{ padding:18px; }
/* trend chart (daily revenue across month) */
.rpt-trendchart{ width:100%; height:240px; display:block; }
.rpt-trendchart .grid{ stroke:var(--line); stroke-width:1; }
.rpt-trendchart .gridlbl{ font-family:var(--f-m); font-size:9px; fill:var(--ink-4); }
.rpt-trendchart .axislbl{ font-family:var(--f-m); font-size:9px; fill:var(--ink-4); }
.rpt-trendchart .area{ fill:url(#repArea); }
.rpt-trendchart .line{ fill:none; stroke:var(--brand); stroke-width:2.5; stroke-linejoin:round; stroke-linecap:round; }
.rpt-trendchart .pt{ fill:#fff; stroke:var(--brand); stroke-width:2; }
.rpt-trendchart .pt.peak{ fill:var(--gold); stroke:var(--gold); }
.rpt-trendchart .avgline{ stroke:var(--gold); stroke-width:1.5; stroke-dasharray:4 4; }
/* KPI mini-cards row */
.rpt-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.rpt-kpi{ background:var(--card); border:1px solid var(--line); border-radius:var(--r-md); padding:14px 16px; box-shadow:var(--sh-sm); position:relative; overflow:hidden; }
.rpt-kpi::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; }
.rpt-kpi.k-rev::before{ background:var(--brand); }
.rpt-kpi.k-margin::before{ background:var(--gold); }
.rpt-kpi.k-cost::before{ background:var(--ink-4); }
.rpt-kpi.k-bonus::before{ background:var(--ok); }
.rpt-kpi .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); margin-bottom:6px; }
.rpt-kpi .v{ font-family:var(--f-d); font-size:26px; color:var(--ink-1); line-height:1; }
.rpt-kpi .v small{ font-size:13px; color:var(--ink-3); }
.rpt-kpi .s{ font-size:11.5px; color:var(--ink-4); margin-top:5px; font-family:var(--f-m); }
.rpt-kpi .s b{ color:var(--ok); }
.rpt-kpi .s b.warn{ color:var(--warn); }
/* agency performance — horizontal bars with margin overlay */
.rpt-agency{ display:flex; flex-direction:column; }
.rpt-arow{ display:grid; grid-template-columns:150px 1fr auto; gap:14px; align-items:center; padding:9px 6px; border-radius:var(--r-md); text-decoration:none; color:inherit; }
.rpt-arow:hover{ background:var(--surface); }
.rpt-aname{ font-size:13.5px; font-weight:600; color:var(--ink-1); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rpt-aname small{ display:block; font-family:var(--f-m); font-size:10.5px; color:var(--ink-4); font-weight:500; }
.rpt-abar{ height:22px; width:100%; display:block; }
.rpt-abar .rev{ fill:var(--tint-2); }
.rpt-abar .margin{ fill:var(--brand); }
.rpt-arow.top1 .rpt-abar .margin{ fill:var(--gold); }
.rpt-abar .mlabel{ font-family:var(--f-m); font-size:10px; font-weight:700; fill:#fff; }
.rpt-aval{ text-align:right; white-space:nowrap; }
.rpt-aval .r{ display:block; font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); }
.rpt-aval .m{ display:block; font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-top:2px; }
.rpt-aval .m b{ color:var(--ok); }
/* margin-rate gauge ranking (right panel) */
.rpt-rate{ display:flex; flex-direction:column; gap:2px; }
.rpt-raterow{ display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; padding:8px 4px; }
.rpt-raterow .nm{ font-size:13px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rpt-ratebar{ grid-column:1/-1; height:6px; display:block; width:100%; margin-top:2px; }
.rpt-ratebar rect.tr{ fill:var(--tint-2); }
.rpt-ratebar rect.fl{ fill:var(--ok); }
.rpt-raterow.best rect.fl{ fill:var(--gold); }
.rpt-raterow.low rect.fl{ fill:var(--warn); }
.rpt-ratev{ font-family:var(--f-m); font-size:13px; font-weight:700; color:var(--ink-1); }
/* seller table with bonus/payout */
.rpt-stable{ width:100%; border-collapse:collapse; }
.rpt-stable thead th{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4);
text-align:right; font-weight:700; padding:10px 14px; background:var(--tint); border-bottom:1px solid var(--line-2); }
.rpt-stable thead th:first-child{ text-align:left; }
.rpt-stable td{ padding:11px 14px; border-bottom:1px solid var(--line); text-align:right; font-family:var(--f-m); font-size:13px; color:var(--ink-2); }
.rpt-stable td:first-child{ text-align:left; }
.rpt-stable tbody tr:last-child td{ border-bottom:0; }
.rpt-stable tbody tr:hover{ background:var(--surface); }
.rpt-sname{ font-family:var(--f-u); font-weight:700; color:var(--ink-1); }
.rpt-sname .rk{ font-family:var(--f-m); font-size:11px; color:var(--ink-4); margin-right:8px; }
tr.top1 .rpt-sname .rk{ color:var(--gold); }
.rpt-srev{ color:var(--ink-1); font-weight:700; }
.rpt-sbar{ width:80px; height:6px; display:inline-block; vertical-align:middle; margin-left:8px; }
.rpt-sbar rect.tr{ fill:var(--tint-2); } .rpt-sbar rect.fl{ fill:var(--brand); }
tr.top1 .rpt-sbar rect.fl{ fill:var(--gold); }
/* payout gap pill */
.rpt-gap{ display:inline-flex; align-items:center; gap:4px; font-family:var(--f-m); font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:999px; }
.rpt-gap.ok{ background:var(--ok-tint); color:var(--ok); }
.rpt-gap.pending{ background:var(--warn-tint); color:var(--warn); }
/* insight callouts */
.rpt-insights{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; }
.rpt-insight{ display:flex; gap:12px; padding:15px 16px; border-radius:var(--r-lg); border:1px solid var(--line); background:var(--card); box-shadow:var(--sh-sm); }
.rpt-insight-ic{ width:36px; height:36px; border-radius:10px; display:grid; place-items:center; color:#fff; flex:none; }
.rpt-insight.good .rpt-insight-ic{ background:var(--ok); }
.rpt-insight.watch .rpt-insight-ic{ background:var(--warn); }
.rpt-insight.info .rpt-insight-ic{ background:var(--brand); }
.rpt-insight-t{ display:block; font-weight:700; font-size:13.5px; color:var(--ink-1); }
.rpt-insight-s{ display:block; font-size:12.5px; color:var(--ink-3); margin-top:3px; line-height:1.45; }
.rpt-insight-s b{ font-family:var(--f-m); }
.rpt-insight.good .rpt-insight-s b{ color:var(--ok); }
.rpt-insight.watch .rpt-insight-s b{ color:var(--warn); }
@media (max-width:1040px){
.rpt-hero-grid{ grid-template-columns:1fr 1fr; }
.rpt-hero-cell--lead{ grid-column:span 2; }
.rpt-grid.g-2-1, .rpt-grid.g-1-1{ grid-template-columns:1fr; }
.rpt-kpis{ grid-template-columns:repeat(2,1fr); }
.rpt-insights{ grid-template-columns:1fr; }
.rpt-day{ grid-template-columns:1fr 1fr; }
.rpt-day-lbl{ grid-column:span 2; border-right:0; border-bottom:1px solid var(--line); }
}
@media (max-width:680px){
.rpt-hero-grid{ grid-template-columns:1fr; }
.rpt-hero-cell{ border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
.rpt-hnum--giant{ font-size:48px; }
.rpt-kpis{ grid-template-columns:1fr; }
}
/* reports: utility classes to replace inline styles (CSP) */
.rpt-insights--stack{ grid-template-columns:1fr; margin-top:0; gap:10px; }
.rpt-card-b--flush{ padding:0; }
.rpt-kpis--2{ grid-template-columns:1fr 1fr; margin-bottom:16px; }
.rpt-mb-10{ margin-bottom:10px; }
.rpt-insight > span:last-child{ display:flex; flex-direction:column; min-width:0; }
/* ============================================================
PTI overlay 208 — AI page redesign (.ai-*) od UX specialisty
(zadne kolize: .ai-menu/.ai-menu-pop z 202 se zde nevyskytuji)
============================================================ */
:root{
--ai-bg-0:#0e0b07; /* darkest */
--ai-bg-1:#171310; /* sidebar-ish */
--ai-bg-2:#1f1a14; /* raised panel */
--ai-line:rgba(255,255,255,.08);
--ai-line-2:rgba(255,255,255,.14);
--ai-green:#7CB342; /* bright accent green */
--ai-green-2:#A8D86A;
--ai-green-deep:#4F6A3D; /* token --ok */
--ai-gold:#D9A441;
--ai-gold-2:#F4E9CF;
--ai-cyan:#5BC6C0; /* extra accent */
--ai-violet:#9B7BD0; /* extra accent */
--ai-txt:#F3EEE4;
--ai-txt-dim:rgba(243,238,228,.62);
--ai-txt-faint:rgba(243,238,228,.4);
}
/* full-bleed dark stage that breaks out of the parchment admin shell */
.ai-stage{ position:relative; margin:-24px -40px -40px; padding:40px 40px 56px; min-height:100vh;
background:var(--ai-bg-1); color:var(--ai-txt); overflow:hidden; isolation:isolate; }
.ai-wrap{ max-width:1180px; margin:0 auto; position:relative; z-index:2; }
/* animated gradient mesh background */
.ai-mesh{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.ai-mesh span{ position:absolute; border-radius:50%; filter:blur(70px); opacity:.5; mix-blend-mode:screen; }
.ai-mesh .m1{ width:520px; height:520px; left:-120px; top:-140px; background:radial-gradient(circle,#3f5a2a,transparent 70%); animation:aiFloat1 18s ease-in-out infinite; }
.ai-mesh .m2{ width:460px; height:460px; right:-100px; top:-60px; background:radial-gradient(circle,#7a5a1e,transparent 70%); animation:aiFloat2 22s ease-in-out infinite; }
.ai-mesh .m3{ width:420px; height:420px; left:30%; bottom:-160px; background:radial-gradient(circle,#234b48,transparent 70%); animation:aiFloat3 26s ease-in-out infinite; }
.ai-mesh .m4{ width:300px; height:300px; right:18%; bottom:-80px; background:radial-gradient(circle,#3a2c52,transparent 70%); animation:aiFloat1 20s ease-in-out infinite reverse; }
/* fine grid texture on top of mesh */
.ai-grid-tex{ position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5;
background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
background-size:44px 44px; mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000,transparent 75%); }
@keyframes aiFloat1{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(40px,30px) scale(1.08);} }
@keyframes aiFloat2{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(-36px,26px) scale(1.1);} }
@keyframes aiFloat3{ 0%,100%{ transform:translate(0,0) scale(1);} 50%{ transform:translate(28px,-30px) scale(1.06);} }
/* ---------- hero header ---------- */
.ai-hero{ display:flex; align-items:flex-start; gap:20px; margin-bottom:30px; }
.ai-orb{ position:relative; width:74px; height:74px; flex:none; }
.ai-orb-core{ position:absolute; inset:14px; border-radius:50%;
background:radial-gradient(circle at 35% 30%, #fff, var(--ai-gold) 38%, #9a6b1f 75%);
box-shadow:0 0 24px rgba(217,164,65,.6), inset 0 0 14px rgba(255,255,255,.35);
animation:aiPulse 3.2s ease-in-out infinite; }
.ai-orb-ring{ position:absolute; inset:0; border-radius:50%; border:1.5px solid var(--ai-line-2); }
.ai-orb-ring.r2{ inset:-7px; border-color:rgba(217,164,65,.25); animation:aiSpin 9s linear infinite; border-top-color:var(--ai-gold); }
.ai-orb-ring.r3{ inset:-14px; border-color:rgba(124,179,66,.18); animation:aiSpin 14s linear infinite reverse; border-bottom-color:var(--ai-green); }
@keyframes aiPulse{ 0%,100%{ transform:scale(1); box-shadow:0 0 24px rgba(217,164,65,.55), inset 0 0 14px rgba(255,255,255,.35);} 50%{ transform:scale(1.06); box-shadow:0 0 36px rgba(217,164,65,.8), inset 0 0 18px rgba(255,255,255,.5);} }
@keyframes aiSpin{ to{ transform:rotate(360deg);} }
.ai-hero-txt h1{ font-family:var(--f-d); font-weight:350; font-size:46px; letter-spacing:-.02em; margin:0; line-height:1;
background:linear-gradient(100deg,#fff 10%,var(--ai-gold-2) 40%,var(--ai-gold) 60%,#fff 90%);
background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
animation:aiShimmer 6s linear infinite; }
@keyframes aiShimmer{ to{ background-position:200% center; } }
.ai-hero-txt h1 .sp{ font-style:italic; }
.ai-hero-sub{ color:var(--ai-txt-dim); font-size:14px; margin-top:8px; max-width:54ch; }
.ai-hero-badge{ display:inline-flex; align-items:center; gap:7px; margin-top:12px; font-family:var(--f-m); font-size:11px; font-weight:700;
letter-spacing:.05em; text-transform:uppercase; color:var(--ai-green-2); background:rgba(124,179,66,.12);
border:1px solid rgba(124,179,66,.3); padding:5px 11px; border-radius:999px; }
.ai-hero-badge .pulse{ width:7px; height:7px; border-radius:50%; background:var(--ai-green); box-shadow:0 0 0 0 rgba(124,179,66,.6); animation:aiBlip 2s ease-out infinite; }
@keyframes aiBlip{ 0%{ box-shadow:0 0 0 0 rgba(124,179,66,.6);} 70%{ box-shadow:0 0 0 8px rgba(124,179,66,0);} 100%{ box-shadow:0 0 0 0 rgba(124,179,66,0);} }
/* ---------- panels ---------- */
.ai-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:18px; align-items:start; }
.ai-panel{ position:relative; background:linear-gradient(180deg,var(--ai-bg-2),var(--ai-bg-1));
border:1px solid var(--ai-line); border-radius:var(--r-lg); padding:22px; overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.35); }
/* animated top hairline accent */
.ai-panel::before{ content:""; position:absolute; left:0; right:0; top:0; height:1px;
background:linear-gradient(90deg,transparent,var(--ai-gold),var(--ai-green),transparent);
background-size:200% 100%; animation:aiSweep 5s linear infinite; opacity:.7; }
@keyframes aiSweep{ to{ background-position:200% 0; } }
.ai-panel.span2{ grid-column:1/-1; }
.ai-panel-h{ display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.ai-panel-h .ic{ width:34px; height:34px; border-radius:9px; display:grid; place-items:center; flex:none;
background:rgba(217,164,65,.12); border:1px solid rgba(217,164,65,.28); color:var(--ai-gold); }
.ai-panel-h.green .ic{ background:rgba(124,179,66,.12); border-color:rgba(124,179,66,.3); color:var(--ai-green-2); }
.ai-panel-h.cyan .ic{ background:rgba(91,198,192,.12); border-color:rgba(91,198,192,.3); color:var(--ai-cyan); }
.ai-panel-h h2{ font-family:var(--f-d); font-weight:400; font-size:20px; color:#fff; margin:0; }
.ai-panel-h .sub{ font-size:12px; color:var(--ai-txt-faint); font-family:var(--f-m); }
/* status row */
.ai-status{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.ai-chip-ok{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-m); font-size:12px; font-weight:700;
letter-spacing:.05em; text-transform:uppercase; color:#0e0b07; background:linear-gradient(180deg,var(--ai-green-2),var(--ai-green));
padding:7px 13px; border-radius:999px; box-shadow:0 0 18px rgba(124,179,66,.4); }
.ai-chip-ok .tick{ width:14px; height:14px; }
.ai-model{ font-family:var(--f-m); font-size:15px; color:#fff; }
.ai-model b{ color:var(--ai-gold-2); position:relative; }
.ai-keyline{ margin-top:14px; font-size:13px; color:var(--ai-txt-dim); font-family:var(--f-m); display:flex; align-items:center; gap:8px; }
.ai-keyline code{ background:rgba(255,255,255,.06); border:1px solid var(--ai-line); border-radius:6px; padding:2px 7px; color:var(--ai-gold-2); }
.ai-keyline .lock{ color:var(--ai-green-2); }
/* tiny live latency sparkline */
.ai-latency{ display:flex; align-items:center; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--ai-line); }
.ai-latency .lbl{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ai-txt-faint); }
.ai-eq{ display:inline-flex; align-items:flex-end; gap:3px; height:22px; }
.ai-eq i{ width:3px; background:var(--ai-green); border-radius:2px; animation:aiEq 1.1s ease-in-out infinite; }
.ai-eq i:nth-child(1){ animation-delay:0s; } .ai-eq i:nth-child(2){ animation-delay:.12s; }
.ai-eq i:nth-child(3){ animation-delay:.24s; } .ai-eq i:nth-child(4){ animation-delay:.36s; }
.ai-eq i:nth-child(5){ animation-delay:.48s; } .ai-eq i:nth-child(6){ animation-delay:.6s; }
.ai-eq i:nth-child(7){ animation-delay:.72s; }
@keyframes aiEq{ 0%,100%{ height:5px; opacity:.5;} 50%{ height:22px; opacity:1;} }
/* ---------- tool cards ---------- */
.ai-tools{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; }
.ai-tool{ position:relative; display:flex; flex-direction:column; gap:10px; padding:18px; border-radius:var(--r-md);
background:rgba(255,255,255,.03); border:1px solid var(--ai-line); cursor:pointer; text-decoration:none;
color:var(--ai-txt); overflow:hidden; transition:transform .18s, border-color .18s, background .18s; }
.ai-tool::after{ content:""; position:absolute; inset:0; border-radius:inherit; opacity:0; transition:opacity .2s;
background:radial-gradient(300px circle at var(--mx,50%) var(--my,0%), rgba(217,164,65,.12), transparent 60%); }
.ai-tool:hover{ transform:translateY(-4px); border-color:var(--ai-line-2); background:rgba(255,255,255,.05); text-decoration:none; }
.ai-tool:hover::after{ opacity:1; }
.ai-tool-ic{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; flex:none;
background:linear-gradient(140deg,rgba(217,164,65,.2),rgba(124,179,66,.14)); border:1px solid var(--ai-line-2); color:var(--ai-gold-2); }
.ai-tool.t-green .ai-tool-ic{ background:linear-gradient(140deg,rgba(124,179,66,.22),rgba(91,198,192,.12)); color:var(--ai-green-2); }
.ai-tool.t-cyan .ai-tool-ic{ background:linear-gradient(140deg,rgba(91,198,192,.22),rgba(155,123,208,.12)); color:var(--ai-cyan); }
.ai-tool-t{ font-weight:700; font-size:14.5px; color:#fff; line-height:1.3; }
.ai-tool-d{ font-size:12px; color:var(--ai-txt-dim); line-height:1.45; }
.ai-tool-go{ margin-top:auto; display:inline-flex; align-items:center; gap:6px; font-family:var(--f-m); font-size:11px; font-weight:700;
letter-spacing:.04em; text-transform:uppercase; color:var(--ai-gold); }
.ai-tool:hover .ai-tool-go .arr{ transform:translateX(4px); }
.ai-tool-go .arr{ transition:transform .18s; }
/* ---------- test connection ---------- */
.ai-test{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.ai-test-txt{ flex:1; min-width:220px; }
.ai-test-txt p{ color:var(--ai-txt-dim); font-size:13.5px; margin:0; }
.ai-btn{ display:inline-flex; align-items:center; gap:9px; font-family:var(--f-u); font-weight:700; font-size:14px;
padding:12px 22px; border-radius:var(--r-md); border:0; cursor:pointer; color:#0e0b07;
background:linear-gradient(180deg,var(--ai-gold-2),var(--ai-gold)); box-shadow:0 0 22px rgba(217,164,65,.35); transition:transform .15s, box-shadow .2s; }
.ai-btn:hover{ transform:translateY(-2px); box-shadow:0 0 30px rgba(217,164,65,.55); }
.ai-btn .spark{ width:16px; height:16px; }
.ai-btn-green{ color:#0e0b07; background:linear-gradient(180deg,var(--ai-green-2),var(--ai-green)); box-shadow:0 0 22px rgba(124,179,66,.35); }
.ai-btn-green:hover{ box-shadow:0 0 30px rgba(124,179,66,.55); }
.ai-btn-ghost{ background:transparent; color:var(--ai-txt); border:1px solid var(--ai-line-2); box-shadow:none; }
.ai-btn-ghost:hover{ background:rgba(255,255,255,.05); box-shadow:none; }
/* result line that "types in" */
.ai-test-result{ margin-top:16px; padding-top:16px; border-top:1px solid var(--ai-line); font-family:var(--f-m); font-size:13px; color:var(--ai-green-2); display:flex; align-items:center; gap:8px; }
.ai-typing{ display:inline-flex; gap:4px; }
.ai-typing i{ width:6px; height:6px; border-radius:50%; background:var(--ai-gold); animation:aiType 1.2s ease-in-out infinite; }
.ai-typing i:nth-child(2){ animation-delay:.18s; } .ai-typing i:nth-child(3){ animation-delay:.36s; }
@keyframes aiType{ 0%,60%,100%{ transform:translateY(0); opacity:.4;} 30%{ transform:translateY(-5px); opacity:1;} }
/* ---------- quick prompt ---------- */
.ai-prompt-wrap{ position:relative; }
.ai-prompt{ width:100%; min-height:130px; resize:vertical; padding:16px 18px; border-radius:var(--r-md);
background:rgba(0,0,0,.28); border:1px solid var(--ai-line-2); color:var(--ai-txt); font:inherit; font-size:15px; line-height:1.5; transition:border-color .18s, box-shadow .18s; }
.ai-prompt::placeholder{ color:var(--ai-txt-faint); }
.ai-prompt:focus{ outline:none; border-color:var(--ai-gold); box-shadow:0 0 0 3px rgba(217,164,65,.18), 0 0 30px rgba(217,164,65,.12) inset; }
.ai-prompt-bar{ display:flex; align-items:center; gap:12px; margin-top:14px; }
.ai-prompt-hint{ font-family:var(--f-m); font-size:11px; color:var(--ai-txt-faint); margin-left:auto; }
.ai-prompt-hint kbd{ background:rgba(255,255,255,.07); border:1px solid var(--ai-line); border-radius:5px; padding:2px 6px; color:var(--ai-txt-dim); font-family:var(--f-m); }
/* suggested prompt chips */
.ai-chips{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.ai-prchip{ font-size:12.5px; color:var(--ai-txt-dim); background:rgba(255,255,255,.04); border:1px solid var(--ai-line);
border-radius:999px; padding:7px 13px; cursor:pointer; transition:.15s; }
.ai-prchip:hover{ color:#fff; border-color:var(--ai-gold); background:rgba(217,164,65,.1); }
/* usage stat tiles (new proposed) */
.ai-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.ai-stat{ background:rgba(255,255,255,.03); border:1px solid var(--ai-line); border-radius:var(--r-md); padding:15px 16px; }
.ai-stat .k{ font-family:var(--f-m); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--ai-txt-faint); margin-bottom:6px; }
.ai-stat .v{ font-family:var(--f-d); font-size:28px; color:#fff; line-height:1; }
.ai-stat .v.gold{ color:var(--ai-gold-2); } .ai-stat .v.green{ color:var(--ai-green-2); }
.ai-stat .s{ font-size:11px; color:var(--ai-txt-dim); margin-top:5px; font-family:var(--f-m); }
@media (max-width:1040px){
.ai-stage{ margin:-24px -20px -40px; padding:32px 20px 48px; }
.ai-grid{ grid-template-columns:1fr; }
.ai-tools{ grid-template-columns:1fr; }
.ai-stats{ grid-template-columns:1fr; }
.ai-hero-txt h1{ font-size:38px; }
}
/* honor reduced-motion: kill all the animation, keep the look */
@media (prefers-reduced-motion: reduce){
.ai-mesh span, .ai-orb-core, .ai-orb-ring, .ai-hero-txt h1, .ai-panel::before,
.ai-eq i, .ai-typing i, .ai-hero-badge .pulse{ animation:none !important; }
.ai-hero-txt h1{ -webkit-text-fill-color:var(--ai-gold-2); }
}
/* AI page — admin-shell breakout + not-configured states (overlay 208) */
.wrap--admin .ai-stage{ margin:-28px -28px -48px 0; }
.ai-chip-bad{ display:inline-flex; align-items:center; gap:7px; padding:6px 13px; border-radius:999px;
font-weight:700; font-size:13px; background:rgba(168,57,47,.18); color:#ED8B82; border:1px solid rgba(168,57,47,.45); }
.ai-orb.is-off{ filter:grayscale(.85); opacity:.55; }
.ai-tool.is-disabled{ opacity:.5; pointer-events:none; }
.ai-tools{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
/* ============================================================
PTI overlay 211 - AI "magic" sparkle na CTA a tlacitkach
Jemna, vkusna zivost na AI vstupnich bodech v adminu.
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.ai-menu>summary{ position:relative; overflow:hidden; }
.btn-ai{ position:relative; overflow:hidden; }
.btn-ai .spk{ color:var(--gold); flex:none; vertical-align:-2px; margin-right:5px; }
.ai-menu-pop a .ic{ transition:transform .16s ease; }
.ai-menu-pop a:hover .ic{ transform:scale(1.14) rotate(-6deg); }
@media (prefers-reduced-motion: no-preference){
@keyframes aiSpkTwinkle{ 0%,100%{ transform:scale(1) rotate(0); opacity:.82; } 45%{ transform:scale(1.22) rotate(10deg); opacity:1; } }
@keyframes aiSheen{ 0%{ transform:translateX(-150%) skewX(-18deg); } 100%{ transform:translateX(190%) skewX(-18deg); } }
@keyframes aiCtaGlow{ 0%,100%{ box-shadow:var(--sh-md), 0 0 0 0 rgba(184,137,58,0); } 50%{ box-shadow:var(--sh-md), 0 0 18px 1px rgba(184,137,58,.34); } }
@keyframes aiItemIn{ from{ opacity:0; transform:translateY(-5px); } to{ opacity:1; transform:none; } }
.ai-menu>summary{ animation:aiCtaGlow 3.4s ease-in-out infinite; }
.ai-menu>summary .spk{ animation:aiSpkTwinkle 2.4s ease-in-out infinite; transform-origin:center; }
.ai-menu>summary::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:46%; pointer-events:none;
background:linear-gradient(100deg, transparent, rgba(244,233,207,.30), transparent);
animation:aiSheen 5s ease-in-out infinite; animation-delay:1.4s; }
.ai-menu>summary:hover{ animation-duration:1.8s; }
.ai-menu>summary:hover .spk{ animation-duration:1.05s; }
.ai-menu>summary:hover::before{ animation-duration:2.1s; }
.ai-menu[open] .ai-menu-pop a{ animation:aiItemIn .3s ease both; }
.ai-menu[open] .ai-menu-pop a:nth-child(2){ animation-delay:.06s; }
.ai-menu[open] .ai-menu-pop a:nth-child(3){ animation-delay:.12s; }
.btn-ai .spk{ animation:aiSpkTwinkle 2.6s ease-in-out infinite; transform-origin:center; }
.btn-ai::before{ content:''; position:absolute; top:0; bottom:0; left:0; width:46%; pointer-events:none;
background:linear-gradient(100deg, transparent, rgba(184,137,58,.16), transparent);
animation:aiSheen 6s ease-in-out infinite; animation-delay:2s; }
.btn-ai:hover{ box-shadow:0 0 14px 0 rgba(184,137,58,.30); }
.btn-ai:hover .spk{ animation-duration:1.1s; }
}
/* ============================================================
PTI overlay 211 — vice "kouzla" na AI prvcich napric adminem
(zlata AI ikona v sidebaru, idle glow na .btn-ai)
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.adm-side-link[href="/admin/ai.php"] .adm-side-ic{ stroke:var(--gold); }
.adm-side-link[href="/admin/ai.php"].active .adm-side-ic{ stroke:var(--gold); }
@media (prefers-reduced-motion: no-preference){
@keyframes aiNavGlow{ 0%,100%{ filter:drop-shadow(0 0 0 rgba(217,164,65,0)); transform:scale(1); }
50%{ filter:drop-shadow(0 0 4px rgba(217,164,65,.7)); transform:scale(1.1); } }
@keyframes aiBtnBreathe{ 0%,100%{ box-shadow:0 0 0 0 rgba(184,137,58,0); } 50%{ box-shadow:0 0 11px 0 rgba(184,137,58,.28); } }
.adm-side-link[href="/admin/ai.php"] .adm-side-ic{ animation:aiNavGlow 3.2s ease-in-out infinite; transform-origin:center; }
.adm-side-link[href="/admin/ai.php"]:hover .adm-side-ic{ animation-duration:1.4s; }
.btn-ai:not(:disabled){ animation:aiBtnBreathe 3.8s ease-in-out infinite; }
.btn-ai:not(:disabled):hover{ animation-duration:1.5s; }
}
/* ============================================================
PTI overlay 212 — animovane potvrzeni uspechu (.flash-ok)
Kreslici se fajfka + jiskricky u "vytvoreni". Zustava videt,
aby uzivatel nemel pocit, ze akce neprosla (zadne duplicity).
Ciste CSS; pohyb jen pri prefers-reduced-motion: no-preference.
============================================================ */
.flash-ok{ display:flex; align-items:center; gap:13px; padding:13px 18px; margin:0 0 16px;
border-radius:var(--r-md); background:var(--ok-tint); border:1px solid rgba(79,106,61,.35);
color:var(--ink-2); font-weight:500; position:relative; overflow:visible; box-shadow:var(--sh-sm); }
.flash-ok .flash-tx{ flex:1; min-width:0; }
.flash-ok .flash-tx b{ color:var(--ink-1); }
.flash-ic{ flex:none; width:30px; height:30px; display:block; }
.flash-ic svg{ width:30px; height:30px; display:block; overflow:visible; }
.flash-ic .fc{ fill:none; stroke:var(--ok); stroke-width:2.5; opacity:.5; }
.flash-ic .fk{ fill:none; stroke:var(--ok); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; }
.flash-spark{ position:absolute; left:31px; top:50%; width:0; height:0; pointer-events:none; }
.flash-spark i{ position:absolute; width:6px; height:6px; margin:-3px; border-radius:50%; opacity:0; }
.flash-spark i:nth-child(1){ --fly:translate(-22px,-20px); background:var(--gold); }
.flash-spark i:nth-child(2){ --fly:translate(0,-28px); background:var(--ok); }
.flash-spark i:nth-child(3){ --fly:translate(22px,-20px); background:var(--gold); }
.flash-spark i:nth-child(4){ --fly:translate(27px,9px); background:var(--ok); }
.flash-spark i:nth-child(5){ --fly:translate(-27px,9px); background:var(--ok); }
.flash-spark i:nth-child(6){ --fly:translate(2px,25px); background:var(--gold); }
@media (prefers-reduced-motion: no-preference){
@keyframes flashIn{ from{ opacity:0; transform:translateY(-8px) scale(.97); } to{ opacity:1; transform:none; } }
@keyframes flashStroke{ to{ stroke-dashoffset:0; } }
@keyframes flashGlow{ 0%,100%{ box-shadow:var(--sh-sm); } 35%{ box-shadow:var(--sh-sm), 0 0 16px 1px rgba(79,106,61,.42); } }
@keyframes flashSpark{ 0%{ opacity:1; transform:translate(0,0) scale(.3); } 70%{ opacity:1; } 100%{ opacity:0; transform:var(--fly) scale(1); } }
.flash-pop{ animation:flashIn .45s cubic-bezier(.2,.9,.3,1.3) both, flashGlow 1.7s ease .2s 1; }
.flash-pop .fc{ stroke-dasharray:145; stroke-dashoffset:145; animation:flashStroke .5s ease .08s forwards; }
.flash-pop .fk{ stroke-dasharray:42; stroke-dashoffset:42; animation:flashStroke .32s ease .45s forwards; }
.flash-celebrate .flash-spark i{ animation:flashSpark .85s ease-out .4s both; }
}
/* Prodejni sekce: ozivit fajfku po dokonceni prodeje (success.php) — cele CSS, bez zmeny PHP */
.success-check{ position:relative; }
@media (prefers-reduced-motion: no-preference){
@keyframes succPop{ 0%{ transform:scale(0) rotate(-25deg); } 60%{ transform:scale(1.18) rotate(6deg); } 100%{ transform:scale(1) rotate(0); } }
@keyframes succRing{ 0%{ transform:scale(.62); opacity:.5; } 100%{ transform:scale(2.1); opacity:0; } }
@keyframes succGlow{ 0%,100%{ box-shadow:0 0 0 0 rgba(79,106,61,0); } 45%{ box-shadow:0 0 0 7px rgba(79,106,61,.16); } }
.success-check{ animation:succPop .55s cubic-bezier(.2,.9,.3,1.5) both, succGlow 2.4s ease .5s 2; }
.success-check::after{ content:''; position:absolute; inset:0; border-radius:50%; border:2px solid var(--ok);
animation:succRing 1.1s ease-out .25s 2; pointer-events:none; }
}
/* ============================================================
PTI overlay 213 — payment: vyber platby presunut do Summary panelu
Segmentovy prepinac (default Card), echo na tlacitku — VSE pure CSS.
Radia jsou primi potomci .pay-side PRED .paysum-method i .pay-confirm,
takze ~ dosahne na segment i echo (zadny JS, CSP ciste).
============================================================ */
.pay-side > input[name="payment_method"]{ position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.paysum-method{ margin-top:16px; }
.paysum-method-l{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.paysum-method-l .t{ font-family:var(--f-m); font-size:10.5px; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); font-weight:700; }
.paysum-method-l .hint{ font-size:11px; color:var(--ink-4); }
.paysum-seg{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.paysum-seg label{ display:flex; align-items:center; justify-content:center; gap:9px; height:54px; border-radius:var(--r-md);
border:1.5px solid var(--line-2); background:var(--surface); cursor:pointer; font-weight:700; font-size:15px; color:var(--ink-2);
transition:.14s; user-select:none; }
.paysum-seg label .ic{ color:var(--ink-4); transition:.14s; display:inline-flex; }
.paysum-seg label:hover{ border-color:var(--line-3); background:#fff; }
#pm-card:checked ~ .paysum-method label[for="pm-card"],
#pm-cash:checked ~ .paysum-method label[for="pm-cash"]{ border-color:var(--brand); background:var(--brand); color:#fff; box-shadow:0 4px 12px rgba(122,31,46,.22); }
#pm-card:checked ~ .paysum-method label[for="pm-card"] .ic,
#pm-cash:checked ~ .paysum-method label[for="pm-cash"] .ic{ color:#fff; }
#pm-card:focus-visible ~ .paysum-method label[for="pm-card"],
#pm-cash:focus-visible ~ .paysum-method label[for="pm-cash"]{ box-shadow:0 0 0 3px var(--brand-tint); }
.paysum-method-note{ font-size:11.5px; color:var(--ink-4); margin-top:8px; line-height:1.4; }
.paysum-method-note b{ color:var(--ink-3); font-weight:600; }
.paysum-echo{ font-family:var(--f-m); font-size:13px; font-weight:700; opacity:.9; margin-left:6px; }
.paysum-echo .pe-cash{ display:none; }
#pm-cash:checked ~ .pay-confirm .paysum-echo .pe-card{ display:none; }
#pm-cash:checked ~ .pay-confirm .paysum-echo .pe-cash{ display:inline; }
.pay-moved-note{ color:var(--ink-4); }
/* ============================================================
PTI overlay 214 — AI generovani ikon pro atributy (custom: knihovna)
Custom/gen ikony v palete dedi .iconpick checked-styl (input+svg sousedi).
============================================================ */
.sr-submit{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0; }
.icon-gen{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:12px 0 2px; }
.icon-gen input[name="icon_prompt"]{ flex:1 1 240px; min-width:160px; }
.icon-gen-ok{ font-size:12px; color:var(--ok,#4F6A3D); font-weight:600; }
.iconpick label.ipick-gen, .iconpick label.ipick-custom{ position:relative; }
.iconpick label.ipick-gen::after{ content:""; position:absolute; top:1px; right:1px; width:6px; height:6px; border-radius:50%; background:var(--gold,#B8893A); }
.iconpick label.ipick-custom::after{ content:""; position:absolute; top:1px; right:1px; width:6px; height:6px; border-radius:50%; background:var(--line-3,#cbb5b9); }
/* ============================================================
PTI overlay 215 — fix: "Manage" tlacitko ve sprave adminu
.rowmenu-btn je 32x32 box pro "•••" (products.php). V admins.php
nese cele slovo (Spravovat/Manage), ktere pretekalo. Tahle varianta
necha sirku narust podle textu; base (hover/[open] burgundy) zustava.
============================================================ */
.rowmenu-btn--text{ width:auto; min-width:0; padding:0 14px; letter-spacing:normal; font-weight:600; font-size:13px; white-space:nowrap; }
/* ============================================================
PTI overlay 216 — fix: rozbalovaci menu "Manage" se u spodnich
radku orezavalo. .table ma overflow:hidden (kvuli rohum), coz
veznilo .rowmenu-pop. Tahle tabulka (admins) ma overflow:visible,
aby menu mohlo pretect dolu; rohy dorovnany rozsahem na bunky,
aby nevznikl artefakt. Ostatni .table tabulky se nemeni.
============================================================ */
.table--menus{ overflow: visible; }
.table--menus thead th:first-child{ border-top-left-radius: var(--r-lg); }
.table--menus thead th:last-child{ border-top-right-radius: var(--r-lg); }
.table--menus tbody tr:last-child td:first-child{ border-bottom-left-radius: var(--r-lg); }
.table--menus tbody tr:last-child td:last-child{ border-bottom-right-radius: var(--r-lg); }