/* Sportina B2B Theme - cleaned version */

/* =========================================================
   01. Base
   ========================================================= */

/*
    Inter, hostowany lokalnie. Do 2026-07-30 motyw deklarowal "Inter" w font-family,
    ale font NIE byl nigdzie wgrany - ani @font-face, ani link do Google Fonts. Portal
    renderowal sie wiec w Segoe UI (Windows) albo Arialu (reszta systemow), czyli KAZDY
    KLIENT WIDZIAL INNY KROJ, a projekt byl robiony pod Inter. Skutkiem ubocznym bylo
    to, ze font-weight powyzej 700 nie dzialal: Segoe UI konczy sie na Bold.

    Wersja zmienna: jeden plik pokrywa wagi 100-900, wiec 600, 700 i 800 sa realne.
    font-display: swap - tekst widoczny od razu w kroju zastepczym, bez pustej strony.
    Licencja SIL OFL 1.1, kopia lezy obok pliku fontu.
*/
@font-face {
    font-family: Inter;
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    /*
        NAZWA FORMATU MUSI BYC W CUDZYSLOWACH.

        Bylo `format(woff2-variations)` bez cudzyslowow — to blad skladni, wiec przegladarka
        odrzuca CALY deskryptor `src`. Skutek byl podstepny: regula @font-face istniala
        (widoczna w document.styleSheets jako rodzina "Inter"), ale z PUSTYM `src`, czyli
        font nigdy sie nie wczytywal. Plik lezal na serwerze od 30.07 nieuzywany, konsola
        mowila tylko "preloaded but not used", a caly portal renderowal sie awaryjnym
        Segoe UI / Arialem — dokladnie tym, czego ten @font-face mial nie dopuscic.

        `format("woff2")` wystarcza dla fontu zmiennego; `woff2-variations` jest wycofane.
    */
    src: url(../fonts/inter/InterVariable.woff2) format("woff2");
}

body.sportina-b2b-ui {
    background: #f5f6fb;
    color: #111827;
    font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

body.sportina-b2b-ui .page-wrapper {
    background:
        radial-gradient(circle at 12% 0%, rgba(99, 102, 241, 0.10), transparent 30%),
        radial-gradient(circle at 88% 8%, rgba(139, 92, 246, 0.12), transparent 34%),
        #f5f6fb;
}

body.sportina-b2b-ui .page-main {
    max-width: 1440px;
    padding-left: 28px;
    padding-right: 28px;
}

body.sportina-b2b-ui .breadcrumbs {
    max-width: 1440px;
    margin-top: 22px;
    margin-bottom: 0;
    padding-left: 28px;
    padding-right: 28px;
}

/*
    Okruszki czytaly sie jako wyblakle. Nie chodzilo o opacity (bylo 1), tylko o
    jasnoszary #6b7280 na bieli - kontrast ok. 4,8:1, czyli AA tylko o wlos.
    #4b5563 daje ok. 7:1 i tekst po prostu daje sie przeczytac.
*/
body.sportina-b2b-ui .breadcrumbs a,
body.sportina-b2b-ui .breadcrumbs strong {
    color: #4b5563;
    font-weight: 600;
}

/* Luma ustawia tu #707070 na liscie - stad reszta okruszkow tez byla jasna. */
body.sportina-b2b-ui .breadcrumbs .items,
body.sportina-b2b-ui .breadcrumbs .item {
    color: #4b5563;
}

body.sportina-b2b-ui .page-title-wrapper {
    margin-top: 30px;
    margin-bottom: 22px;
}

body.sportina-b2b-ui .page-title .base {
    color: #111827;
    font-size: 34px;
    font-weight: 600;
    letter-spacing: -0.035em;
}

/* =========================================================
   02. Header
   ========================================================= */

body.sportina-b2b-ui .panel.wrapper {
    background: #0c0d0d;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.sportina-b2b-ui .panel.header {
    max-width: 1440px;
    padding-left: 28px;
    padding-right: 28px;
}

body.sportina-b2b-ui .panel.header,
body.sportina-b2b-ui .panel.header a,
body.sportina-b2b-ui .header.links a {
    color: rgba(255, 255, 255, 0.88);
    font-weight: 600;
}

body.sportina-b2b-ui .page-header {
    background: linear-gradient(135deg, #0c0d0d 0%, #11111b 52%, #24123f 100%);
    border: 0;
    box-shadow: 0 18px 55px rgba(15, 23, 42, 0.18);
}

body.sportina-b2b-ui .header.content {
    max-width: 1440px;
    min-height: 104px;
    padding: 22px 28px;
    display: flex;
    align-items: center;
    gap: 28px;
}

body.sportina-b2b-ui .header.content .logo {
    order: 1;
    float: none;
    flex: 0 0 230px;
    width: 230px !important;
    min-width: 230px;
    height: 70px;
    margin: 0;
    display: block;
    background-image: url("../images/logo-sportina.png");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: contain;
}

body.sportina-b2b-ui .logo img {
    display: none !important;
}

body.sportina-b2b-ui .logo::before,
body.sportina-b2b-ui .logo::after {
    content: none !important;
    display: none !important;
}

body.sportina-b2b-ui .header.content .block-search {
    order: 2;
    flex: 0 1 540px;
    width: 540px;
    max-width: 540px;
    margin-left: auto;
    margin-right: 18px;
    padding-left: 0;
    float: none;
}

body.sportina-b2b-ui .block-search .control {
    border-top: 0;
    padding: 0;
}

body.sportina-b2b-ui .block-search input {
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.96);
    color: #111827;
    padding-left: 18px;
    padding-right: 48px;
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.22);
}

body.sportina-b2b-ui .block-search .action.search {
    right: 10px;
    top: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.sportina-b2b-ui .header.content .minicart-wrapper {
    order: 3;
    flex: 0 0 auto;
    float: none;
    margin: 0;
}

body.sportina-b2b-ui .minicart-wrapper .action.showcart {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.sportina-b2b-ui .minicart-wrapper .action.showcart::before {
    color: #c7d2fe !important;
    font-size: 26px;
}

/* Customer dropdown */
body.sportina-b2b-ui .customer-welcome,
body.sportina-b2b-ui .customer-welcome .customer-name {
    color: #ffffff !important;
    font-weight: 600;
}

body.sportina-b2b-ui .customer-welcome .customer-menu {
    z-index: 9999 !important;
}

body.sportina-b2b-ui .customer-welcome .customer-menu .header.links {
    display: block !important;
    min-width: 220px !important;
    padding: 10px 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px !important;
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
    overflow: hidden !important;
    z-index: inherit !important;
}

body.sportina-b2b-ui .customer-welcome .customer-menu .header.links li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.sportina-b2b-ui .customer-welcome .customer-menu .header.links li a {
    display: block !important;
    padding: 11px 16px !important;
    color: #111827 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    background: #ffffff !important;
}

body.sportina-b2b-ui .customer-welcome .customer-menu .header.links li a:hover {
    background: #f5f6fb !important;
    color: #4f46e5 !important;
}

/* =========================================================
   03. Listing toolbar and filters
   ========================================================= */

body.sportina-b2b-ui .sidebar-additional,
body.sportina-b2b-ui .block-compare,
body.sportina-b2b-ui .block-reorder,
body.sportina-b2b-ui .block-wishlist {
    display: none !important;
}

body.sportina-b2b-ui.catalog-category-view .columns,
body.sportina-b2b-ui.catalogsearch-result-index .columns {
    display: block !important;
}

body.sportina-b2b-ui.catalog-category-view .column.main,
body.sportina-b2b-ui.catalogsearch-result-index .column.main {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
}

body.sportina-b2b-ui .sportina-toolbar-merged {
    width: 100%;
    margin: 0 0 24px 0;
    padding: 16px 22px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: #ffffff;
    /* Owijak paska filtrow na listingu. Promien 28 px + miekki cien byly ostatnia
       obla rzecza tego widoku - pasek wyglada obco przy kanciastych kaflach.
       Namierzony przegladarka: DIV.sportina-toolbar-merged, 1384x72, r28px. */
    border: 1px solid #dcdfe4;
    border-radius: 2px;
    box-shadow: none;
    position: relative;
    z-index: 60;
    overflow: visible !important;
}

body.sportina-b2b-ui .sportina-toolbar-left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex: 1 1 auto;
    min-width: 0;
    overflow: visible !important;
}

body.sportina-b2b-ui .sportina-toolbar-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    margin-left: auto;
    overflow: visible !important;
}

body.sportina-b2b-ui .filter-options-content .items {
    margin: 0 !important;
    padding: 0 !important;
}

body.sportina-b2b-ui .filter-options-content .item {
    list-style: none !important;
    margin: 0 !important;
}

body.sportina-b2b-ui .filter-options-content .item a {
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    color: #111827 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

body.sportina-b2b-ui .filter-options-content .item a:hover {
    background: #f5f6fb !important;
    color: #4f46e5 !important;
}

/* right side toolbar: sorter only */
body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar .modes,
body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar .toolbar-amount {
    display: none !important;
}

body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar .toolbar-sorter {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar .sorter-label {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
}

body.sportina-b2b-ui .toolbar.toolbar-products.sportina-top-toolbar .sorter-options {
    min-width: 210px !important;
    height: 54px !important;
    padding: 0 44px 0 18px !important;
    border-radius: 18px !important;
    border: 1px solid #dbe1ea !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
}

/* =========================================================
   04. Product listing cards
   ========================================================= */

/* =========================================================================
   KAFELEK LISTINGU - kierunek "C" (karta z danymi).
   Zetony: ramka #dcdfe4, promien 2 px, kreski #eceef1, mikroetykieta
   11/600/.06em/#8b90a0, tresc 13,5 px #1f2430, obrys po najechaniu #6b7280.

   Reguly przeniesione tutaj 2026-07-31 z bloku <style> w
   Sportina_B2bAccess::html/design-c.phtml (warstwa na ciasteczko). Wtopione
   w istniejace reguly motywu, a nie dopisane obok - inaczej powstalyby
   duplikaty tych samych selektorow rozstrzygane kolejnoscia w pliku.
   ========================================================================= */

body.sportina-b2b-ui .products-grid .product-items {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

body.sportina-b2b-ui .products-grid .product-item {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.sportina-b2b-ui .products-grid .product-item-info {
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
    background: #ffffff;
    border: 1px solid #dcdfe4;
    border-radius: 2px;
    overflow: hidden;
    transition: border-color 140ms ease;
}

body.sportina-b2b-ui .products-grid .product-item-info:hover {
    border-color: #6b7280;
}

/*
    Zdjecie. display: grid, nie block - przy block obrazek wychodzil za duzy
    albo byl ucinany. Wczesniej bylo tu height: 276px + overflow: hidden przy
    kontenerze o proporcji 4:5 (~300 px wysokosci), co obcinalo dolne ~24 px
    kadru; przy pierwotnym display: flex obrazek byl wysrodkowany, wiec nie
    bylo tego widac.
*/
body.sportina-b2b-ui .products-grid .product-item-photo {
    display: grid;
    align-items: center;
    justify-content: center;
    height: auto;
    min-height: 0;
    max-height: none;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    /* Biel, bo zdjecia produktow sa na bialym tle - szarosc obrysowywala je ramka. */
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

/* 4:5, bo Luma skaluje miniatury listingu do 240x300 (category_page_grid). */
body.sportina-b2b-ui .products-grid .product-image-container {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
}

/*
    padding-bottom potrzebuje !important, bo Magento wstawia je jako styl
    inline wprost na elemencie (padding-bottom: 125%), a styl inline ustepuje
    tylko !important.
*/
body.sportina-b2b-ui .products-grid .product-image-wrapper {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    padding-bottom: 0 !important;
}

/*
    UWAGA na max-height i transform. Warstwa na ciasteczko nadpisywala tylko
    height, wiec max-height: 88% i scale(1.12) z motywu ZOSTAWALY aktywne -
    efektywnie obrazek ma 88% wysokosci kontenera przeskalowane o 12%.
    Zachowane wiernie, zeby przenosiny nie zmienily wygladu. Do uproszczenia
    w kroku "sprzatanie".
*/
body.sportina-b2b-ui .products-grid .product-image-photo {
    position: static;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: contain;
    margin: 0;
    background: #ffffff;
}

body.sportina-b2b-ui .products-grid img[src*="placeholder"],
body.sportina-b2b-ui .products-grid .product-image-photo[src*="placeholder"] {
    transform: none;
    max-width: 58%;
    max-height: 58%;
    margin: 0 auto;
    opacity: 0.45;
}

body.sportina-b2b-ui .products-grid .product-item-details {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 13px 14px 14px;
    background: #ffffff;
}

/* Nazwa blizej danych ponizej - odstep byl za duzy - i kreska pod nia. */
body.sportina-b2b-ui .products-grid .product-item-name {
    margin: 0 0 9px;
    padding: 0 0 9px;
    border-bottom: 1px solid #eceef1;
    overflow: hidden;
}

/*
    Ta grupa zawiera selektor .product.name a, ktory tez trafia w link nazwy i ma
    WYZSZA specyficznosc niz osobna regula dla .product-item-link (4 klasy vs 3).
    Dlatego rozmiar tytulu trzeba ustawiac TUTAJ - inaczej zostaje 15,5 px.
*/
body.sportina-b2b-ui .products-grid .product-item-name,
body.sportina-b2b-ui .products-grid .product.name a {
    color: #111827;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 600;
    letter-spacing: normal;
}

body.sportina-b2b-ui .products-grid .product-item-link {
    display: block;
    color: #111827;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 600;
    letter-spacing: normal;
}

body.sportina-b2b-ui .product-item-name a:hover,
body.sportina-b2b-ui .product.name a:hover {
    color: #4f46e5;
    text-decoration: none;
}

body.sportina-b2b-ui .products-grid .price-box {
    margin: 0 0 14px 0 !important;
}

body.sportina-b2b-ui .products-grid .price-box .price {
    color: #111827;
    font-size: 22px !important;
    line-height: 1.1 !important;
    font-weight: 600;
    letter-spacing: -0.025em;
}

body.sportina-b2b-ui .products-grid .product-item-inner,
body.sportina-b2b-ui .products-grid .product-item-actions {
    display: none !important;
}

body.sportina-b2b-ui .products-grid .sportina-b2b-stock-listing,
body.sportina-b2b-ui .products-grid [class*="stock-listing"] {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    color: #111827 !important;
    font-size: 13.5px !important;
    line-height: 1.45 !important;
}

body.sportina-b2b-ui .products-grid .sportina-b2b-sizes-listing,
body.sportina-b2b-ui .products-grid [class*="sizes-listing"] {
    margin-top: auto !important;
    padding-top: 4px !important;
}

body.sportina-b2b-ui .products-grid .sportina-b2b-sizes-listing strong,
body.sportina-b2b-ui .products-grid [class*="sizes-listing"] strong {
    display: block !important;
    margin-bottom: 8px !important;
    color: #111827 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
}

body.sportina-b2b-ui .products-grid .sportina-b2b-sizes-listing span,
body.sportina-b2b-ui .products-grid .sportina-size-pill,
body.sportina-b2b-ui .products-grid .sportina-b2b-size-pill,
body.sportina-b2b-ui .products-grid [class*="size-pill"] {
    min-width: 38px !important;
    height: 28px !important;
    padding: 0 11px !important;
    margin: 0 6px 7px 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    color: #111827 !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
}

/* =========================================================
   05. Product page
   ========================================================= */

body.sportina-b2b-ui.catalog-product-view .page-main {
    max-width: 1480px !important;
}

body.sportina-b2b-ui.catalog-product-view .columns {
    display: block !important;
    background: #ffffff !important;
    border: 1px solid rgba(229, 231, 235, 0.96) !important;
    /* 30 px + duzy miekki cien byly ostatnia obla rzecza na stronie i bily sie
       z kanciastymi kaflami. Kierunek C: kreska 1 px zamiast cienia. */
    border-radius: 2px !important;
    box-shadow: none !important;
    margin-top: 24px !important;
    padding: 28px !important;
    overflow: visible !important;
}

body.sportina-b2b-ui.catalog-product-view .column.main {
    display: grid !important;
    grid-template-columns: minmax(0, 1.1fr) minmax(420px, 0.74fr) !important;
    row-gap: 16px !important;
    column-gap: 34px !important;
    align-items: start !important;
    width: 100% !important;
}

body.sportina-b2b-ui.catalog-product-view .product.media {
    grid-column: 1 !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 22px !important;
    box-sizing: border-box !important;
    background: #f8fafc !important;
    border-radius: 26px !important;
    overflow: hidden !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main {
    grid-column: 2 !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .page-title-wrapper {
    margin: 0 0 18px 0 !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .page-title-wrapper h1 {
    margin: 0 !important;
    color: #111827 !important;
    font-size: 34px !important;
    font-weight: 600 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.12 !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-stock-sku {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 0 18px 0 !important;
    color: #4b5563 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__wrap {
    width: 100% !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__stage {
    width: 100% !important;
    min-height: 560px !important;
    height: 560px !important;
    max-height: 560px !important;
    background: #ffffff !important;
    border-radius: 22px !important;
    overflow: hidden !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__stage__shaft,
body.sportina-b2b-ui.catalog-product-view .fotorama__stage__frame {
    width: 100% !important;
    height: 100% !important;
    background: #ffffff !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__img {
    max-width: 92% !important;
    max-height: 92% !important;
    object-fit: contain !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__nav-wrap {
    margin-top: 18px !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__thumb {
    background: #ffffff !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}

body.sportina-b2b-ui.catalog-product-view .fotorama__thumb-border {
    border-color: #6366f1 !important;
    border-radius: 14px !important;
}

/* Short overview below gallery */
body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview {
    margin-top: 16px !important;
    padding: 20px 22px !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.045) !important;
}

body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview::before {
    content: none !important;
    display: none !important;
}

body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview-title {
    display: block !important;
    margin: 0 0 10px 0 !important;
    color: #111827 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview,
body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview .product.attribute.overview,
body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview .value,
body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview p {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    text-overflow: initial !important;
    -webkit-line-clamp: unset !important;
    display: block !important;
}

body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview .value,
body.sportina-b2b-ui.catalog-product-view .sportina-gallery-overview p {
    color: #374151 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* B2B boxes on PDP */
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bstock,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-qol,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2b-pricing,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2b-stock,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-quick-order,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-quickorder,
/*
    Byly tu cztery selektory z wieloznacznikiem:
        [class*="b2bpricing"], [class*="b2bstock"],
        [class*="quickorder"], [class*="quick-order"]
    Trafialy w KAZDY element, ktorego klasa zawiera ten fragment - wiec gdy
    31.07 nadalem wewnetrznym elementom karty dostepnosci nazwy
    sportina-b2bstock__title / __row / __note (wczesniej byly bez klas, ze stylem
    w atrybucie), kazdy z nich dostal ramke i promien CALEJ karty. Efekt: pudelka
    wokol naglowka i kazdego wiersza. Karta cenowa tego nie pokazywala tylko
    dlatego, ze ma dalej wlasna regule .sportina-b2bpricing [class*="row"],
    ktora ramke nadpisywala.

    Wieloznaczniki byly wiec pulapka czekajaca na pierwsza sensowna nazwe klasy.
    Zastapione jawnymi nazwami; .sportina-b2bpricing dopisana, bo obejmowal ja
    wylacznie usuniety wieloznacznik.
*/
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    border-radius: 2px !important;
    border: 1px solid #dcdfe4 !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-qol {
    margin-bottom: 0 !important;
}

body.sportina-b2b-ui.catalog-product-view .product-add-form {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Product details as tab */
body.sportina-b2b-ui.catalog-product-view .product.info.detailed,
body.sportina-b2b-ui.catalog-product-view .product.data.items {
    grid-column: 1 / -1 !important;
    clear: both !important;
    margin-top: 16px !important;
    padding-top: 0 !important;
}

body.sportina-b2b-ui.catalog-product-view .product.data.items > .item.title {
    display: inline-block !important;
    float: none !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 2 !important;
}

body.sportina-b2b-ui.catalog-product-view .product.data.items > .item.title > .switch {
    display: block !important;
    min-width: 150px !important;
    height: 58px !important;
    padding: 0 28px !important;
    border: 1px solid #e5e7eb !important;
    border-bottom-color: #ffffff !important;
    border-radius: 22px 22px 0 0 !important;
    background: #ffffff !important;
    color: #111827 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 58px !important;
    text-align: center !important;
    box-shadow: none !important;
}

body.sportina-b2b-ui.catalog-product-view .product.data.items > .item.content {
    display: block !important;
    clear: both !important;
    float: none !important;
    margin: -1px 0 0 0 !important;
    padding: 30px 34px !important;
    border: 1px solid #e5e7eb !important;
    border-top: 0 !important;
    border-radius: 0 24px 24px 24px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.045) !important;
    position: relative !important;
    z-index: 1 !important;
}

body.sportina-b2b-ui.catalog-product-view .sportina-details-heading {
    display: none !important;
}

body.sportina-b2b-ui.catalog-product-view .product.data.items .product.attribute.description {
    margin: 0 !important;
}

body.sportina-b2b-ui.catalog-product-view .product.data.items .value > p:first-child {
    margin-top: 0 !important;
}

/* Reviews off */
body.sportina-b2b-ui.catalog-product-view #tab-label-reviews,
body.sportina-b2b-ui.catalog-product-view #reviews,
body.sportina-b2b-ui.catalog-product-view .review-add,
body.sportina-b2b-ui.catalog-product-view .review-list {
    display: none !important;
}

/* =========================================================
   06. Buttons and form controls
   ========================================================= */

body.sportina-b2b-ui .action.primary,
body.sportina-b2b-ui button.primary {
    background: #6366f1;
    border: 0;
    border-radius: 3px;
    box-shadow: none;
    color: #ffffff;
    font-weight: 600;
    padding: 12px 22px;
}

body.sportina-b2b-ui .action.primary:hover,
body.sportina-b2b-ui button.primary:hover {
    background: #4f46e5;
    border: 0;
    box-shadow: none;
    color: #ffffff;
}

body.sportina-b2b-ui input[type="text"],
body.sportina-b2b-ui input[type="email"],
body.sportina-b2b-ui input[type="password"],
body.sportina-b2b-ui input[type="number"],
body.sportina-b2b-ui select,
body.sportina-b2b-ui textarea {
    border: 1px solid #d1d5db;
    border-radius: 14px;
    box-shadow: none;
}

body.sportina-b2b-ui input:focus,
body.sportina-b2b-ui select:focus,
body.sportina-b2b-ui textarea:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.16);
}

/* =========================================================
   07. Footer
   ========================================================= */

body.sportina-b2b-ui .page-footer {
    background: #f3f4f6;
    border-top: 1px solid #e5e7eb;
}

body.sportina-b2b-ui .copyright {
    background: #0c0d0d;
    color: rgba(255, 255, 255, 0.82);
}

/* =========================================================
   08. Responsive
   ========================================================= */

@media (max-width: 1280px) {
    body.sportina-b2b-ui .products-grid .product-items {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1100px) {
    body.sportina-b2b-ui .sportina-toolbar-merged {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    body.sportina-b2b-ui .sportina-toolbar-left,
    body.sportina-b2b-ui .sportina-toolbar-right {
        width: 100% !important;
        justify-content: flex-start !important;
        margin-left: 0 !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product-info-main {
        margin-top: 28px !important;
    }

    body.sportina-b2b-ui.catalog-product-view .fotorama__stage {
        min-height: 460px !important;
        height: 460px !important;
    }
}

@media (max-width: 900px) {
    body.sportina-b2b-ui .header.content {
        flex-wrap: wrap;
    }

    body.sportina-b2b-ui .header.content .block-search {
        order: 4;
        flex-basis: 100%;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0;
        margin-right: 0;
    }

    body.sportina-b2b-ui .products-grid .product-items {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    body.sportina-b2b-ui.catalog-product-view .columns {
        padding: 18px !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product.media {
        padding: 14px !important;
    }

    body.sportina-b2b-ui.catalog-product-view .fotorama__stage {
        min-height: 360px !important;
        height: 360px !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product-info-main .page-title-wrapper h1 {
        font-size: 27px !important;
    }
}

@media (max-width: 560px) {
    body.sportina-b2b-ui .page-main,
    body.sportina-b2b-ui .breadcrumbs,
    body.sportina-b2b-ui .panel.header,
    body.sportina-b2b-ui .header.content {
        padding-left: 14px;
        padding-right: 14px;
    }

    body.sportina-b2b-ui .products-grid .product-items {
        grid-template-columns: 1fr !important;
    }
}

/* Sportina B2B Theme cleanup patch — pricing box fix */
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing {
    /* Druga, bardziej szczegolowa regula tej karty. Miala promien 20 px, cien i
       KREMOWE tlo #fffdf8 - to stad krem wracal, mimo ze poprawialem go w
       b2bpricing.css. Znaleziona pomiarem po usunieciu warstwy. */
    padding: 16px 18px !important;
    max-width: 760px !important;
    border: 1px solid #dcdfe4 !important;
    border-radius: 2px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing *,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing *::before,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing *::after {
    box-sizing: border-box !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing h2,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing h3,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing strong:first-child {
    display: block !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #111827 !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
}

/* Czyścimy rozjechane "pigułki" na wierszach */
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing div,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing p,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing span {
    border-radius: 0 !important;
}

/* Wiersze ceny: lewa etykieta, prawa wartość */
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing > div:not(:first-child),
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing .sportina-b2bpricing-row,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing [class*="row"] {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-top: 1px solid #ece7dd !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing > div:first-child {
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing .sportina-b2bpricing-label,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing [class*="label"] {
    color: #6b7280 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing .sportina-b2bpricing-value,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing [class*="value"],
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing .price {
    margin-left: auto !important;
    color: #111827 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    text-align: right !important;
    white-space: nowrap !important;
}

body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing > div:last-child .sportina-b2bpricing-value,
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing > div:last-child [class*="value"],
body.sportina-b2b-ui.catalog-product-view .product-info-main .sportina-b2bpricing > div:last-child .price {
    font-size: 22px !important;
    letter-spacing: -0.025em !important;
}

/* Sportina B2B homepage */
body.sportina-b2b-ui.cms-home .page-title-wrapper {
    display: none !important;
}

body.sportina-b2b-ui.cms-home .page-main {
    max-width: 1440px !important;
    padding-top: 36px !important;
}

.sportina-home {
    width: 100%;
}

.sportina-home,
.sportina-home * {
    box-sizing: border-box;
}

.sportina-home__hero {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
    gap: 28px;
    align-items: stretch;
    padding: 42px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 16% 0%, rgba(99, 102, 241, 0.18), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f7f7ff 48%, #eee9ff 100%);
    border: 1px solid rgba(229, 231, 235, 0.95);
    box-shadow: 0 26px 80px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.sportina-home__eyebrow {
    margin: 0 0 12px 0;
    color: #6366f1;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.sportina-home__hero h1 {
    max-width: 840px;
    margin: 0;
    color: #111827;
    font-size: 48px;
    line-height: 1.04;
    font-weight: 700;
    letter-spacing: -0.055em;
}

.sportina-home__lead {
    max-width: 720px;
    margin: 22px 0 0 0;
    color: #4b5563;
    font-size: 18px;
    line-height: 1.65;
    font-weight: 600;
}

.sportina-home__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 28px;
}

.sportina-home__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none !important;
}

.sportina-home__btn--primary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    box-shadow: 0 16px 34px rgba(99, 102, 241, 0.30);
}

.sportina-home__btn--secondary {
    color: #111827 !important;
    background: #ffffff;
    border: 1px solid #e5e7eb;
}

.sportina-home__hero-card {
    display: grid;
    gap: 14px;
    align-content: center;
}

.sportina-home__metric {
    padding: 22px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(229, 231, 235, 0.95);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06);
}

.sportina-home__metric span {
    display: block;
    color: #6b7280;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.sportina-home__metric strong {
    display: block;
    margin-top: 7px;
    color: #111827;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.035em;
}

.sportina-home__section {
    margin-top: 30px;
    padding: 34px;
    border-radius: 2px;
    background: #ffffff;
    border: 1px solid rgba(229, 231, 235, 0.95);
    box-shadow: 0 18px 54px rgba(15, 23, 42, 0.055);
}

.sportina-home__section-head h2 {
    margin: 0;
    color: #111827;
    font-size: 32px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.sportina-home__section-head p:not(.sportina-home__eyebrow) {
    max-width: 720px;
    margin: 10px 0 0 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.6;
    font-weight: 600;
}

.sportina-home__brand-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 24px;
}

.sportina-home__brand-card {
    min-height: 150px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(17, 24, 39, 0.94) 0%, rgba(36, 18, 63, 0.94) 100%);
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.12);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.sportina-home__brand-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 24px 58px rgba(15, 23, 42, 0.18);
}

.sportina-home__brand-card span {
    color: #c7d2fe;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.sportina-home__brand-card strong {
    max-width: 260px;
    color: #ffffff;
    font-size: 21px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -0.035em;
}

.sportina-home__section--features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.sportina-home__feature {
    padding: 24px;
    border-radius: 24px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
}

.sportina-home__feature span {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #eef2ff;
    color: #4f46e5;
    font-weight: 700;
}

.sportina-home__feature h3 {
    margin: 18px 0 8px 0;
    color: #111827;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.sportina-home__feature p {
    margin: 0;
    color: #6b7280;
    font-size: 15px;
    line-height: 1.6;
    font-weight: 600;
}

@media (max-width: 1000px) {
    .sportina-home__hero,
    .sportina-home__brand-grid,
    .sportina-home__section--features {
        grid-template-columns: 1fr;
    }

    .sportina-home__hero h1 {
        font-size: 38px;
    }
}

@media (max-width: 640px) {
    .sportina-home__hero,
    .sportina-home__section {
        padding: 22px;
        border-radius: 24px;
    }

    .sportina-home__hero h1 {
        font-size: 32px;
    }
}

/* SPORTINA HOME PREMIUM START */
body.sportina-b2b-ui.cms-home .page-title-wrapper {
    display: none !important;
}

body.sportina-b2b-ui.cms-home .page-main {
    max-width: 1500px !important;
    padding-top: 34px !important;
}

.sportina-home-premium,
.sportina-home-premium * {
    box-sizing: border-box;
}

.sportina-home-premium {
    width: 100%;
}

.sportina-home-premium__hero,
.sportina-home-premium__section {
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(229, 231, 235, 0.95);
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.06);
    border-radius: 34px;
}

.sportina-home-premium__hero {
    display: grid;
    grid-template-columns: minmax(0, 1.22fr) minmax(340px, 0.78fr);
    gap: 28px;
    padding: 48px;
    background:
        radial-gradient(circle at top left, rgba(99, 102, 241, 0.10), transparent 28%),
        linear-gradient(135deg, rgba(255,255,255,0.92) 0%, rgba(248,248,255,0.95) 55%, rgba(239,236,255,0.92) 100%);
}

.sportina-home-premium__eyebrow {
    margin: 0 0 12px 0;
    color: #6366f1;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.sportina-home-premium__hero h1 {
    max-width: 860px;
    margin: 0;
    color: #111827;
    font-size: 58px;
    line-height: 1.02;
    font-weight: 600;
    letter-spacing: -0.05em;
}

.sportina-home-premium__lead {
    max-width: 760px;
    margin: 24px 0 0 0;
    color: #4b5563;
    font-size: 18px;
    line-height: 1.7;
    font-weight: 500;
}

.sportina-home-premium__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 30px;
}

.sportina-home-premium__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 24px;
    border-radius: 999px;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 600;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.sportina-home-premium__btn:hover {
    transform: translateY(-1px);
}

.sportina-home-premium__btn--primary {
    color: #ffffff !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    box-shadow: 0 16px 30px rgba(99, 102, 241, 0.24);
}

.sportina-home-premium__btn--secondary {
    color: #111827 !important;
    background: rgba(255,255,255,0.88);
    border: 1px solid #e5e7eb;
}

.sportina-home-premium__hero-side {
    display: grid;
    gap: 16px;
    align-content: center;
}

.sportina-home-premium__stat-card {
    padding: 22px 24px;
    background: rgba(255,255,255,0.82);
    border: 1px solid rgba(229, 231, 235, 0.95);
    border-radius: 26px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}

.sportina-home-premium__stat-card span {
    display: block;
    color: #6b7280;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.sportina-home-premium__stat-card strong {
    display: block;
    margin-top: 8px;
    color: #111827;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -0.025em;
}

.sportina-home-premium__section {
    margin-top: 28px;
    padding: 36px;
}

.sportina-home-premium__section--soft {
    background: rgba(255,255,255,0.70);
}

.sportina-home-premium__section-head h2 {
    margin: 0;
    color: #111827;
    font-size: 42px;
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -0.045em;
}

.sportina-home-premium__section-head p:not(.sportina-home-premium__eyebrow) {
    max-width: 760px;
    margin: 14px 0 0 0;
    color: #6b7280;
    font-size: 17px;
    line-height: 1.65;
    font-weight: 500;
}

.sportina-home-premium__brands {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 28px;
}

.sportina-home-premium__brand {
    min-height: 160px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 24px;
    text-decoration: none !important;
    color: inherit !important;
    border-radius: 28px;
    background:
        linear-gradient(145deg, rgba(10,14,25,0.98) 0%, rgba(28,33,60,0.97) 52%, rgba(50,31,86,0.96) 100%);
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.12);
    transition: transform 160ms ease, box-shadow 160ms ease;
}

.sportina-home-premium__brand:hover {
    transform: translateY(-2px);
    box-shadow: 0 24px 44px rgba(15, 23, 42, 0.16);
}

.sportina-home-premium__brand-logo {
    display: flex;
    align-items: center;
    min-height: 34px;
}

.sportina-home-premium__brand-logo img {
    display: block;
    max-width: 150px;
    max-height: 34px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.96;
}

.sportina-home-premium__brand-text h3 {
    margin: 0 0 8px 0;
    color: #ffffff;
    font-size: 24px;
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: -0.03em;
}

.sportina-home-premium__brand-text p {
    margin: 0;
    color: rgba(255,255,255,0.72);
    font-size: 15px;
    line-height: 1.55;
    font-weight: 500;
}

.sportina-home-premium__benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.sportina-home-premium__benefit {
    padding: 28px;
    border-radius: 28px;
    background: rgba(248, 250, 252, 0.85);
    border: 1px solid #e5e7eb;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

.sportina-home-premium__benefit-no {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #eef2ff;
    color: #6366f1;
    font-size: 15px;
    font-weight: 600;
}

.sportina-home-premium__benefit h3 {
    margin: 18px 0 10px 0;
    color: #111827;
    font-size: 28px;
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: -0.035em;
}

.sportina-home-premium__benefit p {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 500;
}

@media (max-width: 1180px) {
    .sportina-home-premium__hero,
    .sportina-home-premium__brands,
    .sportina-home-premium__benefits {
        grid-template-columns: 1fr;
    }

    .sportina-home-premium__hero h1 {
        font-size: 46px;
    }
}

@media (max-width: 768px) {
    .sportina-home-premium__hero,
    .sportina-home-premium__section {
        padding: 24px;
        border-radius: 24px;
    }

    .sportina-home-premium__hero h1 {
        font-size: 36px;
    }

    .sportina-home-premium__section-head h2 {
        font-size: 32px;
    }

    .sportina-home-premium__benefit h3 {
        font-size: 24px;
    }
}
/* SPORTINA HOME PREMIUM END */

/* SPORTINA HOME BRANDS V4 START */
/* Homepage brand tiles — compact, sales-focused, cleaner cascade */

body.sportina-b2b-ui.cms-home .sportina-home-premium__hero h1 {
    font-weight: 600;
    letter-spacing: -0.04em;
}

body.sportina-b2b-ui.cms-home .sportina-home-premium__lead,
body.sportina-b2b-ui.cms-home .sportina-home-premium__section-head p,
body.sportina-b2b-ui.cms-home .sportina-home-premium__benefit p {
    font-weight: 400;
}

body.sportina-b2b-ui.cms-home .sportina-home-premium__section-head h2 {
    font-size: 40px;
    font-weight: 600;
    letter-spacing: -0.035em;
}

body.sportina-b2b-ui.cms-home .sportina-home-premium__section {
    padding: 32px;
}

body.sportina-b2b-ui.cms-home .av2-brand-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 24px;
}

body.sportina-b2b-ui.cms-home .av2-bcard {
    position: relative;
    display: block;
    min-height: 210px;
    border-radius: 24px;
    overflow: hidden;
    isolation: isolate;
    text-decoration: none;
    background: #111827;
    box-shadow: 0 16px 30px rgba(15, 23, 42, 0.12);
    transition: transform 180ms ease, box-shadow 180ms ease;
}

body.sportina-b2b-ui.cms-home .av2-bcard:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 38px rgba(15, 23, 42, 0.17);
}

body.sportina-b2b-ui.cms-home .av2-bcard__photo {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-repeat: no-repeat;
    transition: transform 260ms ease;
}

body.sportina-b2b-ui.cms-home .av2-bcard:hover .av2-bcard__photo {
    transform: scale(1.04);
}

body.sportina-b2b-ui.cms-home .av2-bcard::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(180deg, rgba(8, 15, 35, 0.18) 0%, rgba(8, 15, 35, 0.36) 45%, rgba(8, 15, 35, 0.66) 100%);
}

body.sportina-b2b-ui.cms-home .av2-bcard__logo,
body.sportina-b2b-ui.cms-home .av2-bcard__logo_white {
    position: absolute;
    top: 46%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
    display: block;
    width: auto;
    height: auto;
    max-width: 62%;
    max-height: 58px;
    object-fit: contain;
}

body.sportina-b2b-ui.cms-home .av2-bcard__logo_white {
    filter: brightness(0) invert(1);
}

body.sportina-b2b-ui.cms-home .av2-bcard__body {
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 2;
    display: flex;
    justify-content: center;
}

body.sportina-b2b-ui.cms-home .av2-bcard__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 20px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1;
}

body.sportina-b2b-ui.cms-home .av2-bcard:hover .av2-bcard__cta {
    background: rgba(255, 255, 255, 0.26);
}

@media (max-width: 1360px) {
    body.sportina-b2b-ui.cms-home .av2-brand-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    body.sportina-b2b-ui.cms-home .av2-brand-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.sportina-b2b-ui.cms-home .av2-bcard {
        min-height: 200px;
    }
}

@media (max-width: 640px) {
    body.sportina-b2b-ui.cms-home .av2-brand-grid {
        grid-template-columns: 1fr;
    }

    body.sportina-b2b-ui.cms-home .av2-bcard {
        min-height: 190px;
        border-radius: 22px;
    }

    body.sportina-b2b-ui.cms-home .av2-bcard__logo,
    body.sportina-b2b-ui.cms-home .av2-bcard__logo_white {
        max-height: 52px;
        max-width: 60%;
    }
}
/* SPORTINA HOME BRANDS V4 END */

/* Sportina B2B menu hover stability and soft transitions */

/* Stabilizacja głównego menu / podmenu Magento */
body.sportina-b2b-ui .navigation .level0.parent,
body.sportina-b2b-ui .navigation .level0.parent > .level-top {
    position: relative;
}

/* Niewidzialny mostek między główną pozycją a tacką podmenu */
body.sportina-b2b-ui .navigation .level0.parent::after {
    content: "";
    position: absolute;
    left: -18px;
    right: -18px;
    top: 100%;
    height: 22px;
    z-index: 9998;
    background: transparent;
    pointer-events: auto;
}

/* Tacka ma nie znikać gwałtownie */
body.sportina-b2b-ui .navigation .level0.parent > .submenu {
    display: block;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(0.985);
    pointer-events: none;
    transition:
        opacity 360ms cubic-bezier(.22,.61,.36,1),
        transform 420ms cubic-bezier(.22,.61,.36,1),
        visibility 0s linear 420ms;
    z-index: 9999;
}

/* Otwarta tacka */
body.sportina-b2b-ui .navigation .level0.parent:hover > .submenu,
body.sportina-b2b-ui .navigation .level0.parent:focus-within > .submenu,
body.sportina-b2b-ui .navigation .level0.parent.sportina-menu-open > .submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
    transition:
        opacity 440ms cubic-bezier(.22,.61,.36,1),
        transform 480ms cubic-bezier(.22,.61,.36,1),
        visibility 0s;
}

/* Gdy wychodzisz kursorem, nie ucinamy od razu — JS trzyma klasę sportina-menu-closing chwilę dłużej */
body.sportina-b2b-ui .navigation .level0.parent.sportina-menu-closing > .submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

/* Linki w podmenu mają być normalnie klikalne i czytelne */
body.sportina-b2b-ui .navigation .level0.parent > .submenu a {
    transition:
        color 180ms ease,
        background 180ms ease,
        transform 180ms ease;
}

/* Jeśli gdzieś masz karty/slajdy kategorii, dajemy im miększy fade */
body.sportina-b2b-ui .sportina-category-panel,
body.sportina-b2b-ui .sportina-category-slide,
body.sportina-b2b-ui .sportina-mega-panel,
body.sportina-b2b-ui [data-sportina-category-panel] {
    transition:
        opacity 480ms cubic-bezier(.22,.61,.36,1),
        transform 520ms cubic-bezier(.22,.61,.36,1);
}

body.sportina-b2b-ui .sportina-category-panel.is-changing,
body.sportina-b2b-ui .sportina-category-slide.is-changing,
body.sportina-b2b-ui .sportina-mega-panel.is-changing,
body.sportina-b2b-ui [data-sportina-category-panel].is-changing {
    opacity: 0;
    transform: translateY(8px) scale(0.99);
}

/* Sportina B2B custom nav hover bridge */
body.sportina-b2b-ui .sportina-b2b-nav,
body.sportina-b2b-ui .sportina-b2b-nav__inner,
body.sportina-b2b-ui .sportina-b2b-nav__item {
    overflow: visible;
}

body.sportina-b2b-ui .sportina-b2b-nav {
    position: relative;
    z-index: 300;
}

body.sportina-b2b-ui .sportina-b2b-nav__inner {
    position: relative;
    z-index: 301;
}

body.sportina-b2b-ui .sportina-b2b-nav__item {
    position: relative;
}

/* niewidzialny mostek między główną pozycją a tacką */
body.sportina-b2b-ui .sportina-b2b-nav__item::after {
    content: "";
    position: absolute;
    left: -18px;
    right: -18px;
    top: 100%;
    height: 34px;
    background: transparent;
    pointer-events: auto;
    z-index: 302;
}

/* tacka domyślnie ukryta, ale nie przez display:none — wtedy fade działa */
body.sportina-b2b-ui .sportina-b2b-nav__mega {
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px) scale(0.985);
    transition:
        opacity 360ms cubic-bezier(.22,.61,.36,1),
        transform 420ms cubic-bezier(.22,.61,.36,1),
        visibility 0s linear 420ms;
    z-index: 400;
}

/* hover/focus + klasa z JS */
body.sportina-b2b-ui .sportina-b2b-nav__item:hover > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item:focus-within > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--open > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--closing > .sportina-b2b-nav__mega {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    transition:
        opacity 430ms cubic-bezier(.22,.61,.36,1),
        transform 480ms cubic-bezier(.22,.61,.36,1),
        visibility 0s;
}

/* mega i wszystkie linki w środku mają łapać myszkę normalnie */
body.sportina-b2b-ui .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__mega-inner,
body.sportina-b2b-ui .sportina-b2b-nav__column,
body.sportina-b2b-ui .sportina-b2b-nav__heading,
body.sportina-b2b-ui .sportina-b2b-nav__sublink {
    pointer-events: auto;
}

/* trochę większy bezpieczny obszar wewnątrz tacki */
body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
    position: relative;
    z-index: 401;
}

/* opóźnione zamknięcie — wizualnie zostaje chwilę po wyjechaniu myszką */
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--closing > .sportina-b2b-nav__mega {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Sportina B2B custom nav positioning V2 START */
/* Mega menu ma być jedną stałą tacką pod całym paskiem, nie pod pojedynczym elementem */

body.sportina-b2b-ui .page-header,
body.sportina-b2b-ui .header.content,
body.sportina-b2b-ui .nav-sections,
body.sportina-b2b-ui .navigation,
body.sportina-b2b-ui .sportina-b2b-nav,
body.sportina-b2b-ui .sportina-b2b-nav__inner {
    overflow: visible !important;
}

body.sportina-b2b-ui .sportina-b2b-nav {
    position: relative !important;
    z-index: 500 !important;
}

body.sportina-b2b-ui .sportina-b2b-nav__inner {
    position: relative !important;
    z-index: 501 !important;
}

/* Kluczowa zmiana: item nie może być containing blockiem dla tacki */
body.sportina-b2b-ui .sportina-b2b-nav__item {
    position: static !important;
}

/* Wyłączamy poprzedni mostek per-item, bo to rozwalało geometrię tacki */
body.sportina-b2b-ui .sportina-b2b-nav__item::after {
    display: none !important;
    content: none !important;
}

/* Tacka zawsze pod całym menu */
body.sportina-b2b-ui .sportina-b2b-nav__mega {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;

    transform: translateY(8px) !important;
    transition:
        opacity 320ms cubic-bezier(.22,.61,.36,1),
        transform 380ms cubic-bezier(.22,.61,.36,1),
        visibility 0s linear 380ms !important;

    z-index: 600 !important;
}

/* Otwarta tacka */
body.sportina-b2b-ui .sportina-b2b-nav__item:hover > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item:focus-within > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--open > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--closing > .sportina-b2b-nav__mega {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
    transition:
        opacity 420ms cubic-bezier(.22,.61,.36,1),
        transform 460ms cubic-bezier(.22,.61,.36,1),
        visibility 0s !important;
}

/* Wnętrze tacki: zawsze równo w kontenerze, bez uciekania w prawo */
body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
    width: 100% !important;
    max-width: 1380px !important;
    min-height: 150px !important;
    margin: 0 auto !important;
    padding: 30px 36px 34px !important;

    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 22px 34px !important;
    align-items: start !important;

    background: rgba(255, 255, 255, 0.98) !important;
    border-radius: 0 0 24px 24px !important;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12) !important;
    border: 1px solid rgba(229, 231, 235, 0.95) !important;
    border-top: 0 !important;
    box-sizing: border-box !important;

    position: relative !important;
    z-index: 601 !important;
}

/* Kolumny nie mogą mieć stałego przesunięcia odziedziczonego po starym układzie */
body.sportina-b2b-ui .sportina-b2b-nav__column {
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Klikalność linków w tackach */
body.sportina-b2b-ui .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__mega-inner,
body.sportina-b2b-ui .sportina-b2b-nav__column,
body.sportina-b2b-ui .sportina-b2b-nav__heading,
body.sportina-b2b-ui .sportina-b2b-nav__sublink {
    pointer-events: auto !important;
}

/* Linki w tackach */
body.sportina-b2b-ui .sportina-b2b-nav__heading,
body.sportina-b2b-ui .sportina-b2b-nav__sublink {
    display: inline-flex !important;
    align-items: center !important;
    color: #111827 !important;
    text-decoration: none !important;
    line-height: 1.25 !important;
    white-space: normal !important;
}

body.sportina-b2b-ui .sportina-b2b-nav__heading {
    font-size: 16px !important;
    font-weight: 600 !important;
}

body.sportina-b2b-ui .sportina-b2b-nav__sublink {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #4b5563 !important;
}

body.sportina-b2b-ui .sportina-b2b-nav__heading:hover,
body.sportina-b2b-ui .sportina-b2b-nav__sublink:hover {
    color: #4f46e5 !important;
}

/* Na mniejszych ekranach tacka nadal nie może wypadać poza viewport */
@media (max-width: 1100px) {
    body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        padding: 24px !important;
    }
}

@media (max-width: 768px) {
    body.sportina-b2b-ui .sportina-b2b-nav__mega {
        position: static !important;
        width: 100% !important;
    }

    body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
        grid-template-columns: 1fr !important;
        border-radius: 18px !important;
    }
}
/* Sportina B2B custom nav positioning V2 END */

/* Sportina B2B custom nav single tray V3 START */
/* Zewnętrzny mega-wrapper jest tylko pozycjonerem. Prawdziwą tacką jest mega-inner. */

body.sportina-b2b-ui .sportina-b2b-nav__mega {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
}

/* Usuwamy każdy pseudo-layer, który może robić drugą białą płachtę */
body.sportina-b2b-ui .sportina-b2b-nav__mega::before,
body.sportina-b2b-ui .sportina-b2b-nav__mega::after {
    display: none !important;
    content: none !important;
}

/* Jeden właściwy panel pod menu */
body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid rgba(229, 231, 235, 0.95) !important;
    border-top: 0 !important;
    border-radius: 0 0 24px 24px !important;
    box-shadow: 0 24px 50px rgba(15, 23, 42, 0.12) !important;

    width: calc(100% - 64px) !important;
    max-width: 1380px !important;
    margin: 0 auto !important;
    padding: 30px 36px 34px !important;

    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
    gap: 22px 34px !important;
    align-items: start !important;
}

/* Subtelne dopasowanie do paska — bez drugiego prostokąta za spodem */
body.sportina-b2b-ui .sportina-b2b-nav__item.sportina-b2b-nav__item--open > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item:hover > .sportina-b2b-nav__mega,
body.sportina-b2b-ui .sportina-b2b-nav__item:focus-within > .sportina-b2b-nav__mega {
    background: transparent !important;
}

/* Jeżeli stary szablon miał dodatkowe tło na poziomie kolumn, wyłączamy */
body.sportina-b2b-ui .sportina-b2b-nav__column {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* Mniej ciężkie fonty w samej tacce */
body.sportina-b2b-ui .sportina-b2b-nav__heading {
    font-weight: 600 !important;
}

body.sportina-b2b-ui .sportina-b2b-nav__sublink {
    font-weight: 500 !important;
}

@media (max-width: 768px) {
    body.sportina-b2b-ui .sportina-b2b-nav__mega-inner {
        width: 100% !important;
        border-radius: 0 0 18px 18px !important;
    }
}
/* Sportina B2B custom nav single tray V3 END */

/* SPORTINA_HIDE_B2B_NAV_ON_LOGIN_START */
body.customer-account-login nav.sportina-b2b-nav,
body.customer-account-login .sportina-b2b-nav,
body.sportina-b2b-login-page nav.sportina-b2b-nav,
body.sportina-b2b-login-page .sportina-b2b-nav {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.customer-account-login .page-wrapper,
body.sportina-b2b-login-page .page-wrapper {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* SPORTINA_HIDE_B2B_NAV_ON_LOGIN_END */

/* SPORTINA_MINICART_LAYER_FIX_START */
/*
   Mini-cart musi być nad customowym menu B2B.
   Menu B2B używa z-index 500/600, dlatego koszyk dostaje wyższą warstwę.
*/
body.sportina-b2b-ui .header.content .minicart-wrapper {
    position: relative !important;
    z-index: 1200 !important;
}

body.sportina-b2b-ui .header.content .minicart-wrapper.active {
    z-index: 1300 !important;
}

body.sportina-b2b-ui .header.content .minicart-wrapper.active .mage-dropdown-dialog {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;
    left: auto !important;
    display: flex !important;
    flex-direction: column !important;
    width: min(390px, calc(100vw - 32px)) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 150px) !important;
    overflow: hidden !important;
    z-index: 1300 !important;
    /* SPORTINA_MINICART_DIALOG_AUTO_HEIGHT_V4 */
}

/* SPORTINA_MINICART_FIXED_FOOTER_V4 */
body.sportina-b2b-ui .header.content .minicart-wrapper.active .block-minicart {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: flex !important;
    flex: 0 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    max-height: calc(100vh - 150px) !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    z-index: 1301 !important;
    box-sizing: border-box !important;
}

body.sportina-b2b-ui .header.content .minicart-wrapper.active
.block-minicart > #minicart-content-wrapper {
    display: flex !important;
    flex: 0 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow: hidden !important;
}

body.sportina-b2b-ui .header.content .minicart-wrapper.active
#minicart-content-wrapper > .block-title {
    flex: 0 0 auto !important;
}

body.sportina-b2b-ui .header.content .minicart-wrapper.active
#minicart-content-wrapper > .block-content {
    display: flex !important;
    flex: 0 1 auto !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 150px) !important;
    overflow: hidden !important;
}

body.checkout-index-index.sportina-b2b-ui .sportina-b2b-nav {
    display: none !important;
}

/* Mobile fallback */
@media (max-width: 768px) {
    body.sportina-b2b-ui .header.content .minicart-wrapper.active .mage-dropdown-dialog {
        position: fixed !important;
        top: 84px !important;
        right: 16px !important;
        left: 16px !important;
        width: auto !important;
        max-width: none !important;
    }

    body.sportina-b2b-ui .header.content .minicart-wrapper.active .block-minicart {
        max-height: calc(100vh - 110px) !important;
    }
}
/* SPORTINA_MINICART_LAYER_FIX_END */

/* SPORTINA_B2B_CHECKOUT_UX_V1 START */

body.sportina-b2b-ui .sportina-checkout-b2b-note,
body.sportina-b2b-ui .sportina-minicart-b2b-note,
body.sportina-b2b-ui .sportina-account-b2b-note,
body.sportina-b2b-ui .sportina-checkout-success-note {
    box-sizing: border-box;
    border: 1px solid rgba(99, 102, 241, 0.22);
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.08), rgba(139, 92, 246, 0.06));
    color: #1f2937;
    border-radius: 18px;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

body.sportina-b2b-ui .sportina-checkout-b2b-note {
    margin: 18px 0 6px;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    position: relative;
    z-index: 1;
}

body.sportina-b2b-ui .sportina-checkout-b2b-note__icon,
body.sportina-b2b-ui .sportina-account-b2b-note__icon,
body.sportina-b2b-ui .sportina-checkout-success-note__icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #6366f1;
    color: #ffffff;
    font-weight: 600;
    line-height: 1;
    flex: 0 0 auto;
}

body.sportina-b2b-ui .sportina-checkout-b2b-note strong,
body.sportina-b2b-ui .sportina-account-b2b-note strong,
body.sportina-b2b-ui .sportina-checkout-success-note strong {
    display: block;
    margin: 0 0 4px;
    color: #111827;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
}

body.sportina-b2b-ui .sportina-checkout-b2b-note p,
body.sportina-b2b-ui .sportina-account-b2b-note p,
body.sportina-b2b-ui .sportina-checkout-success-note p {
    margin: 0;
    color: #4b5563;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}

body.sportina-b2b-ui .sportina-minicart-b2b-note {
    margin: 12px 0 14px;
    padding: 12px 14px;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 600;
    color: #4b5563;
}

body.sportina-b2b-ui .sportina-minicart-b2b-note strong {
    color: #111827;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .checkout-shipping-method,
body.sportina-b2b-ui.checkout-index-index .checkout-payment-method {
    position: relative;
    z-index: 1;
}

body.sportina-b2b-ui.checkout-index-index .table-checkout-shipping-method {
    margin-bottom: 10px;
}

body.sportina-b2b-ui.checkout-index-index .checkout-container {
    padding-bottom: 48px;
}

body.sportina-b2b-ui .sportina-checkout-success-note {
    margin: 24px 0 32px;
    padding: 22px 24px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

body.sportina-b2b-ui .sportina-checkout-success-note__icon {
    width: 42px;
    height: 42px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    box-shadow: 0 12px 28px rgba(99, 102, 241, 0.25);
}

body.sportina-b2b-ui .sportina-checkout-success-note strong {
    font-size: 18px;
}

body.sportina-b2b-ui .sportina-checkout-success-note p {
    font-size: 14px;
}

body.sportina-b2b-ui .sportina-account-b2b-note {
    margin: 0 0 22px;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

body.sportina-b2b-ui.sales-order-history .orders-history,
body.sportina-b2b-ui.customer-account-index .block-dashboard-orders {
    position: relative;
    z-index: 1;
}

@media (max-width: 768px) {
    body.sportina-b2b-ui .sportina-checkout-b2b-note,
    body.sportina-b2b-ui .sportina-account-b2b-note,
    body.sportina-b2b-ui .sportina-checkout-success-note {
        grid-template-columns: 1fr;
    }

    body.sportina-b2b-ui .sportina-checkout-success-note {
        padding: 18px;
    }
}

/* SPORTINA_B2B_CHECKOUT_UX_V1 END */

/* SPORTINA_B2B_SUCCESS_MINICART_CLEANUP_V1 START */

/* Mini-koszyk: ukrywa tylko link "Zobacz i edytuj koszyk", zostawia przycisk przejścia do kasy */
body.sportina-b2b-ui .block-minicart .block-content > .actions .secondary,
body.sportina-b2b-ui .block-minicart .block-content > .actions .action.viewcart {
    display: none !important;
}

/* Success page: czysty B2B układ po zamówieniu */
body.sportina-b2b-ui.checkout-onepage-success .page-main {
    padding-top: 54px;
    padding-bottom: 64px;
}

body.sportina-b2b-ui.checkout-onepage-success .page-title-wrapper {
    display: none !important;
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean {
    max-width: 1208px;
    margin: 0 auto;
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean .sportina-checkout-success-note {
    margin: 0 0 22px;
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean__actions {
    margin-top: 0;
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean__actions .primary {
    float: none;
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean__actions .action.primary.continue {
    min-height: 48px;
    padding: 0 26px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
    border: 0 !important;
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 600;
    box-shadow: 0 16px 36px rgba(99, 102, 241, 0.28);
}

body.sportina-b2b-ui.checkout-onepage-success .sportina-success-clean__actions .action.primary.continue:hover {
    background: linear-gradient(135deg, #4f46e5, #7c3aed) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* SPORTINA_B2B_SUCCESS_MINICART_CLEANUP_V1 END */

/* =========================================================
   Sportina B2B premium footer
   ========================================================= */

body.sportina-b2b-ui .page-footer {
    margin-top: 64px !important;
    padding: 0 !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    background:
        radial-gradient(circle at 82% 18%, rgba(99, 102, 241, .24), transparent 28%),
        radial-gradient(circle at 18% 92%, rgba(139, 92, 246, .18), transparent 32%),
        linear-gradient(135deg, #0c0d0d 0%, #11111b 54%, #24123f 100%) !important;
    color: #fff !important;
}

body.sportina-b2b-ui .footer.content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.sportina-b2b-ui .footer.links,
body.sportina-b2b-ui .block.newsletter,
body.sportina-b2b-ui .copyright {
    display: none !important;
}

.sportina-b2b-footer-shell {
    width: 100%;
    color: #fff;
}

.sportina-b2b-footer {
    width: min(1440px, calc(100% - 56px));
    margin: 0 auto;
    padding: 48px 0 34px;
    display: grid;
    grid-template-columns: minmax(320px, 1.35fr) minmax(220px, .7fr) minmax(260px, .9fr);
    gap: 34px;
    align-items: start;
}

.sportina-b2b-footer__brand strong {
    display: block;
    max-width: 540px;
    margin: 14px 0 12px;
    color: #fff;
    font-size: 32px;
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -.035em;
}

.sportina-b2b-footer__eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: #c7d2fe;
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.sportina-b2b-footer__brand p {
    max-width: 560px;
    margin: 0;
    color: rgba(255,255,255,.74);
    font-size: 16px;
    line-height: 1.65;
}

.sportina-b2b-footer__links,
.sportina-b2b-footer__pillars {
    display: grid;
    gap: 12px;
    align-content: start;
}

.sportina-b2b-footer__links h3,
.sportina-b2b-footer__pillars h3 {
    margin: 4px 0 8px;
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -.015em;
}

.sportina-b2b-footer__links a {
    width: fit-content;
    color: rgba(255,255,255,.82) !important;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 600;
    text-decoration: none !important;
    transition: color .18s ease, transform .18s ease;
}

.sportina-b2b-footer__links a:hover {
    color: #c7d2fe !important;
    transform: translateX(2px);
}

.sportina-b2b-footer__pillars span {
    display: block;
    padding: 13px 15px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 16px;
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.84);
    font-size: 14px;
    line-height: 1.45;
    font-weight: 600;
}

.sportina-b2b-footer__bottom {
    width: min(1440px, calc(100% - 56px));
    margin: 0 auto;
    padding: 20px 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.62);
    font-size: 13px;
    line-height: 1.45;
    font-weight: 600;
}

/* Checkout właściwy zostaje skupiony — bez dużego marketingowego footera */
body.sportina-b2b-ui.checkout-index-index .page-footer {
    display: none !important;
}

@media (max-width: 980px) {
    .sportina-b2b-footer {
        width: min(100% - 32px, 1440px);
        grid-template-columns: 1fr;
        gap: 28px;
        padding-top: 38px;
    }

    .sportina-b2b-footer__bottom {
        width: min(100% - 32px, 1440px);
        display: grid;
        justify-content: start;
        gap: 8px;
    }
}

@media (max-width: 640px) {
    body.sportina-b2b-ui .page-footer {
        margin-top: 42px !important;
    }

    .sportina-b2b-footer__brand strong {
        font-size: 28px;
    }

    .sportina-b2b-footer__brand p {
        font-size: 15px;
    }
}

/* Sportina B2B button font weight cleanup */
body.sportina-b2b-ui button,
body.sportina-b2b-ui .action.primary,
body.sportina-b2b-ui button.primary {
    font-weight: 500 !important;
}

/* Hide Magento multishipping action in B2B cart */
body.sportina-b2b-ui .checkout-methods-items .action.multicheckout,
body.sportina-b2b-ui .checkout-methods-items a[href*="multishipping/checkout"] {
    display: none !important;
}
/* SPORTINA_CART_CLEAR_ACTION_V9 */
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

body.sportina-b2b-ui.checkout-cart-index
.cart.main.actions #empty_cart_button.action.clear {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #e2e4ec;
    border-radius: 12px;
    background: #ffffff;
    color: #a21717;
    font-weight: 700;
    box-shadow: none;
}

body.sportina-b2b-ui.checkout-cart-index
.cart.main.actions #empty_cart_button.action.clear:hover,
body.sportina-b2b-ui.checkout-cart-index
.cart.main.actions #empty_cart_button.action.clear:focus {
    border-color: #a21717;
    background: #fff6f6;
    color: #861313;
}

body.sportina-b2b-ui.checkout-cart-index
.cart.main.actions .action.update {
    min-height: 40px;
    padding: 0 18px;
    border-radius: 12px;
}
/* SPORTINA_CART_CLEAR_ACTION_V9 END */


/*
    Skladanie kolumn karty produktu przeniesione z 1100 na 980 px, zeby uklad
    dwukolumnowy (a wiec i jadaca galeria) dzialal takze na wezszych oknach -
    np. przy zadokowanym DevTools. Prawa kolumna ma minmax(420px, ...), wiec
    ponizej 980 px zrobiloby sie ciasno i wtedy uklad slusznie sie sklada.
*/
@media (max-width: 980px) {
    body.sportina-b2b-ui.catalog-product-view .column.main {
        display: block !important;
    }
}

/*
    Karta "Dostepnosc B2B". Do 31.07 caly jej wyglad siedzial w atrybutach
    style= wprost w B2bStock/.../product/stock.phtml - w tym szerokosc i
    promien. Styl inline ustepuje tylko !important, wiec kazde nadpisanie
    wymagalo go bez potrzeby, a naglowek karty byl golym <div> bez klasy, przez
    co regula mikroetykiety celowala w zly element. Teraz znaczniki maja klasy,
    a wyglad jest tutaj.
*/
body.sportina-b2b-ui.catalog-product-view .sportina-b2bstock {
    padding: 16px 18px;
    max-width: 760px;
    box-sizing: border-box;
}

body.sportina-b2b-ui.catalog-product-view .sportina-b2bstock__title {
    display: block;
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #8b90a0;
}

body.sportina-b2b-ui.catalog-product-view .sportina-b2bstock__row {
    padding: 10px 0;
    border-top: 1px solid #eceef1;
}

body.sportina-b2b-ui.catalog-product-view .sportina-b2bstock__note {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #eceef1;
    font-size: 13px;
    color: #6b7280;
}

/* Ostatnia karta bez dolnego marginesu - inaczej wiersz siatki jest o 14 px
   wyzszy niz widoczna krawedz i przyklejona galeria staje 14 px za nisko. */
body.sportina-b2b-ui.catalog-product-view .product-info-main > *:last-child {
    margin-bottom: 0 !important;
}

/* =========================================================================
   CENA I ETYKIETA W KAFELKU LISTINGU
   Przeniesione 31.07 z warstwy design-c.phtml (krok 3e przenosin).
   ========================================================================= */

body.sportina-b2b-ui .products-grid .price-box {
    margin: 0 0 9px;
}

/* Cena to tresc operacyjna tego widoku - ma prowadzic wzrok, nie szeptac.
   Przy 16 px byla ledwie wieksza od zwyklego tekstu (13,5 px). */
body.sportina-b2b-ui .products-grid .price {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    color: #111827;
}

body.sportina-b2b-ui .products-grid .price-label {
    font-size: 11.5px;
    font-weight: 400;
    /* Bylo #8a8f8c - ostatnia zielonoszara pozostalosc, ktora umknela przy
       przestrajaniu palety, bo nie bylo jej na liscie zamian. */
    color: #8b90a0;
    text-transform: lowercase;
}

/* =========================================================================
   KARTA PRODUKTU: GALERIA, TYTUL, FOTORAMA
   Przeniesione 31.07 z warstwy design-c.phtml (krok 3e przenosin).
   ========================================================================= */

body.sportina-b2b-ui.catalog-product-view .product.media {
    padding: 18px !important;
    border: 1px solid #dcdfe4 !important;
    border-radius: 2px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

/* Tytul produktu: ciasniej, bez plakatowego rozstrzelenia. */
body.sportina-b2b-ui.catalog-product-view .page-title-wrapper .page-title {
    letter-spacing: -0.015em;
    line-height: 1.15;
}

/* Galeria: zdjecie na bieli, bez zaokraglen. */
body.sportina-b2b-ui.catalog-product-view .product.media .fotorama__stage,
body.sportina-b2b-ui.catalog-product-view .product.media .fotorama__nav-wrap,
body.sportina-b2b-ui.catalog-product-view .product.media .fotorama__thumb {
    border-radius: 0 !important;
    background: #ffffff !important;
}

body.sportina-b2b-ui.catalog-product-view .product.media .fotorama__thumb-border {
    border-radius: 0 !important;
    border-color: #6b7280 !important;
}

/* =========================================================================
   GALERIA JEDZIE Z UZYTKOWNIKIEM

   Chrome NIE ogranicza przyklejonego elementu do jego obszaru siatki, tylko do
   calego kontenera siatki - grid-row rzadzi rozmieszczeniem, ale nie zasiegiem
   przyklejenia. Zmierzone: siatka o wierszach 1123 i 1163 px, galeria 730 px z
   grid-row: 1, a jechala przez ~1900 px, czyli przez oba wiersze, i opis
   przejezdzal pod nia.

   Dlatego galeria ma WLASNE OPAKOWANIE (kontener sportina.gallery.sticky,
   dodany w B2bAccess/.../layout/catalog_product_view.xml). Opakowanie jest
   elementem siatki w wierszu 1 i rozciaga sie na jego wysokosc, a przyklejona
   galeria w srodku ma zwyczajny blok zawierajacy, konczacy sie z wierszem 1.

   ZERO marginesu dolnego na galerii: wysokosc wiersza wyznacza wyzsza kolumna,
   czyli prawa, wiec bez marginesu galeria staje DOKLADNIE na dole prawej
   kolumny, niezaleznie od liczby rozmiarow w tabeli.

   Od 981 px szerokosci, bo ponizej 980 px motyw sklada kolumny
   (display: block) - a wtedy nie ma wiersza, ktory by przyklejenie ograniczyl.
   ========================================================================= */
@media (min-width: 981px) {
    body.sportina-b2b-ui.catalog-product-view .sportina-gallery-sticky {
        grid-row: 1 !important;
        grid-column: 1 !important;
        align-self: stretch !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product.media {
        position: sticky !important;
        top: 16px !important;
        margin-bottom: 0 !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product-info-main {
        grid-row: 1 !important;
        grid-column: 2 !important;
    }

    body.sportina-b2b-ui.catalog-product-view .product.info.detailed {
        grid-row: 2 !important;
        grid-column: 1 / -1 !important;
    }
}

/* =========================================================================
   GALERIA PELNOEKRANOWA (po klikneciu zdjecia)

   ZASADA, do ktorej doszedlem po nieudanej probie: NIE walczyc z matematyka
   Fotoramy. Biblioteka liczy w JS wysokosc sceny jako "okno minus pas miniatur"
   i wpisuje ja w atrybut style. Kiedy dodalem wlasny pasek narzedzi 64 px i
   wypelnienie pasa miniatur 37 px, ukradlem wysokosc, o ktorej Fotorama nie
   wiedziala - a moje height: auto !important nadpisywalo jej poprawne wyliczenie
   (836 px) i sciagalo scene do 560 px. Efekt: zdjecie male, a pod miniaturami
   170 px martwej bieli.

   Dlatego uklad pionowy nalezy do Fotoramy: scena + pas miniatur wypelniaja
   okno dokladnie. Nasza jest tylko dekoracja BEZ KOSZTU W UKLADZIE - kreska nad
   pasem miniatur rysowana box-shadow (nie border, ktory dodalby 1 px do pudelka)
   oraz kontrolki, ktore sa pozycjonowane absolutnie, wiec nic nie zajmuja.

   Porzadek przestrzeni bierze sie z WYROWNANIA kontrolek (wszystkie 20 px od
   krawedzi, zoom scalony w pare), a nie z dorysowanego pasa.

   PRZEBIJAJACY KOSZYK: .fotorama--fullscreen ma w gallery.css z-index 1000 z
   !important, a minikoszyk 1200. gallery.css laduje sie PO arkuszu motywu, wiec
   przy rownej specyficznosci (jedna klasa) samo !important nie wystarczalo -
   stad selektor z body, ktory wygrywa niezaleznie od kolejnosci.
   ========================================================================= */

body .fotorama--fullscreen {
    z-index: 1300 !important;
    background: #ffffff !important;
    /* Kolumna flex, zeby opakowanie mialo OKRESLONA wysokosc - bez tego scena
       nie ma sie do czego rozciagnac i zostaje 560 px. */
    display: flex !important;
    flex-direction: column !important;
}

/*
    Kreska oddzielajaca pas miniatur rysowana cieniem, nie ramka - border dodalby
    1 px do wysokosci pudelka, czyli znow zabralby przestrzen wyliczona przez JS.
*/
body .fotorama--fullscreen .fotorama__nav-wrap {
    background: #ffffff !important;
    box-shadow: 0 -1px 0 #eceef1 !important;
}

/*
    Miniatury wysrodkowane. .fotorama__nav__shaft jest inline-block, wiec
    wystarczy text-align na rodzicu - a szerokosc rodzica trzeba sciagnac do
    100%, bo JS wpisuje mu pelna szerokosc pasa.
    NIE uzywac do tego flexa na shafcie: .fotorama__thumb-border jest w nim
    pozycjonowana absolutnie i przesuwana transformem, wiec staje sie elementem
    flex, rozpycha miniatury i odrywa sie od zaznaczonej. Sprawdzone.
*/
body .fotorama--fullscreen .fotorama__nav {
    width: 100% !important;
    text-align: center !important;
}

/*
    Zdjecie ma 2:3, a Fotorama liczy wysokosc sceny z jej SZEROKOSCI. Dopoki
    opakowanie mialo inline max-width: 1200px, scena wychodzila 560 px i pod
    pasem miniatur zostawalo 276 px bieli. Po zdjeciu tego limitu biblioteka
    SAMA przelicza scene na 836 px, czyli okno minus pas miniatur - i przestrzen
    jest wykorzystana w calosci. Wysokosci nie nadpisujemy; podajemy tylko
    szerokosc i pozwalamy jej policzyc reszte.
*/
body .fotorama--fullscreen .fotorama__wrap {
    max-width: none !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
}

/*
    KLUCZOWE: scene rozciaga flex-grow, a wpisana przez JS wysokosc (560 px)
    zostaje punktem wyjscia (flex-basis: auto). NIE nadpisywac tu height: auto -
    probowalem i wtedy scena spada do wysokosci tresci, czyli w druga strone.
    Fotorama przelicza scene tylko przy zdarzeniu zmiany rozmiaru, wiec sama
    zmiana CSS jej do tego nie sklania - dlatego robimy to flexem.
*/
/*
    PRAWDZIWA przyczyna malego zdjecia w pustce - nasza wlasna regula, nie
    Fotorama. W tym arkuszu jest:
        body.sportina-b2b-ui.catalog-product-view .fotorama__stage {
            height: 560px !important; max-height: 560px !important;
            min-height: 560px; }
    Ustawia ona wysokosc sceny dla galerii NA STRONIE produktu - i obowiazuje
    takze na pelnym ekranie, bo klasa catalog-product-view zostaje na body.
    Fotorama poprawnie wpisywala w style height: 836px, a ta regula sciagala
    scene do 560 px; stad 258 px martwej bieli pod pasem miniatur.

    Trzeba ja zniesc TYLKO w trybie pelnoekranowym, wiec selektor ma cztery
    klasy - tamten ma trzy i wygrywalby z krotszym.
*/
body.sportina-b2b-ui.catalog-product-view .fotorama--fullscreen .fotorama__stage,
body .fotorama--fullscreen .fotorama__stage {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
}

/* Kadr i suwak musza isc za wysokoscia sceny, bo sa w niej pozycjonowane. */
body .fotorama--fullscreen .fotorama__stage__shaft,
body .fotorama--fullscreen .fotorama__stage__frame {
    height: 100% !important;
}

/*
    NIE stylowac .fotorama__img--full. Zoom w Magento dziala tak, ze wpisuje
    obrazkowi wymiary w atrybut style - a regula CSS z !important bije styl
    inline, wiec ustawienie mu tutaj width/height/max-* CALKOWICIE BLOKOWALO
    powiekszanie: przycisk + reagowal, ale obrazek nie zmienial rozmiaru.
    Skalowanie do sceny Fotorama robi sama; wystarczy jej nie przeszkadzac.
*/

/* ---- Kontrolki: wspolna obudowa, rysowane wlasnymi glifami ----
   Sprite Magento ma geometrie liczona dla pol 80x80, wiec nie da sie ich
   zmniejszyc bez obcinania obrazka. Gradienty i obrocona kreska pozwalaja zejsc
   do 40 px i zgrupowac kontrolki. */
body .fotorama--fullscreen .fotorama__fullscreen-icon,
body .fotorama--fullscreen .fotorama__zoom-in,
body .fotorama--fullscreen .fotorama__zoom-out {
    width: 40px !important;
    height: 40px !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid #dcdfe4 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    transition: background-color 140ms ease, border-color 140ms ease;
}

body .fotorama--fullscreen .fotorama__fullscreen-icon:hover,
body .fotorama--fullscreen .fotorama__zoom-in:hover,
body .fotorama--fullscreen .fotorama__zoom-out:hover {
    background-color: #f8fafc !important;
    border-color: #6b7280 !important;
}

/* Zoom jako jedna scalona para [-][+], nie dwa osobne klocki. */
body .fotorama--fullscreen .fotorama__zoom-out {
    top: 20px !important;
    left: 20px !important;
    border-radius: 2px 0 0 2px !important;
    background-image: linear-gradient(#1f2430, #1f2430) !important;
    background-size: 13px 1px !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

body .fotorama--fullscreen .fotorama__zoom-in {
    top: 20px !important;
    left: 59px !important;
    border-radius: 0 2px 2px 0 !important;
    border-left-color: #eceef1 !important;
    background-image:
        linear-gradient(#1f2430, #1f2430),
        linear-gradient(#1f2430, #1f2430) !important;
    background-size: 13px 1px, 1px 13px !important;
    background-position: center, center !important;
    background-repeat: no-repeat !important;
}

/* Zamknij: krzyzyk z dwoch kresek pod skosem. */
body .fotorama--fullscreen .fotorama__fullscreen-icon {
    top: 20px !important;
    right: 20px !important;
    background-image:
        linear-gradient(45deg, transparent 46%, #1f2430 46%, #1f2430 54%, transparent 54%),
        linear-gradient(-45deg, transparent 46%, #1f2430 46%, #1f2430 54%, transparent 54%) !important;
    background-size: 15px 15px, 15px 15px !important;
    background-position: center, center !important;
    background-repeat: no-repeat !important;
}

/* ---- Strzalki ---- */
body .fotorama--fullscreen .fotorama__arr {
    width: 84px !important;
    background: transparent !important;
}

body .fotorama--fullscreen .fotorama__arr--prev {
    left: 20px !important;
}

body .fotorama--fullscreen .fotorama__arr--next {
    right: 20px !important;
}

/*
    Obudowe dostaje WEWNETRZNY .fotorama__arr__arr. Na .fotorama__arr jej nie
    stawiac - to wysokie, niewidoczne pole klikalne na cala wysokosc sceny, wiec
    ramka narysowalaby pas przez pol ekranu.
*/
body .fotorama--fullscreen .fotorama__arr__arr {
    width: 44px !important;
    height: 44px !important;
    margin: -22px 0 0 -22px !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid #dcdfe4 !important;
    border-radius: 2px !important;
    transition: background-color 140ms ease, border-color 140ms ease;
}

body .fotorama--fullscreen .fotorama__arr:hover .fotorama__arr__arr {
    background-color: #f8fafc !important;
    border-color: #6b7280 !important;
}

/* Szewron: kwadrat z dwoma krawedziami, obrocony o 45 stopni. */
body .fotorama--fullscreen .fotorama__arr__arr::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 9px;
    border-left: 1.5px solid #1f2430;
    border-bottom: 1.5px solid #1f2430;
}

body .fotorama--fullscreen .fotorama__arr--prev .fotorama__arr__arr::after {
    transform: translate(-40%, -50%) rotate(45deg);
}

body .fotorama--fullscreen .fotorama__arr--next .fotorama__arr__arr::after {
    transform: translate(-60%, -50%) rotate(-135deg);
}

/* ---- Miniatury i skupienie ---- */
body .fotorama--fullscreen .fotorama__thumb-border {
    border: 2px solid #6366f1 !important;
    border-radius: 2px !important;
}

/*
    Neutralny pierscien skupienia zamiast domyslnego niebieskiego prostokata.
    !important konieczne - bez niego pierscien przegladarki zostawal widoczny.
*/
body .fotorama--fullscreen [tabindex]:focus,
body .fotorama--fullscreen [role="button"]:focus,
body .fotorama--fullscreen .fotorama__nav__frame:focus {
    outline: none !important;
    box-shadow: none !important;
}

body .fotorama--fullscreen [tabindex]:focus-visible,
body .fotorama--fullscreen [role="button"]:focus-visible,
body .fotorama--fullscreen .fotorama__nav__frame:focus-visible {
    outline: 2px solid #6b7280 !important;
    outline-offset: 2px !important;
}

/* =========================================================================
   KOSZYK - LISTA PRODUKTOW

   Ma sie czytac jak listing kategorii i karta produktu, a nie jak surowa tabela
   Magento. Prawy panel podsumowania zostaje swiadomie obly i fioletowy - to
   element interfejsu panelu, nie tresc sklepowa.

   Te same zetony co w calym kierunku C: ramka #dcdfe4, promien 2 px, kreski
   #eceef1, mikroetykieta 11/600/.06em/wersaliki/#8b90a0, tresc 13,5 px #1f2430,
   liczby #111827 z tabular-nums.
   ========================================================================= */

body.sportina-b2b-ui.checkout-cart-index .cart.table-wrapper {
    background: #ffffff;
    border: 1px solid #dcdfe4;
    border-radius: 2px;
    box-shadow: none;
    padding: 0;
    margin-bottom: 18px;
    overflow-x: auto;
}

/* Naglowki kolumn jako mikroetykiety - byly pogrubione i ciemne. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table thead th {
    padding: 12px 14px;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #8b90a0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-align: left;
}

/* Wiersz pozycji: kreska u gory, zero pudelek. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table tbody.cart.item {
    border: 0;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table tbody.cart.item > tr > td {
    border: 0;
    border-top: 1px solid #eceef1;
    padding: 16px 14px;
    vertical-align: top;
    background: transparent;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table tbody.cart.item:first-of-type > tr.item-info > td {
    border-top: 0;
}

/* Wiersz z odnosnikami akcji nie zaczyna nowej pozycji, wiec bez kreski. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table tr.item-actions > td {
    border-top: 0;
    padding-top: 0;
}

/*
    Miniatura obok nazwy, nie nad nia.

    Uzywamy OPLYWANIA, a nie flexa. display: flex na komorce tabeli odbiera jej
    role table-cell i rozjezdza szerokosci kolumn - naglowki przestaja sie
    zgadzac z zawartoscia. Przy oplywaniu komorka pozostaje komorka.
    .product-item-details dostaje wlasny kontekst formatowania (overflow: hidden),
    zeby tekst nie zawijal sie pod zdjecie, a komorka domyka oplywanie przez ::after.
*/
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.item::after {
    content: "";
    display: block;
    clear: both;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-item-photo {
    float: left;
    width: 96px;
    margin: 0 16px 0 0;
    border: 1px solid #eceef1;
    border-radius: 2px;
    background: #ffffff;
    overflow: hidden;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-item-details {
    overflow: hidden;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-image-photo {
    display: block;
    width: 100%;
    height: auto;
}

/* Nazwa produktu: te same wartosci co w kafelku listingu. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-item-name {
    display: block;
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-item-name > a {
    color: #111827;
    text-decoration: none;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .product-item-name > a:hover {
    text-decoration: underline;
}

/* "Rozmiar: D34" - etykieta jako mikroetykieta, wartosc jako dane. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-options {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 8px;
    font-size: 13.5px;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-options dt {
    margin: 0;
    color: #8b90a0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-options dd {
    margin: 0;
    color: #1f2430;
    font-weight: 600;
}

/* Liczby: prawa krawedz i cyfry tabelaryczne, zeby kolumny sie zgadzaly. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.price,
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.subtotal,
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table thead th.price,
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table thead th.subtotal {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.price .price {
    color: #1f2430;
    font-size: 14px;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.subtotal .price {
    color: #111827;
    font-size: 16px;
    font-weight: 700;
}

/* Etykieta "Bez podatku" nie ma tu nic do wnoszenia - kwoty i tak sa netto. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .price-excluding-tax:before {
    display: none;
}

/* Pole ilosci: identyczne jak w tabeli szybkiego zamawiania. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .col.qty {
    text-align: center;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table input.qty {
    width: 72px;
    height: 34px;
    padding: 4px 8px;
    border: 1px solid #dcdfe4;
    border-radius: 3px;
    box-shadow: none;
    text-align: center;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* Odnosniki akcji: drugi plan, nie konkuruja z nazwa produktu. */
body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-actions .actions-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
    padding: 0;
    margin: 0;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-actions .actions-toolbar a {
    color: #6b7280;
    font-size: 12.5px;
    text-decoration: none;
}

body.sportina-b2b-ui.checkout-cart-index #shopping-cart-table .item-actions .actions-toolbar a:hover {
    color: #111827;
    text-decoration: underline;
}

/* Pasek przyciskow pod lista: jeden akcent, reszta kanciasto i wyciszona. */
/*
    Pasek przyciskow do lewej. Luma trzyma tu text-align: right, a same przyciski
    sa elementami liniowymi - bez wymuszenia zostawaly przy prawej krawedzi.
    !important, bo regula Lumy ma wyzsza specyficznosc.
*/
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start !important;
    gap: 12px;
    margin: 0 0 28px;
    text-align: left !important;
}

body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.continue,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.clear,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.update {
    min-height: 40px;
    padding: 0 18px;
    border-radius: 3px;
    box-shadow: none;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 38px;
}

/*
    Wszystkie trzy przyciski jednakowo: biale, kanciaste, z kreska. "Przelicz
    koszyk" mial szare wypelnienie z motywu i czytal sie jak wylaczony, mimo ze
    jest w tym widoku najczesciej uzywana akcja. Jedynym akcentem na tej stronie
    zostaje fioletowe "Przejdz do kasy" w panelu po prawej - i tak ma byc,
    bo to konwersja.
*/
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.continue,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.clear,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.update {
    border: 1px solid #dcdfe4 !important;
    background: #ffffff !important;
    color: #1f2430 !important;
    text-decoration: none;
}

body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.continue:hover,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.clear:hover,
body.sportina-b2b-ui.checkout-cart-index .cart.main.actions .action.update:hover {
    border-color: #6b7280 !important;
    background: #f8fafc !important;
    color: #111827 !important;
}

/* =========================================================================
   KASA

   Wygladala jak surowe Magento, bo Luma ma tu wlasny akcent - POMARANCZOWY
   #ff5501 - na pasku krokow i wybranym adresie. Nasz akcent to fiolet #6366f1,
   wiec pomaranczu nie da sie pogodzic z reszta; zamieniamy go wszedzie.

   Panel podsumowania po prawej zostaje obly, jak w koszyku - to element
   interfejsu panelu. Tresc (adresy, metody dostawy) idzie w jezyk kierunku C.
   ========================================================================= */

/* ---- Pasek krokow: pomaranczowy -> fioletowy ----

   BUDOWA W LUMIE, odczytana z wyeksportowanego arkusza, nie z domyslu:
     .opc-progress-bar-item:before        -> LINIA miedzy krokami
     .opc-progress-bar-item > span:before -> zewnetrzne kolo 38 px
     .opc-progress-bar-item > span:after  -> WEWNETRZNE BIALE kolo 26 px,
                                             ktore zawiera numer lub ptaszek
   Pierwsza proba pomalowala :after na bialo, biorac je za tlo - a to jest
   ptaszek na bialym kole, wiec zniknal. Kolor ptaszka i numeru ustawiamy
   przez color, tlo wewnetrznego kola zostaje biale.

   !important jest konieczne: arkusz Lumy laduje sie PO naszym, wiec przy rownej
   specyficznosci rozstrzyga kolejnosc. Ta sama pulapka co przy gallery.css.
*/
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item:before,
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item > span:before {
    background: #eceef1 !important;
    border-color: #dcdfe4 !important;
}

body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item > span:after {
    color: #6b7280 !important;
    border-color: #dcdfe4 !important;
}

/* Krok zrobiony i krok biezacy: linia oraz zewnetrzne kolo na fiolecie. */
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._active:before,
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._complete:before,
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._active > span:before,
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._complete > span:before {
    background: #6366f1 !important;
    border-color: #6366f1 !important;
}

/* Ptaszek/numer w bialym kole - fioletowy, zeby byl widoczny. */
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._active > span:after,
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar-item._complete > span:after {
    background: #ffffff !important;
    border-color: #6366f1 !important;
    color: #6366f1 !important;
}

/* ---- Naglowki krokow ---- */
body.sportina-b2b-ui.checkout-index-index .step-title,
body.sportina-b2b-ui.checkout-index-index .checkout-shipping-method .step-title,
body.sportina-b2b-ui.checkout-index-index .checkout-shipping-address .step-title {
    padding-bottom: 12px;
    border-bottom: 1px solid #eceef1;
    color: #111827;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.015em;
}

/* ---- Karty adresow: kanciasto, akcent fioletowy zamiast pomaranczowego ---- */
body.sportina-b2b-ui.checkout-index-index .shipping-address-item {
    border: 1px solid #dcdfe4;
    border-radius: 2px;
    padding: 18px 20px;
    font-size: 13.5px;
    line-height: 1.6;
    color: #1f2430;
}

body.sportina-b2b-ui.checkout-index-index .shipping-address-item.selected-item {
    border: 2px solid #6366f1;
    border-radius: 2px;
    background: #ffffff;
}

body.sportina-b2b-ui.checkout-index-index .shipping-address-item.selected-item:after {
    background: #6366f1;
    border-radius: 0 0 0 2px;
    content: '\e610';
}

/* ---- Przyciski wtorne: kanciasto, kreska, bez szarego wypelnienia ---- */
body.sportina-b2b-ui.checkout-index-index .action-select-shipping-item,
body.sportina-b2b-ui.checkout-index-index .action-show-popup,
body.sportina-b2b-ui.checkout-index-index .action.action-edit-address {
    min-height: 40px;
    padding: 0 18px;
    border: 1px solid #dcdfe4;
    border-radius: 3px;
    background: #ffffff;
    box-shadow: none;
    color: #1f2430;
    font-size: 13.5px;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .action-select-shipping-item:hover,
body.sportina-b2b-ui.checkout-index-index .action-show-popup:hover,
body.sportina-b2b-ui.checkout-index-index .action.action-edit-address:hover {
    border-color: #6b7280;
    background: #f8fafc;
    color: #111827;
}

/* ---- Metody dostawy jako wiersz danych ---- */
body.sportina-b2b-ui.checkout-index-index #checkout-shipping-method-load .row {
    border-top: 1px solid #eceef1;
}

body.sportina-b2b-ui.checkout-index-index #checkout-shipping-method-load td {
    padding: 12px 10px;
    border: 0;
    font-size: 13.5px;
    color: #1f2430;
}

body.sportina-b2b-ui.checkout-index-index #checkout-shipping-method-load .col-price {
    font-weight: 700;
    color: #111827;
    font-variant-numeric: tabular-nums;
}

/* ---- Panel podsumowania: obly, jak w koszyku, ale bialy zamiast bezowego ---- */
body.sportina-b2b-ui.checkout-index-index .opc-sidebar .opc-block-summary {
    background: #ffffff;
    border: 1px solid #eceef1;
    border-radius: 20px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.06);
    padding: 26px 28px;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary > .title {
    border-bottom: 1px solid #eceef1;
    color: #111827;
    font-size: 20px;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .items-in-cart > .title strong {
    color: #1f2430;
    font-size: 14px;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .product-item-name {
    color: #111827;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.35;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .price,
body.sportina-b2b-ui.checkout-index-index .opc-block-summary .subtotal .price {
    color: #111827;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* Miniatura w podsumowaniu jak w koszyku: bialy kadr z kreska. */
body.sportina-b2b-ui.checkout-index-index .opc-block-summary .product-image-container {
    border: 1px solid #eceef1;
    border-radius: 2px;
    background: #ffffff;
    overflow: hidden;
}

/* ---- Przycisk glowny: jedyny akcent, plaski fiolet ---- */
body.sportina-b2b-ui.checkout-index-index .button.action.continue.primary,
body.sportina-b2b-ui.checkout-index-index .actions-toolbar .action.primary.checkout {
    border: 0;
    border-radius: 3px;
    background: #6366f1;
    box-shadow: none;
    color: #ffffff;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .button.action.continue.primary:hover,
body.sportina-b2b-ui.checkout-index-index .actions-toolbar .action.primary.checkout:hover {
    background: #4f46e5;
}

/* =========================================================================
   GORNY PASEK B2B (warunki handlowe + powitanie)

   Przeniesione 31.07 z bloku <style> w header-b2b-financials.phtml. Styl musi
   byc tutaj, bo z tych samych klas korzysta teraz takze pasek w KASIE, ktory
   ma wlasny szablon (checkout-topbar.phtml) - trzymanie regul w jednym z
   szablonow oznaczaloby, ze drugi widok jest bez stylu.
   ========================================================================= */
    /* Górny pasek w jednym wierszu: finanse po lewej, „Witaj…" po prawej */
    body.sportina-b2b-ui .panel.header {
        display: flex;
        align-items: center;
        gap: 24px;
    }

body.sportina-b2b-ui .panel.header .header.links {
    margin-left: auto;
    float: none;
    /*
        flex: 0 0 auto oraz nowrap sa konieczne. Bez nich pasek finansowy - tez
        element flex - zabieral cala szerokosc, opakowanie powitania dostawalo
        0 px i tekst nie byl widoczny, mimo ze byl ustawiony. Zmierzone:
        prostokat powitania 0x0 przy niepustym textContent.
    */
    flex: 0 0 auto;
    white-space: nowrap;
}

    .sportina-b2b-headerbar {
        display: none;
        flex-wrap: wrap;
        align-items: center;
        gap: 20px;
    }

    .sportina-b2b-headerbar__item {
        display: inline-flex;
        align-items: baseline;
        gap: 6px;
        white-space: nowrap;
    }

    .sportina-b2b-headerbar__label {
        color: rgba(255, 255, 255, .6);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .sportina-b2b-headerbar__value {
        color: #ffffff;
        font-size: 13px;
        font-weight: 700;
    }

    @media (max-width: 900px) {
        .sportina-b2b-headerbar {
            gap: 12px;
        }
    }

/*
    Karty adresow rownej wysokosci. Byly rozne, bo w jednej jest dodatkowo
    przycisk "Wysylamy Tutaj" - bez rozciagania karta zaznaczona wychodzila
    nizsza od sasiedniej.
*/
body.sportina-b2b-ui.checkout-index-index .shipping-address-items {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 20px;
}

body.sportina-b2b-ui.checkout-index-index .shipping-address-item {
    display: flex;
    flex-direction: column;
    margin: 0;
    width: calc(50% - 10px);
    box-sizing: border-box;
}

/* Przycisk wyboru u dolu karty, zeby karty konczyly sie rowno. */
body.sportina-b2b-ui.checkout-index-index .shipping-address-item .action-select-shipping-item {
    margin-top: auto;
    align-self: flex-end;
}

/* Odstep miedzy naglowkiem strony a paskiem krokow byl za maly. */
body.sportina-b2b-ui.checkout-index-index .opc-progress-bar {
    margin-top: 32px;
}

/* =========================================================================
   KASA, KROK 2: PODSUMOWANIE I PLATNOSC
   ========================================================================= */

/*
    "Dostawa do:" i "Metoda dostawy" lezaly na tle strony, POD bialym panelem
    podsumowania - czytalo sie to jak niedokonczony fragment. Teraz sa wlasna
    plyta w tym samym jezyku co panel wyzej.
*/
body.sportina-b2b-ui.checkout-index-index .opc-block-shipping-information {
    margin-top: 20px;
    padding: 26px 28px;
    background: #ffffff;
    border: 1px solid #eceef1;
    border-radius: 20px;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.06);
}

body.sportina-b2b-ui.checkout-index-index .opc-block-shipping-information .shipping-information-title {
    margin: 0 0 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eceef1;
    color: #111827;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: normal;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-shipping-information .shipping-information-content {
    font-size: 13.5px;
    line-height: 1.6;
    color: #1f2430;
}

/* Metoda platnosci i adres rozliczeniowy w naszej typografii. */
body.sportina-b2b-ui.checkout-index-index .payment-method-title,
body.sportina-b2b-ui.checkout-index-index .payment-method-content,
body.sportina-b2b-ui.checkout-index-index .billing-address-details {
    font-size: 13.5px;
    line-height: 1.6;
    color: #1f2430;
}

body.sportina-b2b-ui.checkout-index-index .payment-method-title .label span {
    color: #111827;
    font-weight: 600;
}

/* Kod rabatowy jako spokojny odnosnik, nie niebieski link Lumy. */
body.sportina-b2b-ui.checkout-index-index .payment-option-title .action-toggle,
body.sportina-b2b-ui.checkout-index-index .payment-option-title .action-toggle span {
    color: #6b7280;
    font-size: 13.5px;
    font-weight: 600;
}

body.sportina-b2b-ui.checkout-index-index .payment-option-title .action-toggle:hover span {
    color: #111827;
}

/* Podsumowanie kwot: liczby tabelaryczne, zeby kolumna sie zgadzala. */
body.sportina-b2b-ui.checkout-index-index .opc-block-summary .table-totals {
    font-variant-numeric: tabular-nums;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .table-totals .grand .mark,
body.sportina-b2b-ui.checkout-index-index .opc-block-summary .table-totals .grand .amount {
    color: #111827;
    font-weight: 700;
}


/* --------------------------------------------------------------------------
   KASA: TERMIN WYSYŁKI MUSI BYĆ WIDOCZNY BEZ KLIKANIA

   Magento chowa opcje pozycji (ROZMIAR, WYSYŁKA) pod przełącznikiem
   „Zobacz szczegóły". Termin wysyłki jest teraz częścią zamówienia, a nie
   szczegółem technicznym — klient musi go widzieć w chwili zatwierdzania.
   Ukrywamy więc sam przełącznik i pokazujemy treść na stałe.
   -------------------------------------------------------------------------- */
body.sportina-b2b-ui.checkout-index-index .opc-block-summary .minicart-items .product.options .toggle {
    display: none;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .minicart-items .product.options .content {
    display: block !important;
    margin-top: 6px;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .minicart-items .product.options .content .label {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #6b7280;
}

body.sportina-b2b-ui.checkout-index-index .opc-block-summary .minicart-items .product.options .content .values {
    font-size: 13px;
    color: #111827;
    margin: 0 0 4px;
}