/* ===========================================    SHARPI Header Switchers v4.5.2 (custom currency)    =========================================== */ #sharpi-header-switchers {   display:inline-flex;   align-items:center;   gap:8px;   white-space:nowrap;   z-index:999999; } #sharpi-header-switchers.is-floating {   position:fixed;   top:10px;   right:10px; } #sharpi-header-switchers, #sharpi-header-switchers * {   box-sizing:border-box; } #sharpi-header-switchers .sharpi-switcher {   position:relative;   display:inline-flex;   align-items:center;   min-height:34px;   padding:0 10px;   border-radius:12px;   border:1px solid rgba(255,255,255,.16);   background:rgba(255,255,255,.10);   color:#fff;   line-height:1;   backdrop-filter:blur(6px);   font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;   font-size:12px;   font-weight:800;   letter-spacing:.4px; } /* Hide the original widgets but keep them in DOM for scripts */ #sharpi-header-switchers .sharpi-origin--lang, #sharpi-header-switchers .sharpi-origin--curr {   position:absolute !important;   top:0 !important;   right:0 !important;   width:1px !important;   height:1px !important;   overflow:hidden !important;   opacity:0.001 !important;   pointer-events:none !important; } /* Custom dropdown shared styles */ #sharpi-header-switchers .sharpi-dd {   position:relative;   display:inline-flex;   align-items:center;   height:34px; } #sharpi-header-switchers .sharpi-dd__btn {   all:unset;   cursor:pointer;   display:inline-flex;   align-items:center;   gap:8px;   height:34px;   padding:0 2px;   color:inherit; } #sharpi-header-switchers .sharpi-dd__flag {   width:22px;   height:16px;   display:block;   border-radius:3px;   overflow:hidden;   object-fit:cover; } #sharpi-header-switchers .sharpi-dd__code {   font-size:12px;   font-weight:800;   letter-spacing:.4px;   opacity:.98; } #sharpi-header-switchers .sharpi-switcher--curr .sharpi-dd__code {   min-width:42px;   text-align:center; } #sharpi-header-switchers .sharpi-dd__caret {   width:10px;   height:10px;   opacity:.8;   margin-left:2px;   display:inline-flex;   align-items:center;   justify-content:center; }  #sharpi-header-switchers .sharpi-switcher--curr, #sharpi-header-switchers .sharpi-switcher--curr *{   pointer-events:auto !important; } #sharpi-header-switchers .sharpi-switcher--curr .sharpi-dd__menu{   z-index:99999999 !important; } #sharpi-header-switchers .sharpi-dd__menu {   position:absolute;   top:calc(100% + 8px);   right:0;   min-width:220px;   max-height:320px;   overflow:auto;   padding:6px;   border-radius:14px;   background:rgba(20,20,20,.92);   border:1px solid rgba(255,255,255,.12);   box-shadow:0 10px 25px rgba(0,0,0,.35);   display:none;   z-index:99999999; } #sharpi-header-switchers .sharpi-dd.is-open .sharpi-dd__menu {   display:block; } #sharpi-header-switchers .sharpi-dd__item {   display:flex;   align-items:center;   gap:8px;   padding:6px 8px;   border-radius:8px;   cursor:pointer;   color:#fff;   font-size:12px;   line-height:1.2;   white-space:nowrap; } #sharpi-header-switchers .sharpi-dd__item:hover {   background:rgba(255,255,255,.08); } #sharpi-header-switchers .sharpi-dd__item.is-current {   background:rgba(255,255,255,.18); } /* MOBILE — switcher w headerze, zawsze widoczny i klikalny */ @media (max-width:768px) {   /* Gdy JS wsadzi go do headera (is-in-header) */   #sharpi-header-switchers,   #sharpi-header-switchers.is-in-header {     position:static !important;     top:auto !important;     right:auto !important;     bottom:auto !important;     left:auto !important;     display:inline-flex !important;     align-items:center;     gap:4px;     min-height:30px !important;     transform:none !important;     contain:none !important;     z-index:9999 !important;   }   /* Gdy zostaje floating (is-floating) — przesuń wyżej żeby nie zasłaniać sticky CTA */   #sharpi-header-switchers.is-floating {     position:static !important;     top:auto !important;     bottom:auto !important;     right:auto !important;     left:auto !important;     opacity:1 !important;     /* Dropdown musi być widoczny ponad wszystkim */     z-index:9999 !important;   }   /* Smaller switchers on mobile */   #sharpi-header-switchers .sharpi-switcher {     min-height:30px !important;     padding:0 7px !important;     border-radius:9px !important;     font-size:11px !important;   }   #sharpi-header-switchers .sharpi-dd,   #sharpi-header-switchers .sharpi-dd__btn { height:30px !important; }   #sharpi-header-switchers .sharpi-dd__code { font-size:11px !important; }   /* Pokaż walutę, ukryj kod języka (flaga wystarczy) */   #sharpi-header-switchers .sharpi-switcher--lang .sharpi-dd__code { display:none !important; }   #sharpi-header-switchers .sharpi-switcher--curr .sharpi-dd__code { display:inline !important; min-width:32px !important; }   /* Dropdown menu: zawsze nad wszystkim, nie przycinany */   #sharpi-header-switchers .sharpi-dd__menu {     z-index:99999999 !important;     position:fixed !important;     top:auto !important;     right:8px !important;     bottom:auto !important;     max-height:60vh !important;     overflow-y:auto !important;   } } @media (max-width:480px) {   #sharpi-header-switchers.is-floating {     top:8px !important;     right:6px !important;   }   #sharpi-header-switchers .sharpi-switcher {     min-height:28px !important;     padding:0 5px !important;   } }  /* FIX: Dropdown menu — zawsze wyświetla się ponad wszystkim, nie obcinany przez header */ /* Działa zarówno gdy switcher jest w headerze (is-in-header) jak i floating */ #sharpi-header-switchers .sharpi-dd__menu {   /* Przesłaniamy position:absolute defaultem z JS (fixed) na mobile */   isolation: isolate; } /* Gdy menu jest otwarte - wymuś widoczność */ #sharpi-header-switchers .sharpi-dd.is-open .sharpi-dd__menu {   display: block !important;   visibility: visible !important;   opacity: 1 !important;   pointer-events: auto !important;   z-index: 2147483647 !important; /* max z-index */ } /* Nagłówek nie może przycinać dropdownu */ header, .site-header, .ast-primary-header-bar, #masthead, .main-header-bar {   overflow: visible !important;   /* Tworzymy nowy stacking context ale bez overflow clipping */   isolation: isolate; } /*# sourceURL=sharpi-hs452-inline-css */ 
 /* ============================================================================    SHARPI MOBILE FIX v1.4.0    ============================================================================ */   /* ─────────────────────────────────────────────────────────────────────────    FIX A: switchery NIGDY position:fixed na mobile.    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 768px) {     #sharpi-header-switchers,     #sharpi-header-switchers.is-floating,     #sharpi-header-switchers.is-in-header {         position: static !important;         top: auto !important;         right: auto !important;         bottom: auto !important;         left: auto !important;     } }   /* ─────────────────────────────────────────────────────────────────────────    FIX B (KRYTYCZNE): nadpisujemy reguły z sharpi-visual-polish-css.php    dla stron koszyka i checkout, które wymuszały flex-wrap: nowrap.    To one BLOKOWAŁY przejście do 2-rzędowego layoutu na tych stronach.    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 768px) {     body.woocommerce-cart .site-header .header-content,     body.woocommerce-checkout .site-header .header-content,     body.woocommerce-cart .header-content,     body.woocommerce-checkout .header-content {         flex-wrap: wrap !important;            /* nadpisuje nowrap z linii 464 */         align-items: center !important;         gap: 0 !important;         row-gap: 8px !important;         column-gap: 8px !important;     } }   /* ─────────────────────────────────────────────────────────────────────────    FIX C (KRYTYCZNE): menu kategorii (po kliknięciu hamburgera) MUSI być    nad switcherami. Bez tego switchery zakrywają wybory w menu.     .main-navigation.active to drawer z menu kategorii (style.css linia 288).    sharpi-visual-polish-css.php linia 527 daje switcherom z-index: 9999,    więc menu kategorii (bez z-index = auto = 0) jest pod nimi.    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 992px) {     .site-header .main-navigation,     .site-header .main-navigation.active {         z-index: 100000 !important;       /* WYŻEJ niż switchery (9999) */     }     /* Kiedy menu jest otwarte — switchery i ich dropdowny CHOWAMY,        żeby nie konkurowały o widoczność z wybieranymi kategoriami */     .site-header.is-menu-open #sharpi-header-switchers,     body.menu-open #sharpi-header-switchers,     .main-navigation.active ~ * #sharpi-header-switchers,     .main-navigation.active + #sharpi-header-switchers,     body:has(.main-navigation.active) #sharpi-header-switchers {         visibility: hidden !important;         pointer-events: none !important;     }     /* Zamknij też wszelkie otwarte dropdowny gdy menu się otwiera */     body:has(.main-navigation.active) #sharpi-header-switchers .sharpi-dd__menu {         display: none !important;     } }   /* ─────────────────────────────────────────────────────────────────────────    (1) HEADER NA MOBILE — 2 RZĘDY    Rząd 1 (góra): LOGO ........................................ HAMBURGER    Rząd 2 (dół):  🇵🇱   PLN ▼              🔍   👤   🛒    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 768px) {      .site-header {         padding: 0.65rem 0 !important;         overflow: visible !important;     }     .site-header .container,     .site-header .header-content {         overflow: visible !important;     }      /* Główny kontener — wrap na 2 rzędy (działa też na koszyku, patrz FIX B) */     .site-header .header-content,     body.woocommerce-cart .site-header .header-content,     body.woocommerce-checkout .site-header .header-content {         display: flex !important;         flex-wrap: wrap !important;         align-items: center !important;         gap: 0 !important;         row-gap: 8px !important;         column-gap: 8px !important;     }      /* ===== RZĄD 1: LOGO + HAMBURGER ===== */      /* Logo — po lewej */     .site-header .site-logo {         order: 1 !important;         flex: 1 1 auto !important;         justify-content: flex-start !important;         max-width: none !important;         margin-left: 0 !important;         overflow: hidden !important;         min-width: 0 !important;     }     .site-header .site-logo img,     .site-header .site-logo .custom-logo,     .site-header .site-logo a.custom-logo-link img,     .site-header img.custom-logo,     .site-header a.custom-logo-link img,     .site-header .custom-logo {         max-width: 200px !important;         max-height: 52px !important;         width: auto !important;         height: auto !important;         object-fit: contain !important;     }     .site-header .site-logo a {         font-size: 1.6rem !important;         letter-spacing: 0.3px !important;     }      /* Hamburger — po prawej */     .site-header .mobile-menu-toggle {         order: 2 !important;         display: flex !important;         flex: 0 0 auto !important;         margin-left: auto !important;         width: 42px !important;         height: 42px !important;     }      .site-header .main-navigation,     .site-header .nav-overlay {         order: 99 !important;     }      .site-header .header-icons {         display: contents !important;     }      /* ===== RZĄD 2 ===== */      /* Switchery — początek rzędu 2 */     .site-header #sharpi-header-switchers,     #sharpi-header-switchers.is-in-header,     #sharpi-header-switchers.is-floating {         order: 10 !important;         flex: 1 1 calc(100% - 140px) !important;         max-width: calc(100% - 140px) !important;         display: inline-flex !important;         justify-content: flex-start !important;         align-items: center !important;         gap: 6px !important;         margin-top: 4px !important;         padding-top: 8px !important;         border-top: 1px solid rgba(255,255,255,0.08) !important;     }      /* Szukaj, konto, koszyk */     .site-header .header-icons .search-toggle {         order: 11 !important;         display: inline-flex !important;         margin-top: 4px !important;         padding-top: 8px !important;     }     .site-header .header-icons a[aria-label*="konto"],     .site-header .header-icons a[aria-label*="account"],     .site-header .header-icons .header-icon[href*="moje-konto"],     .site-header .header-icons .header-icon[href*="my-account"] {         order: 12 !important;         display: inline-flex !important;         margin-top: 4px !important;         padding-top: 8px !important;     }     .site-header .header-icons .cart-icon,     .site-header .header-icons a[aria-label*="oszyk"] {         order: 13 !important;         display: inline-flex !important;         margin-top: 4px !important;         padding-top: 8px !important;     }      .site-header .header-icons .header-icon {         width: 36px !important;         height: 36px !important;         align-items: center !important;         justify-content: center !important;     }      /* Switchery — kompaktowy wygląd */     #sharpi-header-switchers .sharpi-switcher {         min-height: 32px !important;         padding: 0 8px !important;         border-radius: 10px !important;     }     #sharpi-header-switchers .sharpi-dd,     #sharpi-header-switchers .sharpi-dd__btn {         height: 32px !important;     }     #sharpi-header-switchers .sharpi-switcher--lang .sharpi-dd__code {         display: none !important;     }     #sharpi-header-switchers .sharpi-switcher--curr .sharpi-dd__code {         display: inline !important;         font-size: 11px !important;         min-width: 32px !important;     } }   /* ─────────────────────────────────────────────────────────────────────────    (2) DROPDOWN — szeroki, blisko buttona.    Nadpisujemy reguły z visual-polish-css.php linia 487-499, które ustawiały    right:0; left:auto z max-width auto.    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 992px) {     /* Kafelki switchera nie tną zawartości — wysoka specyficzność */     #sharpi-header-switchers,     #sharpi-header-switchers .sharpi-switcher,     #sharpi-header-switchers .sharpi-switcher--lang,     #sharpi-header-switchers .sharpi-switcher--curr,     #sharpi-header-switchers .sharpi-dd,     #sharpi-header-switchers .sharpi-dd--lang,     #sharpi-header-switchers .sharpi-dd--curr {         overflow: visible !important;         contain: none !important;     }      /* Menu — pozycja będzie ustawiona przez JS, tu defaultowo szerokie i widoczne.        Selektory bardziej specyficzne niż w visual-polish (linia 487-499). */     #sharpi-header-switchers .sharpi-switcher--lang .sharpi-dd__menu,     #sharpi-header-switchers .sharpi-switcher--curr .sharpi-dd__menu,     #sharpi-header-switchers .sharpi-dd--lang .sharpi-dd__menu,     #sharpi-header-switchers .sharpi-dd--curr .sharpi-dd__menu,     #sharpi-header-switchers .sharpi-dd__menu {         /* pozycja — JS poniżej ustawi konkretne wartości fixed top/left.            Tu defaultowe pozycjonowanie pod buttonem (gdy JS nie zdąży). */         position: fixed !important;         top: 100px !important;            /* dynamicznie z JS */         left: 8px !important;         right: auto !important;         bottom: auto !important;          width: 90vw !important;            /* szerokie! 90% szerokości ekranu */         min-width: 240px !important;         max-width: calc(100vw - 16px) !important;         max-height: 60vh !important;          background: #1a1a1a !important;         border: 1px solid rgba(255,255,255,0.18) !important;         border-radius: 12px !important;         box-shadow: 0 12px 32px rgba(0,0,0,0.55) !important;         padding: 6px !important;          overflow-y: auto !important;         -webkit-overflow-scrolling: touch !important;          /* z-index: 1001 — wyżej niż header (1000) ale niżej niż menu            kategorii (100000 ustawione w FIX C). */         z-index: 1001 !important;     }      #sharpi-header-switchers .sharpi-dd.is-open .sharpi-dd__menu {         display: block !important;         visibility: visible !important;         opacity: 1 !important;         pointer-events: auto !important;     }      #sharpi-header-switchers .sharpi-dd__item {         padding: 10px 12px !important;         font-size: 13px !important;         min-height: 40px !important;         border-radius: 8px !important;     }     #sharpi-header-switchers .sharpi-dd__item .sharpi-dd__flag {         width: 24px !important;         height: 16px !important;     } }   /* ─────────────────────────────────────────────────────────────────────────    (3) STOPKA NA MOBILE — 2 kolumny × 2 rzędy    ───────────────────────────────────────────────────────────────────────── */ @media (max-width: 768px) {     .site-footer {         padding: 1.75rem 0 1rem !important;     }     .site-footer .footer-content {         display: grid !important;         grid-template-columns: 1fr 1fr !important;         gap: 1rem 1.25rem !important;         margin-bottom: 1.5rem !important;         text-align: left !important;     }     .site-footer .footer-column {         min-width: 0 !important;     }     .site-footer .footer-column h3 {         font-size: 0.75rem !important;         margin-bottom: 0.5rem !important;         letter-spacing: 0.04em !important;     }     .site-footer .footer-column ul {         gap: 0.35rem !important;     }     .site-footer .footer-column a,     .site-footer .footer-column li {         font-size: 0.78rem !important;         line-height: 1.35 !important;     }     .site-footer .social-icons {         gap: 0.4rem !important;         flex-wrap: wrap !important;         justify-content: flex-start !important;     }     .site-footer .social-icon {         width: 34px !important;         height: 34px !important;         font-size: 0.85rem !important;         border-width: 1.5px !important;     }     .site-footer .footer-newsletter {         margin-top: 0.75rem !important;     }     .site-footer .footer-newsletter h4 {         font-size: 0.72rem !important;         margin-bottom: 0.4rem !important;     }     .site-footer .newsletter-form input[type="email"] {         font-size: 0.75rem !important;         padding: 0.45rem 0.55rem !important;     }     .site-footer .newsletter-form button {         padding: 0.45rem 0.7rem !important;         font-size: 0.75rem !important;     }     .site-footer .footer-brands {         padding-top: 1.25rem !important;         margin-bottom: 1.25rem !important;     }     .site-footer .footer-brands h3 {         font-size: 0.7rem !important;         margin-bottom: 0.75rem !important;     }     .site-footer .brands-grid {         gap: 0.75rem 1rem !important;     }     .site-footer .brand-logo span {         font-size: 0.85rem !important;     }     .site-footer .footer-payments {         padding-top: 1rem !important;         margin-bottom: 1rem !important;     }     .site-footer .footer-payments span {         font-size: 0.72rem !important;     }     .site-footer .footer-payments .fa-brands {         font-size: 1.4rem !important;     }     .site-footer .footer-bottom {         padding-top: 1rem !important;     }     .site-footer .footer-bottom p {         font-size: 0.7rem !important;         line-height: 1.4 !important;     } }  @media (max-width: 380px) {     .site-footer .footer-content {         gap: 0.85rem 0.85rem !important;     }     .site-footer .footer-column a,     .site-footer .footer-column li {         font-size: 0.74rem !important;     }     .site-header #sharpi-header-switchers,     #sharpi-header-switchers.is-in-header {         flex: 1 1 calc(100% - 120px) !important;         max-width: calc(100% - 120px) !important;     }     .site-header .header-icons .header-icon {         width: 32px !important;         height: 32px !important;     }     .site-header .site-logo img,     .site-header .custom-logo,     .site-header a.custom-logo-link img {         max-width: 160px !important;         max-height: 44px !important;     } } /*# sourceURL=sharpi-mobile-fix-inline-css */