nejde ani klikat na logo ani to vyhladanie .fc-video-row{ display:flex; gap:12px; margin-top:14px; width:100%; }
.p-image-wrapper .fc-video-row{ flex:0 0 100%; }

.fc-video-thumb{ position:relative; border:1px solid #eee; background:#fff; border-radius:14px; padding:6px; cursor:pointer; }
.fc-video-thumb__inner{ width:76px; height:76px; border-radius:10px; overflow:hidden; background:#f7f7f7; display:flex; align-items:center; justify-content:center; }
.fc-video-thumb__placeholder{ width:38px; height:38px; border-radius:50%; background: radial-gradient(circle at 35% 35%, #fff, #e6e0dc); position:relative; }
.fc-video-thumb__placeholder:after{ content:""; position:absolute; left:38%; top:28%; width:0; height:0; border-left:14px solid #b37a67; border-top:10px solid transparent; border-bottom:10px solid transparent; }
.fc-video-badge{ position:absolute; right:8px; bottom:8px; padding:3px 8px; font-size:12px; border-radius:999px; background:#c88f7c; color:#fff; text-transform:lowercase; letter-spacing:.3px; }
.fc-video-frame{ position:relative; width:100%; aspect-ratio:4/5; background:#000; border-radius:12px; overflow:hidden; }
.fc-video-frame iframe, .fc-video-frame video{ width:100%; height:100%; border:0; display:block; }


/* KONTAJNER STRÁNKY */
.season-hits{
  max-width: 1220px;
  margin: 0 auto;
  padding: 12px 16px;
}

/* LAYOUT: veľká plocha pre video, pravý stĺpec s produktmi */
.season-hits .video-gallery{
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) 380px; /* 1.6x širšie video */
  gap: 32px;
  align-items: start;
}

/* RÁM VIDEA – udrží pevný pomer a NAŤAHUJE sa na šírku stĺpca */
.season-hits .video-wrapper{
  width: 100%;
  aspect-ratio: 16 / 9;           /* veľké 16:9 okno */
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
  background: #f5f5f5;
}

/* VIDEO na celú plochu rámu */
.season-hits .video-wrapper video{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;               /* žiadne okraje, pekné orezanie */
  display: block;
}

/* KARTY PRODUKTOV */
.season-hits .products-wrapper{ display: flex; flex-direction: column; gap: 20px; }
.season-hits .product-card{ background:#f7f7f7; border-radius:12px; padding:16px; }

/* MOBIL/TABLET – produkty pod video, video zostáva veľké */
@media (max-width: 1024px){
  .season-hits .video-gallery{ grid-template-columns: 1fr; }
  .season-hits .products-wrapper{ order: 2; }
}

/* Ak ti Shoptet niekde „škrtí“ výšku/šírku videa, tieto dva rady zvyknú pomôcť: */
.season-hits video, .season-hits iframe{
  max-width: 100% !important;
}








/* ================= FASHIONCAFFE – NAV + LOGO + IKONY (DESKTOP) ================= */
:root{
  /* > doladenie len tu: */
  --nav-h: 64px;                 /* o trochu vyšší (pôvodne 56px) */
  --logo-h: calc(var(--nav-h) - 18px); /* logo sa samo prispôsobí výške lišty */
  --logo-w: 180px;               /* rezerva vľavo pre logo (dolaď podľa potreby) */
  --logo-url: url("https://www.fashioncaffe.sk/user/documents/logobez.png");
}

@media (min-width: 992px){

  /* --- Fixná lišta pri scrollovaní -------------------------------------- */
  header#header{
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 999 !important;
  }
  /* nech obsah nezačne pod lištou „podliezať“ */
  body{ padding-top: var(--nav-h) !important; }

  /* --- Zruš „nafukovanie“ a medzery ------------------------------------- */
  #header .header-bottom,
  #header .header-bottom .navigation-wrapper,
  #header .header-bottom nav#navigation,
  #header .header-bottom nav#navigation .menu-level-1{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
  }
  #header .header-bottom{ border: 0 !important; }

  /* --- Zraz header-top (logo hore vypneme) ------------------------------- */
  #header .header-top{
    position: relative;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: visible; /* ikony môžu „pretekať“ dolu do lišty */
  }
  #header .header-top .site-name{ display: none !important; }

  /* --- Ikony zaves do lišty --------------------------------------------- */
  #header .header-top .navigation-buttons{
    position: absolute;
    right: 0;
    bottom: calc(-1 * var(--nav-h));
    height: var(--nav-h);
    display: flex;
    align-items: center;
    gap: 8px;
    transform: none !important;
    z-index: 45;
  }
  #header .header-top .navigation-buttons a{
    width: 50px;
    height: var(--nav-h) !important;
    line-height: var(--nav-h) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* --- Farba pozadia lišty + fix „skoku“ -------------------------------- */
  #header .header-bottom,
  #header .header-bottom .header-bottom-wrapper,
  #header .header-bottom .navigation-wrapper{
    background-color: var(--color-primary) !important; /* ružová z témy */
  }
  #header .header-bottom .header-bottom-wrapper::before,
  #header .header-bottom .navigation-wrapper::after{
    content: none !important;
    display: none !important;
  }

  #header .header-bottom,
  #header .header-bottom .navigation-wrapper{
    min-height: var(--nav-h) !important;
    height: var(--nav-h) !important;
    line-height: var(--nav-h) !important;
  }

  /* --- LOGO – absolútne nad obsahom, čo najväčšie do lišty -------------- */
  #header .header-bottom .navigation-wrapper{
    position: relative !important;
    padding-left: calc(var(--logo-w) + 12px) !important; /* miesto pre logo */
    overflow: visible !important;
    z-index: 40;
  }
  #header .header-bottom .navigation-wrapper::before{
    content: "" !important;
    position: absolute !important;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: var(--logo-w);
    height: var(--logo-h);                    /* využije takmer celú výšku */
    background-image: var(--logo-url);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto var(--logo-h);      /* škáluje podľa výšky lišty */
    z-index: 120 !important;
    pointer-events: none;
    display: block !important;
  }

  /* preventívne vypneme staré pseudo-logá zo šablóny */
  #header .header-bottom .site-name,
  #header .header-bottom .site-name::before,
  #header .header-bottom .site-name::after{
    display: none !important;
    content: none !important;
  }

  /* --- Menu ako klasické (nie hamburger) -------------------------------- */
  #header .toggle-window[data-target="navigation"]{ display: none !important; }

  #header .header-bottom nav#navigation{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    background: transparent !important; /* aby nekrylo logo zľava */
    flex: 1 1 auto;
  }

  #header .header-bottom nav#navigation .menu-level-1{
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 170px 0 0 !important; /* rezerva vpravo pre ikony */
  }
  #header .header-bottom nav#navigation .menu-level-1 > li{ margin: 0 !important; }
  #header .header-bottom nav#navigation .menu-level-1 > li > a{
    height: var(--nav-h) !important;
    line-height: var(--nav-h) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 16px !important;
    white-space: nowrap;
    border: 0 !important;
  }

  /* --- Podmenu nad sliderom --------------------------------------------- */
  #navigation .menu-level-2,
  #navigation .menu-level-3{ z-index: 60; }
}

/* Poistka – keby v šablóne niekde zostal .site-name v header-bottom */
#header .header-bottom .site-name{
  position: static !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
  pointer-events: auto !important;
}


:root{
  --font-serif: "Italiana", serif;
  --font-sans: "Inter", sans-serif;
}

html, body {
  font-family: var(--font-sans);
  line-height: 1.6;
  color: #222;
}

/* Luxusné nadpisy */
h1, h2, h3, h4, h5, h6,
.carousel .extended-banner-title,
.fc2-title {
  font-family: var(--font-serif);
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: none;   /* nech pôsobí jemnejšie */
}

/* Podtitulky a menšie texty */
.carousel .extended-banner-text,
.fc2-overline {
  font-family: var(--font-sans);
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* Navigácia a tlačidlá */
button, .btn, .fc2-btn,
nav a, .navigation a, .menu a {
  font-family: var(--font-sans);
  font-weight: 500;
  letter-spacing: .04em;
}







/* === MEGA MENU – FULL WIDTH, BEZ „SKÁKANIA“ ============================ */
@media (min-width: 992px){
  /* rodič li položiek nech je static, aby sa podmenu vedelo „odpojiť“ */
  #navigation .menu-level-1 > li{ position: static !important; }

  /* samotný panel podkategórií natiahnuť cez celú šírku okna */
  #navigation .menu-level-1 > li > ul.menu-level-2{
    position: fixed !important;     /* odviažeme od šírky navu */
    left: 0; right: 0;
    top: var(--nav-h);              /* hneď pod lištou */
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding: 24px 6vw !important;   /* vnútorné okraje (podľa oka) */
    background: #fff !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
    z-index: 1100 !important;       /* nad sliderom */
  }

  /* zrušiť šípky/pseudo prvky od šablóny, ktoré robia artefakty */
  #navigation .menu-level-2::before,
  #navigation .menu-level-2::after{
    content: none !important; display:none !important;
  }

  /* keď menu nie je otvorené, nenechávaj panel visieť */
  #navigation .menu-level-1 > li:not(:hover) > ul.menu-level-2{
    display: none !important;
  }
}

/* === VYHĽADÁVANIE – PREKRYTIE HEADERA (CLICK/FOKUS FIX) ================= */

/* Shoptet pri fulltext okne dáva telu jednu z týchto tried – pokryjeme všetky
   prípady, aby bolo okno nad headerom. Nižšie z-index headeru počas okna
   alebo zvýšime z-index okna (obe riešenia pre istotu). */
.window-visible header#header,
body.search-open header#header,
body.fulltext-open header#header{
  z-index: 10 !important;           /* header do úzadia, aby „nebránil“ klikom */
}

/* samotné okno vyhľadávania povyš na istotu */
.fulltext-window,
.fulltext-window *,
.search-window,
.search-window *{
  z-index: 2000 !important;
}

/* poistka: naše vložené logo (pseudo-element) určite neblokuje kliky */
#header .header-bottom .navigation-wrapper::before{
  pointer-events: none !important;
}

/* poistka: oblasť s ikonami nech prijíma kliky, ale nie je „plachtou“ */
#header .header-top .navigation-buttons{
  pointer-events: auto !important;
}

/* === Vyhľadávacie okno nad overlayom ================================= */
.fulltext-window,
.search-window {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  z-index: 99999 !important;  /* úplne navrch */
  pointer-events: auto !important;
}

.fulltext-window *,.search-window * {
  pointer-events: auto !important;
}

/* Overlay nech stmavuje, ale neblokuje kliky */
.overlay,
.window-overlay,
.modal-overlay,
.backdrop,
.shade {
  pointer-events: none !important;
}


/* Klikateľná oblasť pre logo */
#header .header-bottom .navigation-wrapper::after{
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: var(--logo-w);
  height: var(--logo-h);
  z-index: 150;
  background: url("https://www.fashioncaffe.sk/") no-repeat; /* hack na odkaz */
}














/* ================= FASHIONCAFFE — LUX-MIN SEKCIE ================= */
:root{
  --fc-bg:#fff;
  --fc-ink:#121212;
  --fc-ink-2:#6b6b6b;
  --fc-line:#e9e9e9;
  --fc-gold:#c8a96a;          /* tvoj akcent */
  --fc-primary:#1e1e1e;       /* tmavý akcent pre tlačidlá */
  --fc-secondary:#8d8d8d;     /* sekundárny badge */
  --fc-radius:22px;
  --fc-gap:24px;
}

/* shared primitives */
.fc-kicker{
  display:inline-block;
  font:600 12px/1.2 var(--ui,Inter,Manrope,system-ui);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--fc-gold);
  margin-bottom:10px;
}
.fc-title{
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1.1;
  color: var(--fc-ink);
  margin: 0 0 14px 0;
}
.fc-lead{
  font: 400 clamp(14px,1.5vw,17px)/1.6 var(--ui,Inter,Manrope,system-ui);
  color: var(--fc-ink-2);
  margin: 0 0 22px 0;
}
.fc-actions{ display:flex; gap:12px; flex-wrap:wrap; }

.fc-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 18px; border-radius:999px; text-decoration:none;
  font:600 14px/1 var(--ui,Inter,Manrope,system-ui);
  border:1px solid transparent;
  transition: transform .25s ease, background-color .25s ease, color .25s ease, border-color .25s ease;
}
.fc-btn--primary{
  background:var(--fc-primary); color:#fff; border-color:var(--fc-primary);
}
.fc-btn--primary:hover{ transform: translateY(-1px); }
.fc-btn--ghost{
  background:transparent; color:var(--fc-ink);
  border-color: var(--fc-line);
}
.fc-btn--ghost:hover{ border-color: var(--fc-ink); }

/* ========== Sekcia 1: EDITORIAL SPLIT ========== */
.fc-editorial{ background:var(--fc-bg); padding: clamp(26px, 4vw, 56px) 0; }
.fc-ed-wrap{
  width:min(1200px, 92vw); margin:0 auto;
  display:grid; gap:var(--fc-gap);
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
}
.fc-ed-col{ min-width:0; }
.fc-ed-text{ padding: clamp(8px,1vw,12px); }
.fc-ed-text .fc-title{ position:relative; }
.fc-ed-text .fc-title::after{
  content:""; display:block; width:78px; height:2px; background:var(--fc-gold);
  margin: 14px 0 0 0;
}
.fc-ed-visual{ border-radius: var(--fc-radius); overflow: clip; position:relative; }
.fc-ed-img{
  aspect-ratio: 4/5; width:100%;
  background-image: var(--img);
  background-size: cover; background-position: center;
  transform: scale(1.01);
  transition: transform .6s ease;
}
.fc-ed-visual:hover .fc-ed-img{ transform: scale(1.035); }

@media (max-width: 991px){
  .fc-ed-wrap{ grid-template-columns: 1fr; }
  .fc-ed-img{ aspect-ratio: 16/9; }
}

/* ========== Sekcia 2: CURATED CAPSULES (3 cards) ========== */
.fc-capsules{ background:var(--fc-bg); padding: 10px 0 clamp(26px,4vw,56px); }
.fc-caps-grid{
  width:min(1200px, 92vw); margin:0 auto;
  display:grid; gap: var(--fc-gap);
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 991px){
  .fc-caps-grid{ grid-template-columns: 1fr; }
}

.fc-cap{
  display:flex; flex-direction:column; gap:14px;
  text-decoration:none; color:inherit;
}
.fc-cap-media{
  border-radius: var(--fc-radius);
  overflow: clip; position:relative;
  background-image: var(--img);
  background-size: cover; background-position: center;
  aspect-ratio: 4/5;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
  transition: transform .45s ease, box-shadow .45s ease;
}
.fc-cap:hover .fc-cap-media{
  transform: translateY(-3px);
  box-shadow: 0 16px 36px rgba(0,0,0,.10);
}
.fc-cap-body{
  padding: 0 6px;
}
.fc-cap-title{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:600; font-size: clamp(18px,2vw,22px);
  margin:8px 0 2px 0; line-height:1.25;
}
.fc-cap-sub{
  font: 400 14px/1.6 var(--ui,Inter,Manrope,system-ui);
  color: var(--fc-ink-2); margin:0;
}

/* pills */
.fc-pill{
  display:inline-block;
  padding:6px 12px; border-radius:999px;
  font:600 11px/1 var(--ui,Inter,Manrope,system-ui);
  letter-spacing:.08em; text-transform:uppercase;
  background:#f4f4f4; color:#333; border:1px solid #e6e6e6;
}
.fc-pill--primary{
  background: var(--fc-primary); color:#fff; border-color: var(--fc-primary);
}
.fc-pill--secondary{
  background: #f0f0f0; color:#222; border-color:#e5e5e5;
}

/* jemná hranica medzi sekciami (ak chceš) */
.fc-editorial + .fc-capsules{ border-top:1px solid var(--fc-line); }











/* ===== FASHIONCAFFE – PALETA & KONTRAST FIX ===== */
:root{
  --fc-bg:#ffffff;
  --fc-ink:#141414;         /* hlavný text (tmavý) */
  --fc-ink-2:#4f4f4f;       /* sekundárny text – lepší kontrast */
  --fc-line:#ececec;        /* jemné línie */
  --fc-gold:#c8a96a;        /* tvoja zlatá */
  --fc-blush:#f6e7e2;       /* jemná peach/blush k hlavičke webu */
  --fc-primary:#141414;     /* primárne tlačidlo */
  --fc-secondary:#a7a7a7;   /* neutrál na pilule/okraje */
  --fc-radius:22px;
  --fc-gap:24px;
}

/* základná typografia + vyhladenie fontov */
.fc-editorial, .fc-capsules{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  color: var(--fc-ink);
}

/* ---------- Titulky, odseky, kicker ---------- */
.fc-title{
  color: var(--fc-ink) !important;
  letter-spacing: 0.1px;
}
.fc-lead{
  color: var(--fc-ink-2) !important;
}
.fc-kicker{
  color: var(--fc-gold) !important;
  opacity: .95;
}

/* dekoratívna linka pod titulkom – zlatá, jemná */
.fc-ed-text .fc-title::after{
  background: linear-gradient(90deg, var(--fc-gold), transparent 85%);
}

/* ---------- Tlačidlá (kontrast + !important proti témam) ---------- */
.fc-btn{
  border-radius: 999px;
  font-weight: 600;
}
.fc-btn--primary{
  background: var(--fc-primary) !important;
  border-color: var(--fc-primary) !important;
  color: #fff !important;
}
.fc-btn--primary:hover{ transform: translateY(-1px); }

.fc-btn--ghost{
  background: transparent !important;
  border-color: var(--fc-line) !important;
  color: var(--fc-ink) !important;
}
.fc-btn--ghost:hover{
  border-color: var(--fc-ink) !important;
}

/* ---------- Editorial vizuál (jemnejší “lux” pocit) ---------- */
.fc-editorial{ 
  background: var(--fc-bg);
  padding: clamp(26px, 4vw, 56px) 0;
}
.fc-ed-img{
  filter: saturate(.96) contrast(1.02);
  border-radius: var(--fc-radius);
}
.fc-ed-visual{ border-radius: var(--fc-radius); overflow: clip; }

/* voliteľné: svetlý blush “halo” za textovým blokom na XL */
@media (min-width: 1200px){
  .fc-ed-text{
    position: relative;
  }
  .fc-ed-text::before{
    content:""; position:absolute; inset:-12px -24px -12px -24px; z-index:-1;
    background: radial-gradient(1200px 300px at 20% 10%, rgba(246,231,226,.45), transparent 60%);
    border-radius: 28px;
    filter: blur(1px);
  }
}

/* ---------- Cards / Capsules (lepší kontrast textov) ---------- */
.fc-cap-title{ color: var(--fc-ink) !important; }
.fc-cap-sub{ color: var(--fc-ink-2) !important; }
.fc-cap-media{
  border-radius: var(--fc-radius);
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* pilule – primárna zlatá s tmavým textom pre lux look */
.fc-pill{
  background:#f4f4f4; color:#222; border:1px solid #e6e6e6;
}
.fc-pill--primary{
  background: var(--fc-gold) !important;
  border-color: var(--fc-gold) !important;
  color: #141414 !important;
}
.fc-pill--secondary{
  background:#efefef; color:#232323; border-color:#e3e3e3;
}

/* ---------- Grid responsívne (bez zmeny HTML) ---------- */
.fc-ed-wrap{
  width:min(1200px, 92vw); margin:0 auto;
  display:grid; gap:var(--fc-gap);
  grid-template-columns: 1.05fr .95fr;
  align-items:center;
}
@media (max-width: 991px){
  .fc-ed-wrap{ grid-template-columns:1fr; }
  .fc-ed-img{ aspect-ratio: 16/9; }
}

.fc-capsules{ background: var(--fc-bg); padding: 10px 0 clamp(26px,4vw,56px); }
.fc-caps-grid{
  width:min(1200px, 92vw); margin:0 auto;
  display:grid; gap: var(--fc-gap);
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 991px){
  .fc-caps-grid{ grid-template-columns:1fr; }
}

/* jemná deliaca línia medzi sekciami */
.fc-editorial + .fc-capsules{ border-top:1px solid var(--fc-line); }



























<!-- ===== Fashion Caffe – doplnkové sekcie ===== -->
/* ——— ZÁKLAD ——— */
:root{
  --fc-bg:#fff;
  --fc-ink:#1b1b1b;
  --fc-muted:#6b6b6b;
  --fc-accent:#c8a96a;         /* tvoja zlatá */
  --fc-soft:#f7f4f1;           /* jemné pozadie */
}
.fc-wrap{font-family: "Playfair Display", ui-serif, Georgia, serif; color:var(--fc-ink);}

/* ——— 1) USP lišta ——— */
.fc-usp{
  background:var(--fc-soft);
  border:1px solid #e9e2dc;
  border-radius:16px;
  padding:14px 18px;
  display:grid; gap:10px;
  grid-template-columns:1fr; text-align:center;
}
.fc-usp .item{display:flex; align-items:center; justify-content:center; gap:10px; font-size:15px}
.fc-usp .icon{width:22px;height:22px; display:inline-block; border:1px solid var(--fc-accent); border-radius:50%; position:relative}
.fc-usp .icon::after{content:""; position:absolute; inset:5px; border-radius:50%; background:var(--fc-accent)}
@media(min-width:768px){ .fc-usp{grid-template-columns:repeat(4,1fr);} }

/* ——— 2) SHOP THE LOOK ——— */
.fc-looks{display:grid; gap:24px; margin-top:26px}
@media(min-width:992px){ .fc-looks{grid-template-columns:repeat(3,1fr);} }
.fc-look{
  border:1px solid #eee; border-radius:18px; overflow:hidden; background:#fff;
  display:flex; flex-direction:column;
}
.fc-look img{width:100%; aspect-ratio:3/4; object-fit:cover; display:block}
.fc-look .body{padding:18px}
.fc-look h3{font-size:22px; margin:0 0 8px}
.fc-look p{margin:0 0 14px; color:var(--fc-muted); font-size:15px; line-height:1.5}
.fc-btn{
  display:inline-block; padding:10px 14px; border:1px solid var(--fc-accent);
  border-radius:999px; font-size:14px; text-decoration:none; color:var(--fc-ink);
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.fc-btn:hover{ transform:translateY(-1px); background:var(--fc-accent); color:#fff; }

/* ——— 3) BOUTIQUE / MAPA ——— */
.fc-boutique{
  display:grid; gap:20px; align-items:stretch; margin-top:26px;
  background:linear-gradient(180deg,#fff, #faf7f4);
  border:1px solid #eee; border-radius:18px; padding:18px;
}
@media(min-width:992px){ .fc-boutique{grid-template-columns:1.1fr .9fr;} }
.fc-card{background:#fff; border:1px solid #eee; border-radius:16px; padding:18px}
.fc-title{font-size:26px; margin:0 0 8px}
.fc-sub{color:var(--fc-muted); margin:0 0 16px; font-size:15px}
.fc-list{margin:0; padding:0; list-style:none; display:grid; gap:8px}
.fc-badge{display:inline-block; padding:6px 10px; background:var(--fc-soft); border:1px solid #e9e2dc; border-radius:999px; font-size:13px}
.fc-cta{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.fc-cta .primary{background:var(--fc-accent); color:#fff; border-color:var(--fc-accent)}
.fc-iframe{width:100%; height:320px; border:0; border-radius:14px}



































/* ========== FASHIONCAFFE – HIGHLIGHT COLLECTION (site palette) ========== */
:root{
  /* vychádza z tvojej palety */
  --fc-bg:#ffffff;
  --fc-ink:#141414;
  --fc-ink-2:#4f4f4f;
  --fc-gold:#c8a96a;
  --fc-blush:#f6e7e2;
  --fc-radius:22px;
  --fc-gap:24px;
}

.fc-highlight{ background:#fff; padding: clamp(28px,5vw,64px) 0; }
.fc-hl-wrap{
  width:min(1200px,92vw); margin:0 auto;
  display:grid; gap:var(--fc-gap);
  grid-template-columns: 2fr 1fr; align-items:stretch;
}
@media (max-width:991px){ .fc-hl-wrap{ grid-template-columns:1fr; } }

/* hero */
.fc-hl-main{ position:relative; display:block; border-radius:var(--fc-radius); overflow:hidden; }
.fc-hl-img{
  width:100%; aspect-ratio: 4/3;
  background-image:var(--img); background-size:cover; background-position:center;
  transition: transform .6s ease, filter .6s ease;
  filter: saturate(.98) contrast(1.03);
}
.fc-hl-main:hover .fc-hl-img{ transform:scale(1.03); }
.fc-hl-overlay{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end;
  padding: clamp(18px,2.2vw,32px);
  background: linear-gradient(to top, rgba(0,0,0,.58), rgba(0,0,0,0) 55%);
  color:#fff;
}
.fc-hl-title{
  font-family:"Playfair Display",serif; font-weight:600;
  font-size: clamp(24px,3vw,38px); margin:0;
}
.fc-hl-title span{ color: var(--fc-gold); }
.fc-hl-sub{ margin:.35rem 0 0 0; font: 400 15px/1.5 Inter,Manrope,system-ui; color: rgba(255,255,255,.92); }

/* side cards */
.fc-hl-side{ display:grid; gap:var(--fc-gap); }
.fc-hl-card{ position:relative; display:block; border-radius:var(--fc-radius); overflow:hidden; }
.fc-hl-card .fc-hl-img{
  aspect-ratio: 1/1;
  background-image:var(--img); background-size:cover; background-position:center;
  transition: transform .6s ease, filter .6s ease;
}
.fc-hl-card:hover .fc-hl-img{ transform: scale(1.05); }

.fc-hl-body{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  padding: 18px;
  background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 60%);
  text-align:center;
}
.fc-hl-small{
  font-family:"Playfair Display",serif; font-weight:600; letter-spacing:.2px;
  font-size: clamp(17px,1.8vw,20px); color:#fff; margin:0;
}
.fc-hl-tag{
  margin-top:6px; font: 600 11px/1 Inter,Manrope,system-ui; letter-spacing:.08em;
  text-transform:uppercase; color:#141414; background: var(--fc-gold);
  padding:6px 10px; border-radius:999px;
}

/* jemný “halo” ak chceš nadviazať na hlavičku */
@media (min-width:1200px){
  .fc-highlight{ position:relative; }
  .fc-highlight::before{
    content:""; position:absolute; inset:auto 0 -12px 0; height:1px; background:#ececec;
  }
}


























/* ================= FASHIONCAFFE – FOOTER ================= */
:root{
  --fcf-peach: #f6b29c;         /* hlavné pozadie (jemne koriguj podľa webu) */
  --fcf-ink:   #1a1a1a;         /* text */
  --fcf-ink-2: #5a5a5a;         /* sekundárny text */
  --fcf-gold:  #c8a96a;         /* akcentová zlatá */
  --fcf-line:  #e7d2ca;         /* jemné deliace línie na peach */
  --fcf-card:  rgba(255,255,255,0.35);
  --fcf-radius: 20px;
}

.fcf-footer{
  background: var(--fcf-peach);
  color: var(--fcf-ink);
  padding: 36px 0 18px;
  font-family: Inter, Manrope, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.fcf-wrap{
  width: min(1200px, 92vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr 1fr 1.2fr;
  gap: 28px;
  align-items: start;
}
@media (max-width: 991px){
  .fcf-wrap{ grid-template-columns: 1fr; gap: 22px; }
}

/* stĺpce */
.fcf-col{
  background: transparent;
  padding: 8px 0;
}
.fcf-h{
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  font-size: 22px;
  margin: 0 0 8px;
}
.fcf-underline{
  display:block; width:44px; height:3px; border-radius:3px;
  background: linear-gradient(90deg, var(--fcf-gold), transparent 80%);
  margin-bottom: 12px;
}

/* zoznamy */
.fcf-list, .fcf-links{
  list-style:none; padding:0; margin:0; 
  display:flex; flex-direction:column; gap:8px;
}
.fcf-list a, .fcf-links a{
  color: var(--fcf-ink); text-decoration:none;
}
.fcf-links a{ color: var(--fcf-ink-2); }
.fcf-list a:hover, .fcf-links a:hover{ text-decoration: underline; }

/* social */
.fcf-social{ display:flex; gap:10px; margin-top:14px; }
.fcf-soc{
  width:36px; height:36px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; color:#222; font-weight:700; text-decoration:none;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
  transition: transform .15s ease;
}
.fcf-soc:hover{ transform: translateY(-2px); }

/* highlight box */
.fcf-highlight{
  text-align:center;
  background: var(--fcf-card);
  backdrop-filter: blur(2px);
  padding: 18px;
  border-radius: var(--fcf-radius);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.fcf-kicker{
  font-weight: 700; letter-spacing: .14em; text-transform:uppercase;
  font-size: 11px; color: rgba(0,0,0,.6);
}
.fcf-title{
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600; font-size: clamp(22px, 3vw, 32px);
  margin: 6px 0 6px; color: var(--fcf-ink);
}
.fcf-lead{ color: #2a2a2a; margin: 0 0 6px; }
.fcf-hours{ color: rgba(0,0,0,.6); margin-bottom: 12px; }

.fcf-cta{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.fcf-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 10px 16px; border-radius: 999px; font-weight: 600;
  background: #9d6f5f; color:#fff; text-decoration:none; border:1px solid transparent;
  transition: transform .15s ease, filter .15s ease;
}
.fcf-btn:hover{ transform: translateY(-1px); filter: brightness(1.05); }
.fcf-btn--ghost{
  background: transparent; color: var(--fcf-ink);
  border-color: rgba(0,0,0,.15);
}
.fcf-btn--ghost:hover{ border-color: rgba(0,0,0,.35); }

/* spodok */
.fcf-bottom{
  border-top: 1px solid var(--fcf-line);
  margin-top: 28px;
  padding-top: 12px;
  color: rgba(0,0,0,.75);
  font-size: 14px;
}
.fcf-bottom-wrap{
  width:min(1200px,92vw); margin:0 auto;
  display:flex; justify-content:space-between; align-items:center;
  gap:10px; flex-wrap:wrap;
}
.fcf-bottom a{ color: rgba(0,0,0,.85); text-decoration: underline; }



/* --- FOOTER: zruš svetlý podklad za „Kontakt“ (1. stĺpec) --- */
.fcf-footer .fcf-wrap > .fcf-col:first-child{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  backdrop-filter: none !important;
}

/* ak to robil pseudo-element / dekoratívna línia vnútri stĺpca */
.fcf-footer .fcf-wrap > .fcf-col:first-child::before,
.fcf-footer .fcf-wrap > .fcf-col:first-child::after{
  content: none !important;
}

/* niektoré šablóny Shoptetu vkladajú vnútorný wrapper s pozadím – vypni ho len v päte */
.fcf-footer .fcf-wrap > .fcf-col:first-child > [class*="wrapper"],
.fcf-footer .fcf-wrap > .fcf-col:first-child > [class*="box"],
.fcf-footer .fcf-wrap > .fcf-col:first-child > .content,
.fcf-footer .fcf-wrap > .fcf-col:first-child > .col-inner{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* ak tam zostáva tenká čiara pri spodnom okraji panelu */
.fcf-footer .fcf-wrap > .fcf-col:first-child hr{
  display:none !important;
  border:0 !important;
}
























































/* Skryť ikonu vyhľadávania len na desktope */
@media (min-width: 992px){
  #header .navigation-buttons .toggle-window[data-target="search"]{
    display: none !important;
  }
}




/* ===== LOGIN & KOŠÍK – pevne vpravo pod lištou (DESKTOP) ===== */
@media (min-width: 992px){

  /* LOGIN okno – chytáme najčastejšie selektory zo Shoptetu */
  #login-window,
  .login-window,
  .window[data-window="login"],
  .window[data-window="signin"]{
    position: fixed !important;
    top: calc(var(--nav-h) + 12px) !important;  /* hneď pod hlavičkou */
    right: 24px !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 3000 !important;

    width: 92vw !important;
    max-width: 380px !important;

    background: #fff !important;
    border-radius: 14px !important;
    border: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.12) !important;
    overflow: hidden !important;
    transform: none !important;     /* pre istotu zruš translate z témy */
    animation: fc-drop .18s ease-out;
  }

  /* KOŠÍK – Shoptet zvyčajne #cart-widget */
  #cart-widget,
  .cart-widget,
  .window[data-window="cart"]{
    position: fixed !important;
    top: calc(var(--nav-h) + 12px) !important;
    right: 24px !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 3000 !important;

    width: 92vw !important;
    max-width: 420px !important;

    background: #fff !important;
    border-radius: 14px !important;
    border: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.12) !important;
    overflow: hidden !important;
    transform: none !important;
    animation: fc-drop .18s ease-out;
  }

  /* vypni šípky/pseudo-„trojuholníky“ */
  #login-window::before, #login-window::after,
  .login-window::before, .login-window::after,
  .window[data-window="login"]::before, .window[data-window="login"]::after,
  #cart-widget::before, #cart-widget::after,
  .cart-widget::before, .cart-widget::after,
  .window[data-window="cart"]::before, .window[data-window="cart"]::after{
    content: none !important; display: none !important;
  }
}

@keyframes fc-drop{
  from{ transform: translateY(-6px); opacity:.0; }
  to  { transform: translateY(0);    opacity:1;  }
}


/* ===== LOGIN panel – fixne vpravo pod lištou (desktop) ===== */
@media (min-width: 992px){

  /* samotný panel */
  .user-action-login.popup-widget.login-widget{
    position: fixed !important;
    top: calc(var(--nav-h) + 12px) !important;
    right: 24px !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
    z-index: 3000 !important;

    width: min(92vw, 380px) !important;
    background: #fff !important;
    border-radius: 14px !important;
    border: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.12) !important;
    overflow: hidden !important;
    animation: fc-drop .18s ease-out;
  }

  /* rodič nech nič neobmedzuje */
  .user-action,
  .user-action-in{ position: static !important; overflow: visible !important; }

  /* vypnúť trojuholníky/šipky */
  .user-action-login.popup-widget.login-widget::before,
  .user-action-login.popup-widget.login-widget::after{
    content: none !important;
    display: none !important;
  }
}

@keyframes fc-drop{
  from{ transform: translateY(-6px); opacity:0; }
  to  { transform: translateY(0);    opacity:1; }
}











/* ========= GLOBAL TYPOGRAFIA (Inter / Playfair / Italiana) ========= */

/* Premenné (už ich máš, len rozšírim fallbacky) */
:root{
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  --font-display: "Playfair Display", Georgia, "Times New Roman", Times, serif;
  --font-brand: "Italiana", "Playfair Display", Georgia, serif;
}

/* 1) VŠETOK bežný text a UI -> Inter */
html, body,
p, small, strong, em, b, i, u, s, sub, sup,
a, li, dt, dd, blockquote, pre, code, kbd, samp,
table, thead, tbody, tfoot, tr, th, td,
form, fieldset, legend, label,
input, textarea, select, option, button,
nav, header, footer, section, article, aside, main,
span, div,
.btn, .button, .fc-btn, .badge, .pill,
.alert, .messages .msg,
.popup-widget, .login-widget, .cart-widget,
#cart-widget, .user-action-login, .user-action-search,
.pagination, .breadcrumbs, .breadcrumb,
.price, .availability, .filters, .facets,
.product, .products, .category, .listing,
.fcf-footer, .fcf-footer * {
  font-family: var(--font-sans) !important;
  font-weight: 400;
}

/* Form prvky + placeholdery */
input, textarea, select, button { font-family: var(--font-sans) !important; }
input::placeholder, textarea::placeholder { font-family: var(--font-sans) !important; }

/* 2) NADPISY / HERO / titulky -> Playfair Display */
h1, h2, h3, h4, h5, h6,
.carousel .extended-banner-title,
.fc-title, .fc-cap-title, .fc-hl-title, .fc-hl-small,
.fcf-h, .fc2-title {
  font-family: var(--font-display) !important;
  font-weight: 600;
  letter-spacing: .2px;
}

/* 3) Brand / názov webu (ak je niekde textovo) -> Italiana */
.site-name, .logo-text, .brand, .fc-brand {
  font-family: var(--font-brand) !important;
  font-weight: 400;
}

/* 4) Tlačidlá – UI váhy (aby boli „pevnejšie“) */
button, .btn, .fc-btn, .btn-primary, .btn-secondary,
.button, .fcf-btn {
  font-family: var(--font-sans) !important;
  font-weight: 600 !important;
  letter-spacing: .02em;
}

/* 5) Login panel – pre istotu dotiahneme aj vnútro */
.user-action-login.popup-widget.login-widget,
.user-action-login .popup-widget-inner,
.user-action-login input,
.user-action-login button,
.user-action-login label,
.user-action-login .btn {
  font-family: var(--font-sans) !important;
}

/* 6) Hero podtitulky / sekundárne texty */
.carousel .extended-banner-text,
.fc2-overline, .fc-lead, .fc-hl-sub,
.fcf-lead, .fc-cap-sub {
  font-family: var(--font-sans) !important;
  font-weight: 400 !important;
  letter-spacing: .02em;
}

/* 7) Bezpečnostná poistka proti cudzím komponentom */
* { font-kerning: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }












/* === LOGO len na DESKTOP (mobil NECHAJ NA POKOJI) ===================== */
@media (min-width: 992px){

  /* 1) Vypni pseudo-logo, aby nič neprekážalo klikom */
  #header .header-bottom .navigation-wrapper::before{
    content: none !important;
    display: none !important;
  }

  /* 2) Zviditeľni a umiestni skutočné logo (.site-name) do spodnej lišty */
  #header .header-top{
    position: relative;
    height: 0 !important;
    overflow: visible;
  }

  #header .header-top .site-name{
    position: absolute !important;
    left: 12px;
    bottom: calc(-1 * var(--nav-h)) !important;  /* zavesené do lišty */
    height: var(--nav-h) !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    z-index: 200 !important;
  }

  #header .header-top .site-name a{
    display: flex !important;
    align-items: center !important;
    height: var(--nav-h) !important;
    line-height: var(--nav-h) !important;
  }

  /* > rovnaká veľkosť loga ako predtým (použijeme tvoju premennú) */
  #header .header-top .site-name img{
    height: var(--logo-h) !important;
    width: auto !important;
  }

  /* rezerva na ľavej strane pre logo */
  #header .header-bottom .navigation-wrapper{
    padding-left: calc(var(--logo-w) + 12px) !important;
    position: relative !important;
  }

  /* poistka: navigácia nad podkladom */
  #header .header-bottom nav#navigation{
    position: relative;
    z-index: 50;
  }
}

/* === Väčšie logo na desktop – mobil sa nemení ========================= */
@media (min-width: 992px){
  /* koľko “vzduchu” chceš hore/dole okolo loga (menšia hodnota = väčšie logo) */
  :root{ --logo-pad: 4px; }  /* môžeš skúsiť 2px alebo 0px, ak chceš úplne na doraz */

  #header .header-top .site-name{
    height: var(--nav-h) !important;
    padding: var(--logo-pad) 0 !important;   /* rovnaký padding hore/dole */
    display: flex !important;
    align-items: center !important;
  }

  #header .header-top .site-name img{
    height: calc(var(--nav-h) - 2*var(--logo-pad)) !important;
    max-height: none !important;
    width: auto !important;
    display: block !important;
    margin: 0 !important;
  }
}


/* -----------------------------------------------------------
   LUXE TYPOGRAPHY for Product detail (fonts + tokens)
   Add this at the TOP of your custom.css
   ----------------------------------------------------------- */

/* Google Fonts – elegant serif + clean UI sans + accent */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Playfair+Display:wght@500;600;700&family=Italiana&display=swap');

:root{
  --fc-ink: #141414;
  --fc-muted:#616161;
  --fc-accent:#b37a67;                  /* zlaď s brandom */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-accent: "Italiana", "Playfair Display", Georgia, serif;
}

/* Základ typografie len v detaile produktu */
:where(.p-detail, .product-detail, .detail){
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--fc-ink);
  font-family: var(--font-sans);
  line-height: 1.65;
}

/* Breadcrumbs – jemné, moderné */
:where(.p-detail, .product-detail, .detail) .breadcrumbs,
:where(.p-detail, .product-detail, .detail) .navigation-breadcrumb{
  font: 500 12.5px/1 var(--font-sans);
  letter-spacing: .06em;
}

/* Názov produktu – luxusná sérifová rodina */
:where(.p-detail, .product-detail, .detail) h1,
:where(.p-detail, .product-detail, .detail) .product-name{
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(28px, 3.2vw, 40px);
  line-height: 1.15;
  letter-spacing: .2px;
  margin: 0 0 8px;
}

/* Krátky popis – vzdušnejší, čitateľný */
:where(.p-detail, .product-detail, .detail) .perex,
:where(.p-detail, .product-detail, .detail) .short-description{
  font: 400 16px/1.7 var(--font-sans);
  color: var(--fc-muted);
  margin: 0 0 8px;
}

/* Labely a drobné texty – „kicker“ štýl */
:where(.p-detail, .product-detail, .detail) .variant-label,
:where(.p-detail, .product-detail, .detail) .parameter label{
  font: 600 11.5px/1 var(--font-sans);
  text-transform: uppercase;
  letter-spacing: .14em;
  color: var(--fc-accent);
  margin: 14px 0 8px;
}

/* Cena – elegantná, s vyrovnanou šírkou číslic */
:where(.p-detail, .product-detail, .detail) .price{
  margin: 16px 0 8px;
}
:where(.price .price-final, .product-price .price-final){
  font-family: var(--font-accent), var(--font-serif);
  font-weight: 600;
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: .3px;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

/* Form prvky a tlačidlá */
:where(.p-detail, .product-detail, .detail) select,
:where(.p-detail, .product-detail, .detail) .form-control{
  font-family: var(--font-sans);
  font-weight: 500;
  min-height: 48px; border-radius: 12px; padding: 10px 14px;
}

:where(.p-detail, .product-detail, .detail) .btn-primary,
:where(.p-detail, .product-detail, .detail) .add-to-cart-button{
  font-family: var(--font-sans);
  font-weight: 800;
  letter-spacing: .02em;
  min-height: 52px; padding: 14px 26px !important;
  border-radius: 999px !important;
}

/* Kvantita – číslica nech je výrazná, ale čistá */
:where(.p-detail, .product-detail, .detail) .quantity input,
:where(.p-detail, .product-detail, .detail) .amount-input input{
  font-family: var(--font-sans);
  font-weight: 700;
  height:48px; width:56px;
}

/* -----------------------------------------------------------
   PRODUCT DETAIL — BIG IMAGE + TIDY RIGHT PANEL
   (pôvodné rozloženie + vzhľad; ponechané, len s novými fontmi)
   ----------------------------------------------------------- */

/* 1) Širší layout na desktope – ľavý stĺpec dominuje */
@media (min-width: 1100px){
  :where(.p-detail, .product-detail, .detail) .p-detail-inner,
  :where(.p-detail, .product-detail, .detail) .product-detail-inner,
  :where(.p-detail, .product-detail, .detail) .detail-inner{
    grid-template-columns: 62% 38%;
    column-gap: clamp(24px, 3vw, 40px);
    align-items: start;
  }
}

/* 2) Hlavný obrázok — čo najväčší, vysoký, s tieňom */
:where(.p-detail, .product-detail, .detail) .p-image,
:where(.p-detail, .product-detail, .detail) .product-photo,
:where(.p-detail, .product-detail, .detail) .p-detail-image,
:where(.p-detail, .product-detail, .detail) .image-main{
  border-radius: 18px;
  overflow: clip;
  background: #f6f6f6;
  height: clamp(560px, 78vh, 980px);
  width: 100%;
  max-width: 100%;
  box-shadow: 0 20px 38px rgba(0,0,0,.08);
}
:where(.p-image img, .product-photo img, .p-detail-image img, .image-main img){
  width:100%; height:100%; display:block; object-fit:cover; object-position:center;
  transition: transform .5s ease;
}
:where(.p-image:hover img, .product-photo:hover img){ transform: scale(1.02); }

/* náhľady pod veľkým obrázkom */
:where(.p-detail, .product-detail, .detail) .p-thumbnails,
:where(.p-detail, .product-detail, .detail) .thumbnails,
:where(.p-detail, .product-detail, .detail) .product-thumbnails{
  margin-top: 14px;
  gap: 12px;
  grid-template-columns: repeat(6, 1fr);
}
:where(.p-thumbnails a, .thumbnails a, .product-thumbnails a){
  border-radius: 14px; overflow:hidden; background:#f3f3f3; aspect-ratio:1/1;
  box-shadow: inset 0 0 0 1px #e9e9e9;
}

/* 3) Pravý panel – decentná „karta“, sticky */
@media (min-width: 1100px){
  :where(.p-detail, .product-detail, .detail) .right,
  :where(.p-detail, .product-detail, .detail) .p-right,
  :where(.p-detail, .product-detail, .detail) .detail-right{
    position: sticky; top: 96px;
    align-self: start;
    background: linear-gradient(180deg,#fff,#faf8f6);
    border: 1px solid #ececec;
    border-radius: 18px;
    padding: clamp(18px,2vw,24px);
    box-shadow: 0 14px 32px rgba(0,0,0,.06);
  }
}

/* quantities + add-to-cart */
:where(.p-detail, .product-detail, .detail) .buy-buttons,
:where(.p-detail, .product-detail, .detail) .add-to-cart{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  margin-top: 10px;
}
:where(.p-detail, .product-detail, .detail) .quantity,
:where(.p-detail, .product-detail, .detail) .amount-input{
  border-radius: 12px; min-height: 48px;
}
:where(.quantity button, .amount-input button){ height:48px; width:48px; }

/* 4) Mobil – karta/sticky vypnúť, obrázok rozumne vysoký */
@media (max-width: 1099.98px){
  :where(.p-detail, .product-detail, .detail) .right,
  :where(.p-detail, .product-detail, .detail) .p-right,
  :where(.p-detail, .product-detail, .detail) .detail-right{
    position: static; background:#fff; border:0; box-shadow:none; padding:0;
  }
  :where(.p-detail, .product-detail, .detail) .p-image,
  :where(.p-detail, .product-detail, .detail) .product-photo{
    height: clamp(420px, 64vh, 720px);
  }
  :where(.p-detail, .product-detail, .detail) .btn-primary,
  :where(.p-detail, .product-detail, .detail) .add-to-cart-button{
    width:100%; justify-content:center;
  }
}














 :root{
    --fcf-accent: #c8a96a;                 /* zlatý akcent */
    --fcf-border: rgba(200,169,106,.35);   /* jemná linka */
    --fcf-bg: #fff;                        /* pozadie kariet */
    --fcf-muted: #777;                     /* sekundárny text */
    --fcf-radius: 16px;                    /* zaoblenie */
    --fcf-shadow: 0 8px 24px rgba(0,0,0,.06);
  }
  .fcf-section{margin:24px 0}
  .fcf-grid{
    display:grid; gap:24px;
    grid-template-columns: 1fr;
  }
  @media (min-width: 992px){
    .fcf-grid{grid-template-columns: repeat(3,1fr)}
  }
  .fcf-card{
    background: var(--fcf-bg);
    border: 1px solid var(--fcf-border);
    border-radius: var(--fcf-radius);
    box-shadow: var(--fcf-shadow);
    overflow:hidden;
  }
  .fcf-head{
    padding:16px 18px;
    border-bottom: 1px solid var(--fcf-border);
    display:flex; align-items:center; justify-content:space-between;
    gap:12px;
    background: linear-gradient(180deg, rgba(200,169,106,.06), transparent);
  }
  .fcf-title{
    margin:0; font-weight:600; letter-spacing:.25px;
  }
  .fcf-badge{
    font-size:12px; letter-spacing:.3px; text-transform:uppercase;
    color:#444; border:1px solid var(--fcf-border);
    padding:6px 10px; border-radius:999px; white-space:nowrap;
    background:#fff;
  }
  .fcf-body{ padding:16px 18px; }

  /* Tabuľka */
  .fcf-table-wrap{ overflow-x:auto; }
  .fcf-table{
    width:100%; border-collapse:separate; border-spacing:0; min-width:520px;
  }
  .fcf-table th, .fcf-table td{
    padding:12px 14px; text-align:left; vertical-align:middle;
    border-bottom:1px solid rgba(0,0,0,.06);
  }
  .fcf-table thead th{
    font-weight:600; font-size:14px; color:#222;
    border-bottom:1px solid var(--fcf-border);
    background: #faf8f4;
  }
  .fcf-table tbody tr:hover td{
    background: rgba(200,169,106,.06);
  }
  .fcf-kicker{
    margin-top:10px; font-size:12px; color:var(--fcf-muted);
  }

  /* Dvojstĺpcový zoznam */
  .fcf-list{
    display:grid; gap:8px 16px;
    grid-template-columns: 1fr;
    list-style:none; padding:0; margin:0;
  }
  @media (min-width: 576px){
    .fcf-list{grid-template-columns: 1fr 1fr}
  }
  .fcf-li{
    display:grid; grid-template-columns: 120px 1fr; gap:8px;
    align-items:center; border-bottom:1px dashed rgba(0,0,0,.06); padding:8px 0;
  }
  .fcf-li strong{
    font-weight:600; color:#222;
  }
  .fcf-li span{ color:#333; }

  /* Info list s ikonkovou odrážkou (čistá typografia) */
  .fcf-bullets{ margin:0; padding-left:18px; }
  .fcf-bullets li{ margin:6px 0; color:#333; }
  .fcf-bullets li::marker{ color: var(--fcf-accent); }

  /* Mini tagy */
  .fcf-tag{
    display:inline-block; font-size:11px; color:#222;
    border:1px solid var(--fcf-border); padding:4px 8px; border-radius:8px;
    background:#fff; margin-right:6px; margin-top:6px;
  }

  /* Jemná „lux“ linka */
  .fcf-hr{
    height:1px; background:linear-gradient(90deg, transparent, var(--fcf-border), transparent);
    border:0; margin:12px 0 6px;
  }










/* ===== PRODUCT DETAIL – odstránenie záložky "Popis" a rámu okolo obsahu ===== */

/* 1) Skry hlavičku tabov (vrátane nápisu "Popis") */
:where(.p-detail, .product-detail, .detail)
  ul#p-detail-tabs,
:where(.p-detail, .product-detail, .detail)
  .shp-tabs-wrapper .shp-tabs-row,
:where(.p-detail, .product-detail, .detail)
  .shp-tabs-wrapper .responsive-nav {
  display: none !important;
}

/* 2) Zruš orámovanie/pozadie kontajnera s obsahom tabu */
:where(.p-detail, .product-detail, .detail) #description,
:where(.p-detail, .product-detail, .detail) .tab-content,
:where(.p-detail, .product-detail, .detail) .tab-pane {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* 3) Pre istotu skry konkrétny odkaz na "Popis", ak by ho niečo znova vložilo */
:where(.p-detail, .product-detail, .detail) a.shp-tab-link[href="#description"] {
  display: none !important;
}



/* ===== PRODUCT DETAIL – náhľady fotiek bez orámovania ===== */
.p-thumbnails a.p-thumbnail,
.p-thumbnails a.p-thumbnail img,
.p-thumbnails a.p-thumbnail.highlighted,
.p-thumbnails a.p-thumbnail.highlighted img {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Pre istotu odstránime aj zaoblené rohy, ak ich nechceš */
.p-thumbnails a.p-thumbnail img {
  border-radius: 0 !important;
}



/* ===== FASHIONCAFFE – Variant + Počet kusov (pill štýl ako tlačidlo) ===== */

/* Farby / doladenie na jednom mieste */
:root{
  --fcf-accent: #D19A85;          /* farba tlačidla Do košíka – uprav ak máš inú */
  --fcf-accent-ink: #ffffff;      /* farba textu na akcentnom pozadí */
  --fcf-border: #e9ddd7;          /* jemná linka okolo prvkov */
  --fcf-focus: rgba(209,154,133,.35); /* focus halo */
}

/* --- VARIANT (select) ---------------------------------------------------- */
#simple-variants-select{
  width: 100%;
  height: 48px;
  padding: 0 52px 0 18px;
  border: 1px solid var(--fcf-border);
  border-radius: 9999px !important;
  background: #fff;
  font-size: 16px;
  line-height: 48px;
  outline: none;
  box-shadow: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
  appearance: none;                 /* skryť natívnu šípku */
  background-image:
    linear-gradient(transparent,transparent),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a6a5e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 18px center;
  background-size: 14px 14px;
}

#simple-variants-select:hover{
  border-color: #decac2;
}
#simple-variants-select:focus{
  border-color: var(--fcf-accent);
  box-shadow: 0 0 0 4px var(--fcf-focus);
}

/* Label „VARIANT” zjemníme */
.p-variants-block .variant-label{
  font-weight: 600;
  letter-spacing: .03em;
  color: #9a8c86;
}

/* --- POČET KUSOV (stepper) ---------------------------------------------- */
.add-to-cart .quantity{
  display: inline-flex;
  align-items: center;
  gap: 0;
  height: 46px;
  border: 1px solid var(--fcf-border);
  border-radius: 9999px;
  overflow: hidden;
  background: #fff;
}

/* tlačidlá +/- */
.add-to-cart .quantity .increase,
.add-to-cart .quantity .decrease{
  width: 46px;
  min-width: 46px;
  height: 46px;
  border: 0 !important;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s, transform .05s;
}
.add-to-cart .quantity .increase:hover,
.add-to-cart .quantity .decrease:hover{
  background: rgba(0,0,0,.04);
}
.add-to-cart .quantity .increase:active,
.add-to-cart .quantity .decrease:active{
  transform: translateY(1px);
}

/* číslo uprostred */
.add-to-cart .quantity .amount{
  width: 64px;
  height: 46px;
  border: 0 !important;
  text-align: center;
  font-size: 16px;
  outline: none;
  box-shadow: none !important;
  -moz-appearance: textfield;
}
.add-to-cart .quantity .amount:focus{
  box-shadow: inset 0 0 0 2px var(--fcf-focus);
}
/* skry spinnery v Chrome */
.add-to-cart .quantity .amount::-webkit-outer-spin-button,
.add-to-cart .quantity .amount::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

/* --- zarovnanie so širokým tlačidlom ------------------------------------ */
@media (min-width: 992px){
  .p-detail .buttons-wrapper .add-to-cart{
    gap: 16px; /* pekný odstup medzi stepperom a tlačidlom */
  }
}

/* Voliteľné: ak chceš jemné zvýraznenie po zvolení variantu */
#simple-variants-select.valid{
  border-color: var(--fcf-accent);
}



/* ===== FASHIONCAFFE – vzhľad položiek v rozkliknutom selecte ===== */

/* jednotná typografia a vzduch medzi riadkami */
#simple-variants-select option{
  font-size: 16px;
  line-height: 1.6;
  padding: 10px 12px;     /* podporované v moderných prehliadačoch */
  color: #2b2b2b;
}

/* zvýraznenie aktuálne zvolenej položky (Chrome/Edge/Firefox) */
#simple-variants-select option:checked{
  background: rgba(209,154,133,.18) !important;  /* jemný akcent */
  color: #000;
}

/* keď je select v stave focus, zvýrazni aj „checked“ v zozname (WebKit) */
#simple-variants-select:focus option:checked{
  background: rgba(209,154,133,.22) !important;
}

/* Firefox navyše podporuje hover na <option> – pridáme jemné podsvietenie */
@-moz-document url-prefix(){
  #simple-variants-select option:hover{
    background: rgba(209,154,133,.12) !important;
  }
}

/* vzhľad „popupu“ – čo sa dá ovplyvniť cez samotný select */
#simple-variants-select{
  border-radius: 16px !important;     /* zaoblenie tela aj pri otvorení */
  box-shadow: 0 10px 30px rgba(0,0,0,.08); /* dojem hĺbky pri otvorení */
}

/* tmavšia deliaca linka medzi headerom selectu a zoznamom (efekt) */
#simple-variants-select:focus{
  border-color: #d19a85;
  box-shadow: 0 0 0 4px rgba(209,154,133,.28);
}





/* ===== KOLEKCIA – úpravy iba na stránke, kde je .fc-page ===== */

/* 1) Skryť „Look xx“ (titulky v kártičkách) a spodný preliv */
.fc-page .fc-caption { display: none !important; }

/* 2) Box sa prispôsobí fotke (žiadny fixný pomer) a nič sa nestrihá */
.fc-page .fc-media-link { aspect-ratio: auto !important; }
.fc-page .fc-media-link img{
  position: static !important;     /* už nie absolute */
  width: 100%;
  height: auto;                    /* prirodzená výška obrázka */
  object-fit: contain !important;  /* nič neorezávaj, ak je pomer iný */
  display: block;
  transform: none !important;      /* zruš hover-zoom, nech neruší menšie fotky */
  filter: none !important;
}
.fc-page .fc-card:hover img{ transform: none !important; }

/* (voliteľné) ak chceš stále mierny tieň/zaoblenie, necháme ich;
   ak nie, pokojne aj bez neho: */
/* .fc-page .fc-card { box-shadow: none !important; } */

/* 3) Skryť globálny nadpis „Kolekcia“ a ľavý box Kategórie – iba na tejto stránke */
body:has(.fc-page) .box.categories,
body:has(.fc-page) .category-tree,
body:has(.fc-page) .content-left,
body:has(.fc-page) .left,
body:has(.fc-page) .sidebar-left { display: none !important; }

/* rozťahni obsah na 100 %, keď je sidebar skrytý */
body:has(.fc-page) .content-right,
body:has(.fc-page) .col-right,
body:has(.fc-page) .content-inner,
body:has(.fc-page) #content { width: 100% !important; max-width: 100% !important; }

/* skryť veľký page-title nad galériou (len tu) */
body:has(.fc-page) .page-title,
body:has(.fc-page) .content h1 { display: none !important; }