@charset "UTF-8";
/* =========================================================
   SHEZMU, vanoce.css  (zelená a zlatá, titulní strana + kategorie)
   Cesta: /user/documents/upload/CSS/vanoce.css
   Zapnutí:  <link href="/user/documents/upload/CSS/vanoce.css" rel="stylesheet">
   Vypnutí:  ten jeden řádek smazat. Nic jiného se nemění.
   Barvy jsou finální: #12312a #b8924a #d9bd84 #ecd9ae #8a6a2e #e9e4d8
   ========================================================= */

body.type-index,
body.type-category {
  --xm-g: #12312a; --xm-gold: #b8924a; --xm-gold-l: #d9bd84; --xm-gold-t: #ecd9ae; --xm-gold-d: #8a6a2e; --xm-cream: #e9e4d8;
  --xm-bow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 32'%3E%3Cpath d='M26 15C19 3 5 1 5 10s12 10 21 5Z' fill='%23b8924a' stroke='%23ecd9ae'/%3E%3Cpath d='M26 15c7-12 21-14 21-5s-12 10-21 5Z' fill='%23b8924a' stroke='%23ecd9ae'/%3E%3Cpath d='M25 16l-8 14M27 16l8 14' stroke='%23b8924a' stroke-width='3'/%3E%3Ccircle cx='26' cy='15' r='4' fill='%23d9bd84'/%3E%3C/svg%3E");
  --xm-snow: radial-gradient(circle, rgba(255,255,255,.85) 1px, transparent 1.6px), radial-gradient(circle, rgba(255,255,255,.5) 1.4px, transparent 2.2px), radial-gradient(circle, rgba(217,189,132,.7) .8px, transparent 1.4px);
}

/* =========================================================
   1. PRUH POD HLAVNÍM MENU (titulka + kategorie, kromě vzorků)
   ========================================================= */
body.type-index #header::after,
body.type-category:not(.in-vzorecky-mawwal):not(.in-vzorecky-mawwal-panske) #header::after {
  content: '\2726   Vánoce se blíží  ·  vybírejte vůně pod stromeček   \2726';
  display: block; clear: both; width: 100%; margin: 0; padding: 11px 16px; box-sizing: border-box;
  background-color: var(--xm-g);
  background-image: var(--xm-snow);
  background-size: 45px 45px, 70px 70px, 30px 30px;
  background-position: 0 0, 20px 15px, 10px 5px;
  border-top: 1px solid var(--xm-gold); border-bottom: 1px solid var(--xm-gold);
  color: var(--xm-gold-t); font-family: 'Poppins', sans-serif; font-size: 11px; font-weight: 500; line-height: 1.4;
  letter-spacing: .26em; text-transform: uppercase; text-align: center; white-space: pre;
  animation: xm-bar-snow 45s linear infinite;
}
@keyframes xm-bar-snow {
  from { background-position: 0 0, 20px 15px, 10px 5px; }
  to   { background-position: 0 630px, 20px 645px, 10px 635px; }
}

/* =========================================================
   2. TITULKA: ornamenty a pruh důvěry ve zlaté
   ========================================================= */
body.type-index .sh-orn2::after,
body.type-index .sh-ornament .sh-diamond,
body.type-index .sh-home-trust b { background: var(--xm-gold) !important; border-color: var(--xm-gold) !important; }

/* =========================================================
   3. TITULKA: produkty v záložkách
   ========================================================= */
/* nadpis sekce s mašlí */
body.type-index .homepage-tabs-wrapper::before {
  content: 'Vánoční tipy';
  display: block; padding-top: 40px; margin: 8px 0 6px;
  background: linear-gradient(var(--xm-gold), var(--xm-gold)) calc(50% - 41px) 13px / 38px 1px no-repeat,
              linear-gradient(var(--xm-gold), var(--xm-gold)) calc(50% + 41px) 13px / 38px 1px no-repeat,
              var(--xm-bow) center top / 40px 25px no-repeat;
  font-family: 'Poppins', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; text-align: center; color: var(--xm-gold-d);
}
body.type-index .homepage-tabs-wrapper .shp-tabs-holder::before {
  content: 'Nejoblíbenější vůně pod stromeček';
  display: block; margin: 0 0 26px;
  font-family: 'Poppins', sans-serif; font-size: clamp(18px, 2.4vw, 24px); font-weight: 300; letter-spacing: .2em; text-transform: uppercase; text-align: center; line-height: 1.4; color: #1a1a1a;
}
/* záložky */
body.type-index .homepage-tabs .shp-tab-link { transition: background .3s ease, color .3s ease, border-color .3s ease; }
body.type-index .homepage-tabs .shp-tab:not(.active) .shp-tab-link { border-color: var(--xm-gold-l) !important; }
body.type-index .homepage-tabs .shp-tab:not(.active) .shp-tab-link:hover { border-color: var(--xm-gold) !important; background: var(--xm-gold-t) !important; color: #1a1a1a !important; }
body.type-index .homepage-tabs .shp-tab.active .shp-tab-link { background: var(--xm-g) !important; border-color: var(--xm-g) !important; box-shadow: inset 0 0 0 1px var(--xm-g), inset 0 0 0 2px var(--xm-gold) !important; color: var(--xm-gold-t) !important; }
/* karty produktů: zlatá linka nahoře, hvězdička v rohu, zelené tlačítko */
body.type-index .homepage-tabs-wrapper .products .p { position: relative; border-color: var(--xm-gold-t) !important; transition: border-color .4s ease, box-shadow .4s ease; }
body.type-index .homepage-tabs-wrapper .products .p::before { content: '\2726'; position: absolute; top: 12px; right: 16px; font-size: 13px; line-height: 1; color: var(--xm-gold-l); animation: xm-twinkle 3.6s ease-in-out infinite; pointer-events: none; }
body.type-index .homepage-tabs-wrapper .products .product:nth-child(even) .p::before { animation-delay: -1.8s; }
body.type-index .homepage-tabs-wrapper .products .p:hover { border-color: var(--xm-gold) !important; box-shadow: 0 10px 30px rgba(18,49,42,.10); }
body.type-index .homepage-tabs-wrapper .products .btn-cart { background: var(--xm-g) !important; border-color: var(--xm-g) !important; box-shadow: inset 0 0 0 2px var(--xm-g), inset 0 0 0 3px var(--xm-gold); transition: background .3s ease, box-shadow .3s ease; }
body.type-index .homepage-tabs-wrapper .products .btn-cart:hover,
body.type-index .homepage-tabs-wrapper .products .btn-cart:focus-visible { background: var(--xm-gold-d) !important; border-color: var(--xm-gold-d) !important; box-shadow: inset 0 0 0 2px var(--xm-gold-d), inset 0 0 0 3px var(--xm-gold-t); }

/* =========================================================
   4. TITULKA: magazín (blog)
   ========================================================= */
body.type-index .sh-bl-orn { height: 32px !important; background: var(--xm-bow) center / 40px 25px no-repeat !important; }
body.type-index .sh-bl-orn::before { top: 12px !important; }
body.type-index .sh-bl-orn::after { display: none !important; }
body.type-index .sh-bl-caption { color: var(--xm-gold-d) !important; }
body.type-index .homepage-blog-wrapper .news-item .image { position: relative; }
body.type-index .homepage-blog-wrapper .news-item .image::after { content: ''; position: absolute; inset: 8px; border: 1px solid rgba(236,217,174,.9); border-radius: 8px; pointer-events: none; transition: inset .4s ease, border-color .4s ease; }
body.type-index .homepage-blog-wrapper .news-item a:hover .image::after { inset: 12px; border-color: var(--xm-gold-l); }
body.type-index .homepage-blog-wrapper .news-item a:hover .title { color: var(--xm-gold-d) !important; }
body.type-index .homepage-blog-wrapper .news-item .read-article { border-bottom-color: var(--xm-gold) !important; }
body.type-index .homepage-blog-wrapper .news-item .read-article::before { content: '\2726'; margin-right: 8px; color: var(--xm-gold); display: inline-block; animation: xm-twinkle 3s ease-in-out infinite; }

/* =========================================================
   5. TITULKA: uvítací text a časté otázky
   ========================================================= */
/* nadpisy: mašle mezi zlatými linkami */
body.type-index .sh-seo h2::before {
  content: '' !important; display: block !important; width: 130px !important; height: 26px !important; margin: 0 auto 12px !important; transform: none !important;
  background: linear-gradient(var(--xm-gold), var(--xm-gold)) left 13px / 40px 1px no-repeat,
              linear-gradient(var(--xm-gold), var(--xm-gold)) right 13px / 40px 1px no-repeat,
              var(--xm-bow) center / 38px 24px no-repeat !important;
}
body.type-index .sh-seo h2 { color: var(--xm-gold-d) !important; }
/* sloupce Pro ženy / Pro muže: krémové kartičky se zlatou linkou */
body.type-index .sh-seo .sh-seo-col { background: rgba(233,228,216,.45); border-top: 2px solid var(--xm-gold) !important; padding: 18px 20px !important; border-radius: 0 0 6px 6px; }
/* časté otázky: zelený panel se sněhem a zlatým rámečkem */
body.type-index .sh-seo .sh-faq {
  position: relative; margin-top: 30px !important; padding: 34px 36px 28px !important; border-radius: 6px;
  background-color: var(--xm-g);
  background-image: radial-gradient(circle, rgba(255,255,255,.32) 1px, transparent 1.6px), radial-gradient(circle, rgba(255,255,255,.2) 1.4px, transparent 2.2px), radial-gradient(circle, rgba(217,189,132,.3) .8px, transparent 1.4px);
  background-size: 90px 90px, 140px 140px, 60px 60px; background-position: 0 0, 40px 30px, 20px 10px;
  animation: xm-faq-snow 110s linear infinite;
}
body.type-index .sh-seo .sh-faq::before { content: ''; position: absolute; inset: 8px; border: 1px solid rgba(217,189,132,.6); border-radius: 3px; pointer-events: none; }
body.type-index .sh-seo .sh-faq::after { content: ''; position: absolute; left: 50%; top: -15px; width: 48px; height: 30px; margin-left: -24px; background: var(--xm-bow) center / contain no-repeat; pointer-events: none; }
body.type-index .sh-seo .sh-faq details { position: relative; border-color: rgba(217,189,132,.35) !important; }
body.type-index .sh-seo .sh-faq details:first-of-type { border-top-color: transparent !important; }
body.type-index .sh-seo .sh-faq details:last-of-type { border-bottom-color: transparent !important; }
body.type-index .sh-seo .sh-faq summary { color: #fff !important; font-weight: 500 !important; font-size: 16px !important; }
body.type-index .sh-seo .sh-faq summary:hover,
body.type-index .sh-seo .sh-faq details[open] summary { color: var(--xm-gold-t) !important; }
body.type-index .sh-seo .sh-faq summary::after { border-color: var(--xm-gold-l) !important; color: var(--xm-gold-l) !important; }
body.type-index .sh-seo .sh-faq details p { color: #fff !important; font-weight: 400 !important; font-size: 15px !important; line-height: 1.8 !important; }
body.type-index .sh-seo .sh-faq details a { color: var(--xm-gold-t) !important; }

/* =========================================================
   6. NEWSLETTER V PATIČCE (titulka + kategorie)
   ========================================================= */
body.type-index .footer-newsletter,
body.type-category .footer-newsletter { position: relative; overflow: hidden; background-color: var(--xm-g) !important; border-top: 1px solid var(--xm-gold); border-bottom: 1px solid var(--xm-gold); }
body.type-index .footer-newsletter::before,
body.type-category .footer-newsletter::before { content: ''; position: absolute; left: 0; right: 0; top: -1260px; bottom: 0; pointer-events: none; z-index: 0;
  background-image: var(--xm-snow); background-size: 90px 90px, 140px 140px, 60px 60px; background-position: 0 0, 40px 30px, 20px 10px;
  will-change: transform; animation: xm-snow 110s linear infinite; }
body.type-index .footer-newsletter > *,
body.type-category .footer-newsletter > * { position: relative; z-index: 1; }
body.type-index .footer-newsletter .newsletter-header::before,
body.type-category .footer-newsletter .newsletter-header::before { content: ''; display: block; width: 48px; height: 30px; margin: 0 auto 14px; background: var(--xm-bow) center / contain no-repeat; transform: none; }
body.type-index .footer-newsletter .newsletter-header .topic, body.type-index .footer-newsletter .newsletter-header .topic span,
body.type-category .footer-newsletter .newsletter-header .topic, body.type-category .footer-newsletter .newsletter-header .topic span { color: #fff !important; font-weight: 300 !important; }
body.type-index .footer-newsletter .newsletter-header p,
body.type-category .footer-newsletter .newsletter-header p { color: var(--xm-cream) !important; }
body.type-index .footer-newsletter .form-control,
body.type-category .footer-newsletter .form-control { border-color: var(--xm-gold-l) !important; background: #fff !important; color: #1a1a1a !important; }
body.type-index .footer-newsletter .btn-primary,
body.type-category .footer-newsletter .btn-primary { background: var(--xm-gold) !important; border-color: var(--xm-gold) !important; color: #1a1a1a !important; }
body.type-index .footer-newsletter .btn-primary:hover,
body.type-category .footer-newsletter .btn-primary:hover { background: var(--xm-gold-l) !important; border-color: var(--xm-gold-l) !important; }
body.type-index .footer-newsletter .consents, body.type-index .footer-newsletter .consents .label, body.type-index .footer-newsletter label,
body.type-category .footer-newsletter .consents, body.type-category .footer-newsletter .consents .label, body.type-category .footer-newsletter label { color: var(--xm-cream) !important; }
body.type-index .footer-newsletter .consents a,
body.type-category .footer-newsletter .consents a { color: var(--xm-gold-t) !important; }

/* =========================================================
   7. KATEGORIE: karty produktů
   ========================================================= */
body.type-category:not(.in-vzorecky-mawwal):not(.in-vzorecky-mawwal-panske) .products-block .p { transition: border-color .4s ease, box-shadow .4s ease; }
body.type-category:not(.in-vzorecky-mawwal):not(.in-vzorecky-mawwal-panske) .products-block .p:hover { border-color: var(--xm-gold) !important; box-shadow: 0 10px 30px rgba(18,49,42,.10); }
body.type-category:not(.in-vzorecky-mawwal):not(.in-vzorecky-mawwal-panske) .products-block .p:hover .btn-cart { background: var(--xm-g) !important; border-color: var(--xm-g) !important; }

/* Animace */
@keyframes xm-twinkle { 0%, 100% { opacity: .4; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes xm-faq-snow { from { background-position: 0 0, 40px 30px, 20px 10px; } to { background-position: 0 1260px, 40px 1290px, 20px 1270px; } }
@keyframes xm-snow { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 1260px, 0); } }

/* Telefon */
@media (max-width: 600px) {
  body.type-index #header::after,
  body.type-category:not(.in-vzorecky-mawwal):not(.in-vzorecky-mawwal-panske) #header::after {
    content: '\2726  Vánoce se blíží  \2726\A vybírejte vůně pod stromeček';
    font-size: 10px; letter-spacing: .14em; padding: 9px 8px;
  }
  body.type-index .homepage-tabs-wrapper .shp-tabs-holder::before { letter-spacing: .12em; margin-bottom: 18px; padding: 0 10px; }
  body.type-index .homepage-tabs-wrapper .products .p::before { top: 8px; right: 10px; font-size: 11px; }
  body.type-index .sh-seo .sh-faq { padding: 26px 20px 20px !important; }
  body.type-index .sh-seo .sh-seo-col { padding: 14px 16px !important; }
}
@media (max-width: 360px) {
  body.type-index #header::after,
  body.type-category #header::after { font-size: 9px; letter-spacing: .1em; }
}
@media (prefers-reduced-motion: reduce) {
  body.type-index #header::after, body.type-category #header::after,
  body.type-index .footer-newsletter::before, body.type-category .footer-newsletter::before,
  body.type-index .homepage-tabs-wrapper .products .p::before,
  body.type-index .sh-seo .sh-faq,
  body.type-index .news-item .read-article::before { animation: none !important; }
}
