:root {
--bg: #0c0d11;
--bg-2: #0f1116;
--panel: #15171e;
--panel-2: #1b1e27;
--line: #262b37;
--line-2: #333a49;
--text: #eef0f6;
--muted: #9aa2b4;
--accent: #c9a227;
--accent-2: #e6d4a0;
--male: #3a7cc4;
--male-2: #9cc0ec;
--female: #bb7299;
--female-2: #e3b6cd;
--radius: 16px;
/* jednotná škála zaoblení (luxus = konzistencia): drobné / malé / stredné / veľké / pilulka */
--r-xs: 8px; --r-sm: 12px; --r: 16px; --r-lg: 20px; --r-pill: 999px;
--accent-glow: rgba(201, 162, 39, .35);
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
--shadow: 0 8px 24px rgba(0, 0, 0, 0.35), 0 2px 6px rgba(0, 0, 0, 0.3);
--shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.5);
--serif: "Cormorant Garamond", "Playfair Display", Georgia, "Times New Roman", serif;
--sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
/* ===== Luxusné líniové ikony (Phosphor Light, inline SVG) — jednofarebné, adoptujú zlatú/krémovú farbu kontextu ===== */
.e3d { height: 1.2em; width: 1.2em; object-fit: contain; display: inline-block; vertical-align: -0.27em; -webkit-user-select: none; user-select: none; pointer-events: none; }
svg.e3d { fill: currentColor; stroke: none; } /* SVG ikona berie farbu textu (color) → zlatá na tmavom, tmavá na zlatom CTA */
/* 3D ikony v kartách NEpodliehajú fade-inu fotiek (.card img{opacity:0}) — sú hneď viditeľné */
.card img.e3d { opacity: 1; }
/* dlaždicové ikony — span drží veľkosť aj animáciu, img ju vyplní (žiadny baseline posun) */
.hometiles .alb-ic .e3d, .hometiles .vb-ic .e3d, .hometiles .wb-ic .e3d, .hometiles .rb-ic .e3d,
.hometiles .ab-ic .e3d, .hometiles .swb-ic .e3d, .reviewsbanner .rvb-ic .e3d { width: 1.25em; height: 1.25em; vertical-align: middle; }
/* hlavička — vycentrované na text gombíka (veľkosť ~ pôvodné emoji, aby sa lišta nezalomila) */
.controls .e3d { height: 20px; width: 20px; vertical-align: -5px; }
.instbtn .e3d { vertical-align: middle; }
/* lišta sekcií */
.sectionnav .snav .e3d { height: 20px; width: 20px; vertical-align: -5px; margin-right: 2px; }
/* malé inline ikony v nadpisoch (zámok pri VIP atď.) */
.vb-lock .e3d, .e3d.e3d-sm { height: 1em; width: 1em; vertical-align: -0.18em; }
/* in-app tlačidlové 3D ikony — PEVNÁ px veľkosť (nezávislá od font-size:0 na mobile, kde sa skrýva text) + jemný tieň pre kontrast */
.iconbtn .e3d, .lbi-buy .e3d, .lbi-vip .e3d, .lbi-row .e3d, .cardbuy .e3d { width: 17px; height: 17px; vertical-align: -3.5px; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.5)); }
.cardbuy .e3d { width: 18px; height: 18px; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.85)); } /* blesk na zlatom CTA → 1 tmavý obrys (single = rýchlejší paint) */
.cartbtn .e3d { width: 23px; height: 23px; vertical-align: middle; filter: drop-shadow(0 0 2px rgba(255,255,255,.5)); } /* vozík na tmavom kruhu → 1 svetlý nádych */
/* CTA tlačidlá košíka + titulok */
.cart-send .e3d { width: 19px; height: 19px; vertical-align: -4px; filter: drop-shadow(0 1px 1.5px rgba(0,0,0,.45)); }
.cart-head h2 .e3d { width: 22px; height: 22px; vertical-align: -4px; }
.crd-ic .e3d { width: 17px; height: 17px; vertical-align: -3px; }
html { background: #0c0d11; } /* pevné tmavé pozadie → over-scroll (hore aj dole) je tmavý, plynulý */
/* ===== Svetlý režim (deň) — prepíše premenné, zachová zlatý luxusný akcent ===== */
html.light {
--bg: #e7e0d0; --bg-2: #e0d8c5; --panel: #ffffff; --panel-2: #faf7f0;
--line: #cbc2ac; --line-2: #b3a988; --text: #1c1a16; --muted: #6c6353;
--accent: #a8821a; --accent-2: #7c6210;
--shadow: 0 10px 30px rgba(120,100,40,.18);
background: #e7e0d0;
}
html.light header.top { background: rgba(255,255,255,.9); }
html.light .lb, html.light .swipe { background: rgba(20,18,14,.96); } /* prehliadač fotiek ostáva tmavý (vyniknú fotky) */
/* aby gombíky NEZANIKALI na svetlom pozadí — biele tlačidlá s viditeľným okrajom a jemným tieňom */
html.light .iconbtn, html.light .cartheadbtn, html.light .notifbtn, html.light .photobtn, html.light .langsel,
html.light .snav, html.light .editbtn, html.light .backbtn, html.light .btn, html.light #search {
background: #ffffff; border-color: var(--line-2); box-shadow: 0 1px 3px rgba(60,50,20,.1);
}
html.light .snav.active { background: linear-gradient(180deg, rgba(168,130,26,.16), rgba(168,130,26,.06)); border-color: var(--accent); }
/* DENNÝ REŽIM — dlaždice s priehľadným pozadím + bielym textom na svetlom miznú → plné svetlé pozadie + tmavý text */
html.light .stockbanner { background: #e8f7f0; border-color: #7fcdaf; box-shadow: 0 3px 12px rgba(40,90,70,.14); color: #0f3a30; }
html.light .stockbanner .alb-title { color: #0b6e51; }
html.light .stockbanner .alb-sub { color: #2c6e5c; }
html.light .stockbanner .alb-go { color: #0b9e74; }
html.light .passbanner { background: #fbf1d3; border-color: var(--accent); box-shadow: 0 3px 12px rgba(120,100,40,.16); color: #3a2e08; }
html.light .passbanner .alb-title, html.light .passbanner .alb-go { color: #8a6a12; }
html.light .passbanner .alb-sub { color: #6a5410; }
/* album/VIP/koleso/referral/účet dlaždice — ostávajú tmavé/farebné, len im pridáme jemný tieň aby vynikli na svetlom */
html.light .albumbanner, html.light .vipbanner, html.light .wheelbanner, html.light .refbanner, html.light .acctbanner { box-shadow: 0 6px 20px rgba(60,50,20,.22); }
/* prázdne plochy fotiek v dennom režime svetlé (nie čierne) */
html.light .card .imgwrap { background: #efeadd; }
html.light .notifbtn .nb-bell { filter: none; }
html, body { margin: 0; padding: 0; }
body {
background-color: var(--bg);
min-height: 100dvh;
/* tmavá medzera dole (nad gestovou lištou), nech posledná dlaždica nesplýva s okrajom */
padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px));
color: var(--text);
font: 15px/1.55 var(--sans);
-webkit-font-smoothing: antialiased;
}
/* ===== ✨ AMBIENT POZADIE — luxusný butik za oknami (nie suchá čierna) =====
Fixná vrstva POD obsahom: zlatá žiara (svetlo butiku) + fialový nádych (360°) + vínový spodok + vinetácia.
Pseudo-elementy s z-index:-1 = žiadny vplyv na layout ani na klikanie, lacné na výkon. */
body::before {
content: ""; position: fixed; inset: -14%; z-index: -1; pointer-events: none;
background:
radial-gradient(46% 38% at 84% -4%, rgba(214,173,60,.26), transparent 64%), /* zlaté svetlo zhora sprava (výklad butiku) */
radial-gradient(42% 36% at -8% 20%, rgba(115,96,206,.17), transparent 62%), /* fialový nádych vľavo (360° akcent) */
radial-gradient(58% 46% at 52% 116%, rgba(158,50,92,.15), transparent 66%), /* tmavovínové teplo zospodu */
radial-gradient(34% 26% at 32% 50%, rgba(201,162,39,.07), transparent 62%); /* tichý zlatý stred */
animation: ambientDrift 52s ease-in-out infinite alternate;
will-change: transform;
}
body::after {
content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
background:
/* zlatý „prach" — drobné bodky v 3 vrstvách (rôzny raster = pôsobí náhodne), jemne oživia plochu */
radial-gradient(1.3px 1.3px at 22% 31%, rgba(236,205,104,.34), transparent 100%),
radial-gradient(1px 1px at 71% 64%, rgba(236,205,104,.24), transparent 100%),
radial-gradient(1.5px 1.5px at 48% 82%, rgba(255,255,255,.13), transparent 100%),
/* hodvábny šikmý lesk — veľmi jemné prúžky ako satén */
repeating-linear-gradient(112deg, rgba(255,255,255,.016) 0 1.5px, transparent 1.5px 11px),
/* vinetácia — okraje stmavia, obsah v strede vynikne */
radial-gradient(130% 105% at 50% 38%, transparent 58%, rgba(0,0,0,.34) 100%);
background-size: 190px 190px, 240px 240px, 300px 300px, auto, auto;
}
@keyframes ambientDrift {
0% { transform: translate3d(0,0,0) scale(1); }
100% { transform: translate3d(2.5%,1.5%,0) scale(1.06); }
}
@media (prefers-reduced-motion: reduce) { body::before { animation: none; } }
/* svetlý (denný) režim — teplé krémové svetlo namiesto tmavých žiar */
html.light body::before {
background:
radial-gradient(46% 38% at 84% -4%, rgba(168,130,26,.13), transparent 62%),
radial-gradient(40% 34% at -6% 22%, rgba(124,98,16,.07), transparent 60%),
radial-gradient(56% 44% at 52% 116%, rgba(160,120,60,.10), transparent 64%);
}
html.light body::after {
background:
radial-gradient(1.2px 1.2px at 22% 31%, rgba(140,110,30,.14), transparent 100%),
radial-gradient(1px 1px at 71% 64%, rgba(140,110,30,.10), transparent 100%),
repeating-linear-gradient(112deg, rgba(120,100,40,.012) 0 1.5px, transparent 1.5px 11px),
radial-gradient(130% 105% at 50% 38%, transparent 62%, rgba(120,100,40,.14) 100%);
background-size: 190px 190px, 240px 240px, auto, auto;
}
a { color: inherit; }
::-webkit-scrollbar { height: 8px; width: 8px; }
::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: var(--r-xs); }
/* Header */
header.top {
position: sticky; top: 0; z-index: 30;
background: rgba(12, 13, 17, 0.82);
backdrop-filter: saturate(150%) blur(14px);
border-bottom: 1px solid var(--line);
transition: transform .28s cubic-bezier(.4,0,.2,1); will-change: transform;
}
/* skry header pri scrollovaní DOLE v sekciách → klientka má celú plochu (na hlavnej ostáva) */
body.hdr-hidden header.top { transform: translateY(-100%); }
.bar { max-width: 1440px; margin: 0 auto; padding: 14px 22px 12px; display: flex; align-items: center; gap: 10px 18px; flex-wrap: wrap; justify-content: center; }
/* Vycentrovaný boutique wordmark (dvojriadkový) */
.brand { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 5px; cursor: pointer; user-select: none; text-align: center; }
.brand h1 {
font-family: var(--serif); font-size: 28px; line-height: 1; margin: 0; font-weight: 600;
letter-spacing: 5px; text-transform: uppercase; padding-left: 5px;
background: linear-gradient(180deg, #fff 0%, #ced1da 100%);
-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.brand-sub { display: inline-flex; align-items: center; gap: 12px; font-family: var(--serif); font-size: 13.5px; font-weight: 600; letter-spacing: 7px; text-transform: uppercase; padding-left: 7px; }
.brand-sub .dot {
background: linear-gradient(180deg, var(--accent-2), var(--accent));
-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.brand-sub .bl { width: 26px; height: 1px; display: inline-block; background: linear-gradient(90deg, transparent, var(--accent)); }
.brand-sub .bl:last-child { background: linear-gradient(90deg, var(--accent), transparent); }
.stats { color: var(--muted); font-size: 12.5px; letter-spacing: .2px; width: 100%; text-align: center; }
.controls { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; }
select, input[type="search"] {
background: var(--panel-2); color: var(--text); border: 1px solid var(--line);
border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; outline: none; transition: border-color .15s, box-shadow .15s;
}
input[type="search"] { min-width: 230px; }
input[type="search"]::placeholder { color: #6c7488; }
select:focus, input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(201,162,39,.16); }
/* ===== Filtre (pohlavie + kategórie) ===== */
.filters { max-width: 1440px; margin: 0 auto; padding: 16px 22px 6px; }
/* Pohlavie — výrazný farebný segmentový prepínač */
.genderseg { display: flex; gap: 12px; max-width: 660px; }
.gseg {
flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 9px;
padding: 14px 14px; border-radius: var(--r); border: 1.5px solid var(--line-2);
background: var(--panel); color: var(--text); cursor: pointer; font-size: 15.5px; font-weight: 700;
letter-spacing: .3px; white-space: nowrap;
transition: transform .14s ease, border-color .14s, background .14s, color .14s, box-shadow .14s;
}
.gseg .gi { font-size: 19px; line-height: 1; }
.gseg .gn { font-size: 12px; font-weight: 600; opacity: .65; }
.gseg:hover { transform: translateY(-2px); }
.gseg.all:hover { border-color: var(--accent); }
.gseg.male:hover { border-color: var(--male); color: var(--male-2); }
.gseg.female:hover { border-color: var(--female); color: var(--female-2); }
.gseg.all.active { background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-color: var(--accent); color: #1a1a1a; box-shadow: 0 6px 20px rgba(201,162,39,.3); }
.gseg.male.active { background: linear-gradient(180deg, #6aa6e6, var(--male)); border-color: var(--male); color: #fff; box-shadow: 0 6px 20px rgba(58,124,196,.42); }
.gseg.female.active { background: linear-gradient(180deg, #e493bd, var(--female)); border-color: var(--female); color: #fff; box-shadow: 0 6px 20px rgba(199,92,147,.42); }
.gseg.active .gn { opacity: .85; }
/* Pohlavná dlaždica s fotkou (napr. Pánske) — tmavý prekryv → text čitateľný; fotka ostáva aj v active stave */
.gseg.has-img { position:relative; overflow:hidden; background-size:cover; background-position:center; color:#fff !important; border-color:rgba(201,162,39,.55); }
.gseg.has-img::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,7,4,.26) 0%, rgba(8,7,4,.62) 100%); pointer-events:none; z-index:0; }
.gseg.has-img .gi, .gseg.has-img .gl, .gseg.has-img .gn { position:relative; z-index:1; color:#fff !important; text-shadow:0 1px 8px rgba(0,0,0,.9), 0 0 3px rgba(0,0,0,.7); }
.gseg.has-img .gn { opacity:.92; }
.gseg.male.has-img.active::after { background:linear-gradient(180deg, rgba(58,124,196,.40), rgba(8,7,4,.55)); }
.gseg.female.has-img.active::after { background:linear-gradient(180deg, rgba(199,92,147,.40), rgba(8,7,4,.55)); }
/* Kategórie */
.catbar {
display: flex; align-items: center; gap: 9px; padding: 14px 0 2px;
overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch;
}
.cchip {
flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px;
background: var(--panel); border: 1.5px solid var(--line-2); color: var(--text);
border-radius: var(--r-pill); padding: 10px 17px; font-size: 14.5px; cursor: pointer; white-space: nowrap;
transition: border-color .15s, background .15s, color .15s, transform .12s;
}
.cchip:hover { border-color: var(--accent); transform: translateY(-1px); }
.cchip .cc { font-size: 11.5px; color: var(--accent-2); font-weight: 600; }
.cchip.active { background: var(--accent); border-color: var(--accent); color: #1a1a1a; font-weight: 700; }
.cchip.active .cc { color: #1a1a1a; opacity: .7; }
/* aktívna kategória sa zafarbí podľa zvoleného pohlavia */
body[data-gender="m"] .cchip.active { background: var(--male); border-color: var(--male); color: #fff; }
body[data-gender="w"] .cchip.active { background: var(--female); border-color: var(--female); color: #fff; }
body[data-gender="m"] .cchip.active .cc, body[data-gender="w"] .cchip.active .cc { color: #fff; }
/* Tiles (značky / kategórie) */
.brandgrid {
max-width: 1440px; margin: 0 auto; padding: 18px 22px 90px;
display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
}
.btile {
position: relative; border-radius: var(--radius); overflow: hidden; cursor: pointer;
border: 1px solid var(--line); background: var(--panel); aspect-ratio: 4 / 5;
transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.btile:hover { transform: translateY(-4px); border-color: var(--accent); box-shadow: var(--shadow); }
/* shimmer kým sa titulka načítava (studená Yupoo proxy vie trvať sekundy) — namiesto čierneho boxu */
.btile::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(100deg, #15171e 30%, #20232e 50%, #15171e 70%); background-size: 200% 100%; animation: skel 1.4s ease-in-out infinite; }
.btile:has(img.loaded)::before { opacity: 0; animation: none; transition: opacity .3s; }
.btile img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; display: block; opacity: 0; transition: opacity .4s ease, transform .5s ease; }
.btile img.loaded { opacity: 1; }
.btile:hover img { transform: scale(1.05); }
.btile-cap {
position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 16px 14px;
display: flex; justify-content: space-between; align-items: flex-end; gap: 8px;
background: linear-gradient(to top, rgba(0,0,0,.9) 8%, rgba(0,0,0,.45) 55%, rgba(0,0,0,0));
pointer-events: none;
}
.btile-cap .bn { font-family: var(--serif); font-size: 21px; font-weight: 600; letter-spacing: .4px; color: #fff; line-height: 1.15; }
.btile-cap .bc {
font-size: 12px; color: #1a1a1a; background: var(--accent-2); font-weight: 700;
white-space: nowrap; padding: 3px 9px; border-radius: var(--r-pill);
}
/* Logo dlaždice značiek (úroveň 1, bez fotky) */
.ltile {
position: relative; border-radius: var(--radius); overflow: hidden; cursor: pointer;
border: 1px solid var(--line); aspect-ratio: 4 / 5;
background:
radial-gradient(120% 80% at 50% 0%, rgba(201,162,39,.10), transparent 60%),
linear-gradient(160deg, #181b23 0%, #111319 60%, #0e1014 100%);
display: flex; align-items: center; justify-content: center; padding: 18px;
transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.ltile:hover { transform: translateY(-4px); border-color: var(--accent); box-shadow: var(--shadow); }
.ltile .lg { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.ltile .lg-name {
font-family: var(--serif); font-weight: 700; font-size: var(--fs, 34px); line-height: 1.12;
letter-spacing: 2px; text-transform: uppercase; max-width: 100%; overflow-wrap: break-word;
color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,.45);
}
.ltile:hover .lg-name { color: var(--accent-2); }
.ltile .lg-rule { width: 38px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--accent), transparent); opacity: .85; }
.ltile .lg-sub { font-size: 12px; letter-spacing: 2.5px; text-transform: uppercase; color: var(--accent-2); font-weight: 600; }
body[data-gender="m"] .ltile .lg-sub { color: var(--male-2); }
body[data-gender="w"] .ltile .lg-sub { color: var(--female-2); }
.ltile .lg-count {
font-size: 12px; color: var(--accent-2); font-weight: 600; letter-spacing: .8px;
font-variant-numeric: tabular-nums; opacity: .95;
}
/* Crumbs */
.crumbs { max-width: 1440px; margin: 0 auto; padding: 22px 22px 6px; display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; }
.crumbs .backbtn { order: 1; }
.crumbs .sharebrand, .crumbs .sharecat, .crumbs #shareCat { order: 2; margin-left: auto; }
.crumbs h2 { order: 3; flex: 1 1 100%; text-align: center; font-family: var(--serif); margin: 6px 0 0; font-size: 26px; font-weight: 600; letter-spacing: .4px; line-height: 1.25; }
/* výrazné „Späť" — zlatý okraj + tučné, nech je jasne viditeľné */
.backbtn {
display: inline-flex; align-items: center; gap: 5px;
background: rgba(201,162,39,.12); border: 1.5px solid var(--accent); color: var(--accent-2);
border-radius: var(--r-pill); padding: 10px 18px; cursor: pointer; font-size: 14.5px; font-weight: 700;
letter-spacing: .2px; transition: transform .12s, background .15s, box-shadow .15s; white-space: nowrap;
}
.backbtn:hover { background: rgba(201,162,39,.22); transform: translateX(-2px); box-shadow: 0 4px 14px rgba(201,162,39,.25); }
.backbtn:active { transform: scale(.97); }
/* Produktová mriežka */
main { max-width: 1440px; margin: 0 auto; padding: 14px 22px 90px; }
.grid { display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); padding-bottom: 96px; } /* dolný priestor = posledný riadok kúskov sa dá vyrolovať nad plávajúce tlačidlá */
.card {
background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-sm);
overflow: hidden; cursor: pointer; transition: transform .28s cubic-bezier(.22,1,.36,1), border-color .28s ease, box-shadow .28s ease;
position: relative;
/* ⚠️ NEPRIDÁVAŤ content-visibility na .card! Skúšané 2026-07-18 proti pádu na iOS a ORezávalo to karty
na pevnú výšku (overflow:hidden) → z produktu bolo vidno len kúsok fotky. Vrátené 2026-07-20.
Pamäť rieši recyklácia obrázkov v imgObserver (app.js), ktorá layout nemení. */
}
.card:hover { transform: translateY(-4px); border-color: rgba(191,161,74,.42); box-shadow: var(--shadow), 0 10px 30px rgba(191,161,74,.12); }
.card .imgwrap { position: relative; aspect-ratio: 3 / 4; background: #0a0b0e; overflow: hidden; }
/* Skeleton shimmer počas načítania fotky */
.card .imgwrap::before { content: ""; position: absolute; inset: 0; z-index: 0; background: linear-gradient(100deg, #15171e 30%, #20232e 50%, #15171e 70%); background-size: 200% 100%; animation: skel 1.4s ease-in-out infinite; }
.card .imgwrap:has(img.loaded)::before, .card .imgwrap:has(video.loaded)::before { opacity: 0; animation: none; }
@keyframes skel { to { background-position: -200% 0; } }
/* contain = vidno CELÝ produkt (nie zoomnutý výrez) */
.card img, .card .imgwrap video { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; display: block; opacity: 0; transition: opacity .4s ease, transform .5s ease; }
.card img.loaded, .card .imgwrap video.loaded { opacity: 1; }
.card:hover img { transform: scale(1.04); }
.imgwrap .vidplay { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 46px; height: 46px; border-radius: 50%; background: rgba(0,0,0,.5); border: 1.5px solid rgba(255,255,255,.85); color: #fff; display: grid; place-items: center; font-size: 16px; padding-left: 3px; pointer-events: none; z-index: 2; }
/* ── JEMNÝ VODOZNAK proti kopírovaniu: doména cez stred fotky, veľmi jemný, na každej fotke (mix-blend = viditeľný na svetlom aj tmavom pozadí) ── */
.qwm-brand { position: absolute; left: 50%; top: 50%; z-index: 2; pointer-events: none; user-select: none; white-space: nowrap;
transform: translate(-50%, -50%) rotate(-22deg);
font-size: 12px; font-weight: 800; letter-spacing: 1.5px;
color: rgba(255,255,255,.20); mix-blend-mode: difference; }
/* vodoznak na veľkej fotke v detaile (lightbox) — väčší, stále veľmi jemný */
.lb-brand { font-size: 22px; letter-spacing: 3px; color: rgba(255,255,255,.16); z-index: 5; }
/* ── malý diskrétny štítok kvality — VPRAVO HORE pod srdiečkom (dole vľavo ho prekrývala zľava/cena, dole vpravo sú štvorčeky variantov) ── */
.qwm { position: absolute; right: 8px; top: 52px; z-index: 3; pointer-events: none; user-select: none; white-space: nowrap;
text-align: right; font-weight: 700; line-height: 1; }
.qwm-top { font-size: 8px; letter-spacing: .5px; color: rgba(255,255,255,.55); text-shadow: 0 1px 3px rgba(0,0,0,.7); }
.qwm-prem { font-size: 8px; letter-spacing: .5px; color: rgba(243,226,160,.7); text-shadow: 0 1px 3px rgba(0,0,0,.7); }
html.light .qwm-top { color: rgba(30,25,15,.55); text-shadow: 0 1px 2px rgba(255,255,255,.55); }
html.light .qwm-prem { color: rgba(140,110,20,.75); text-shadow: 0 1px 2px rgba(255,255,255,.55); }
.badge {
position: absolute; top: 9px; left: 9px; background: rgba(12,13,17,.55);
color: #fff; font-size: 10.5px; letter-spacing: .5px; padding: 3px 8px; border-radius: var(--r-xs);
border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(8px); z-index: 2;
}
.card .meta { padding: 12px 14px 14px; }
.card .brandlbl { display: block; line-height: 1.2; }
.card .cb-brand {
display: block; font-family: var(--serif); font-size: 15.5px; font-weight: 600; letter-spacing: .3px;
color: #ece6d8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.card .cb-cat {
display: block; margin-top: 3px; font-size: 9.5px; font-weight: 700; letter-spacing: 1.5px;
text-transform: uppercase; color: var(--accent-2); opacity: .82;
}
.card .count { color: var(--muted); font-size: 11px; }
.sentinel { height: 40px; }
.empty { color: var(--muted); text-align: center; padding: 70px 0; }
/* Lightbox */
.lb { position: fixed; inset: 0; z-index: 100; background: rgba(8, 9, 12, 0.97); display: none; flex-direction: column; }
.lb.open { display: flex; }
.lb .lbhead { display: flex; align-items: center; gap: 14px; padding: calc(13px + env(safe-area-inset-top, 0px)) 20px 13px; border-bottom: 1px solid var(--line); }
.lb .lbhead .t { font-size: 14px; color: var(--muted); letter-spacing: .2px; }
.lb .lbhead .sp { margin-left: auto; display: flex; gap: 9px; }
.lb .stage { flex: 1 1 auto; min-height: 42vh; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; touch-action: none; }
.lb .stage img { max-width: 92%; max-height: 100%; object-fit: contain; border-radius: var(--r-xs); will-change: transform; transform-origin: center center; }
.nav {
position: absolute; top: 50%; transform: translateY(-50%);
width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(201,162,39,.5);
background: rgba(16,15,12,.42); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
color: var(--accent-2); font-size: 24px; font-weight: 300; cursor: pointer;
display: grid; place-items: center; line-height: 1; padding: 0;
box-shadow: 0 2px 12px rgba(0,0,0,.32); transition: background .18s, border-color .18s, transform .12s, box-shadow .18s; z-index: 4;
}
.nav:hover { background: rgba(16,15,12,.7); color: #fff; border-color: var(--accent-2); box-shadow: 0 4px 18px rgba(0,0,0,.4); }
.nav:active { transform: translateY(-50%) scale(.92); }
.nav-lbl { display: none; } /* čistý elegantný chevron bez popisky */
.nav.prev { left: 18px; }
.nav.next { right: 18px; }
.thumbs { display: flex; gap: 8px; overflow-x: auto; padding: 12px 18px; border-top: 1px solid var(--line); }
.thumbs img, .thumbs video { height: 66px; width: 66px; object-fit: cover; border-radius: var(--r-xs); border: 1.5px solid transparent; cursor: pointer; opacity: .7; transition: opacity .15s, border-color .15s, box-shadow .15s; }
.thumbs img:hover, .thumbs video:hover { opacity: .9; }
.thumbs img.active, .thumbs video.active { border-color: var(--accent-2); opacity: 1; box-shadow: 0 0 0 1px rgba(230,212,160,.3); }
.iconbtn { background: var(--panel-2); border: 1px solid var(--line); color: var(--text); border-radius: var(--r-sm); padding: 9px 13px; cursor: pointer; font-size: 14px; transition: border-color .15s; }
.iconbtn:hover { border-color: var(--accent); }
@media (max-width: 700px) {
.brand h1 { font-size: 23px; letter-spacing: 4px; }
.brand-sub { font-size: 12px; letter-spacing: 5px; }
.brand-sub .bl { width: 20px; }
.filters { padding: 12px 14px 4px; }
.genderseg { max-width: none; gap: 8px; }
.gseg { flex-direction: column; gap: 3px; padding: 11px 6px; font-size: 14px; border-radius: var(--r-sm); }
.gseg .gi { font-size: 20px; }
.gseg .gn { font-size: 11px; }
.gseg .gl { font-size: 13.5px; }
.catbar { padding: 12px 0 2px; }
.cchip { padding: 9px 14px; font-size: 14px; }
main { padding-left: 14px; padding-right: 14px; }
.grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 11px; }
.brandgrid { grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 6px 0 70px; }
.ltile { aspect-ratio: 3 / 4; }
.btile-cap .bn { font-size: 17px; }
.controls { width: 100%; }
input[type="search"] { flex: 1; min-width: 0; }
.crumbs { padding: 14px 14px 4px; gap: 10px; }
.crumbs h2 { font-size: 18.5px; line-height: 1.2; }
.sechead h2 { font-size: 24px; }
}
/* ===== Vyhľadávanie podľa fotky ===== */
.photobtn {
background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1a1a;
border: none; border-radius: var(--r-sm); padding: 10px 15px; font-size: 14px; font-weight: 700;
cursor: pointer; white-space: nowrap; transition: transform .12s, box-shadow .15s;
box-shadow: 0 4px 14px rgba(201,162,39,.28);
}
.photobtn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(201,162,39,.4); }
.imgsearch { position: fixed; inset: 0; z-index: 120; background: rgba(8,9,12,.78); backdrop-filter: blur(6px); display: none; padding: 28px 16px; overflow-y: auto; }
.imgsearch.open { display: block; }
.is-panel { max-width: 1100px; margin: 0 auto; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow); overflow: hidden; }
.is-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.is-head h3 { margin: 0; font-family: var(--serif); font-size: 22px; font-weight: 600; }
.is-body { padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }
.is-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.is-lbl { font-size: 13px; color: var(--muted); letter-spacing: .3px; }
#isBrand { background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; min-width: 220px; }
.is-drop {
border: 2px dashed var(--line-2); border-radius: var(--r); min-height: 200px;
display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative;
background: var(--panel-2); transition: border-color .15s, background .15s;
}
.is-drop:hover, .is-drop.drag { border-color: var(--accent); background: rgba(201,162,39,.06); }
.is-drop-inner { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--muted); text-align: center; padding: 24px; }
.is-ico { font-size: 36px; }
.is-drop-t { font-size: 16px; color: var(--text); font-weight: 600; }
.is-drop-s { font-size: 12.5px; }
#isPreview { max-width: 100%; max-height: 320px; object-fit: contain; border-radius: var(--r-sm); display: block; }
.is-go {
align-self: flex-start; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1a1a;
border: none; border-radius: var(--r-sm); padding: 13px 22px; font-size: 15px; font-weight: 700; cursor: pointer;
transition: transform .12s, box-shadow .15s, opacity .15s;
}
.is-go:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(201,162,39,.35); }
.is-go:disabled { opacity: .45; cursor: default; }
.is-status { color: var(--muted); font-size: 14px; min-height: 18px; }
.is-results { padding: 0 20px 22px; }
.is-empty { grid-column: 1/-1; text-align: center; color: var(--muted); padding: 30px 10px; line-height: 1.7; }
.badge.sim { left: 8px; right: auto; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1a1a; font-weight: 700; }
@media (max-width: 700px) {
.photobtn { order: -1; }
.is-results { grid-template-columns: repeat(2, 1fr); }
.is-drop { min-height: 150px; }
}
/* ===== WhatsApp tlačidlá ===== */
.wabtn {
display: inline-flex; align-items: center; gap: 7px;
background: linear-gradient(180deg, #2bd66a, #25a956); color: #06351b;
border: none; border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; font-weight: 700;
cursor: pointer; white-space: nowrap; transition: transform .12s, box-shadow .15s;
box-shadow: 0 4px 14px rgba(37,169,86,.32);
}
.wabtn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(37,169,86,.45); }
.wabtn svg { display: block; }
/* „Do košíka" vo veľkom náhľade produktu — zlatý, výrazný */
.iconbtn.cart { background: rgba(201,162,39,.16); border: 1.6px solid var(--accent); color: var(--accent-2); font-weight: 700; }
.iconbtn.cart:hover { background: var(--accent); color: #1a1407; }
.iconbtn.cart.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border-color: #ffe9a3; }
.iconbtn.wa { background: linear-gradient(180deg, #2a2516, #15130b); color: #f0d585; border-color: rgba(201,162,39,.55); font-weight: 700; }
.iconbtn.wa:hover { border-color: var(--accent-2); filter: brightness(1.08); }
@media (max-width: 700px) {
.wabtn { order: -2; }
}
/* ===== Mobilná optimalizácia (doladenie) ===== */
@media (max-width: 700px) {
/* bezpečné zóny pri notchi */
header.top .bar { padding-top: calc(15px + env(safe-area-inset-top)); }
/* hlavička: WhatsApp + Foto na jednom riadku rovnako, hľadanie celé pod nimi */
.controls { width: 100%; gap: 8px; }
.wabtn, .photobtn { flex: 1 1 0; justify-content: center; padding: 12px 8px; font-size: 14px; }
.controls input[type="search"] { order: 9; flex-basis: 100%; min-width: 0; padding: 12px 14px; }
.stats { font-size: 11.5px; }
/* 📱 štíhlejšia hlavička: Zdieľať a Zvuk na mobile skryť (Zdieľať je aj dlaždica na úvode; zvuk = drobnosť) → viac produktov nad záhybom
!important nutné — nižšie je „display:grid !important" pre .controls tlačidlá */
#shareAppBtn, #notifBtn { display: none !important; }
/* väčšie dotykové chipy filtra */
.gseg { padding: 12px 6px; }
.cchip { padding: 11px 15px; font-size: 14.5px; }
/* logo dlaždice: menšie odsadenie + tesnejšie písmo, nech sa dlhé názvy zmestia */
.ltile { padding: 12px; }
.ltile .lg-name { letter-spacing: .5px; font-size: min(var(--fs, 34px), 8.5vw); }
.ltile .lg { gap: 9px; }
/* produktová mriežka – 2 stĺpce, pohodlné medzery */
.grid { grid-template-columns: repeat(2, 1fr); gap: 11px; }
.card .meta { padding: 9px 10px; }
/* LIGHTBOX – plná šírka, titulok na vlastný riadok, kompaktné tlačidlá */
.lb .lbhead { flex-wrap: wrap; gap: 8px; padding: 10px 12px; padding-top: calc(10px + env(safe-area-inset-top)); }
.lb .lbhead .t { order: 3; width: 100%; font-size: 12px; }
.lb .lbhead .sp { margin-left: auto; gap: 7px; }
.iconbtn { padding: 10px 12px; font-size: 13px; }
.lb .stage img { max-width: 100%; border-radius: 0; }
.nav { width: 44px; height: 44px; font-size: 21px; opacity: .9; }
.nav.prev { left: 6px; } .nav.next { right: 6px; }
.thumbs { padding: 8px 12px calc(10px + env(safe-area-inset-bottom)); gap: 7px; }
.thumbs img { height: 58px; width: 58px; }
/* vyhľadávanie podľa fotky – celá obrazovka */
.imgsearch { padding: 0; }
.is-panel { border-radius: 0; min-height: 100vh; }
.is-results { grid-template-columns: repeat(2, 1fr); }
}
/* jemný feedback pri ťuknutí (mobil nemá hover) */
@media (hover: none) {
.ltile:active, .card:active, .btile:active { transform: scale(.985); }
.cchip:active, .gseg:active, .wabtn:active, .photobtn:active, .iconbtn:active { filter: brightness(.92); }
}
/* ===== Instagram tlačidlá ===== */
.igbtn {
display: inline-flex; align-items: center; gap: 7px;
background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); color: #fff;
border: none; border-radius: var(--r-sm); padding: 10px 15px; font-size: 14px; font-weight: 700;
cursor: pointer; white-space: nowrap; transition: transform .12s, box-shadow .15s, filter .15s;
box-shadow: 0 4px 14px rgba(193,53,132,.32);
}
.igbtn:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(193,53,132,.45); }
.igbtn svg { display: block; }
.iconbtn.ig { background: linear-gradient(45deg, #f09433, #dc2743, #bc1888); color: #fff; border: none; font-weight: 700; }
.iconbtn.ig:hover { filter: brightness(1.06); }
/* hlavička: tri kontaktné/akčné tlačidlá v jednom riadku, hľadanie pod nimi (mobil) */
@media (max-width: 700px) {
.wabtn, .igbtn, .photobtn { flex: 1 1 30%; justify-content: center; padding: 11px 6px; font-size: 13.5px; }
.wabtn svg, .igbtn svg { width: 15px; height: 15px; }
}
/* ===== Režim úprav (curate) ===== */
.editbtn {
background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2);
border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap;
transition: border-color .15s, background .15s, color .15s;
}
.editbtn:hover { border-color: var(--accent); }
.editbtn.active { background: var(--accent); color: #1a1a1a; border-color: var(--accent); }
.curate-only { display: none !important; }
body.curate .curate-only { display: inline-flex !important; }
.curatebar {
max-width: 1440px; margin: 0 auto; padding: 12px 22px; gap: 12px;
align-items: center; flex-wrap: wrap; border-bottom: 1px solid var(--line);
background: rgba(201,162,39,.06);
}
body.curate .curatebar { display: flex; }
.curatebar .cb-info { color: var(--muted); font-size: 13px; }
.curatebar .cb-info b { color: var(--accent-2); }
.cb-btn { margin-left: auto; background: var(--accent); color: #1a1a1a; border: none; border-radius: var(--r-sm); padding: 9px 14px; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.cb-btn.ghost { margin-left: 0; background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); }
.cb-btn:hover { filter: brightness(1.05); }
.iconbtn.cover { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1a1a; border: none; font-weight: 700; }
.iconbtn.hide { background: #3a2330; color: #ff9db5; border-color: #5a3346; }
/* malý štítok „skryté/upravené" v rohu karty počas úprav (info) */
body.curate .card, body.curate .btile { outline: 1px dashed rgba(201,162,39,.25); }
#toast {
position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom));
transform: translateX(-50%) translateY(16px); z-index: 300;
background: rgba(20,22,28,.96); color: #fff; padding: 11px 18px; border-radius: var(--r-sm);
border: 1px solid var(--line-2); font-size: 14px; opacity: 0; pointer-events: none;
transition: opacity .25s, transform .25s; box-shadow: var(--shadow);
}
#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
body.curate #curatebar { display: flex !important; }
/* ===== Zdieľanie produktu (panel) ===== */
.iconbtn.share { background: rgba(201,162,39,.12); color: #f0e6c8; border: 1.5px solid rgba(201,162,39,.55); font-weight: 700; }
.iconbtn.share:hover { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border-color: #ffe9a3; }
.iconbtn.share .ic-svg { vertical-align: -3px; }
.iconbtn.share:active { transform: scale(.95); }
.sharepop {
position: absolute; top: 62px; right: 16px; z-index: 130;
background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r);
padding: 14px; box-shadow: var(--shadow); width: 320px; max-width: calc(100vw - 24px);
}
.sharepop .sp-title { font-size: 13px; color: var(--muted); margin-bottom: 10px; }
.sp-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.sp-item {
display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 11px 4px;
border-radius: var(--r-sm); border: 1px solid var(--line-2); background: var(--panel-2); color: var(--text);
font-size: 11px; font-weight: 600; cursor: pointer; transition: border-color .15s, transform .12s;
}
.sp-item span { font-size: 21px; line-height: 1; }
.sp-item:hover { border-color: var(--accent); transform: translateY(-2px); }
.sp-item.swa:hover { border-color: #25a956; }
.sp-item.sig:hover { border-color: #dc2743; }
@media (max-width: 700px) {
.sharepop {
position: fixed; top: auto; bottom: 0; left: 0; right: 0; width: 100%; max-width: none;
border-radius: var(--r-lg) var(--r-lg) 0 0; padding: 16px 16px calc(18px + env(safe-area-inset-bottom));
border-bottom: none;
}
.sharepop .sp-title { font-size: 14px; text-align: center; margin-bottom: 14px; }
.sp-item { padding: 12px 4px; font-size: 12px; }
}
/* "Upraviť" len pre majiteľa (cez ?edit) */
#curateBtn { display: none; }
body.owner #curateBtn { display: inline-flex; }
/* ===== Inštalovať appku (PWA) ===== */
.instbtn {
position: relative;
display: inline-flex; align-items: center; gap: 6px;
background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1a1a;
border: none; border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; font-weight: 700;
cursor: pointer; white-space: nowrap; box-shadow: 0 4px 14px rgba(201,162,39,.3);
}
.instbtn:hover { filter: brightness(1.05); }
/* 🎁 odmena −10 % — pripnutý odznak, viditeľný aj na mobile (kde má tlačidlo font-size:0) */
.inst-badge {
position: absolute; top: -8px; right: -8px;
font-size: 10.5px; line-height: 1; font-weight: 800; letter-spacing: .2px;
color: #fff; background: linear-gradient(180deg, #ff4d4d, #d40f0f);
padding: 3px 6px; border-radius: var(--r-pill); white-space: nowrap;
border: 1.5px solid var(--bg, #0d0d0f); box-shadow: 0 2px 7px rgba(210,20,20,.5);
pointer-events: none;
}
@media (max-width: 700px) { .instbtn { flex: 1 1 100%; justify-content: center; padding: 12px; } }
/* ===== Navigácia sekcií (Album / Akcie / Novinky) ===== */
.sectionnav {
display: flex; gap: 8px; align-items: center;
padding: 10px 20px; max-width: 1500px; margin: 0 auto;
border-bottom: 1px solid var(--line);
}
/* náznak že sa lišta dá scrollovať doprava — zlatý fade + pulzujúca šípka › */
.snavwrap { position: relative; max-width: 1500px; margin: 0 auto; }
.snavwrap::after { content: ''; position: absolute; top: 0; right: 0; bottom: 1px; width: 58px; background: linear-gradient(90deg, transparent, var(--bg) 72%); pointer-events: none; opacity: 1; transition: opacity .25s; z-index: 2; }
.snavwrap.at-end::after { opacity: 0; }
.snav-more { position: absolute; top: 50%; right: 8px; transform: translateY(-50%); z-index: 3; width: 30px; height: 30px; padding: 0; border: none; border-radius: 50%; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; font-size: 21px; font-weight: 900; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 3px 11px rgba(201,162,39,.55); animation: snavnudge 1.4s ease-in-out infinite; transition: opacity .2s; }
.snavwrap.at-end .snav-more { opacity: 0; pointer-events: none; }
@keyframes snavnudge { 0%, 100% { transform: translateY(-50%) translateX(0); } 50% { transform: translateY(-50%) translateX(3px); } }
/* Sekcia Zľavy — zlatá dlaždica (ladí s feedom) + malý červený odznak „%" ako signál zľavy */
.albumbanner.salebnr { border-color: rgba(201,162,39,.6); }
.albumbanner.salebnr .sale-pct { margin-left: auto; margin-right: 6px; align-self: center; font-size: 14px; font-weight: 900; color: #2a1d02; background: linear-gradient(180deg, #f6dd8a, #cda233); padding: 4px 13px; border-radius: var(--r-pill); box-shadow: 0 2px 9px rgba(201,162,39,.5), inset 0 1px 0 rgba(255,255,255,.4); line-height: 1.3; }
.snav {
position: relative; display: inline-flex; align-items: center; gap: 6px;
background: linear-gradient(180deg, rgba(201,162,39,.12), rgba(201,162,39,.04));
color: var(--accent-2); border: 1px solid rgba(201,162,39,.45);
border-radius: var(--r-pill); padding: 9px 16px; font-size: 14px; font-weight: 700;
cursor: pointer; transition: border-color .15s, background .15s, transform .1s, box-shadow .15s;
}
.snav:hover { border-color: var(--accent); background: linear-gradient(180deg, rgba(201,162,39,.2), rgba(201,162,39,.07)); transform: translateY(-1px); }
.snav.active { background: linear-gradient(180deg, #f6dd8a 0%, #e6c462 46%, #cda233 100%); border: none; color: #2a1d02; font-weight: 800; text-shadow: 0 1px 0 rgba(255,255,255,.28); box-shadow: 0 5px 16px rgba(201,162,39,.42), inset 0 1px 0 rgba(255,255,255,.5); }
.nbadge {
min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--r-pill);
background: var(--female); color: #fff; font-size: 11px; font-weight: 800;
display: inline-flex; align-items: center; justify-content: center; line-height: 1;
}
/* ===== Sekcie Akcie / Novinky ===== */
#sectionView { max-width: 980px; margin: 0 auto; padding: 22px 20px 60px; }
.sechead { margin-bottom: 18px; }
.sechead h2 { font-family: 'Cormorant Garamond', serif; font-size: 30px; font-weight: 700; color: var(--text); margin: 0 0 4px; }
.secsub { color: var(--muted); font-size: 14px; margin: 0; }
.seclist { display: flex; flex-direction: column; gap: 16px; }
.seccard {
display: flex; gap: 16px; background: var(--panel); border: 1px solid var(--line);
border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow);
}
.sc-img { flex: 0 0 200px; cursor: pointer; background: var(--bg-2); }
.sc-img img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 1/1; }
.sc-body { flex: 1 1 auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.sc-new { align-self: flex-start; background: var(--female); color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .5px; padding: 3px 8px; border-radius: var(--r-pill); }
.sc-body h3 { margin: 0; font-size: 18px; font-weight: 700; color: var(--text); }
.sc-date { font-size: 12px; color: var(--muted); }
.sc-body p { margin: 0; font-size: 14px; line-height: 1.5; color: #cdd2df; }
.sc-cta {
align-self: flex-start; margin-top: 4px; background: linear-gradient(180deg, var(--accent-2), var(--accent));
color: #1a1407; border: none; border-radius: var(--r-sm); padding: 9px 16px; font-size: 13.5px; font-weight: 700;
cursor: pointer; box-shadow: 0 4px 14px rgba(201,162,39,.3);
}
.sc-cta:hover { filter: brightness(1.05); }
.secempty { color: var(--muted); text-align: center; padding: 60px 0; font-size: 15px; }
@media (max-width: 700px) {
.sectionnav { padding: 8px 12px; overflow-x: auto; }
.snav { flex: 0 0 auto; }
.seccard { flex-direction: column; }
.sc-img { flex: none; width: 100%; }
.sc-img img { aspect-ratio: 16/10; }
}
/* ===== Obľúbené (Wishlist) ===== */
.heart {
position: absolute; top: 8px; right: 8px; z-index: 3;
width: 36px; height: 36px; border-radius: 50%; padding: 0;
background: rgba(12,13,17,.58); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
border: 1.5px solid var(--accent); color: #fff; /* zlatý rám — srdce sa nestratí na čiernom pozadí */
box-shadow: 0 2px 10px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.12);
font-size: 16px; line-height: 1; cursor: pointer;
display: flex; align-items: center; justify-content: center;
transition: transform .12s ease, background .15s, border-color .15s; opacity: 1;
}
.heart:hover { background: rgba(12,13,17,.85); border-color: var(--accent-2); transform: scale(1.12); }
.heart.on { background: rgba(199,92,147,.3); border-color: #ef9cc1; color: #ff6fae; box-shadow: 0 2px 12px rgba(199,92,147,.5); }
.heart .e3d, .heart svg.e3d { filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)); }
.iconbtn.fav.on { border-color: var(--female); color: var(--female-2); }
/* ===================================================================
REDIZAJN 2026-06 — plávajúce kontakty (FAB), kompaktná hlavička,
prehľadnejší lightbox, mobile-first.
=================================================================== */
/* ---- Plávajúce kontaktné tlačidlá (vpravo dole) ---- */
.fab {
position: fixed; right: 16px; bottom: 16px; z-index: 90;
display: flex; flex-direction: column-reverse; gap: 11px; align-items: flex-end;
padding-bottom: env(safe-area-inset-bottom, 0);
}
.fab-btn {
border: none; cursor: pointer; border-radius: 50%; color: #fff; padding: 0;
display: grid; place-items: center; position: relative;
box-shadow: 0 8px 22px rgba(0,0,0,.45);
transition: transform .14s ease, box-shadow .15s, filter .15s;
}
.fab-btn:hover { transform: scale(1.08); filter: brightness(1.04); }
.fab-btn:active { transform: scale(.95); }
.fab-btn svg { display: block; }
.fab-wa { width: 62px; height: 62px; background: linear-gradient(180deg, #2a2516, #15130b); color: #46d488; border: 1px solid rgba(201,162,39,.55); box-shadow: 0 10px 26px rgba(201,162,39,.36); }
.fab-ig { width: 52px; height: 52px; background: linear-gradient(180deg, #2a2516, #15130b); color: #f0d585; border: 1px solid rgba(201,162,39,.5); box-shadow: 0 8px 22px rgba(201,162,39,.3); }
/* popisok vľavo od tlačidla — aby aj klientka bez WhatsAppu hneď videla, že nám môže napísať */
.fab-cap { position: absolute; right: calc(100% + 9px); top: 50%; transform: translateY(-50%);
background: rgba(15,16,22,.82); color: #fff; font-size: 11.5px; font-weight: 700; letter-spacing: .2px;
padding: 4px 9px; border-radius: var(--r-xs); white-space: nowrap; pointer-events: none;
-webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); box-shadow: 0 3px 10px rgba(0,0,0,.35); }
.fab-pulse { position: absolute; inset: 0; border-radius: 50%; animation: fabpulse 2.6s infinite; pointer-events: none; }
/* 📱 hub „Kontakt" — na desktope skrytý (bubliny sú rovno), na mobile jediný vstup ku kontaktom */
.fab-hub { display: none; width: 62px; height: 62px; background: linear-gradient(180deg, #2a2516, #15130b); color: #f0d585; border: 1px solid rgba(201,162,39,.55); box-shadow: 0 10px 26px rgba(201,162,39,.4); }
.fab-hub .fh-x { display: none; font-size: 22px; font-weight: 700; line-height: 1; }
.fab.open .fab-hub .fh-ico { display: none; }
.fab.open .fab-hub .fh-x { display: block; }
.fab.open .fab-hub .fab-pulse { display: none; }
@media (max-width: 640px) {
.fab-hub { display: grid; }
.fab .fab-chat, .fab .fab-ig, .fab .fab-wa { display: none; } /* kontakty zbalené pod hub → neprekrývajú karty produktov */
.fab.open .fab-chat, .fab.open .fab-ig, .fab.open .fab-wa { display: grid; }
body.fabs-hide .fab-hub, body.fabs-hide .fab .fab-chat, body.fabs-hide .fab .fab-ig, body.fabs-hide .fab .fab-wa { opacity: 0; pointer-events: none; transform: translateY(14px); }
.fab-hub, .fab .fab-chat, .fab .fab-ig, .fab .fab-wa { transition: opacity .2s ease, transform .2s ease; }
}
@keyframes fabpulse {
0% { box-shadow: 0 0 0 0 rgba(201,162,39,.45); }
70% { box-shadow: 0 0 0 14px rgba(201,162,39,0); }
100% { box-shadow: 0 0 0 0 rgba(201,162,39,0); }
}
/* keď je aktívny Crisp chat (bublina vpravo dole), zdvihni FAB nad ňu */
.has-chat .fab { bottom: 88px; }
/* ---- Kompaktné „Hľadať fotkou" (ikona+text, na mobile len ikona) ---- */
.photobtn .pi { font-size: 16px; line-height: 1; }
.photobtn .pt { margin-left: 2px; }
/* ---- Lightbox: WhatsApp ako primárna akcia + jasné Zavrieť ---- */
.iconbtn.wa.primary { background: linear-gradient(180deg, #2a2516, #15130b); border-color: rgba(201,162,39,.6); color: #f0d585; font-weight: 700; }
.iconbtn.wa.primary:hover { background: linear-gradient(180deg, #34301d, #1b180e); border-color: var(--accent-2); }
.iconbtn.fav.on { border-color: var(--female); color: var(--female-2); }
/* výrazné Zavrieť (✕) — jasné ako sa vrátiť z otvoreného produktu */
.iconbtn.close {
width: 44px; height: 44px; padding: 0; border-radius: 50%;
display: grid; place-items: center; font-size: 20px; font-weight: 700; line-height: 1;
background: rgba(255,255,255,.12); border: 1.6px solid rgba(255,255,255,.5); color: #fff;
}
.iconbtn.close:hover { background: #e0455f; border-color: #e0455f; color: #fff; transform: scale(1.06); }
.iconbtn.close:active { transform: scale(.94); }
.lb .lbhead { flex-wrap: wrap; gap: 10px 8px; }
.lb .lbhead .t { flex: 1 1 140px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ====================== MOBILE (≤700px) ====================== */
@media (max-width: 700px) {
.bar { padding: 10px 14px; gap: 8px 10px; }
.stats { display: none; } /* štatistiku skry — šetrí miesto */
/* ikony vpravo na 1 riadku, hľadanie na vlastnom riadku (žiadne odrezanie) */
.controls { width: 100%; margin-left: 0; gap: 6px; flex-wrap: wrap; justify-content: center; align-items: center; }
.langsel { order: 1; padding: 10px 23px 10px 10px; min-height: 40px; }
.cartheadbtn { order: 2; padding: 10px 10px; min-height: 40px; }
.photobtn { order: 3; flex: 0 0 auto; padding: 10px 10px; font-size: 16px; border-radius: var(--r-sm); min-height: 40px; }
.photobtn .pt { display: none; } /* na mobile len ikona */
.instbtn { order: 4; flex: 0 0 auto; width: auto; padding: 10px 10px; font-size: 0; border-radius: var(--r-sm); min-height: 40px; }
.instbtn::before { content: none; } /* ikonu rieši 3D ![]()
, žiadny emoji navyše */
#search { flex: 1 1 100%; order: 9; min-width: 0; } /* hľadanie na vlastný riadok pod ikonami */
/* dlaždice: 2 stĺpce, vyšší pomer nech vidno celý kúsok */
.grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
/* lightbox akcie: kompaktné, WhatsApp dominuje — horné safe-area kvôli notchu/Dynamic Island */
.lb .lbhead { padding: calc(11px + env(safe-area-inset-top, 0px)) 14px 11px; }
.iconbtn { padding: 9px 11px; font-size: 13.5px; }
.iconbtn.fav, .iconbtn.share { font-size: 0; padding: 9px 12px; } /* len ikona (emoji v texte) */
.iconbtn.fav::first-letter, .iconbtn.share::first-letter { font-size: 16px; }
.fab { right: 14px; bottom: 14px; }
.fab-wa { width: 58px; height: 58px; }
.fab-chat { width: 58px; height: 58px; }
.fab-ig { width: 44px; height: 44px; }
.fab-cap { font-size: 11px; padding: 3px 8px; }
}
/* ---- Plávajúce „Späť" (vľavo dole) — vždy poruke mimo úvodu ---- */
.fabback {
position: fixed; left: 14px; bottom: 20px; z-index: 90; /* dole v rohu — neprekrýva tlačidlá kúskov v mriežke */
display: inline-flex; align-items: center; gap: 5px;
background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407;
border: none; border-radius: var(--r-pill); padding: 12px 18px 12px 15px; cursor: pointer;
font-size: 14.5px; font-weight: 800; letter-spacing: .2px;
box-shadow: 0 8px 22px rgba(201,162,39,.4);
transition: transform .12s, filter .15s, box-shadow .15s;
padding-bottom: calc(12px + env(safe-area-inset-bottom, 0));
}
.fabback .fb-arrow { font-size: 20px; line-height: 1; margin-top: -2px; }
.fabback:hover { transform: translateX(-3px); filter: brightness(1.05); box-shadow: 0 10px 26px rgba(201,162,39,.5); }
.fabback:active { transform: scale(.95); }
@media (max-width: 700px) {
.fabback { left: 12px; bottom: calc(18px + env(safe-area-inset-bottom, 0)); padding: 11px 16px 11px 13px; font-size: 14px; }
}
/* keď je otvorený produkt (lightbox), schovaj plávajúce tlačidlá — lightbox má vlastné ✕ a šípky */
body.lbopen .fab, body.lbopen .fabback, body.lbopen .fabcart { display: none !important; }
/* ---- Plávajúci KOŠÍK (dole v strede) — vždy viditeľný keď má kúsky ---- */
.fabcart {
position: static; transform: none; /* je flex-dieťa #fab → sedí DOLE v pravom rohovom stĺpci */
display: inline-flex; align-items: center; gap: 7px;
background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407;
border: none; border-radius: var(--r-pill); padding: 12px 18px; cursor: pointer;
font-size: 15px; font-weight: 800; letter-spacing: .2px;
box-shadow: 0 10px 28px rgba(201,162,39,.5), 0 0 0 3px rgba(255,233,163,.25);
transition: transform .12s, filter .15s, box-shadow .15s;
animation: fabcartpop .3s ease-out;
}
.fabcart[hidden] { display: none !important; }
.fabcart .fc-ico { font-size: 18px; line-height: 1; display: inline-flex; }
.fabcart .e3d { width: 20px; height: 20px; vertical-align: -5px; }
.fabcart .fc-n {
min-width: 22px; height: 22px; padding: 0 6px; border-radius: var(--r-pill);
background: #1a1407; color: var(--accent-2); font-size: 13px; font-weight: 900;
display: inline-flex; align-items: center; justify-content: center;
}
.fabcart .fc-go { font-size: 19px; line-height: 1; margin-left: -2px; }
.fabcart:hover { transform: translateY(-2px); filter: brightness(1.05); }
.fabcart:active { transform: scale(.96); }
@keyframes fabcartpop { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 700px) { .fabcart { padding: 11px 16px; font-size: 14px; } }
/* ---- ⚡ RÝCHLA KÚPA na karte produktu (len kúsky s cenou; v .meta = zarovnané s textom) ---- */
.card .meta .cardbuy {
display: flex; align-items: center; justify-content: center; gap: 9px;
width: 100%; margin: 11px 0 0; padding: 13px 14px;
background: linear-gradient(180deg, #f6dd8a 0%, #e6c462 46%, #cda233 100%); color: #2a1d02;
border: none; border-radius: var(--r-sm); cursor: pointer;
font-size: 14.5px; font-weight: 800; letter-spacing: .3px; line-height: 1;
box-shadow: 0 5px 16px rgba(201,162,39,.42), inset 0 1px 0 rgba(255,255,255,.55);
text-shadow: 0 1px 0 rgba(255,255,255,.28);
transition: transform .12s ease, box-shadow .16s ease, filter .16s; -webkit-tap-highlight-color: transparent;
}
.card .meta .cardbuy .e3d { width: 20px; height: 20px; filter: drop-shadow(0 1px 1px rgba(0,0,0,.28)); }
.card .meta .cardbuy:hover { filter: brightness(1.04); transform: translateY(-2px); box-shadow: 0 9px 24px rgba(201,162,39,.52), inset 0 1px 0 rgba(255,255,255,.6); }
.card .meta .cardbuy:active { transform: scale(.975); box-shadow: 0 3px 10px rgba(201,162,39,.4), inset 0 1px 0 rgba(255,255,255,.5); }
@media (max-width: 700px) { .card .meta .cardbuy { font-size: 14px; padding: 13px 12px; } }
/* ---- CTA riadok: „Kúpiť hneď" (flex:1) + okrúhly košík vpravo (preč z fotky, nech ho varianty neprekrývajú) ---- */
.card .meta .card-cta { display: flex; align-items: stretch; gap: 8px; margin-top: 11px; }
.card .meta .card-cta .cardbuy { flex: 1 1 auto; margin: 0; min-width: 0; }
.card .meta .card-cta .cartbtn {
position: static; flex: 0 0 auto; align-self: stretch;
width: 50px; height: auto; min-height: 0; border-radius: var(--r-sm); font-size: 19px;
background: rgba(12,13,17,.72); border: 2px solid var(--accent); color: var(--accent-2);
box-shadow: 0 5px 16px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.06);
}
.card .meta .card-cta .cartbtn:hover { background: var(--accent); color: #1a1407; transform: translateY(-2px); }
.card .meta .card-cta .cartbtn.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border-color: #ffe9a3; }
@media (max-width: 700px) { .card .meta .card-cta .cartbtn { width: 46px; } }
/* ---- ⚡ Rýchla kúpa v lightboxe (info panel) ---- */
.lbi-buy { display: flex; flex: 1 1 100%; width: 100%; gap: 8px; margin-top: 10px; }
.lbi-fastbuy, .lbi-tocart {
flex: 1 1 50%; padding: 13px 10px; border-radius: var(--r-sm); cursor: pointer;
font-size: 14.5px; font-weight: 800; line-height: 1.15; border: none;
transition: transform .1s, filter .15s;
}
.lbi-fastbuy { background: linear-gradient(180deg, #f6dd8a 0%, #e6c462 46%, #cda233 100%); color: #2a1d02; box-shadow: 0 6px 20px rgba(201,162,39,.42), inset 0 1px 0 rgba(255,255,255,.55); text-shadow: 0 1px 0 rgba(255,255,255,.28); }
.lbi-tocart { background: var(--panel-2); color: var(--accent-2); border: 2px solid var(--accent); }
.lbi-fastbuy:hover, .lbi-tocart:hover { filter: brightness(1.06); transform: translateY(-1px); }
.lbi-fastbuy:active, .lbi-tocart:active { transform: scale(.97); }
/* plávajúce WhatsApp v produkte (vpravo dole — vždy po ruke, mimo notchu) */
.lbfabwa { position: fixed; right: 16px; bottom: calc(98px + env(safe-area-inset-bottom, 0px)); z-index: 120;
width: 60px; height: 60px; border-radius: 50%; border: 1px solid rgba(201,162,39,.55); cursor: pointer; color: #46d488;
background: linear-gradient(180deg, #2a2516, #15130b); display: flex; align-items: center; justify-content: center;
box-shadow: 0 8px 24px rgba(201,162,39,.32); animation: lbwapulse 2.6s ease-in-out infinite; }
.lbfabwa:active { transform: scale(.92); }
@keyframes lbwapulse { 0%,100% { box-shadow: 0 8px 24px rgba(0,0,0,.4), 0 0 0 0 rgba(201,162,39,.4); } 50% { box-shadow: 0 8px 24px rgba(0,0,0,.4), 0 0 0 10px rgba(201,162,39,0); } }
@media (prefers-reduced-motion: reduce){ .lbfabwa { animation: none; } }
/* ===== In-app AI chat ===== */
.fab-chat { width: 62px; height: 62px; background: linear-gradient(180deg, #2a2516, #15130b); color: #f0d585; border: 1px solid rgba(201,162,39,.55); box-shadow: 0 10px 26px rgba(201,162,39,.4); }
.chatwrap { position: fixed; inset: 0; z-index: 1500; display: none; align-items: stretch; justify-content: center; }
.chatwrap.open { display: flex; animation: chatwrapIn .22s ease; }
@keyframes chatwrapIn { from { opacity: 0; } to { opacity: 1; } }
.chat-card { width: 100%; max-width: 560px; height: 100vh; height: 100dvh; display: flex; flex-direction: column; box-sizing: border-box;
background:
radial-gradient(130% 60% at 50% 0%, rgba(201,162,39,.10), transparent 55%),
linear-gradient(180deg, var(--bg-2), var(--bg)); border: none; }
@media (min-width: 600px){ .chat-card { border-left: 1px solid var(--line); border-right: 1px solid var(--line); box-shadow: 0 0 70px rgba(0,0,0,.6); } }
.chat-head { display: flex; align-items: center; gap: 11px; padding: calc(13px + env(safe-area-inset-top, 0px)) 14px 12px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, rgba(201,162,39,.08), transparent); }
.chat-av { position: relative; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 18px; color: #1a1203; background: linear-gradient(135deg, var(--accent), #ecd98a); box-shadow: 0 3px 10px rgba(201,162,39,.4); }
.chat-on { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%; background: #25d366; border: 2px solid var(--bg-2); }
.chat-hh { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.chat-ttl { font-weight: 800; font-size: 16px; color: var(--text); }
.chat-sub { font-size: 12px; color: var(--muted); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-x { background: rgba(255,255,255,.06); border: none; color: var(--muted); width: 34px; height: 34px; border-radius: 50%; cursor: pointer; font-size: 15px; flex: 0 0 auto; }
.chat-msgs { flex: 1; overflow-y: auto; padding: 16px 14px 8px; display: flex; flex-direction: column; gap: 10px; -webkit-overflow-scrolling: touch; }
.cmsg { max-width: 80%; padding: 10px 14px; border-radius: var(--r); font-size: 15px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
.cmsg.bot { align-self: flex-start; background: var(--panel); border: 1px solid var(--line); color: var(--text); border-bottom-left-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.cmsg.me { align-self: flex-end; background: linear-gradient(135deg, var(--accent), #ecd98a); color: #1a1203; border-bottom-right-radius: 6px; font-weight: 500; box-shadow: 0 2px 8px rgba(201,162,39,.28); }
.cmsg.typing { color: var(--muted); font-style: italic; }
.cmsg.chat-ack { color: var(--muted); font-style: italic; opacity: .92; }
.cmsg .cimg { width: 100%; max-width: 230px; max-height: 300px; object-fit: cover; border-radius: var(--r-sm); display: block; }
.cmsg:has(.cimg) { padding: 5px; }
/* odznak neprečítaných správ na ikone chatu */
.fab-badge {
position: absolute; top: -3px; right: -3px; min-width: 19px; height: 19px; padding: 0 5px;
border-radius: var(--r-sm); background: #e0245e; color: #fff; font-size: 11px; font-weight: 800;
display: grid; place-items: center; line-height: 1; box-shadow: 0 2px 7px rgba(0,0,0,.45);
border: 2px solid #15130b; z-index: 3; pointer-events: none;
}
.chat-foot { padding: 9px 12px calc(9px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); background: var(--bg-2); }
.chat-inrow { display: flex; gap: 8px; align-items: center; }
.chat-photo { flex: 0 0 42px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line-2); background: var(--panel); color: var(--accent-2); font-size: 19px; cursor: pointer; display: grid; place-items: center; transition: transform .1s; }
.chat-photo:active { transform: scale(.92); }
.chat-in { flex: 1; min-width: 0; padding: 12px 16px; border-radius: var(--r-lg); border: 1px solid var(--line-2); background: var(--panel); color: var(--text); font-size: 16px; outline: none; }
.chat-in:focus { border-color: var(--accent); }
.chat-send { flex: 0 0 46px; width: 46px; height: 46px; border-radius: 50%; border: none; cursor: pointer; background: linear-gradient(135deg,var(--accent),#ecd98a); color: #1a1203; font-size: 18px; font-weight: 800; display: grid; place-items: center; box-shadow: 0 3px 10px rgba(201,162,39,.35); transition: transform .1s; }
.chat-send:active { transform: scale(.92); }
.chat-wa { display: block; width: max-content; max-width: 100%; margin: 9px auto 1px; padding: 6px 14px; border-radius: var(--r-lg); border: 1px solid rgba(37,211,102,.4); cursor: pointer; background: rgba(37,211,102,.12); color: #25d366; font-weight: 600; font-size: 12.5px; }
.chat-wa:active { transform: scale(.97); }
#chatImgPrev:not(:empty) { padding: 0 4px 8px; display: flex; align-items: center; }
#chatImgPrev img { height: 56px; border-radius: var(--r-sm); border: 1px solid var(--line); }
#chatImgPrev button { background: none; border: none; color: #e0455f; font-size: 13px; cursor: pointer; margin-left: 8px; }
/* ===== Recenzie ===== */
.reviewshome { max-width: 1500px; margin: 14px auto 0; }
body:not(.athome) .reviewshome { display: none; }
.rv-head { display: flex; align-items: baseline; gap: 8px; padding: 0 20px; font: 800 16px var(--sans); color: var(--text); margin-bottom: 10px; }
.rv-sub { font-size: 12px; font-weight: 500; color: var(--muted); }
.rv-row { display: flex; gap: 12px; overflow-x: auto; padding: 2px 18px 8px; scrollbar-width: none; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.rv-row::-webkit-scrollbar { display: none; }
.rv-card { flex: 0 0 86%; max-width: 340px; box-sizing: border-box; scroll-snap-align: start; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 14px; display: flex; flex-direction: column; gap: 9px; }
.rv-stars { color: #ffce3a; font-size: 15px; letter-spacing: 2px; }
.rv-text { font-size: 14px; line-height: 1.5; color: var(--text); }
.rv-photo { width: 100%; border-radius: var(--r-sm); overflow: hidden; background: #0a0b0e; }
.rv-photo img { width: 100%; height: 200px; object-fit: cover; display: block; } /* pevná výška = rezervované miesto → fotka neskáče (CLS) */
.rv-name { font-size: 12.5px; color: var(--muted); font-weight: 600; margin-top: auto; display: flex; align-items: center; gap: 6px; }
.rv-vrf { color: #25d366; font-size: 11px; }
.rv-date { font-size: 11px; color: var(--muted); opacity: .7; margin-top: 3px; }
@media (min-width: 560px) { .rv-card { flex-basis: 320px; } }
/* dlaždica Recenzie (pri Albume) */
.reviewsbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 0 auto; padding: 16px;
border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(120deg, #7c3f12, #c2761b 55%, #f0a93a); border: 1px solid rgba(255,210,140,.45);
box-shadow: 0 8px 26px rgba(194,118,27,.3); position: relative; overflow: hidden; }
.reviewsbanner::after { content: ""; position: absolute; top: 0; left: -60%; width: 38%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,255,255,.2), transparent); transform: skewX(-18deg); animation: vipshine 5.3s ease-in-out infinite; }
.reviewsbanner:hover { filter: brightness(1.08); }
.reviewsbanner .rvb-ic { font-size: 27px; flex: 0 0 42px; width: 42px; text-align: center; display: inline-block; filter: drop-shadow(0 2px 4px rgba(0,0,0,.35)); animation: icoPulse 2.2s ease-in-out infinite; }
.reviewsbanner .rvb-mid { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.reviewsbanner .rvb-title { font: 700 16px var(--sans); letter-spacing: .1px; line-height: 1.25; text-shadow: 0 1px 2px rgba(0,0,0,.3); color: #fff; }
.reviewsbanner .rvb-sub { font: 500 12px var(--sans); opacity: .95; line-height: 1.3; text-shadow: 0 1px 1px rgba(0,0,0,.22); color: #ffe9c7; }
.reviewsbanner .rvb-go { color: #ffe9c7; }
/* modál Všetky recenzie */
.rvgate { position: fixed; inset: 0; z-index: 1460; display: none; align-items: flex-end; justify-content: center; background: rgba(8,9,12,.82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.rvgate.open { display: flex; }
.rvg-panel { width: 100%; max-width: 480px; height: min(88vh, 760px); display: flex; flex-direction: column; box-sizing: border-box; background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r-lg) var(--r-lg) 0 0; box-shadow: 0 -10px 44px rgba(0,0,0,.55); }
@media (min-width: 560px) { .rvgate { padding: 0 16px 16px; } .rvg-panel { border-radius: var(--r-lg); } }
.rvg-head { display: flex; align-items: center; gap: 10px; padding: calc(16px + env(safe-area-inset-top, 0px)) 18px 14px; border-bottom: 1px solid var(--line); }
.rvg-ttl { flex: 1; font-size: 15px; color: var(--text); }
.rvg-ttl b { color: #ffce3a; font-size: 18px; }
.rvg-x { background: rgba(255,255,255,.06); border: none; color: var(--muted); width: 34px; height: 34px; border-radius: 50%; cursor: pointer; font-size: 14px; }
.rvg-list { flex: 1; overflow-y: auto; padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px)); display: flex; flex-direction: column; gap: 12px; }
.rvg-list .rv-card { flex: none; max-width: none; }
/* ===== Košík (dopyt na cenu) ===== */
.cartbtn {
position: absolute; bottom: 8px; right: 8px; z-index: 3;
width: 34px; height: 34px; border-radius: 50%; border: none; padding: 0;
background: rgba(12,13,17,.55); backdrop-filter: blur(4px); color: #fff;
font-size: 15px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center;
transition: transform .12s, background .15s; opacity: .92;
}
/* zvýraznené „Do košíka" na kartičke produktu — väčšie, zlatý okraj, nech ho vidno */
.cartbtn {
width: 40px; height: 40px; font-size: 18px; opacity: 1;
background: rgba(12,13,17,.7); border: 2px solid var(--accent); color: var(--accent-2);
box-shadow: 0 3px 12px rgba(0,0,0,.4);
}
.cartbtn:hover { background: var(--accent); color: #1a1407; transform: scale(1.12); }
.cartbtn.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; font-weight: 800; border-color: #ffe9a3; }
.nbadge.cart { background: var(--accent); color: #1a1407; }
.iconbtn.cart.on { border-color: var(--accent); color: var(--accent-2); }
#cartView { max-width: 800px; margin: 0 auto; padding: 22px 20px 70px; }
.cart-head h2 { font-family: var(--serif); font-size: 30px; font-weight: 700; margin: 0 0 4px; }
.cart-head #cartCount { font-family: var(--sans); font-size: 16px; color: var(--accent-2); font-weight: 700; }
.cart-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.cart-send {
flex: 1 1 auto; background: #25a956; color: #fff; border: none; border-radius: var(--r-sm);
padding: 15px 20px; font-size: 15.5px; font-weight: 800; cursor: pointer;
box-shadow: 0 6px 20px rgba(37,169,86,.4); transition: transform .12s, filter .15s;
}
.cart-send:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.05); }
.cart-send:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.cart-clear { background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 15px 18px; font-size: 14px; cursor: pointer; }
.cart-clear:hover { border-color: var(--female); color: var(--female-2); }
/* #1 ZÁCHRANA KOŠÍKA — hierarchia CTA + dôvera + pripravená zľava */
.cart-send-2nd { background: transparent !important; color: #2fbf6a !important; border: 1.5px solid rgba(47,169,86,.55) !important; box-shadow: none !important; font-size: 14px !important; flex: 1 1 100% !important; }
.cart-send-2nd:hover:not(:disabled) { background: rgba(47,169,86,.08) !important; }
#cartCheckout { flex: 1 1 100% !important; font-size: 16.5px !important; box-shadow: 0 8px 24px rgba(201,162,39,.4) !important; }
.cart-trust { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-top: 12px; padding: 12px 14px; background: rgba(201,162,39,.05); border: 1px solid rgba(201,162,39,.22); border-radius: var(--r); }
.cart-trust .ct-i { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink-2, #cfc7d6); }
.cart-trust .e3d { width: 17px; height: 17px; vertical-align: -3px; }
.cart-discount { display: flex; flex-direction: column; gap: 3px; margin-top: 12px; padding: 11px 14px; border-radius: var(--r-sm); color: #1a1205; background: linear-gradient(135deg, #e8c860, var(--accent)); box-shadow: 0 5px 16px rgba(201,162,39,.32); text-align: center; }
.cart-discount .cd-main { font-size: 13.5px; font-weight: 800; }
.cart-discount .cd-sub { font-size: 11.5px; font-weight: 700; opacity: .82; }
/* #2 KOLESO — „Použiť zľavu na nákup" = primárne, WhatsApp uplatnenie = sekundárne */
.wg-shop { width: 100%; margin: 6px 0 4px; padding: 14px 18px; border: none; border-radius: var(--r-sm); font-size: 15.5px; font-weight: 800; cursor: pointer; color: #1a1205; background: linear-gradient(135deg, #e8c860, var(--accent)); box-shadow: 0 7px 20px rgba(201,162,39,.42); transition: transform .12s, filter .15s; }
.wg-shop:hover { transform: translateY(-1px); filter: brightness(1.05); }
.wg-redeem.wg-redeem-2nd { background: transparent; border: 1.5px solid rgba(255,255,255,.22); color: var(--muted); box-shadow: none; font-size: 13.5px; font-weight: 600; }
.cartlist { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.cartrow { display: flex; align-items: center; gap: 12px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 10px; }
.cr-img { width: 58px; height: 74px; object-fit: contain; background: #0a0b0e; border-radius: var(--r-sm); cursor: pointer; flex: 0 0 auto; }
.cr-info { flex: 1 1 auto; min-width: 0; }
.cr-name { color: var(--accent-2); font-weight: 600; font-size: 14.5px; }
.cr-del { display: inline-flex; align-items: center; gap: 6px; background: rgba(224,69,95,.12); border: 1.5px solid rgba(224,69,95,.55); color: #ff8aa0; border-radius: var(--r-sm); padding: 10px 14px; font-size: 14px; font-weight: 800; cursor: pointer; flex: 0 0 auto; transition: all .12s; -webkit-tap-highlight-color: transparent; }
.cr-del .crd-ic { font-size: 16px; line-height: 1; }
.cr-del:hover { border-color: #e0455f; background: rgba(224,69,95,.2); color: #ffb3c2; }
.cr-del:active { transform: scale(.95); }
@media (max-width: 700px) { .cr-del { padding: 9px 12px; font-size: 12.5px; } .cr-del .crd-ic { font-size: 17px; } }
.co-payitems { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 12px; margin-bottom: 4px; -webkit-overflow-scrolling: touch; }
.co-payitems::-webkit-scrollbar { display: none; }
.co-payitem { flex: 0 0 auto; width: 66px; text-align: center; }
.co-payitem img { width: 66px; height: 82px; object-fit: contain; background: #0a0b0e; border-radius: var(--r-sm); border: 1px solid var(--line); display: block; }
.co-payitem span { display: block; font-size: 10px; color: var(--muted); margin-top: 3px; line-height: 1.15; max-height: 23px; overflow: hidden; }
.co-confirm { text-align: center; padding: 14px 4px 6px; }
.co-confirm-ic { font-size: 54px; line-height: 1; margin-bottom: 6px; }
.co-confirm-t { font-size: 21px; margin: 0 0 8px; }
.co-confirm-mail { font-size: 14.5px; color: var(--muted); margin: 0 0 16px; line-height: 1.45; }
.co-confirm-no { justify-content: center; margin: 0 auto 16px; display: inline-flex; }
@media (max-width: 700px) {
.cart-head h2 { font-size: 24px; }
.iconbtn.cart { font-size: 0; padding: 9px 12px; }
.iconbtn.cart::first-letter { font-size: 16px; }
}
/* ===== Inštalácia na plochu — modál/návod ===== */
.instmodal { position: fixed; inset: 0; z-index: 130; background: rgba(8,9,12,.8); backdrop-filter: blur(6px); display: none; align-items: flex-end; justify-content: center; }
.instmodal.open { display: flex; }
.im-panel {
position: relative; width: 100%; max-width: 480px; text-align: center;
background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--line-2);
border-radius: var(--r-lg) var(--r-lg) 0 0; padding: 30px 22px calc(26px + env(safe-area-inset-bottom, 0));
box-shadow: 0 -10px 44px rgba(0,0,0,.55); animation: imup .25s ease;
}
@keyframes imup { from { transform: translateY(34px); opacity: .5; } to { transform: none; opacity: 1; } }
.im-x { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line-2); background: var(--panel-2); color: #fff; font-size: 15px; cursor: pointer; }
.im-icon { font-size: 46px; line-height: 1; }
.im-panel h3 { font-family: var(--serif); font-size: 26px; margin: 8px 0 6px; }
.im-sub { color: var(--muted); font-size: 14px; margin: 0 auto 18px; line-height: 1.55; max-width: 360px; }
.im-steps { display: flex; flex-direction: column; gap: 11px; text-align: left; }
.im-step { display: flex; align-items: center; gap: 12px; background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--r); padding: 13px 14px; font-size: 14.5px; line-height: 1.4; }
.im-n { flex: 0 0 26px; height: 26px; border-radius: 50%; background: linear-gradient(180deg,var(--accent-2),var(--accent)); color: #1a1407; font-weight: 800; display: grid; place-items: center; font-size: 13px; }
.im-share { font-size: 17px; }
.im-go { width: 100%; background: linear-gradient(180deg,var(--accent-2),var(--accent)); color: #1a1407; border: none; border-radius: var(--r-sm); padding: 15px; font-size: 16px; font-weight: 800; cursor: pointer; margin-bottom: 4px; box-shadow: 0 6px 20px rgba(201,162,39,.35); }
.im-go:hover { filter: brightness(1.05); }
@media (min-width: 560px) { .instmodal { align-items: center; } .im-panel { border-radius: var(--r-lg); } }
/* install tlačidlo v hlavičke jemne pulzuje (aby ho videli) */
.instbtn { animation: instpulse 2.6s ease-in-out infinite; }
@keyframes instpulse { 0%,100% { box-shadow: 0 4px 14px rgba(201,162,39,.3); } 50% { box-shadow: 0 5px 24px rgba(201,162,39,.62); } }
/* ===== Hlavičkový košík (výrazný, vpravo hore) ===== */
.cartheadbtn {
position: relative; display: inline-flex; align-items: center; gap: 7px;
background: var(--panel-2); color: var(--text); border: 1.5px solid var(--line-2);
border-radius: var(--r-sm); padding: 9px 14px; font-size: 14px; font-weight: 700; cursor: pointer;
transition: border-color .15s, background .15s, transform .12s; white-space: nowrap;
}
/* košík v lište je vždy jemne zlatý, nech je hneď viditeľný */
.cartheadbtn { border-color: var(--accent); }
.cartheadbtn:hover { border-color: var(--accent-2); transform: translateY(-1px); background: rgba(201,162,39,.12); }
.cartheadbtn .ch-ico { font-size: 18px; line-height: 1; }
.cartheadbtn.has {
background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-color: var(--accent);
color: #1a1407; animation: cartpulse 2.4s ease-in-out infinite;
}
@keyframes cartpulse { 0%,100% { box-shadow: 0 4px 16px rgba(201,162,39,.35); } 50% { box-shadow: 0 6px 24px rgba(201,162,39,.66); } }
.ch-badge {
min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-pill);
background: var(--female); color: #fff; font-size: 12px; font-weight: 800;
display: inline-flex; align-items: center; justify-content: center; line-height: 1;
}
.cartheadbtn.has .ch-badge { background: #1a1407; color: var(--accent-2); }
/* Vysvetlenie ako funguje košík (3 kroky) */
.cart-how { display: flex; flex-direction: column; gap: 10px; margin: 16px 0 6px; background: rgba(201,162,39,.06); border: 1px solid rgba(201,162,39,.25); border-radius: var(--r); padding: 16px; }
.ch-step { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: #d7dbe6; line-height: 1.35; }
.ch-step b { color: var(--text); }
.ch-n { flex: 0 0 26px; height: 26px; border-radius: 50%; background: linear-gradient(180deg,var(--accent-2),var(--accent)); color: #1a1407; font-weight: 800; display: grid; place-items: center; font-size: 13px; }
@media (max-width: 700px) {
.cartheadbtn { padding: 9px 11px; gap: 5px; }
.cartheadbtn .ch-txt { display: none; } /* mobil: len 🛒 + počet */
}
/* Prepínač jazyka */
.langsel {
-webkit-appearance: none; appearance: none;
background-color: var(--panel-2); color: var(--text);
border: 1px solid var(--line-2); border-radius: var(--r-sm);
padding: 9px 30px 9px 12px; font-size: 14px; font-weight: 700; letter-spacing: .4px; cursor: pointer;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat; background-position: right 10px center; background-size: 11px;
transition: border-color .15s, box-shadow .15s;
}
.langsel:hover, .langsel:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(201,162,39,.14); }
@media (max-width: 700px) { .langsel { padding: 9px 28px 9px 11px; font-size: 13.5px; } }
/* ===== HLAVIČKA — súmerné, jednotné, luxusné ovládače ===== */
/* Triedenie (Predvolené) zladené do rovnakého zlatého pillu ako jazyk (predtým tmavé, vyčnievalo) */
.controls #sort {
-webkit-appearance: none; appearance: none;
background-color: var(--panel-2); color: var(--text);
border: 1px solid var(--line-2); border-radius: var(--r-sm); font-weight: 700; cursor: pointer;
padding: 9px 32px 9px 14px;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat; background-position: right 12px center; background-size: 11px;
}
.controls #sort:hover, .controls #sort:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(201,162,39,.14); }
/* „Zlom riadku" vo flexe — núti ikony na samostatný riadok pod dropdowny (len mobil) */
.ctl-break { display: none; }
/* Dropdowny na 1. riadku, LABELOVANÉ dlaždice (ikona + názov) na 2. — rovnomerne vyplnia šírku, žiadne hluché miesta */
@media (max-width: 700px) {
.controls { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; align-items: stretch; }
.controls .langsel, .controls #sort { order: 1; flex: 0 1 auto; height: 46px; box-sizing: border-box; margin: 0; align-self: center; }
.ctl-break { display: block; order: 2; flex: 0 0 100%; width: 100%; height: 0; margin: 0; padding: 0; }
.controls .cartheadbtn { order: 3; }
.controls #photoBtn { order: 4; }
.controls #shareAppBtn { order: 5; }
.controls .notifbtn { order: 6; }
.controls .instbtn { order: 7; }
.controls .editbtn { order: 8; }
.controls input#search { order: 9; flex: 0 0 100%; }
/* jednotné labelované dlaždice: ikona HORE + názov DOLE; flex:1 → vyplnia celú šírku rovnomerne */
.controls .cartheadbtn, .controls .photobtn, .controls .notifbtn, .controls .instbtn {
flex: 1 1 0; min-width: 0; height: auto; min-height: 60px; padding: 8px 4px 7px; gap: 4px;
flex-direction: column; align-items: center; justify-content: center; border-radius: var(--r);
background: linear-gradient(180deg, rgba(201,162,39,.15), rgba(201,162,39,.04)); border: 1px solid rgba(201,162,39,.5);
color: var(--accent-2); box-shadow: none; box-sizing: border-box; white-space: nowrap; position: relative; animation: none;
}
.controls .cartheadbtn:hover, .controls .photobtn:hover, .controls .notifbtn:hover, .controls .instbtn:hover { border-color: var(--accent-2); background: linear-gradient(180deg, rgba(201,162,39,.24), rgba(201,162,39,.08)); transform: none; }
.controls .cartheadbtn .e3d, .controls .photobtn .e3d, .controls .notifbtn .e3d, .controls .instbtn .e3d { width: 23px !important; height: 23px !important; opacity: 1 !important; filter: none !important; display: block; }
/* JEDNOTNÉ rozloženie cez CSS GRID — pevné riadky (ikona / label) → ikony AJ labely presne v jednej línii vo všetkých gombíkoch */
.controls .cartheadbtn, .controls .photobtn, .controls .notifbtn, .controls .instbtn {
display: grid !important; grid-template-rows: 26px 14px !important; row-gap: 3px !important;
align-content: center !important; justify-items: center !important; align-items: center !important; padding: 7px 4px !important; }
.controls .cartheadbtn > .ch-ico, .controls .photobtn > .pi, .controls .notifbtn > .nb-bell {
grid-row: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important;
height: 26px !important; width: auto !important; margin: 0 !important; padding: 0 !important; line-height: 0 !important; font-size: 0 !important; }
.controls .instbtn > .e3d { grid-row: 1 !important; align-self: center !important; }
.controls #shareAppBtn .pi svg.e3d { width: 25px !important; height: 25px !important; } /* share glyf je kompaktný → mierne zväčšiť, nech vizuálne ladí s ostatnými */
.controls .cartheadbtn > .ch-txt, .controls .photobtn > .pt, .controls .notifbtn > .pt, .controls .instbtn > .it {
grid-row: 2 !important; align-self: center !important; height: 14px !important; line-height: 14px !important; margin: 0 !important; }
.controls .cartheadbtn .ch-txt, .controls .photobtn .pt, .controls .notifbtn .pt, .controls .instbtn .it {
display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .2px; line-height: 1; color: var(--accent-2); margin: 0; }
.controls .cartheadbtn .ch-badge { position: absolute; top: 4px; right: 8px; }
.controls .notifbtn .nb-bell { line-height: 0; }
}
/* ===== HLAVIČKA v2: logo VYCENTROVANÉ (opticky vyvážené), jazyk v pravom rohu, tmavé ovládače ===== */
.top .bar { justify-content: center; position: relative; }
.top .brand { width: 100%; flex: 1 1 100%; min-width: 0; align-items: center; text-align: center; }
/* Jazyk v pravom hornom rohu (mimo toku) → logo zostáva v presnom strede; TMAVÝ ako Foto/Zdieľať */
.bar > .langsel {
position: absolute; top: calc(14px + env(safe-area-inset-top)); right: 14px; margin: 0; align-self: flex-start; height: 38px; padding: 0 28px 0 12px; font-size: 13px; box-sizing: border-box; order: 0; z-index: 3;
background-color: var(--panel-2) !important;
background-image: url('data:image/svg+xml;utf8,') !important;
background-repeat: no-repeat !important; background-position: right 11px center !important; background-size: 11px !important;
color: var(--text) !important; border: 1px solid rgba(201,162,39,.5) !important; box-shadow: none !important;
}
/* 🚚 PÁS DÔVERY v ľavom hornom rohu — rotuje 3 správy, vyvažuje logo, tlačí ku konverzii. Klik → WhatsApp. */
.bar > .trust-chip {
position: absolute; top: calc(14px + env(safe-area-inset-top)); left: 14px; z-index: 3; order: 0;
display: inline-flex; align-items: center; height: 38px; box-sizing: border-box; padding: 0 12px; margin: 0;
border-radius: var(--r-sm); cursor: pointer; overflow: hidden;
background: var(--panel-2); border: 1px solid rgba(201,162,39,.5); box-shadow: none;
color: var(--accent-2); font-size: 11px; font-weight: 800; letter-spacing: .2px; line-height: 1; white-space: nowrap;
-webkit-tap-highlight-color: transparent;
}
.bar > .trust-chip:hover { border-color: var(--accent-2); }
.bar > .trust-chip .tc-rot { display: inline-flex; align-items: center; gap: 5px; transition: opacity .3s ease; }
.bar > .trust-chip .e3d { width: 16px; height: 16px; vertical-align: middle; flex: 0 0 auto; }
.bar > .trust-chip.fade .tc-rot { opacity: 0; }
@media (max-width: 700px) {
.bar > .trust-chip { height: 34px; font-size: 9px; padding: 0 7px; left: 8px; gap: 3px; }
.bar > .trust-chip .tc-rot { gap: 3px; }
.top .brand-sub .bl { display: none; } /* skry ozdobné čiarky → uvoľni miesto, aby logo + chip + jazyk ladili */
}
.top .stats { width: 100%; order: 5; }
.top .controls { order: 4; }
#sort { display: none !important; } /* triedenie „Najviac fotiek" skryté — mätúce */
@media (max-width: 700px) {
.top .brand h1 { font-size: 14.5px; letter-spacing: 1.4px; } /* užšie → uvoľní miesto chipu vľavo a jazyku vpravo */
.top .brand-sub { font-size: 8px; letter-spacing: 2.4px; }
.bar > .langsel { height: 40px; font-size: 13px; }
/* košík (.has) a zvuk (.on/.off) = TMAVÉ ako ostatné dlaždice, nie zlaté */
.controls .cartheadbtn.has, .controls .notifbtn.on, .controls .notifbtn.off {
background: linear-gradient(180deg, rgba(201,162,39,.15), rgba(201,162,39,.04)) !important;
border-color: rgba(201,162,39,.5) !important; color: var(--accent-2) !important; animation: none !important;
}
}
/* ===== Discover (swipe) tlačidlo vo filtri ===== */
.discbtn {
display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; margin-top: 12px;
padding: 14px; border: none; border-radius: var(--r); cursor: pointer; color: #fff; font-size: 15.5px; font-weight: 800;
background: linear-gradient(110deg, var(--accent) 0%, var(--female) 55%, #7a5cff 100%); background-size: 220% 100%;
box-shadow: 0 6px 22px rgba(199,92,147,.32); animation: discshine 6s linear infinite;
}
.discbtn:hover { filter: brightness(1.05); }
.discbtn:active { transform: scale(.99); }
.disc-ic { font-size: 18px; }
@keyframes discshine { to { background-position: 220% 0; } }
/* ===== Swipe objavovanie ===== */
.swipe { position: fixed; inset: 0; z-index: 125; display: none; flex-direction: column;
background: radial-gradient(120% 70% at 50% 0%, #16181f, #0a0b0e 70%); }
.swipe.open { display: flex; }
.sw-top { display: flex; align-items: center; justify-content: space-between; padding: calc(12px + env(safe-area-inset-top,0)) 18px 6px; }
.sw-title { font-family: var(--serif); font-size: 21px; font-weight: 700; color: var(--accent-2); }
.sw-x { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line-2); background: var(--panel-2); color: #fff; font-size: 16px; cursor: pointer; }
.sw-stage { flex: 1; position: relative; display: flex; align-items: center; justify-content: center; padding: 8px 16px; overflow: hidden; }
.sw-card { position: absolute; inset: 0; margin: auto; width: min(86vw, 420px); height: min(62vh, 600px); border-radius: var(--r-lg); overflow: hidden;
background: #0a0b0e; border: 1px solid var(--line-2); box-shadow: 0 20px 50px rgba(0,0,0,.6); cursor: grab;
touch-action: none; will-change: transform; transition: transform .25s ease, opacity .25s ease; }
.sw-card.behind { transform: scale(.94) translateY(14px); filter: brightness(.7); pointer-events: none; }
.sw-img { width: 100%; height: 100%; object-fit: contain; background: #0a0b0e; display: block; pointer-events: none; }
.sw-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 34px 18px 18px; background: linear-gradient(to top, rgba(0,0,0,.88), transparent); pointer-events: none; }
.sw-brand { color: #fff; font-size: 18px; font-weight: 700; font-family: var(--serif); letter-spacing: .3px; }
.sw-stamp { position: absolute; top: 22px; font-size: 30px; padding: 6px 14px; border-radius: var(--r); font-weight: 900; opacity: 0; border: 3px solid; transition: opacity .12s; pointer-events: none; }
.sw-stamp.like { right: 18px; color: #37d67a; border-color: #37d67a; transform: rotate(-12deg); }
.sw-stamp.nope { left: 18px; color: #ff5b7a; border-color: #ff5b7a; transform: rotate(12deg); }
.sw-stamp.cartst { left: 50%; top: 16px; transform: translateX(-50%); color: var(--accent-2); border-color: var(--accent-2); }
.sw-card.show-like .sw-stamp.like, .sw-card.show-nope .sw-stamp.nope, .sw-card.show-cart .sw-stamp.cartst { opacity: 1; }
.sw-card.gone-like { transform: translate(140%, -40px) rotate(22deg) !important; opacity: 0; }
.sw-card.gone-skip { transform: translate(-140%, -40px) rotate(-22deg) !important; opacity: 0; }
.sw-card.gone-cart { transform: translateY(-130%) rotate(-4deg) !important; opacity: 0; }
.sw-done { color: var(--muted); text-align: center; font-size: 16px; max-width: 300px; padding: 24px; line-height: 1.5; }
.sw-hint { text-align: center; color: var(--muted); font-size: 13px; padding: 6px 16px; }
.sw-actions { display: flex; align-items: center; justify-content: center; gap: 24px; padding: 10px 16px calc(22px + env(safe-area-inset-bottom,0)); }
.sw-act { border: none; border-radius: 50%; cursor: pointer; display: grid; place-items: center; box-shadow: 0 6px 18px rgba(0,0,0,.4); transition: transform .12s; }
.sw-act:active { transform: scale(.88); }
.sw-act.skip { width: 62px; height: 62px; font-size: 24px; background: #20232c; color: #ff5b7a; border: 1px solid #3a2a32; }
.sw-act.cart { width: 54px; height: 54px; font-size: 21px; background: var(--panel-2); color: var(--accent-2); border: 1px solid var(--line-2); }
.sw-act.like { width: 62px; height: 62px; font-size: 26px; background: linear-gradient(180deg,#ff6e92,#e0455f); color: #fff; }
/* ===== Foto-concierge (rozšírenie foto-hľadania) ===== */
.is-tag { color: var(--accent-2); font-size: 14px; margin: 0 0 6px; line-height: 1.5; }
.is-concierge { width: 100%; margin-top: 6px; background: #25a956; color: #fff; border: none; border-radius: var(--r-sm); padding: 13px 16px; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: 0 4px 14px rgba(37,169,86,.35); text-align: center; }
.is-concierge:hover { filter: brightness(1.05); }
/* ===== Stories lišta ===== */
.stories { display: flex; gap: 14px; overflow-x: auto; padding: 14px 18px 8px; max-width: 1500px; margin: 0 auto; scrollbar-width: none; }
.stories::-webkit-scrollbar { display: none; }
body:not(.athome) .stories { display: none; }
.story { flex: 0 0 auto; background: none; border: none; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 5px; width: 72px; padding: 0; }
.st-ring { width: 64px; height: 64px; border-radius: 50%; padding: 2.5px; background: conic-gradient(from 210deg, var(--accent), var(--female), #7a5cff, var(--accent)); display: grid; place-items: center; }
.st-ring img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--bg); background: var(--panel-2); }
.story:active .st-ring { transform: scale(.94); }
.st-label { font-size: 11px; color: var(--muted); max-width: 72px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ===== Stories prehliadač (full-screen) ===== */
.storyview { position: fixed; inset: 0; z-index: 140; background: #000; display: none; }
.storyview.open { display: block; }
.st-bars { position: absolute; top: calc(8px + env(safe-area-inset-top,0)); left: 10px; right: 10px; display: flex; gap: 4px; z-index: 3; }
.st-bar { flex: 1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.3); }
.st-bar.done { background: #fff; }
.st-bar.active { background: linear-gradient(90deg,#fff 55%, rgba(255,255,255,.3) 55%); }
.st-x { position: absolute; top: calc(18px + env(safe-area-inset-top,0)); right: 14px; z-index: 4; width: 40px; height: 40px; border-radius: 50%; border: none; background: rgba(0,0,0,.45); color: #fff; font-size: 17px; cursor: pointer; }
.st-nav { position: absolute; top: 0; bottom: 0; z-index: 2; cursor: pointer; }
.st-nav.prev { left: 0; width: 32%; }
.st-nav.next { right: 0; width: 68%; }
.st-stage { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; background: #0a0b0e; }
.st-img { max-width: 100%; max-height: 100%; object-fit: contain; }
.st-info { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; padding: 44px 22px calc(28px + env(safe-area-inset-bottom,0)); background: linear-gradient(to top, rgba(0,0,0,.92), transparent); pointer-events: none; }
.st-info h3 { font-family: var(--serif); font-size: 26px; margin: 0 0 6px; color: #fff; }
.st-info p { font-size: 15px; color: #e6e8ef; margin: 0 0 14px; line-height: 1.5; }
.st-cta { pointer-events: auto; background: linear-gradient(180deg,var(--accent-2),var(--accent)); color: #1a1407; border: none; border-radius: var(--r-sm); padding: 12px 20px; font-size: 14.5px; font-weight: 800; cursor: pointer; }
/* ===== Drop s odpočtom ===== */
.dropbanner {
display: flex; align-items: center; gap: 12px; width: calc(100% - 36px); max-width: 1440px; margin: 8px auto 0;
padding: 13px 16px; border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(110deg, #281a3e, #3a2150 55%, #1b1430); border: 1px solid rgba(201,162,39,.4);
box-shadow: 0 6px 22px rgba(122,92,255,.22);
}
body:not(.athome) .dropbanner { display: none !important; }
.dropbanner:hover { filter: brightness(1.08); }
.db-spark { font-size: 24px; line-height: 1; }
.db-mid { flex: 1; display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.db-title { font-weight: 800; font-size: 15px; color: var(--accent-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-sub { font-size: 11.5px; color: var(--muted); }
.db-count { font-variant-numeric: tabular-nums; font-weight: 800; font-size: 18px; color: #fff; background: rgba(0,0,0,.3); padding: 7px 12px; border-radius: var(--r-sm); white-space: nowrap; }
.dropbanner.live .db-count { background: rgba(224,69,95,.28); color: #ff9aac; font-size: 14px; animation: dblive 1.4s ease-in-out infinite; }
@keyframes dblive { 50% { opacity: .6; } }
/* ===== Veľké dlaždice úvodu (menu) ===== */
.hometiles { max-width: 1500px; margin: 0 auto; padding: 6px 0 2px; }
body:not(.athome) .hometiles { display: none; }
/* rovnaká výška, padding aj medzery pre VŠETKY dlaždice */
.hometiles > button { min-height: 74px; margin: 10px auto 0; padding: 15px 16px; box-sizing: border-box; }
.hometiles > button:first-child { margin-top: 0; }
/* 🛍️ nákupné kolonky (TOP originál → Luxury Home → ostatné sekcie) — vstup do nákupu, výraznejšie než servisné bannery */
.hometiles .sectile { border-color: rgba(201,162,39,.55); }
.hometiles .sectile .alb-title { font-size: 16.5px; letter-spacing: .2px; }
.hometiles .sectile-top { border-color: rgba(246,221,138,.9); box-shadow: 0 0 24px rgba(201,162,39,.30), inset 0 1px 0 rgba(255,255,255,.08); }
.hometiles .sectile-home { border-color: rgba(246,221,138,.65); box-shadow: 0 0 16px rgba(201,162,39,.18); }
.sec-count { display: inline-block; font-size: 11.5px; font-weight: 800; line-height: 1.4; color: #2a1d02; background: linear-gradient(180deg,#f6dd8a,#cda233); border-radius: var(--r-pill); padding: 1px 9px; margin-left: 8px; vertical-align: 2px; }
/* servisné bannery začínajú väčšou medzerou = optické oddelenie od nákupných kolónk */
.hometiles #trackTile { margin-top: 26px; }
/* zoskupenie pod Album: Kúsok dňa + Naposledy tesnejšie k Albumu, väčšia medzera pred VIP */
/* Pre teba — Kúsok dňa + Naposledy vnútri sekcie Album (len úroveň značiek) */
.albumextra { display: none; max-width: 1500px; margin: 2px auto 4px; }
body.albumroot .albumextra { display: block; }
/* Nadpis Značky (v Albume, úroveň značiek) — zlatý akcent namiesto emoji */
.brandshead { display: none; align-items: center; gap: 10px; max-width: 1500px; margin: 10px auto 2px; padding: 0 22px; font: 800 16px var(--sans); color: var(--text); letter-spacing: .2px; }
.brandshead::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: linear-gradient(180deg, var(--accent-2), var(--accent)); flex: 0 0 auto; }
body.albumroot .brandshead { display: flex; }
/* ══ VYSVETLIVKA ÚROVNE (TOP Premium / Premium) — banner v sekcii + tlačidlo do modálu ══ */
.tier-intro { display: none; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
max-width: 1500px; margin: 12px auto 4px; padding: 13px 16px;
border-radius: var(--r); border: 1px solid rgba(201,162,39,.34);
background: linear-gradient(135deg, rgba(201,162,39,.10), rgba(201,162,39,.03)); }
body.albumroot .tier-intro-top { display: flex; } /* Album: len na úvode (úroveň značiek) */
#premiumView .tier-intro { display: flex; } /* Premium: vždy v hlavičke sekcie */
.tier-intro-prem { border-color: rgba(96,165,250,.34); background: linear-gradient(135deg, rgba(96,165,250,.10), rgba(96,165,250,.03)); }
.tier-intro-main { flex: 1 1 220px; min-width: 0; }
.tier-intro-badge { display: inline-block; font: 800 12px var(--sans); letter-spacing: .6px;
color: #f0e6c8; background: rgba(201,162,39,.16); border: 1px solid rgba(201,162,39,.45);
padding: 4px 11px; border-radius: var(--r-pill); margin-bottom: 6px; }
.tier-intro-prem .tier-intro-badge { color: #cfe0ff; background: rgba(96,165,250,.16); border-color: rgba(96,165,250,.5); }
.tier-intro-sub { margin: 0; font: 500 13.5px/1.5 var(--sans); color: var(--muted); }
.tier-info-btn { flex: 0 0 auto; background: rgba(201,162,39,.14); border: 1px solid rgba(201,162,39,.45);
color: #f0e6c8; border-radius: var(--r-sm); padding: 9px 14px; font: 700 13px var(--sans); cursor: pointer; white-space: nowrap;
transition: background .15s, transform .1s; }
.tier-info-btn:hover { background: rgba(201,162,39,.24); }
.tier-info-btn:active { transform: scale(.97); }
.tier-intro-prem .tier-info-btn { background: rgba(96,165,250,.14); border-color: rgba(96,165,250,.5); color: #cfe0ff; }
/* ── modál „Úrovne kvality" — dve prehľadné karty ── */
.qual-card { max-width: 440px; width: 100%; max-height: 90vh; overflow: auto;
background: linear-gradient(135deg, #1b1822, #131119); border: 1px solid rgba(201,162,39,.42);
border-radius: var(--r-lg); padding: 24px 22px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.qual-card h3 { color: #f0e6c8; font-size: 22px; margin: 0 0 6px; font-weight: 800; letter-spacing: .2px; }
.qual-intro { color: var(--muted); font-size: 13.5px; line-height: 1.55; margin: 0 0 16px; }
.qual-tier { border-radius: var(--r); padding: 14px 15px; margin-bottom: 12px; border: 1px solid; }
.qual-tier-top { background: rgba(201,162,39,.08); border-color: rgba(201,162,39,.35); }
.qual-tier-prem { background: rgba(96,165,250,.08); border-color: rgba(96,165,250,.38); }
.qual-tier-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 7px; }
.qual-tier-name { font: 800 15.5px var(--sans); color: #f4ecd4; }
.qual-tier-prem .qual-tier-name { color: #dbe7ff; }
.qual-tier-for { font: 700 10.5px var(--sans); letter-spacing: .5px; text-transform: uppercase; padding: 3px 9px; border-radius: var(--r-pill); }
.qual-tier-top .qual-tier-for { color: #e8c860; background: rgba(201,162,39,.16); }
.qual-tier-prem .qual-tier-for { color: #8fbaff; background: rgba(96,165,250,.16); }
.qual-tier p { color: #e8e2d0; font-size: 13.5px; line-height: 1.55; margin: 0; }
.qual-foot { color: var(--muted); font-size: 12.5px; line-height: 1.5; margin: 4px 0 18px; text-align: center; }
.qual-card #qualClose { width: 100%; background: linear-gradient(135deg, #e8c860, var(--accent)); color: #1a1205; border: none; border-radius: var(--r-sm); padding: 12px; font-weight: 800; font-size: 15px; cursor: pointer; }
/* Plávajúce „Značky 👇" — pozýva scrollovať dole k značkám */
.brandscue { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 40; transform: translateX(-50%);
background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1203; border: none; border-radius: var(--r-pill);
padding: 11px 20px; font: 800 14px var(--sans); cursor: pointer; box-shadow: 0 8px 24px rgba(201,162,39,.45);
display: inline-flex; align-items: center; gap: 7px; animation: cueBounce 1.3s ease-in-out infinite; }
.brandscue[hidden] { display: none; }
/* čistá CSS šípka dole (chevron) namiesto emoji */
.bc-chev { display: inline-block; width: 8px; height: 8px; border-right: 2.5px solid currentColor; border-bottom: 2.5px solid currentColor; transform: rotate(45deg); margin: -2px 0 1px 3px; }
@keyframes cueBounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(-7px); } }
@media (prefers-reduced-motion: reduce) { .brandscue { animation: none; } }
/* jednotné ikony */
.hometiles .vb-ic, .hometiles .wb-ic, .hometiles .rb-ic, .hometiles .ab-ic, .hometiles .alb-ic, .hometiles .swb-ic { font-size: 27px; line-height: 1; flex: 0 0 42px; width: 42px; text-align: center; filter: drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
/* jednotná typografia titulov + podtitulov — jeden moderný font, výrazné, zarovnané */
.hometiles .alb-title, .hometiles .vb-title, .hometiles .wb-title, .hometiles .rb-title, .hometiles .ab-title, .hometiles .swb-title { font-family: var(--sans); font-size: 16px; font-weight: 700; letter-spacing: .1px; line-height: 1.25; text-shadow: 0 1px 2px rgba(0,0,0,.3); }
.hometiles .alb-sub, .hometiles .vb-sub, .hometiles .wb-sub, .hometiles .rb-sub, .hometiles .ab-sub, .hometiles .swb-sub { font-family: var(--sans); font-size: 12px; font-weight: 500; opacity: .95; line-height: 1.3; text-shadow: 0 1px 1px rgba(0,0,0,.22); }
/* jednotné stredné stĺpce (ikona | text | šípka) */
.hometiles .rb-mid, .hometiles .ab-mid, .hometiles .swb-mid { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
/* jednotné CTA šípky — 3 menšie chevrony „klikni" (pulzujú doprava). Atribútový selektor = platí všade vrátane .pd-go */
.hometiles [class$="-go"] { font-size: 0 !important; flex: 0 0 auto; display: inline-flex; align-items: center; }
.hometiles [class$="-go"]::after {
content: "›››"; font-size: 19px; font-weight: 900; letter-spacing: -3px; padding-right: 3px;
animation: ctaSlide 1.5s ease-in-out infinite;
}
@keyframes ctaSlide { 0%, 100% { opacity: .5; transform: translateX(0); } 50% { opacity: 1; transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) { .hometiles [class$="-go"]::after { animation: none !important; opacity: .85; } }
/* Objavuj swajpom — dlaždica (indigo) */
.swipebanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 0 auto; padding: 16px;
border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(110deg, #312e81, #4f46e5 55%, #6366f1); border: 1px solid rgba(180,180,255,.4);
box-shadow: 0 8px 26px rgba(79,70,229,.28); position: relative; overflow: hidden; }
.swipebanner::after { content: ""; position: absolute; top: 0; left: -60%; width: 38%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,255,255,.2), transparent); transform: skewX(-18deg); animation: vipshine 5.4s ease-in-out infinite; }
.swipebanner:hover { filter: brightness(1.08); }
.swb-mid { flex: 1; }
.swb-sub, .swb-go { color: #c7d2fe; }
/* ===== Interaktívne mini-ikony dlaždíc ===== */
.hometiles .alb-ic, .hometiles .vb-ic, .hometiles .wb-ic, .hometiles .rb-ic, .hometiles .ab-ic, .hometiles .swb-ic, .pd-ic, .rh-ic { display: inline-block; transform-origin: center; }
.hometiles .wb-ic { animation: icoSpin 4.5s linear infinite; } /* koleso sa točí */
.hometiles .vb-ic { animation: icoPulse 2.4s ease-in-out infinite; } /* diamant pulzuje */
.hometiles .alb-ic { animation: icoSway 3.2s ease-in-out infinite; } /* taška sa kýve */
.hometiles .rb-ic { animation: icoPulse 1.8s ease-in-out infinite; } /* srdcia tlčú */
.hometiles .ab-ic { animation: icoSway 3.4s ease-in-out infinite; } /* visačka sa nakláňa */
.hometiles .swb-ic { animation: icoFlip 4s ease-in-out infinite; } /* karta sa otáča */
.pd-ic { animation: icoPulse 2s ease-in-out infinite; } /* hviezda žiari */
.rh-ic { animation: icoSpin 9s linear infinite; } /* hodiny tikajú */
@keyframes icoSpin { to { transform: rotate(360deg); } }
@keyframes icoPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2); } }
@keyframes icoSway { 0%, 100% { transform: rotate(-10deg); } 50% { transform: rotate(10deg); } }
@keyframes icoBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes icoShake { 0%, 84%, 100% { transform: rotate(0); } 88% { transform: rotate(-14deg); } 92% { transform: rotate(14deg); } 96% { transform: rotate(-8deg); } }
@keyframes icoFlip { 0%, 55%, 100% { transform: rotateY(0); } 78% { transform: rotateY(180deg); } }
/* ťuk = poskočí */
.hometiles > button:active .alb-ic, .hometiles > button:active .vb-ic, .hometiles > button:active .wb-ic, .hometiles > button:active .rb-ic, .hometiles > button:active .ab-ic, .hometiles > button:active .swb-ic { animation: none; transform: scale(1.35); transition: transform .1s; }
@media (prefers-reduced-motion: reduce) { .hometiles .alb-ic, .hometiles .vb-ic, .hometiles .wb-ic, .hometiles .rb-ic, .hometiles .ab-ic, .hometiles .swb-ic, .pd-ic, .rh-ic { animation: none !important; } }
/* Album dlaždica (hero — zlatý nádych) */
.albumbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 0 auto; padding: 16px;
border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(110deg, #1d1a10, #2a2516 55%, #16140c); border: 1px solid rgba(201,162,39,.45);
box-shadow: 0 8px 26px rgba(0,0,0,.4); position: relative; overflow: hidden; }
.albumbanner::after { content: ""; position: absolute; top: 0; left: -60%; width: 38%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,225,150,.16), transparent); transform: skewX(-18deg); animation: vipshine 5s ease-in-out infinite; }
.albumbanner:hover { filter: brightness(1.1); }
.alb-ic { font-size: 28px; line-height: 1; }
.alb-mid { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.alb-title { font-weight: 900; font-size: 16.5px; color: #f0e6c8; letter-spacing: .3px; }
.alb-sub { font-size: 11.5px; color: var(--muted); }
.alb-go { font-size: 26px; color: var(--accent-2); font-weight: 700; }
/* Showroom dlaždica na úvode — vyniká (prémiová tmavá + zelený „predané" náznak) */
.showroombanner { background: linear-gradient(110deg, #14130d, #241f12 50%, #112018); border-color: rgba(201,162,39,.5); }
.showroombanner .alb-ic { filter: drop-shadow(0 0 6px rgba(201,162,39,.5)); }
.showroombanner .alb-title::after { content: " ✓"; color: #6ee29a; font-weight: 900; }
/* nadpis sekcie Nakupuj (v katalógu) */
.feedhead { width: 100%; font-size: 16px; font-weight: 900; color: var(--text); letter-spacing: .3px; margin: 4px 2px 11px; display: flex; align-items: center; gap: 7px; }
/* na úvode (menu) skry katalóg; mimo úvodu skry obsahový feed */
body.athome #filters, body.athome #tilesView { display: none !important; }
body:not(.athome) .feedmore { display: none; }
.feedmore { max-width: 1500px; margin: 4px auto 0; }
/* ===== VIP Room — vstupný banner (úvod) ===== */
.vipbanner {
display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0;
padding: 14px 16px; border-radius: var(--r); cursor: pointer; text-align: left; color: #f4e7c4;
background: linear-gradient(110deg, #1a1206, #2a1d08 45%, #120c03);
border: 1px solid rgba(201,162,39,.55);
box-shadow: 0 8px 26px rgba(201,162,39,.16), inset 0 0 0 1px rgba(255,215,130,.06);
position: relative; overflow: hidden;
}
body:not(.athome) .vipbanner { display: none !important; }
.vipbanner::after { /* jemný zlatý lesk */
content: ""; position: absolute; top: 0; left: -60%; width: 38%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,225,150,.20), transparent);
transform: skewX(-18deg); animation: vipshine 4.8s ease-in-out infinite;
}
@keyframes vipshine { 0%, 58% { left: -60%; } 100% { left: 135%; } }
.vipbanner:hover { filter: brightness(1.08); }
.vb-ic { font-size: 26px; line-height: 1; filter: drop-shadow(0 0 6px rgba(255,210,120,.45)); }
.vb-mid { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vb-title { font-weight: 900; font-size: 16px; letter-spacing: .8px; color: #f0d585; text-transform: uppercase; }
.vb-lock { font-size: 12px; }
.vb-sub { font-size: 11.5px; color: #cbb586; }
.vb-go { font-size: 24px; color: #e9cd7e; font-weight: 700; }
/* ===== VIP Room — vstupný modál na heslo ===== */
.vipgate { position: fixed; inset: 0; z-index: 1400; display: none; align-items: center; justify-content: center; padding: 22px;
background: rgba(8,6,2,.82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vipgate.open { display: flex; }
.vg-panel { position: relative; width: 100%; max-width: 380px; box-sizing: border-box; text-align: center;
background: linear-gradient(160deg, #181103, #0f0a02); border: 1px solid rgba(201,162,39,.5); border-radius: var(--r-lg);
padding: 32px 24px 26px; box-shadow: 0 24px 70px rgba(0,0,0,.6); }
.vg-x { position: absolute; top: 12px; right: 12px; background: rgba(255,255,255,.06); border: none; color: #d8c690;
width: 34px; height: 34px; border-radius: 50%; font-size: 15px; cursor: pointer; }
.vg-ic { font-size: 46px; line-height: 1; margin-bottom: 4px; filter: drop-shadow(0 0 10px rgba(255,210,120,.5)); }
.vg-title { font-size: 21px; font-weight: 900; letter-spacing: 1px; color: #f0d585; text-transform: uppercase; margin: 0 0 10px; }
.vg-explain { font-size: 13.5px; line-height: 1.5; color: #cbb98c; margin: 0 0 18px; }
.vg-input { width: 100%; box-sizing: border-box; padding: 14px 16px; border-radius: var(--r-sm); border: 1px solid rgba(201,162,39,.4);
background: rgba(0,0,0,.4); color: #fff; font-size: 16px; text-align: center; letter-spacing: 1px; outline: none; }
.vg-input:focus { border-color: #e9cd7e; }
.vg-go { width: 100%; margin-top: 12px; padding: 14px; border-radius: var(--r-sm); border: none; cursor: pointer;
background: linear-gradient(110deg, #d8b441, #f0d27a); color: #1a1203; font-weight: 800; font-size: 15.5px; letter-spacing: .5px; }
.vg-go:disabled { opacity: .6; cursor: default; }
.vg-err { margin-top: 12px; font-size: 13px; color: #ff9aac; }
/* ===== Personalizované kabelky (VIP služba navyše) ===== */
.persobanner { background: linear-gradient(120deg, rgba(201,162,39,.16), rgba(122,92,255,.10)); border-color: rgba(201,162,39,.45); }
/* „VIP SLUŽBA" odznak — odstránený (nepôsobí čistejšie) */
.perso-vip { display: none !important; }
/* dlaždicové ikony → šampanská zlatá (súdržné s brandom, nie biele) */
.alb-ic svg.e3d, .vb-ic svg.e3d, .ab-ic svg.e3d, .swb-ic svg.e3d, .rvb-ic svg.e3d, .wb-ic svg.e3d, .rb-ic svg.e3d { color:#e8d6a2; }
/* Showroom „overené" → jemná zlatá namiesto krikľavej zelenej */
.showroombanner .alb-title::after { color:#e8d6a2 !important; }
.persobtn { background: linear-gradient(110deg, var(--accent) 0%, #7a5cff 100%) !important; box-shadow: 0 6px 22px rgba(122,92,255,.30) !important; animation: none !important; }
.persogate { position: fixed; inset: 0; z-index: 1400; display: none; align-items: center; justify-content: center; padding: 22px; background: rgba(8,7,12,.78); backdrop-filter: blur(5px); }
.persogate.open { display: flex; }
.pg-panel { position: relative; width: 100%; max-width: 400px; box-sizing: border-box; text-align: center; background: linear-gradient(180deg,#1a1822,#14121a); border:1px solid rgba(201,162,39,.4); border-radius: var(--r-lg); padding: 26px 22px; box-shadow: 0 20px 60px rgba(0,0,0,.55); max-height: 92vh; overflow: auto; }
.pg-x { position:absolute; top:12px; right:12px; background:rgba(255,255,255,.06); border:none; color:#d8c690; width:34px; height:34px; border-radius:50%; font-size:16px; cursor:pointer; }
.pg-x:hover { background:rgba(255,255,255,.14); }
.pg-ic { font-size: 46px; line-height: 1; margin-bottom: 4px; filter: drop-shadow(0 0 10px rgba(255,210,120,.5)); }
.pg-title { font-size: 20px; font-weight: 900; letter-spacing: .5px; color: #f0d585; margin: 0 0 8px; }
.pg-explain { font-size: 13.5px; line-height: 1.55; color: #cbb98c; margin: 0 0 16px; }
.pg-input { width: 100%; box-sizing: border-box; padding: 13px 15px; margin-top: 9px; border-radius: var(--r-sm); border: 1px solid rgba(201,162,39,.35); background: rgba(255,255,255,.05); color:#fff; font-size: 15px; font-family: inherit; }
.pg-input:focus { border-color: #e9cd7e; outline: none; }
.pg-area { resize: vertical; min-height: 70px; }
.pg-go { width: 100%; margin-top: 13px; padding: 14px; border-radius: var(--r-sm); border: none; cursor: pointer; font-size: 15.5px; font-weight: 800; color:#1a1407; background: linear-gradient(180deg,#ecd98a,var(--accent)); }
.pg-go:disabled { opacity:.6; cursor: default; }
.pg-wa { width: 100%; margin-top: 9px; padding: 12px; border-radius: var(--r-sm); border: 1px solid rgba(37,211,102,.5); background: rgba(37,211,102,.12); color:#7ff0a8; font-size: 14px; font-weight: 700; cursor: pointer; }
.pg-err { margin-top: 11px; font-size: 13px; color: #ff9aac; }
.pg-done { text-align: center; padding: 10px 0; }
.pg-done-ic { font-size: 46px; }
.pg-done p { font-size: 15px; color: #cbb98c; line-height: 1.5; margin: 8px 0 16px; }
/* ===== Koleso šťastia — banner (úvod) ===== */
.wheelbanner {
display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0;
padding: 13px 16px; border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(110deg, #3a1150, #6a1e6e 50%, #b0245a);
border: 1px solid rgba(255,180,220,.45); box-shadow: 0 8px 26px rgba(176,36,90,.28); position: relative; overflow: hidden;
}
body:not(.athome) .wheelbanner { display: none !important; }
.wheelbanner::after {
content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,255,255,.22), transparent);
transform: skewX(-18deg); animation: vipshine 5.2s ease-in-out infinite;
}
.wheelbanner:hover { filter: brightness(1.08); }
.wb-ic { font-size: 27px; line-height: 1; animation: wbspin 6s linear infinite; }
@keyframes wbspin { to { transform: rotate(360deg); } }
.wb-mid { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.wb-title { font-weight: 900; font-size: 15.5px; color: #fff; letter-spacing: .3px; }
.wb-sub { font-size: 11.5px; color: #ffd9ec; }
.wb-go { font-size: 24px; color: #ffd9ec; font-weight: 700; }
/* ===== Koleso šťastia — modál ===== */
.wheelgate { position: fixed; inset: 0; z-index: 1500; display: none; align-items: center; justify-content: center; padding: 20px;
background: rgba(10,4,18,.85); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.wheelgate.open { display: flex; }
.wg-panel { position: relative; width: 100%; max-width: 380px; box-sizing: border-box; text-align: center;
background: linear-gradient(165deg, #2a0f3e, #14071f); border: 1px solid rgba(255,180,220,.35); border-radius: var(--r-lg);
padding: 26px 22px 24px; box-shadow: 0 24px 80px rgba(0,0,0,.65); }
.wg-x { position: absolute; top: 12px; right: 12px; background: rgba(255,255,255,.08); border: none; color: #ffd9ec;
width: 34px; height: 34px; border-radius: 50%; font-size: 15px; cursor: pointer; z-index: 2; }
.wg-title { font-size: 21px; font-weight: 900; color: #fff; margin: 0 0 4px; }
.wg-sub { font-size: 13px; color: #e6b8d8; margin: 0 0 16px; }
.wg-wheelwrap { position: relative; width: 300px; height: 300px; margin: 0 auto 18px; }
#wheelCanvas { width: 300px; height: 300px; border-radius: 50%; transform: rotate(0deg);
box-shadow: 0 0 0 6px rgba(255,255,255,.08), 0 0 0 10px rgba(255,180,220,.25), 0 12px 30px rgba(0,0,0,.5); }
.wg-pointer { position: absolute; top: -6px; left: 50%; transform: translateX(-50%); z-index: 3;
width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-top: 26px solid #ffd84d;
filter: drop-shadow(0 3px 3px rgba(0,0,0,.5)); }
.wg-hub { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;
width: 50px; height: 50px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #e9cd7e);
display: flex; align-items: center; justify-content: center; font-size: 22px; box-shadow: 0 2px 10px rgba(0,0,0,.5); }
.wg-spin { width: 100%; padding: 15px; border-radius: var(--r); border: none; cursor: pointer; letter-spacing: 1px;
background: linear-gradient(110deg, #ffcf3f, #ff7ab0); color: #2a0f3e; font-weight: 900; font-size: 16.5px;
box-shadow: 0 6px 18px rgba(255,122,176,.35); }
.wg-spin:disabled { opacity: .65; cursor: default; }
.wg-result { margin-top: 16px; }
.wg-rwin { font-size: 17px; color: #fff; font-weight: 700; }
.wg-rwin b { color: #ffd84d; }
.wg-code { margin-top: 8px; font-size: 14px; color: #e6b8d8; }
.wg-code b { color: #fff; letter-spacing: 1.5px; font-size: 17px; background: rgba(255,255,255,.08); padding: 3px 10px; border-radius: var(--r-xs); display: inline-block; margin-top: 4px; }
.wg-redeem { width: 100%; margin-top: 14px; padding: 14px; border-radius: var(--r-sm); border: none; cursor: pointer;
background: linear-gradient(110deg, #25d366, #16a34a); color: #fff; font-weight: 800; font-size: 15px; }
.wg-note { font-size: 11.5px; color: #b89cc8; margin: 10px 0 0; }
/* WOW efekty */
.wg-result.pop { animation: wgpop .55s cubic-bezier(.2,1.4,.3,1); }
@keyframes wgpop { 0% { transform: scale(.6); opacity: 0; } 60% { transform: scale(1.08); } 100% { transform: scale(1); opacity: 1; } }
.wg-panel.shake { animation: wgshake .5s ease; }
@keyframes wgshake { 10%,90% { transform: translateX(-2px); } 20%,80% { transform: translateX(4px); } 30%,50%,70% { transform: translateX(-8px); } 40%,60% { transform: translateX(8px); } }
.wg-panel.jackpot { border-color: #ffd84d; box-shadow: 0 0 0 2px rgba(255,216,77,.5), 0 0 40px rgba(255,216,77,.55), 0 24px 80px rgba(0,0,0,.65); animation: wgglow 1.2s ease-in-out infinite alternate; }
@keyframes wgglow { to { box-shadow: 0 0 0 3px rgba(255,216,77,.7), 0 0 60px rgba(255,170,60,.8), 0 24px 80px rgba(0,0,0,.65); } }
/* ===== Pozvi kamarátku (referral) ===== */
.refbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0;
padding: 13px 16px; border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(125deg, #064e3b, #059669 50%, #34d399); border: 1px solid rgba(110,231,183,.5);
box-shadow: 0 10px 30px rgba(5,150,105,.34); position: relative; overflow: hidden; }
body:not(.athome) .refbanner { display: none !important; }
.refbanner::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,255,255,.22), transparent); transform: skewX(-18deg); animation: vipshine 5.6s ease-in-out infinite; }
.refbanner:hover { filter: brightness(1.08); }
.rb-ic { font-size: 25px; line-height: 1; }
.rb-mid { flex: 1; min-width: 0; }
.rb-title { font-weight: 800; font-size: 14.5px; color: #fff; }
.rb-sub { color: #d1fae5; }
.rb-go { font-size: 24px; color: #bbf7d0; font-weight: 700; }
.refgate, .refwelcome { position: fixed; inset: 0; z-index: 1460; display: none; align-items: center; justify-content: center; padding: 20px;
background: rgba(4,14,16,.82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.refgate.open, .refwelcome.open { display: flex; }
.rf-panel, .rw-panel { position: relative; width: 100%; max-width: 380px; box-sizing: border-box; text-align: center;
background: linear-gradient(165deg, #0b3b44, #06222a); border: 1px solid rgba(150,230,230,.35); border-radius: var(--r-lg);
padding: 28px 22px 22px; box-shadow: 0 24px 80px rgba(0,0,0,.6); }
.rf-x { position: absolute; top: 12px; right: 12px; background: rgba(255,255,255,.08); border: none; color: #c8f5f5; width: 34px; height: 34px; border-radius: 50%; font-size: 15px; cursor: pointer; }
.rf-ic, .rw-ic { font-size: 44px; line-height: 1; margin-bottom: 4px; }
.rf-title, .rw-title { font-size: 21px; font-weight: 900; color: #fff; margin: 0 0 8px; }
.rf-explain { font-size: 13.5px; line-height: 1.5; color: #a9d8de; margin: 0 0 14px; }
.rf-prog { font-size: 15px; color: #fff; margin-bottom: 14px; }
.rf-prog b { color: #5eead4; font-size: 20px; }
.rf-share { width: 100%; padding: 14px; border-radius: var(--r-sm); border: none; cursor: pointer; background: linear-gradient(110deg, #06b6d4, #22d3ee); color: #06222a; font-weight: 800; font-size: 15.5px; }
.rf-copy { width: 100%; margin-top: 10px; padding: 12px; border-radius: var(--r-sm); border: 1px solid rgba(150,230,230,.4); cursor: pointer; background: rgba(255,255,255,.06); color: #c8f5f5; font-weight: 700; font-size: 14px; }
.rf-tiers { font-size: 12px; color: #8fc4cc; margin: 14px 0 6px; line-height: 1.5; }
.rf-rewards { margin-top: 8px; text-align: left; }
.rf-rtitle { font-size: 12.5px; color: #8fc4cc; font-weight: 700; margin-bottom: 8px; text-align: center; }
.rf-empty { font-size: 13px; color: #7aa7ae; text-align: center; padding: 6px; }
.rf-reward { display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,.05); border: 1px solid rgba(150,230,230,.2); border-radius: var(--r-sm); padding: 8px 10px; margin-bottom: 8px; }
.rf-rw-lbl { flex: 1; font-size: 13px; color: #fff; font-weight: 600; }
.rf-rw-code { font-size: 12px; color: #5eead4; letter-spacing: 1px; }
.rf-rw-go { background: linear-gradient(110deg, #25d366, #16a34a); color: #fff; border: none; border-radius: var(--r-xs); padding: 7px 10px; font-size: 12px; font-weight: 700; cursor: pointer; }
.rw-msg { font-size: 13.5px; color: #a9d8de; margin: 0 0 12px; }
.rw-code { margin-bottom: 14px; }
.rw-code b { font-size: 22px; letter-spacing: 2px; color: #fff; background: rgba(255,255,255,.08); padding: 6px 14px; border-radius: var(--r-sm); display: inline-block; }
/* ===== Registrácia / Môj účet ===== */
.acctbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0;
padding: 13px 16px; border-radius: var(--r); cursor: pointer; text-align: left; color: #fff;
background: linear-gradient(125deg, #5b21b6, #9333ea 50%, #d946ef); border: 1px solid rgba(233,200,255,.5);
box-shadow: 0 10px 30px rgba(147,51,234,.34); position: relative; overflow: hidden; }
body:not(.athome) .acctbanner { display: none !important; }
.acctbanner::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; pointer-events: none;
background: linear-gradient(100deg, transparent, rgba(255,255,255,.22), transparent); transform: skewX(-18deg); animation: vipshine 6s ease-in-out infinite; }
.acctbanner:hover { filter: brightness(1.08); }
/* #1 IG/FB in-app banner → „na plochu" (zlatý, nezávislý od .athome, skrytý cez [hidden]) */
.igbanner { display: flex; align-items: center; gap: 12px; width: calc(100% - 24px); max-width: 1440px; margin: 10px auto 0; padding: 12px 14px; border-radius: var(--r); color: #1a1205; background: linear-gradient(125deg, #e8c860, var(--accent)); border: 1px solid rgba(255,233,163,.6); box-shadow: 0 10px 28px rgba(201,162,39,.34); position: relative; }
.igbanner[hidden] { display: none; }
.igb-ic { flex: 0 0 auto; display: inline-flex; }
.igb-ic .e3d { width: 30px; height: 30px; filter: drop-shadow(0 1px 2px rgba(0,0,0,.25)); }
.igb-mid { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; background: none; border: none; text-align: left; cursor: pointer; color: inherit; padding: 0; font: inherit; }
.igb-title { font-size: 14.5px; font-weight: 900; }
.igb-sub { font-size: 12px; font-weight: 600; opacity: .85; line-height: 1.35; }
.igb-x { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; border: none; background: rgba(0,0,0,.12); color: #1a1205; font-size: 14px; font-weight: 800; cursor: pointer; line-height: 1; }
.igb-x:hover { background: rgba(0,0,0,.2); }
/* 🍪 GDPR cookie lišta (GA4 consent) */
.cookiebar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 9000; max-width: 720px; margin: 0 auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: space-between; background: rgba(20,18,26,.97); border: 1px solid rgba(201,162,39,.45); border-radius: var(--r); padding: 12px 16px; box-shadow: 0 10px 30px rgba(0,0,0,.5); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.cookiebar .cb-txt { font-size: 12.5px; color: #e8e2d0; line-height: 1.45; flex: 1 1 240px; }
.cookiebar .cb-btns { display: flex; gap: 8px; flex: 0 0 auto; }
.cookiebar .cb-ok { background: linear-gradient(135deg,#e8c860,var(--accent)); color: #1a1205; border: none; border-radius: var(--r-sm); padding: 9px 18px; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.cookiebar .cb-ok:hover { filter: brightness(1.06); }
.cookiebar .cb-no { background: transparent; color: #9a93a6; border: 1px solid rgba(255,255,255,.2); border-radius: var(--r-sm); padding: 9px 14px; font-size: 13px; cursor: pointer; }
.cookiebar .cb-no:hover { color: #fff; }
.ab-ic { font-size: 25px; line-height: 1; }
.ab-mid { flex: 1; min-width: 0; }
.ab-title { font-weight: 800; font-size: 14.5px; color: #fff; }
.ab-sub { color: #f3e8ff; }
.ab-go { font-size: 24px; color: #e9d5ff; font-weight: 700; }
.acctgate { position: fixed; inset: 0; z-index: 1465; display: none; align-items: center; justify-content: center; padding: 18px;
background: rgba(18,4,12,.85); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.acctgate.open { display: flex; }
.ac-panel { position: relative; width: 100%; max-width: 400px; max-height: 92vh; overflow-y: auto; box-sizing: border-box; text-align: center;
background: linear-gradient(165deg, #3a0f24, #1c0712); border: 1px solid rgba(255,190,220,.3); border-radius: var(--r-lg);
padding: 26px 22px 22px; box-shadow: 0 24px 80px rgba(0,0,0,.6); }
.ac-ic { font-size: 42px; line-height: 1; margin-bottom: 2px; }
.ac-avatar { width: 66px; height: 66px; border-radius: 50%; margin: 0 auto 10px; display: flex; align-items: center; justify-content: center; font-size: 30px; font-weight: 900; color: #fff; background: linear-gradient(135deg, #db2777, #f472b6); box-shadow: 0 6px 20px rgba(219,39,119,.45); }
.ac-title { font-size: 22px; font-weight: 900; color: #fff; margin: 0 0 6px; }
.ac-intro { font-size: 13px; line-height: 1.5; color: #e6a9c8; margin: 0 0 12px; }
.reg-benefits { list-style: none; margin: 0 0 14px; padding: 13px 15px; text-align: left; background: linear-gradient(180deg, rgba(201,162,39,.16), rgba(201,162,39,.05)); border: 1px solid rgba(201,162,39,.42); border-radius: var(--r); display: flex; flex-direction: column; gap: 9px; }
.reg-benefits li { font-size: 14px; line-height: 1.35; color: #f3ead0; font-weight: 600; }
.ac-in { width: 100%; box-sizing: border-box; padding: 12px 14px; margin-bottom: 9px; border-radius: var(--r-sm); border: 1px solid rgba(255,190,220,.28);
background: rgba(0,0,0,.35); color: #fff; font-size: 15px; outline: none; }
.ac-in:focus { border-color: #db2777; }
.ac-fasthint { font-size: 11.5px; color: var(--accent); font-weight: 700; margin: -2px 0 10px; text-align: center; opacity: .92; }
.ac-consent { display: flex; align-items: flex-start; gap: 9px; text-align: left; font-size: 12px; color: #d9a9c2; margin: 6px 0 14px; line-height: 1.45; cursor: pointer; }
.ac-consent input { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 1px; }
.ac-submit { width: 100%; padding: 14px; border-radius: var(--r-sm); border: none; cursor: pointer; background: linear-gradient(110deg, #db2777, #f472b6); color: #fff; font-weight: 800; font-size: 15.5px; }
.ac-submit:disabled { opacity: .6; cursor: default; }
.ac-err { margin-top: 11px; font-size: 13px; color: #ffb3c7; }
.ac-info { margin-top: 11px; font-size: 13px; line-height: 1.45; color: #9be6c0; background: rgba(80,200,140,.10); border: 1px solid rgba(80,200,140,.28); border-radius: var(--r-sm); padding: 9px 11px; }
.ac-loginlink { display: block; width: 100%; margin-top: 14px; background: none; border: none; color: #e6a9c8; font-size: 13.5px; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; padding: 6px; }
.ac-loginlink:active { opacity: .7; }
#acLoginCodeWrap { margin-top: 10px; }
#acLoginCode { text-align: center; letter-spacing: 5px; font-size: 19px; font-weight: 800; }
.ac-stats { display: flex; gap: 10px; margin: 6px 0 16px; }
.ac-stat { flex: 1; background: rgba(255,255,255,.05); border: 1px solid rgba(255,190,220,.2); border-radius: var(--r); padding: 12px 8px; display: flex; flex-direction: column; gap: 2px; }
.ac-stat b { font-size: 22px; color: #f9a8d4; }
.ac-stat span { font-size: 11px; color: #d9a9c2; }
.ac-dtitle { font-size: 12.5px; color: #d9a9c2; font-weight: 700; text-align: left; margin: 12px 0 8px; }
.ac-profile { text-align: left; font-size: 13px; color: #fff; line-height: 1.6; background: rgba(255,255,255,.04); border-radius: var(--r-sm); padding: 12px 14px; }
/* ===== Odznak pravosti (lightbox) ===== */
/* ===== Naposledy prezerané ===== */
.recent { width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0; padding: 13px 16px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); box-sizing: border-box; }
.recent-h { font-size: 13.5px; color: var(--text); font-weight: 800; margin-bottom: 10px; letter-spacing: .2px; display: flex; align-items: center; gap: 7px; }
.recent-row { display: flex; gap: 10px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.recent-row::-webkit-scrollbar { display: none; }
.rc-item { flex: 0 0 auto; width: 58px; height: 74px; border-radius: var(--r-sm); overflow: hidden; border: 1px solid var(--line); background: #0a0b0e; cursor: pointer; padding: 0; transition: border-color .15s, transform .12s; }
.rc-item:hover { border-color: var(--accent); transform: translateY(-2px); }
.rc-item img { width: 100%; height: 100%; object-fit: contain; }
/* ===== Kúsok dňa ===== */
.pickday {
display: flex; align-items: center; gap: 14px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0;
padding: 10px 14px 10px 10px; border-radius: var(--r); cursor: pointer; text-align: left; color: var(--text);
background: linear-gradient(110deg, rgba(201,162,39,.15), rgba(201,162,39,.03)); border: 1px solid rgba(201,162,39,.4);
}
.pickday:hover { filter: brightness(1.06); }
.pd-img { width: 64px; height: 80px; object-fit: contain; background: #0a0b0e; border-radius: var(--r-sm); flex: 0 0 auto; }
.pd-info { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pd-tag { font-size: 12px; font-weight: 800; color: var(--accent-2); letter-spacing: .3px; }
.pd-name { font-size: 15px; font-weight: 700; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pd-go { font-size: 26px; color: var(--accent-2); flex: 0 0 auto; }
/* Pozvi kamarátku (install modál) */
.im-invite { width: 100%; margin-top: 8px; background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: 13px; font-size: 14.5px; font-weight: 700; cursor: pointer; }
.im-invite:hover { border-color: var(--accent); }
/* ===== Produkty: cena / stav / výber / info / owner edit / bulk ===== */
.sharebrand { flex: 0 0 auto; margin-left: auto; background: var(--panel-2); color: var(--accent-2); border: 1px solid var(--accent); border-radius: var(--r-sm); padding: 7px 12px; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.sharebrand:hover { background: var(--accent); color: #1a1205; }
/* zdieľanie celej sekcie (Premium/Showroom hlavička) — zlaté, samostatné */
.secshare { margin-left: 0; margin-top: 10px; align-self: flex-start; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border: none; box-shadow: 0 3px 12px rgba(201,162,39,.35); }
.secshare:hover { filter: brightness(1.05); background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; }
.cardprice { display: block; font-size: 12.5px; font-weight: 800; color: var(--accent-2); margin-top: 2px; }
.cardsizes { display: block; font-size: 12px; font-weight: 600; color: var(--muted, #9a93a6); margin-top: 3px; letter-spacing: .2px; }
.cardorder { display: block; font-size: 11.5px; font-weight: 700; color: var(--accent-2); margin-top: 3px; line-height: 1.35; }
.lbi-order { color: var(--accent-2); font-weight: 700; font-size: 14px; }
.card.sold .imgwrap img, .card.sold .imgwrap video { opacity: .5; filter: grayscale(.45); }
/* CENOVÝ PÁS dole na fotke skladoviek — čistý profi vzhľad */
.card .imgwrap .price-bar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; gap: 1px;
padding: 24px 48px 9px 11px; pointer-events: none;
background: linear-gradient(to top, rgba(0,0,0,.86), rgba(0,0,0,.3) 64%, transparent); }
.card .imgwrap .price-bar .pb-top { display: flex; align-items: center; gap: 6px; margin-bottom: 1px; }
.card .imgwrap .price-bar .pb-old { font-size: 11.5px; color: #cdbf9c; text-decoration: line-through; opacity: .85; line-height: 1.3; white-space: nowrap; }
.card .imgwrap .price-bar .pb-new { font-size: 17px; font-weight: 900; color: #f3e2a0; letter-spacing: .2px; white-space: nowrap; line-height: 1.05; text-shadow: 0 1px 4px rgba(0,0,0,.6); }
.card .imgwrap .price-bar .pb-disc { flex: 0 0 auto; font-size: 10.5px; font-weight: 900; color: #fff; background: #e0455f; padding: 2px 6px; border-radius: var(--r-xs); line-height: 1.4; box-shadow: 0 2px 7px rgba(224,69,95,.55); }
.oldprice { color: var(--muted); text-decoration: line-through; font-weight: 600; font-size: 11.5px; }
.newprice { color: #2dd4a7; font-weight: 900; }
.discbadge { background: #e0455f; color: #fff; font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: var(--r-xs); margin-left: 2px; }
.instock { color: #2dd4a7; font-weight: 800; font-size: 12.5px; }
.lbi-price .oldprice { font-size: 13px; } .lbi-price .newprice { font-size: 16px; }
/* dlaždica Skladom — IDENTICKÝ box ako ostatné dlaždice (len zelená farba); veľkosti dedí zo zdieľaných .hometiles .alb-* */
.stockbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0; padding: 16px;
border-radius: var(--r); cursor: pointer; text-align: left; color: #fff; position: relative; overflow: hidden;
background: linear-gradient(110deg, rgba(45,212,167,.16), rgba(45,212,167,.05)); border: 1px solid rgba(45,212,167,.45); box-shadow: 0 8px 26px rgba(0,0,0,.4); }
.stockbanner:hover { filter: brightness(1.08); }
.stockbanner .alb-title { color: #d8fff2; }
.stockbanner .alb-go { color: #2dd4a7; }
/* LuxuryPass dlaždica (zlatý akcent) */
.passbanner { display: flex; align-items: center; gap: 13px; width: calc(100% - 36px); max-width: 1440px; margin: 10px auto 0; padding: 16px;
border-radius: var(--r); cursor: pointer; text-align: left; color: #fff; position: relative; overflow: hidden;
background: linear-gradient(110deg, rgba(201,162,39,.2), rgba(201,162,39,.05)); border: 1px solid var(--accent); box-shadow: 0 8px 26px rgba(0,0,0,.4); }
.passbanner:hover { filter: brightness(1.08); }
.passbanner .alb-title { color: var(--accent-2); }
.passbanner .alb-go { color: var(--accent-2); }
/* LuxuryPass modal */
.lpgate { position: fixed; inset: 0; z-index: 1500; background: rgba(8,9,12,.82); backdrop-filter: blur(5px); display: none; align-items: flex-end; justify-content: center; }
.lpgate.open { display: flex; }
@media (min-width: 560px) { .lpgate { align-items: center; } }
.lp-panel { position: relative; width: 100%; max-width: 480px; background: radial-gradient(120% 60% at 50% 0%, rgba(201,162,39,.16), rgba(21,23,30,0) 60%), var(--panel); border: 1px solid var(--accent); border-radius: var(--r-lg) var(--r-lg) 0 0; padding: 22px 16px calc(22px + env(safe-area-inset-bottom,0)); text-align: center; max-height: 94vh; overflow-y: auto; }
@media (min-width: 560px) { .lp-panel { border-radius: var(--r-lg); } }
/* hero hlavička */
.lp-hero { margin-bottom: 8px; }
.lp-ic { font-size: 44px; filter: drop-shadow(0 4px 14px rgba(201,162,39,.5)); }
.lp-title { font-family: var(--serif); font-size: 34px; font-weight: 700; margin: 2px 0 2px; letter-spacing: .5px;
background: linear-gradient(180deg, #fff3cf, var(--accent-2) 55%, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-tagline { font-size: 13px; color: var(--accent-2); margin: 0 0 6px; font-weight: 600; }
.lp-intro { font-size: 13.5px; color: var(--muted); margin: 0 0 16px; line-height: 1.5; }
.lp-active { background: rgba(201,162,39,.16); border: 1px solid var(--accent); color: var(--accent-2); border-radius: var(--r-sm); padding: 11px; font-weight: 700; font-size: 13.5px; margin-bottom: 16px; }
.lp-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
/* prémiová karta */
.lp-card { position: relative; border: 1.5px solid var(--line-2); border-radius: var(--r-lg); padding: 20px 10px 14px; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(0,0,0,.18)); display: flex; flex-direction: column; align-items: center; gap: 3px; transition: transform .15s, box-shadow .2s, border-color .2s; }
.lp-card::before { content: ""; position: absolute; inset: 0; border-radius: var(--r-lg); padding: 1px; background: linear-gradient(160deg, rgba(236,217,138,.5), rgba(201,162,39,.1) 60%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity: .7; }
.lp-card:hover { transform: translateY(-2px); }
.lp-card.lp-own { border-color: var(--accent); background: rgba(201,162,39,.12); }
/* najobľúbenejší / najlepšia hodnota — zvýraznené */
.lp-card.lp-pop { border-color: var(--accent-2); background: linear-gradient(180deg, rgba(201,162,39,.16), rgba(201,162,39,.04)); box-shadow: 0 10px 30px rgba(201,162,39,.28); transform: scale(1.03); }
.lp-card.lp-pop::before { opacity: 1; background: linear-gradient(160deg, #ffe9a3, var(--accent)); }
.lp-card.lp-best { box-shadow: 0 8px 24px rgba(201,162,39,.2); }
.lp-ribbon { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); white-space: nowrap; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1205; font-size: 10px; font-weight: 800; letter-spacing: .3px; padding: 3px 10px; border-radius: var(--r-pill); box-shadow: 0 3px 10px rgba(201,162,39,.45); }
.lp-ribbon-best { background: linear-gradient(180deg, #eaf0ff, #b9c8ff); color: #1b2440; box-shadow: 0 3px 10px rgba(150,170,255,.4); }
.lp-pct { font-family: var(--serif); font-size: 46px; font-weight: 700; line-height: 1; margin-top: 4px;
background: linear-gradient(180deg, #fff3cf, var(--accent-2) 60%, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-pctsign { font-size: 26px; }
.lp-year { font-size: 10.5px; color: var(--muted); text-transform: uppercase; letter-spacing: 1px; margin-top: 2px; }
.lp-price { font-size: 20px; font-weight: 900; color: var(--text); margin: 6px 0 10px; }
.lp-go { width: 100%; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border: none; border-radius: var(--r-sm); padding: 11px; font-size: 14px; font-weight: 800; cursor: pointer; box-shadow: 0 4px 14px rgba(201,162,39,.3); transition: filter .15s, transform .12s; }
.lp-go:hover { filter: brightness(1.06); }
.lp-go:active { transform: scale(.96); }
.lp-note { font-size: 11.5px; color: var(--muted); margin-top: 16px; line-height: 1.55; }
/* pas v účte */
.ac-pass { border-radius: var(--r-sm); padding: 11px 13px; margin: 4px 0 14px; font-size: 13.5px; text-align: center; }
.ac-pass.on { background: rgba(201,162,39,.16); border: 1px solid var(--accent); color: var(--accent-2); font-weight: 700; }
.ac-pass.off { background: linear-gradient(180deg, rgba(201,162,39,.10), rgba(201,162,39,.03)); border: 1px solid rgba(201,162,39,.34); color: var(--text); display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.ac-credit { border-radius: var(--r-sm); padding: 10px 13px; margin: 0 0 14px; font-size: 13.5px; text-align: center; background: rgba(61,220,140,.08); border: 1px solid rgba(61,220,140,.32); color: var(--text); }
.co-credit label { font-size: 13.5px; }
.ac-passbtn { margin-left: 0; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border: none; border-radius: var(--r-pill); padding: 8px 18px; font-size: 13px; font-weight: 900; letter-spacing: .2px; cursor: pointer; box-shadow: 0 4px 14px rgba(201,162,39,.32); transition: transform .12s ease, box-shadow .12s ease; }
.ac-passbtn:active { transform: scale(.96); }
@media (hover: hover) { .ac-passbtn:hover { box-shadow: 0 6px 20px rgba(201,162,39,.45); } }
.pstatus { position: absolute; top: 8px; right: 8px; z-index: 3; font-size: 10.5px; font-weight: 800; padding: 3px 7px; border-radius: var(--r-xs); letter-spacing: .3px; text-transform: uppercase; }
.pstatus.sold { background: #e0455f; color: #fff; }
.pstatus.reserved { background: var(--accent); color: #1a1205; }
.lbinfo .pstatus { position: static; display: inline-block; }
/* ✅ SKLADOM odznak na fotke karty (zelený, top-left) — jasne vidno že kúsok je na sklade */
.stock-badge {
position: absolute; top: 9px; left: 9px; z-index: 4;
display: inline-flex; align-items: center; gap: 4px;
background: linear-gradient(135deg, #15b56a, #0d8f51);
color: #fff; font-size: 10.5px; font-weight: 900; letter-spacing: .4px; text-transform: uppercase;
padding: 3px 9px 3px 6px; border-radius: var(--r-xs);
border: 1px solid rgba(255,255,255,.3); box-shadow: 0 2px 9px rgba(13,143,81,.55);
}
.stock-badge .e3d { width: 14px; height: 14px; opacity: 1; filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
/* 🎁 akcia 1+1 / multi-buy — odznak vpravo hore na karte */
.bundle-badge { position: absolute; top: 48px; right: 8px; z-index: 4; display: inline-flex; align-items: center; background: linear-gradient(135deg, #3ddc8c, #1faa63); color: #06281d; font-size: 10.5px; font-weight: 900; letter-spacing: .3px; padding: 3px 9px; border-radius: var(--r-xs); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 2px 9px rgba(61,220,140,.5); }
/* ── ĽAVÝ STĹPEC odznakov na karte — vzdušné, prémiové, jeden pod druhým ── */
.card .imgwrap .card-tags {
position: absolute; top: 8px; left: 8px; right: 50px; z-index: 5; /* right:50 = miesto pre srdce vpravo hore */
display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
pointer-events: none; /* odznaky neblokujú klik na kartu/srdce */
}
/* každý odznak = samostatný chip podľa obsahu (žiadne roztiahnutie na celú šírku) */
.card .imgwrap .card-tags > * {
position: static !important; inset: auto !important; margin: 0 !important; max-width: 100%; flex: 0 0 auto; width: auto;
}
/* dostupnosť „Na objednávku · 14 dní" = jeden čistý riadok pod TOP (pri dlhom jazyku jemne zalomí) */
.card .imgwrap .card-tags > .order-badge { white-space: normal; line-height: 1.2; }
.card .imgwrap .card-tags > .order-badge span { overflow: visible; text-overflow: clip; }
/* luxusné SVG ikonky v odznakoch — správna veľkosť + zarovnanie k textu */
.top-badge .e3d, .bundle-badge .e3d { width: 1.05em; height: 1.05em; vertical-align: -0.15em; margin-right: 1px; }
.sale-h .sale-h-ic .e3d { width: 1.05em; height: 1.05em; vertical-align: -0.16em; }
.sale-pct.gift .e3d { width: 1.5em; height: 1.5em; display: block; margin: 0 auto 2px; }
/* ⭐ TOP produkt — jemný zlatý rámček okolo celej karty (profi, bez prekrytia) */
.card.is-top { border-color: #e8c860; box-shadow: 0 0 0 1px rgba(247,218,125,.55), 0 0 16px rgba(201,162,39,.22), 0 10px 30px rgba(0,0,0,.4); }
.card.is-top:hover { transform: translateY(-4px); border-color: #f3d77a; box-shadow: 0 0 0 1px rgba(247,218,125,.75), 0 0 22px rgba(201,162,39,.38), 0 14px 36px rgba(0,0,0,.46); }
.top-badge { position: absolute; top: 8px; left: 8px; z-index: 6; display: inline-flex; align-items: center; gap: 3px; background: linear-gradient(135deg, #fbe79a 0%, #e6c25a 45%, #d4a82f 100%); color: #2a1d02; font-size: 10px; font-weight: 900; letter-spacing: .5px; padding: 3px 9px; border-radius: var(--r-xs); border: 1px solid rgba(255,255,255,.55); box-shadow: 0 2px 8px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.45); text-shadow: 0 1px 0 rgba(255,255,255,.22); }
/* na TOP karte ostatné ľavé odznaky idú POD ⭐ TOP — rovnomerné rozostupy, nič sa neprekrýva */
.imgwrap.has-top .stock-badge, .imgwrap.has-top .order-badge { top: 39px; }
.imgwrap.has-top .badge { top: 39px; }
.imgwrap.has-top.has-avail .badge { top: 69px; }
.iconbtn.top { background: linear-gradient(180deg, rgba(247,218,125,.16), rgba(201,162,39,.16)); border-color: rgba(201,162,39,.6); color: var(--accent-2); font-weight: 700; }
.iconbtn.top.active { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1205; border: none; font-weight: 800; }
/* ⏳ NA OBJEDNÁVKU · 14 dní — jemný tmavo-zlatý štítok (väčšina katalógu → nekričí, len informuje) */
.order-badge {
position: absolute; top: 9px; left: 9px; z-index: 4;
display: inline-flex; align-items: center; gap: 3px; max-width: calc(100% - 18px);
background: rgba(12,13,17,.66); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
color: #ecd9a8; font-size: 9px; font-weight: 800; letter-spacing: 0; white-space: nowrap;
padding: 3px 8px 3px 6px; border-radius: var(--r-xs);
border: 1px solid rgba(201,162,39,.42); box-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.order-badge .e3d { width: 13px; height: 13px; opacity: 1; flex: 0 0 auto; }
.order-badge span { overflow: hidden; text-overflow: ellipsis; }
/* keď je SKLADOM/Na objednávku odznak, posuň foto-počet pod neho (trieda .has-avail — lacnejšie než :has(), ktorý spomaľoval recalc pri stovkách kariet) */
.imgwrap.has-avail .badge { top: 37px; }
/* výberový checkbox na karte (len owner režim úprav) */
.selbox { display: none; position: absolute; top: 8px; left: 8px; z-index: 4; width: 26px; height: 26px; border-radius: var(--r-xs); border: 2px solid #fff; background: rgba(0,0,0,.45); color: transparent; font-size: 16px; font-weight: 900; line-height: 22px; text-align: center; cursor: pointer; }
body.curate .selbox { display: block; }
.selbox.on { background: var(--accent); border-color: var(--accent-2); color: #1a1205; }
body.curate .card.selected { outline: 3px solid var(--accent); outline-offset: -1px; border-radius: var(--r); }
/* info panel v lightboxe */
.lbinfo { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; justify-content: center; padding: 8px 86px 8px 14px; color: var(--text); max-height: 34vh; overflow-y: auto; -webkit-overflow-scrolling: touch; } /* pravý odstup = miesto pre plávajúce WhatsApp tlačidlo; max výška + rolovanie, aby dlhý popis nezakryl fotku */
.lbi-row { font-size: 13.5px; color: var(--text); }
.lbi-price { font-weight: 800; color: var(--accent-2); font-size: 15px; }
/* VEĽKÝ cenový štítok priamo na fotke v detaile produktu */
.lb-pricetag {
position: absolute; left: 16px; bottom: 16px; z-index: 6; pointer-events: none;
display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
background: linear-gradient(135deg, rgba(20,16,7,.94), rgba(20,16,7,.8));
border: 1.5px solid rgba(232,200,96,.65); border-radius: var(--r);
padding: 9px 16px; backdrop-filter: blur(5px);
box-shadow: 0 8px 26px rgba(0,0,0,.55);
}
.lb-pricetag .lbpt-new { font-size: 32px; font-weight: 900; color: #f3e2a0; letter-spacing: .4px; line-height: 1; text-shadow: 0 2px 10px rgba(0,0,0,.7); }
.lb-pricetag .lbpt-top { display: flex; align-items: center; gap: 9px; }
.lb-pricetag .lbpt-old { font-size: 16px; color: #cdbf9c; text-decoration: line-through; opacity: .8; line-height: 1; }
.lb-pricetag .lbpt-disc { font-size: 13.5px; font-weight: 900; color: #fff; background: #e0455f; padding: 3px 9px; border-radius: var(--r-xs); box-shadow: 0 2px 8px rgba(224,69,95,.5); }
@media (max-width: 700px) {
.lb-pricetag { left: 10px; bottom: 10px; padding: 8px 13px; border-radius: var(--r-sm); }
.lb-pricetag .lbpt-new { font-size: 27px; }
.lb-pricetag .lbpt-old { font-size: 14px; }
}
.lbi-note { width: 100%; text-align: center; color: var(--muted); font-size: 13px; }
/* owner edit modál */
.ownedit { position: fixed; inset: 0; z-index: 130; background: rgba(0,0,0,.6); display: none; align-items: center; justify-content: center; padding: 16px; }
.ownedit.open { display: flex; }
.oe-card { background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r-lg); padding: 18px; width: 100%; max-width: 360px; position: relative; }
.oe-card h3 { margin: 0 0 12px; font-size: 17px; color: var(--accent-2); }
.oe-card label { display: block; font-size: 12px; color: var(--muted); margin: 10px 0 4px; font-weight: 700; }
.oe-card input, .oe-card textarea, .oe-card select { width: 100%; box-sizing: border-box; background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: 11px; font-size: 16px; }
.oe-close { position: absolute; top: 12px; right: 12px; background: none; border: none; color: var(--muted); font-size: 20px; cursor: pointer; }
.oe-actions { display: flex; gap: 10px; margin-top: 16px; }
.oe-actions button { flex: 1; border-radius: var(--r-sm); padding: 12px; font-size: 14.5px; font-weight: 800; cursor: pointer; border: 1px solid var(--line-2); }
.oe-cancel { background: var(--panel-2); color: var(--text); }
.oe-save { background: var(--accent); color: #1a1205; border-color: var(--accent); }
/* bulk lišta (vyčistenie albumov) */
.bulkbar { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 125; display: flex; align-items: center; gap: 12px; background: var(--panel); border: 1px solid var(--accent); border-radius: var(--r); padding: 10px 14px; box-shadow: 0 8px 30px rgba(0,0,0,.5); }
.bulkbar[hidden] { display: none; }
.bb-txt { font-size: 13.5px; color: var(--text); }
.bb-txt b { color: var(--accent-2); }
.bb-clear { background: var(--panel-2); color: var(--text); border: 1px solid var(--line-2); border-radius: var(--r-sm); padding: 9px 12px; font-size: 13px; cursor: pointer; }
.bb-hide { background: #e0455f; color: #fff; border: none; border-radius: var(--r-sm); padding: 9px 13px; font-size: 13.5px; font-weight: 800; cursor: pointer; }
.bb-move { background: linear-gradient(135deg,var(--accent),#ecd98a); color: #1a1203; border: none; border-radius: var(--r-sm); padding: 9px 13px; font-size: 13.5px; font-weight: 800; cursor: pointer; }
/* ===================== Vernostný účet + bohatá registrácia ===================== */
/* registrácia – bonusová sekcia s chipmi */
.reg-bonus { margin: 10px 0 4px; padding: 14px; border: 1px dashed var(--accent); border-radius: var(--r); background: rgba(201,162,39,.06); text-align: left; }
.reg-bonus-h { font-size: 13.5px; font-weight: 800; color: var(--accent-2); margin-bottom: 10px; }
.reg-glabel { font-size: 12.5px; font-weight: 700; color: var(--muted); margin: 10px 0 6px; }
.reg-row { display: flex; gap: 8px; }
.reg-row > * { flex: 1 1 0; min-width: 0; }
.chipwrap { display: flex; flex-wrap: wrap; gap: 7px; }
.regchip { background: var(--panel-2); border: 1.4px solid var(--line-2); color: var(--text); border-radius: var(--r-pill); padding: 7px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .12s; }
.regchip:hover { border-color: var(--accent); }
.regchip.sel { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border-color: #ffe9a3; font-weight: 800; }
/* dashboard – karta úrovne + body */
.ac-levelcard { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: var(--r-lg); background: linear-gradient(135deg, rgba(201,162,39,.18), rgba(201,162,39,.04)); border: 1px solid var(--accent); margin-bottom: 6px; }
.ac-levelcard .ac-avatar { margin: 0; flex: 0 0 auto; }
.ac-lvmid { text-align: left; }
.ac-lvname { font-family: var(--serif); font-size: 21px; font-weight: 700; color: var(--accent-2); line-height: 1.1; }
.ac-lvpts { font-size: 14px; color: var(--text); margin-top: 2px; }
.ac-lvpts b { color: var(--accent-2); font-size: 17px; }
/* progres do ďalšej úrovne */
.ac-prog { height: 12px; border-radius: var(--r-pill); background: var(--panel-2); border: 1px solid var(--line); overflow: hidden; margin: 4px 0 6px; }
.ac-prog-fill { height: 100%; width: 0; border-radius: var(--r-pill); background: linear-gradient(90deg, var(--accent-2), var(--accent)); transition: width .6s ease; }
.ac-prog-txt { font-size: 12.5px; color: var(--muted); margin-bottom: 6px; text-align: center; }
.ac-spent { font-size: 12px; color: var(--accent-2); text-align: center; margin-bottom: 12px; }
.ac-perks { list-style: none; margin: 0 0 8px; padding: 0; }
.ac-perks li { position: relative; padding: 7px 10px 7px 28px; font-size: 13px; color: var(--text); border: 1px solid var(--line); border-radius: var(--r-sm); margin-bottom: 6px; background: rgba(201,162,39,.05); }
.ac-perks li::before { content: '✓'; position: absolute; left: 10px; top: 7px; color: var(--accent-2); font-weight: 800; }
.ac-perks li.perk-link { cursor: pointer; padding-left: 10px; font-weight: 700; color: var(--accent-2); background: linear-gradient(180deg, rgba(201,162,39,.16), rgba(201,162,39,.07)); border-color: var(--accent); display: flex; align-items: center; justify-content: space-between; gap: 8px; transition: transform .12s ease, box-shadow .12s ease; }
.ac-perks li.perk-link::before { content: none; }
.ac-perks li.perk-link:active { transform: scale(.98); }
.ac-perks li.perk-link .perk-go { font-size: 18px; font-weight: 900; opacity: .8; }
@media (hover: hover) { .ac-perks li.perk-link:hover { box-shadow: 0 4px 14px rgba(201,162,39,.22); } }
/* model/názov kúska na kartičke a v náhľade */
.cardmodel { display: block; font-family: var(--serif); font-size: 15px; font-weight: 600; color: var(--accent-2); margin: 1px 0 2px; line-height: 1.2; }
.lbi-name { flex: 1 1 100%; width: 100%; text-align: center; font-family: var(--serif); font-size: 21px; font-weight: 700; color: var(--accent-2); margin-bottom: 2px; }
/* vysvetlivky kolesa — schované pod ℹ️ (decentne) */
.wg-infobtn { display: inline-flex; align-items: center; gap: 6px; margin: 12px auto 0; background: transparent; border: 1px solid var(--line-2); color: var(--muted); border-radius: var(--r-pill); padding: 7px 14px; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color .15s, color .15s; }
.wg-infobtn:hover, .wg-infobtn.open { border-color: var(--accent); color: var(--accent-2); }
.wg-legend { margin-top: 10px; padding: 12px 14px; border: 1px solid var(--accent); border-radius: var(--r); background: rgba(201,162,39,.07); text-align: left; }
.wg-legend[hidden] { display: none; }
.wg-leg-list { list-style: none; margin: 0; padding: 0; }
.wg-leg-list li { font-size: 12.5px; line-height: 1.5; color: var(--text); padding: 5px 0; border-bottom: 1px dashed var(--line); }
.wg-leg-list li:last-child { border-bottom: none; }
/* tlačidlo „odomkni VIP Room" pri dennej ochutnávke */
.lbi-vip { flex: 1 1 100%; width: 100%; margin-top: 10px; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border: none; border-radius: var(--r-sm); padding: 13px; font-size: 14.5px; font-weight: 800; cursor: pointer; box-shadow: 0 6px 20px rgba(201,162,39,.35); }
.lbi-vip:hover { filter: brightness(1.05); }
/* dlhý popis produktu (VIP + albumy) v náhľade */
.lbi-desc { flex: 1 1 100%; width: 100%; margin-top: 6px; padding: 12px 14px; background: var(--panel-2); border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: var(--r-sm); font-size: 13.5px; line-height: 1.6; color: var(--text); white-space: normal; text-align: left; }
/* odznaky */
.ac-badges { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; margin: 4px 0 14px; }
.ac-badge { background: rgba(201,162,39,.14); border: 1px solid var(--accent); color: var(--accent-2); border-radius: var(--r-pill); padding: 6px 11px; font-size: 12px; font-weight: 700; }
.ac-badge-hint { font-size: 12.5px; color: var(--muted); }
/* objednávky */
.ac-order { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); margin-bottom: 8px; font-size: 13px; }
/* sledovanie objednávky — stepper */
.ac-order2 { border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; margin-bottom: 12px; background: var(--panel); }
.ao-head { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 10px; }
.ao-head .ao-d { color: var(--muted); font-size: 11.5px; }
.ao-head .ao-i { flex: 1; color: var(--text); font-weight: 600; }
.ao-head .ao-t { color: var(--accent-2); font-weight: 800; margin-left: auto; }
.ao-no { font-size: 11px; font-weight: 800; letter-spacing: .4px; color: var(--accent-2); background: rgba(201,162,39,.14); border: 1px solid rgba(201,162,39,.3); border-radius: var(--r-pill); padding: 2px 9px; }
.ao-body { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ao-body .ao-i { flex: 1; min-width: 0; color: var(--text); font-weight: 600; font-size: 13px; white-space: normal; }
.ao-pic { width: 52px; height: 52px; flex: 0 0 auto; border-radius: var(--r-sm); object-fit: cover; border: 1px solid var(--line); }
.trk-title { font-size: 12px; font-weight: 800; color: var(--accent-2); margin-bottom: 8px; }
.trk { display: flex; flex-direction: column; gap: 0; }
.trk-step { position: relative; display: flex; align-items: center; gap: 10px; padding: 5px 0 5px 0; }
.trk-step::before { content: ""; position: absolute; left: 10px; top: 0; bottom: 0; width: 2px; background: var(--line-2); }
.trk-step:first-child::before { top: 50%; }
.trk-step:last-child::before { bottom: 50%; }
.trk-dot { position: relative; z-index: 1; flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; background: var(--panel-2); border: 2px solid var(--line-2); color: transparent; font-size: 11px; font-weight: 900; display: inline-flex; align-items: center; justify-content: center; }
.trk-lbl { font-size: 12.5px; color: var(--muted); }
.trk-step.done .trk-dot { background: var(--accent); border-color: var(--accent); color: #1a1205; }
.trk-step.done::before { background: var(--accent); }
.trk-step.done .trk-lbl { color: var(--text); }
.trk-step.now .trk-dot { background: var(--accent-2); border-color: var(--accent-2); color: #1a1205; box-shadow: 0 0 0 4px rgba(201,162,39,.22); }
.trk-step.now .trk-lbl { color: var(--accent-2); font-weight: 800; }
.trk-eta { margin-top: 8px; font-size: 12px; color: var(--muted); background: rgba(201,162,39,.08); border: 1px solid var(--line); border-radius: var(--r-xs); padding: 7px 10px; }
.ao-d { color: var(--muted); flex: 0 0 auto; }
.ao-i { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ao-t { font-weight: 800; color: var(--accent-2); flex: 0 0 auto; }
.ao-s { flex: 0 0 auto; font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: var(--r-pill); }
.ao-new { background: #2a2f45; color: #9db4ff; } .ao-paid { background: #1f3a28; color: #6ee29a; }
.ao-shipped { background: #3a3320; color: #ffd479; } .ao-done { background: #1f3a28; color: #6ee29a; }
.ao-cancelled { background: #3a2330; color: #ff9db5; }
/* profilové tagy + editácia */
.ac-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ac-tag { background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 4px 10px; font-size: 11.5px; color: var(--accent-2); }
.ac-editprof { width: 100%; margin-top: 14px; background: var(--panel-2); color: var(--accent-2); border: 1.5px solid var(--accent); border-radius: var(--r-sm); padding: 12px; font-size: 14px; font-weight: 700; cursor: pointer; }
.ac-editprof:hover { background: rgba(201,162,39,.12); }
/* =====================================================================
ZVÝRAZNENIE KĽÚČOVÝCH OVLÁDACÍCH PRVKOV (aby ich klientky nehľadali)
— Inštalovať appku, Späť, a krížiky (✕) na zatvorenie produktu.
===================================================================== */
/* --- 1) Inštalovať appku: výrazný zlatý gombík s dýchajúcim leskom + ikonka --- */
.instbtn {
position: relative;
background: linear-gradient(135deg, #ffe48a 0%, var(--accent-2) 45%, var(--accent) 100%);
border: 1.5px solid #ffe9a3;
animation: instpulse 2.2s ease-in-out infinite;
}
@keyframes instpulse {
0%,100% { box-shadow: 0 4px 14px rgba(201,162,39,.34), 0 0 0 0 rgba(201,162,39,.5); transform: translateY(0); }
50% { box-shadow: 0 7px 26px rgba(201,162,39,.6), 0 0 0 7px rgba(201,162,39,0); transform: translateY(-1px); }
}
.instbtn:hover { filter: brightness(1.06); transform: translateY(-1px); }
.instbtn:active { transform: scale(.96); }
/* na mobile, kde je len ikonka 📲, nech ňou jemne „mávne", aby si ju všimli */
@media (max-width: 700px) {
.instbtn::before { animation: instwiggle 2.6s ease-in-out infinite; transform-origin: 50% 70%; }
}
@keyframes instwiggle {
0%,88%,100% { transform: rotate(0); } 91% { transform: rotate(-12deg); }
94% { transform: rotate(10deg); } 97% { transform: rotate(-6deg); }
}
/* --- 2) Späť: plávajúci gombík s jemným pulzom + nudge šípky --- */
.fabback { animation: fabpulse 2.8s ease-in-out infinite; }
@keyframes fabpulse {
0%,100% { box-shadow: 0 8px 22px rgba(201,162,39,.4), 0 0 0 0 rgba(201,162,39,.45); }
50% { box-shadow: 0 10px 28px rgba(201,162,39,.55), 0 0 0 8px rgba(201,162,39,0); }
}
.fabback .fb-arrow { animation: arrownudge 1.6s ease-in-out infinite; }
.backbtn:hover .fb-arrow, .fabback:hover .fb-arrow { animation: none; }
@keyframes arrownudge { 0%,100% { transform: translateX(0); } 50% { transform: translateX(-3px); } }
/* aj „Späť" v drobečkoch jemne pohne šípkou pri zobrazení */
.backbtn { box-shadow: 0 0 0 0 rgba(201,162,39,.4); }
/* --- 3) Krížik ✕ na zatvorenie produktu (lightbox): jasne viditeľný kruh + pulz --- */
.iconbtn.close {
background: rgba(20,18,14,.72); -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
border: 1px solid rgba(201,162,39,.5);
color: #ece6d8;
box-shadow: 0 3px 12px rgba(0,0,0,.45);
animation: none;
}
.iconbtn.close:hover { background: linear-gradient(180deg, #f6dd8a, #cda233); border-color: transparent; color: #1a1205; transform: scale(1.07); animation: none; }
.iconbtn.close:active { transform: scale(.93); }
/* --- ostatné krížiky v modáloch: zjednotený, dobre viditeľný štýl --- */
.rvg-x, .oe-close, .vg-x, .wg-x, .rf-x, .st-x, .sw-x, .im-x, .chat-x, .pg-x, .catedit-x {
background: rgba(255,255,255,.14) !important;
border: 1.6px solid rgba(255,255,255,.55) !important;
color: #fff !important;
border-radius: 50% !important;
width: 40px; height: 40px; display: grid; place-items: center;
font-size: 18px; line-height: 1; cursor: pointer;
transition: transform .12s, background .15s, border-color .15s;
}
.rvg-x:hover, .oe-close:hover, .vg-x:hover, .wg-x:hover, .rf-x:hover,
.st-x:hover, .sw-x:hover, .im-x:hover, .chat-x:hover, .pg-x:hover, .catedit-x:hover {
background: #e0455f !important; border-color: #fff !important; transform: scale(1.08);
}
/* --- Fallback zdieľacie okno (keď navigator.share nie je dostupné) --- */
.sharefallback { position: fixed; inset: 0; z-index: 200; background: rgba(8,9,12,.72); backdrop-filter: blur(4px); display: none; align-items: flex-end; justify-content: center; }
.sharefallback.open { display: flex; }
@media (min-width: 560px) { .sharefallback { align-items: center; } }
.sf-card { position: relative; width: 100%; max-width: 460px; background: var(--panel); border: 1px solid var(--line-2); border-radius: var(--r-lg) var(--r-lg) 0 0; padding: 22px 18px calc(22px + env(safe-area-inset-bottom,0)); }
@media (min-width: 560px) { .sf-card { border-radius: var(--r-lg); } }
.sf-x { position: absolute; top: 12px; right: 12px; width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.12); border: 1.5px solid rgba(255,255,255,.5); color: #fff; font-size: 17px; cursor: pointer; }
.sf-title { font-family: var(--serif); font-size: 22px; font-weight: 700; color: var(--accent-2); margin-bottom: 4px; }
.sf-note { font-size: 13.5px; color: var(--muted); margin-bottom: 16px; }
.sf-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 14px; }
.sf-item { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px; border-radius: var(--r); background: var(--panel-2); border: 1px solid var(--line); color: var(--text); font-size: 12px; font-weight: 600; cursor: pointer; text-decoration: none; transition: transform .12s, border-color .15s; }
.sf-item span { font-size: 24px; line-height: 1; }
.sf-item:hover { transform: translateY(-2px); border-color: var(--accent); }
.sf-wa span, .sf-tg span { filter: none; }
.sf-input { width: 100%; box-sizing: border-box; background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 11px 13px; color: var(--muted); font-size: 13px; }
/* --- Zvonček upozornení v hlavičke (vedľa 📷) — vidno, či sú zapnuté --- */
.notifbtn {
position: relative; display: inline-grid; place-items: center;
width: 42px; height: 42px; border-radius: var(--r-sm); cursor: pointer;
background: var(--panel-2); border: 1.5px solid var(--line-2); color: var(--text);
font-size: 18px; line-height: 1; transition: border-color .15s, background .15s, transform .12s;
}
.notifbtn:hover { border-color: var(--accent); }
.notifbtn:active { transform: scale(.94); }
.notifbtn .nb-bell { filter: grayscale(1) opacity(.7); } /* 🔇 stlmený = sivý */
/* ZAPNUTÉ: zlatý reproduktor 🔊 */
.notifbtn.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-color: #ffe9a3; }
.notifbtn.on .nb-bell { filter: none; }
/* VYPNUTÉ (stlmené): jemne pulzuje, nech si ho klientka všimne */
.notifbtn.off { animation: notifpulse 2.8s ease-in-out infinite; }
@keyframes notifpulse {
0%,100% { box-shadow: 0 0 0 0 rgba(201,162,39,.0); }
50% { box-shadow: 0 0 0 5px rgba(201,162,39,.18); border-color: var(--accent); }
}
@media (max-width: 700px) { .notifbtn { width: 40px; height: 40px; font-size: 17px; } }
/* upozornenie v inštalačnom okne, keď appka beží v in-app prehliadači (Instagram/FB) */
.im-inapp {
background: rgba(224,69,95,.14); border: 1.4px solid rgba(224,69,95,.6);
color: #ffc2cd; border-radius: var(--r); padding: 12px 14px; margin: 4px 0 14px;
font-size: 13.5px; line-height: 1.5; text-align: left; font-weight: 600;
}
/* ===== 📲 Vizuálny sprievodca inštaláciou + odmena −10 % ===== */
.im-promise {
background: linear-gradient(125deg, #e8c860, var(--accent)); color: #1a1205;
border-radius: var(--r-sm); padding: 11px 14px; margin: 2px 0 16px;
font-size: 13.6px; font-weight: 800; line-height: 1.4;
box-shadow: 0 8px 22px rgba(201,162,39,.32);
}
.im-promise[hidden] { display: none; }
/* IN-APP prehliadač → otvor v Safari/Chrome (primárna výzva, zlatý rámik) */
.im-browser {
background: rgba(201,162,39,.09); border: 1.4px solid rgba(201,162,39,.5);
border-radius: var(--r); padding: 14px; margin: 0 0 14px; text-align: left;
}
.im-browser[hidden] { display: none; }
.im-bhead { display: flex; align-items: center; gap: 9px; margin: 0 0 7px; }
.im-bhead b { font-size: 15.5px; color: var(--accent-2); font-weight: 900; }
.im-bic { font-size: 20px; line-height: 1; }
.im-bsub { color: var(--muted); font-size: 13px; line-height: 1.55; margin: 0 0 11px; }
.im-bstep { margin: 0 0 10px; }
.im-copy {
width: 100%; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407;
border: none; border-radius: var(--r-sm); padding: 13px; font-size: 15px; font-weight: 800; cursor: pointer;
box-shadow: 0 6px 18px rgba(201,162,39,.35);
}
.im-copy:hover { filter: brightness(1.05); }
/* Platformový sprievodca (obrázok + kroky) */
.im-guide[hidden] { display: none; }
.im-illu { display: flex; justify-content: center; margin: 6px 0 14px; }
.im-phone { width: 100%; max-width: 250px; height: auto; overflow: visible; }
.im-frame { fill: var(--panel-2); stroke: var(--line-2); stroke-width: 2; }
.im-screen { fill: var(--bg-2); }
.im-tbar { fill: var(--panel); stroke: var(--line); stroke-width: 1; }
.im-nav { stroke: var(--muted); stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.im-sharering { fill: none; stroke: var(--accent); stroke-width: 2.4; transform-origin: 130px 121px; animation: imring 1.5s ease-in-out infinite; }
.im-share { fill: none; stroke: var(--accent-2); stroke-width: 2; }
.im-shareup { fill: none; stroke: var(--accent-2); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.im-arrow { animation: imbob 1.1s ease-in-out infinite; }
.im-arline { stroke: var(--accent-2); stroke-width: 3; stroke-linecap: round; }
.im-arhead { fill: var(--accent-2); }
.im-tap { fill: var(--accent-2); font-size: 13px; font-weight: 800; font-family: var(--sans, inherit); }
@keyframes imbob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }
@keyframes imring { 0%, 100% { opacity: .3; transform: scale(1); } 50% { opacity: 1; transform: scale(1.14); } }
@media (prefers-reduced-motion: reduce) { .im-arrow, .im-sharering { animation: none; } }
/* 🎁 Odmena získaná — kód −10 % */
.im-reward {
background: rgba(201,162,39,.1); border: 1.4px solid rgba(201,162,39,.55);
border-radius: var(--r); padding: 15px 14px; margin: 4px 0 14px; text-align: center;
}
.im-reward[hidden] { display: none; }
.im-rlabel { font-size: 14px; font-weight: 800; color: var(--accent-2); margin: 0 0 9px; }
.im-rcode {
display: inline-block; font-family: ui-monospace, Menlo, Consolas, monospace;
font-size: 22px; font-weight: 900; letter-spacing: 3px; color: #1a1407;
background: linear-gradient(180deg, var(--accent-2), var(--accent));
border: none; border-radius: var(--r-sm); padding: 11px 20px; cursor: pointer;
box-shadow: 0 6px 18px rgba(201,162,39,.4);
}
.im-rcode:hover { filter: brightness(1.05); }
.im-rhint { font-size: 12.5px; color: var(--muted); line-height: 1.5; margin: 10px auto 0; max-width: 320px; }
/* ===== Showroom — vlastné reálne fotky už PREDANÝCH kúskov ===== */
.snav.snav-showroom { background: linear-gradient(180deg, rgba(201,162,39,.12), rgba(201,162,39,.04)); border-color: rgba(201,162,39,.45); color: var(--accent-2); font-weight: 700; }
.snav.snav-showroom.active { background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-color: #ffe9a3; color: #1a1407; font-weight: 800; box-shadow: 0 4px 14px rgba(201,162,39,.4); }
#showroomView { padding: 6px 12px 90px; }
.sr-head { text-align: center; margin: 6px 0 12px; }
.sr-head h2 { font-size: 21px; margin: 0 0 4px; }
.sr-head .secsub { color: var(--accent-2); font-size: 13px; line-height: 1.5; margin: 0 auto; max-width: 520px; }
.sr-filters { display: flex; flex-direction: column; gap: 7px; margin: 0 0 14px; }
.sr-frow { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 3px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.sr-frow::-webkit-scrollbar { display: none; }
.sr-chip { flex: 0 0 auto; background: var(--panel-2); border: 1px solid var(--line); color: var(--text); border-radius: var(--r-pill); padding: 7px 14px; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.sr-chip.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; border-color: var(--accent); }
.sr-chip.alt { font-weight: 600; font-size: 12.5px; padding: 6px 12px; }
.sr-chip.alt.on { background: rgba(201,162,39,.18); color: var(--accent-2); }
.sr-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 560px) { .sr-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 860px) { .sr-grid { grid-template-columns: repeat(4, 1fr); } }
.sr-card { position: relative; border: none; padding: 0; background: var(--panel); border-radius: var(--r); overflow: hidden; cursor: pointer; aspect-ratio: 3/4; box-shadow: 0 2px 10px rgba(0,0,0,.25); }
.sr-img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s ease; }
.sr-card:active .sr-img { transform: scale(.98); }
.sr-sold { position: absolute; top: 8px; left: 8px; background: linear-gradient(180deg, #1f7a45, #14502d); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .3px; padding: 3px 9px; border-radius: var(--r-pill); box-shadow: 0 2px 8px rgba(0,0,0,.4); }
.sr-real { position: absolute; top: 8px; left: 8px; background: linear-gradient(180deg, var(--accent-2), var(--accent)); color: #1a1407; font-size: 10.5px; font-weight: 800; letter-spacing: .2px; padding: 3px 9px; border-radius: var(--r-pill); box-shadow: 0 2px 8px rgba(0,0,0,.4); }
.sr-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 8px 7px; font-size: 11.5px; font-weight: 700; color: #fff; background: linear-gradient(0deg, rgba(0,0,0,.72), transparent); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-loading { grid-column: 1/-1; text-align: center; color: var(--muted); padding: 40px 0; font-size: 26px; }
/* Showroom lightbox */
.sr-lb { position: fixed; inset: 0; z-index: 1600; display: none; align-items: center; justify-content: center; background: rgba(6,7,10,.94); backdrop-filter: blur(6px); }
.sr-lb.open { display: flex; }
.sr-lb-stage { position: relative; max-width: 94vw; max-height: 84vh; display: flex; }
.sr-lb-img { max-width: 94vw; max-height: 84vh; object-fit: contain; border-radius: var(--r-sm); }
.sr-lb-sold { position: absolute; top: 10px; left: 10px; background: linear-gradient(180deg, #1f7a45, #14502d); color: #fff; font-size: 12px; font-weight: 800; padding: 4px 11px; border-radius: var(--r-pill); box-shadow: 0 2px 8px rgba(0,0,0,.5); }
.sr-lb-btn { position: absolute; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); color: #fff; width: 46px; height: 46px; border-radius: 50%; font-size: 24px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.sr-lb-x { top: 16px; right: 16px; }
.sr-lb-prev { left: 10px; top: 50%; transform: translateY(-50%); }
.sr-lb-next { right: 10px; top: 50%; transform: translateY(-50%); }
.sr-lb-cap { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: #fff; font-size: 14px; font-weight: 700; }
/* Odkaz na odber noviniek (account gate) — zlatý, výraznejší */
.ac-newslink { color: var(--accent-2) !important; font-weight: 800 !important; background: rgba(201,162,39,.10); border: 1px solid rgba(201,162,39,.3); border-radius: var(--r-sm); text-decoration: none !important; margin-top: 8px; }
.ac-newslink:active { opacity: .8; }
/* Pätička s právnymi odkazmi */
.appfoot { text-align:center; padding:26px 16px 40px; color:var(--muted); font-size:12.5px; border-top:1px solid var(--line); margin-top:30px; }
.appfoot a { color:var(--accent-2); text-decoration:none; font-weight:600; }
.appfoot a:hover { text-decoration:underline; }
.appfoot .ft-sep { margin:0 8px; opacity:.5; }
.appfoot .ft-co { margin-top:8px; font-size:11px; opacity:.7; }
body.lbopen .appfoot { display:none; }
/* ============================================================
✨ LUXE — JEDNOTNÝ VZHĽAD OKIEN (modálov)
Tmavý panel + zlatý rámik, serif tituly (ako logo), jemné
rozostrenie pozadia, rovnaká šírka. (bez !important na paneloch,
nech ostane jackpot-žiara kolesa)
============================================================ */
.vipgate, .wheelgate, .persogate, .refgate, .refwelcome, .acctgate {
background: rgba(8,7,12,.82);
-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.vg-panel, .pg-panel, .wg-panel, .rf-panel, .rw-panel, .ac-panel {
background: linear-gradient(180deg, #1b1822, #131119);
border: 1px solid rgba(201,162,39,.42);
border-radius: var(--r-lg);
box-shadow: 0 22px 64px rgba(0,0,0,.6);
max-width: 400px;
padding: 26px 22px;
}
/* tituly okien — serif (ako logo), teplé zlato, jednotná veľkosť */
.vg-title, .pg-title, .wg-title, .rf-title, .rw-title, .ac-title, .im-panel h3, .rvg-title {
font-family: var(--serif) !important;
font-weight: 700 !important;
font-size: 24px !important;
letter-spacing: .3px !important;
text-transform: none !important;
color: #f0e6c8 !important;
line-height: 1.2;
}
/* ✨ Úvodný splash — drží kým sa appka nenačíta, potom sa naraz odkryje (žiadne sekanie) */
#splash { position: fixed; inset: 0; z-index: 99999; background: #0c0d11; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; transition: opacity .45s ease; }
body.ready #splash { opacity: 0; pointer-events: none; }
#splash .sp-logo { font-family: var(--serif); font-size: clamp(30px, 9vw, 40px); font-weight: 600; letter-spacing: 6px; color: #f0e6c8; }
#splash .sp-sub { font-family: var(--serif); font-size: 14px; font-weight: 600; letter-spacing: 9px; color: var(--accent); margin-bottom: 20px; }
#splash .sp-bar { width: 150px; height: 2px; background: rgba(201,162,39,.16); border-radius: 2px; overflow: hidden; }
#splash .sp-bar span { display: block; height: 100%; width: 38%; background: linear-gradient(90deg, transparent, #e3c558, transparent); animation: spbar 1.05s ease-in-out infinite; }
@keyframes spbar { 0% { transform: translateX(-110%); } 100% { transform: translateX(320%); } }
/* ✨ Personalizácia konkrétnej kabelky (modál #persoProd) */
.pp-panel { max-width: 440px !important; text-align: left; }
.pp-bag { display: flex; align-items: center; gap: 12px; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: var(--r); padding: 10px; margin-bottom: 14px; }
.pp-bag img { width: 54px; height: 54px; object-fit: cover; border-radius: var(--r-sm); flex: 0 0 auto; }
.pp-bag-name { font-weight: 700; color: #fff; font-size: 14px; line-height: 1.25; }
.pp-bag-tag { margin-top: 5px; }
#persoProd .pg-title, #persoProd .pg-explain { text-align: center; }
.pp-types { display: flex; gap: 8px; margin: 4px 0 6px; }
.pp-type { flex: 1; padding: 12px 8px; border-radius: var(--r-sm); border: 1px solid rgba(201,162,39,.4); background: rgba(255,255,255,.04); color: var(--text); font-weight: 700; font-size: 14px; cursor: pointer; transition: .15s; }
.pp-type.on { background: linear-gradient(180deg,#ecd98a,var(--accent)); color: #1a1407; border-color: var(--accent); }
.pp-sect { margin-top: 4px; }
.pp-upload { display: block; text-align: center; padding: 14px; border: 1px dashed rgba(201,162,39,.5); border-radius: var(--r-sm); background: rgba(201,162,39,.06); color: var(--accent-2); font-weight: 700; cursor: pointer; margin-top: 9px; }
.pp-upload:hover { background: rgba(201,162,39,.12); }
.pp-preview { width: 100%; max-height: 200px; object-fit: contain; border-radius: var(--r-sm); margin-top: 9px; border: 1px solid var(--line); display: block; }
.pp-actions { margin-top: 14px; }
.pp-cart { width: 100%; margin-top: 9px; padding: 13px; border-radius: var(--r-sm); border: 1px solid rgba(201,162,39,.55); background: transparent; color: var(--accent-2); font-size: 14.5px; font-weight: 700; cursor: pointer; }
.pp-cart:hover { background: rgba(201,162,39,.1); }
.cr-perso { display: block; font-size: 12px; color: var(--accent-2); margin-top: 3px; }
.cr-price { display: block; margin-top: 6px; font-size: 15.5px; font-weight: 800; color: var(--accent-2); }
.cr-price s { font-size: 12.5px; margin-left: 2px; }
.cart-sum { margin-top: 16px; padding: 14px 16px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); }
.cart-sum-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 18px; font-weight: 800; color: #f0e6c8; }
.cart-sum-row .cart-sum-n { font-size: 13px; font-weight: 500; color: var(--muted); }
.cart-sum-note { margin-top: 7px; font-size: 12.5px; color: var(--muted); text-align: right; }
/* tlačidlo „Personalizovať" v lightboxe */
.iconbtn.perso { color: #1a1407; background: linear-gradient(180deg,#ecd98a,var(--accent)); border-color: var(--accent); }
.pp-type[hidden], .lbpersofab[hidden] { display: none !important; }
/* Hermès paleta farieb na zákazku */
.pp-color-h { font-size: 13px; color: var(--accent-2); font-weight: 700; margin: 10px 0 8px; }
.pp-colorgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 8px; }
.pp-sw { position: relative; aspect-ratio: 1/1; border-radius: var(--r-sm); border: 2px solid rgba(255,255,255,.16); background: var(--sw); cursor: pointer; padding: 0; transition: transform .12s; }
.pp-sw:hover { transform: scale(1.05); }
.pp-sw .pp-sw-no { position: absolute; bottom: 2px; right: 4px; font-size: 9px; font-weight: 800; color: rgba(255,255,255,.9); text-shadow: 0 1px 2px rgba(0,0,0,.75); }
.pp-sw.on { outline: 3px solid #e3c558; outline-offset: 1px; border-color: #fff; transform: scale(1.06); }
.pp-colorpick { margin-top: 11px; font-weight: 700; color: #f0e6c8; font-size: 14px; min-height: 18px; }
.pp-color-note { margin-top: 6px; font-size: 11.5px; color: var(--muted); }
/* plávajúce tlačidlo personalizácie v lightboxe (výrazné, viditeľné) */
.lbpersofab { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(160px + env(safe-area-inset-bottom)); z-index: 130; display: inline-flex; align-items: center; gap: 7px; max-width: calc(100vw - 100px); padding: 12px 20px; border: none; border-radius: var(--r-pill); cursor: pointer; font-size: 14.5px; font-weight: 800; white-space: nowrap; color: #1a1407; background: linear-gradient(180deg,#ecd98a,var(--accent)); box-shadow: 0 8px 26px rgba(201,162,39,.5); animation: lpfpulse 2.4s ease-in-out infinite; }
.lbpersofab .lpf-ic { font-size: 16px; }
@keyframes lpfpulse { 0%,100% { box-shadow: 0 8px 24px rgba(201,162,39,.42); } 50% { box-shadow: 0 12px 34px rgba(201,162,39,.72); } }
/* ============================================================
✦ LUXURY CALM — pokojný prémiový dojem
Dekoratívne nekonečné animácie (točenie ikon, shine sweep,
pulz, ›››, kývanie) sa neutralizujú prepísaním ich @keyframes
na prázdne — posledná definícia v dokumente vyhráva, takže
nemusíme loviť každý selektor. Funkčné animácie ostávajú:
WhatsApp pulz, koleso šťastia, drop odpočet, vstupné prechody,
môj skeleton (skel) aj lpfpulse CTA.
============================================================ */
@keyframes vipshine {}
@keyframes icoSpin {}
@keyframes icoPulse {}
@keyframes icoSway {}
@keyframes icoFlip {}
@keyframes ctaSlide {}
@keyframes instpulse {}
@keyframes instwiggle {}
@keyframes cartpulse {}
@keyframes discshine {}
@keyframes cueBounce {}
@keyframes wbspin {}
/* ››› → pokojné jediné › */
.hometiles [class$="-go"]::after { opacity: .85 !important; transform: none !important; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
/* Most Skladom → Shopping Room (CTA na konci sekcie Skladom) */
.stock2sr { grid-column: 1 / -1; width: 100%; box-sizing: border-box; margin: 22px 0 8px; padding: 20px 16px; border-radius: var(--r); text-align: center; background: linear-gradient(135deg, #1b1822, #131119); border: 1px solid rgba(201,162,39,.42); }
.stock2sr .s2s-txt { color: #f0e6c8; font-size: 15.5px; line-height: 1.5; margin-bottom: 14px; }
.stock2sr .s2s-btn { background: linear-gradient(135deg, #e8c860, var(--accent)); color: #1a1205; border: none; border-radius: var(--r-sm); padding: 13px 26px; font-weight: 800; font-size: 15px; cursor: pointer; }
.stock2sr .s2s-btn:active { transform: scale(.97); }
/* Výber veľkosti v detaile produktu */
.lbi-sizes { display:block; }
.lbi-sizes .lbi-sztit { font-size:13.5px; color:var(--muted,#9a93a6); margin-bottom:7px; }
.szchips { display:flex; flex-wrap:wrap; gap:8px; }
.szchip { min-width:46px; padding:9px 12px; border-radius:var(--r-sm); border:1.5px solid rgba(201,162,39,.45); background:rgba(201,162,39,.07); color:#f0e6c8; font-size:14px; font-weight:700; cursor:pointer; transition:all .12s; }
.szchip:hover { background:rgba(201,162,39,.16); }
.szchip.on { background:linear-gradient(135deg,#e8c860,var(--accent)); color:#1a1205; border-color:#e8c860; }
/* zvýraznenie keď treba vybrať veľkosť pred kúpou */
.szchips.needpick { animation: szshake .5s ease; }
.szchips.needpick .szchip { border-color:#e8c860; box-shadow:0 0 0 2px rgba(232,200,96,.35); }
@keyframes szshake { 0%,100%{transform:translateX(0)} 20%{transform:translateX(-6px)} 40%{transform:translateX(6px)} 60%{transform:translateX(-4px)} 80%{transform:translateX(4px)} }
/* Checkout + QR platba */
.cogate { position:fixed; inset:0; z-index:9500; background:rgba(8,7,12,.82); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:none; align-items:center; justify-content:center; padding:16px; }
.cogate.open { display:flex; }
.co-panel { position:relative; max-width:440px; width:100%; max-height:92vh; overflow-y:auto; background:linear-gradient(135deg,#1b1822,#131119); border:1px solid rgba(201,162,39,.42); border-radius:var(--r-lg); padding:24px 20px; }
/* ✕ musí byť POD výrezom iPhonu (safe-area) — v PWA režime ide panel až po horný okraj displeja */
.co-x { position:absolute; top:max(14px, calc(env(safe-area-inset-top, 0px) + 10px)); right:14px; width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(0,0,0,.35); color:#fff; font-size:16px; cursor:pointer; z-index:2; }
.co-title { color:#f0e6c8; font-size:22px; margin:0 0 14px; font-weight:700; }
.co-stepinfo { color:var(--accent); font-size:12.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; margin:-8px 0 12px; }
.co-trust { color:#b9b2a0; font-size:12.5px; margin:10px 0 0; text-align:center; }
.co-summary { margin-bottom:14px; }
.co-itm { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13.5px; color:#e8e2d0; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.06); }
.co-itm-l { display:flex; align-items:center; gap:10px; min-width:0; }
.co-itm-img { width:44px; height:56px; object-fit:contain; background:#0a0b0e; border-radius:var(--r-xs); flex:0 0 auto; }
.co-itm-nm { min-width:0; display:flex; flex-direction:column; gap:2px; }
.co-itm-sub { font-size:11.5px; color:var(--accent-2); }
.co-itm > b { flex:0 0 auto; white-space:nowrap; text-align:right; }
.co-itm.co-tot { border-bottom:none; font-size:16px; color:#f0e6c8; padding-top:10px; font-weight:700; }
.co-l { display:block; margin-bottom:10px; }
.co-l span { display:block; font-size:12.5px; color:#9a93a6; margin-bottom:4px; }
.co-l input, .co-l select { width:100%; box-sizing:border-box; padding:11px 12px; border-radius:var(--r-sm); border:1px solid #332e3d; background:#0e0d13; color:#fff; font-size:15px; }
.co-btn { width:100%; margin-top:8px; padding:13px; border:none; border-radius:var(--r-sm); background:linear-gradient(135deg,#e8c860,var(--accent)); color:#1a1205; font-weight:800; font-size:15px; cursor:pointer; }
.co-btn.co-ghost { background:transparent; border:1px solid rgba(201,162,39,.5); color:#f0e6c8; }
.co-btn.co-wa { background:#25d366; color:#fff; }
.co-msg { font-size:13px; color:#ffb3c0; margin-top:8px; text-align:center; }
.co-note { color:#e8e2d0; font-size:14px; line-height:1.5; margin:0 0 14px; text-align:center; }
.co-qr { display:flex; align-items:center; justify-content:center; min-height:180px; margin-bottom:14px; }
.co-qr img { width:300px; max-width:78vw; height:auto; border-radius:var(--r); background:#fff; padding:10px; }
/* === Výber zálohy (medzikrok pred platbou) === */
.co-deptotal { font-size:15px; color:#e8e2d0; margin:0 0 12px; text-align:center; }
.co-deptotal b { color:#f0e6c8; font-size:18px; }
.co-depopts { display:flex; flex-direction:column; gap:10px; }
.co-depopt { display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:14px; border-radius:var(--r); border:1.5px solid #332e3d; background:#0e0d13; color:#e8e2d0; cursor:pointer; transition:border-color .15s, background .15s; }
.co-depopt:hover { border-color:rgba(201,162,39,.5); }
.co-depopt.on { border-color:#e8c860; background:rgba(201,162,39,.1); }
.cdo-radio { flex:0 0 20px; width:20px; height:20px; border-radius:50%; border:2px solid #5a5466; position:relative; }
.co-depopt.on .cdo-radio { border-color:#e8c860; }
.co-depopt.on .cdo-radio::after { content:''; position:absolute; inset:3px; border-radius:50%; background:#e8c860; }
.cdo-mid { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.cdo-t { font-size:15px; font-weight:800; color:#f0e6c8; }
.cdo-sub { font-size:12.5px; color:#b9b2c4; line-height:1.4; }
.cdo-sub b { color:#f0e6c8; }
.cdo-badge { font-size:9.5px; font-weight:900; letter-spacing:.4px; color:#1a1205; background:linear-gradient(135deg,#e8c860,var(--accent)); padding:2px 7px; border-radius:var(--r-xs); vertical-align:middle; margin-left:4px; }
.co-depbest { border-color:rgba(201,162,39,.55); background:linear-gradient(135deg,rgba(201,162,39,.12),rgba(201,162,39,.04)); }
.co-deptrust { font-size:12.5px; color:#9a93a6; line-height:1.55; margin:14px 2px 4px; }
.co-depinfo { display:flex; flex-direction:column; gap:3px; padding:11px 13px; border-radius:var(--r-sm); background:rgba(201,162,39,.1); border:1px solid rgba(201,162,39,.3); margin-bottom:14px; font-size:13.5px; color:#f0e6c8; }
.co-depinfo.co-depfull { background:linear-gradient(135deg,rgba(201,162,39,.16),rgba(201,162,39,.05)); }
.co-deplater { font-size:12px; color:#b9b2c4; line-height:1.45; }
.co-num { display:flex; justify-content:space-between; gap:10px; font-size:14px; color:#e8e2d0; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.06); align-items:center; }
.co-num b { color:#f0e6c8; word-break:break-all; text-align:right; }
/* samostatné kopírovanie každého platobného údaja (📋 vedľa neho) */
.co-num.co-cp { gap:8px; }
.co-num.co-cp > span { flex:0 0 auto; color:#bdb491; }
.co-num.co-cp > b { flex:1 1 auto; }
/* prirodzený copy gombík (ako v backoffice .cpico) — SVG ikona + text, hover zlatý, po kliku zelený */
.co-cpbtn { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; gap:6px; background:rgba(255,255,255,.04); color:#bdb491; border:1px solid rgba(201,162,39,.4); border-radius:var(--r-xs); padding:7px 11px; font-size:12.5px; font-weight:700; cursor:pointer; line-height:1; transition:border-color .15s, color .15s, background .15s, transform .1s; -webkit-tap-highlight-color:transparent; }
.co-cpbtn svg { width:15px; height:15px; flex:0 0 auto; }
.co-cpbtn:hover { border-color:var(--accent); color:var(--accent-2); background:rgba(201,162,39,.1); }
.co-cpbtn:active { transform:scale(.94); }
.co-cpbtn.done { border-color:#2dd47f; color:#2dd47f; background:rgba(45,212,127,.12); }
.co-cpbtn .co-cptxt { white-space:nowrap; }
@media (max-width:460px){ .co-cpbtn { padding:8px 9px; } .co-cpbtn .co-cptxt { display:none; } }
/* prepínač QR: SK/CZ ↔ EÚ/Nemecko */
.co-qrtabs { display:flex; gap:6px; margin-bottom:8px; }
.co-qrtab { flex:1; padding:8px; border-radius:var(--r-sm); border:1px solid rgba(201,162,39,.45); background:var(--panel-2); color:var(--accent-2); font-size:13px; font-weight:700; cursor:pointer; }
.co-qrtab.on { background:linear-gradient(180deg,var(--accent-2),var(--accent)); color:#1a1407; border-color:#ffe9a3; }
/* VS + suma zvýraznené (ľahšie párovanie platby) */
.co-num.co-big { background:rgba(201,162,39,.1); border:1px solid rgba(201,162,39,.4); border-radius:var(--r-sm); padding:10px 13px; margin-bottom:7px; border-bottom:1px solid rgba(201,162,39,.4); }
.co-num.co-big span { font-weight:600; }
.co-num.co-big b { font-size:26px; font-weight:900; color:#f5e6b0; letter-spacing:.5px; }
/* Sledovanie objednávky — kroky */
.trk-ono { text-align:center; font-size:20px; font-weight:800; color:#f0e6c8; margin-bottom:14px; letter-spacing:.5px; }
.trk-steps { display:flex; flex-direction:column; }
.trk-step { display:flex; align-items:center; gap:12px; padding:9px 0; color:#9a93a6; font-size:14px; }
.trk-step .trk-dot { flex:0 0 28px; height:28px; border-radius:50%; border:2px solid #332e3d; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; color:#9a93a6; background:#0e0d13; }
.trk-step.done { color:#e8e2d0; }
.trk-step.done .trk-dot { background:linear-gradient(135deg,#e8c860,var(--accent)); border-color:#e8c860; color:#1a1205; }
.trk-step.now { color:#f0e6c8; font-weight:700; }
.trk-step.now .trk-dot { box-shadow:0 0 0 4px rgba(201,162,39,.25); }
/* ===== Zjednotenie všetkých úvodných dlaždíc do jemného luxusného tónu (ako TOP Premium Quality) ===== */
/* krikľavé farebné gradienty (Recenzie/Koleso/Pozvi/Registrácia/Swipe) → tmavá + zlatý akcent */
.hometiles .reviewsbanner,
.hometiles .wheelbanner,
.hometiles .refbanner,
.hometiles .acctbanner,
.hometiles .swipebanner {
background: linear-gradient(110deg, #1d1a10, #2a2516 55%, #16140c) !important;
border: 1px solid rgba(201,162,39,.45) !important;
color: #fff !important;
box-shadow: 0 8px 26px rgba(0,0,0,.4) !important;
}
.hometiles .rvb-title, .hometiles .wb-title, .hometiles .rb-title, .hometiles .ab-title, .hometiles .swb-title { color: #f0e6c8 !important; text-shadow: none !important; }
.hometiles .rvb-sub, .hometiles .wb-sub, .hometiles .rb-sub, .hometiles .ab-sub, .hometiles .swb-sub { color: var(--muted) !important; opacity: 1 !important; text-shadow: none !important; }
.hometiles .rvb-go, .hometiles .wb-go, .hometiles .rb-go, .hometiles .ab-go, .hometiles .swb-go { color: var(--accent-2) !important; }
/* jemný zlatý lesk namiesto farebného pruhu */
.hometiles .reviewsbanner::after, .hometiles .wheelbanner::after, .hometiles .refbanner::after, .hometiles .acctbanner::after, .hometiles .swipebanner::after {
background: linear-gradient(100deg, transparent, rgba(255,225,150,.14), transparent) !important;
}
/* ===== Sledovanie objednávky (modal) — dátum pri potvrdeniach + box s dodaním ===== */
.trk-steps .trk-step .trk-mid { display:flex; flex-direction:column; gap:1px; min-width:0; }
.trk-steps .trk-lbl2 { font-size:14px; line-height:1.2; }
.trk-steps .trk-date { font-size:11.5px; color:#8a8398; font-weight:500; }
.trk-steps .trk-step.done .trk-date { color:#b8ad8f; }
.trk-eta-box { margin-top:16px; font-size:13.5px; font-weight:600; color:#f0e6c8; text-align:center; background:linear-gradient(135deg,rgba(201,162,39,.14),rgba(201,162,39,.06)); border:1px solid rgba(201,162,39,.45); border-radius:var(--r-sm); padding:12px 14px; }
/* === Kontrola kvality: fotky JEJ kúsku + doplatok pod sledovaním === */
.trk-qc { margin-top:16px; padding:14px; border-radius:var(--r); background:rgba(45,212,167,.07); border:1px solid rgba(45,212,167,.32); }
.trk-qc-h { font-size:15px; font-weight:800; color:#7ff0c4; margin-bottom:10px; }
.trk-qc-grid { display:flex; gap:8px; overflow-x:auto; padding-bottom:5px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.trk-qc-grid a { flex:0 0 auto; scroll-snap-align:start; }
.trk-qc-grid img { width:104px; height:104px; object-fit:cover; border-radius:var(--r-sm); border:1px solid rgba(255,255,255,.12); display:block; }
.trk-qc-grid::-webkit-scrollbar { height:5px; } .trk-qc-grid::-webkit-scrollbar-thumb { background:rgba(45,212,167,.4); border-radius:3px; }
.trk-qc-note { font-size:12.5px; color:#b9b2c4; margin:10px 0 0; line-height:1.5; }
.trk-dop { margin-top:14px; padding:16px; border-radius:var(--r); background:linear-gradient(135deg,rgba(201,162,39,.13),rgba(201,162,39,.05)); border:1px solid rgba(201,162,39,.5); }
.trk-dop-h { font-size:17px; font-weight:800; color:#f0e6c8; }
.trk-dop-sub { font-size:13px; color:#cfc6b0; margin:4px 0 10px; line-height:1.5; }
.trk-dop-amt { font-size:15px; color:#e8e2d0; text-align:center; margin-bottom:12px; }
.trk-dop-amt b { font-size:24px; color:#f0e6c8; }
.trk-dop.done { font-size:14px; font-weight:600; color:#7ff0c4; text-align:center; line-height:1.5; background:rgba(45,212,167,.1); border-color:rgba(45,212,167,.4); }
/* ===== Promo tlačidlá (Skladom/Swipe/Personalizované) → TENKÝ vodorovný riadok nad značkami ===== */
.discrow { display:flex; gap:8px; margin-top:11px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:2px; }
.discrow::-webkit-scrollbar { display:none; }
.discrow .discbtn {
width:auto; flex:0 0 auto; margin-top:0; padding:9px 14px; font-size:13px; font-weight:700; border-radius:var(--r-sm); gap:6px; white-space:nowrap;
background:linear-gradient(110deg, #1d1a10, #2a2516 55%, #16140c); border:1px solid rgba(201,162,39,.4); color:#f0e6c8;
box-shadow:none; animation:none; background-size:auto;
}
.discrow .discbtn:hover { filter:brightness(1.1); }
.discrow .disc-ic { font-size:15px; }
/* prebije farebný gradient .persobtn (má !important) → tmavo-zlatý ako ostatné čipy */
.discrow .persobtn { background:linear-gradient(110deg, #1d1a10, #2a2516 55%, #16140c) !important; box-shadow:none !important; border:1px solid rgba(201,162,39,.4) !important; color:#f0e6c8 !important; }
/* ===== Odpočítavanie akcií na feede (hravé, motivujúce) ===== */
/* LUXUSNÝ akciový banner — kohézny dark-gold, súmerný (predtým miešal ružovú+zelenú = amaterské) */
.salebanner { max-width:1440px; margin:16px auto 6px; width:calc(100% - 32px); background:linear-gradient(135deg, #221a0c, #2c2110 55%, #1a140a); border:1.5px solid rgba(201,162,39,.7); border-radius:var(--r-lg); padding:16px 16px 18px; box-shadow:0 14px 36px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.05); animation:salebnrGlow 2.6s ease-in-out infinite; }
@keyframes salebnrGlow { 0%,100%{ box-shadow:0 14px 36px rgba(0,0,0,.5), 0 0 0 1px rgba(201,162,39,.25), 0 0 20px rgba(201,162,39,.10); } 50%{ box-shadow:0 14px 36px rgba(0,0,0,.5), 0 0 0 1px rgba(201,162,39,.55), 0 0 34px rgba(201,162,39,.34); } }
.salebanner .sale-h { font-size:17px; font-weight:900; color:#ffe7a8; letter-spacing:.4px; margin-bottom:13px; text-align:center; text-shadow:0 0 14px rgba(255,200,70,.25); }
.salebanner .sale-h .sale-h-ic { display:inline-block; font-size:19px; vertical-align:-2px; filter:drop-shadow(0 1px 3px rgba(201,162,39,.6)); animation:salehic 2s ease-in-out infinite; transform-origin:50% 45%; }
@keyframes salehic { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-14deg)} 75%{transform:rotate(14deg)} }
.salebanner .sale-row { display:flex; gap:10px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; justify-content:center; }
.salebanner .sale-row > .sale-card:only-child { flex:1 1 auto; max-width:520px; }
.salebanner .sale-row::-webkit-scrollbar { display:none; }
.sale-card { flex:0 0 auto; display:flex; align-items:center; gap:13px; background:linear-gradient(135deg, rgba(201,162,39,.10), rgba(0,0,0,.22)); border:1px solid rgba(201,162,39,.42); border-radius:var(--r); padding:11px 15px; cursor:pointer; color:#ece6d8; white-space:nowrap; transition:border-color .15s, transform .12s, box-shadow .15s; }
.sale-card:hover { border-color:var(--accent-2); transform:translateY(-1px); box-shadow:0 7px 20px rgba(201,162,39,.26); }
.sale-pct { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; min-width:50px; height:50px; font-size:17px; font-weight:900; color:#2a1d02; background:linear-gradient(180deg,#f6dd8a 0%,#e6c462 46%,#cda233 100%); border-radius:var(--r-sm); padding:0 9px; box-shadow:0 3px 11px rgba(201,162,39,.42), inset 0 1px 0 rgba(255,255,255,.45); text-shadow:0 1px 0 rgba(255,255,255,.25); }
@keyframes salepulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.05)} }
.sale-mid { display:flex; flex-direction:column; gap:2px; min-width:0; }
.sale-what { font-size:16px; font-weight:800; color:#f6eeda; }
.sale-left { display:flex; flex-direction:column; gap:0; font-size:11px; color:#cbb98f; margin-top:4px; }
.sale-left .sale-ends { font-size:10px; letter-spacing:.9px; text-transform:uppercase; color:#cbb98f; font-weight:800; }
.sale-left b { font-variant-numeric:tabular-nums; font-size:24px; font-weight:900; line-height:1.04; color:#ffd86b; letter-spacing:.6px; text-shadow:0 0 16px rgba(255,200,70,.55); }
.sale-left.live { flex-direction:row; align-items:center; gap:6px; }
.sale-left.live .sale-ends { color:#ff5b7a; font-size:16px; font-weight:900; text-transform:none; letter-spacing:0; animation:salepulse 1.1s ease-in-out infinite; }
.sale-go { flex:0 0 auto; margin-left:auto; width:36px; height:36px; border-radius:50%; background:linear-gradient(180deg,#f6dd8a,#cda233); color:#1a1205; font-size:21px; font-weight:900; display:inline-flex; align-items:center; justify-content:center; box-shadow:0 3px 12px rgba(201,162,39,.55), inset 0 1px 0 rgba(255,255,255,.45); }
/* 🎁 multi-buy „1+1" — rovnaký luxusný zlatý štýl (žiadna zelená) */
.sale-card.bundle { border-color:rgba(201,162,39,.55); background:linear-gradient(135deg, rgba(201,162,39,.17), rgba(0,0,0,.22)); }
.sale-card.bundle .sale-pct.gift { flex-direction:column; min-width:50px; height:50px; font-size:12.5px; line-height:1.05; text-align:center; background:linear-gradient(180deg,#f6dd8a 0%,#e6c462 46%,#cda233 100%); color:#2a1d02; box-shadow:0 3px 11px rgba(201,162,39,.45), inset 0 1px 0 rgba(255,255,255,.45); }
.sale-card.bundle .sale-what { font-size:19px; font-weight:900; color:#ffe7a8; letter-spacing:.3px; text-shadow:0 0 11px rgba(255,200,70,.22); }
.sale-sub { font-size:13px; color:#e8dcc0; font-weight:700; }
/* odpočet platnosti vyhraného kódu kolesa (24 h) */
.wg-cd { display:inline-block; margin-top:9px; font-size:14px; color:#ffd9e6; background:rgba(224,69,127,.16); border:1px solid rgba(236,120,160,.5); border-radius:var(--r-sm); padding:7px 12px; }
.wg-cd b { color:#ffe08a; font-variant-numeric:tabular-nums; font-weight:900; font-size:16px; }
/* zľavový kód v checkoute */
.co-coderow { display:flex; gap:10px; align-items:stretch; }
.co-coderow input { flex:1; min-width:0; }
.co-codebtn { flex:0 0 auto; padding:0 24px; min-height:46px; border-radius:var(--r-sm); border:none; background:linear-gradient(135deg,#e8c860,var(--accent)); color:#1a1205; font-weight:800; font-size:14px; letter-spacing:.3px; cursor:pointer; white-space:nowrap; box-shadow:0 4px 14px rgba(201,162,39,.35); transition:transform .1s, filter .15s; -webkit-tap-highlight-color:transparent; }
.co-codebtn:hover { filter:brightness(1.06); transform:translateY(-1px); }
.co-codebtn:active { transform:scale(.97); }
.co-codemsg { font-size:12.5px; margin:6px 0 2px; min-height:16px; line-height:1.3; }
.co-codemsg.ok { color:#3ddc8c; } .co-codemsg.err { color:#e0455f; }
/* ===== HORNÁ LIŠTA — všetky gombíky JEDNOTNE: tmavé pozadie + ZLATÝ RÁMČEK (ako Foto/Zdieľať/Appka) ===== */
.cartheadbtn, .notifbtn {
background: linear-gradient(180deg, rgba(201,162,39,.15), rgba(201,162,39,.04)) !important;
color: var(--accent-2) !important; border: 1px solid rgba(201,162,39,.5) !important; box-shadow: none !important;
}
.langsel, .controls #sort {
background: url('data:image/svg+xml;utf8,') no-repeat right 12px center, var(--panel-2) !important;
background-size: 11px, auto !important;
color: var(--text) !important; border: 1px solid rgba(201,162,39,.5) !important; box-shadow: none !important;
}
/* odznak počtu v košíku: zlatý pill s tmavým číslom → vidno ho na tmavej dlaždici */
.cartheadbtn .ch-badge, .cartheadbtn.has .ch-badge { background: linear-gradient(180deg,var(--accent-2),var(--accent)) !important; color: #1a1407 !important; }
/* zvonček ostáva čitateľný */
.notifbtn .nb-bell { filter: none !important; }
/* 🎁 Pop-up akcia „šperk zadarmo ku kabelke" */
.giftpop { position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(8,9,13,.80); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); opacity:0; transition:opacity .25s; }
.giftpop.open { opacity:1; }
.giftpop[hidden] { display:none; }
.giftpop-panel { width:100%; max-width:382px; background:linear-gradient(180deg,#171922,#0f1117); border:1px solid rgba(201,162,39,.55); border-radius:var(--r-lg); padding:26px 22px 18px; text-align:center; box-shadow:0 24px 70px rgba(0,0,0,.6); transform:translateY(14px) scale(.97); transition:transform .3s cubic-bezier(.2,.8,.2,1); }
.giftpop.open .giftpop-panel { transform:none; }
.giftpop-emoji { font-size:46px; line-height:1; margin-bottom:6px; }
.giftpop-title { margin:4px 0 10px; font-size:21px; font-weight:800; color:var(--accent-2,#f0d894); }
.giftpop-body { margin:0 0 18px; font-size:14.5px; line-height:1.55; color:var(--text,#e9e7e2); }
.giftpop-body b { color:#3ddc8c; }
.giftpop-reg { display:block; width:100%; padding:13px; border:none; border-radius:var(--r-sm); font-size:15px; font-weight:800; cursor:pointer; background:linear-gradient(180deg,var(--accent-2,#e7c75b),var(--accent,var(--accent))); color:#1a1205; box-shadow:0 6px 18px rgba(201,162,39,.32); }
.giftpop-reg:active { transform:translateY(1px); }
.giftpop-ok { display:block; width:100%; margin-top:9px; padding:11px; border:1px solid var(--line,#2a2d36); border-radius:var(--r-sm); background:transparent; color:var(--muted,#9a9aa2); font-size:13.5px; cursor:pointer; }
/* 🎁 hint v košíku */
.cart-gift-hint { margin:10px 0; padding:10px 12px; border-radius:var(--r-sm); background:rgba(61,220,140,.12); border:1px solid rgba(61,220,140,.42); color:#3ddc8c; font-size:13px; font-weight:700; text-align:center; }
.cart-gift-hint[hidden] { display:none; }
/* 🎁 REGISTRAČNÝ DARČEK v košíku — progres / vybrať / aktívny */
.cart-gift-hint .gh-txt { display:inline; }
.cart-gift-hint.gh-progress, .cart-gift-hint.gh-pick { display:flex; flex-direction:column; align-items:center; gap:7px; background:rgba(201,162,39,.12); border-color:rgba(201,162,39,.45); color:var(--accent-2,#e6d4a0); }
.cart-gift-hint.gh-active { background:rgba(61,220,140,.15); border-color:rgba(61,220,140,.5); color:#3ddc8c; }
.cart-gift-hint .gh-bar { width:100%; max-width:320px; height:8px; border-radius:var(--r-pill); background:rgba(255,255,255,.10); overflow:hidden; }
.cart-gift-hint .gh-bar > i { display:block; height:100%; border-radius:var(--r-pill); background:linear-gradient(90deg,var(--accent),var(--accent-2,#e6d4a0)); transition:width .45s cubic-bezier(.2,.9,.25,1); box-shadow:0 0 8px rgba(201,162,39,.55); }
.cart-gift-hint .gh-sub { font-size:11px; font-weight:600; opacity:.85; }
.cart-gift-hint .gh-shopjewel { margin-top:2px; padding:8px 16px; border:none; cursor:pointer; border-radius:var(--r-pill); font-size:12.5px; font-weight:800; color:#2a1c04; background:linear-gradient(180deg,var(--accent-2,#ffe28c),var(--accent,#e6b23a)); box-shadow:0 3px 12px rgba(201,162,39,.42); }
html.light .cart-gift-hint.gh-progress, html.light .cart-gift-hint.gh-pick { color:#7c6210; }
html.light .cart-gift-hint .gh-bar { background:rgba(0,0,0,.08); }
/* ===== FAQ + Reklamačný poriadok (modál — bottom sheet) ===== */
.faqgate { position:fixed; inset:0; z-index:9998; display:flex; align-items:flex-end; justify-content:center; background:rgba(8,9,13,.78); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); opacity:0; pointer-events:none; transition:opacity .28s; }
.faqgate.open { opacity:1; pointer-events:auto; }
.faq-panel { position:relative; width:100%; max-width:640px; max-height:92vh; display:flex; flex-direction:column; background:linear-gradient(180deg,#15161d,#0f1014); border:1px solid rgba(201,162,39,.4); border-bottom:none; border-radius:var(--r-lg) var(--r-lg) 0 0; box-shadow:0 -10px 50px rgba(0,0,0,.6); transform:translateY(100%); transition:transform .32s cubic-bezier(.2,.8,.2,1); padding-bottom:calc(10px + env(safe-area-inset-bottom)); }
.faqgate.open .faq-panel { transform:none; }
@media (min-width:700px){ .faqgate { align-items:center; } .faq-panel { border-radius:var(--r-lg); border-bottom:1px solid rgba(201,162,39,.4); } }
.faq-x { position:absolute; top:12px; right:14px; z-index:2; width:34px; height:34px; border-radius:50%; border:1px solid var(--line-2); background:rgba(255,255,255,.05); color:var(--text); font-size:15px; cursor:pointer; }
.faq-head { padding:22px 20px 12px; text-align:center; }
.faq-title { margin:0; font-family:var(--serif); font-size:23px; font-weight:700; letter-spacing:.5px; color:var(--accent-2); }
.faq-sub { margin:5px 0 0; font-size:13px; color:#aeb2c0; }
.faq-tabs { display:flex; gap:8px; padding:0 18px 14px; }
.faq-tab { flex:1 1 0; min-width:0; padding:10px 8px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--panel-2); color:var(--accent-2); font-size:12.5px; font-weight:800; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:background .15s,border-color .15s; }
.faq-tab.active { background:linear-gradient(180deg,var(--accent-2),var(--accent)); color:#1a1205; border-color:var(--accent); }
.faq-body { flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:0 16px 6px; }
.faq-item { border:1px solid rgba(201,162,39,.18); border-radius:var(--r); margin-bottom:9px; overflow:hidden; background:rgba(201,162,39,.03); }
.faq-q { width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 15px; background:none; border:none; color:var(--text); font-size:14.5px; font-weight:700; text-align:left; cursor:pointer; line-height:1.35; }
.faq-ch { flex:0 0 auto; width:24px; height:24px; border-radius:50%; background:rgba(201,162,39,.14); color:var(--accent-2); font-size:18px; font-weight:700; display:grid; place-items:center; }
.faq-a { max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-item.open .faq-a { max-height:360px; }
.faq-item.open .faq-q { color:var(--accent-2); }
.faq-a p { margin:0; padding:0 15px 15px; font-size:13.5px; line-height:1.6; color:#cdd2de; }
.faq-pol { margin-bottom:16px; }
.faq-pol h4 { margin:0 0 5px; font-size:14.5px; font-weight:800; color:var(--accent-2); display:flex; align-items:center; gap:8px; }
.faq-pol h4::before { content:""; flex:0 0 auto; width:6px; height:6px; border-radius:50%; background:var(--accent); }
.faq-pol p { margin:0; font-size:13.5px; line-height:1.6; color:#cdd2de; }
.faq-contact { padding:14px 18px 2px; border-top:1px solid rgba(201,162,39,.16); margin-top:2px; }
.faq-chint { font-size:12.5px; color:#aeb2c0; text-align:center; margin-bottom:10px; }
.faq-cbtns { display:flex; gap:10px; }
.faq-cbtn { flex:1 1 0; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:12px; border-radius:var(--r-sm); font-size:14px; font-weight:800; text-decoration:none; }
.faq-cbtn .e3d { width:19px; height:19px; }
.faq-cbtn.wa { background:linear-gradient(180deg,#3ddc8c,#1faa63); color:#06281d; }
.faq-cbtn.ig { background:linear-gradient(180deg,#2a2230,#1a1622); color:#f0d894; border:1px solid rgba(201,162,39,.4); }
.faq-revlink { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; margin:11px 0 2px; padding:8px; background:none; border:none; color:var(--accent-2); font-size:13px; font-weight:700; cursor:pointer; }
.faq-revlink .e3d { width:15px; height:15px; }
.faq-revlink:hover { text-decoration:underline; }
/* ===== JEDNOTNÉ DLAŽDICE v menu — PRESNE rovnaká veľkosť + jednotný prémiový vzhľad (veľká „Akcia/countdown" ostáva, nie je .albumbanner) ===== */
.albumbanner, .vipbanner, .wheelbanner, .swipebanner, .reviewsbanner, .refbanner, .acctbanner, .passbanner {
height: 92px !important; min-height: 92px !important; padding: 0 16px !important; margin: 0 auto 11px !important; border-radius: var(--r) !important; box-sizing: border-box !important; overflow: hidden;
}
/* zjednoť pozadie persobanner (preč fialový nádych) → ladí s ostatnými */
.albumbanner.persobanner { background: linear-gradient(110deg,#1d1a10,#2a2516 55%,#16140c) !important; }
/* stredný stĺpec nepretečie; nadpis max 2 riadky, podnadpis max 2 riadky → výška ostáva konzistentná */
.alb-mid, .vb-mid, .wb-mid, .swb-mid, .rvb-mid, .ab-mid { min-width: 0; overflow: hidden; }
.alb-title, .vb-title, .wb-title, .swb-title, .rvb-title, .ab-title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.2; }
.alb-sub, .vb-sub, .wb-sub, .swb-sub, .rvb-sub, .ab-sub { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.3; }
/* ===== „NAŠE PRODUKTY" hero — jeden vstup do obchodu (len na home; v shope sú už taby) ===== */
.shop-hero { display:none; }
body.athome .shop-hero { display:flex; }
/* Akcia/countdown = home-promo: v sekciách ju skry, nech produktové taby ostanú hore */
body:not(.athome) #saleBanner { display:none !important; }
.shop-hero { position:relative; align-items:center; justify-content:space-between; gap:12px; width:calc(100% - 36px); max-width:1440px; margin:6px auto 10px; padding:18px; border-radius:var(--r-lg); cursor:pointer; text-align:left; overflow:hidden; border:1px solid rgba(201,162,39,.5); background:linear-gradient(115deg,#1c1305 0%,#2c2008 45%,#14100a 100%); background-size:cover; background-position:center; box-shadow:0 10px 30px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,215,130,.06); }
.shop-hero::after { content:""; position:absolute; inset:0; background:radial-gradient(120% 100% at 100% 0, rgba(201,162,39,.18), transparent 60%); pointer-events:none; }
/* fotka „Naše produkty" ako pozadie hero — vyššia, s prechodom pre čitateľný text vľavo */
.shop-hero.has-photo { background-image:url('media/shop-hero.jpg?v=3'); min-height:150px; align-items:flex-end; padding:16px 18px; }
.shop-hero.has-photo::before { content:""; position:absolute; inset:0; pointer-events:none;
background:linear-gradient(90deg, rgba(8,7,4,.88) 0%, rgba(8,7,4,.55) 42%, rgba(8,7,4,.12) 100%), linear-gradient(0deg, rgba(8,7,4,.55), transparent 55%); }
.shop-hero.has-photo .sh-title { font-size:26px; letter-spacing:2.5px; }
@media (max-width:700px){ .shop-hero.has-photo { min-height:138px; } .shop-hero.has-photo .sh-title { font-size:22px; } }
.shop-hero .sh-txt { position:relative; z-index:1; display:flex; flex-direction:column; gap:3px; }
.shop-hero .sh-title { font-family:var(--serif); font-size:24px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--accent-2); text-shadow:0 1px 6px rgba(0,0,0,.5); }
.shop-hero .sh-sub { font-size:12.5px; color:#d8caa0; text-shadow:0 1px 4px rgba(0,0,0,.5); }
.shop-hero .sh-go { position:relative; z-index:1; flex:0 0 auto; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; font-size:22px; color:#1a1205; background:linear-gradient(180deg,var(--accent-2),var(--accent)); font-weight:700; box-shadow:0 4px 14px rgba(201,162,39,.4); }
.shop-hero:hover { filter:brightness(1.06); }
@media (max-width:700px){ .shop-hero { width:calc(100% - 24px); padding:16px; margin:6px auto 8px; } .shop-hero .sh-title { font-size:21px; } }
/* Karta značky s fotkou na pozadí (riadené z backoffice) — tmavý prekryv → čitateľný názov */
.ltile.has-img { position:relative; background-size:cover; background-position:center; }
.ltile.has-img::after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; z-index:0;
background:linear-gradient(180deg, rgba(8,7,4,.38) 0%, rgba(8,7,4,.42) 45%, rgba(8,7,4,.68) 100%); }
.ltile.has-img .lg { position:relative; z-index:1; } /* celý blok (názov+čiara+pohlavie+počet) vycentrovaný nad fotkou — rovnako ako bez fotky */
.ltile.has-img .lg-count { color:#fff; } /* na fotke biele číslo nech vynikne */
.ltile.has-img .lg-name, .ltile.has-img .lg-sub, .ltile.has-img .lg-count { text-shadow:0 1px 10px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.7); }
/* ===== Čierno-zlaté prémiové pozadie na VŠETKY dlaždice hlavného feedu (2026-06-29) ===== */
/* NAŠE PRODUKTY (#shopHero) má vlastnú fotku → zámerne NIE je v tomto pravidle. */
/* ID selektor (#homeTiles) prebije všetky per-class pozadia bez !important vojny. */
#homeTiles > button,
#saleBanner {
background-image: linear-gradient(rgba(8,7,4,.50), rgba(8,7,4,.64)), url('media/feed-bg.jpg?v=1') !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
border-color: rgba(201,162,39,.45) !important;
}
/* drobné zjednotenie: zlaté „›" a text ostávajú čitateľné (už majú text-shadow) */
#homeTiles > button .alb-go, #homeTiles > button [class$="-go"] { color: #ffe9c7; }
/* ===== DESKTOP hlavička — zjednotenie ovládacích tlačidiel (2026-06-29) =====
Len desktop (min-width:701px) → MOBIL (max-width:700px blok) sa NEMENÍ.
Fix: rôzne výšky (40/42/43/38) + „Zvuk" bol 42px štvorec s pretekajúcim textom. */
@media (min-width: 701px) {
.controls { gap: 9px; align-items: center; }
/* spoločná výška + zaoblenie + font pre celý rad (vrátane hľadania) */
.controls .cartheadbtn,
.controls .photobtn,
.controls .notifbtn,
.controls .instbtn,
.controls #search,
.controls .langsel {
height: 40px;
box-sizing: border-box;
border-radius: var(--r-sm);
font-size: 14px;
}
/* tlačidlá = vždy vodorovne vycentrovaná ikona + text */
.controls .cartheadbtn,
.controls .photobtn,
.controls .notifbtn,
.controls .instbtn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 7px;
padding: 0 14px;
line-height: 1;
white-space: nowrap;
width: auto;
}
/* „Zvuk" (notifBtn): plnohodnotný pill, nie 42px štvorec; menší font nech text sadne */
.controls .notifbtn { font-size: 14px; }
.controls .notifbtn .nb-bell { display: inline-flex; align-items: center; line-height: 1; }
.controls .notifbtn .pt { display: inline; }
/* jednotná veľkosť ikon vo všetkých tlačidlách */
.controls .cartheadbtn .e3d,
.controls .photobtn .e3d,
.controls .notifbtn .e3d,
.controls .instbtn .e3d { width: 20px; height: 20px; vertical-align: middle; }
/* hľadanie zarovnané s tlačidlami */
.controls #search { padding: 0 14px; }
}
/* 💬 Kúsky bez ceny — WhatsApp dopyt namiesto kúpy (cena na vyžiadanie) */
.cardbuy.cardbuy-wa, .lbi-fastbuy.lbi-wa { background: linear-gradient(180deg,#25b95e,#12924a) !important; color: #fff !important; box-shadow: 0 4px 14px rgba(18,146,74,.34) !important; }
.cardbuy.cardbuy-wa:hover, .lbi-fastbuy.lbi-wa:hover { filter: brightness(1.06); }
/* 📸 Instagram nick (povinný) + nahranie screenshotu v objednávke */
.co-ighint { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:-2px 0 6px; font-size:12px; color:var(--muted); line-height:1.35; }
.co-ighint > span:first-child { flex:1 1 100%; }
.co-igup { cursor:pointer; }
.co-igup > span { display:inline-flex; align-items:center; gap:5px; padding:6px 11px; border:1px solid rgba(201,162,39,.5); border-radius:var(--r-pill); color:var(--accent-2); background:rgba(201,162,39,.08); font-weight:700; white-space:nowrap; }
.co-igup > span:hover { background:rgba(201,162,39,.16); }
.co-igstatus { font-size:12px; font-weight:600; }
.co-igstatus.ok { color:#3ddc8c; }
.co-igstatus.err { color:#e0455f; }
.co-l textarea { width:100%; box-sizing:border-box; padding:11px 12px; border-radius:var(--r-sm); border:1px solid #332e3d; background:#0e0d13; color:#fff; font-size:15px; min-height:54px; line-height:1.4; }
.co-igskip { display:flex; align-items:center; gap:9px; margin:0 0 8px; font-size:13px; color:var(--muted); cursor:pointer; user-select:none; }
.co-igskip input { width:18px; height:18px; accent-color:var(--accent); flex:0 0 auto; margin:0; }
.co-proof { margin:12px 0 8px; padding:12px 14px; border:1px dashed rgba(201,162,39,.5); border-radius:var(--r-sm); background:rgba(201,162,39,.06); text-align:center; }
.co-proof-t { font-size:13px; color:var(--accent-2); font-weight:600; margin-bottom:9px; line-height:1.4; }
.co-proof-btn > span { padding:9px 16px; }
/* ===== Hero banner sekcie/kategórie (foto + názov, ako NAŠE PRODUKTY) — zobrazí sa len keď má sekcia fotku ===== */
.sec-hero { position:relative; display:flex; align-items:flex-end; width:calc(100% - 36px); max-width:1440px; margin:10px auto 8px; padding:16px 18px; min-height:132px; border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(201,162,39,.5); background-size:cover; background-position:center; box-shadow:0 10px 30px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,215,130,.06); }
.sec-hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,7,4,.72), rgba(8,7,4,.18) 55%, transparent), radial-gradient(120% 100% at 100% 0, rgba(201,162,39,.16), transparent 60%); pointer-events:none; }
.sec-hero .sh-title { position:relative; z-index:1; font-family:var(--serif); font-size:clamp(22px,5.2vw,34px); font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:#fff; text-shadow:0 1px 10px rgba(0,0,0,.85), 0 0 3px rgba(0,0,0,.6); line-height:1.1; }
.sec-hero[hidden] { display:none; }
@media (max-width:700px){ .sec-hero { min-height:112px; padding:14px 16px; } }
/* CLS fix: IG/FB in-app banner sa zobrazí už pred prvým vykreslením (trieda show-igbanner z ), nečaká na JS → žiadny posun */
body.show-igbanner #igBanner[hidden] { display: flex !important; }
/* 🎨 Výber prevedenia/variantu (fotky = farby) — čísla 1..X v detaile, štýl ako veľkosti */
.lbi-variants .lbi-sztit { margin-bottom: 6px; }
.vchips { display: flex; flex-wrap: wrap; gap: 8px; }
.vchip { min-width: 40px; padding: 9px 13px; border-radius: var(--r-sm); border: 1.5px solid rgba(201,162,39,.45); background: rgba(201,162,39,.07); color: #f0e6c8; font-size: 14px; font-weight: 800; cursor: pointer; transition: all .12s; font-variant-numeric: tabular-nums; }
.vchip:hover { background: rgba(201,162,39,.16); }
.vchip.on { background: linear-gradient(135deg,#e8c860,var(--accent)); color: #1a1205; border-color: #e8c860; }
/* ⚡ BLESKOVKA — flash akcia v countdown banneri (výraznejšia ako bežné zľavy) */
.sale-card.flash { border-color: rgba(255,90,70,.7); background: linear-gradient(135deg, rgba(255,70,60,.20), rgba(201,162,39,.16) 60%, rgba(0,0,0,.25)); box-shadow: 0 6px 22px rgba(255,80,60,.28); animation: flashpulse 2.4s ease-in-out infinite; }
.sale-card.flash .sale-what { font-size: 18px; font-weight: 900; color: #ffe7a8; letter-spacing: .2px; text-shadow: 0 0 12px rgba(255,150,70,.3); }
.sale-pct.flashpct { flex-direction: column; min-width: 50px; height: 50px; font-size: 14px; line-height: 1.04; text-align: center; color: #fff; background: linear-gradient(180deg,#ff6a4d 0%,#e23b3b 100%); box-shadow: 0 3px 12px rgba(226,59,59,.5), inset 0 1px 0 rgba(255,255,255,.35); text-shadow: 0 1px 2px rgba(0,0,0,.3); }
@keyframes flashpulse { 0%,100% { box-shadow: 0 6px 22px rgba(255,80,60,.22); } 50% { box-shadow: 0 6px 30px rgba(255,80,60,.5); } }
@media (prefers-reduced-motion: reduce) { .sale-card.flash { animation: none; } }
/* ⚡ BLESKOVKA — samostatný širokoplošný banner (prerobené 2026-06-30) */
.flashban { position:relative; width:calc(100% - 36px); max-width:1440px; margin:6px auto 12px; border-radius:var(--r-lg); overflow:hidden; cursor:pointer; border:1px solid rgba(255,95,70,.55); background:linear-gradient(135deg,#1c1206 0%,#2a1606 55%,#120a05 100%); background-size:cover; background-position:center; box-shadow:0 14px 38px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,180,120,.06); }
.flashban.live { border-color:rgba(255,95,70,.85); animation:flashpulse 2.6s ease-in-out infinite; }
.flashban::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(130% 130% at 82% 0, rgba(255,120,60,.22), transparent 55%), linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.5)); }
.flashban.has-img::after { background:linear-gradient(180deg, rgba(8,6,4,.40), rgba(8,6,4,.66)); }
.flashban-in { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:7px; padding:20px 18px 22px; }
.flashban-badge { font-size:11.5px; font-weight:900; letter-spacing:2.5px; color:#fff; background:linear-gradient(180deg,#ff7a4d,#e23b3b); padding:5px 15px; border-radius:var(--r-pill); box-shadow:0 3px 13px rgba(226,59,59,.5); }
.flashban-title { font-family:var(--serif); font-size:clamp(26px,7.4vw,38px); font-weight:800; letter-spacing:3px; text-transform:uppercase; color:#ffe7a8; text-shadow:0 2px 16px rgba(255,150,70,.4); line-height:1.02; }
.flashban-sub { font-size:15.5px; font-weight:600; color:#fff; opacity:.96; }
.flashban-sub b { color:#ffd54a; font-weight:900; font-size:18px; }
.flashban-gift { font-size:13.5px; font-weight:700; color:#ffe1b0; }
.flashban-cd { display:flex; flex-direction:column; align-items:center; gap:3px; margin-top:7px; }
.fb-lbl { font-size:11px; font-weight:800; letter-spacing:2.5px; color:#e9c98a; text-transform:uppercase; }
.fb-time b { font-family:var(--sans); font-size:clamp(34px,11vw,46px); font-weight:900; letter-spacing:1px; color:#ffd54a; font-variant-numeric:tabular-nums; line-height:1; text-shadow:0 3px 18px rgba(255,180,40,.45); }
.flashban.live .fb-time b { color:#ff7a4d; text-shadow:0 3px 18px rgba(255,90,60,.5); }
.flashban .sale-go { display:none; }
/* Pri Bleskovke je flash banner sám sebe box → zruš vonkajší rámik/pozadie #saleBanner (žiadny dvojitý box) */
#saleBanner.flash-mode { background:none !important; border:none !important; box-shadow:none !important; padding:0 !important; animation:none !important; margin:6px auto 8px !important; }
/* ⚡ Bleskovka — ⓘ podmienky na rozklik */
.flashban-info { margin-top:10px; background:rgba(255,255,255,.08); border:1px solid rgba(255,210,150,.35); color:#ffe1b0; font-size:12px; font-weight:700; letter-spacing:.3px; padding:6px 14px; border-radius:var(--r-pill); cursor:pointer; }
.flashban-info:hover { background:rgba(255,255,255,.14); }
.flashban-terms { margin-top:10px; width:100%; max-width:560px; background:rgba(0,0,0,.34); border:1px solid rgba(255,210,150,.22); border-radius:var(--r-sm); padding:10px 14px; }
.flashban-terms ul { margin:0; padding:0 0 0 2px; list-style:none; text-align:left; }
.flashban-terms li { font-size:12.5px; color:#ece1cc; line-height:1.5; padding:3px 0 3px 20px; position:relative; }
.flashban-terms li::before { content:"✓"; position:absolute; left:0; top:3px; color:#ffd54a; font-weight:900; }
/* 💖 VALENTÍN — ružovo-zlatý variant flash banneru */
.flashban.val { border-color:rgba(255,120,170,.6); background:linear-gradient(135deg,#2a0f1c 0%,#3a1226 55%,#14080f 100%); box-shadow:0 14px 38px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,180,210,.07); }
.flashban.val.live { border-color:rgba(255,120,170,.9); animation:valpulse 2.6s ease-in-out infinite; }
.flashban.val::after { background:radial-gradient(130% 130% at 82% 0, rgba(255,110,170,.24), transparent 55%), linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.5)); }
.flashban.val.has-img::after { background:linear-gradient(180deg, rgba(20,6,12,.42), rgba(20,6,12,.66)); }
.flashban-badge.val { background:linear-gradient(180deg,#ff8ab5,#e23b7a); box-shadow:0 3px 13px rgba(226,59,122,.5); }
.flashban.val .flashban-title { color:#ffd9e6; text-shadow:0 2px 16px rgba(255,120,170,.4); }
.flashban.val .fb-time b { color:#ff9ec4; text-shadow:0 3px 18px rgba(255,120,170,.5); }
.flashban.val .flashban-terms li::before { color:#ff9ec4; }
@keyframes valpulse { 0%,100% { box-shadow:0 6px 22px rgba(255,90,150,.22); } 50% { box-shadow:0 6px 30px rgba(255,90,150,.5); } }
@media (prefers-reduced-motion: reduce) { .flashban.val.live { animation:none; } }
/* ☀️💣 LETNÁ BOMBA — horúca „západ slnka" téma (zlatá / oranžová / koral) */
.flashban.summer { border-color:rgba(255,175,55,.65); background:linear-gradient(135deg,#2b1704 0%,#3e2202 46%,#1a0d02 100%); box-shadow:0 16px 42px rgba(0,0,0,.52), inset 0 0 0 1px rgba(255,205,120,.09); }
.flashban.summer.live { border-color:rgba(255,185,60,.95); animation:flashpulse 2.6s ease-in-out infinite; }
.flashban.summer::after { background:radial-gradient(135% 130% at 84% -8%, rgba(255,180,60,.30), transparent 56%), linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.5)); }
.flashban.summer.has-img::after { background:linear-gradient(180deg, rgba(18,10,2,.40), rgba(18,10,2,.66)); }
.flashban-badge.summer { background:linear-gradient(180deg,#ffd53f,#ff7a2d); color:#3a1c00; box-shadow:0 3px 14px rgba(255,140,40,.55); }
.flashban.summer .flashban-title { color:#ffe6a0; text-shadow:0 2px 18px rgba(255,165,55,.45); }
.flashban.summer .flashban-sub b { color:#ffd54a; }
.flashban.summer .fb-time b { color:#ffb037; text-shadow:0 3px 18px rgba(255,150,50,.5); }
.flashban.summer .flashban-terms li::before { color:#ffca4a; }
.cart-gift-hint.gh-summer { border-color:rgba(255,180,70,.4); }
/* 🚨 last-call (posledných 5 h) — vyššia urgencia */
.flashban.summer.lastcall { border-color:rgba(255,90,45,.95); background:linear-gradient(135deg,#3a1602 0%,#5a2a00 46%,#1a0b02 100%); animation:flashpulse 1.6s ease-in-out infinite; }
.flashban.summer.lastcall .flashban-badge.summer { background:linear-gradient(180deg,#ff7a2d,#e23b1e); color:#fff; }
.flashban.summer.lastcall .fb-time b { color:#ff7a2d; }
@media (prefers-reduced-motion: reduce) { .flashban.summer.live, .flashban.summer.lastcall { animation:none; } }
/* 🎨 Varianty (farby) — klikateľné štvorčeky na karte (zvislý stĺpček vpravo dole, nad cenou) */
.card-variants { position:absolute; right:5px; bottom:5px; z-index:4; display:flex; flex-direction:column; gap:4px; align-items:flex-end; }
.cv-sq { width:23px; height:23px; border-radius:var(--r-xs); border:1.5px solid rgba(255,255,255,.65); background:#15171e center/cover no-repeat; cursor:pointer; padding:0; box-shadow:0 1px 5px rgba(0,0,0,.55); transition:transform .12s, border-color .12s; }
.cv-sq:hover { transform:scale(1.1); }
.cv-sq.on { border-color:var(--accent-2); box-shadow:0 0 0 2px rgba(201,162,39,.75), 0 1px 5px rgba(0,0,0,.5); }
.cv-more { font-size:9.5px; font-weight:800; color:#fff; background:rgba(0,0,0,.65); border-radius:var(--r-xs); padding:2px 5px; line-height:1; }
/* ===== DETAIL (lightbox) — PRÉMIOVÁ horná lišta (2026-06-30) — jednotné tmavé sklo + zlatý okraj ===== */
.lb .lbhead { gap: 10px; align-items: center; }
.lb .lbhead .sp { gap: 8px; align-items: center; }
.lb .lbhead .iconbtn {
height: 42px; min-width: 42px; box-sizing: border-box;
display: inline-flex; align-items: center; justify-content: center; gap: 7px;
padding: 0 15px; border-radius: var(--r-sm); font-size: 13.5px; font-weight: 600; letter-spacing: .2px; line-height: 1;
background: linear-gradient(180deg, rgba(36,31,20,.72), rgba(16,14,9,.74)) !important;
border: 1px solid rgba(201,162,39,.42) !important; color: #f0e6cf !important;
-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
box-shadow: 0 4px 14px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,235,180,.06) !important;
transition: border-color .15s, background .15s, transform .12s, box-shadow .15s, filter .15s;
}
.lb .lbhead .iconbtn:hover { border-color: var(--accent-2) !important; box-shadow: 0 6px 18px rgba(201,162,39,.28), inset 0 1px 0 rgba(255,235,180,.1) !important; transform: translateY(-1px); }
.lb .lbhead .iconbtn:active { transform: scale(.96); }
.lb .lbhead .iconbtn .e3d, .lb .lbhead .iconbtn .ic-svg { width: 18px; height: 18px; }
/* ❤️ Obľúbené — aktívne jemne ružové */
.lb .lbhead .iconbtn.fav.on { border-color: var(--female) !important; color: var(--female-2) !important; background: linear-gradient(180deg, rgba(62,30,46,.74), rgba(30,16,24,.74)) !important; }
/* 🛒 Košík — keď je v košíku, zlatý */
.lb .lbhead .iconbtn.cart.on { background: linear-gradient(180deg, var(--accent-2), var(--accent)) !important; color: #1a1407 !important; border-color: #ffe9a3 !important; }
/* 💬 Napísať — primárna akcia, jemne zlatá výplň */
.lb .lbhead .iconbtn.wa, .lb .lbhead .iconbtn.wa.primary { background: linear-gradient(180deg, var(--accent-2), var(--accent)) !important; color: #1a1407 !important; border-color: #ffe9a3 !important; font-weight: 800; box-shadow: 0 5px 16px rgba(201,162,39,.4) !important; }
.lb .lbhead .iconbtn.wa:hover { filter: brightness(1.06); transform: translateY(-1px); }
.lb .lbhead .iconbtn.wa .e3d { filter: drop-shadow(0 1px 1px rgba(0,0,0,.25)); }
/* ✕ Zavrieť — elegantný kruh, tmavé sklo + zlatý prstenec; hover = zlatý + jemné otočenie (žiadna červená) */
.lb .lbhead .iconbtn.close {
width: 42px; height: 42px; min-width: 42px; padding: 0; border-radius: 50%; font-size: 16px; font-weight: 400;
border: 1px solid rgba(201,162,39,.5) !important; color: #e8dcbf !important;
}
.lb .lbhead .iconbtn.close:hover { background: linear-gradient(180deg, var(--accent-2), var(--accent)) !important; border-color: #ffe9a3 !important; color: #1a1407 !important; transform: rotate(90deg) scale(1.05); box-shadow: 0 6px 18px rgba(201,162,39,.4) !important; }
.lb .lbhead .iconbtn.close:active { transform: rotate(90deg) scale(.94); }
/* ===== mobil: PRÉMIOVÁ kompaktná lišta — všetko sa VŽDY zmestí, ✕ nikdy odrezaný =====
4 ikonové tlačidlá (❤️ 🛒 ⟳ zdieľať) + zlaté „Napísať" vyplní zvyšok + kruhový ✕. Jeden čistý rad. */
@media (max-width: 700px) {
.lb .lbhead { padding-left: 10px; padding-right: 10px; }
.lb .lbhead .sp { flex: 1 1 100%; min-width: 0; flex-wrap: nowrap; gap: 6px; justify-content: flex-end; }
.lb .lbhead .sp .iconbtn { flex: 0 0 auto; }
/* ikonové: skry text, štvorec 42 */
.lb .lbhead .iconbtn.fav, .lb .lbhead .iconbtn.cart, .lb .lbhead .iconbtn.share { font-size: 0; padding: 0; width: 42px; }
.lb .lbhead .iconbtn.spin360btn { padding: 0; width: 42px; }
.lb .lbhead .iconbtn.spin360btn span { display: none; }
.lb .lbhead .iconbtn.model3dbtn, .lb .lbhead .iconbtn.fitbtn { padding: 0 10px; font-size: 15px; }
.lb .lbhead .iconbtn.model3dbtn span, .lb .lbhead .iconbtn.fitbtn span { display: none; }
/* Napísať = hlavná akcia, roztiahne sa na zvyšok radu (text sa nikdy nevyleje von) */
.lb .lbhead .iconbtn.wa { flex: 1 1 auto !important; min-width: 0; font-size: 13.5px; padding: 0 10px; overflow: hidden; white-space: nowrap; justify-content: center; }
/* ✕ vždy celý, nikdy sa nezmenší */
.lb .lbhead .iconbtn.close { flex: 0 0 42px !important; }
}
/* ===== DETAIL PRODUKTU — ZDRŽANLIVÝ LUXUS (2026-06-30) ===== */
/* Cenovka: serif, jemná, bez ťažkého boxu */
.lb-pricetag { background: linear-gradient(135deg, rgba(12,9,5,.6), rgba(12,9,5,.34)) !important; border: 1px solid rgba(232,200,96,.38) !important; border-radius: var(--r-sm) !important; padding: 8px 17px !important; box-shadow: 0 6px 22px rgba(0,0,0,.5) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.lb-pricetag .lbpt-new { font-family: var(--serif) !important; font-size: 30px !important; font-weight: 600 !important; letter-spacing: .6px !important; color: #f0e3b8 !important; text-shadow: 0 2px 10px rgba(0,0,0,.6) !important; }
.lb-pricetag .lbpt-old { font-size: 15px !important; color: #c9bd9c !important; }
.lb-pricetag .lbpt-disc { background: linear-gradient(180deg,#e7cd77,#cda233) !important; color: #2a1d02 !important; font-weight: 800 !important; box-shadow: none !important; }
/* Tlačidlá: elegantné, zdržanlivé (menej lesku) */
.lbi-fastbuy, .lbi-tocart { padding: 14px 12px !important; border-radius: var(--r-sm) !important; font-size: 13.5px !important; font-weight: 700 !important; letter-spacing: .5px !important; }
.lbi-fastbuy { background: linear-gradient(180deg, #e7cd77, #cda233) !important; color: #2a1d02 !important; box-shadow: 0 5px 16px rgba(201,162,39,.28), inset 0 1px 0 rgba(255,255,255,.4) !important; text-shadow: none !important; }
.lbi-tocart { background: rgba(255,255,255,.045) !important; color: #ecdfc0 !important; border: 1px solid rgba(201,162,39,.5) !important; font-weight: 600 !important; }
.lbi-fastbuy:hover, .lbi-tocart:hover { filter: brightness(1.05); transform: translateY(-1px); }
/* Sekčné nadpisy (Veľkosti / Vyberte prevedenie) — jemné verzálky */
.lbi-sztit, .lbi-variants .lbi-sztit { font-size: 11.5px !important; letter-spacing: 1px !important; text-transform: uppercase; color: #b6ab90 !important; font-weight: 600; }
/* riadky info — vzdušnejšie, jemnejšia farba */
.lbinfo { gap: 11px 16px; }
.lbi-row { font-size: 13px; color: #cfc7b4; }
.lbi-name { color: #f0e3b8 !important; font-weight: 600 !important; letter-spacing: .3px; }
/* veľkostné/variant čipy — jemnejší rám */
.lbinfo .szchip, .lbinfo .vchip { border-width: 1px; font-weight: 700; }
/* ===== DETAIL PRODUKTU — LUXUSNÁ INFO KARTA (2026-07-04) ===== */
/* nič nepresvitá spod detailu (predtým 0.97 → album so zeleným „Napíšte nám" presvital) */
.lb { background: #0a0b0f !important; }
/* info = pevná luxusná karta s horným zlatým vlasovým oddeľovačom, vycentrovaný stĺpec */
.lbinfo {
background: linear-gradient(180deg, #16141d 0%, #0c0b10 70%) !important;
border-top: 1px solid rgba(201,162,39,.28);
box-shadow: 0 -16px 40px rgba(0,0,0,.55);
padding: 18px 18px calc(20px + env(safe-area-inset-bottom, 0px)) !important;
gap: 12px 0 !important;
max-height: 46vh;
align-content: flex-start;
}
/* obsah do vycentrovaného úzkeho stĺpca — čistá vertikálna hierarchia */
.lbinfo > * { width: 100%; max-width: 460px; margin-left: auto; margin-right: auto; }
/* hlavička: značka·kategória (jemné verzálky) + názov (serif) */
.lbi-head { text-align: center; margin-bottom: 2px; }
.lbi-brandline { font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; color: #9c9280; font-weight: 700; margin-bottom: 3px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
/* ⭐ social proof v detaile — hodnotenie obchodu, klik otvorí recenzie */
.lbi-trust { border: none; background: none; cursor: pointer; padding: 0; font: inherit; letter-spacing: .4px; text-transform: none; color: var(--accent); font-weight: 800; font-size: 12px; }
.lbi-trust:hover { text-decoration: underline; }
.lbi-name { font-family: var(--serif); font-size: 25px !important; font-weight: 600 !important; color: #f2e6bf !important; line-height: 1.12; letter-spacing: .3px; margin: 0 !important; }
/* 💶 cenový blok — veľká zlatá cena, prečiarknutá pôvodná, zľavová pilulka; všetko na jednom peknom riadku */
.lbi-priceblk { display: flex; align-items: baseline; justify-content: center; gap: 12px; flex-wrap: wrap; }
.lbi-priceblk .lbi-now { font-family: var(--serif); font-size: 30px; font-weight: 600; color: #f0d98a; letter-spacing: .5px; line-height: 1; }
.lbi-priceblk .lbi-was { font-size: 16px; color: #8f8672; text-decoration: line-through; }
.lbi-priceblk .lbi-off { font-size: 13px; font-weight: 800; color: #2a1d02; background: linear-gradient(180deg,#f0d98a,#cda233); padding: 3px 10px; border-radius: var(--r-pill); letter-spacing: .3px; }
.lbi-row.lbi-price { text-align: center; font-size: 16px; }
.instock { font-weight: 700; color: #7fe0a3; }
/* jemný oddeľovač medzi info a výberom veľkosti (kde je čo vyberať) */
.lbi-sizes { margin-top: 4px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.07); }
.lbinfo .lbi-sizes, .lbinfo .lbi-variants { text-align: center; }
.lbinfo .szchips, .lbinfo .vchips { justify-content: center; margin-top: 8px; }
.lbinfo .lbi-row { text-align: center; color: #cfc7b4; }
/* CTA — ❤️ + „Kúpiť hneď" + „Do košíka" VEDĽA SEBA v jednom rade, rovnako vysoké, prémiovo zladené, vyplnia šírku */
.lbi-buy { gap: 8px; margin-top: 18px; align-items: stretch; flex-wrap: nowrap; }
.lbi-fastbuy, .lbi-tocart { flex: 1 1 0; min-width: 0; height: 54px; padding: 0 8px !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .2px !important; white-space: nowrap; border-radius: var(--r) !important; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.lbi-buy .lbi-wa { flex: 1 1 0; }
.lbi-buy .e3d { width: 15px; height: 15px; }
/* srdiečko — rovnaká výška a rádius ako tlačidlá, zladené s „Do košíka" (prémiové trio) */
.lbi-favbtn { flex: 0 0 auto; width: 54px; height: 54px; align-self: stretch; display: inline-flex; align-items: center; justify-content: center; background: rgba(255,255,255,.05); border: 1px solid rgba(201,162,39,.5); border-radius: var(--r); cursor: pointer; transition: transform .12s, background .15s, border-color .15s; }
.lbi-favbtn .e3d { width: 21px; height: 21px; }
.lbi-favbtn:hover { background: rgba(255,255,255,.09); border-color: var(--accent-2); }
.lbi-favbtn:active { transform: scale(.92); }
.lbi-favbtn.on { background: rgba(224,69,95,.16); border-color: rgba(224,69,95,.7); }
/* delivery/note pod tlačidlami — nenápadné */
.lbi-row:has(.e3d) { color: #b7ae98; font-size: 13px; }
/* plávajúca zelená WhatsApp bublina v detaile je nadbytočná (v hlavičke je „Napísať") → preč, čistejší detail */
.lbfabwa { display: none !important; }
@media (max-width: 700px) {
.lbinfo { padding: 16px 16px calc(18px + env(safe-area-inset-bottom, 0px)) !important; max-height: 48vh; }
.lbi-name { font-size: 22px !important; }
.lbi-priceblk .lbi-now { font-size: 27px; }
}
/* ===== 🌀 360° otáčanie showroom kúskov ===== */
.iconbtn.spin360btn{background:linear-gradient(135deg,#2a2350,#3a2f6b);border-color:#6d5cc4;color:#e9e4ff}
.iconbtn.spin360btn:hover{background:linear-gradient(135deg,#3a2f6b,#4a3d8a)}
/* 🧊 3D + AR tlačidlo + overlay */
.iconbtn.model3dbtn{background:linear-gradient(135deg,#0f3d3a,#12564f);border-color:#2fb8a6;color:#c8fff5}
.iconbtn.model3dbtn:hover{background:linear-gradient(135deg,#12564f,#177a6d)}
.model3d{position:fixed;inset:0;z-index:2147483001;background:radial-gradient(120% 120% at 50% 32%,#0f2a2a 0%,#08110f 68%,#03080a 100%);display:flex;align-items:center;justify-content:center;touch-action:none;overscroll-behavior:contain}
.model3d[hidden]{display:none}
.m3d-stage{width:min(96vw,720px);height:min(78vh,720px);display:flex;align-items:center;justify-content:center}
.m3d-stage model-viewer{width:100%;height:100%;--poster-color:transparent}
.m3d-load{color:#8fe6d8;font-size:22px;letter-spacing:3px}
.m3d-badge{position:absolute;top:calc(14px + env(safe-area-inset-top,0));left:16px;background:linear-gradient(135deg,#12564f,#2fb8a6);color:#eafff9;font-weight:800;font-size:12px;padding:5px 11px;border-radius:var(--r-pill);box-shadow:0 3px 12px rgba(47,184,166,.5)}
.m3d-hint{position:absolute;bottom:calc(28px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:rgba(9,32,30,.74);border:1px solid rgba(47,184,166,.45);color:#d8fff7;font-size:13.5px;font-weight:600;padding:9px 16px;border-radius:var(--r-pill);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);white-space:nowrap}
.m3d-ar{position:absolute;bottom:74px;left:50%;transform:translateX(-50%);background:linear-gradient(180deg,#2fe0c6,#12a892);color:#052b25;border:none;border-radius:var(--r-pill);padding:13px 22px;font-size:15px;font-weight:800;cursor:pointer;box-shadow:0 8px 26px rgba(47,224,198,.45);white-space:nowrap}
.m3d-ar:hover{filter:brightness(1.05)}
.model3d .sp3-close{position:absolute;top:calc(12px + env(safe-area-inset-top,0));right:14px}
.spin360{position:fixed;inset:0;z-index:2147483000;background:radial-gradient(120% 120% at 50% 30%,#181427 0%,#0b0913 70%,#050409 100%);display:flex;align-items:center;justify-content:center;touch-action:none;-webkit-user-select:none;user-select:none;overscroll-behavior:contain}
.spin360[hidden]{display:none}
.sp3-frame{width:min(92vw,560px);height:min(92vw,560px);max-height:78vh;display:flex;align-items:center;justify-content:center;cursor:grab}
.sp3-frame:active{cursor:grabbing}
.sp3-frame img{max-width:100%;max-height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 24px 60px rgba(0,0,0,.55))}
.sp3-hint{position:absolute;bottom:calc(30px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:rgba(20,16,40,.72);border:1px solid rgba(140,120,220,.4);color:#e9e4ff;font-size:14px;font-weight:600;padding:9px 16px;border-radius:var(--r-pill);backdrop-filter:blur(6px);white-space:nowrap;transition:opacity .5s;animation:sp3pulse 2.4s ease-in-out infinite}
@keyframes sp3pulse{0%,100%{opacity:.85}50%{opacity:1}}
.sp3-hint.gone{opacity:0;pointer-events:none}
.sp3-load{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#b7abe6;font-size:15px;letter-spacing:2px}
.sp3-load[hidden]{display:none}
.sp3-badge{position:absolute;top:calc(16px + env(safe-area-inset-top));left:18px;background:linear-gradient(135deg,#6d5cc4,#8a6fe0);color:#fff;font-weight:800;font-size:13px;letter-spacing:.5px;padding:7px 13px;border-radius:var(--r-pill);box-shadow:0 6px 18px rgba(109,92,196,.5)}
.sp3-close{position:absolute;top:calc(12px + env(safe-area-inset-top));right:16px;width:44px;height:44px;border-radius:50%;background:rgba(20,16,40,.7);border:1.5px solid rgba(220,220,255,.5);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sp3-close:hover{background:#e0455f;border-color:#e0455f}
/* odznak 🌀 360° na karte v showroome */
.card-tags .spin-badge{background:linear-gradient(135deg,#6d5cc4,#8a6fe0);color:#fff;font-weight:800;font-size:11px;letter-spacing:.3px;padding:4px 9px;border-radius:var(--r-pill);box-shadow:0 3px 10px rgba(109,92,196,.5);white-space:nowrap;pointer-events:none;display:inline-flex;align-items:center;gap:4px}
.card-tags .spin-badge .e3d{width:12px;height:12px;flex:0 0 auto;filter:none}
/* ===== 👗 Virtuálna skúšobná kabínka ===== */
.iconbtn.fitbtn{background:linear-gradient(135deg,#7a2f52,#a83e6e);border-color:#d06a97;color:#ffe9f3}
.iconbtn.fitbtn:hover{background:linear-gradient(135deg,#a83e6e,#c4507f)}
.fitroom{position:fixed;inset:0;z-index:2147483001;background:#0b0913;display:flex;flex-direction:column;touch-action:none;-webkit-user-select:none;user-select:none;overscroll-behavior:contain}
.fitroom[hidden]{display:none}
.fr-top{display:flex;align-items:center;justify-content:space-between;padding:calc(12px + env(safe-area-inset-top)) 16px 10px;background:linear-gradient(#151021,rgba(21,16,33,0));position:relative;z-index:3}
.fr-title{font-weight:800;font-size:17px;color:#ffe9f3}
.fr-close{width:42px;height:42px;border-radius:50%;background:rgba(30,22,44,.8);border:1.5px solid rgba(220,200,230,.45);color:#fff;font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.fr-close:hover{background:#e0455f;border-color:#e0455f}
.fr-stage{position:relative;flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(#141020 0% 25%,#181427 0% 50%) 50%/28px 28px}
.fr-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#0b0913}
.fr-bg[hidden]{display:none}
.fr-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;color:#cfc3e0;padding:24px}
.fr-empty-ic{font-size:52px;opacity:.9}
.fr-empty[hidden]{display:none}
.fr-bag-wrap{position:absolute;left:50%;top:50%;width:52%;max-width:340px;will-change:transform;cursor:grab;touch-action:none;z-index:2}
.fr-bag-wrap:active{cursor:grabbing}
.fr-bag-wrap[hidden]{display:none}
.fr-bag{width:100%;height:auto;display:block;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 18px 30px rgba(0,0,0,.5))}
.fr-hint{position:absolute;left:50%;bottom:calc(150px + env(safe-area-inset-bottom));transform:translateX(-50%);background:rgba(24,18,38,.8);border:1px solid rgba(210,120,170,.4);color:#ffe9f3;font-size:13px;font-weight:600;padding:8px 14px;border-radius:var(--r-pill);backdrop-filter:blur(6px);white-space:nowrap;z-index:3;pointer-events:none;animation:sp3pulse 2.4s ease-in-out infinite}
.fr-hint[hidden]{display:none}
.fr-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 14px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(rgba(21,16,33,0),#151021);position:relative;z-index:3}
.fr-btn{display:inline-flex;align-items:center;gap:6px;background:rgba(40,30,54,.9);border:1px solid rgba(200,170,220,.35);color:#f3e9f6;font-size:14px;font-weight:700;padding:10px 14px;border-radius:var(--r-sm);cursor:pointer;white-space:nowrap}
.fr-btn:hover{background:rgba(58,44,78,.95)}
.fr-btn.gold{background:linear-gradient(135deg,var(--accent),#e6c46a);border-color:#e6c46a;color:#2a2010}
.fr-btn input{position:absolute;width:0;height:0;opacity:0}
.fr-slider{display:flex;align-items:center;gap:8px;flex:1 1 150px;min-width:130px;background:rgba(40,30,54,.7);padding:6px 12px;border-radius:var(--r-sm);color:#cbb6d6;font-size:14px}
.fr-slider input{flex:1;accent-color:#d06a97}
.fr-colors{display:flex;gap:7px;align-items:center}
.fr-color{width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,255,255,.35);cursor:pointer;background-size:cover;background-position:center;padding:0}
.fr-color.on{border-color:#e6c46a;box-shadow:0 0 0 2px rgba(230,196,106,.5)}
@media(max-width:520px){.fr-slider{flex:1 1 46%}.fr-btn{font-size:13px;padding:9px 11px}}
/* ===== ✨ AI realistická skúška (fitting room) ===== */
.fr-btn.ai{background:linear-gradient(135deg,#7a2f9e,#b44ad0);border-color:#c96fe0;color:#fff;font-weight:800;flex:1 1 100%;justify-content:center;order:-1;padding:12px}
.fr-btn.ai:hover{background:linear-gradient(135deg,#8f38b6,#c257e0)}
.fr-ai{position:absolute;inset:0;z-index:6;background:#0b0913;display:flex;align-items:center;justify-content:center}
.fr-ai[hidden]{display:none}
.fr-ai-inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8px}
.fr-ai-inner img{max-width:100%;max-height:100%;object-fit:contain;border-radius:var(--r-xs)}
.fr-ai-load{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:radial-gradient(120% 120% at 50% 40%,#1c1230 0%,#0b0913 75%);color:#f0e6ff;text-align:center;padding:24px}
.fr-ai-load[hidden]{display:none}
.fr-ai-load>div:nth-child(2){font-size:16px;font-weight:700}
.fr-ai-sub{font-size:13px;color:#b7a6d6}
.fr-spin{width:54px;height:54px;border-radius:50%;border:4px solid rgba(180,120,220,.25);border-top-color:#c96fe0;animation:frspin 1s linear infinite}
@keyframes frspin{to{transform:rotate(360deg)}}
.fr-ai-bar{position:absolute;left:0;right:0;bottom:0;display:flex;gap:10px;justify-content:center;padding:14px 14px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(rgba(11,9,19,0),#0b0913)}
.fr-ai-bar[hidden]{display:none}
.fr-ai-x{position:absolute;top:calc(12px + env(safe-area-inset-top));right:16px;width:42px;height:42px;border-radius:50%;background:rgba(30,22,44,.8);border:1.5px solid rgba(220,200,230,.45);color:#fff;font-size:19px;cursor:pointer;z-index:2}
.fr-ai-x[hidden]{display:none}
/* ===== 📸 Showroom = FOTOALBUM (foto + WhatsApp dopyt, bez košíka/ceny) ===== */
.sralb{position:relative;border-radius:var(--r);overflow:hidden;background:#14121a;border:1px solid rgba(255,255,255,.07);box-shadow:0 4px 14px rgba(0,0,0,.35)}
.sralb-i{width:100%;aspect-ratio:3/4;object-fit:cover;display:block;cursor:zoom-in;content-visibility:auto;background:#0d0b12}
.sralb-wa{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;border:none;background:linear-gradient(135deg,#1fae57,#2ecc71);color:#fff;font-weight:800;font-size:14px;padding:11px 8px;cursor:pointer;letter-spacing:.2px}
.sralb-wa:hover{filter:brightness(1.06)}
.sralb-wa svg,.sralb-wa img{width:18px;height:18px;flex:0 0 auto}
/* 🌀 360° odznak na album dlaždici */
.sralb-360{position:absolute;top:8px;left:8px;z-index:3;background:linear-gradient(135deg,#6d5cc4,#8a6fe0);color:#fff;font-weight:800;font-size:11px;letter-spacing:.3px;padding:4px 9px;border-radius:var(--r-pill);box-shadow:0 3px 10px rgba(109,92,196,.5);pointer-events:none}
/* 🌀 oblúková (rotačná) šípka — hint na 360° dlaždici, že sa dá otáčať dookola */
.spin-arc{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);z-index:4;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:7px;transition:opacity .4s ease,transform .4s ease}
.spin-arc.gone{opacity:0;transform:translate(-50%,-50%) scale(.7)}
.spin-arc .sa-svg{width:54px;height:54px;filter:drop-shadow(0 3px 9px rgba(0,0,0,.6));animation:spinArcRot 2.8s linear infinite;transform-origin:50% 50%}
.spin-arc .sa-lbl{font-size:11px;font-weight:800;letter-spacing:.4px;color:#fff;background:rgba(20,16,40,.62);border:1px solid rgba(138,111,224,.5);padding:3px 10px;border-radius:var(--r-pill);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);white-space:nowrap}
@keyframes spinArcRot{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin-arc .sa-svg{animation:none}}
.snav.snav-spin360{border-color:rgba(138,111,224,.55)}
.snav.snav-spin360.active{background:linear-gradient(135deg,#6d5cc4,#8a6fe0);border-color:#8a6fe0}
/* ═══ 💳 KARTA PRODUKTU — upratený spodok (cena → čipy → veľkosti → tlačidlá) ═══ */
/* ✅/🚚 meta čipy (Skladom + Dodanie) — pekne pod cenou, nie stratené pod tlačidlami */
.lbi-meta { display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: -2px; }
.lbi-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .2px; padding: 6px 13px; border-radius: var(--r-pill); border: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.04); color: #d9d2c0; white-space: nowrap; }
.lbi-chip .e3d { width: 15px; height: 15px; vertical-align: -3px; }
.lbi-chip.stock { color: #2dd4a7; border-color: rgba(45,212,167,.4); background: rgba(45,212,167,.08); }
.lbi-chip.ship { color: #ecdfb6; border-color: rgba(201,162,39,.4); background: rgba(201,162,39,.08); }
/* 🚚 dodanie + skladom zarovnané VĽAVO (pod veľkosťami) */
.lbi-meta.lbi-meta-left { justify-content: flex-start; margin-top: 4px; }
/* 💶 CENA na fotke vpravo hore — veľké zelené písmo (ako WhatsApp), na tmavom skle pre čitateľnosť */
.lb-pricetag2 { position: absolute; top: 12px; right: 12px; z-index: 6; display: inline-flex; align-items: baseline; gap: 9px; background: rgba(8,10,12,.5); border: 1px solid rgba(37,211,102,.55); border-radius: var(--r-sm); padding: 7px 15px; box-shadow: 0 6px 22px rgba(0,0,0,.5); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); pointer-events: none; }
.lb-pricetag2 .lbpt-now { font-family: var(--serif); font-size: 28px; font-weight: 700; color: #25d366; letter-spacing: .5px; line-height: 1; text-shadow: 0 2px 8px rgba(0,0,0,.65); }
.lb-pricetag2 .lbpt-was { font-size: 14px; color: #a7c2b3; text-decoration: line-through; }
.lb-pricetag2 .lbpt-off { font-size: 12px; font-weight: 800; color: #062a15; background: #25d366; padding: 2px 8px; border-radius: var(--r-pill); align-self: center; }
@media (max-width: 380px){ .lb-pricetag2 { top: 10px; right: 10px; padding: 6px 12px; } .lb-pricetag2 .lbpt-now { font-size: 24px; } }
/* 🚚 DOPRAVA vľavo hore na fotke — „NA OBJEDNÁVKU" (zlaté verzálky) + „Doprava 14 dní" (profi štítok, všetky jazyky) */
.lb-shiptag { position: absolute; top: 12px; left: 12px; z-index: 6; display: flex; flex-direction: column; gap: 2px; align-items: flex-start; background: rgba(8,10,12,.5); border: 1px solid rgba(201,162,39,.45); border-radius: var(--r-sm); padding: 7px 13px; box-shadow: 0 6px 22px rgba(0,0,0,.5); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); pointer-events: none; max-width: 60%; }
.lb-shiptag .lbst-order { font-size: 10px; font-weight: 800; letter-spacing: 1.3px; text-transform: uppercase; color: #e8c860; }
.lb-shiptag .lbst-ship { font-size: 13px; font-weight: 700; color: #efe6ca; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.lb-shiptag .lbst-ship .e3d { width: 15px; height: 15px; vertical-align: -3px; }
@media (max-width: 380px){ .lb-shiptag { top: 10px; left: 10px; padding: 6px 11px; } .lb-shiptag .lbst-ship { font-size: 12px; } }
/* veľkosti + varianty vycentrované (mobil aj desktop) — celá karta drží jednu os */
.lbinfo .lbi-sztit { text-align: center; }
.lbinfo .szchips, .lbinfo .vchips { justify-content: center; }
.lbinfo .lbi-row { text-align: center; }
/* ═══ 🧮 JEDNOTNÁ GRAFIKA POČTOV — jeden zlatý pill v celej appke (kolonky, pohlavia, kategórie, dlaždice) ═══ */
.gseg .gn, .cchip .cc, .btile-cap .bc, .sec-count {
display: inline-block; font-size: 11px; font-weight: 800; line-height: 1.5; letter-spacing: .2px;
color: #2a1d02; background: linear-gradient(180deg, #f6dd8a, #cda233);
border-radius: var(--r-pill); padding: 1px 8px; opacity: 1;
}
.cchip .cc { margin-left: 7px; }
.gseg .gn { margin-top: 3px; }
.gseg.active .gn { opacity: 1; }
/* aktívny chip má zlaté pozadie → počet invertovaný (tmavý pill, zlaté číslo) */
.cchip.active .cc,
body[data-gender="m"] .cchip.active .cc,
body[data-gender="w"] .cchip.active .cc { background: #1f1a10; color: #f0d585; }
.gseg.active .gn { background: #1f1a10; color: #f0d585; }
/* pohlavie s fotkou na pozadí — pill musí ostať čitateľný, nie biely text */
.gseg.has-img .gn { color: #2a1d02 !important; text-shadow: none; background: linear-gradient(180deg, #f6dd8a, #cda233); }
/* ═══ ❤️ LIKY — recenzie + kúsky ═══ */
.lk-n { display: inline-block; font-size: 10.5px; font-weight: 800; color: #f0d585; margin-left: 4px; vertical-align: 1px; }
.heart .lk-n { position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); background: rgba(15,13,8,.92); border: 1px solid rgba(201,162,39,.5); border-radius: var(--r-pill); padding: 0 6px; line-height: 1.5; margin: 0; pointer-events: none; }
.rv-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; } /* srdiečko VŽDY dole na rovnakom mieste — karty rôznej výšky ho nerozhádžu */
.rv-like { border: 1px solid rgba(201,162,39,.4); background: rgba(201,162,39,.06); color: var(--accent); cursor: pointer; border-radius: var(--r-pill); padding: 4px 11px; display: inline-flex; align-items: center; gap: 2px; font: inherit; transition: border-color .15s, background .15s, transform .1s; }
.rv-like svg { width: 15px; height: 15px; }
.rv-like:hover { border-color: var(--accent); background: rgba(201,162,39,.13); }
.rv-like.on { color: #e8b8c8; border-color: rgba(232,184,200,.45); }
.rv-like .lk-n { margin-left: 2px; }
@keyframes heartpop { 0% { transform: scale(1); } 40% { transform: scale(1.4) rotate(-6deg); } 70% { transform: scale(.92); } 100% { transform: scale(1); } }
.heart.pop svg, .rv-like.pop svg, .lbi-favbtn.pop svg { animation: heartpop .38s cubic-bezier(.2,.8,.3,1.2); }
/* ═══ ✨ MIKROINTERAKCIE — jemný, drahý pocit v celej appke ═══ */
/* stlačenie: všetky hlavné dotykové prvky mierne „sadnú" */
.gseg:active, .cchip:active, .snav:active, .albumbanner:active, .swipebanner:active, .co-btn:active,
.sr-chip:active, .heart:active, .rv-like:active, .lbi-fastbuy:active, .lbi-tocart:active { transform: scale(.975); }
/* nákupné kolonky: hover dvihne a rozsvieti okraj */
@media (hover: hover) {
.hometiles .sectile { transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.hometiles .sectile:hover { transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 10px 30px rgba(201,162,39,.28); }
}
/* karty produktov: jemný nástup pri vykreslení (rešpektuje obmedzenie pohybu) */
@media (prefers-reduced-motion: no-preference) {
#grid .card, #lhGrid .card { animation: cardin .38s ease both; }
@keyframes cardin { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
}
/* ═══ ⚡ PLATBA — lokálne QR + skeleton kým sa pripravuje ═══ */
.co-qr .qrbox { display:block; width:300px; max-width:78vw; aspect-ratio:1; border-radius:var(--r); background:#fff; padding:10px; box-sizing:border-box; }
.co-qr .qrbox svg { display:block; width:100%; height:100%; }
.co-qr .qrskel { display:block; width:300px; max-width:78vw; aspect-ratio:1; border-radius:var(--r);
background: linear-gradient(100deg, #1c1f28 30%, #2a2e3c 50%, #1c1f28 70%); background-size: 200% 100%;
animation: skel 1.4s ease-in-out infinite; }
/* ═══ ⚡ VÝKON — sekcie pod záhybom sa nerenderujú, kým k nim klientka nedoscrolluje ═══ */
#reviewsHome, .albumextra { content-visibility: auto; contain-intrinsic-size: auto 540px; }
/* ═══ 🏷️ ŠTÍTOK KVALITY — malý, vedľa kategórie/ceny na čiernom (z fotky odstránený) ═══ */
/* štítok kvality = jemný zlatý podpis (žiadny rámik/pilulka) — na riadku kategórie, oddelený bodkou */
.tier-tag { font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; white-space: nowrap; }
.tt-top { color: #e3c877; }
.tt-prem { color: #b9b2a0; opacity: .9; }
.card .cb-cat .cb-dot { margin: 0 5px; opacity: .45; font-weight: 400; }
/* ═══════════ 📸 STORIES (Instagram štýl) — prstenec, prehliadač, odpoveď ═══════════ */
/* Prstenec: NEVIDENÉ = farebný gradient (svieti), VIDENÉ = sivý tenký krúžok */
.story .st-ring { padding: 2.5px; background: conic-gradient(from 210deg, #f6dd8a, #cda233, var(--female), #7a5cff, #f6dd8a); }
.story.seen .st-ring { background: rgba(255,255,255,.18); }
.story.seen .st-thumb { opacity: .62; }
.st-thumb { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; border: 2px solid var(--bg); background: var(--panel-2); display: block; }
.st-thumb img, .st-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; border: none; border-radius: 50%; }
@media (prefers-reduced-motion: no-preference) {
.story:not(.seen) .st-ring { animation: stpulse 2.6s ease-in-out infinite; }
@keyframes stpulse { 0%,100% { box-shadow: 0 0 0 0 rgba(201,162,39,.42); } 50% { box-shadow: 0 0 0 6px rgba(201,162,39,0); } }
}
.story:active { transform: scale(.94); }
/* Tlačidlo v hlavičke — bodka + zlatá žiara, keď je niečo nové */
.storiesbtn .sb-ring { position: relative; }
.sb-dot { position: absolute; top: -3px; right: -3px; width: 9px; height: 9px; border-radius: 50%; background: linear-gradient(180deg,#f6dd8a,#cda233); box-shadow: 0 0 0 2px var(--bg); }
.storiesbtn.has-new { border-color: var(--accent); box-shadow: 0 0 14px rgba(201,162,39,.4); }
/* Prehliadač: hlavička, progress bary, médium, odpoveď */
.st-head { position: absolute; top: calc(20px + env(safe-area-inset-top,0)); left: 12px; right: 12px; z-index: 4; display: flex; align-items: center; gap: 9px; }
.st-av img { width: 32px; height: 32px; border-radius: 50%; display: block; border: 1.5px solid rgba(255,255,255,.6); }
.st-who { color: #fff; font-weight: 700; font-size: 13.5px; }
.st-age { color: rgba(255,255,255,.65); font-size: 12.5px; }
.st-head .st-x { position: static; width: 34px; height: 34px; font-size: 15px; }
.st-mute { width: 34px; height: 34px; border-radius: 50%; border: none; background: rgba(0,0,0,.45); color: #fff; font-size: 15px; cursor: pointer; }
/* progress bar sa plní plynulo (šírka ) */
.st-bar { position: relative; overflow: hidden; background: rgba(255,255,255,.3); }
.st-bar.active { background: rgba(255,255,255,.3); }
.st-bar > i { display: block; height: 100%; width: 0; background: #fff; border-radius: 3px; }
.st-bar.done > i { width: 100%; }
.st-stage { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.st-media { max-width: 100%; max-height: 100%; width: auto; height: 100%; object-fit: contain; display: block; }
.st-nav { top: 64px; bottom: 76px; } /* nezasahuje do hlavičky ani do poľa odpovede */
.st-info { position: absolute; left: 0; right: 0; bottom: 76px; z-index: 3; padding: 22px 18px 14px; text-align: center;
background: linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0)); pointer-events: none; }
.st-info p { color: #fff; font-size: 15px; margin: 0 0 10px; text-shadow: 0 1px 6px rgba(0,0,0,.7); }
.st-info .st-cta { pointer-events: auto; }
/* pole odpovede — príde nám na WhatsApp */
.st-reply { position: absolute; left: 12px; right: 12px; bottom: calc(14px + env(safe-area-inset-bottom,0)); z-index: 5; display: flex; gap: 8px; align-items: center; transition: bottom .18s ease; }
.st-reply input { flex: 1; min-width: 0; height: 44px; border-radius: var(--r-pill); padding: 0 18px; font-size: 14.5px; color: #fff;
background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.45); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.st-reply input::placeholder { color: rgba(255,255,255,.65); }
.st-reply input:focus { outline: none; border-color: #fff; background: rgba(255,255,255,.16); }
.st-send { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer; font-size: 16px;
color: #12100a; background: linear-gradient(180deg,#f6dd8a,#cda233); box-shadow: 0 4px 14px rgba(201,162,39,.45); }
.st-send:active { transform: scale(.93); }
/* ═══ 🔎 VYHĽADÁVACIA KOLONKA — zvýraznená, s fotoaparátom vnútri ═══ */
.searchwrap { position: relative; display: flex; align-items: center; flex: 1 1 260px; min-width: 0; max-width: 460px; }
.searchwrap .sw-ico { position: absolute; left: 13px; display: grid; place-items: center; pointer-events: none; color: var(--accent); opacity: .85; }
.searchwrap .sw-ico svg, .searchwrap .sw-ico img { width: 17px; height: 17px; }
.controls .searchwrap input#search {
width: 100%; padding: 11px 46px 11px 40px; border-radius: var(--r-pill); font-size: 14px;
background: rgba(201,162,39,.07); border: 1.5px solid rgba(201,162,39,.5);
box-shadow: 0 0 0 0 rgba(201,162,39,.25); transition: border-color .18s, box-shadow .18s, background .18s;
}
.controls .searchwrap input#search::placeholder { color: rgba(232,226,208,.55); }
.controls .searchwrap input#search:hover { border-color: rgba(201,162,39,.75); background: rgba(201,162,39,.10); }
.controls .searchwrap input#search:focus { outline: none; border-color: var(--accent); background: rgba(201,162,39,.13); box-shadow: 0 0 0 4px rgba(201,162,39,.16); }
/* 📷 hľadanie podľa fotky — priamo v kolonke, vpravo */
.sw-cam { position: absolute; right: 5px; width: 34px; height: 34px; border-radius: 50%; border: none; cursor: pointer;
display: grid; place-items: center; color: #12100a; background: linear-gradient(180deg,#f6dd8a,#cda233);
box-shadow: 0 2px 9px rgba(201,162,39,.45); transition: transform .12s; }
.sw-cam svg, .sw-cam img { width: 17px; height: 17px; }
.sw-cam:hover { transform: scale(1.07); }
.sw-cam:active { transform: scale(.93); }
/* ═══ 📸 STORIES TLAČIDLO — kruh s prstencom; NOVÁ story = ružový Instagram gradient ═══ */
.storiesbtn { background: none; border: none; padding: 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 3px; flex: 0 0 auto; }
.storiesbtn .sb-ring { width: 44px; height: 44px; border-radius: 50%; padding: 2.5px; display: grid; place-items: center;
background: rgba(255,255,255,.22); transition: background .25s; }
.storiesbtn .sb-inner { width: 100%; height: 100%; border-radius: 50%; display: grid; place-items: center;
background: var(--panel-2); border: 2px solid var(--bg); color: var(--accent-2); }
.storiesbtn .sb-inner svg, .storiesbtn .sb-inner img { width: 19px; height: 19px; }
.storiesbtn .sb-txt { font-size: 10.5px; font-weight: 600; color: var(--muted); letter-spacing: .2px; }
/* NOVÁ story → ružovo-oranžový prstenec ako na Instagrame + pulz */
.storiesbtn.has-new .sb-ring { background: conic-gradient(from 200deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888, #f09433); }
.storiesbtn.has-new .sb-txt { color: #e6683c; }
@media (prefers-reduced-motion: no-preference) {
.storiesbtn.has-new .sb-ring { animation: igpulse 2.4s ease-in-out infinite; }
@keyframes igpulse { 0%,100% { box-shadow: 0 0 0 0 rgba(220,39,67,.45); } 50% { box-shadow: 0 0 0 7px rgba(220,39,67,0); } }
}
.storiesbtn:active { transform: scale(.94); }
/* lišta stories na feede — nevidené tiež ružový IG gradient (jednotné s tlačidlom) */
.story:not(.seen) .st-ring { background: conic-gradient(from 200deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888, #f09433); }
@media (prefers-reduced-motion: no-preference) {
.story:not(.seen) .st-ring { animation: igpulse 2.6s ease-in-out infinite; }
}
@media (max-width: 700px) { .storiesbtn .sb-ring { width: 40px; height: 40px; } .storiesbtn .sb-txt { font-size: 9.5px; } }
/* mobil: vyhľadávacia kolonka na celý riadok pod tlačidlami (rovnako ako predtým samotný input) */
@media (max-width: 700px) {
.controls .searchwrap { order: 9; flex-basis: 100%; max-width: none; }
.controls .searchwrap input#search { padding: 12px 48px 12px 40px; }
}
/* ═══ ⤵️ PULL-TO-REFRESH — kruh so spinnerom nad obsahom ═══ */
.ptr { position: fixed; top: 6px; left: 50%; z-index: 130; transform: translateX(-50%) translateY(0); opacity: 0;
width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; pointer-events: none;
background: rgba(18,16,10,.92); border: 1px solid rgba(201,162,39,.45); box-shadow: 0 6px 18px rgba(0,0,0,.5); }
.ptr-spin { width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(201,162,39,.28); border-top-color: var(--accent); }
.ptr.ready { border-color: var(--accent); box-shadow: 0 0 16px rgba(201,162,39,.45); }
.ptr.ready .ptr-spin { border-top-color: #f6dd8a; }
.ptr.loading .ptr-spin { animation: ptrspin .7s linear infinite; }
@keyframes ptrspin { to { transform: rotate(360deg); } }
/* natívne „bounce" obnovenie prehliadača vypni, nech nekoliduje s naším */
body { overscroll-behavior-y: contain; }
/* ═══ 📱 HLAVIČKA MOBIL — Košík · Stories (kruh v strede) · Appka v jednom symetrickom riadku ═══ */
@media (max-width: 700px) {
.controls { align-items: center; justify-content: center; gap: 10px; }
.controls .ctl-break { display: none !important; } /* zalamovač rozbíjal Košík·Stories·Appka do jedného riadku */
.controls .cartheadbtn { order: 1; flex: 1 1 0; min-width: 0; justify-content: center; }
.controls #storiesBtn { order: 2; flex: 0 0 auto; align-self: center; margin: 0 2px; }
.controls #installBtn { order: 3; flex: 1 1 0 !important; width: auto !important; min-width: 0; justify-content: center; font-size: 14px !important; }
.controls #installBtn .it { display: inline !important; }
.controls #installBtn .e3d { width: 18px; height: 18px; margin-right: 5px; }
.controls .searchwrap { order: 9; }
/* Stories kruh o kúsok väčší = ľahko klikateľný, zarovnaný na stred medzi tlačidlami */
.controls #storiesBtn .sb-ring { width: 46px; height: 46px; }
.controls #storiesBtn .sb-txt { font-size: 10px; }
}
/* ═══════════ 🌐 PRÉMIOVÝ JAZYKOVÝ PREPÍNAČ (namiesto systémového bieleho dropdownu) ═══════════ */
.langpick { position: absolute; top: calc(14px + env(safe-area-inset-top)); right: 14px; z-index: 30; margin: 0; }
.langpick-btn {
display: inline-flex; align-items: center; gap: 7px; height: 38px; box-sizing: border-box;
padding: 0 12px; border-radius: var(--r-sm); cursor: pointer; white-space: nowrap;
background: linear-gradient(180deg, rgba(38,32,18,.96), rgba(20,17,10,.96));
border: 1px solid rgba(201,162,39,.55); color: var(--text);
font-size: 13.5px; font-weight: 800; letter-spacing: .3px;
box-shadow: 0 4px 14px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.05);
transition: border-color .16s, box-shadow .16s, transform .1s;
}
.langpick-btn:hover { border-color: var(--accent); box-shadow: 0 6px 18px rgba(201,162,39,.28), inset 0 1px 0 rgba(255,255,255,.06); }
.langpick-btn:active { transform: scale(.97); }
.langpick-btn .lp-flag { font-size: 17px; line-height: 1; }
.langpick-btn .lp-code { color: var(--accent-2); }
.langpick-btn .lp-arrow { color: var(--accent-2); opacity: .85; transition: transform .2s; margin-left: 1px; }
.langpick-btn[aria-expanded="true"] .lp-arrow { transform: rotate(180deg); }
/* rozbaľovací panel — tmavý, zlatý rám, sklo */
.langpick-menu {
position: absolute; top: calc(100% + 8px); right: 0; min-width: 210px; max-height: 62vh; overflow-y: auto;
padding: 7px; border-radius: var(--r); z-index: 50;
background: linear-gradient(180deg, rgba(28,24,15,.98), rgba(16,13,8,.99));
border: 1px solid rgba(201,162,39,.45);
box-shadow: 0 18px 44px rgba(0,0,0,.6), 0 0 0 1px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.05);
-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
animation: lpIn .16s ease;
}
@keyframes lpIn { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
.langpick-menu::-webkit-scrollbar { width: 7px; }
.langpick-menu::-webkit-scrollbar-thumb { background: rgba(201,162,39,.35); border-radius: var(--r-pill); }
.lp-item {
display: flex; align-items: center; gap: 11px; width: 100%; box-sizing: border-box;
padding: 10px 12px; border: none; border-radius: var(--r-sm); cursor: pointer; text-align: left;
background: transparent; color: var(--text); font-size: 14.5px; font-weight: 600; transition: background .13s;
}
.lp-item:hover { background: rgba(201,162,39,.12); }
.lp-item.on { background: linear-gradient(180deg, rgba(201,162,39,.20), rgba(201,162,39,.10)); }
.lp-i-flag { font-size: 20px; line-height: 1; flex: 0 0 auto; }
.lp-i-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-i-code { flex: 0 0 auto; font-size: 11px; font-weight: 800; letter-spacing: .5px; color: var(--muted); }
.lp-item.on .lp-i-code { color: var(--accent-2); }
.lp-i-chk { flex: 0 0 auto; color: var(--accent); font-weight: 900; }
@media (max-width: 700px) {
.langpick { top: calc(12px + env(safe-area-inset-top)); right: 12px; }
.langpick-btn { height: 40px; }
.langpick-menu { min-width: 200px; }
}
/* ═══ 🖼️ POZADIE KOLONKY (TOP Premium / Luxury Home) — tmavý prekryv, nech zlatý text ostane čitateľný ═══ */
.hometiles .sectile.has-img { position: relative; overflow: hidden; }
.hometiles .sectile.has-img::before {
content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
/* zľava tmavé (tam je text) → doprava jemnejšie; + celkové stmavenie fotky */
background: linear-gradient(90deg, rgba(6,5,3,.80) 0%, rgba(6,5,3,.55) 32%, rgba(6,5,3,.18) 62%, rgba(6,5,3,.32) 100%);
}
/* text a ikony nad prekryvom */
.hometiles .sectile.has-img > * { position: relative; z-index: 1; }
.hometiles .sectile.has-img .alb-title { text-shadow: 0 1px 5px rgba(0,0,0,.9), 0 0 2px rgba(0,0,0,.8); }
.hometiles .sectile.has-img .alb-sub { text-shadow: 0 1px 4px rgba(0,0,0,.9), 0 0 2px rgba(0,0,0,.75); }
.hometiles .sectile-top.has-img { box-shadow: 0 0 26px rgba(201,162,39,.34), inset 0 1px 0 rgba(255,255,255,.10); }
/* ===== ❤️ → „Napíš si o cenu" snackbar (obľúbené → dopyt jedným ťukom; najväčšia konverzná páka) ===== */
.favask { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 150%);
z-index: 10000; width: calc(100% - 24px); max-width: 440px; display: flex; flex-wrap: wrap; align-items: center; gap: 9px 11px;
padding: 11px 12px; border-radius: var(--r); background: linear-gradient(180deg, var(--panel-2), var(--panel));
border: 1px solid rgba(201, 162, 39, .42); box-shadow: 0 16px 44px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(201, 162, 39, .10);
opacity: 0; transition: transform .34s cubic-bezier(.2, .9, .25, 1), opacity .3s; pointer-events: none; }
.favask.show { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.favask .fa-thumb { width: 46px; height: 56px; flex: 0 0 auto; border-radius: var(--r-sm); overflow: hidden; background: #0c0d12; }
.favask .fa-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.favask .fa-body { flex: 1 1 auto; min-width: 0; }
.favask .fa-t { font-size: 13px; font-weight: 800; color: var(--accent-2); line-height: 1.25; }
.favask .fa-s { font-size: 11.5px; color: var(--muted, #9a93a6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.favask .fa-x { order: 2; flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; border: none; cursor: pointer;
background: rgba(255, 255, 255, .08); color: #cbbfd0; font-size: 13px; line-height: 1; }
.favask .fa-cta { order: 3; flex: 1 1 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
padding: 11px 13px; border: none; cursor: pointer; border-radius: var(--r-pill); font-size: 13px; font-weight: 800; color: #1a1204;
background: linear-gradient(180deg, var(--accent-2), var(--accent)); box-shadow: 0 4px 14px rgba(201, 162, 39, .4); }
.favask .fa-cta .e3d { width: 17px; height: 17px; vertical-align: -3px; }
html.light .favask { background: linear-gradient(180deg, #fffdf6, #faf5e8); border-color: var(--accent); box-shadow: 0 16px 44px rgba(90, 70, 20, .25); }
html.light .favask .fa-x { background: rgba(0, 0, 0, .06); color: #6b5a2a; }
/* ===== dôvera v košíku — „⭐ 5,0 · 60 spokojných klientok ✓" (znižuje váhanie pred nákupom) ===== */
.cart-trust .ct-sat { flex: 1 1 100%; display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700;
color: var(--accent-2); padding-bottom: 9px; margin-bottom: 1px; border-bottom: 1px solid rgba(201, 162, 39, .15); }
.cart-trust .ct-sat b { font-weight: 900; }
.cart-trust .ct-stars { color: #f0c24a; letter-spacing: 1px; font-size: 13px; }
.cart-trust .ct-sat .rv-vrf { color: #4ec77e; font-weight: 900; }
html.light .cart-trust .ct-sat { color: #7c6210; }
/* ===== výraznejšia registrácia — zlatý −20 % odznak + jemný pulz ===== */
.acctbanner .ab-mid { flex: 1 1 auto; min-width: 0; }
.ab-badge { flex: 0 0 auto; align-self: center; padding: 5px 11px; border-radius: var(--r-pill); font-weight: 900; font-size: 14.5px;
color: #2a1c04; background: linear-gradient(180deg, #ffe28c, #e6b23a); box-shadow: 0 3px 12px rgba(230, 178, 58, .5);
white-space: nowrap; letter-spacing: .2px; }
.acctbanner .ab-go { margin-left: 8px; }
.acctbanner-hot { animation: acctPulse 2.8s ease-in-out infinite; }
@keyframes acctPulse { 0%, 100% { box-shadow: 0 6px 20px rgba(120, 60, 160, .26); } 50% { box-shadow: 0 6px 28px rgba(201, 162, 39, .5); } }
@media (prefers-reduced-motion: reduce) { .acctbanner-hot { animation: none; } }
/* ═══ 🆕 NOVINKY — karty len s fotkou + WhatsApp CTA (bez ceny/košíka) ═══ */
.hometiles .sectile-nov { border-color: rgba(246,221,138,.7); box-shadow: 0 0 18px rgba(201,162,39,.20); }
.nv-card { position: relative; }
.nv-card .imgwrap { aspect-ratio: 3/4; border-radius: var(--r) var(--r) 0 0; }
.nv-card .nv-cta {
display: flex; align-items: center; justify-content: center; gap: 7px;
padding: 11px 8px; font-size: 13.5px; font-weight: 800; color: #12100a;
background: linear-gradient(180deg, #46d488, #2fae6a); border-radius: 0 0 var(--r) var(--r);
}
.nv-card .nv-cta svg { width: 17px; height: 17px; }
.nv-card:active { transform: scale(.98); }
@media (hover: hover) { .nv-card:hover .nv-cta { filter: brightness(1.05); } }
/* ═══════════ ✨ NOVÁ TITULKA V2 (Variant B) — tokeny referencie 1:1, scopované ═══════════ */
#homeV2{
--hvbg:#0b0a10; --hvcard:#14111a; --hvcard2:#181420;
--hvline:rgba(212,178,106,.34); --hvsoft:rgba(212,178,106,.16);
--hvgold:#d4b26a; --hvhi:#f2e2b3; --hvdeep:#9a7c3f;
--hvink:#f4eee0; --hvmut:#a89fb3; --hvdim:#7d7590; --hvjade:#8fd0ac;
max-width:560px; margin:0 auto; padding-bottom:8px;
}
body:not(.athome) #homeV2{ display:none !important; }
/* keď je V2 zapnutá: schovaj starú titulku, hero a sekčné pilulky (len na domove) */
body.hv2.athome .hometiles, body.hv2.athome .shop-hero, body.hv2.athome .snavwrap{ display:none !important; }
#homeV2 .hv-sec{ margin-top:24px; }
#homeV2 .hv-head{ display:flex; align-items:flex-end; justify-content:space-between; padding:0 18px 12px; }
#homeV2 .hv-eyebrow{ font-size:10px; font-weight:700; letter-spacing:.28em; text-transform:uppercase; color:var(--hvdeep); margin-bottom:4px; }
#homeV2 .hv-h2{ font-family:var(--serif,Georgia); font-weight:600; font-size:26px; line-height:1; color:var(--hvink); display:flex; align-items:center; gap:9px; margin:0; }
#homeV2 .hv-pill{ font-size:11.5px; font-weight:800; color:#241b08; background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); border-radius:var(--r-pill); padding:3px 9px; transform:translateY(-2px); font-family:inherit; }
#homeV2 .hv-more{ font-size:12.5px; font-weight:700; color:var(--hvgold); background:none; border:none; cursor:pointer; letter-spacing:.03em; padding:0 0 3px; white-space:nowrap; }
/* rail — VARIANT B: veľké karty ~1,5 na obrazovke */
#homeV2 .hv-rail{ display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 18px 10px; scrollbar-width:none;
-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%);
mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 14px),transparent 100%); }
#homeV2 .hv-rail::-webkit-scrollbar{ display:none; }
#homeV2 .hv-pcard{ flex:none; width:min(238px,62vw); scroll-snap-align:start; background:var(--hvcard); border:1px solid var(--hvsoft); border-radius:var(--r-lg); padding:8px 8px 13px; position:relative; text-decoration:none; color:inherit; cursor:pointer; text-align:left; font-family:inherit; }
#homeV2 .hv-pcard.hv-featured{ width:min(264px,69vw); border-color:var(--hvline); box-shadow:0 10px 34px rgba(212,178,106,.10); overflow:hidden; }
#homeV2 .hv-pcard.hv-featured::after{ content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(112deg,transparent 32%,rgba(242,226,179,.09) 50%,transparent 68%); transform:translateX(-120%); animation:hvsheen 6.5s ease-in-out infinite; }
@keyframes hvsheen{ 0%,55%{transform:translateX(-120%)} 75%,100%{transform:translateX(120%)} }
#homeV2 .hv-ph{ border-radius:var(--r); aspect-ratio:3/4; overflow:hidden; position:relative; background:radial-gradient(125% 95% at 30% 8%, #251e31 0%, #141019 56%, #0d0b12 100%); display:grid; place-items:center; }
#homeV2 .hv-ph img{ width:100%; height:100%; object-fit:cover; display:block; opacity:0; transition:opacity .35s; }
#homeV2 .hv-ph img.loaded{ opacity:1; }
#homeV2 .hv-badges{ position:absolute; top:14px; left:14px; display:flex; flex-direction:column; gap:6px; z-index:3; }
#homeV2 .hv-badge{ font-size:10px; font-weight:800; letter-spacing:.06em; border-radius:var(--r-pill); padding:4px 9px; width:max-content; backdrop-filter:blur(4px); }
#homeV2 .hv-bgold{ background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); color:#241b08; }
#homeV2 .hv-bnew{ background:rgba(14,12,19,.72); color:var(--hvhi); border:1px solid var(--hvline); }
#homeV2 .hv-bstock{ background:rgba(20,34,27,.78); color:var(--hvjade); border:1px solid rgba(143,208,172,.35); }
#homeV2 .hv-heart{ position:absolute; top:14px; right:14px; z-index:3; width:31px; height:31px; border-radius:50%; border:1px solid rgba(255,255,255,.14); background:rgba(12,10,17,.55); backdrop-filter:blur(4px); cursor:pointer; display:grid; place-items:center; transition:transform .15s; font-size:14px; line-height:1; color:#e9e2ef; }
#homeV2 .hv-heart:active{ transform:scale(.86); }
#homeV2 .hv-hint{ position:absolute; bottom:10px; left:50%; transform:translateX(-50%); z-index:3; font-size:10.5px; font-weight:700; color:var(--hvhi); white-space:nowrap; background:rgba(12,10,17,.66); border:1px solid var(--hvsoft); border-radius:var(--r-pill); padding:5px 11px; backdrop-filter:blur(4px); }
#homeV2 .hv-pmeta{ padding:10px 5px 0; }
#homeV2 .hv-pbrand{ font-size:10.5px; font-weight:800; letter-spacing:.2em; color:var(--hvdeep); text-transform:uppercase; }
#homeV2 .hv-pname{ font-family:var(--serif,Georgia); font-size:21px; font-weight:600; color:var(--hvink); margin-top:2px; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#homeV2 .hv-prow{ display:flex; align-items:baseline; justify-content:space-between; margin-top:6px; gap:8px; }
#homeV2 .hv-price{ font-size:17px; font-weight:800; color:var(--hvhi); letter-spacing:.01em; white-space:nowrap; }
#homeV2 .hv-psub{ font-size:10.5px; color:var(--hvdim); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#homeV2 .hv-endcap{ display:grid; place-items:center; width:156px; min-height:220px; border:1.5px dashed var(--hvsoft); background:transparent; border-radius:var(--r-lg); flex:none; scroll-snap-align:start; cursor:pointer; color:inherit; font-family:inherit; }
#homeV2 .hv-endcap .hv-big{ font-family:var(--serif,Georgia); font-size:19px; color:var(--hvhi); line-height:1.15; text-align:center; }
#homeV2 .hv-endcap .hv-sm{ font-size:11px; font-weight:700; color:var(--hvgold); margin-top:6px; text-align:center; }
/* chips */
#homeV2 .hv-chips{ display:flex; gap:8px; overflow-x:auto; padding:2px 18px 4px; margin-top:16px; scrollbar-width:none; }
#homeV2 .hv-chips::-webkit-scrollbar{ display:none; }
#homeV2 .hv-chip{ flex:none; display:inline-flex; align-items:center; gap:6px; cursor:pointer; font-family:inherit; font-size:12px; font-weight:700; color:var(--hvink); border:1px solid var(--hvsoft); border-radius:var(--r-pill); padding:9px 14px; background:rgba(20,17,26,.7); white-space:nowrap; }
#homeV2 .hv-chip .hv-c{ color:var(--hvgold); font-weight:800; }
#homeV2 .hv-chip.hv-on{ background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); color:#241b08; border-color:transparent; }
#homeV2 .hv-chip.hv-on .hv-c{ color:#241b08; }
/* kolekcie */
#homeV2 .hv-cats{ display:flex; flex-direction:column; gap:12px; padding:0 18px; }
#homeV2 .hv-cat{ display:flex; align-items:center; gap:15px; background:var(--hvcard); border:1px solid var(--hvsoft); border-radius:var(--r-lg); padding:14px 15px; text-decoration:none; color:inherit; position:relative; cursor:pointer; text-align:left; font-family:inherit; width:100%;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 200' preserveAspectRatio='none'%3E%3Cpath d='M-20 150 C 90 60, 210 240, 420 90' stroke='%23d4b26a' stroke-opacity='.14' fill='none' stroke-width='1.2'/%3E%3Cpath d='M-20 182 C 110 92, 240 262, 430 122' stroke='%23d4b26a' stroke-opacity='.08' fill='none' stroke-width='1'/%3E%3C/svg%3E"); background-size:cover; }
#homeV2 .hv-fan{ flex:none; width:104px; height:80px; position:relative; }
#homeV2 .hv-fan .hv-th{ position:absolute; width:60px; height:60px; border-radius:var(--r); overflow:hidden; border:1px solid var(--hvline); box-shadow:0 7px 16px rgba(0,0,0,.5); background:radial-gradient(130% 110% at 30% 10%, #241e30 0%, #131019 60%, #0d0b12 100%); }
#homeV2 .hv-fan .hv-th img{ width:100%; height:100%; object-fit:cover; display:block; opacity:0; transition:opacity .35s; }
#homeV2 .hv-fan .hv-th img.loaded{ opacity:1; }
#homeV2 .hv-fan .hv-f1{ left:0; top:10px; transform:rotate(-9deg); z-index:1; }
#homeV2 .hv-fan .hv-f2{ left:23px; top:2px; transform:rotate(1deg); z-index:2; }
#homeV2 .hv-fan .hv-f3{ left:46px; top:12px; transform:rotate(10deg); z-index:3; }
#homeV2 .hv-fan .hv-spin{ position:absolute; z-index:4; right:-2px; bottom:-2px; width:26px; height:26px; border-radius:50%; background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); display:grid; place-items:center; box-shadow:0 4px 10px rgba(0,0,0,.5); font-size:13px; }
#homeV2 .hv-cbody{ flex:1; min-width:0; }
#homeV2 .hv-cbody h3{ font-family:var(--serif,Georgia); font-weight:600; font-size:21px; color:var(--hvink); display:flex; align-items:center; gap:8px; line-height:1.05; margin:0; }
#homeV2 .hv-cbody h3 .hv-pill{ font-size:11px; padding:2.5px 8px; }
#homeV2 .hv-cbody p{ font-size:12.5px; color:var(--hvmut); margin:4px 0 0; line-height:1.45; }
#homeV2 .hv-chev{ flex:none; color:var(--hvgold); font-size:18px; font-weight:600; letter-spacing:-2px; opacity:.9; }
#homeV2 .hv-cat.hv-vip{ background:radial-gradient(120% 160% at 85% 0%, rgba(212,178,106,.14) 0%, transparent 55%), var(--hvcard2); border-color:var(--hvline); }
#homeV2 .hv-viplock{ flex:none; width:64px; height:64px; border-radius:50%; border:1.5px solid var(--hvline); background:linear-gradient(180deg,rgba(212,178,106,.14),rgba(212,178,106,.03)); display:grid; place-items:center; font-size:24px; }
#homeV2 .hv-vipcta{ flex:none; font-size:11.5px; font-weight:800; color:#241b08; text-align:center; background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); border-radius:var(--r-pill); padding:9px 13px; white-space:nowrap; }
/* minis */
#homeV2 .hv-minis{ display:flex; flex-direction:column; gap:8px; padding:0 18px; margin-top:12px; }
#homeV2 .hv-mini{ display:flex; align-items:center; gap:11px; text-decoration:none; color:inherit; border:1px solid rgba(212,178,106,.10); border-radius:var(--r); background:rgba(20,17,26,.55); padding:11px 14px; cursor:pointer; text-align:left; font-family:inherit; width:100%; }
#homeV2 .hv-mini .hv-em{ font-size:17px; flex:none; }
#homeV2 .hv-mini .hv-t{ flex:1; font-size:13px; font-weight:700; color:var(--hvink); min-width:0; }
#homeV2 .hv-mini .hv-t small{ display:block; font-size:11px; font-weight:600; color:var(--hvdim); margin-top:1px; }
#homeV2 .hv-mini .hv-chev{ font-size:15px; letter-spacing:0; }
/* trust + legal */
#homeV2 .hv-trust{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; padding:22px 18px 4px; }
#homeV2 .hv-titem{ font-size:11px; font-weight:700; color:var(--hvmut); border:1px solid rgba(212,178,106,.10); border-radius:var(--r-pill); padding:7px 11px; background:rgba(20,17,26,.5); }
#homeV2 .hv-titem b{ color:var(--hvhi); }
#homeV2 .hv-legal{ text-align:center; font-size:10.5px; color:var(--hvdim); padding:14px 26px 0; line-height:1.7; }
#homeV2 .hv-legal a{ color:var(--hvmut); text-decoration:none; border-bottom:1px solid rgba(255,255,255,.12); cursor:pointer; }
@media (prefers-reduced-motion:reduce){ #homeV2 .hv-pcard.hv-featured::after{ animation:none; } }
/* 🔲 sekčné bannery 2×2 — rozklikávacie okienka s dennou rotáciou fotiek */
#homeV2 .hv-ban{ margin:0 18px 12px; background:var(--hvcard); border:1px solid var(--hvsoft); border-radius:var(--r-lg); padding:12px 12px 10px; }
#homeV2 .hv-bhead{ display:flex; align-items:center; gap:8px; width:100%; background:none; border:none; cursor:pointer; padding:2px 4px 10px; text-align:left; font-family:inherit; color:inherit; }
#homeV2 .hv-bhead h3{ font-family:var(--serif,Georgia); font-weight:600; font-size:21px; color:var(--hvink); margin:0; flex:1; display:flex; align-items:center; gap:8px; line-height:1.05; }
#homeV2 .hv-bhead .hv-pill{ font-size:11px; padding:2.5px 8px; }
#homeV2 .hv-quadrail{ display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; }
#homeV2 .hv-quadrail::-webkit-scrollbar{ display:none; }
#homeV2 .hv-qpage{ flex:none; width:100%; scroll-snap-align:start; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(var(--hvq-rows,2),1fr); gap:8px; }
#homeV2 .hv-q{ position:relative; aspect-ratio:1/1; border-radius:var(--r); overflow:hidden; border:1px solid var(--hvsoft); background:radial-gradient(130% 110% at 30% 10%, #241e30 0%, #131019 60%, #0d0b12 100%); cursor:pointer; padding:0; display:block; }
#homeV2 .hv-q img{ width:100%; height:100%; object-fit:cover; display:block; opacity:0; transition:opacity .3s; }
#homeV2 .hv-q img.loaded{ opacity:1; }
#homeV2 .hv-qlbl{ position:absolute; left:6px; bottom:6px; max-width:calc(100% - 12px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10.5px; font-weight:800; color:var(--hvhi); background:rgba(12,10,17,.7); border:1px solid var(--hvsoft); border-radius:var(--r-pill); padding:3px 9px; backdrop-filter:blur(4px); pointer-events:none; }
#homeV2 .hv-qdots{ display:flex; justify-content:center; gap:5px; padding:9px 0 2px; }
#homeV2 .hv-qdots i{ width:5px; height:5px; border-radius:50%; background:rgba(212,178,106,.25); transition:.2s; }
#homeV2 .hv-qdots i.on{ background:var(--hvgold); width:14px; border-radius:var(--r-pill); }
/* placeholder kým dobehnú dáta sekcie — jemný shimmer, bez preblikávania */
#homeV2 .hv-ban-empty .hv-qpage{ --hvq-rows:2; }
#homeV2 .hv-ban-empty .hv-q{ animation:hvshim 1.6s ease-in-out infinite; }
@keyframes hvshim{ 0%,100%{ opacity:.55 } 50%{ opacity:.95 } }
#homeV2 .hv-head-sm{ padding-bottom:8px; }
/* rotujúci trust-chip vľavo hore odstránený z UI (rušil) — element ostáva v DOM kvôli JS guardom */
.trust-chip{ display:none !important; }
/* 👉 viditeľné posúvanie a klikateľnosť okien vo feede */
#homeV2 .hv-quadrail.hv-multi .hv-qpage{ width:calc(100% - 34px); } /* okraj ďalšej štvorice vykúka */
#homeV2 .hv-qgo{ position:absolute; right:6px; bottom:6px; width:22px; height:22px; border-radius:50%;
background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); color:#241b08; display:grid; place-items:center;
font-size:13px; font-weight:800; line-height:1; box-shadow:0 3px 9px rgba(0,0,0,.45); pointer-events:none; }
#homeV2 .hv-q .hv-qlbl{ max-width:calc(100% - 36px); } /* label neprekryje šípku */
/* 🔢 počty kusov v hlavičkách bannerov — výraznejšie */
#homeV2 .hv-bhead .hv-pill{ font-size:13.5px; padding:4px 12px; box-shadow:0 2px 10px rgba(212,178,106,.35); }
/* 🔢 počet kusov v pravom hornom rohu okienka */
#homeV2 .hv-qn{ position:absolute; top:6px; right:6px; z-index:3; font-size:10.5px; font-weight:800; letter-spacing:.02em;
color:#241b08; background:linear-gradient(180deg,var(--hvhi),var(--hvgold)); border-radius:var(--r-pill); padding:3px 8px;
box-shadow:0 3px 9px rgba(0,0,0,.45); pointer-events:none; }
/* ============================================================
✦ LUXURY CALM II — dokončenie upratovania animácií.
Luxus = pokoj: žiadne trvalé pulzy/glow/kývanie, ktoré kričia
„klikni na mňa". Ostávajú: vstupné prechody (cardin, imup, lpIn),
sheen (hvsheen), srdiečko (heartpop), spinnery, validácie
(szshake, wgshake), ambient (ambientDrift) a kontextové hinty.
Návrat ktorejkoľvek: vymaž jej prázdny riadok tu.
============================================================ */
@keyframes imbob {}
@keyframes imring {}
@keyframes igpulse {}
@keyframes stpulse {}
@keyframes notifpulse {}
@keyframes snavnudge {}
@keyframes arrownudge {}
@keyframes fabpulse {}
@keyframes salepulse {}
@keyframes salehic {}
@keyframes salebnrGlow {}
@keyframes flashpulse {}
@keyframes valpulse {}
@keyframes acctPulse {}