/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/


.header-top .site-name a {
    visibility: hidden !important;
}
nav#custom-menu .site-name img {
    max-width: 140px;
    margin: 0 auto;
    display: block;
}
ul.menu-level-1 li > a{
    text-transform: uppercase !important;
}
ul.menu-level-2 img, ul.menu-level-2 a.menu-image{
    display: none !important;
}
/* ======================================================
   DESKTOP LAYOUT (min-width: 980px) – FIXED LEFT HEADER
====================================================== */
@media (min-width: 980px){

  header{
    width: 260px;
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    z-index: 1000;
    background: white;
    border-radius: 20px 0 0 0;
  }

  #content-wrapper,
  .carousel-wrapper,
  .container.footer-rows,
  .full-width.footer-bottom-full-width,
  div#hodnoceniobchodu{
    margin-left: 260px !important;
    width: calc(100% - 260px) !important;
    overflow-x: hidden !important;
  }

  .navigation-buttons{
    position: fixed;
    right: 0;
    top: 20px;
    -webkit-transition: top 0.3s ease;
    -o-transition: top 0.3s ease;
    transition: top 0.3s ease;
  }
  .navigation-buttons button{
    background-color: transparent !important;
  }
}
/* ======================================================
   MOBILE LAYOUT (max-width: 980px) – FIXED LEFT HEADER
====================================================== */
@media (max-width: 980px){
  .menu-helper.visible {
      z-index: 999;
  }
  .header-top .container {
      width: 100% !important;
  }
  #header .header-top .header-top-wrapper {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  .navigation-buttons {
    position: absolute;
    right: 0 !important;
    top: -20px !important;
  }
}


/* ======================================================
   DESKTOP (min-width: 980px)
====================================================== */
  /* ---------- Info marquee ---------- */
  .site-msg{
    padding: 5px 0 !important;
    z-index: 9999;
    position: relative;
  }
  .site-msg .text{
    font-size: 12px !important;
  }
  .site-msg.information {
    border-radius: 40px 40px 0 0;
  }
  .site-msg.information,
  .site-msg.information .container{
    overflow: hidden;
  }

  .site-msg.information .marquee{
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    white-space: nowrap;
    will-change: transform;
    -webkit-animation: shoptet-marquee linear infinite;
            animation: shoptet-marquee linear infinite;
  }

  .site-msg.information .marquee span{
    padding-right: 180px;
  }

  @-webkit-keyframes shoptet-marquee{
    from{ -webkit-transform: translateX(0); transform: translateX(0); }
    to{ -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  }

  @keyframes shoptet-marquee{
    from{ -webkit-transform: translateX(0); transform: translateX(0); }
    to{ -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  }

@media (min-width: 980px){

  /* ---------- Custom menu wrapper ---------- */
  nav#custom-menu{
    padding: 0 20px;
  }

  /* ---------- Logo ---------- */
  h1.site-name{
    max-width: 140px;
    margin: 30px auto;
  }

  /* ======================================================
     SKRYTÍ PŮVODNÍHO MENU
  ====================================================== */
  #navigation,
  .menu-helper,
  .header-top h1.site-name{
    display: none !important;
  }

  /* ======================================================
     ZÁKLADNÍ RESET PRO CUSTOM MENU
  ====================================================== */
  #custom-menu.demo,
  #custom-menu.demo *{
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  #custom-menu.demo ul{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* ======================================================
     HLAVNÍ MENU – POD SEBOU, UTÁHNUTÉ
  ====================================================== */
  #custom-menu.demo .menu-level-1{
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #custom-menu.demo .menu-level-1 > li{
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  #custom-menu.demo .menu-level-1 > li > a{
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
        -ms-flex-align: center !important;
            align-items: center !important;
    -webkit-box-pack: justify !important;
        -ms-flex-pack: justify !important;
            justify-content: space-between !important;

    margin: 0 !important;
    padding: 6px 0 !important;

    height: auto !important;
    min-height: 0 !important;
    line-height: 1.15 !important;

    text-decoration: none;
    letter-spacing: .06em;
  }

  #custom-menu.demo .menu-level-1 > li > a > b,
  #custom-menu.demo .menu-level-1 > li > a > span{
    display: inline !important;
    margin: 5px 0 !important;
    padding: 0 !important;
    line-height: 1.15 !important;
  }

  #custom-menu.demo .submenu-arrow{
    margin-left: 12px !important;
    line-height: 1 !important;
  }

  /* ======================================================
     SUBMENU – DEFAULT SKRYTÉ
  ====================================================== */
  #custom-menu.demo .menu-level-2{
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;

    max-height: 0;
    overflow: hidden;

    opacity: 0;
    -webkit-transform: translateY(4px);
        -ms-transform: translateY(4px);
            transform: translateY(4px);

    -webkit-transition:
      max-height 1.6s cubic-bezier(.16,1,.3,1),
      opacity 1.2s cubic-bezier(.16,1,.3,1),
      -webkit-transform 1.8s cubic-bezier(.16,1,.3,1);

    transition:
      max-height 1.6s cubic-bezier(.16,1,.3,1),
      opacity 1.2s cubic-bezier(.16,1,.3,1),
      -webkit-transform 1.8s cubic-bezier(.16,1,.3,1);

    -o-transition:
      max-height 1.6s cubic-bezier(.16,1,.3,1),
      opacity 1.2s cubic-bezier(.16,1,.3,1),
      transform 1.8s cubic-bezier(.16,1,.3,1);

    transition:
      max-height 1.6s cubic-bezier(.16,1,.3,1),
      opacity 1.2s cubic-bezier(.16,1,.3,1),
      transform 1.8s cubic-bezier(.16,1,.3,1);

    transition:
      max-height 1.6s cubic-bezier(.16,1,.3,1),
      opacity 1.2s cubic-bezier(.16,1,.3,1),
      transform 1.8s cubic-bezier(.16,1,.3,1),
      -webkit-transform 1.8s cubic-bezier(.16,1,.3,1);

    will-change: opacity, transform;
  }

  #custom-menu.demo .menu-level-1 > li:hover > .menu-level-2{
    max-height: 1200px;
    opacity: 1;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    margin-bottom: 20px !important;
    padding-left: 15px !important;
  }

  /* ======================================================
     ODSTRANĚNÍ VNITŘNÍCH SHOPTET WRAPPER MEZER
  ====================================================== */
  #custom-menu.demo .menu-level-2 .menu-no-image{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* ======================================================
     POLOŽKY SUBMENU – JEMNÉ „PŘISTÁNÍ“
  ====================================================== */
  #custom-menu.demo .menu-level-2 > li{
    margin: 0 !important;
    padding: 0 !important;

    opacity: 0;
    -webkit-transform: translateY(6px);
        -ms-transform: translateY(6px);
            transform: translateY(6px);

    -webkit-transition:
      opacity 3s cubic-bezier(.16,1,.3,1),
      -webkit-transform 0.9s cubic-bezier(.16,1,.3,1);

    transition:
      opacity 3s cubic-bezier(.16,1,.3,1),
      -webkit-transform 0.9s cubic-bezier(.16,1,.3,1);

    -o-transition:
      opacity 3s cubic-bezier(.16,1,.3,1),
      transform 0.9s cubic-bezier(.16,1,.3,1);

    transition:
      opacity 3s cubic-bezier(.16,1,.3,1),
      transform 0.9s cubic-bezier(.16,1,.3,1);

    transition:
      opacity 3s cubic-bezier(.16,1,.3,1),
      transform 0.9s cubic-bezier(.16,1,.3,1),
      -webkit-transform 0.9s cubic-bezier(.16,1,.3,1);
  }

  #custom-menu.demo .menu-level-1 > li:hover .menu-level-2 > li{
    opacity: 1;
    -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
            transform: translateY(0);
    -webkit-transition-delay: calc(var(--i,0) * 135ms);
         -o-transition-delay: calc(var(--i,0) * 135ms);
            transition-delay: calc(var(--i,0) * 135ms);
  }

  /* ======================================================
     ODKAZY V SUBMENU – MINIMALISTICKÉ
  ====================================================== */
  #custom-menu.demo .menu-level-2 a{
    margin: 8px 0 0 0 !important;
    padding: 4px 0 !important;
    height: auto !important;
    line-height: 1.15 !important;
    text-decoration: none;
    opacity: .85;
    -webkit-transition: opacity 1.8s ease;
    -o-transition: opacity 1.8s ease;
    transition: opacity 1.8s ease;
    position: relative;
    -webkit-text-fill-color: currentColor;
    background-image: none;
    text-shadow: none;
    background-clip: border-box;
  }

  #custom-menu.demo .menu-level-2 a:hover{
    opacity: 1;
    -webkit-animation: perlina-spark 1.4s cubic-bezier(.16,1,.3,1) 1 forwards;
            animation: perlina-spark 1.4s cubic-bezier(.16,1,.3,1) 1 forwards;
  }

  @-webkit-keyframes perlina-spark{
    0%{
      background-image: linear-gradient(
        110deg,
        currentColor 0%,
        currentColor 40%,
        rgba(255,255,255,.95) 50%,
        currentColor 60%,
        currentColor 100%
      );
      background-size: 220% 100%;
      background-position: 120% 0;

      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;

      text-shadow:
        0 0 5px rgba(255,255,255,.25),
        0 0 12px rgba(255,255,255,.12);
    }

    85%{ background-position: -120% 0; }

    100%{
      background-image: none;
      background-position: 120% 0;

      -webkit-background-clip: border-box;
      background-clip: border-box;
      -webkit-text-fill-color: currentColor;

      text-shadow: none;
    }
  }

  @keyframes perlina-spark{
    0%{
      background-image: -o-linear-gradient(
        340deg,
        currentColor 0%,
        currentColor 40%,
        rgba(255,255,255,.95) 50%,
        currentColor 60%,
        currentColor 100%
      );
      background-image: linear-gradient(
        110deg,
        currentColor 0%,
        currentColor 40%,
        rgba(255,255,255,.95) 50%,
        currentColor 60%,
        currentColor 100%
      );
      background-size: 220% 100%;
      background-position: 120% 0;

      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;

      text-shadow:
        0 0 5px rgba(255,255,255,.25),
        0 0 12px rgba(255,255,255,.12);
    }

    85%{ background-position: -120% 0; }

    100%{
      background-image: none;
      background-position: 120% 0;

      -webkit-background-clip: border-box;
      background-clip: border-box;
      -webkit-text-fill-color: currentColor;

      text-shadow: none;
    }
  }

  @media (prefers-reduced-motion: reduce){
    #custom-menu.demo .menu-level-2 a:hover{ -webkit-animation: none; animation: none; }
  }
}
  .submenu-arrow:after {
      content: '+' !important;
  }
/* MOB MENU */
@media (max-width: 990px){
  .navigation-in.menu {
      background: #f1e8df !important;
      width: 85% !important;
      float: right;
  }
  .navigation-in.menu li {
    border: none !important;
  }
   .navigation-in.menu ul {
    background: #f1e8df !important;
  }
}



/* ======================================================
   FOOTER 
====================================================== */
footer#footer{
  background-color: #fff !important;
}

.container.footer-rows,
.footer-icons,
.full-width.footer-bottom-full-width,
.container.footer-bottom {
  background-color: #34200d !important;
}

footer#footer .banner-wrapper {
  background-color: inherit;
}

.full-width.footer-bottom-full-width{
  border-radius: 0 0 20px 20px;
}

/* ======================================================
   COOKIES 
====================================================== */

.siteCookies.siteCookies--center.siteCookies--light.js-siteCookies {
    position: fixed;
}
.siteCookies__form {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    -webkit-transform: translate(-50%, -50%) !important;
        -ms-transform: translate(-50%, -50%) !important;
            transform: translate(-50%, -50%) !important;
    z-index: 10000001 !important;
    color: #222 !important;
    border-radius: 0 !important;
    padding: 30px 36px !important;
    -webkit-box-shadow: 0 8px 40px rgba(0, 0, 0, 0.35) !important;
            box-shadow: 0 8px 40px rgba(0, 0, 0, 0.35) !important;
    max-width: 560px !important;
    width: calc(100vw - 40px) !important;
    text-align: left !important;
}
.siteCookies--center {
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    background: rgba(24, 27, 24, 0.7);
}
button.siteCookies__button.js-cookiesConsentSubmit {
    min-width: 180px !important;
    border-radius: 0 !important;
}
button.siteCookies__link.js-cookies-settings {
    border-width: 1px;
    border-radius: 0;
}
.siteCookies__text span {
    font-size: 13px;
}
div#cboxContent {
    border-radius: 0 !important;
}

/* ======================================================
   SEARCH 
====================================================== */

  .user-action-search.popup-widget.search-widget.search.stay-open {
    position: fixed;
    z-index: 9999;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
}


/* ======================================================
   RESPONSIVE 
====================================================== */

@media (max-width: 980px){
  .menu-helper.visible {
      z-index: 999;
  }
  .header-top .container, .site-msg.information .container {
      width: 100% !important;
  }
  #header .header-top .header-top-wrapper {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  h1.site-name {
      padding: 0 !important;
        text-align: left !important;
        position: absolute;
        margin: 0 !important;
        max-width: 130px;
  }
  .navigation-buttons {
    position: absolute;
    right: 0 !important;
    top: -15px !important;
  }
  .menu-helper>ul, ul.menu-level-2, .menu-helper ul, .menu-helper li, .menu-helper a {
        background-color: #c9bfb5 !important;
        border-color: transparent;
        border: none !important;
        border-radius: 0 !important;
    }
  .menu-helper>ul>li {
      border-top-color: transparent;
  }
}

@media (max-width: 767px) {
  .site-msg.information {
      position: absolute !important;
      top: 0 !important;
      z-index: 999 !important;
  }
  #header {
        top: 28px !important;
    }
}

/* FOOTER */
.footer-icons {
    display: none;
}

/* 1. Základní texty, nadpisy a odkazy */
#footer,
#footer h1, 
#footer h2, 
#footer h3, 
#footer h4, 
#footer h5,
#footer p, 
#footer span, 
#footer div, 
#footer label,
#footer a {
    color: #fff !important;
}

/* 2. Ikony (fontové i SVG) */
#footer i,
#footer svg,
#footer svg path,
#footer .bi {
    color: #fff !important;
    fill: #fff !important;
}
footer#footer h4 {
    font-size: var(--step-2) !important;
}
#footer h4>span:after {
    display: none !important;
}
footer#footer h4.topic span {
    font-family: big-caslon-fb, serif !important;
    font-weight: 400;
    font-style: normal;
}
/* 3. Odkazy po najetí myší (aby nezmodraly/nezčernaly) */
#footer a:hover {
    color: #fff !important;
    opacity: 0.8; /* Jemné zprůhlednění pro efekt interakce */
    text-decoration: none;
}

/* 4. Specifická oprava pro Shoptet podpis a copyright */
#footer .copyright,
#footer .copyright strong,
#footer #signature a {
    color: #fff !important;
}

/* 5. Placeholder v newsletteru (text "Vaše e-mailová adresa") */
#footer ::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}
#footer ::-moz-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}
#footer :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}
#footer ::-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}
#footer ::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}
footer#footer .container {
    background: #34200d !important;
}
.container.footer-bottom span {
    width: 100% !important;
}
footer#footer .platby {
    background: #fff;
    border-radius: 50px !important;
    padding: 8px 15px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    margin-top: 30px;
    margin-bottom: 30px;
}
footer#footer .platby img {
    max-width: 70px;
}
footer#footer .platby img {
    max-width: 80px;
}
footer#footer .banner-wrapper span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}
.form-group.js-validated-element-wrapper label.whole-width, .form-group.js-validated-element-wrapper label.whole-width a {
    font-size: 12px !important;
}
/* Nastavení šířek pro velké obrazovky (desktop) */
@media (min-width: 1200px) {
    /* Newsletter box - 40% */
    .custom-footer__newsletter {
        -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 40% !important;
                flex: 0 0 40% !important;
        max-width: 40% !important;
    }

    /* Ostatní tři informační boxy - každý 20% (celkem 60%) */
    .footer-rows .custom-footer > div:not(.custom-footer__newsletter) {
        -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 20% !important;
                flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}

/* Platební metody - 100% šířka a zarovnání doprava */
/* Předpokládám, že obrázky plateb jsou v kontejneru pod těmito boxy */
.footer-bottom-full-width .container, 
.payment-methods-selector { /* Třída se může lišit dle šablony */
    width: 100% !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-pack: end !important;
        -ms-flex-pack: end !important;
            justify-content: flex-end !important;
    text-align: right;
}

/* Pokud jsou loga plateb v gridu, roztáhneme je */
.footer-bottom-full-width .payment-logos {
    -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 100% !important;
            flex: 0 0 100% !important;
    max-width: 100% !important;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}
/* Vynucení šířky pro newsletter a informační boxy */
@media (min-width: 1200px) {
    /* Newsletter na 40% */
    #footer .custom-footer__newsletter {
        -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 40% !important;
                flex: 0 0 40% !important;
        max-width: 40% !important;
    }

    /* Tři informační boxy na 20% */
    #footer .footer-rows .custom-footer > div:not(.custom-footer__newsletter):not(.custom-footer__banner13) {
        -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 20% !important;
                flex: 0 0 20% !important;
        max-width: 20% !important;
    }

    /* TENTO BLOK: Platby (banner13) na 100% a zarovnat doprava */
    #footer .footer-rows .custom-footer .custom-footer__banner13 {
        -webkit-box-flex: 0 !important;
            -ms-flex: 0 0 100% !important;
                flex: 0 0 100% !important;
        max-width: 100% !important;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
        -webkit-box-pack: end !important;
            -ms-flex-pack: end !important;
                justify-content: flex-end !important;
        margin-top: 20px; /* Mezera od textu nad tím */
    }

    /* Zarovnání samotného obrázku/obsahu uvnitř banneru doprava */
    #footer .custom-footer__banner13 .banner-wrapper {
        margin-left: auto !important;
        margin-right: 0 !important;
        display: block !important;
    }
}

#footer input.form-control {
    background-color: #4f2a07 !important;
    border: none !important;
    border-radius: 50px !important;
    color: #fff !important;
    font-family: "commuters-sans", sans-serif !important;
    font-weight: 400;
    font-style: normal
}
button.btn.btn-default.btn-arrow-right {
    border-radius: 50px !important;
}
span.copyright {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
a.cookies-settings.js-cookies-settings {
    font-size: 11px !important;
}
span#signature a.title {
    font-size: 8px !important;
}
a.designer-signature {
    font-size: 10px;
}