/* ==========================================================
   MASTERBAR SEARCH – FRONTEND v0.1.1
   Wyniki są osobną warstwą dołączaną do <body>, dzięki czemu
   współpracują z nagłówkiem MASTERBAR UI bez zmian w motywie.
   ========================================================== */

.masterbar-search-results {
    position: fixed;
    z-index: 1000000;
    max-height: min(560px, calc(100vh - 110px));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    background: #fff;
    border: 1px solid #dde2e8;
    border-radius: 12px;
    box-shadow: 0 18px 46px rgba(17, 24, 39, 0.18);
    box-sizing: border-box;
}

.masterbar-search-results[hidden] {
    display: none !important;
}

.masterbar-search-result {
    display: grid;
    grid-template-columns: 68px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 88px;
    padding: 10px 14px;
    border-bottom: 1px solid #edf0f3;
    color: #182235;
    text-decoration: none !important;
    background: #fff;
    box-sizing: border-box;
}

.masterbar-search-result:last-child {
    border-bottom: 0;
}

.masterbar-search-result:hover,
.masterbar-search-result:focus,
.masterbar-search-result.is-active {
    outline: 0;
    background: #f5f7fa;
}

.masterbar-search-result-image-wrap {
    display: grid;
    place-items: center;
    width: 68px;
    height: 68px;
    background: #fff;
    border-radius: 8px;
}

.masterbar-search-result-image {
    display: block;
    width: 64px;
    height: 64px;
    object-fit: contain;
}

.masterbar-search-result-main {
    display: block;
    min-width: 0;
}

.masterbar-search-result-name {
    display: block;
    color: #182235;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.32;
    overflow-wrap: anywhere;
}

.masterbar-search-result-sku {
    display: block;
    margin-top: 4px;
    color: #747d8a;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.25;
}

.masterbar-search-result-stock {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
}

.masterbar-search-result-stock.in {
    color: #2e8b57;
}

.masterbar-search-result-stock.out {
    color: #c94f4f;
}

.masterbar-search-result-stock.backorder {
    color: #9a6a00;
}

.masterbar-search-result-price {
    align-self: center;
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
    color: #182235;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
    text-align: right;
}

.masterbar-search-result-price-regular {
    color: #7b8491;
    font-size: 0.86em;
    font-weight: 600;
    text-decoration: line-through;
}

.masterbar-search-result-price-current {
    color: #182235;
    font-weight: 800;
}

.masterbar-search-result-price.is-sale .masterbar-search-result-price-current {
    color: #c62828;
}

.masterbar-search-message {
    padding: 18px;
    color: #687284;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}

/* Opcjonalny shortcode poza MASTERBAR UI. */
.masterbar-search-standalone {
    display: grid;
    grid-template-columns: 1fr 48px;
    width: 100%;
    min-height: 46px;
    border: 1px solid #d9dde3;
    border-radius: 9px;
    background: #f7f7f8;
    overflow: hidden;
}

.masterbar-search-standalone input[type="search"] {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0 16px;
    border: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
}

.masterbar-search-standalone button {
    display: grid;
    place-items: center;
    width: 48px;
    margin: 0;
    padding: 0;
    border: 0;
    background: #1f2937;
    color: #fff;
    cursor: pointer;
}

@media (max-width: 767px) {
    .masterbar-search-results {
        max-height: min(62vh, 520px);
        border-radius: 10px;
    }

    .masterbar-search-result {
        grid-template-columns: 60px minmax(0, 1fr) auto;
        gap: 10px;
        min-height: 80px;
        padding: 9px 10px;
    }

    .masterbar-search-result-image-wrap {
        width: 60px;
        height: 60px;
    }

    .masterbar-search-result-image {
        width: 58px;
        height: 58px;
    }

    .masterbar-search-result-name {
        font-size: 13px;
    }

    .masterbar-search-result-price {
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 3px 6px;
        font-size: 12px;
    }
}

@media (max-width: 420px) {
    .masterbar-search-result {
        grid-template-columns: 56px minmax(0, 1fr);
    }

    .masterbar-search-result-image-wrap {
        width: 56px;
        height: 56px;
    }

    .masterbar-search-result-image {
        width: 54px;
        height: 54px;
    }

    .masterbar-search-result-price {
        grid-column: 2;
        justify-content: flex-start;
        width: 100%;
        margin-top: -2px;
        white-space: normal;
        text-align: left;
    }
}


.masterbar-search-all-results {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 18px;
    border-top: 1px solid #e5e7eb;
    background: #f8fafc;
    font-weight: 700;
    text-decoration: none;
}
.masterbar-search-all-results:hover,
.masterbar-search-all-results:focus {
    background: #eef4f8;
}

.masterbar-search-all-results-top {
    position: sticky;
    top: 0;
    z-index: 2;
    border-top: 0;
    border-bottom: 1px solid #e5e7eb;
}


/* 0.1.12 — osobny slot akcji (np. Ulubione) przy wyniku wyszukiwania.
   Link produktu i przycisk serca są rodzeństwem, więc unikamy zagnieżdżania
   interaktywnego <button> wewnątrz <a>. */
.masterbar-search-result-wrap {
    position: relative;
}
.masterbar-search-result-wrap .masterbar-search-result {
    width: 100%;
    padding-right: 58px;
}
.masterbar-search-result-action {
    position: absolute;
    z-index: 4;
    top: 10px;
    right: 10px;
    display: block;
    width: 38px;
    height: 38px;
    pointer-events: none;
}
.masterbar-search-result-action > * {
    pointer-events: auto;
}
@media (max-width: 767px) {
    .masterbar-search-result-wrap .masterbar-search-result {
        padding-right: 52px;
    }
    .masterbar-search-result-action {
        top: 8px;
        right: 8px;
        width: 34px;
        height: 34px;
    }
}


/* 0.1.13 — wyższy panel wyników: więcej podpowiedzi bez przebijania produktów strony. */
@media (min-width: 768px) {
    .masterbar-search-results {
        max-height: min(74vh, 760px);
    }
}
@media (max-width: 767px) {
    .masterbar-search-results {
        max-height: min(78dvh, 720px);
        max-height: min(78vh, 720px);
    }
}

/* 0.1.14 — pasek przewijania nie blokuje serduszek.
   Sam panel nadal przewija się normalnie myszką, kółkiem, touchpadem i dotykiem. */
.masterbar-search-results {
    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;   /* starsze silniki Microsoft */
}
.masterbar-search-results::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;              /* Chrome / Edge / Safari */
}

/* Dodatkowy bezpieczny odstęp od prawej krawędzi panelu. */
@media (min-width: 768px) {
    .masterbar-search-result-action {
        right: 14px;
    }
    .masterbar-search-result-wrap .masterbar-search-result {
        padding-right: 64px;
    }
}


/* 0.1.15 — iPhone/mobile: panel jest osobną przewijaną warstwą. */
@media (max-width: 900px) {
    .masterbar-search-results {
        /* JS ustawia dokładną wysokość z Visual Viewport; fallback dla innych przeglądarek. */
        max-height: var(--masterbar-search-mobile-max-height, min(72dvh, 720px));
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .masterbar-search-all-results-top {
        position: sticky;
        top: 0;
        z-index: 20;
        flex: 0 0 auto;
        min-height: 58px;
        box-shadow: 0 1px 0 rgba(17, 24, 39, 0.06);
    }

    /* Na telefonie wystarczy zawsze widoczny przycisk u góry. Dolny potrafi
       wejść pod pasek Safari i nie daje dodatkowej wartości. */
    .masterbar-search-all-results-bottom {
        display: none !important;
    }

    html.masterbar-search-mobile-open,
    body.masterbar-search-mobile-open {
        overscroll-behavior: none;
    }
}


/* 0.1.16 — mobile: panel wykorzystuje cały dostępny obszar i szybciej
   przechodzi w pełny widok po zakończeniu pisania. */
@media (max-width: 900px) {
    .masterbar-search-results {
        height: var(--masterbar-search-mobile-max-height, auto);
        max-height: var(--masterbar-search-mobile-max-height, min(72dvh, 720px));
    }
}


/* 0.1.17 — jawny przycisk zamknięcia wyszukiwarki. */
.masterbar-search-toolbar {
    position: sticky;
    top: 0;
    z-index: 30;
    display: grid;
    grid-template-columns: minmax(0,1fr) 52px;
    align-items: stretch;
    min-height: 58px;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 1px 0 rgba(17,24,39,.06);
}
.masterbar-search-toolbar .masterbar-search-all-results-top {
    position: static;
    min-height: 58px;
    border-bottom: 0;
    box-shadow: none;
}
.masterbar-search-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    min-width: 52px;
    min-height: 58px;
    margin: 0;
    padding: 0;
    border: 0;
    border-left: 1px solid #e5e7eb;
    background: #fff;
    color: #182235;
    cursor: pointer;
    touch-action: manipulation;
}
.masterbar-search-close span {
    display: block;
    font-size: 32px;
    font-weight: 300;
    line-height: 1;
    transform: translateY(-1px);
}
.masterbar-search-close:hover,
.masterbar-search-close:focus-visible { background: #eef4f8; outline: 0; }

@media (max-width: 900px) {
    .masterbar-search-toolbar { grid-template-columns: minmax(0,1fr) 54px; min-height: 58px; }
    .masterbar-search-close { width: 54px; min-width: 54px; min-height: 58px; }
}


/* 0.1.18 — pewny, zawsze widoczny przycisk zamknięcia panelu wyników. */
.masterbar-search-toolbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 56px !important;
    overflow: visible !important;
}
.masterbar-search-toolbar > .masterbar-search-all-results-top {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    grid-column: 1 !important;
}
.masterbar-search-toolbar > .masterbar-search-close {
    grid-column: 2 !important;
    position: relative !important;
    z-index: 110 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 56px !important;
    min-width: 56px !important;
    height: auto !important;
    min-height: 58px !important;
    transform: none !important;
    border: 0 !important;
    border-left: 1px solid #dbe2ea !important;
    border-radius: 0 !important;
    background: #173b61 !important;
    color: #fff !important;
    box-shadow: none !important;
    font: inherit !important;
}
.masterbar-search-toolbar > .masterbar-search-close span {
    display: block !important;
    color: #fff !important;
    font-size: 34px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
}
@media (max-width: 900px) {
    .masterbar-search-toolbar {
        grid-template-columns: minmax(0, 1fr) 58px !important;
    }
    .masterbar-search-toolbar > .masterbar-search-close {
        width: 58px !important;
        min-width: 58px !important;
    }
}


/* 0.1.19 — mobile: pełna szerokość panelu + płynny powrót z końca listy. */
@media (max-width: 900px) {
    .masterbar-search-results {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-radius: 0 !important;
        overscroll-behavior-y: none;
    }
}


/* 0.1.20 — iOS/mobile: brak auto-zoom przy focusie pola wyszukiwania.
   Safari nie powiększa inputów o font-size >= 16px. Nie blokujemy pinch-zoom. */
@media (max-width: 900px) {
    form.masterbar-search input[type="search"][name="s"],
    .masterbar-search-standalone input[type="search"] {
        font-size: 16px !important;
    }
}


/* MASTERBAR Variant Groups integration — compact variants inside live search. */
.masterbar-search-variants {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 30px;
    margin-top: 6px;
    overflow: hidden;
}
.masterbar-search-variant {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    box-sizing: border-box;
    border: 1px solid #dbe2ea;
    border-radius: 5px;
    background: #fff;
    color: #182235;
    text-decoration: none !important;
    overflow: hidden;
}
.masterbar-search-variant.mode-thumb {
    width: 28px;
    height: 28px;
}
.masterbar-search-variant.mode-thumb_text {
    width: 34px;
    height: 40px;
    flex-direction: column;
    gap: 1px;
    padding: 1px;
}
.masterbar-search-variant.mode-text {
    max-width: 66px;
    height: 28px;
    padding: 2px 6px;
}
.masterbar-search-variant-thumb {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
}
.masterbar-search-variant.mode-thumb_text .masterbar-search-variant-thumb {
    width: 24px;
    height: 24px;
}
.masterbar-search-variant-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.masterbar-search-variant-label {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 8px;
    line-height: 1.05;
    text-align: center;
}
.masterbar-search-variant.mode-text .masterbar-search-variant-label {
    font-size: 9px;
    font-weight: 700;
}
.masterbar-search-variant.is-active {
    border: 2px solid #0f4c81;
}
.masterbar-search-variant.is-out {
    opacity: .5;
    filter: grayscale(1);
}
.masterbar-search-variant.is-out::before,
.masterbar-search-variant.is-out::after {
    content: "";
    position: absolute;
    z-index: 3;
    left: 3px;
    right: 3px;
    top: 50%;
    height: 2px;
    border-radius: 2px;
    background: #000;
    pointer-events: none;
}
.masterbar-search-variant.is-out::before { transform: rotate(45deg); }
.masterbar-search-variant.is-out::after { transform: rotate(-45deg); }
.masterbar-search-variant.is-out .masterbar-search-variant-label {
    text-decoration: line-through;
}
.masterbar-search-variant-more {
    color: #526477;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .masterbar-search-variants { gap: 3px; }
    .masterbar-search-variant.mode-thumb_text { width: 32px; }
    .masterbar-search-variant.mode-text { max-width: 58px; }
}


/* 0.1.25 — warianty są osobnym, poprawnym semantycznie wierszem obok linku produktu.
   Naprawia zagnieżdżone <a> i widoczność na Safari/iOS. */
.masterbar-search-result-wrap > .masterbar-search-variants {
    box-sizing: border-box;
    width: 100%;
    min-height: 38px;
    height: auto;
    margin: 0;
    padding: 4px 64px 7px 96px;
    border-bottom: 1px solid #edf0f3;
    background: #fff;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.masterbar-search-result-wrap > .masterbar-search-variants::-webkit-scrollbar { display:none; }
.masterbar-search-result-wrap:has(> .masterbar-search-variants) > .masterbar-search-result {
    border-bottom: 0;
    padding-bottom: 5px;
}
.masterbar-search-result-wrap > .masterbar-search-variants .masterbar-search-variant {
    touch-action: manipulation;
}
@media (max-width: 767px) {
    .masterbar-search-result-wrap > .masterbar-search-variants {
        min-height: 38px;
        padding: 3px 52px 7px 80px;
    }
}
@media (max-width: 420px) {
    .masterbar-search-result-wrap > .masterbar-search-variants {
        padding-left: 70px;
        padding-right: 10px;
    }
}

/* 0.1.38: Warianty obok danych produktu, bez drugiego wysokiego wiersza.
   Linki wariantów pozostają rodzeństwem linku produktu. */
@media (min-width: 768px) {
  .masterbar-search-result-wrap:has(.masterbar-search-variants-slot:not(:empty)) > .masterbar-search-result {
    min-height: 82px;
    padding-bottom: 28px;
  }
  .masterbar-search-result-wrap > .masterbar-search-variants-slot:not(:empty) {
    position: absolute;
    z-index: 3;
    right: 63px;
    bottom: 4px;
    max-width: min(225px, 46%);
    overflow-x: auto;
    scrollbar-width: none;
  }
  .masterbar-search-result-wrap > .masterbar-search-variants-slot .masterbar-search-variants {
    margin: 0;
    min-height: 27px;
    justify-content: flex-end;
  }
  .masterbar-search-result-wrap > .masterbar-search-variants-slot .masterbar-search-variant.mode-thumb {
    width: 25px; height: 25px;
  }
}
@media (max-width: 767px) {
  .masterbar-search-result-wrap > .masterbar-search-variants-slot:not(:empty) {
    padding: 0 52px 6px 80px;
    border-bottom: 1px solid #edf0f3;
  }
  .masterbar-search-result-wrap > .masterbar-search-variants-slot .masterbar-search-variants { margin: 0; }
}

/* 0.1.39: nowy tryb wyszukiwarki, aktywowany tylko przełącznikiem */
.masterbar-search-suggestion-heading {padding:12px 16px 7px;font-weight:700;font-size:13px;color:#566477;background:#f7f9fc}
.masterbar-search-suggestion {display:block;width:100%;border:0;border-bottom:1px solid #edf0f4;background:white;text-align:left;padding:13px 16px;color:#132c4a;font:inherit;cursor:pointer}
.masterbar-search-suggestion:hover {background:#f2f6fa}
@media(max-width:900px) {
 body.masterbar-search-enhanced-mobile .masterbar-search-results {border-radius:0!important;max-height:calc(100dvh - 65px)!important;overflow-y:auto!important;z-index:999999!important}
 body.masterbar-search-enhanced-mobile form.masterbar-search {position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;height:65px!important;z-index:999999!important;background:white!important;padding:10px 14px!important;box-sizing:border-box!important;display:flex!important;align-items:center!important}
 body.masterbar-search-enhanced-mobile form.masterbar-search input[type=search] {flex:1!important;min-width:0!important}
}

/* 0.1.40: czytelne podpowiedzi przy hover, focus i nawigacji klawiaturą.
   Wysoka specyficzność chroni przed globalnymi stylami przycisków motywu. */
.masterbar-search-results button.masterbar-search-suggestion,
.masterbar-search-results button.masterbar-search-suggestion:visited {
  background-color:#fff !important;
  color:#132c4a !important;
  opacity:1 !important;
}
.masterbar-search-results button.masterbar-search-suggestion:hover,
.masterbar-search-results button.masterbar-search-suggestion:focus,
.masterbar-search-results button.masterbar-search-suggestion:focus-visible {
  background-color:#eaf2fa !important;
  color:#132c4a !important;
  opacity:1 !important;
}
.masterbar-search-results button.masterbar-search-suggestion:active {
  background-color:#dceaf8 !important;
  color:#132c4a !important;
}
.masterbar-search-results button.masterbar-search-suggestion *,
.masterbar-search-results button.masterbar-search-suggestion:hover *,
.masterbar-search-results button.masterbar-search-suggestion:focus * {
  color:inherit !important;
}

/* 0.1.41: pelnoekranowy tryb mobile bez przeswitujacego tla. */
@media(max-width:900px) {
 body.masterbar-search-enhanced-mobile::before {content:"";position:fixed;inset:0;background:#fff;z-index:999990;pointer-events:auto;}
 body.masterbar-search-enhanced-mobile .masterbar-search-results {bottom:auto!important;max-height:none!important;height:var(--masterbar-search-mobile-max-height,calc(100dvh - 65px))!important;box-sizing:border-box!important;background:#fff!important;overscroll-behavior:contain!important;}
 body.masterbar-search-enhanced-mobile form.masterbar-search {z-index:999998!important;}
 body.masterbar-search-enhanced-mobile .masterbar-search-result:active,
 body.masterbar-search-enhanced-mobile .masterbar-search-suggestion:active {background:#fff!important;}
 body.masterbar-search-enhanced-mobile .masterbar-search-result,
 body.masterbar-search-enhanced-mobile .masterbar-search-suggestion {-webkit-tap-highlight-color:transparent;}
 body.masterbar-search-enhanced-mobile .masterbar-search-all-results-bottom {display:block!important;text-align:center;padding:16px!important;}
}

/* 0.1.42: stale widoczne pole na iOS Safari; lista przewija sie osobno. */
@media (max-width:900px) {
 body.masterbar-search-enhanced-mobile form.masterbar-search {
   position:fixed!important;right:auto!important;transform:none!important;
   margin:0!important;min-height:65px!important;max-height:65px!important;
   visibility:visible!important;opacity:1!important;z-index:1000002!important;
 }
 body.masterbar-search-enhanced-mobile .masterbar-search-results {
   position:fixed!important;z-index:1000001!important;overflow-y:auto!important;
   -webkit-overflow-scrolling:touch!important;
 }
}

/* 0.1.43: iOS – niezależny panel, stabilne przewijanie i pole nad wynikami. */
@media (max-width:900px) {
 body.masterbar-search-enhanced-mobile .masterbar-search-results {
   touch-action:pan-y!important;overscroll-behavior-y:contain!important;
   -webkit-overflow-scrolling:touch!important;
 }
 body.masterbar-search-enhanced-mobile form.masterbar-search {
   pointer-events:auto!important;touch-action:manipulation!important;
 }
 body.masterbar-search-enhanced-mobile form.masterbar-search input[type=search] {
   -webkit-user-select:text!important;user-select:text!important;
 }
}

/* 0.1.48: stały przycisk zamknięcia mobilnej wyszukiwarki, również przy 1–2 znakach. */
@media (max-width:900px) {
 body.masterbar-search-enhanced-mobile form.masterbar-search .masterbar-search-mobile-dismiss {
   display:flex!important;align-items:center!important;justify-content:center!important;
   flex:0 0 40px!important;width:40px!important;height:40px!important;
   margin-left:8px!important;padding:0!important;border:0!important;border-radius:8px!important;
   background:#f0f3f7!important;color:#163458!important;font-size:30px!important;
   line-height:1!important;cursor:pointer!important;z-index:1000003!important;
 }
 body.masterbar-search-enhanced-mobile .masterbar-search-results {
   overflow-y:auto!important;touch-action:pan-y!important;-webkit-overflow-scrolling:touch!important;
 }
}

/* 0.1.51: mobilny overlay trzyma szerokosc layout viewport, bez rozszerzania dokumentu. */
@media (max-width: 900px) {
  body.masterbar-search-enhanced-mobile > form.masterbar-search {
    left: 0 !important; right: 0 !important; width: 100% !important;
    max-width: 100% !important; box-sizing: border-box !important;
  }
  body.masterbar-search-enhanced-mobile .masterbar-search-results {
    left: 0 !important; right: 0 !important; width: 100% !important;
    max-width: 100% !important; box-sizing: border-box !important;
  }
  body.masterbar-search-enhanced-mobile > form.masterbar-search input[type="search"] {
    min-width: 0 !important; font-size: 16px !important;
  }
}