/* ----------------------------------------------------
   KOSTKOLAND - CUSTOM THEME OVERRIDES (LESS/CSS COMPILATION)
   ---------------------------------------------------- */

/* Base resets & helper styles */
.box-sizing {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.btn.btn-red {
    border-radius: 1rem !important;
}

.addtobasket:hover {
    border: 1px solid #383838 !important;
    background-color: #04BBFF !important;
}

/* Clear floats for legacy grids and resets */
.products::before,
.products::after,
.productlist::before,
.productlist::after,
.innerbox::before,
.innerbox::after {
    display: none !important;
    content: none !important;
}

.products.viewphot .product .prodimage span {
    min-height: 180px;
    max-height: 180px;
}

.products.viewphot .product .buttons .quickview {
    display: none;
}

.menu .innermenu .menu-list>li>h3>a span {
    font-weight: bold;
}

.shop-gallery .shop-gallery-skin .shop-gallery-title {
    display: none;
}


/* ----------------------------------------------------
   NEW CUSTOM STYLING (MATCHING MOCKUP DESIGN PRECISELY)
   ---------------------------------------------------- */

/* --- 1. HEADER CUSTOM STYLING --- */
.header-custom {
    background: #ffffff !important;
    border-bottom: 1px solid #f0f0f0;
    padding: 15px 0;
    margin: 0;
}

.header-container {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.header-logo {
    display: block;
    max-width: 300px;
}

.header-logo img {
    max-height: 80px;
    width: auto;
    display: block;
}

.header-search {
    flex-grow: 1;
    max-width: 500px;
    margin: 0 30px;
    position: relative;
}

.header-search .search-form {
    display: flex;
    align-items: center;
    background: #f5f6f9;
    border-radius: 30px;
    padding: 5px 5px 5px 20px;
    border: 1px solid #e1e4e8;
    transition: all 0.3s ease;
}

.header-search .search-form:hover,
.header-search .search-form:focus-within {
    border-color: #04BBFF;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(4, 187, 255, 0.15);
}

.header-search .search-input {
    flex-grow: 1;
    border: none !important;
    background: transparent !important;
    outline: none !important;
    font-size: 14px;
    color: #333333;
    padding: 8px 0;
    box-shadow: none !important;
}

.header-search .search-input::placeholder {
    color: #9e9e9e;
}

.header-search .search-btn {
    background: #000000;
    border: none;
    outline: none;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.header-search .search-btn:hover {
    background: #7b00ff;
    transform: scale(1.05);
}

.header-search .search-btn img {
    width: 18px;
    height: 18px;
    filter: invert(1);
    /* changes SVG to white icon */
}

.header-icons {
    display: flex !important;
    align-items: center !important;
    gap: 28px;
    margin: 0;
    padding: 0;
}

.header-icon-item {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: 50px !important;
    height: auto !important;
    float: none !important;
}

.header-icon-item>a,
.header-icon-item.basket>a.count {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #1a1a1a !important;
    transition: color 0.3s ease, transform 0.3s ease !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: auto !important;
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    line-height: normal !important;
}

.header-icon-item:hover>a,
.header-icon-item.basket:hover>a.count {
    color: #7b00ff !important;
}

.header-icon-item .icon-img {
    width: 24px !important;
    height: 24px !important;
    margin: 0 0 6px 0 !important;
    display: block !important;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
    object-fit: contain;
}

.header-icon-item:hover .icon-img {
    transform: translateY(-3px) scale(1.05) !important;
}

.header-icon-item .icon-label {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    color: inherit !important;
    text-align: center !important;
    white-space: nowrap !important;
    letter-spacing: 0.2px;
    margin: 0 !important;
    padding: 0 !important;
}

/* User dropdown submenu on hover with smooth transition */
.user-submenu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: -10px !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
    padding: 8px 0 !important;
    min-width: 160px !important;
    z-index: 1000 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(0.96) !important;
    transform-origin: top right !important;
    transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1), transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.4s !important;
    border: 1px solid #e8ecf1 !important;
}

.user-submenu::before {
    content: '' !important;
    position: absolute !important;
    top: -12px !important;
    left: 0 !important;
    width: 100% !important;
    height: 12px !important;
    background: transparent !important;
}

.user-item:hover .user-submenu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.user-submenu a {
    display: block !important;
    padding: 10px 20px !important;
    color: #2c3e50 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.user-submenu a:hover {
    background: #f4f6fb !important;
    color: #7b00ff !important;
    padding-left: 24px !important;
}

/* Shopping Cart Badge & dropdown reset and alignment */
header .logo-bar .basket,
.header-icon-item.cart-item,
.header-icon-item.basket {
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    background: none !important;
    border: none !important;
    min-width: unset !important;
    width: auto !important;
    height: auto !important;
    line-height: normal !important;
    box-shadow: none !important;
}

.basket .count,
header .logo-bar .basket>a.count {
    background: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    min-width: unset !important;
    border: none !important;
    line-height: normal !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

.basket .count::before,
.basket .count::after,
header .logo-bar .basket>a.count::before,
header .logo-bar .basket>a.count::after {
    display: none !important;
    /* Hide legacy icon font pseudo elements */
    content: none !important;
}

.basket .count img,
header .logo-bar .basket img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.cart-icon-wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 0 6px 0 !important;
}

.cart-icon-wrapper .icon-img {
    margin: 0 !important;
    width: 24px !important;
    height: 24px !important;
}

.cart-badge {
    position: absolute !important;
    top: -7px !important;
    right: -11px !important;
    background: linear-gradient(135deg, #04BBFF 0%, #0088cc 100%) !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    min-width: 18px !important;
    height: 18px !important;
    border-radius: 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 2px 5px rgba(4, 187, 255, 0.4) !important;
    z-index: 5 !important;
    line-height: 1 !important;
    padding: 0 3px !important;
    box-sizing: border-box !important;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.header-icon-item:hover .cart-badge {
    transform: scale(1.15) !important;
}

/* Cart dropdown with 0.5s smooth fade & slide transition */
.cart-item .basket-contain,
.header-icon-item.basket .basket-contain {
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14), 0 0 1px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid #eef1f6 !important;
    width: 340px !important;
    padding: 18px !important;
    z-index: 1000 !important;
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(0.97) !important;
    transform-origin: top right !important;
    transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.5s, pointer-events 0.5s !important;
    box-sizing: border-box !important;
}

/* Wide invisible hover bridge padding on the wrapper so mouse hover is never broken */
.header-icon-item.cart-item::after,
.header-icon-item.basket::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -20px !important;
    right: -20px !important;
    bottom: -15px !important;
    background: transparent !important;
    z-index: 999 !important;
    pointer-events: auto !important;
}

.cart-item .basket-contain::before,
.header-icon-item.basket .basket-contain::before {
    content: '' !important;
    position: absolute !important;
    top: -20px !important;
    left: -20px !important;
    right: -20px !important;
    height: 20px !important;
    background: transparent !important;
    pointer-events: auto !important;
}

.cart-item:hover .basket-contain,
.cart-item:focus-within .basket-contain,
.header-icon-item.basket:hover .basket-contain,
.header-icon-item.basket:focus-within .basket-contain,
.basket-contain:hover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.cart-item .basket-contain .basket-products,
.header-icon-item.basket .basket-contain .basket-products {
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

.cart-item .basket-contain .basket-product-list {
    max-height: 270px;
    overflow-y: auto;
    margin: 0;
    padding: 0 4px 0 0;
    list-style: none;
}

/* Custom scrollbar for cart products list */
.cart-item .basket-contain .basket-product-list::-webkit-scrollbar {
    width: 5px;
}

.cart-item .basket-contain .basket-product-list::-webkit-scrollbar-track {
    background: #f1f3f7;
    border-radius: 3px;
}

.cart-item .basket-contain .basket-product-list::-webkit-scrollbar-thumb {
    background: #c5cbd5;
    border-radius: 3px;
}

.cart-item .basket-contain .basket-product-list::-webkit-scrollbar-thumb:hover {
    background: #9aa2b1;
}

.cart-item .basket-contain .basket-product-list li {
    display: grid !important;
    grid-template-columns: 52px 1fr auto !important;
    grid-template-rows: auto auto !important;
    column-gap: 12px !important;
    row-gap: 6px !important;
    align-items: center !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #f0f2f5 !important;
    position: relative !important;
    transition: background-color 0.2s ease !important;
}

.cart-item .basket-contain .basket-product-list li:last-child {
    border-bottom: none !important;
}

.cart-item .basket-contain .basket-product-list li img {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 8px !important;
    object-fit: cover !important;
    margin: 0 !important;
    visibility: visible !important;
    border: 1px solid #eef1f5 !important;
}

.cart-item .basket-contain .basket-product-list li .product-name {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    margin: 0 !important;
    width: 100% !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    align-self: center !important;
    transition: color 0.2s ease !important;
}

.cart-item .basket-contain .basket-product-list li .product-name:hover {
    color: #7b00ff !important;
}

.cart-item .basket-contain .basket-product-list li .product-name .product-variant {
    display: block !important;
    font-size: 11px !important;
    color: #6b7280 !important;
    font-weight: normal !important;
    margin-top: 2px !important;
}

.cart-item .basket-contain .basket-product-list li .product-info {
    grid-column: 3 !important;
    grid-row: 1 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    display: block !important;
    text-align: right !important;
    white-space: nowrap !important;
    padding: 0 !important;
}

.cart-item .basket-contain .basket-product-list li .product-info span {
    display: inline !important;
}

.cart-item .basket-contain .basket-product-list li .remove-product {
    grid-column: 3 !important;
    grid-row: 2 !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
    display: block !important;
    text-align: right !important;
    margin-top: 2px !important;
}

.cart-item .basket-contain .basket-product-list li .remove-product a {
    color: #ef4444 !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    transition: color 0.2s ease, opacity 0.2s ease !important;
}

.cart-item .basket-contain .basket-product-list li .remove-product a:hover {
    color: #dc2626 !important;
    text-decoration: underline !important;
}

.cart-item .basket-contain .basket-summery {
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid #eef1f6 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-direction: row-reverse !important;
    background: none !important;
}

.cart-item .basket-contain .basket-summery a {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    color: #ffffff !important;
    padding: 9px 24px !important;
    border-radius: 22px !important;
    font-size: 0 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    border: none !important;
    width: auto !important;
    height: auto !important;
    line-height: normal !important;
    box-shadow: 0 4px 14px rgba(123, 0, 255, 0.35) !important;
    cursor: pointer !important;
}

.cart-item .basket-contain .basket-summery a::after {
    content: 'Kasa' !important;
    font-size: 13px !important;
    display: inline-block !important;
    letter-spacing: 0.5px !important;
}

.cart-item .basket-contain .basket-summery a:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(123, 0, 255, 0.5) !important;
    filter: brightness(1.05) !important;
}

.cart-item .basket-contain .basket-summery .basket-price {
    text-align: left !important;
    float: none !important;
    width: auto !important;
    background: none !important;
    padding: 0 !important;
    border: none !important;
}

.cart-item .basket-contain .basket-summery .basket-price .price-total {
    font-size: 13px !important;
    color: #4b5563 !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
}

.cart-item .basket-contain .basket-summery .basket-price .price-total strong {
    font-size: 16px !important;
    color: #04BBFF !important;
    font-weight: 800 !important;
}


/* --- 2. NAVIGATION MENU CUSTOM STYLING --- */
.menu,
.menu.row {
    background: #000000 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18) !important;
    width: 100% !important;
    position: relative !important;
    z-index: 99 !important;
}

.menu::before,
.menu::after,
.innermenu::before,
.innermenu::after {
    display: none !important;
}

.innermenu,
.innermenu.row.container {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 56px !important;
    float: none !important;
    box-sizing: border-box !important;
    position: relative !important;
}

.menu-list {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    width: auto !important;
    float: none !important;
    border: none !important;
    overflow: visible !important;
}

.menu-list li.home-link-menu-li {
    display: none !important;
    /* Hide legacy home icon button */
}

.menu-list>li {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.menu-list>li>h3 {
    margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: normal !important;
}

.menu-list>li>h3>a {
    color: #f3f4f6 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    height: 100% !important;
    position: relative !important;
    padding: 0 16px !important;
    transition: color 0.3s ease, background-color 0.3s ease !important;
    border-radius: 6px !important;
}

.menu-list>li>h3>a span {
    position: relative !important;
    padding-bottom: 2px !important;
    transition: color 0.3s ease !important;
}

.menu-list>li>h3>a span::after {
    content: '' !important;
    position: absolute !important;
    bottom: -4px !important;
    left: 50% !important;
    width: 0 !important;
    height: 2.5px !important;
    background: linear-gradient(90deg, #7b00ff, #04BBFF) !important;
    border-radius: 2px !important;
    transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1), left 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.menu-list>li>h3>a:hover span::after,
.menu-list>li>h3>a.fx-active span::after,
.menu-list>li.current>h3>a span::after,
.menu-list>li.active-menu>h3>a span::after {
    width: 100% !important;
    left: 0 !important;
}

.menu-list>li>h3>a:hover,
.menu-list>li>h3>a.fx-active,
.menu-list>li.current>h3>a,
.menu-list>li.active-menu>h3>a {
    color: #04BBFF !important;
    text-decoration: none !important;
}

/* Category Submenu Styling with Smooth Transitions */
/* Reset wrapper div .submenu so it does not render background/border duplicate */
.menu-list>li .submenu,
.menu-list>li>div.submenu {
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 1000 !important;
    display: block !important;
    pointer-events: none !important;
}

/* Reset default Shopper legacy ::after/::before on parent:hover */
.innermenu .parent:hover::after,
.innermenu .parent.opened::after,
.menu-list>li.parent::after {
    display: none !important;
    content: none !important;
}

/* Style the actual category list ul.level1 */
.menu-list>li .submenu>ul,
.menu-list>li>div>ul,
.innermenu .parent:hover>div>ul,
.innermenu .parent.opened>div>ul {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    transform: translateY(12px) scale(0.96) !important;
    transform-origin: top center !important;
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid #eef1f6 !important;
    min-width: 220px !important;
    width: max-content !important;
    max-width: 320px !important;
    padding: 10px 0 !important;
    margin: 8px 0 0 0 !important;
    list-style: none !important;
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s !important;
}

/* Invisible bridge on the ul so mouse hover from menu link to submenu is seamless */
.menu-list>li .submenu>ul::before,
.menu-list>li>div>ul::before {
    content: '' !important;
    position: absolute !important;
    top: -16px !important;
    left: 0 !important;
    width: 100% !important;
    height: 16px !important;
    background: transparent !important;
    border: none !important;
    transform: none !important;
}

/* Open submenu on hover */
.menu-list>li.parent:hover>.submenu,
.menu-list>li:hover>.submenu,
.menu-list>li .submenu:hover {
    pointer-events: auto !important;
}

.menu-list>li.parent:hover>.submenu>ul,
.menu-list>li.parent:hover>div>ul,
.menu-list>li:hover>.submenu>ul,
.menu-list>li .submenu>ul:hover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.menu-list>li .submenu li {
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    position: relative !important;
}

.menu-list>li .submenu li h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    display: block !important;
}

.menu-list>li .submenu li h3 a,
.menu-list>li .submenu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 22px !important;
    color: #374151 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0.2px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    background: transparent !important;
    height: auto !important;
}

.menu-list>li .submenu li h3 a:hover,
.menu-list>li .submenu li a:hover {
    background: #f4f6fc !important;
    color: #7b00ff !important;
    padding-left: 22px !important;
}


/* --- 3. CUSTOM HERO BANNER --- */
.custom-hero-banner {
    background: radial-gradient(circle at 85% 50%, rgba(123, 0, 255, 0.28), transparent 45%),
        radial-gradient(circle at 65% 50%, rgba(4, 187, 255, 0.22), transparent 45%),
        #050c1e;
    position: relative;
    padding: 80px 0 120px 0;
    color: #ffffff;
    overflow: hidden;
}

.hero-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.hero-content {
    flex: 1;
    max-width: 600px;
    z-index: 5;
}

.hero-badge {
    background: linear-gradient(90deg, rgba(123, 0, 255, 0.15), rgba(4, 187, 255, 0.15));
    border: 1px solid rgba(4, 187, 255, 0.3);
    color: #04BBFF;
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.hero-title {
    font-size: 54px;
    line-height: 1.1;
    font-weight: 900;
    margin-bottom: 20px;
    color: #ffffff;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #ffffff 60%, #04BBFF);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-subtitle {
    font-size: 18px;
    line-height: 1.5;
    color: #a5b4fc;
    margin-bottom: 40px;
    font-weight: 400;
}

.hero-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(90deg, #7b00ff, #04BBFF);
    color: #ffffff !important;
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 16px 35px;
    border-radius: 30px;
    text-decoration: none !important;
    box-shadow: 0 4px 20px rgba(123, 0, 255, 0.4);
    transition: all 0.3s ease;
}

.hero-cta-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(123, 0, 255, 0.6);
    background: linear-gradient(90deg, #8c1aff, #1ad1ff);
}

.hero-cta-btn:hover .arrow-icon {
    transform: translateX(4px);
}

.hero-cta-btn .arrow-icon {
    width: 18px;
    height: 18px;
    transition: transform 0.2s ease;
}

.hero-features {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 50px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 30px;
}

.hero-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.hero-feature-item .feature-icon {
    color: #04BBFF;
    font-size: 20px;
}

.hero-feature-item .feature-text {
    display: flex;
    flex-direction: column;
}

.hero-feature-item .feature-text strong {
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hero-feature-item .feature-text span {
    font-size: 11px;
    color: #a5b4fc;
}

.hero-visual {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 450px;
    max-width: 500px;
}

.neon-ring {
    position: absolute;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    border: 3px solid rgba(4, 187, 255, 0.7);
    box-shadow: 0 0 25px rgba(4, 187, 255, 0.8),
        inset 0 0 25px rgba(4, 187, 255, 0.8),
        0 0 50px rgba(123, 0, 255, 0.5),
        inset 0 0 50px rgba(123, 0, 255, 0.5);
    animation: rotateRing 15s linear infinite;
    z-index: 1;
}

.neon-ring-glow {
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    border-radius: 50%;
    background: radial-gradient(circle, transparent 60%, rgba(123, 0, 255, 0.2));
}

@keyframes rotateRing {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* 3D Rubik's Cube representation */
.rubiks-cube-wrapper {
    position: absolute;
    perspective: 800px;
    z-index: 2;
}

@keyframes floatCube {
    0%, 100% { transform: rotateX(-25deg) rotateY(45deg) translateY(0); }
    50% { transform: rotateX(-25deg) rotateY(45deg) translateY(-15px); }
}

/* 3D JS Rubiks Cube */
.rubiks-cube {
    width: 150px;
    height: 150px;
    position: relative;
    z-index: 10;
    transform-style: preserve-3d;
    transform: rotateX(-25deg) rotateY(45deg);
    animation: floatCube 4s ease-in-out infinite;
}

#cube-shaker {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    transform-style: preserve-3d;
    transform-origin: 75px 75px 0;
}

.pivot {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    transform-style: preserve-3d;
    transform-origin: 50% 50% 0;
}

.cubie {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 50px;
    left: 50px;
    transform-style: preserve-3d;
    /* Transition removed to prevent scattering; rotation is handled by the pivot */
}

.cubie-face {
    position: absolute;
    width: 50px;
    height: 50px;
    margin: 0;
    background-color: #050505;
    border-radius: 6px;
    border: 3px solid #050505;
    box-sizing: border-box;
    backface-visibility: visible;
}

.cubie-face::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 2px;
    background-color: var(--sticker-bg, transparent);
    backface-visibility: hidden;
}

.cubie-face-U { transform: rotateX(90deg) translateZ(25px); }
.cubie-face-D { transform: rotateX(-90deg) translateZ(25px); }
.cubie-face-F { transform: translateZ(25px); }
.cubie-face-B { transform: rotateY(180deg) translateZ(25px); }
.cubie-face-R { transform: rotateY(90deg) translateZ(25px); }
.cubie-face-L { transform: rotateY(-90deg) translateZ(25px); }

.cube-shadow {
    position: absolute;
    bottom: -60px;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 30px;
    background: radial-gradient(ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 70%);
    z-index: 1;
}

/* Curved cutoff path at the bottom of hero banner */
.hero-wave {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 60px;
    overflow: hidden;
    line-height: 0;
    z-index: 4;
}

.hero-wave svg {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}


/* --- 4. CUSTOM USPs BAR --- */
.custom-usps-bar {
    background: #ffffff;
    padding: 30px 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    z-index: 6;
    margin-top: -30px;
}

.usps-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

@media (max-width: 980px) {
    .usps-container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
}

.usp-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 180px;
}

.usp-item .usp-icon {
    color: #7b00ff;
    font-size: 24px;
    background: #f5f0ff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.usp-item:hover .usp-icon {
    background: #7b00ff;
    color: #ffffff;
    transform: translateY(-3px);
}

.usp-item .usp-text {
    display: flex;
    flex-direction: column;
}

.usp-item .usp-text strong {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 2px;
}

.usp-item .usp-text span {
    font-size: 11px;
    color: #777777;
}


/* --- 5. PRODUCTS CARDS CUSTOM STYLE --- */
.main {
    background: #ffffff !important;
}

.box {
    margin-bottom: 50px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.boxhead,
.box .boxhead {
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 2px solid #f0f0f0;
    position: relative;
    width: 100%;
}

.boxhead span,
.boxhead h1,
.boxhead h2,
.boxhead .category-name {
    font-size: 24px;
    font-weight: 800;
    color: #1a1a1a;
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    display: inline-block;
}

.boxhead::after {
    display: none !important;
    /* Hide old background borders */
}

/* Home page module headers specific styling to look like mockup */
body.shop_index .boxhead,
.box-recommended-dark .boxhead {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

body.shop_index .boxhead span,
body.shop_index .boxhead h1,
body.shop_index .boxhead h2,
.box-recommended-dark .boxhead h1,
.box-recommended-dark .boxhead h2 {
    margin: 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Hide all "Zobacz wszystkie" pseudo-elements and buttons from boxes */
body.shop_index #box_bestsellers .boxhead::before,
body.shop_index #box_lastadded .boxhead::before,
body.shop_index #box_mainproducts .boxhead::before,
body.shop_index [id^="box_recommendations"] .boxhead::before,
[id^="box_recommendations"] .boxhead::before,
.box-recommended-dark .boxhead::before,
.boxhead .see-all-btn,
.boxhead .see-all-link {
    display: none !important;
    content: none !important;
}

/* Center column boxhead header adjustments on list pages */
body.shop_product_list .s-grid-9 .boxhead,
body.shop_product_list #center .boxhead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
}

body.shop_product_list .s-grid-9 .boxhead h1,
body.shop_product_list #center .boxhead h1 {
    margin: 0;
}

.products,
ol.productlist,
ul.productlist,
div.productlist,
.products.viewphot {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.slider .products,
.slider .productlist {
    display: block !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
}

/* Custom cards styling */
.product,
.productlist .product,
#box_mainproducts .products .product,
#box_lastadded .product {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.3s ease !important;
    width: calc(20% - 16px);
    /* 5 cards in row */
    min-width: 190px;
    position: relative;
    overflow: hidden;
    margin: 0;
    float: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Fix for slider items to prevent wrapping and breaking script calculations */
.slider .product {
    width: 100%;
    min-width: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    vertical-align: top !important;
    box-sizing: border-box !important;
}

.owl-item .product {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
}

/* Stylizacja strzałek dla wszystkich sliderów na stronie głównej */
.slider {
    position: relative !important;
}

.slider .innerbox {
    overflow: hidden !important;
    position: relative !important;
}

.slider .slider-wrap {
    white-space: nowrap !important;
    font-size: 0 !important;
    position: relative !important;
}

.slider .slider-nav-left,
.slider .slider-nav-right,
.box.slider .slider-nav-left,
.box.slider .slider-nav-right {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 44px !important;
    height: 44px !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 50% !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    z-index: 50 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important;
    opacity: 0.95 !important;
    visibility: visible !important;
}

.slider .slider-nav-left:hover,
.slider .slider-nav-right:hover,
.box.slider .slider-nav-left:hover,
.box.slider .slider-nav-right:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1) !important;
    box-shadow: 0 8px 24px rgba(4, 187, 255, 0.4) !important;
}

.slider .slider-nav-left,
.box.slider .slider-nav-left {
    left: -15px !important;
}

.slider .slider-nav-right,
.box.slider .slider-nav-right {
    right: -15px !important;
}

.slider .slider-nav-left::before,
.box.slider .slider-nav-left::before {
    content: '\f104' !important;
    font-family: FontAwesome !important;
    font-size: 20px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.slider .slider-nav-right::before,
.box.slider .slider-nav-right::before {
    content: '\f105' !important;
    font-family: FontAwesome !important;
    font-size: 20px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.slider .slider-nav-left:hover::before,
.slider .slider-nav-right:hover::before,
.box.slider .slider-nav-left:hover::before,
.box.slider .slider-nav-right:hover::before {
    color: #ffffff !important;
}

@media (max-width: 1200px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(25% - 15px) !important;
    }
}

@media (max-width: 980px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(33.33% - 14px) !important;
    }
}

@media (max-width: 768px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(50% - 10px) !important;
    }
}

@media (max-width: 480px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: 100% !important;
    }
}

.product:hover,
.productlist .product:hover,
#box_mainproducts .products .product:hover,
#box_lastadded .product:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
    border-color: #e1e4e8 !important;
    z-index: 10;
}

/* Center the image */
.product a {
    text-align: center;
    display: block;
    margin-bottom: 15px;
    text-decoration: none !important;
}

.product .boximgsize,
.product .prodimage {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 180px !important;
    margin: 0 auto 15px auto !important;
    width: 100% !important;
}

.product .boximgsize span,
.product .prodimage span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

.product .boximgsize img,
.product .prodimage img {
    max-height: 180px !important;
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
    object-fit: contain !important;
    transition: transform 0.3s ease;
}

.product:hover .boximgsize img,
.product:hover .prodimage img {
    transform: scale(1.05);
}

/* Product title styling */
.product .productnamewrap,
.product .productname,
.product .prodname {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin-bottom: 8px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    height: 36px !important;
    max-height: 36px !important;
    width: 100% !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    word-wrap: normal !important;
    text-decoration: none !important;
}

/* Price wrapper layout - wyśrodkowana cena */
.product .price {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-top: auto;
    padding: 6px 0 0 0 !important;
    border: none !important;
    border-top: none !important;
    width: 100% !important;
}

.product .price em {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
    /* Bold blue price */
    font-style: normal !important;
    text-align: center !important;
    display: block !important;
}

.product .price del {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    margin: 2px auto 0 auto !important;
    text-align: center !important;
}

/* Shopping basket button inside card on center under price */
.product .basket-box,
.product form.basket {
    margin: 10px auto 0 auto !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    position: static !important;
}

.product button.addtobasket,
.product input[type="submit"],
.product .addtobasket {
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: static !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.product button.addtobasket::before,
.product input[type="submit"]::before,
.product .addtobasket::before {
    content: '';
    background: url('../images/user/cart.svg') no-repeat center;
    background-size: 16px;
    width: 16px;
    height: 16px;
    display: block;
    filter: grayscale(1);
}

.product button.addtobasket span,
.product button.addtobasket img,
.product input[type="submit"] span,
.product input[type="submit"] img,
.product .addtobasket span,
.product .addtobasket img {
    display: none !important;
    /* Hide standard text and icon */
}

.product button.addtobasket:hover,
.product input[type="submit"]:hover,
.product .addtobasket:hover {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

.product button.addtobasket:hover::before,
.product input[type="submit"]:hover::before,
.product .addtobasket:hover::before {
    filter: brightness(0) invert(1);
}

/* Badges on product cards - disabled old pseudo-elements in favor of .custom-product-badges */
.product::after,
#box_lastadded .product::after,
#box_bestsellers .product::after,
.leftcol .product::after {
    display: none !important;
    content: none !important;
}


/* --- 6. "POLECANE PRODUKTY" DARK SECTION STYLE --- */
[id^="box_recommendations"],
.box-recommended-dark {
    background: radial-gradient(circle at 10% 20%, rgba(4, 187, 255, 0.08), transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(123, 0, 255, 0.08), transparent 40%),
        #050c1e !important;
    border-radius: 16px;
    padding: 40px 30px !important;
    margin: 60px 0 !important;
}

[id^="box_recommendations"] .boxhead,
.box-recommended-dark .boxhead {
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

[id^="box_recommendations"] .boxhead::before,
.box-recommended-dark .boxhead::before {
    color: #04BBFF !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

[id^="box_recommendations"] .boxhead:hover::before,
.box-recommended-dark .boxhead:hover::before {
    background: #04BBFF !important;
    color: #ffffff !important;
    border-color: #04BBFF !important;
}

[id^="box_recommendations"] .boxhead span,
[id^="box_recommendations"] .boxhead h1,
[id^="box_recommendations"] .boxhead h2,
.box-recommended-dark .boxhead span,
.box-recommended-dark .boxhead h1,
.box-recommended-dark .boxhead h2 {
    color: #ffffff !important;
}

[id^="box_recommendations"] .product,
.box-recommended-dark .product {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

[id^="box_recommendations"] .product:hover,
.box-recommended-dark .product:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(4, 187, 255, 0.3) !important;
}

[id^="box_recommendations"] .product .productname,
.box-recommended-dark .product .productname {
    color: #ffffff !important;
}

[id^="box_recommendations"] .product .price,
.box-recommended-dark .product .price {
    border-top-color: rgba(255, 255, 255, 0.05) !important;
}

[id^="box_recommendations"] .product .price em,
.box-recommended-dark .product .price em {
    color: #ffffff !important;
    /* White prices on dark background */
}

[id^="box_recommendations"] .product .basket-box button.addtobasket,
.box-recommended-dark .product .basket-box button.addtobasket {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[id^="box_recommendations"] .product .basket-box button.addtobasket::before,
.box-recommended-dark .product .basket-box button.addtobasket::before {
    filter: brightness(0) invert(1);
}

[id^="box_recommendations"] .product .basket-box button.addtobasket:hover,
.box-recommended-dark .product .basket-box button.addtobasket:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
}


/* --- 7. NEWSLETTER SECTION STYLING --- */
#box_newsletter,
.box#box_newsletter,
.custom-newsletter-box {
    background: radial-gradient(circle at 10% 20%, rgba(4, 187, 255, 0.12), transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(123, 0, 255, 0.15), transparent 40%),
        #0b0f24 !important;
    /* Deep stylish dark navy */
    border-radius: 18px !important;
    padding: 40px 45px !important;
    margin: 60px auto !important;
    max-width: 1160px !important;
    width: 100% !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
    box-sizing: border-box !important;
    position: relative !important;
}

#box_newsletter .boxhead,
.custom-newsletter-box .boxhead {
    display: none !important;
    /* Hide old newsletter header */
}

#box_newsletter .innerbox,
.custom-newsletter-box .innerbox {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 980px) {

    #box_newsletter .innerbox,
    .custom-newsletter-box .innerbox {
        flex-direction: column;
        text-align: center;
    }
}

#box_newsletter .boxintro,
.custom-newsletter-box .boxintro {
    flex: 1;
    min-width: 300px;
    font-size: 16px !important;
    color: #ffffff !important;
    font-weight: 500;
    margin: 0 !important;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 20px;
}

#box_newsletter .boxintro::before,
.custom-newsletter-box .boxintro::before {
    content: '\f0e0';
    /* Mail icon */
    font-family: FontAwesome;
    font-size: 36px;
    color: #04BBFF;
    background: none !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: inline-block;
    flex-shrink: 0;
}

@media (max-width: 980px) {

    #box_newsletter .boxintro,
    .custom-newsletter-box .boxintro {
        flex-direction: column;
        gap: 10px;
    }
}

#box_newsletter form,
.custom-newsletter-box form {
    flex: 1.2;
    max-width: 600px;
    width: 100%;
    margin: 0;
}

#box_newsletter .newsletter-input-container,
.custom-newsletter-box .newsletter-input-container {
    display: flex !important;
    align-items: center !important;
    background: rgba(255, 255, 255, 0.07) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 30px !important;
    padding: 6px 6px 6px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
}

#box_newsletter .newsletter-input-container:focus-within,
.custom-newsletter-box .newsletter-input-container:focus-within {
    border-color: #04BBFF !important;
    background: rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 0 15px rgba(4, 187, 255, 0.3) !important;
}

#box_newsletter .newsletter-input,
.custom-newsletter-box .newsletter-input {
    flex-grow: 1;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    color: #ffffff !important;
    font-size: 14px;
    padding: 10px 15px !important;
    width: 100%;
}

#box_newsletter .newsletter-input::placeholder,
.custom-newsletter-box .newsletter-input::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

#box_newsletter .btn-red,
#box_newsletter button[type="submit"],
.custom-newsletter-box .btn-red,
.custom-newsletter-box button[type="submit"] {
    background: linear-gradient(90deg, #7b00ff, #04BBFF) !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 30px !important;
    border-radius: 25px !important;
    cursor: pointer;
    transition: opacity 0.2s;
    height: auto !important;
    margin: 0 !important;
    box-shadow: 0 4px 15px rgba(123, 0, 255, 0.3) !important;
}

#box_newsletter .btn-red:hover,
#box_newsletter button[type="submit"]:hover,
.custom-newsletter-box .btn-red:hover,
.custom-newsletter-box button[type="submit"]:hover {
    opacity: 0.9;
}


/* --- 8. BOTTOM TRUST BAR --- */
.custom-trust-bar {
    background: #f8f9fa;
    padding: 35px 0;
    border-top: 1px solid #e1e4e8;
    border-bottom: 1px solid #e1e4e8;
}

.trust-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

@media (max-width: 980px) {
    .trust-container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
}

.trust-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 220px;
}

.trust-item .trust-icon {
    color: #4a5568;
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
}

.trust-item .trust-text {
    display: flex;
    flex-direction: column;
}

.trust-item .trust-text strong {
    font-size: 13px;
    font-weight: bold;
    color: #1a1a1a;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.trust-item .trust-text span {
    font-size: 11px;
    color: #718096;
}


/* --- 9. CUSTOM FOOTER DESIGN --- */
.footer-custom {
    background: #070913;
    /* Elegant deep black-blue footer background */
    color: #ffffff;
    padding: 60px 0 0 0;
    font-family: inherit;
    border-top: 3px solid #7b00ff;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px 40px 15px;
    flex-wrap: wrap;
}

.footer-col {
    flex: 1;
    min-width: 180px;
}

.brand-col {
    flex: 1.5;
    min-width: 250px;
}

.footer-logo {
    display: block;
    margin-bottom: 20px;
}

.footer-logo img {
    max-height: 40px;
    width: auto;
}

.brand-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #94a3b8;
    margin-bottom: 25px;
}

.social-icons {
    display: flex;
    gap: 12px;
}

.social-icon {
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff !important;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.2s ease;
    text-decoration: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.social-icon:hover {
    background: #7b00ff;
    color: #ffffff !important;
    transform: translateY(-3px);
    border-color: #7b00ff;
}

.footer-title {
    font-size: 14px;
    font-weight: bold;
    color: #ffffff;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 8px;
}

.footer-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 2px;
    background: #04BBFF;
}

.footer-links-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links-list li {
    margin-bottom: 12px;
}

.footer-links-list li a {
    color: #94a3b8 !important;
    font-size: 13px;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.footer-links-list li a:hover {
    color: #04BBFF !important;
    padding-left: 4px;
}

.footer-contact-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.footer-contact-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    font-size: 13px;
    color: #94a3b8;
}

.footer-contact-list li a {
    color: #94a3b8 !important;
    text-decoration: none !important;
    transition: color 0.2s;
}

.footer-contact-list li a:hover {
    color: #04BBFF !important;
}

.contact-icon {
    width: 16px;
    height: 16px;
    color: #04BBFF;
    flex-shrink: 0;
}

.footer-contact-btn {
    display: inline-block;
    background: #ffffff;
    color: #070913 !important;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 10px 25px;
    border-radius: 20px;
    text-decoration: none !important;
    transition: all 0.2s ease;
    border: 1px solid #ffffff;
    letter-spacing: 0.5px;
    text-align: center;
    width: 100%;
    max-width: 180px;
}

.footer-contact-btn:hover {
    background: transparent;
    color: #ffffff !important;
}

/* Footer Copyright Bottom Bar */
.footer-bottom {
    background: #04050a;
    padding: 25px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-bottom-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
    flex-wrap: wrap;
    gap: 15px;
}

@media (max-width: 768px) {
    .footer-bottom-container {
        flex-direction: column;
        text-align: center;
    }
}

.copyright {
    font-size: 12px;
    color: #64748b;
}

.footer-bottom-links {
    display: flex;
    gap: 20px;
}

.footer-bottom-links a {
    color: #64748b !important;
    font-size: 12px;
    text-decoration: none !important;
    transition: color 0.2s;
}

.footer-bottom-links a:hover {
    color: #ffffff !important;
}

/* Back to top button styling */
.up {
    position: fixed !important;
    bottom: 30px !important;
    left: 30px !important;
    right: auto !important;
    width: 46px !important;
    height: 46px !important;
    z-index: 9999 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.up a {
    background: #7b00ff !important;
    color: #ffffff !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(123, 0, 255, 0.4) !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

.up a::before {
    font-size: 18px !important;
    line-height: 1 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    width: auto !important;
}

.up a:hover {
    background: #04BBFF !important;
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 6px 18px rgba(4, 187, 255, 0.5) !important;
}

/* ----------------------------------------------------
   RESPONSIVE DESIGN CORRECTIONS
   ---------------------------------------------------- */
@media (max-width: 980px) {
    .header-container {
        flex-direction: column;
        gap: 15px;
    }

    .header-search {
        margin: 10px 0;
        width: 100%;
        max-width: 100%;
    }

    .menu-list {
        justify-content: center;
        height: auto;
        padding: 10px 0;
        flex-wrap: wrap;
        gap: 15px;
    }

    .hero-container {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }

    .hero-title {
        font-size: 38px;
    }

    .hero-features {
        justify-content: center;
    }
}

/* ==========================================================================
   ELEGANT & MODERN CATEGORY PAGE STYLING (PODSTRONA KATEGORII)
   ========================================================================== */

/* 1. Ścieżka nawigacyjna (Breadcrumbs) */
.breadcrumbs,
#breadcrumbs,
.breadcrumbs.large {
    background: #ffffff !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 12px 0 !important;
    margin-bottom: 25px !important;
}

.breadcrumbs .innerbreadcrumbs,
#breadcrumbs .innerbreadcrumbs {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.breadcrumbs .breadcrumb-home,
.breadcrumbs a,
.breadcrumbs .path a {
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: color 0.2s ease !important;
}

.breadcrumbs a:hover,
.breadcrumbs .path a:hover {
    color: #04BBFF !important;
}

.breadcrumbs .path {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.breadcrumbs .path li {
    display: inline-flex !important;
    align-items: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
}

.breadcrumbs .path li .raq {
    margin-right: 8px !important;
    color: #cbd5e1 !important;
    font-size: 14px !important;
}

.breadcrumbs .path li.last span,
.breadcrumbs .path li:last-child span {
    color: #0f172a !important;
    font-weight: 700 !important;
}

/* 2. Filtry górne ("Opcje przeglądania" / #box_filter / #box_productfilter) */
#box_filter,
#box_productfilter,
.category-filters,
.filter.category-filters {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 20px !important;
    padding: 24px 28px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: visible !important;
    z-index: 100 !important;
}

#box_filter .boxhead,
#box_productfilter .boxhead,
.category-filters .boxhead {
    border-bottom: 2px solid #f8fafc !important;
    margin-bottom: 20px !important;
    padding-bottom: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

#box_filter .boxhead span,
#box_productfilter .boxhead span,
.category-filters .boxhead span,
#box_filter .boxhead h3,
#box_productfilter .boxhead h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.4px !important;
    margin: 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

#box_filter .innerbox,
#box_productfilter .innerbox,
.category-filters .innerbox {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 101 !important;
}

/* Pola w opcjach przeglądania (1. Sortowanie, 2. Cena, 3. Producent) */
#box_filter .innerbox>.multiselect,
#box_filter .innerbox>.group,
#box_filter .innerbox>.group-filter,
#box_filter .innerbox>div {
    flex: 1 1 200px !important;
    min-width: 180px !important;
    max-width: 32% !important;
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: visible !important;
    z-index: 105 !important;
}

@media (max-width: 768px) {

    #box_filter .innerbox>.multiselect,
    #box_filter .innerbox>.group,
    #box_filter .innerbox>.group-filter,
    #box_filter .innerbox>div {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* Kolejność: 1. Sortowanie (Domyślne) [lewa], 2. Cena [środek], 3. Producent [prawa] */
#box_filter .innerbox>*,
#box_productfilter .innerbox>* {
    order: 10 !important;
}

#box_filter #filter_custom_sort,
#box_filter .group-sort-custom,
#box_productfilter #filter_custom_sort,
#box_productfilter .group-sort-custom {
    order: 1 !important;
}

#box_filter [id*="price"],
#box_filter [data-provider*="Price"],
#box_filter #filter_price,
#box_filter .pricegroup,
#box_productfilter .pricegroup,
#box_productfilter [id*="price"] {
    order: 2 !important;
}

#box_filter [id*="producer"],
#box_filter [id*="producers"],
#box_filter [data-provider*="Producer"],
#box_filter #filter_producer,
#box_filter .producergroup,
#box_productfilter .producergroup,
#box_productfilter [id*="producer"] {
    order: 3 !important;
}

/* Ukrycie filtrów Nowość i Promocje */
#box_filter [id*="news"],
#box_filter [id*="new"],
#box_filter [data-provider*="New"],
#box_filter [id*="novelties"],
#box_filter [id*="promo"],
#box_filter [id*="promotion"],
#box_filter [data-provider*="Promo"],
#box_filter .multiselect:has(span:contains("Nowość")),
#box_filter .multiselect:has(span:contains("Nowości")),
#box_filter .multiselect:has(span:contains("Promocj")) {
    display: none !important;
}

/* Pigułkowy styl nagłówków filtrów (.multiselect) */
#box_filter .multiselect {
    height: 48px !important;
    line-height: 46px !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 24px !important;
    padding: 0 38px 0 20px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    margin: 0 !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
}

#box_filter .multiselect>span {
    padding: 0 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    display: inline-block !important;
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#box_filter .multiselect:hover,
#box_filter .multiselect.selected {
    border-color: #04BBFF !important;
    background-color: #ffffff !important;
    color: #04BBFF !important;
    box-shadow: 0 4px 16px rgba(4, 187, 255, 0.18) !important;
    transform: translateY(-2px) !important;
}

#box_filter .multiselect:hover>span,
#box_filter .multiselect.selected>span {
    color: #04BBFF !important;
}

/* Rozwijana lista (dropdown) po kliknięciu na filtr */
#box_filter .multiselect ul {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    min-width: 250px !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14) !important;
    padding: 16px !important;
    z-index: 99999 !important;
    max-height: 320px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

#box_filter .multiselect ul li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 4px 0 !important;
    border-radius: 8px !important;
    line-height: normal !important;
    background: transparent !important;
}

#box_filter .multiselect ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 9px 12px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #334155 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

#box_filter .multiselect ul li a:hover,
#box_filter .multiselect ul li.selected a {
    background-color: rgba(4, 187, 255, 0.08) !important;
    color: #04BBFF !important;
}

/* Pola wprowadzania ceny (od - do) w dropdownie ceny - nowoczesny, czytelny układ */
#box_filter .multiselect ul li.priceinput,
.group-filter .multiselect ul li.priceinput,
li.priceinput {
    padding: 6px 4px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput br,
li.priceinput br {
    display: none !important;
}

/* Wiersz z etykietą i polem input */
#box_filter .multiselect ul li.priceinput .price-row,
#box_filter .multiselect ul li.priceinput .fromto-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
}

#box_filter .multiselect ul li.priceinput .fromto,
li.priceinput .fromto {
    display: inline-block !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    min-width: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput input[type="text"],
#box_filter .multiselect ul li.priceinput #filterprice1,
#box_filter .multiselect ul li.priceinput #filterprice2,
li.priceinput input[type="text"],
#filterprice1,
#filterprice2 {
    display: inline-block !important;
    width: calc(100% - 44px) !important;
    height: 38px !important;
    line-height: 38px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    box-sizing: border-box !important;
    outline: none !important;
    margin: 0 !important;
    float: right !important;
    transition: all 0.2s ease !important;
}

#box_filter .multiselect ul li.priceinput input[type="text"]:focus,
#box_filter .multiselect ul li.priceinput #filterprice1:focus,
#box_filter .multiselect ul li.priceinput #filterprice2:focus,
li.priceinput input:focus,
#filterprice1:focus,
#filterprice2:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

#box_filter .multiselect ul li.priceinput .bottombuttons,
li.priceinput .bottombuttons {
    width: 100% !important;
    margin-top: 6px !important;
    padding: 0 !important;
    clear: both !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput .btn,
#box_filter .multiselect ul li.priceinput button#filterprice {
    width: 100% !important;
    height: 38px !important;
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    box-shadow: 0 4px 12px rgba(123, 0, 255, 0.25) !important;
    transition: all 0.25s ease !important;
}

#box_filter .multiselect ul li.priceinput .btn:hover,
#box_filter .multiselect ul li.priceinput button#filterprice:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(123, 0, 255, 0.4) !important;
    filter: brightness(1.06) !important;
}

#box_filter .multiselect ul li.priceinput .btn .px1,
#box_filter .multiselect ul li.priceinput .btn img {
    display: none !important;
}

/* Stylizacja selecta sortowania (Domyślne) wewnątrz Opcji Przeglądania */
#box_filter #filter_custom_sort,
#box_productfilter #filter_custom_sort {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

#box_filter #filter_custom_sort:hover,
#box_productfilter #filter_custom_sort:hover {
    transform: translateY(-2px) !important;
}

#box_filter .sort-and-view,
#box_filter .sortlinks,
#box_filter .form-sort,
#box_productfilter .sort-and-view,
#box_productfilter .sortlinks,
#box_productfilter .form-sort,
#filter_custom_sort .sort-and-view,
#filter_custom_sort .sortlinks,
#filter_custom_sort .form-sort {
    margin: 0 !important;
    width: 100% !important;
    display: block !important;
}

#box_filter .gotourl,
#box_filter select.gotourl,
#box_productfilter .gotourl,
#box_productfilter select.gotourl,
#filter_custom_sort select,
#filter_custom_sort select.gotourl {
    display: block !important;
    width: 100% !important;
    height: 48px !important;
    background-color: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 24px !important;
    padding: 0 38px 0 20px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 14px !important;
    outline: none !important;
    box-sizing: border-box !important;
}

#box_filter .gotourl:hover,
#box_filter .gotourl:focus,
#box_productfilter .gotourl:hover,
#box_productfilter .gotourl:focus,
#filter_custom_sort select:hover,
#filter_custom_sort select:focus {
    background-color: #ffffff !important;
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    box-shadow: 0 4px 16px rgba(4, 187, 255, 0.18) !important;
}

/* Ukrycie oryginalnego kontenera sortowania pod nagłówkiem kategorii, ale NIE gdy jest w #filter_custom_sort */
.centercol .boxhead .sort-and-view:not(#filter_custom_sort .sort-and-view) {
    display: none !important;
}

/* 3. Pasek nagłówka kategorii i sortowanie (.categoryhead / .sort-and-mode) */
.centercol .boxhead,
.categoryhead,
body.shop_product_list .s-grid-9 .boxhead,
body.shop_product_list #center .boxhead,
#box_mainproducts .boxhead {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    position: relative !important;
    z-index: 1 !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
    padding-bottom: 14px !important;
    border-bottom: 2px solid #f1f5f9 !important;
}

.centercol .boxhead h1,
.categoryhead h1,
.category-name,
body.shop_product_list .s-grid-9 .boxhead h1,
body.shop_product_list #center .boxhead h1,
#box_mainproducts .boxhead h1,
#box_mainproducts .category-name {
    font-size: 26px !important;
    font-weight: 900 !important;
    color: #0f172a !important;
    letter-spacing: -0.6px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
}

/* Sortowanie po lewej stronie */
.sort-and-view,
.sort-and-mode,
.centercol .sort-and-mode,
.sortlinks {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 12px auto 0 0 !important;
    /* aligned to the left */
    position: relative !important;
    left: 0 !important;
    right: auto !important;
}

.sort-and-mode select,
.sortlinks select,
.form-sort select,
.sort-and-view select,
.gotourl {
    height: 42px !important;
    background-color: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 22px !important;
    padding: 0 36px 0 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px !important;
}

.sort-and-mode select:hover,
.sort-and-mode select:focus,
.sortlinks select:hover,
.sortlinks select:focus,
.form-sort select:hover,
.gotourl:hover,
.gotourl:focus {
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    outline: none !important;
    box-shadow: 0 3px 12px rgba(4, 187, 255, 0.15) !important;
    transform: translateY(-1px) !important;
}

/* 4. Główna siatka produktów w kategorii (Center column) */
.centercol .products.viewphot,
.centercol .products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)) !important;
    gap: 24px !important;
    margin: 20px 0 40px 0 !important;
    width: 100% !important;
}

/* Pojedyncza nowoczesna karta produktu */
.centercol .products.viewphot .product,
.centercol .products .product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border: 1px solid #eaebf0 !important;
    border-radius: 18px !important;
    padding: 18px !important;
    box-sizing: border-box !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: relative !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    min-height: 380px !important;
}

.centercol .products.viewphot .product:hover,
.centercol .products .product:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 36px rgba(4, 187, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    border-color: #04BBFF !important;
}

/* Zdjęcie produktu */
.centercol .products.viewphot .product .prodimage,
.centercol .products .product .boximgsize {
    width: 100% !important;
    height: 190px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 14px !important;
    overflow: hidden !important;
    position: relative !important;
}

.centercol .products.viewphot .product .prodimage img,
.centercol .products .product .boximgsize img {
    max-width: 100% !important;
    max-height: 180px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.centercol .products.viewphot .product:hover .prodimage img,
.centercol .products .product:hover .boximgsize img {
    transform: scale(1.08) !important;
}

/* Tytuł produktu - kontener i tekst */
.centercol .products.viewphot .product .productnamewrap,
.centercol .products .product .productnamewrap {
    display: block !important;
    width: 100% !important;
    min-height: 38px !important;
    height: 42px !important;
    max-height: 44px !important;
    margin-bottom: 10px !important;
    overflow: hidden !important;
    text-align: center !important;
}

.centercol .products.viewphot .product .productname,
.centercol .products .product .productname,
.centercol .products .product .prodname {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    height: auto !important;
    max-height: 38px !important;
    width: 100% !important;
    text-align: center !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: color 0.2s ease !important;
}

.centercol .products.viewphot .product:hover .productname,
.centercol .products .product:hover .productname {
    color: #04BBFF !important;
}

/* Dolna linia ceny i koszyka */
.centercol .products.viewphot .product .price,
.centercol .products .product .price {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: auto !important;
    padding-top: 6px !important;
    border: none !important;
    border-top: none !important;
    width: 100% !important;
}

.centercol .products.viewphot .product .price em,
.centercol .products .product .price em {
    font-size: 19px !important;
    font-weight: 900 !important;
    color: #04BBFF !important;
    font-style: normal !important;
    letter-spacing: -0.3px !important;
}

.centercol .products.viewphot .product .price del,
.centercol .products .product .price del {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    margin-left: 6px !important;
}

/* Przycisk koszyka na karcie */
.centercol .products.viewphot .product .addtobasket,
.centercol .products .product .addtobasket,
.centercol .products.viewphot .product button.addtobasket {
    position: static !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.centercol .products.viewphot .product .addtobasket:hover,
.centercol .products .product .addtobasket:hover {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

/* 5. Lewy sidebar (.leftcol / aside) */
.leftcol,
.leftcol.s-grid-3 {
    box-sizing: border-box !important;
}

/* Każdy boks w sidebarze jako nowoczesna biała karta */
.leftcol .box {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 18px 20px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
}

.leftcol .box .boxhead,
.leftcol .boxhead {
    font-size: 14px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #0f172a !important;
    margin: 0 0 14px 0 !important;
    padding: 0 0 10px 0 !important;
    border-bottom: 2px solid #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    line-height: 1.2 !important;
    position: static !important;
}

.leftcol .box .boxhead span,
.leftcol .boxhead span,
.leftcol .box .boxhead h3,
.leftcol .boxhead h3 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1.2 !important;
    display: inline !important;
}

/* Kill old LESS-compiled pseudo-element decorations on leftcol boxhead (e.g. purple/maincolor bars) */
.leftcol .box .boxhead::before,
.leftcol .boxhead::before,
.leftcol .box .boxhead::after,
.leftcol .boxhead::after {
    display: none !important;
    content: none !important;
    background: none !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* Extra specificity for the slider boxes to guarantee old skin styles are overridden */
#box_lastadded .boxhead,
#box_recent .boxhead,
#box_bestsellers .leftcol .boxhead {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 2px solid #f1f5f9 !important;
    box-shadow: none !important;
    color: #0f172a !important;
    padding: 0 0 10px 0 !important;
    margin: 0 0 14px 0 !important;
    position: static !important;
}

#box_lastadded .boxhead::before,
#box_lastadded .boxhead::after,
#box_recent .boxhead::before,
#box_recent .boxhead::after {
    display: none !important;
    content: none !important;
}

/* Drzewo kategorii w lewym sidebarze (#box_menu) */
.leftcol #box_menu .innerbox,
.leftcol #box_menu ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.leftcol #box_menu li {
    list-style: none !important;
    margin-bottom: 3px !important;
    padding: 0 !important;
    border: none !important;
}

.leftcol #box_menu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 9px 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
}

.leftcol #box_menu li a:hover {
    background-color: #f1f5f9 !important;
    color: #04BBFF !important;
    padding-left: 16px !important;
}

/* Aktywna kategoria */
.leftcol #box_menu li.current>a,
.leftcol #box_menu li.active>a {
    background: linear-gradient(90deg, rgba(4, 187, 255, 0.12), rgba(123, 0, 255, 0.04)) !important;
    color: #0284c7 !important;
    font-weight: 800 !important;
    border-left: 3px solid #04BBFF !important;
    border-radius: 0 10px 10px 0 !important;
}

/* Podkategorie (2x2x2, 3x3x3, 4x4x4...) */
.leftcol #box_menu li.has-submenu>a {
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
}

.leftcol #box_menu li .toggle-submenu {
    font-size: 12px !important;
    color: #64748b !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease !important;
    margin-left: 8px !important;
    padding: 4px 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.leftcol #box_menu li.expanded>a .toggle-submenu,
.leftcol #box_menu li.expanded>.toggle-submenu {
    transform: rotate(180deg) !important;
    color: #04BBFF !important;
}

.leftcol #box_menu li ul {
    padding-left: 12px !important;
    margin: 4px 0 6px 8px !important;
    border-left: 2px solid #e2e8f0 !important;
    transition: all 0.3s ease !important;
}

.leftcol #box_menu li ul li a {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    padding: 6px 10px !important;
}

.leftcol #box_menu li ul li a:hover {
    color: #04BBFF !important;
    background: #f8fafc !important;
}

/* Moduły produktowe i slidery w lewym sidebarze (Nowości, Bestsellery, Zestawy) */
.leftcol .products,
.leftcol .products.viewphot,
.leftcol .productlist,
.leftcol .slider-wrapper {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    height: auto !important;
}

.leftcol .box.slider {
    position: relative !important;
    overflow: visible !important;
}

.leftcol .box.slider .innerbox {
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
}

.leftcol .box.slider .slider-wrap {
    display: block !important;
    position: relative !important;
    white-space: nowrap !important;
    font-size: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: height 0.3s ease, left 0.4s ease;
    /* Let JS control width — do not override */
}

.leftcol .product,
.leftcol .products .product,
.leftcol .products.viewphot .product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-align: center !important;
    padding: 16px 12px !important;
    margin: 0 0 14px 0 !important;
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    min-height: unset !important;
    height: auto !important;
    position: relative !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.25s ease !important;
}


.leftcol .slider .product,
.leftcol .box.slider .product {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: space-between !important;
    vertical-align: top !important;
    white-space: normal !important;
    font-size: 14px !important;
    margin: 0 !important;
    padding: 16px 12px !important;
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    min-height: unset !important;
    position: relative !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
    /* JS slider engine will set exact pixel width via style.setProperty with !important */
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
}


.leftcol .product:hover {
    background: #ffffff !important;
    border-color: #04BBFF !important;
    box-shadow: 0 6px 18px rgba(4, 187, 255, 0.12) !important;
    transform: translateY(-2px) !important;
}

.leftcol .product .boximgsize,
.leftcol .product .prodimage {
    width: 100% !important;
    height: 140px !important;
    min-height: 140px !important;
    max-height: 140px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 10px auto !important;
    position: relative !important;
    overflow: hidden !important;
}

.leftcol .product .boximgsize img,
.leftcol .product .prodimage img {
    max-height: 130px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
}

.leftcol .product>a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

.leftcol .product .productnamewrap {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 2px !important;
    margin-bottom: 6px !important;
    height: 34px !important;
    max-height: 34px !important;
    overflow: hidden !important;
}

.leftcol .product .productname,
.leftcol .product .prodname {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    height: 34px !important;
    max-height: 34px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: center !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    white-space: normal !important;
}

.leftcol .product .price {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
    margin-bottom: 6px !important;
    display: block !important;
    text-align: center !important;
    border: none !important;
    padding: 0 !important;
}

.leftcol .product .price em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
}

.leftcol .product .addtobasket,
.leftcol .product button.addtobasket {
    position: static !important;
    width: 32px !important;
    height: 32px !important;
    margin: 6px auto 0 auto !important;
}

/* Strzałki nawigacji slidera w sidebarze */
.leftcol .slider .slider-nav-left,
.leftcol .slider .slider-nav-right,
.leftcol .box.slider .slider-nav-left,
.leftcol .box.slider .slider-nav-right {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 32px !important;
    height: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
    margin: 0 !important;
    opacity: 0.9;
}

.leftcol .slider .slider-nav-left:hover,
.leftcol .slider .slider-nav-right:hover,
.leftcol .box.slider .slider-nav-left:hover,
.leftcol .box.slider .slider-nav-right:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
    color: #ffffff !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1) !important;
}

.leftcol .slider .slider-nav-left,
.leftcol .box.slider .slider-nav-left {
    left: 6px !important;
}

.leftcol .slider .slider-nav-right,
.leftcol .box.slider .slider-nav-right {
    right: 6px !important;
}

.leftcol .slider .slider-nav-left::before,
.leftcol .box.slider .slider-nav-left::before {
    content: '\f104' !important;
    font-family: FontAwesome !important;
    font-size: 16px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.leftcol .slider .slider-nav-right::before,
.leftcol .box.slider .slider-nav-right::before {
    content: '\f105' !important;
    font-family: FontAwesome !important;
    font-size: 16px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.leftcol .slider .slider-nav-left:hover::before,
.leftcol .slider .slider-nav-right:hover::before,
.leftcol .box.slider .slider-nav-left:hover::before,
.leftcol .box.slider .slider-nav-right:hover::before {
    color: #ffffff !important;
}

/* Paczkomaty w sidebarze */
.leftcol #box_paczkomaty img,
.leftcol .box_paczkomaty img {
    border-radius: 12px !important;
    max-width: 100% !important;
    display: block !important;
    margin: 0 auto !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

/* Wyszukiwarka w sidebarze */
.leftcol #box_search input[type="text"],
.leftcol .box_search input[type="text"] {
    width: 100% !important;
    height: 40px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 38px 0 14px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}

.leftcol #box_search .btn,
.leftcol .box_search .btn {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
    cursor: pointer !important;
}

/* Logowanie w sidebarze */
.leftcol #box_loginsmall input[type="text"],
.leftcol #box_loginsmall input[type="email"],
.leftcol #box_loginsmall input[type="password"] {
    width: 100% !important;
    height: 38px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    margin-bottom: 10px !important;
    box-sizing: border-box !important;
}

.leftcol #box_loginsmall .btn.login,
.leftcol #box_loginsmall button[type="submit"] {
    width: 100% !important;
    height: 40px !important;
    background: linear-gradient(135deg, #7b00ff, #04BBFF) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    border-radius: 10px !important;
    border: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s ease !important;
    margin-top: 4px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 4px 12px rgba(123, 0, 255, 0.25) !important;
}

.leftcol #box_loginsmall .btn.login:hover,
.leftcol #box_loginsmall button[type="submit"]:hover {
    opacity: 0.9 !important;
}

.leftcol #box_loginsmall a {
    font-size: 12px !important;
    color: #64748b !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 4px !important;
}

.leftcol #box_loginsmall a:hover {
    color: #04BBFF !important;
}

/* 6. Paginacja (.paginator) - idealnie okrągłe przyciski bez kresek */
.paginator,
.pagination,
.floatcenterwrap .paginator {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 45px auto 25px auto !important;
    padding: 0 !important;
    list-style: none !important;
}

.paginator li,
.pagination li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Ukrycie separatorów i kresek pionowych w paginacji */
.paginator .sep,
.pagination .sep,
.paginator .stick,
.pagination .stick,
.paginator li.stick,
.paginator li:has(.stick),
.paginator li:empty,
.pagination li:empty {
    display: none !important;
    content: none !important;
}

.paginator li::before,
.paginator li::after,
.pagination li::before,
.pagination li::after {
    display: none !important;
    content: none !important;
}

.paginator a,
.paginator span,
.pagination a,
.pagination span,
.paginator .selected,
.paginator li a,
.paginator li span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding: 0 !important;
    margin: 0 3px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    color: #334155 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03) !important;
    box-sizing: border-box !important;
    line-height: normal !important;
}

.paginator a:hover,
.pagination a:hover,
.paginator li a:hover {
    background: #f8fafc !important;
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.2) !important;
}

.paginator .selected span,
.paginator .selected,
.paginator .active a,
.pagination .active a,
.pagination .selected,
.paginator li.selected span,
.paginator li.selected a {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

/* ==========================================================================
   MODAL / POPUP DODANIA DO KOSZYKA NA ŚRODKU EKRANU
   ========================================================================== */
.modal,
.modal.modal-visible,
#box_productdeliveries.modal,
.modal.modal-shipping {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: 92% !important;
    max-width: 780px !important;
    min-width: 320px !important;
    min-height: auto !important;
    height: auto !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35), 0 0 1px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid #eef1f6 !important;
    padding: 32px 36px !important;
    z-index: 100005 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}

.modal.modal-not-visible,
.modal.none,
.modal.modal-hidden {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Nagłówek modala */
.modal-header,
.modal .modal-header {
    background: transparent !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 2px solid #f1f5f9 !important;
    margin-bottom: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    color: #0f172a !important;
    width: 100% !important;
    flex-shrink: 0 !important;
}

.modal-header h3,
.modal .modal-header h3,
.modal .modal-header>* {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.modal .modal-header .modal-close,
.modal-header .modal-close,
.modal-close {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    border: 1.5px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: transparent !important;
    font-size: 0 !important;
    transition: all 0.2s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-basis: auto !important;
    position: relative !important;
    box-sizing: border-box !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
}

.modal .modal-header .modal-close::before,
.modal-header .modal-close::before,
.modal-close::before,
.modal .modal-header .modal-close::after,
.modal-header .modal-close::after,
.modal-close::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 14px !important;
    height: 2px !important;
    background-color: #64748b !important;
    border-radius: 2px !important;
    text-indent: 0 !important;
    display: block !important;
    transition: background-color 0.2s ease !important;
}

.modal .modal-header .modal-close::before,
.modal-header .modal-close::before,
.modal-close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.modal .modal-header .modal-close::after,
.modal-header .modal-close::after,
.modal-close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

.modal-close:hover {
    background: #e2e8f0 !important;
    transform: scale(1.08) !important;
}

.modal-close:hover::before,
.modal-close:hover::after {
    background-color: #0f172a !important;
}

/* Ciało modala */
.modal-body,
.modal .modal-body {
    padding: 0 !important;
    margin: 0 0 24px 0 !important;
    width: 100% !important;
    overflow: visible !important;
    display: block !important;
}

/* Kontener produktu i podsumowania koszyka */
.ajax-basket-container,
.modal .ajax-basket-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    align-items: stretch !important;
    width: 100% !important;
    position: static !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (max-width: 680px) {

    .ajax-basket-container,
    .modal .ajax-basket-container {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
}

/* Blok dodanego produktu */
.modal .ajax-basket-container .ajax-product-block {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 18px !important;
    background: #f8fafc !important;
    border-radius: 18px !important;
    padding: 18px !important;
    border: 1.5px solid #eef1f6 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block img {
    max-height: 120px !important;
    min-height: 80px !important;
    max-width: 110px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    padding: 6px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    border: 1px solid #f1f5f9 !important;
    flex-shrink: 0 !important;
    float: none !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-grow: 1 !important;
    text-align: left !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info h3 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin: 0 !important;
    line-height: 1.35 !important;
    max-width: 100% !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info span {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info span strong {
    color: #04BBFF !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    margin-left: 4px !important;
}

/* Blok stanu koszyka (ilość + wartość) */
.ajax-cart-block,
.modal .ajax-basket-container .ajax-cart-block {
    position: static !important;
    background: #f8fafc !important;
    border-radius: 18px !important;
    padding: 22px 24px !important;
    border: 1.5px solid #eef1f6 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 0 !important;
    transform: none !important;
    box-shadow: none !important;
    min-height: auto !important;
    max-height: none !important;
}

.modal .ajax-basket-container .ajax-cart-block span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 14.5px !important;
    color: #475569 !important;
    font-weight: 600 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    border-bottom: 1px dashed #e2e8f0 !important;
    padding-bottom: 8px !important;
}

.modal .ajax-basket-container .ajax-cart-block span:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.modal .ajax-basket-container .ajax-cart-block span strong {
    font-size: 18px !important;
    color: #04BBFF !important;
    font-weight: 900 !important;
    margin-left: 8px !important;
}

/* Stopka modala z przyciskami */
.modal-footer,
.modal .modal-footer {
    padding: 20px 0 0 0 !important;
    margin: 0 !important;
    border-top: 2px solid #f1f5f9 !important;
    display: flex !important;
    width: 100% !important;
    flex-shrink: 0 !important;
}

.modal-footer .ajax-product-block,
.modal .modal-footer .ajax-product-block {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 16px !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 600px) {

    .modal-footer .ajax-product-block,
    .modal .modal-footer .ajax-product-block,
    .modal-footer,
    .modal .modal-footer {
        flex-direction: column-reverse !important;
        gap: 12px !important;
    }
}

/* Przycisk Kontynuuj zakupy w modalu */
.modal .btn,
.modal a.continue,
.modal button.continue,
.modal .modal-close-btn,
.modal-footer .ajax-product-block a.btn:not(.btn-red),
.modal .modal-footer .btn:not(.btn-red) {
    background: #f1f5f9 !important;
    border: 1.5px solid #e2e8f0 !important;
    color: #475569 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 13px 28px !important;
    border-radius: 30px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 !important;
    width: auto !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    margin: 0 !important;
}

.modal .btn:hover,
.modal a.continue:hover,
.modal-footer .ajax-product-block a.btn:not(.btn-red):hover,
.modal .modal-footer .btn:not(.btn-red):hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
}

/* Przycisk Przejdź do koszyka / Do kasy w modalu */
.modal .btn-red,
.modal .btn.btn-red,
.modal a[href*="basket"],
.modal button.forward,
.modal .btn.forward,
.modal-footer .ajax-product-block a.btn.btn-red,
.modal .modal-footer .btn.btn-red {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    padding: 14px 32px !important;
    border-radius: 30px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(123, 0, 255, 0.35) !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1.2 !important;
    width: auto !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    margin: 0 !important;
}

.modal .btn-red:hover,
.modal a[href*="basket"]:hover,
.modal button.forward:hover,
.modal-footer .ajax-product-block a.btn.btn-red:hover,
.modal .modal-footer .btn.btn-red:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(123, 0, 255, 0.55) !important;
    filter: brightness(1.08) !important;
    color: #ffffff !important;
}

/* Przyciemniający overlay tła */
.mask,
.modal-overlay {
    background: rgba(5, 12, 30, 0.65) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    z-index: 10000 !important;
}

/* Responsywność strony kategorii */
@media (max-width: 980px) {

    .centercol .products.viewphot,
    .centercol .products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
}

@media (max-width: 600px) {

    .centercol .products.viewphot,
    .centercol .products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .centercol .products.viewphot .product,
    .centercol .products .product {
        padding: 12px !important;
        min-height: 310px !important;
    }

    .centercol .products.viewphot .product .prodimage,
    .centercol .products .product .boximgsize {
        height: 135px !important;
    }

    .centercol .products.viewphot .product .price em,
    .centercol .products .product .price em {
        font-size: 16px !important;
    }
}

/* Product cards: two-line names with ellipsis and no lowest-price label. */
.product .productnamewrap {
    display: block !important;
    width: 100% !important;
    min-height: 36px !important;
    height: 42px !important;
    max-height: 44px !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
    text-align: center !important;
}

.product .productname,
.product .prodname {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    height: auto !important;
    max-height: 38px !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.product .price__omnibus,
.product .js__omnibus-price-container {
    display: none !important;
}

/* Product labels, promotion prices and looping slider cards. */
.custom-product-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 4 !important;
    pointer-events: none !important;
}

.custom-product-badge {
    display: inline-block !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

.custom-product-badge--promo {
    background: #e53935 !important;
}

.custom-product-badge--new {
    background: #22a447 !important;
}

.custom-product-badge--bestseller {
    background: #f59e0b !important;
}

.product.custom-promo-product .main-price,
.product.custom-promo-product .price em.color,
.product-main-box .main-price.color {
    color: #e53935 !important;
}

.product.custom-promo-product .price__regular del,
.product-main-box .price__regular del {
    color: #64748b !important;
    text-decoration: line-through !important;
}

/* The slider always has a visible next step when it contains multiple cards. */
.box.slider .slider-nav-left,
.box.slider .slider-nav-right {
    visibility: visible !important;
}

/* Promotion prices in category cards. */
.centercol .products .product.custom-promo-product .price .promo-price,
.centercol .products .product.custom-promo-product .price em.promo-price {
    display: inline-block !important;
    width: auto !important;
    margin: 0 8px 0 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
    order: 2 !important;
}

.centercol .products .product.custom-promo-product .price .promo-old-price,
.centercol .products .product.custom-promo-product .price del.promo-old-price {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: middle !important;
    order: 1 !important;
}

/* Keep the promotional pair together inside the price row. */
.centercol .products .product.custom-promo-product .price .promo-price-row {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.centercol .products .product.custom-promo-product .price>div:first-child {
    white-space: nowrap !important;
}

@media (max-width: 480px) {

    .centercol .products .product.custom-promo-product .price .promo-price,
    .centercol .products .product.custom-promo-product .price em.promo-price {
        font-size: 16px !important;
        margin-right: 5px !important;
    }

    .centercol .products .product.custom-promo-product .price .promo-old-price,
    .centercol .products .product.custom-promo-product .price del.promo-old-price {
        font-size: 11px !important;
    }
}

/* Promotional prices in homepage boxes and sliders. */
.product.custom-promo-product .price_extended {
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.product.custom-promo-product .price_extended>p {
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    border: 0 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) em.color,
.product.custom-promo-product .price_extended>p:not(.price__regular) em.main-price,
.product.custom-promo-product .price_extended>p:not(.price__regular) em {
    display: inline-block !important;
    width: auto !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: baseline !important;
}

.product.custom-promo-product .price_extended>p.price__regular {
    display: inline-block !important;
    width: auto !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    order: 1 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) {
    order: 2 !important;
}

.product.custom-promo-product .price_extended>p.price__regular del,
.product.custom-promo-product .price_extended>p.price__regular .price__inactive {
    display: inline-block !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

@media (max-width: 480px) {

    .product.custom-promo-product .price_extended>p:not(.price__regular) em.color,
    .product.custom-promo-product .price_extended>p:not(.price__regular) em.main-price,
    .product.custom-promo-product .price_extended>p:not(.price__regular) em {
        font-size: 16px !important;
    }

    .product.custom-promo-product .price_extended>p.price__regular del,
    .product.custom-promo-product .price_extended>p.price__regular .price__inactive {
        font-size: 11px !important;
    }
}

/* Direct old price markup used by promotional homepage cards. */
.product.custom-promo-product .price_extended>.promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) {
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) em.color {
    color: #e53935 !important;
}

/* Promotional price pair in category product cards. */
.products .product.custom-promo-product .price>div:first-child {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

.products .product.custom-promo-product .promo-price {
    display: inline-block !important;
    order: 2 !important;
    width: auto !important;
    margin: 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

@media (max-width: 480px) {
    .products .product.custom-promo-product .promo-price {
        font-size: 16px !important;
    }

    .products .product.custom-promo-product .promo-old-price {
        font-size: 11px !important;
    }
}

/* Final category-card promotion price layout. */
.products .product.custom-promo-product .price .promo-price-row {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .price>div:first-child {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .price .promo-old-price,
.products .product.custom-promo-product .price>div:first-child .promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

.products .product.custom-promo-product .price .promo-price,
.products .product.custom-promo-product .price>div:first-child .promo-price {
    display: inline-block !important;
    order: 2 !important;
    width: auto !important;
    margin: 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: baseline !important;
}

@media (max-width: 480px) {

    .products .product.custom-promo-product .price .promo-old-price,
    .products .product.custom-promo-product .price>div:first-child .promo-old-price {
        font-size: 11px !important;
    }

    .products .product.custom-promo-product .price .promo-price,
    .products .product.custom-promo-product .price>div:first-child .promo-price {
        font-size: 16px !important;
    }
}

/* Final fix: direct old price in promotional slider cards. */
.box:not(#box_productfull) .product.custom-promo-product .price.price_extended {
    display: flex !important;
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p>em.color {
    display: inline-block !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>.promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p {
    order: 2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.hide {
    display: none !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide) {
    display: contents !important;
    order: 2 !important;
}

/* Netto variant: price and old price are wrapped in .price-netto. */
.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide) {
    display: contents !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>p {
    display: block !important;
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>p>em {
    display: inline-block !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>.promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

/* Final visible old price for promotional cards. */
.products .product.custom-promo-product .promo-old-price,
.box:not(#box_productfull) .product.custom-promo-product .promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    margin: 0 8px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .promo-price,
.box:not(#box_productfull) .product.custom-promo-product .price_extended>p>em.color {
    color: #e53935 !important;
}

/* Category badges for Magnetic and Maglev products. */
.custom-product-badge--magnetic,
.custom-category-tag--magnetic {
    background: #0840d3 !important;
}

.custom-product-badge--maglev,
.custom-category-tag--maglev {
    background: #7c3aed !important;
}

.custom-product-badge--smart,
.custom-category-tag--smart {
    background: #f08aa8 !important;
    color: #ffffff !important;
}

.product-detail-tags .custom-category-tag,
.productimg .mainimg .custom-category-tag {
    display: inline-block !important;
    padding: 4px 8px !important;
    margin: 0 5px 5px 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

/* Final green color for both New badge markup variants. */
.custom-product-badge--new,
.tags li.new {
    background: #22a447 !important;
    background-color: #22a447 !important;
}

/* ==========================================================================
   NOWA STRONA PRODUKTU (PRODUCT PAGE REDESIGN) - KOSTKOLAND
   ========================================================================== */

/* 1. Główny kontener karty produktu */
body.shop_product #box_productfull,
#box_productfull {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 20px !important;
    padding: 32px !important;
    margin-bottom: 35px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

#box_productfull .boxhead,
#box_productfull>.custom-product-badges {
    display: none !important;
    /* Ukryj zewnętrzny duplikat tagów oraz stary pusty boxhead */
}

#box_productfull .innerbox {
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

#box_productfull .maininfo {
    margin: 0 !important;
    padding: 0 !important;
}

/* Wyłączenie clearfixów które w flexboxie stają się osobnymi flex itemami i psują układ 2-kolumnowy */
#box_productfull .maininfo>.f-row::before,
#box_productfull .maininfo>.f-row::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
}

#box_productfull .maininfo>.f-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 40px !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productfull .maininfo>.f-row>[class*='grid'] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
}

/* 2. Lewa kolumna: Galeria produktu */
#box_productfull .productimg,
#box_productfull .productimg.f-grid-6 {
    flex: 0 0 calc(50% - 20px) !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    box-sizing: border-box !important;
}

#box_productfull .productimg .mainimg {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 18px !important;
    padding: 20px !important;
    min-height: 380px !important;
    height: 400px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.02) !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    line-height: normal !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

#box_productfull .productimg .mainimg a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

#box_productfull .productimg .mainimg img {
    max-height: 350px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: block !important;
    margin: 0 auto !important;
}

#box_productfull .productimg .mainimg:hover img {
    transform: scale(1.05) !important;
}

/* Badge tags w lewym górnym rogu zdjęcia */
#box_productfull .productimg .tags,
#box_productfull .productimg .mainimg .custom-product-badges {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 10 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    pointer-events: none !important;
}

#box_productfull .productimg .tags li,
#box_productfull .productimg .custom-product-badge {
    border-radius: 20px !important;
    padding: 5px 12px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1.2 !important;
}

#box_productfull .productimg .tags li.promo,
#box_productfull .productimg .custom-product-badge--promo {
    background: #ff4757 !important;
}

#box_productfull .productimg .tags li.new,
#box_productfull .productimg .custom-product-badge--new {
    background: #10b981 !important;
}

#box_productfull .productimg .tags li.bestseller,
#box_productfull .productimg .custom-product-badge--bestseller {
    background: #f59e0b !important;
}

#box_productfull .productimg .tags li.custom-category-tag--magnetic,
#box_productfull .productimg .custom-product-badge--magnetic {
    background: #2563eb !important;
}

#box_productfull .productimg .tags li.custom-category-tag--maglev,
#box_productfull .productimg .custom-product-badge--maglev {
    background: #8b5cf6 !important;
}

#box_productfull .productimg .tags li.custom-category-tag--smart,
#box_productfull .productimg .custom-product-badge--smart {
    background: #ec4899 !important;
}

/* Miniaturki galerii */
#box_productfull .smallgallery {
    margin-top: 14px !important;
    padding: 0 !important;
}

#box_productfull .smallgallery .innersmallgallery ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#box_productfull .smallgallery .innersmallgallery li {
    width: 64px !important;
    height: 64px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    background: #ffffff !important;
    padding: 4px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

#box_productfull .smallgallery .innersmallgallery li:hover,
#box_productfull .smallgallery .innersmallgallery li.current {
    border-color: #04BBFF !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.25) !important;
    transform: translateY(-2px) !important;
}

#box_productfull .smallgallery .innersmallgallery li img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 6px !important;
}

/* 3. Prawa kolumna: Informacje o produkcie i zakup */
#box_productfull .maininfo>.f-row>.f-grid-6:not(.productimg) {
    flex: 0 0 calc(50% - 20px) !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

/* Główny tytuł produktu (H1) */
#box_productfull h1.name {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    border: none !important;
    text-align: center !important;
    word-break: break-word !important;
    display: block !important;
    width: 100% !important;
}



/* Blok ceny */
#box_productfull .bottomborder {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#box_productfull .basket {
    margin: 0 !important;
    padding: 0 !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 8px 0 14px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #64748b !important;
    margin-right: 4px !important;
    display: inline-block !important;
    min-width: auto !important;
}

#box_productfull .basket .price em.main-price {
    font-size: 30px !important;
    font-weight: 900 !important;
    color: #04BBFF !important;
    letter-spacing: -0.5px !important;
    line-height: 1 !important;
    display: inline-block !important;
}

#box_productfull.custom-promo-product .basket .price em.main-price,
#box_productfull .basket .price em.main-price.color {
    color: #ef4444 !important;
}

#box_productfull .basket .price .price__regular {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 0 0 8px !important;
    font-size: 14px !important;
    color: #94a3b8 !important;
}

#box_productfull .basket .price del.price__inactive {
    font-size: 16px !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    font-weight: 600 !important;
    display: inline !important;
}

#box_productfull .js__omnibus-price-container {
    font-size: 11.5px !important;
    color: #64748b !important;
    width: 100% !important;
    margin-top: 4px !important;
    font-weight: 500 !important;
}

/* Opcje wariantów produktu (.stocks) */
#box_productfull .stocks {
    margin: 12px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

#box_productfull .stocks .f-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    margin: 0 !important;
}

#box_productfull .stocks .label label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.2 !important;
}

#box_productfull .stocks select,
#box_productfull .stocks input[type="text"] {
    width: 100% !important;
    height: 44px !important;
    border-radius: 12px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

#box_productfull .stocks select:focus,
#box_productfull .stocks input[type="text"]:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

/* Pole ilości i Przycisk DO KOSZYKA */
#box_productfull .addtobasket-container,
#box_productfull fieldset.addtobasket-container {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 16px 0 10px 0 !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    float: none !important;
    width: auto !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap .number-wrap {
    display: inline-flex !important;
    align-items: center !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap input[name="quantity"] {
    width: 60px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    background: #f8fafc !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 44px !important;
    vertical-align: middle !important;
}

#box_productfull .quantity_wrap input[name="quantity"]:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

#box_productfull .quantity_wrap .unit {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 48px !important;
    height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
}

#box_productfull .button_wrap,
#box_productfull .basket .button_wrap,
#box_productfull .basket .form-basket .button_wrap {
    flex: 1 1 auto !important;
    float: none !important;
    min-width: 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin: 0 !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
}

#box_productfull button.addtobasket,
#box_productfull .basket .button_wrap button.addtobasket {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #04BBFF 0%, #009de0 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    border: none !important;
    box-shadow: 0 4px 18px rgba(4, 187, 255, 0.35) !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    line-height: 48px !important;
}

#box_productfull button.addtobasket::before {
    font-family: FontAwesome !important;
    content: '\f07a' !important;
    font-size: 16px !important;
    margin-right: 4px !important;
}

#box_productfull button.addtobasket:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(4, 187, 255, 0.5) !important;
    background: linear-gradient(135deg, #00b4f8 0%, #008cc7 100%) !important;
}

/* Przycisk i Widget InPost Pay (inpost-izi-button) */
#box_productfull inpost-izi-button {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    margin: 4px 0 0 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    clear: both !important;
    box-sizing: border-box !important;
}

/* Punkty lojalnościowe */
#box_productfull .loyalty_points {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #15803d !important;
    border-radius: 20px !important;
    padding: 5px 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    margin: 0 0 0 12px !important;
    width: auto !important;
    float: none !important;
    vertical-align: middle !important;
}

#box_productfull .basket .button_wrap {
    margin: 0 !important;
    margin-top: 0 !important;
}

/* Sekcja metadanych: ocena, producent, pytania */
#box_productfull .productdetails-more-details {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: none !important;
    padding: 14px 0 0 0 !important;
    margin-top: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    clear: both !important;
}

#box_productfull .productdetails-more {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px 18px !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

#box_productfull .productdetails-more .evaluation,
#box_productfull .productdetails-more .manufacturer,
#box_productfull .productdetails-more .code {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    color: #64748b !important;
    margin: 0 !important;
    float: none !important;
}

#box_productfull .productdetails-more em {
    float: none !important;
    margin: 0 !important;
    font-style: normal !important;
    font-weight: 600 !important;
    color: #64748b !important;
}

#box_productfull .productdetails-more .brand {
    font-weight: 700 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}

#box_productfull .productdetails-more .brand:hover {
    color: #04BBFF !important;
}

/* 3. Przyciski akcji pod koszykiem: Dodaj do ulubionych, Zapytaj o produkt, Dodaj opinię */
#box_productfull .productdetails-more-details {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;
    padding-top: 12px !important;
    border-top: 1px solid #f1f5f9 !important;
    box-sizing: border-box !important;
}

#box_productfull .productdetails-more-details .links-q,
#box_productfull .links-q {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

#box_productfull .links-q li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}

#box_productfull .links-q li a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 999px !important;
    padding: 8px 16px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
}

#box_productfull .links-q li a img.px1 {
    display: none !important;
}

#box_productfull .links-q li a span {
    display: inline-flex !important;
    align-items: center !important;
}

#box_productfull .links-q li a span::before {
    font-family: FontAwesome !important;
    font-size: 13px !important;
    margin-right: 6px !important;
    display: inline-block !important;
    line-height: 1 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

/* Dodaj do ulubionych */
#box_productfull .links-q li.favourite a.addtofav span::before,
#box_productfull .links-q li a.addtofav span::before {
    content: '\f08a' !important;
    color: #f43f5e !important;
}

#box_productfull .links-q li.favourite a.addtofav:hover,
#box_productfull .links-q li a.addtofav:hover {
    background: #fff1f2 !important;
    border-color: #fecdd3 !important;
    color: #e11d48 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(244, 63, 94, 0.18) !important;
}

#box_productfull .links-q li.favourite a.addtofav:hover span::before,
#box_productfull .links-q li a.addtofav:hover span::before {
    content: '\f004' !important;
    color: #e11d48 !important;
    transform: scale(1.1) !important;
}

/* Zapytaj o produkt */
#box_productfull .links-q li.question a.question span::before,
#box_productfull .links-q li a.question span::before {
    content: '\f0e0' !important;
    color: #0284c7 !important;
}

#box_productfull .links-q li.question a.question:hover,
#box_productfull .links-q li a.question:hover {
    background: #f0f9ff !important;
    border-color: #bae6fd !important;
    color: #0284c7 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(2, 132, 199, 0.15) !important;
}

#box_productfull .links-q li.question a.question:hover span::before,
#box_productfull .links-q li a.question:hover span::before {
    transform: scale(1.1) !important;
}

/* Dodaj opinię */
#box_productfull .links-q li.comment a.comment span::before,
#box_productfull .links-q li a.comment span::before {
    content: '\f086' !important;
    color: #04bbff !important;
}

#box_productfull .links-q li.comment a.comment:hover,
#box_productfull .links-q li a.comment:hover {
    background: #f0fdf4 !important;
    border-color: #bbf7d0 !important;
    color: #16a34a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(22, 163, 74, 0.15) !important;
}

#box_productfull .links-q li.comment a.comment:hover span::before,
#box_productfull .links-q li a.comment:hover span::before {
    color: #16a34a !important;
    transform: scale(1.1) !important;
}

/* Poleć znajomemu */
#box_productfull .links-q li.mailfriend a.mailfriend span::before,
#box_productfull .links-q li a.mailfriend span::before {
    content: '\f064' !important;
    color: #8b5cf6 !important;
}

#box_productfull .links-q li.mailfriend a.mailfriend:hover,
#box_productfull .links-q li a.mailfriend:hover {
    background: #f5f3ff !important;
    border-color: #ddd6fe !important;
    color: #7c3aed !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.15) !important;
}

#box_productfull .links-q li.mailfriend a.mailfriend:hover span::before,
#box_productfull .links-q li a.mailfriend:hover span::before {
    transform: scale(1.1) !important;
}

/* 4. Zakładki i moduły na dole strony (.product-modules) */
.product-modules,
.tab-container {
    margin-top: 35px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Pasek nawigacji zakładek - bez poziomego paska przewijania */
.tab-container nav,
.product-modules nav {
    margin-bottom: 24px !important;
    overflow: visible !important;
    width: 100% !important;
}

.tab-container nav ul,
.product-modules nav ul {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border-bottom: 2px solid #f1f5f9 !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

.tab-container nav ul li,
.product-modules nav ul li {
    padding: 12px 22px !important;
    border-radius: 12px 12px 0 0 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border-bottom: 3px solid transparent !important;
    margin-bottom: -2px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
}

.tab-container nav ul li:hover,
.product-modules nav ul li:hover {
    color: #0f172a !important;
}

.tab-container nav ul li.active,
.product-modules nav ul li.active {
    color: #04BBFF !important;
    border-bottom-color: #04BBFF !important;
    font-weight: 800 !important;
    background: transparent !important;
}

.tab-container nav ul li .boxhead,
.product-modules nav ul li .boxhead {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

.tab-container nav ul li .boxhead h3,
.product-modules nav ul li .boxhead h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    font-weight: inherit !important;
    color: inherit !important;
    border: none !important;
}

/* Treść poszczególnych zakładek (Białe karty z miękkim cieniem) */
.box.tab,
#box_description,
#box_productdeliveries,
#box_productcomments,
#box_productdata {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 18px !important;
    padding: 32px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
    margin-bottom: 30px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.box.tab .boxhead,
#box_description .boxhead,
#box_productdeliveries .boxhead,
#box_productcomments .boxhead,
#box_productdata .boxhead {
    display: none !important;
    /* W trybie zakładek nagłówek jest w nawigacji */
}

/* Opis produktu (#box_description) - wyśrodkowana, estetyczna treść */
#box_description .innerbox,
#box_description .resetcss {
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #334155 !important;
    text-align: center !important;
    max-width: 960px !important;
    margin: 0 auto !important;
}

#box_description .resetcss p,
#box_description .resetcss div {
    text-align: center !important;
}

#box_description .resetcss h2,
#box_description .resetcss h3,
#box_description .resetcss h4 {
    color: #0f172a !important;
    font-weight: 800 !important;
    margin: 24px auto 12px auto !important;
    text-align: center !important;
}

#box_description .resetcss iframe {
    max-width: 100% !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08) !important;
    margin: 20px auto !important;
    display: block !important;
}

#box_description .resetcss img {
    border-radius: 12px !important;
    max-width: 100% !important;
    height: auto !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    margin: 15px auto !important;
    display: inline-block !important;
}

/* Dane techniczne / Atrybuty (#box_productdata) */
#box_productdata .product-attributes table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #f1f5f9 !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

#box_productdata .product-attributes tr {
    border-bottom: 1px solid #f1f5f9 !important;
    transition: background 0.15s ease !important;
}

#box_productdata .product-attributes tr:last-child {
    border-bottom: none !important;
}

#box_productdata .product-attributes tr:nth-child(even) {
    background: #f8fafc !important;
}

#box_productdata .product-attributes td.name {
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    background: transparent !important;
    border: none !important;
    width: 40% !important;
    text-align: left !important;
}

#box_productdata .product-attributes td.value {
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    background: transparent !important;
    border: none !important;
    text-align: left !important;
}

/* Opinie o produkcie (#box_productcomments) */
#box_productcomments .productcomment {
    background: #f8fafc !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    padding: 20px 24px !important;
    margin-bottom: 16px !important;
    text-align: left !important;
}

#box_productcomments .productcomment .reviewer {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
}

#box_productcomments .productcomment .date {
    font-size: 12px !important;
    color: #94a3b8 !important;
}

#box_productcomments .productcomment .description {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #334155 !important;
    margin-top: 10px !important;
}

#box_productcomments form {
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 24px !important;
    margin-top: 24px !important;
    text-align: left !important;
}

#box_productcomments form input[type="text"],
#box_productcomments form textarea {
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    background: #f8fafc !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productcomments form button[type="submit"] {
    border-radius: 12px !important;
    background: linear-gradient(135deg, #04BBFF 0%, #009de0 100%) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    padding: 12px 28px !important;
    border: none !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.3) !important;
}

/* Responsywność strony produktu (RWD) */
@media (max-width: 768px) {
    #box_productfull {
        padding: 20px 16px !important;
        border-radius: 16px !important;
    }

    #box_productfull .maininfo>.f-row {
        flex-direction: column !important;
        flex-wrap: wrap !important;
        gap: 24px !important;
    }

    #box_productfull .productimg,
    #box_productfull .productimg.f-grid-6,
    #box_productfull .maininfo>.f-row>.f-grid-6:not(.productimg) {
        max-width: 100% !important;
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    #box_productfull .productimg > .addtofav {
        top: 0 !important;
        margin-top: 0 !important;
    }

    #box_productfull .productimg .mainimg {
        min-height: 280px !important;
        height: 300px !important;
    }

    #box_productfull h1.name {
        font-size: 22px !important;
    }

    #box_productfull .basket .price em.main-price {
        font-size: 28px !important;
    }

    .box.tab,
    #box_description,
    #box_productdeliveries,
    #box_productcomments,
    #box_productdata {
        padding: 20px 16px !important;
        border-radius: 14px !important;
    }
}

/* ==========================================================================
   PRODUCT GALLERY FIXES
   ========================================================================== */

/* Keep product thumbnails in one horizontal, touch-scrollable row. */
#box_productfull .smallgallery .innersmallgallery {
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
    overscroll-behavior-x: contain !important;
}

#box_productfull .smallgallery .innersmallgallery ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
    gap: 10px !important;
}

#box_productfull .smallgallery .innersmallgallery li {
    flex: 0 0 64px !important;
    margin: 0 !important;
}

/* The footer overlay must not cover the page in its idle state. */
.modal-overlay {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Allow the overlay only while the Shoper lightbox is actually open. */
body.shop-gallery-open .modal-overlay,
body:has(.shop-gallery:not(.inactive)) .modal-overlay,
body:has(.shop-gallery.active) .modal-overlay,
body:has(.shop-gallery.visible) .modal-overlay,
body:has(.shop-gallery.modal-visible) .modal-overlay {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* The gallery itself must remain above its backdrop. */
.shop-gallery,
.rwd-gallery {
    z-index: 10001 !important;
}

/* On small screens the row remains horizontal and does not wrap. */
@media (max-width: 768px) {
    #box_productfull .smallgallery .innersmallgallery li {
        flex-basis: 60px !important;
        width: 60px !important;
        height: 60px !important;
    }
}

/* ==========================================================================
   LIGHTBOX PRODUCT GALLERY DESIGN
   ========================================================================== */

/* Rounded lightbox card and clean white image area. */
.shop-gallery {
    z-index: 10001 !important;
}

.shop-gallery .shop-gallery-skin {
    background: #ffffff !important;
    border: 1px solid #e6edf3 !important;
    border-radius: 22px !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.22) !important;
    overflow: visible !important;
    padding-bottom: 18px !important;
}

.shop-gallery .shop-gallery-inner {
    border-top: none !important;
    margin: 0 18px !important;
    overflow: visible !important;
    border-radius: 16px !important;
}

.shop-gallery .shop-gallery-img-container {
    padding: 12px 48px !important;
    background: #ffffff !important;
}

.shop-gallery .shop-gallery-img {
    border-radius: 14px !important;
}

/* Round close button instead of the rectangular "zamknij X" label. */
.shop-gallery .shop-gallery-close {
    top: -18px !important;
    right: -18px !important;
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 38px !important;
    text-align: center !important;
    text-indent: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
    transition: background 0.15s ease !important;
    animation: none !important;
}

.shop-gallery .shop-gallery-close > * {
    display: none !important;
}

.shop-gallery .shop-gallery-close::after {
    content: '\00d7' !important;
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #6b7280 !important;
    font-family: Arial, sans-serif !important;
    font-size: 25px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
}

.shop-gallery .shop-gallery-close:hover {
    background: #ffffff !important;
    border-color: #d9dee5 !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, 0.14) !important;
    transform: scale(1.04) !important;
    animation: none !important;
}

.shop-gallery .shop-gallery-close:hover::after {
    color: #ef4444 !important;
}

/* Smaller circular navigation controls over the image edges. */
.shop-gallery .shop-gallery-nav {
    top: 50% !important;
    bottom: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, 0.14) !important;
    color: #1e293b !important;
    transform: translateY(-50%) !important;
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease !important;
}

.shop-gallery .shop-gallery-nav:hover {
    background: #ffffff !important;
    color: #04BBFF !important;
    border-color: #04BBFF !important;
    box-shadow: 0 7px 20px rgba(4, 187, 255, 0.3) !important;
    transform: translateY(-50%) scale(1.06) !important;
}

.shop-gallery .shop-gallery-nav::after {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 10px !important;
    height: 10px !important;
    margin: 0 !important;
    border: solid currentColor !important;
    border-width: 0 2px 2px 0 !important;
    display: block !important;
    content: '' !important;
    transform: translate(-50%, -50%) rotate(135deg) !important;
}

.shop-gallery .shop-gallery-nav-prev::after {
    transform: translate(-50%, calc(-50% - 1px)) rotate(135deg) !important;
}

.shop-gallery .shop-gallery-nav-next::after {
    transform: translate(-50%, calc(-50% - 1px)) rotate(-45deg) !important;
}

.shop-gallery .shop-gallery-nav-prev {
    left: 0 !important;
}

.shop-gallery .shop-gallery-nav-next {
    left: auto !important;
    right: 0 !important;
}


/* Rounded thumbnail tray and active image state. */
.shop-gallery .shop-gallery-preview {
    min-width: 0 !important;
    max-width: calc(100% - 36px) !important;
    height: 92px !important;
    margin: 16px auto 0 !important;
    padding: 10px 38px !important;
    border: 1px solid #e6edf3 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    box-sizing: border-box !important;
}

.shop-gallery .shop-gallery-container {
    height: 70px !important;
    border-radius: 10px !important;
}

.shop-gallery .shop-gallery-item-preview {
    width: 70px !important;
    height: 70px !important;
    margin-right: 7px !important;
    padding: 4px !important;
    border: 2px solid transparent !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.shop-gallery .shop-gallery-item-preview:hover,
.shop-gallery .shop-gallery-item-preview.active {
    border-color: #04BBFF !important;
    border-radius: 10px !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.16) !important;
    transform: translateY(-2px) !important;
}

.shop-gallery .shop-gallery-item-preview img {
    border-radius: 6px !important;
}

.shop-gallery .shop-gallery-mini-prev,
.shop-gallery .shop-gallery-mini-next {
    width: 34px !important;
    border-radius: 10px !important;
}

.shop-gallery .shop-gallery-mini-prev::after,
.shop-gallery .shop-gallery-mini-next::after {
    top: 50% !important;
    margin-top: -5px !important;
    border-width: 2px !important;
    border-color: #334155 !important;
}

.shop-gallery .shop-gallery-mini-prev:hover,
.shop-gallery .shop-gallery-mini-next:hover {
    background: rgba(4, 187, 255, 0.1) !important;
}

@media (max-width: 767px) {
    .shop-gallery .shop-gallery-skin {
        border-radius: 16px !important;
        padding-bottom: 12px !important;
    }

    .shop-gallery .shop-gallery-inner {
        margin: 0 10px !important;
        border-radius: 12px !important;
    }

    .shop-gallery .shop-gallery-img-container {
        padding: 8px 38px !important;
    }

    .shop-gallery .shop-gallery-close {
        top: -12px !important;
        right: -12px !important;
        width: 32px !important;
        height: 32px !important;
        line-height: 32px !important;
    }

    .shop-gallery .shop-gallery-close::after {
        line-height: 1 !important;
    }

    .shop-gallery .shop-gallery-nav-prev {
        top: 50% !important;
        left: 0 !important;
        transform: translateY(-50%) !important;
    }

    .shop-gallery .shop-gallery-nav-next {
        top: 50% !important;
        left: auto !important;
        right: 0 !important;
        transform: translateY(-50%) !important;
    }

    .shop-gallery .shop-gallery-preview {
        max-width: calc(100% - 20px) !important;
        border-radius: 12px !important;
    }
}

/* --- Final product information layout --- */

#box_productfull .availability {
    padding: 20px 18px 16px !important;
    gap: 14px !important;
}

#box_productfull .availability > .row > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    gap: 4px !important;
}

#box_productfull .availability > .row > .row > .availability {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .availability .second {
    color: #159947 !important;
    font-weight: 800 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    gap: 8px !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second,
#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    justify-self: end !important;
    white-space: nowrap !important;
}

#box_productfull .bottomborder {
    position: relative !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-height: 38px !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    width: auto !important;
    min-width: 0 !important;
}

#box_productfull .basket .form-basket .button_wrap {
    position: relative !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    left: 150px !important;
    bottom: calc(100% + 10px) !important;
    margin: 0 !important;
    white-space: nowrap !important;
    z-index: 3 !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 16px !important;
    padding-top: 14px !important;
}

#box_productfull .productdetails-more,
#box_productfull .links-q {
    align-items: center !important;
}

@media (max-width: 768px) {
    #box_productfull .availability > .row > .row > .shipping-costs {
        grid-template-columns: 1fr !important;
        justify-items: center !important;
        text-align: center !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first,
    #box_productfull .availability > .row > .row > .shipping-costs .second,
    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        justify-self: center !important;
        text-align: center !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 0 !important;
        white-space: normal !important;
    }
}

/* --- Final delivery panel alignment --- */

#box_productfull .availability > .row > .row {
    justify-items: stretch !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability {
    justify-content: flex-start !important;
    justify-items: start !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first::before,
#box_productfull .availability > .row > .row > .shipping-costs .first::before {
    display: inline-block !important;
    width: 22px !important;
    margin-right: 8px !important;
    font-size: 16px !important;
    line-height: 1 !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .availability .first::before {
    content: '\\2713' !important;
    color: #10a768 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first::before {
    content: '\\1F69A' !important;
    filter: grayscale(1) !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    justify-content: initial !important;
    gap: 8px !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first {
    justify-self: start !important;
    text-align: left !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    justify-self: start !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    justify-self: end !important;
    align-items: center !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

@media (max-width: 768px) {
    #box_productfull .availability > .row > .row > .shipping-costs {
        grid-template-columns: 1fr auto !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first {
        grid-column: 1 / -1 !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .second {
        grid-column: 1 !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }
}

/* --- Product panel final arrangement --- */

#box_productfull .availability {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
    padding: 18px 18px !important;
    text-align: left !important;
}

#box_productfull .availability > .row {
    display: contents !important;
}

#box_productfull .availability > .row > .row > .availability {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    flex-direction: column !important;
    gap: 3px !important;
    width: auto !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first::before {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second {
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 10px !important;
    margin: 2px 0 0 !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

#box_productfull .availability-manufacturer {
    display: flex !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .first {
    width: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    color: #64748b !important;
}

#box_productfull .availability-manufacturer .brand {
    color: #0f172a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

#box_productfull .productdetails-more .evaluation,
#box_productfull .productdetails-more .manufacturer,
#box_productfull .productdetails-more .voted-message {
    display: none !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 14px !important;
    padding-top: 12px !important;
}

#box_productfull .productdetails-more-details .links-q {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

#box_productfull .basket .form-basket .button_wrap {
    position: static !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 2px !important;
    left: 218px !important;
    bottom: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

@media (max-width: 768px) {
    #box_productfull .availability {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    #box_productfull .availability > .row {
        display: flex !important;
        width: 100% !important;
    }

    #box_productfull .availability > .row > .row > .availability,
    #box_productfull .availability > .row > .row > .shipping-costs,
    #box_productfull .availability-manufacturer {
        width: 100% !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first,
    #box_productfull .availability > .row > .row > .shipping-costs .second {
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        align-self: flex-start !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 !important;
        white-space: normal !important;
    }
}

/* --- Stable product details layout --- */

#box_productfull .availability {
    display: grid !important;
    grid-template-columns: minmax(125px, 1fr) minmax(190px, 1.35fr) minmax(90px, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 106px !important;
    padding: 18px 16px !important;
    box-sizing: border-box !important;
}

#box_productfull .availability > .row,
#box_productfull .availability > .row > .row {
    display: contents !important;
}

#box_productfull .availability > .row > .row > .availability {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    min-width: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .availability .second {
    color: #159947 !important;
    font-weight: 800 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: auto minmax(72px, 1fr) auto !important;
    align-items: center !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second,
#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 9px !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    color: #ffffff !important;
}

#box_productfull .availability-manufacturer {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .first,
#box_productfull .availability-manufacturer .brand {
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .brand {
    color: #0f172a !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    position: relative !important;
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    min-height: 40px !important;
    padding-right: 174px !important;
    box-sizing: border-box !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    min-width: auto !important;
    width: auto !important;
    white-space: nowrap !important;
}

#box_productfull .basket .price .price__regular,
#box_productfull .basket .price-netto .price__regular {
    margin: 0 !important;
    white-space: nowrap !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 0 !important;
    left: 202px !important;
    bottom: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
    z-index: 4 !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 18px !important;
    padding-top: 14px !important;
}

#box_productfull .productdetails-more-details .links-q {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
}

@media (max-width: 768px) {
    #box_productfull .availability {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        min-height: 0 !important;
    }

    #box_productfull .availability > .row,
    #box_productfull .availability > .row > .row {
        display: flex !important;
        width: 100% !important;
    }

    #box_productfull .availability > .row > .row > .availability,
    #box_productfull .availability > .row > .row > .shipping-costs,
    #box_productfull .availability-manufacturer {
        width: 100% !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
    }

    #box_productfull .basket .price,
    #box_productfull .basket .price-netto {
        flex-wrap: wrap !important;
        padding-right: 0 !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 !important;
        white-space: normal !important;
    }
}

/* ==========================================================================
   POPRAWKI: SZARY BLOK DOSTĘPNOŚCI, PUNKTY LOJALNOŚCIOWE I CENA REGULARNA
   ========================================================================== */

/* 1. Szary prostokąt pod tytułem (1. Dostępność, 2. Producent, 3. Dostawa - 3 równe kolumny w jednym wierszu, wyrównane od góry) */
#box_productfull .product-details-summary,
#box_productfull .availability.row {
    background: #f8fafc !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 16px !important;
    padding: 16px 12px 16px 12px !important;
    margin: 0 0 20px 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    grid-auto-rows: min-content !important;
    row-gap: 6px !important;
    column-gap: 8px !important;
    align-content: center !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#box_productfull .product-details-summary > .pds-col,
#box_productfull .product-details-summary > div,
#box_productfull .availability.row > .pds-col,
#box_productfull .availability.row > div {
    display: contents !important;
}

/* 1. Dostępność */
#box_productfull .product-details-summary .pds-stock .first,
#box_productfull .availability.row .pds-stock .first { grid-column: 1 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-stock .second,
#box_productfull .availability.row .pds-stock .second { grid-column: 1 !important; grid-row: 2 !important; }

#box_productfull .product-details-summary > .pds-stock img,
#box_productfull .availability.row > .availability img {
    display: none !important;
}

/* 2. Producent (now on the right) */
#box_productfull .product-details-summary .pds-brand .first,
#box_productfull .availability.row .pds-brand .first { grid-column: 3 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-brand .brand,
#box_productfull .availability.row .pds-brand .brand,
#box_productfull .availability-manufacturer .brand { grid-column: 3 !important; grid-row: 2 !important; }

/* 3. Dostawa (now in the center) */
#box_productfull .product-details-summary .pds-shipping .first,
#box_productfull .product-details-summary .pds-delivery .first,
#box_productfull .availability.row .pds-shipping .first,
#box_productfull .availability.row .pds-delivery .first { grid-column: 2 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-shipping .second,
#box_productfull .product-details-summary .pds-delivery .second,
#box_productfull .availability.row .pds-shipping .second,
#box_productfull .availability.row .pds-delivery .second { grid-column: 2 !important; grid-row: 2 !important; }

/* Pierwszy wiersz (etykiety): DOSTĘPNOŚĆ, PRODUCENT, DOSTAWA - identyczna wysokość i linia bazowa */
#box_productfull .product-details-summary .first,
#box_productfull .availability.row .first {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 18px !important;
    height: 18px !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    float: none !important;
}

/* Drugi wiersz (wartości): na wyczerpaniu, GAN, od 10,99 zł - identyczna linia i wysokość */
#box_productfull .product-details-summary .pds-stock .second,
#box_productfull .availability.row .pds-stock .second,
#box_productfull .availability.row .availability .second {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #16a34a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
}

#box_productfull .product-details-summary .pds-brand .brand,
#box_productfull .availability.row .pds-brand .brand,
#box_productfull .availability-manufacturer .brand {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
    transition: color 0.2s ease !important;
}

#box_productfull .product-details-summary .pds-brand .brand:hover,
#box_productfull .availability-manufacturer .brand:hover {
    color: #04bbff !important;
}

#box_productfull .product-details-summary .pds-shipping .second,
#box_productfull .product-details-summary .pds-delivery .second,
#box_productfull .availability.row .pds-shipping .second,
#box_productfull .availability.row .shipping-costs .second,
#box_productfull .availability.row .delivery .second {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
}

/* Ukrycie pytajnika (hint) przy dostawie */
#box_productfull .shipping-costs .hint,
#box_productfull .hint {
    display: none !important;
}

#box_productfull .shipping-costs .lowest-cost-shipping,
#box_productfull .shipping-costs .lowest-cost-shipping-country {
    display: none !important;
}

/* Trzeci wiersz (przycisk): sprawdź formy dostawy */
#box_productfull .shipping-costs .showShippingCost {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 6px 0 0 0 !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 6px rgba(4, 187, 255, 0.25) !important;
    float: none !important;
}

#box_productfull .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(4, 187, 255, 0.4) !important;
    color: #ffffff !important;
}

/* 2. Ukrycie ceny regularnej dla produktów bez promocji */
#box_productfull .basket .price .price__regular.none,
#box_productfull .basket .price-netto .price__regular.none,
#box_productfull .basket .price .price__regular:has(del:empty),
#box_productfull .basket .price-netto .price__regular:has(del:empty) {
    display: none !important;
}

#box_productfull .basket .price .price__regular:not(.none),
#box_productfull .basket .price-netto .price__regular:not(.none) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 0 0 8px !important;
    font-size: 13.5px !important;
    color: #94a3b8 !important;
}

/* 3. Wyśrodkowanie plakietki z punktami lojalnościowymi względem ceny */
#box_productfull .bottomborder {
    position: relative !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 14px !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    white-space: nowrap !important;
    z-index: 4 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #15803d !important;
    border-radius: 20px !important;
    padding: 6px 14px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 1px 3px rgba(21, 128, 61, 0.08) !important;
}

/* Responsywność (RWD) dla sekcji dostępności i ceny */
@media (max-width: 768px) {
    #box_productfull .availability.row,
    #box_productfull > .innerbox .availability.row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 14px !important;
    }

    #box_productfull .availability.row > .row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
        text-align: left !important;
        border-top: 1px solid #eef2f6 !important;
        padding-top: 8px !important;
    }

    #box_productfull .availability-manufacturer .first,
    #box_productfull .availability-manufacturer .brand {
        text-align: left !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 10px 0 0 0 !important;
        white-space: normal !important;
        display: inline-flex !important;
    }
}

/* --- END OF CUSTOM SHOPER THEME STYLES --- */

/* =========================================================================
   MODERN SHOPPING CART REDESIGN (KOSZYK)
   ========================================================================= */

/* 1. Main Container (Karta koszyka) */
#box_basketlist {
    background: #ffffff !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 20px !important;
    padding: 24px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03) !important;
    margin-bottom: 30px !important;
}

#box_basketlist .boxhead {
    margin-bottom: 20px !important;
    border-bottom: 2px solid #f8fafc !important;
    padding-bottom: 12px !important;
}
#box_basketlist .boxhead h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
}

/* 2. Product Table (Tabela produktów) */
#box_basketlist table.productlist {
    display: table !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    width: 100% !important;
    table-layout: fixed !important;
    border: none !important;
    margin: 0 0 24px 0 !important;
}

#box_basketlist table.productlist thead {
    display: table-header-group !important;
}
#box_basketlist table.productlist tbody {
    display: table-row-group !important;
}
#box_basketlist table.productlist thead tr,
#box_basketlist table.productlist tbody tr {
    display: table-row !important;
}

#box_basketlist table.productlist thead td {
    display: table-cell !important;
    background: transparent !important;
    border: none !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #64748b !important;
    padding: 12px 8px !important;
    border-bottom: 2px solid #eef2f6 !important;
    white-space: nowrap !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist thead td.name {
    text-align: left !important;
    padding-left: 0 !important;
}

/* Explicit widths applied to BOTH thead and tbody */
#box_basketlist table.productlist .img {
    width: 75px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .name {
    width: auto !important;
    text-align: left !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .time {
    width: 105px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .quantity {
    width: 140px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .price {
    width: 110px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .sum {
    width: 115px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .actions {
    width: 55px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* Row styling */
#box_basketlist table.productlist tbody tr {
    background: #f8fafc !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    border-radius: 12px !important;
    transition: background 0.2s ease !important;
}
#box_basketlist table.productlist tbody tr:hover {
    background: #f1f5f9 !important;
}
#box_basketlist table.productlist tbody tr td {
    display: table-cell !important;
    border: none !important;
    padding: 14px 8px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist tbody tr td:first-child {
    border-radius: 12px 0 0 12px !important;
    padding-left: 12px !important;
}
#box_basketlist table.productlist tbody tr td:last-child {
    border-radius: 0 12px 12px 0 !important;
    padding-right: 12px !important;
}

#box_basketlist table.productlist tbody td.img img {
    border-radius: 8px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important;
    display: block !important;
    margin: 0 auto !important;
}

#box_basketlist table.productlist tbody td.name a {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 4px !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
}
#box_basketlist table.productlist tbody td.name a:hover {
    color: #04bbff !important;
}
#box_basketlist table.productlist tbody td.name .variant {
    font-size: 12px !important;
    color: #64748b !important;
    display: block !important;
}

#box_basketlist table.productlist tbody td.time {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    vertical-align: middle !important;
}

/* Quantity Stepper styling */
#box_basketlist table.productlist tbody td.quantity {
    vertical-align: middle !important;
    text-align: center !important;
}
#box_basketlist table.productlist .quantity-stepper {
    display: inline-flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 2px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist .quantity-stepper .btn-qty {
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    padding: 0 !important;
    user-select: none !important;
}
#box_basketlist table.productlist .quantity-stepper .btn-qty:hover {
    background: #04bbff !important;
    color: #ffffff !important;
}
#box_basketlist table.productlist .quantity-stepper input {
    width: 36px !important;
    height: 28px !important;
    border: none !important;
    background: transparent !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}
#box_basketlist table.productlist .quantity-stepper .shaded_inputwrap {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist tbody td.quantity .unit-name {
    font-size: 12px !important;
    color: #64748b !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
    display: inline-block !important;
    font-weight: 600 !important;
}

#box_basketlist table.productlist tbody td.price {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    text-align: center !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
}
#box_basketlist table.productlist tbody td.price .color_dim.line-through {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    display: block !important;
    margin-bottom: 2px !important;
}

#box_basketlist table.productlist tbody td.sum {
    font-size: 15.5px !important;
    font-weight: 800 !important;
    color: #04bbff !important;
    text-align: center !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
}
#box_basketlist table.productlist tbody td.sum em,
#box_basketlist table.productlist tbody td.sum em.color {
    font-style: normal !important;
    color: #04bbff !important;
    font-size: 15.5px !important;
    font-weight: 800 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
    position: static !important;
    top: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

#box_basketlist table.productlist tbody td.actions {
    text-align: center !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    color: #94a3b8 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    float: none !important;
    margin: 0 auto !important;
    cursor: pointer !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove:hover {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #ef4444 !important;
    transform: scale(1.1) !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove span {
    display: none !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove i {
    font-size: 13px !important;
    border: none !important;
    padding: 0 !important;
    color: inherit !important;
}

/* 3. Cart Options Container (Layout dolny) */
#box_basketlist #cart-options {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    margin-top: 24px !important;
}

/* Columns for Delivery and Payment */
#box_basketlist .delivery-container,
#box_basketlist .payment-container {
    flex: 1 1 300px !important;
    background: #f8fafc !important;
    border-radius: 16px !important;
    padding: 20px !important;
    border: 1px solid #eef2f6 !important;
}

#box_basketlist .delivery-container h5,
#box_basketlist .payment-container h5 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-bottom: 1px solid #eef2f6 !important;
    padding-bottom: 8px !important;
}

/* Delivery/Payment Items (Radio Buttons as Cards) */
#box_basketlist .delivery,
#box_basketlist .payment {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.02) !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .delivery:hover,
#box_basketlist .payment:hover {
    border-color: #bae6fd !important;
}
#box_basketlist .delivery.selected,
#box_basketlist .payment.selected {
    border-color: #04bbff !important;
    background: #f0f9ff !important;
}

/* Inactive / Disabled cards */
#box_basketlist .delivery.disabled,
#box_basketlist .payment.disabled,
#box_basketlist .delivery:has(input:disabled),
#box_basketlist .payment:has(input:disabled),
#box_basketlist .delivery.inactive,
#box_basketlist .payment.inactive,
#box_basketlist .delivery_inactive,
#box_basketlist .payment_inactive {
    opacity: 0.35 !important;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    filter: grayscale(1) !important;
}
#box_basketlist .delivery.disabled *,
#box_basketlist .payment.disabled *,
#box_basketlist .delivery:has(input:disabled) *,
#box_basketlist .payment:has(input:disabled) * {
    cursor: not-allowed !important;
    color: #94a3b8 !important;
}

#box_basketlist .delivery .name,
#box_basketlist .payment .name {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
}
#box_basketlist .delivery .value {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
}

/* Custom Radio button styling */
#box_basketlist .radio-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin: 0 !important;
}

#box_basketlist .radio-wrap input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 100% !important;
    height: 100% !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 2 !important;
}

#box_basketlist .radio-wrap label {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    border: 2px solid #cbd5e1 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
}

#box_basketlist .delivery:hover:not(.disabled) .radio-wrap label,
#box_basketlist .payment:hover:not(.disabled) .radio-wrap label {
    border-color: #04bbff !important;
}

#box_basketlist .delivery.selected .radio-wrap label,
#box_basketlist .payment.selected .radio-wrap label,
#box_basketlist .radio-wrap input[type="radio"]:checked + label {
    border-color: #04bbff !important;
    background: #ffffff !important;
}

#box_basketlist .delivery.selected .radio-wrap label::after,
#box_basketlist .payment.selected .radio-wrap label::after,
#box_basketlist .radio-wrap input[type="radio"]:checked + label::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #04bbff !important;
    display: block !important;
    box-shadow: 0 0 6px rgba(4, 187, 255, 0.4) !important;
}

/* 4. Summary Container */
#box_basketlist .summary-container {
    flex: 1 1 300px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 24px !important;
    border: 2px solid #04bbff !important;
    box-shadow: 0 8px 24px rgba(4, 187, 255, 0.1) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    text-align: left !important;
}

/* Promocode */
#box_basketlist .promocode {
    background: #f8fafc !important;
    border-radius: 12px !important;
    padding: 14px !important;
    display: block !important;
}
#box_basketlist .promocode .checkbox-wrap {
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
}
#box_basketlist .promocode .checkbox-wrap input[type="checkbox"] {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 8px 0 0 !important;
    opacity: 1 !important;
    position: static !important;
    accent-color: #04bbff !important;
}
#box_basketlist .promocode .checkbox-wrap label {
    display: none !important; /* hide fake shoper checkbox */
}
#box_basketlist .promocode .desc {
    display: inline-block !important;
    vertical-align: middle !important;
}
#box_basketlist .promocode .desc label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    cursor: pointer !important;
}
#box_basketlist .promocode .input {
    display: block !important;
    margin-top: 10px !important;
}
#box_basketlist .promocode .input input {
    width: 100% !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}
#box_basketlist .promocode .action {
    display: block !important;
}
#box_basketlist .promocode .action .btn {
    background: #0f172a !important;
    color: #fff !important;
    padding: 10px 16px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    width: 100% !important;
    margin-top: 8px !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    border: none !important;
    transition: background 0.2s !important;
}
#box_basketlist .promocode .action .btn:hover {
    background: #1e293b !important;
}

/* Recount (Przelicz koszyk) */
#box_basketlist .recount {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #eef2f6 !important;
}
#box_basketlist .recount > span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}
#box_basketlist .recount .desc {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
}
#box_basketlist .recount .sum em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    font-style: normal !important;
}
#box_basketlist .recount .button,
#box_basketlist .recount #recalc {
    display: block !important;
    width: 100% !important;
    margin: 0 0 6px 0 !important;
}
#box_basketlist .recount #recalc button,
#box_basketlist .recount .button .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 10px 16px !important;
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .recount #recalc button:hover,
#box_basketlist .recount .button .btn:hover {
    background: #04bbff !important;
    border-color: #04bbff !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.25) !important;
}

/* Delivery cost line */
#box_basketlist .deliveryhead {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #eef2f6 !important;
}
#box_basketlist .deliveryhead .cost {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
}
#box_basketlist .deliveryhead .value em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    font-style: normal !important;
}

/* To pay (Do zapłaty) */
#box_basketlist .sum {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: none !important;
    background: #f0f9ff !important;
    margin: 8px -24px -24px -24px !important;
    padding: 20px 24px !important;
    border-radius: 0 0 14px 14px !important;
}
#box_basketlist .sum .desc {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
}
#box_basketlist .sum .value {
    font-size: 24px !important;
    font-weight: 900 !important;
    color: #04bbff !important;
}

/* 5. Buttons Row */
#box_basketlist .buttons {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-top: 16px !important;
    gap: 16px !important;
}

/* Kontynuuj zakupy */
#box_basketlist .buttons .back .btn {
    background: transparent !important;
    border: 2px solid #e2e8f0 !important;
    color: #64748b !important;
    padding: 14px 24px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .buttons .back .btn:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

/* Zamawiam */
#box_basketlist .buttons .forward .btn {
    background: #04bbff !important;
    color: #ffffff !important;
    padding: 16px 40px !important;
    border-radius: 12px !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(4, 187, 255, 0.3) !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}
#box_basketlist .buttons .forward .btn:hover {
    transform: translateY(-2px) !important;
    background: #009de0 !important;
    box-shadow: 0 12px 24px rgba(4, 187, 255, 0.4) !important;
}
/* =========================================
   NEW LOGIN PAGE UI (#box_login)
========================================= */

#box_login {
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08) !important;
    overflow: hidden !important;
    border: 1px solid #f1f5f9 !important;
    padding: 0 !important;
    margin: 40px auto 60px auto !important;
    max-width: 950px !important;
}

#box_login .social-login-buttons {
    background: #f8fafc !important;
    padding: 40px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    text-align: center !important;
}

#box_login .social-login-buttons h3 {
    font-size: 18px !important;
    color: #475569 !important;
    font-weight: 600 !important;
    margin-bottom: 24px !important;
    text-transform: none !important;
}

#box_login .social-login-buttons .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 12px 28px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
    text-transform: none !important;
    margin: 5px !important;
    border: 1px solid transparent !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

#box_login .social-login-buttons .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1) !important;
}

#box_login .social-login-buttons p {
    margin-top: 20px !important;
    color: #94a3b8 !important;
}

#box_login .innerbox {
    padding: 50px !important;
}

#box_login .innerbox .f-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 40px !important;
}

#box_login .innerbox .f-grid-6 {
    flex: 1 1 0 !important;
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
}

/* Headings */
#box_login .login-head,
#box_login .register-head {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 30px !important;
    text-transform: none !important;
    border: none !important;
    padding: 0 !important;
}

#box_login .login-head img,
#box_login .register-head img {
    display: none !important;
}

#box_login .login-head span,
#box_login .register-head span {
    background: transparent !important;
    padding: 0 !important;
}

/* Form Elements */
#box_login .login-inner label {
    display: block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    margin-bottom: 8px !important;
}

#box_login .login-inner input[type="text"],
#box_login .login-inner input[type="password"],
#box_login .login-inner input[type="email"] {
    width: 100% !important;
    height: 52px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 16px !important;
    font-size: 16px !important;
    transition: all 0.3s ease !important;
    margin-bottom: 24px !important;
    box-sizing: border-box !important;
    color: #0f172a !important;
}

#box_login .login-inner input:focus {
    border-color: #04bbff !important;
    box-shadow: 0 0 0 4px rgba(4, 187, 255, 0.1) !important;
    outline: none !important;
    background: #ffffff !important;
}

/* Login Button */
#box_login .login-inner .btn.login {
    width: 100% !important;
    height: 54px !important;
    background: linear-gradient(135deg, #04bbff, #009de0) !important;
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(4, 187, 255, 0.3) !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#box_login .login-inner .btn.login img {
    display: none !important;
}

#box_login .login-inner .btn.login:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 24px rgba(4, 187, 255, 0.4) !important;
    background: linear-gradient(135deg, #00aaff, #008cc9) !important;
}

/* Forgot Password */
#box_login .login-inner p {
    text-align: right !important;
    margin-top: -12px !important;
    margin-bottom: 24px !important;
    font-size: 13px !important;
    color: #64748b !important;
}

/* PERFECT ALIGNMENT FIX */
#box_login .innerbox .f-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 40px !important;
}

#box_login .innerbox .f-grid-6 {
    flex: 1 1 0 !important;
    margin: 0 !important;
}

/* Make both columns the positioned anchors */
#box_login .login-inner,
#box_login .register-inner {
    position: relative !important;
    padding-bottom: 75px !important; /* Space for the button */
    display: block !important;
}

/* Strip ALL positioning and padding from intermediate tags (fieldset, form) */
#box_login .login-inner fieldset,
#box_login .register-inner .register-form,
#box_login .register-inner .register-form fieldset {
    position: static !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Absolutely position both buttons to the bottom of the columns */
#box_login .login-inner .btn.login,
#box_login .register-inner .btn.register {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

.cart-item .basket-contain .basket-summery .basket-price .price-total {
    font-size: 13px !important;
    color: #4b5563 !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
}

.cart-item .basket-contain .basket-summery .basket-price .price-total strong {
    font-size: 16px !important;
    color: #04BBFF !important;
    font-weight: 800 !important;
}


/* --- 2. NAVIGATION MENU CUSTOM STYLING --- */
.menu,
.menu.row {
    background: #000000 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18) !important;
    width: 100% !important;
    position: relative !important;
    z-index: 99 !important;
}

.menu::before,
.menu::after,
.innermenu::before,
.innermenu::after {
    display: none !important;
}

.innermenu,
.innermenu.row.container {
    width: 100% !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    height: 56px !important;
    float: none !important;
    box-sizing: border-box !important;
    position: relative !important;
}

.menu-list {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
    width: auto !important;
    float: none !important;
    border: none !important;
    overflow: visible !important;
}

.menu-list li.home-link-menu-li {
    display: none !important;
    /* Hide legacy home icon button */
}

.menu-list>li {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.menu-list>li>h3 {
    margin: 0 !important;
    padding: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: normal !important;
}

.menu-list>li>h3>a {
    color: #f3f4f6 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    height: 100% !important;
    position: relative !important;
    padding: 0 16px !important;
    transition: color 0.3s ease, background-color 0.3s ease !important;
    border-radius: 6px !important;
}

.menu-list>li>h3>a span {
    position: relative !important;
    padding-bottom: 2px !important;
    transition: color 0.3s ease !important;
}

.menu-list>li>h3>a span::after {
    content: '' !important;
    position: absolute !important;
    bottom: -4px !important;
    left: 50% !important;
    width: 0 !important;
    height: 2.5px !important;
    background: linear-gradient(90deg, #7b00ff, #04BBFF) !important;
    border-radius: 2px !important;
    transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1), left 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.menu-list>li>h3>a:hover span::after,
.menu-list>li>h3>a.fx-active span::after,
.menu-list>li.current>h3>a span::after,
.menu-list>li.active-menu>h3>a span::after {
    width: 100% !important;
    left: 0 !important;
}

.menu-list>li>h3>a:hover,
.menu-list>li>h3>a.fx-active,
.menu-list>li.current>h3>a,
.menu-list>li.active-menu>h3>a {
    color: #04BBFF !important;
    text-decoration: none !important;
}

/* Category Submenu Styling with Smooth Transitions */
/* Reset wrapper div .submenu so it does not render background/border duplicate */
.menu-list>li .submenu,
.menu-list>li>div.submenu {
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 1000 !important;
    display: block !important;
    pointer-events: none !important;
}

/* Reset default Shopper legacy ::after/::before on parent:hover */
.innermenu .parent:hover::after,
.innermenu .parent.opened::after,
.menu-list>li.parent::after {
    display: none !important;
    content: none !important;
}

/* Style the actual category list ul.level1 */
.menu-list>li .submenu>ul,
.menu-list>li>div>ul,
.innermenu .parent:hover>div>ul,
.innermenu .parent.opened>div>ul {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    transform: translateY(12px) scale(0.96) !important;
    transform-origin: top center !important;
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.16), 0 0 1px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid #eef1f6 !important;
    min-width: 220px !important;
    width: max-content !important;
    max-width: 320px !important;
    padding: 10px 0 !important;
    margin: 8px 0 0 0 !important;
    list-style: none !important;
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s !important;
}

/* Invisible bridge on the ul so mouse hover from menu link to submenu is seamless */
.menu-list>li .submenu>ul::before,
.menu-list>li>div>ul::before {
    content: '' !important;
    position: absolute !important;
    top: -16px !important;
    left: 0 !important;
    width: 100% !important;
    height: 16px !important;
    background: transparent !important;
    border: none !important;
    transform: none !important;
}

/* Open submenu on hover */
.menu-list>li.parent:hover>.submenu,
.menu-list>li:hover>.submenu,
.menu-list>li .submenu:hover {
    pointer-events: auto !important;
}

.menu-list>li.parent:hover>.submenu>ul,
.menu-list>li.parent:hover>div>ul,
.menu-list>li:hover>.submenu>ul,
.menu-list>li .submenu>ul:hover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
}

.menu-list>li .submenu li {
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    position: relative !important;
}

.menu-list>li .submenu li h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    display: block !important;
}

.menu-list>li .submenu li h3 a,
.menu-list>li .submenu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 22px !important;
    color: #374151 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0.2px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    background: transparent !important;
    height: auto !important;
}

.menu-list>li .submenu li h3 a:hover,
.menu-list>li .submenu li a:hover {
    background: #f4f6fc !important;
    color: #7b00ff !important;
    padding-left: 22px !important;
}


/* --- 3. CUSTOM HERO BANNER --- */
.custom-hero-banner {
    background: radial-gradient(circle at 85% 50%, rgba(123, 0, 255, 0.28), transparent 45%),
        radial-gradient(circle at 65% 50%, rgba(4, 187, 255, 0.22), transparent 45%),
        #050c1e;
    position: relative;
    padding: 80px 0 120px 0;
    color: #ffffff;
    overflow: hidden;
}

.hero-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.hero-content {
    flex: 1;
    max-width: 600px;
    z-index: 5;
}

.hero-badge {
    background: linear-gradient(90deg, rgba(123, 0, 255, 0.15), rgba(4, 187, 255, 0.15));
    border: 1px solid rgba(4, 187, 255, 0.3);
    color: #04BBFF;
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 20px;
}

.hero-title {
    font-size: 54px;
    line-height: 1.1;
    font-weight: 900;
    margin-bottom: 20px;
    color: #ffffff;
    letter-spacing: -0.5px;
    background: linear-gradient(135deg, #ffffff 60%, #04BBFF);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-subtitle {
    font-size: 18px;
    line-height: 1.5;
    color: #a5b4fc;
    margin-bottom: 40px;
    font-weight: 400;
}

.hero-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(90deg, #7b00ff, #04BBFF);
    color: #ffffff !important;
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 16px 35px;
    border-radius: 30px;
    text-decoration: none !important;
    box-shadow: 0 4px 20px rgba(123, 0, 255, 0.4);
    transition: all 0.3s ease;
}

.hero-cta-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 25px rgba(123, 0, 255, 0.6);
    background: linear-gradient(90deg, #8c1aff, #1ad1ff);
}

.hero-cta-btn:hover .arrow-icon {
    transform: translateX(4px);
}

.hero-cta-btn .arrow-icon {
    width: 18px;
    height: 18px;
    transition: transform 0.2s ease;
}

.hero-features {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 50px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 30px;
}

.hero-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.hero-feature-item .feature-icon {
    color: #04BBFF;
    font-size: 20px;
}

.hero-feature-item .feature-text {
    display: flex;
    flex-direction: column;
}

.hero-feature-item .feature-text strong {
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hero-feature-item .feature-text span {
    font-size: 11px;
    color: #a5b4fc;
}

.hero-visual {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 450px;
    max-width: 500px;
}

.neon-ring {
    position: absolute;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    border: 3px solid rgba(4, 187, 255, 0.7);
    box-shadow: 0 0 25px rgba(4, 187, 255, 0.8),
        inset 0 0 25px rgba(4, 187, 255, 0.8),
        0 0 50px rgba(123, 0, 255, 0.5),
        inset 0 0 50px rgba(123, 0, 255, 0.5);
    animation: rotateRing 15s linear infinite;
    z-index: 1;
}

.neon-ring-glow {
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    border-radius: 50%;
    background: radial-gradient(circle, transparent 60%, rgba(123, 0, 255, 0.2));
}

@keyframes rotateRing {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* 3D Rubik's Cube representation */
.rubiks-cube-wrapper {
    position: absolute;
    perspective: 800px;
    z-index: 2;
}

@keyframes floatCube {
    0%, 100% { transform: rotateX(-25deg) rotateY(45deg) translateY(0); }
    50% { transform: rotateX(-25deg) rotateY(45deg) translateY(-15px); }
}

/* 3D JS Rubiks Cube */
.rubiks-cube {
    width: 150px;
    height: 150px;
    position: relative;
    z-index: 10;
    transform-style: preserve-3d;
    transform: rotateX(-25deg) rotateY(45deg);
    animation: floatCube 4s ease-in-out infinite;
}

#cube-shaker {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    transform-style: preserve-3d;
    transform-origin: 75px 75px 0;
}

.pivot {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
    transform-style: preserve-3d;
    transform-origin: 50% 50% 0;
}

.cubie {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 50px;
    left: 50px;
    transform-style: preserve-3d;
    /* Transition removed to prevent scattering; rotation is handled by the pivot */
}

.cubie-face {
    position: absolute;
    width: 50px;
    height: 50px;
    margin: 0;
    background-color: #050505;
    border-radius: 6px;
    border: 3px solid #050505;
    box-sizing: border-box;
    backface-visibility: visible;
}

.cubie-face::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 2px;
    background-color: var(--sticker-bg, transparent);
    backface-visibility: hidden;
}

.cubie-face-U { transform: rotateX(90deg) translateZ(25px); }
.cubie-face-D { transform: rotateX(-90deg) translateZ(25px); }
.cubie-face-F { transform: translateZ(25px); }
.cubie-face-B { transform: rotateY(180deg) translateZ(25px); }
.cubie-face-R { transform: rotateY(90deg) translateZ(25px); }
.cubie-face-L { transform: rotateY(-90deg) translateZ(25px); }

.cube-shadow {
    position: absolute;
    bottom: -60px;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 30px;
    background: radial-gradient(ellipse, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 70%);
    z-index: 1;
}

/* Curved cutoff path at the bottom of hero banner */
.hero-wave {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 60px;
    overflow: hidden;
    line-height: 0;
    z-index: 4;
}

.hero-wave svg {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}


/* --- 4. CUSTOM USPs BAR --- */
.custom-usps-bar {
    background: #ffffff;
    padding: 30px 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    z-index: 6;
    margin-top: -30px;
}

.usps-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

@media (max-width: 980px) {
    .usps-container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
}

.usp-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 180px;
}

.usp-item .usp-icon {
    color: #7b00ff;
    font-size: 24px;
    background: #f5f0ff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.usp-item:hover .usp-icon {
    background: #7b00ff;
    color: #ffffff;
    transform: translateY(-3px);
}

.usp-item .usp-text {
    display: flex;
    flex-direction: column;
}

.usp-item .usp-text strong {
    font-size: 14px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 2px;
}

.usp-item .usp-text span {
    font-size: 11px;
    color: #777777;
}


/* --- 5. PRODUCTS CARDS CUSTOM STYLE --- */
.main {
    background: #ffffff !important;
}

.box {
    margin-bottom: 50px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.boxhead,
.box .boxhead {
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 2px solid #f0f0f0;
    position: relative;
    width: 100%;
}

.boxhead span,
.boxhead h1,
.boxhead h2,
.boxhead .category-name {
    font-size: 24px;
    font-weight: 800;
    color: #1a1a1a;
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    display: inline-block;
}

.boxhead::after {
    display: none !important;
    /* Hide old background borders */
}

/* Home page module headers specific styling to look like mockup */
body.shop_index .boxhead,
.box-recommended-dark .boxhead {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

body.shop_index .boxhead span,
body.shop_index .boxhead h1,
body.shop_index .boxhead h2,
.box-recommended-dark .boxhead h1,
.box-recommended-dark .boxhead h2 {
    margin: 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Hide all "Zobacz wszystkie" pseudo-elements and buttons from boxes */
body.shop_index #box_bestsellers .boxhead::before,
body.shop_index #box_lastadded .boxhead::before,
body.shop_index #box_mainproducts .boxhead::before,
body.shop_index [id^="box_recommendations"] .boxhead::before,
[id^="box_recommendations"] .boxhead::before,
.box-recommended-dark .boxhead::before,
.boxhead .see-all-btn,
.boxhead .see-all-link {
    display: none !important;
    content: none !important;
}

/* Center column boxhead header adjustments on list pages */
body.shop_product_list .s-grid-9 .boxhead,
body.shop_product_list #center .boxhead {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: left;
}

body.shop_product_list .s-grid-9 .boxhead h1,
body.shop_product_list #center .boxhead h1 {
    margin: 0;
}

.products,
ol.productlist,
ul.productlist,
div.productlist,
.products.viewphot {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.slider .products,
.slider .productlist {
    display: block !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
}

/* Custom cards styling */
.product,
.productlist .product,
#box_mainproducts .products .product,
#box_lastadded .product {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.3s ease !important;
    width: calc(20% - 16px);
    /* 5 cards in row */
    min-width: 190px;
    position: relative;
    overflow: hidden;
    margin: 0;
    float: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* Fix for slider items to prevent wrapping and breaking script calculations */
.slider .product {
    width: 100%;
    min-width: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    vertical-align: top !important;
    box-sizing: border-box !important;
}

.owl-item .product {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
}

/* Stylizacja strzałek dla wszystkich sliderów na stronie głównej */
.slider {
    position: relative !important;
}

.slider .innerbox {
    overflow: hidden !important;
    position: relative !important;
}

.slider .slider-wrap {
    white-space: nowrap !important;
    font-size: 0 !important;
    position: relative !important;
}

.slider .slider-nav-left,
.slider .slider-nav-right,
.box.slider .slider-nav-left,
.box.slider .slider-nav-right {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 44px !important;
    height: 44px !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 50% !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    z-index: 50 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important;
    opacity: 0.95 !important;
    visibility: visible !important;
}

.slider .slider-nav-left:hover,
.slider .slider-nav-right:hover,
.box.slider .slider-nav-left:hover,
.box.slider .slider-nav-right:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1) !important;
    box-shadow: 0 8px 24px rgba(4, 187, 255, 0.4) !important;
}

.slider .slider-nav-left,
.box.slider .slider-nav-left {
    left: -15px !important;
}

.slider .slider-nav-right,
.box.slider .slider-nav-right {
    right: -15px !important;
}

.slider .slider-nav-left::before,
.box.slider .slider-nav-left::before {
    content: '\f104' !important;
    font-family: FontAwesome !important;
    font-size: 20px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.slider .slider-nav-right::before,
.box.slider .slider-nav-right::before {
    content: '\f105' !important;
    font-family: FontAwesome !important;
    font-size: 20px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.slider .slider-nav-left:hover::before,
.slider .slider-nav-right:hover::before,
.box.slider .slider-nav-left:hover::before,
.box.slider .slider-nav-right:hover::before {
    color: #ffffff !important;
}

@media (max-width: 1200px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(25% - 15px) !important;
    }
}

@media (max-width: 980px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(33.33% - 14px) !important;
    }
}

@media (max-width: 768px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: calc(50% - 10px) !important;
    }
}

@media (max-width: 480px) {

    .product:not(.slider .product),
    .productlist .product,
    #box_mainproducts .products .product,
    #box_lastadded:not(.slider) .product {
        width: 100% !important;
    }
}

.product:hover,
.productlist .product:hover,
#box_mainproducts .products .product:hover,
#box_lastadded .product:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
    border-color: #e1e4e8 !important;
    z-index: 10;
}

/* Center the image */
.product a {
    text-align: center;
    display: block;
    margin-bottom: 15px;
    text-decoration: none !important;
}

.product .boximgsize,
.product .prodimage {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 180px !important;
    margin: 0 auto 15px auto !important;
    width: 100% !important;
}

.product .boximgsize span,
.product .prodimage span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

.product .boximgsize img,
.product .prodimage img {
    max-height: 180px !important;
    max-width: 100% !important;
    height: auto !important;
    width: auto !important;
    object-fit: contain !important;
    transition: transform 0.3s ease;
}

.product:hover .boximgsize img,
.product:hover .prodimage img {
    transform: scale(1.05);
}

/* Product title styling */
.product .productnamewrap,
.product .productname,
.product .prodname {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin-bottom: 8px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    height: 36px !important;
    max-height: 36px !important;
    width: 100% !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    word-wrap: normal !important;
    text-decoration: none !important;
}

/* Price wrapper layout - wyśrodkowana cena */
.product .price {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin-top: auto;
    padding: 6px 0 0 0 !important;
    border: none !important;
    border-top: none !important;
    width: 100% !important;
}

.product .price em {
    font-size: 17px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
    /* Bold blue price */
    font-style: normal !important;
    text-align: center !important;
    display: block !important;
}

.product .price del {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    margin: 2px auto 0 auto !important;
    text-align: center !important;
}

/* Shopping basket button inside card on center under price */
.product .basket-box,
.product form.basket {
    margin: 10px auto 0 auto !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    position: static !important;
}

.product button.addtobasket,
.product input[type="submit"],
.product .addtobasket {
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: static !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.product button.addtobasket::before,
.product input[type="submit"]::before,
.product .addtobasket::before {
    content: '';
    background: url('../images/user/cart.svg') no-repeat center;
    background-size: 16px;
    width: 16px;
    height: 16px;
    display: block;
    filter: grayscale(1);
}

.product button.addtobasket span,
.product button.addtobasket img,
.product input[type="submit"] span,
.product input[type="submit"] img,
.product .addtobasket span,
.product .addtobasket img {
    display: none !important;
    /* Hide standard text and icon */
}

.product button.addtobasket:hover,
.product input[type="submit"]:hover,
.product .addtobasket:hover {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

.product button.addtobasket:hover::before,
.product input[type="submit"]:hover::before,
.product .addtobasket:hover::before {
    filter: brightness(0) invert(1);
}

/* Badges on product cards - disabled old pseudo-elements in favor of .custom-product-badges */
.product::after,
#box_lastadded .product::after,
#box_bestsellers .product::after,
.leftcol .product::after {
    display: none !important;
    content: none !important;
}


/* --- 6. "POLECANE PRODUKTY" DARK SECTION STYLE --- */
[id^="box_recommendations"],
.box-recommended-dark {
    background: radial-gradient(circle at 10% 20%, rgba(4, 187, 255, 0.08), transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(123, 0, 255, 0.08), transparent 40%),
        #050c1e !important;
    border-radius: 16px;
    padding: 40px 30px !important;
    margin: 60px 0 !important;
}

[id^="box_recommendations"] .boxhead,
.box-recommended-dark .boxhead {
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

[id^="box_recommendations"] .boxhead::before,
.box-recommended-dark .boxhead::before {
    color: #04BBFF !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

[id^="box_recommendations"] .boxhead:hover::before,
.box-recommended-dark .boxhead:hover::before {
    background: #04BBFF !important;
    color: #ffffff !important;
    border-color: #04BBFF !important;
}

[id^="box_recommendations"] .boxhead span,
[id^="box_recommendations"] .boxhead h1,
[id^="box_recommendations"] .boxhead h2,
.box-recommended-dark .boxhead span,
.box-recommended-dark .boxhead h1,
.box-recommended-dark .boxhead h2 {
    color: #ffffff !important;
}

[id^="box_recommendations"] .product,
.box-recommended-dark .product {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
}

[id^="box_recommendations"] .product:hover,
.box-recommended-dark .product:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(4, 187, 255, 0.3) !important;
}

[id^="box_recommendations"] .product .productname,
.box-recommended-dark .product .productname {
    color: #ffffff !important;
}

[id^="box_recommendations"] .product .price,
.box-recommended-dark .product .price {
    border-top-color: rgba(255, 255, 255, 0.05) !important;
}

[id^="box_recommendations"] .product .price em,
.box-recommended-dark .product .price em {
    color: #ffffff !important;
    /* White prices on dark background */
}

[id^="box_recommendations"] .product .basket-box button.addtobasket,
.box-recommended-dark .product .basket-box button.addtobasket {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

[id^="box_recommendations"] .product .basket-box button.addtobasket::before,
.box-recommended-dark .product .basket-box button.addtobasket::before {
    filter: brightness(0) invert(1);
}

[id^="box_recommendations"] .product .basket-box button.addtobasket:hover,
.box-recommended-dark .product .basket-box button.addtobasket:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
}


/* --- 7. NEWSLETTER SECTION STYLING --- */
#box_newsletter,
.box#box_newsletter,
.custom-newsletter-box {
    background: radial-gradient(circle at 10% 20%, rgba(4, 187, 255, 0.12), transparent 40%),
        radial-gradient(circle at 90% 80%, rgba(123, 0, 255, 0.15), transparent 40%),
        #0b0f24 !important;
    /* Deep stylish dark navy */
    border-radius: 18px !important;
    padding: 40px 45px !important;
    margin: 60px auto !important;
    max-width: 1160px !important;
    width: 100% !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
    box-sizing: border-box !important;
    position: relative !important;
}

#box_newsletter .boxhead,
.custom-newsletter-box .boxhead {
    display: none !important;
    /* Hide old newsletter header */
}

#box_newsletter .innerbox,
.custom-newsletter-box .innerbox {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 30px !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 980px) {

    #box_newsletter .innerbox,
    .custom-newsletter-box .innerbox {
        flex-direction: column;
        text-align: center;
    }
}

#box_newsletter .boxintro,
.custom-newsletter-box .boxintro {
    flex: 1;
    min-width: 300px;
    font-size: 16px !important;
    color: #ffffff !important;
    font-weight: 500;
    margin: 0 !important;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 20px;
}

#box_newsletter .boxintro::before,
.custom-newsletter-box .boxintro::before {
    content: '\f0e0';
    /* Mail icon */
    font-family: FontAwesome;
    font-size: 36px;
    color: #04BBFF;
    background: none !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: inline-block;
    flex-shrink: 0;
}

@media (max-width: 980px) {

    #box_newsletter .boxintro,
    .custom-newsletter-box .boxintro {
        flex-direction: column;
        gap: 10px;
    }
}

#box_newsletter form,
.custom-newsletter-box form {
    flex: 1.2;
    max-width: 600px;
    width: 100%;
    margin: 0;
}

#box_newsletter .newsletter-input-container,
.custom-newsletter-box .newsletter-input-container {
    display: flex !important;
    align-items: center !important;
    background: rgba(255, 255, 255, 0.07) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 30px !important;
    padding: 6px 6px 6px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
}

#box_newsletter .newsletter-input-container:focus-within,
.custom-newsletter-box .newsletter-input-container:focus-within {
    border-color: #04BBFF !important;
    background: rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 0 15px rgba(4, 187, 255, 0.3) !important;
}

#box_newsletter .newsletter-input,
.custom-newsletter-box .newsletter-input {
    flex-grow: 1;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    color: #ffffff !important;
    font-size: 14px;
    padding: 10px 15px !important;
    width: 100%;
}

#box_newsletter .newsletter-input::placeholder,
.custom-newsletter-box .newsletter-input::placeholder {
    color: rgba(255, 255, 255, 0.4);
}

#box_newsletter .btn-red,
#box_newsletter button[type="submit"],
.custom-newsletter-box .btn-red,
.custom-newsletter-box button[type="submit"] {
    background: linear-gradient(90deg, #7b00ff, #04BBFF) !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 12px 30px !important;
    border-radius: 25px !important;
    cursor: pointer;
    transition: opacity 0.2s;
    height: auto !important;
    margin: 0 !important;
    box-shadow: 0 4px 15px rgba(123, 0, 255, 0.3) !important;
}

#box_newsletter .btn-red:hover,
#box_newsletter button[type="submit"]:hover,
.custom-newsletter-box .btn-red:hover,
.custom-newsletter-box button[type="submit"]:hover {
    opacity: 0.9;
}


/* --- 8. BOTTOM TRUST BAR --- */
.custom-trust-bar {
    background: #f8f9fa;
    padding: 35px 0;
    border-top: 1px solid #e1e4e8;
    border-bottom: 1px solid #e1e4e8;
}

.trust-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

@media (max-width: 980px) {
    .trust-container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
}

.trust-item {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 220px;
}

.trust-item .trust-icon {
    color: #4a5568;
    width: 32px;
    height: 32px;
    display: block;
    flex-shrink: 0;
}

.trust-item .trust-text {
    display: flex;
    flex-direction: column;
}

.trust-item .trust-text strong {
    font-size: 13px;
    font-weight: bold;
    color: #1a1a1a;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.trust-item .trust-text span {
    font-size: 11px;
    color: #718096;
}


/* --- 9. CUSTOM FOOTER DESIGN --- */
.footer-custom {
    background: #070913;
    /* Elegant deep black-blue footer background */
    color: #ffffff;
    padding: 60px 0 0 0;
    font-family: inherit;
    border-top: 3px solid #7b00ff;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px 40px 15px;
    flex-wrap: wrap;
}

.footer-col {
    flex: 1;
    min-width: 180px;
}

.brand-col {
    flex: 1.5;
    min-width: 250px;
}

.footer-logo {
    display: block;
    margin-bottom: 20px;
}

.footer-logo img {
    max-height: 40px;
    width: auto;
}

.brand-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #94a3b8;
    margin-bottom: 25px;
}

.social-icons {
    display: flex;
    gap: 12px;
}

.social-icon {
    background: rgba(255, 255, 255, 0.05);
    color: #ffffff !important;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.2s ease;
    text-decoration: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.social-icon:hover {
    background: #7b00ff;
    color: #ffffff !important;
    transform: translateY(-3px);
    border-color: #7b00ff;
}

.footer-title {
    font-size: 14px;
    font-weight: bold;
    color: #ffffff;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 8px;
}

.footer-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 2px;
    background: #04BBFF;
}

.footer-links-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links-list li {
    margin-bottom: 12px;
}

.footer-links-list li a {
    color: #94a3b8 !important;
    font-size: 13px;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.footer-links-list li a:hover {
    color: #04BBFF !important;
    padding-left: 4px;
}

.footer-contact-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
}

.footer-contact-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    font-size: 13px;
    color: #94a3b8;
}

.footer-contact-list li a {
    color: #94a3b8 !important;
    text-decoration: none !important;
    transition: color 0.2s;
}

.footer-contact-list li a:hover {
    color: #04BBFF !important;
}

.contact-icon {
    width: 16px;
    height: 16px;
    color: #04BBFF;
    flex-shrink: 0;
}

.footer-contact-btn {
    display: inline-block;
    background: #ffffff;
    color: #070913 !important;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 10px 25px;
    border-radius: 20px;
    text-decoration: none !important;
    transition: all 0.2s ease;
    border: 1px solid #ffffff;
    letter-spacing: 0.5px;
    text-align: center;
    width: 100%;
    max-width: 180px;
}

.footer-contact-btn:hover {
    background: transparent;
    color: #ffffff !important;
}

/* Footer Copyright Bottom Bar */
.footer-bottom {
    background: #04050a;
    padding: 25px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.footer-bottom-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
    flex-wrap: wrap;
    gap: 15px;
}

@media (max-width: 768px) {
    .footer-bottom-container {
        flex-direction: column;
        text-align: center;
    }
}

.copyright {
    font-size: 12px;
    color: #64748b;
}

.footer-bottom-links {
    display: flex;
    gap: 20px;
}

.footer-bottom-links a {
    color: #64748b !important;
    font-size: 12px;
    text-decoration: none !important;
    transition: color 0.2s;
}

.footer-bottom-links a:hover {
    color: #ffffff !important;
}

/* Back to top button styling */
.up {
    position: fixed !important;
    bottom: 30px !important;
    left: 30px !important;
    right: auto !important;
    width: 46px !important;
    height: 46px !important;
    z-index: 9999 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.up a {
    background: #7b00ff !important;
    color: #ffffff !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(123, 0, 255, 0.4) !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

.up a::before {
    font-size: 18px !important;
    line-height: 1 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    width: auto !important;
}

.up a:hover {
    background: #04BBFF !important;
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 6px 18px rgba(4, 187, 255, 0.5) !important;
}

/* ----------------------------------------------------
   RESPONSIVE DESIGN CORRECTIONS
   ---------------------------------------------------- */
@media (max-width: 980px) {
    .header-container {
        flex-direction: column;
        gap: 15px;
    }

    .header-search {
        margin: 10px 0;
        width: 100%;
        max-width: 100%;
    }

    .menu-list {
        justify-content: center;
        height: auto;
        padding: 10px 0;
        flex-wrap: wrap;
        gap: 15px;
    }

    .hero-container {
        flex-direction: column;
        text-align: center;
        gap: 40px;
    }

    .hero-title {
        font-size: 38px;
    }

    .hero-features {
        justify-content: center;
    }
}

/* ==========================================================================
   ELEGANT & MODERN CATEGORY PAGE STYLING (PODSTRONA KATEGORII)
   ========================================================================== */

/* 1. Ścieżka nawigacyjna (Breadcrumbs) */
.breadcrumbs,
#breadcrumbs,
.breadcrumbs.large {
    background: #ffffff !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 12px 0 !important;
    margin-bottom: 25px !important;
}

.breadcrumbs .innerbreadcrumbs,
#breadcrumbs .innerbreadcrumbs {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

.breadcrumbs .breadcrumb-home,
.breadcrumbs a,
.breadcrumbs .path a {
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: color 0.2s ease !important;
}

.breadcrumbs a:hover,
.breadcrumbs .path a:hover {
    color: #04BBFF !important;
}

.breadcrumbs .path {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.breadcrumbs .path li {
    display: inline-flex !important;
    align-items: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
}

.breadcrumbs .path li .raq {
    margin-right: 8px !important;
    color: #cbd5e1 !important;
    font-size: 14px !important;
}

.breadcrumbs .path li.last span,
.breadcrumbs .path li:last-child span {
    color: #0f172a !important;
    font-weight: 700 !important;
}

/* 2. Filtry górne ("Opcje przeglądania" / #box_filter / #box_productfilter) */
#box_filter,
#box_productfilter,
.category-filters,
.filter.category-filters {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 20px !important;
    padding: 24px 28px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: visible !important;
    z-index: 100 !important;
}

#box_filter .boxhead,
#box_productfilter .boxhead,
.category-filters .boxhead {
    border-bottom: 2px solid #f8fafc !important;
    margin-bottom: 20px !important;
    padding-bottom: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

#box_filter .boxhead span,
#box_productfilter .boxhead span,
.category-filters .boxhead span,
#box_filter .boxhead h3,
#box_productfilter .boxhead h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.4px !important;
    margin: 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

#box_filter .innerbox,
#box_productfilter .innerbox,
.category-filters .innerbox {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 101 !important;
}

/* Pola w opcjach przeglądania (1. Sortowanie, 2. Cena, 3. Producent) */
#box_filter .innerbox>.multiselect,
#box_filter .innerbox>.group,
#box_filter .innerbox>.group-filter,
#box_filter .innerbox>div {
    flex: 1 1 200px !important;
    min-width: 180px !important;
    max-width: 32% !important;
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: visible !important;
    z-index: 105 !important;
}

@media (max-width: 768px) {

    #box_filter .innerbox>.multiselect,
    #box_filter .innerbox>.group,
    #box_filter .innerbox>.group-filter,
    #box_filter .innerbox>div {
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* Kolejność: 1. Sortowanie (Domyślne) [lewa], 2. Cena [środek], 3. Producent [prawa] */
#box_filter .innerbox>*,
#box_productfilter .innerbox>* {
    order: 10 !important;
}

#box_filter #filter_custom_sort,
#box_filter .group-sort-custom,
#box_productfilter #filter_custom_sort,
#box_productfilter .group-sort-custom {
    order: 1 !important;
}

#box_filter [id*="price"],
#box_filter [data-provider*="Price"],
#box_filter #filter_price,
#box_filter .pricegroup,
#box_productfilter .pricegroup,
#box_productfilter [id*="price"] {
    order: 2 !important;
}

#box_filter [id*="producer"],
#box_filter [id*="producers"],
#box_filter [data-provider*="Producer"],
#box_filter #filter_producer,
#box_filter .producergroup,
#box_productfilter .producergroup,
#box_productfilter [id*="producer"] {
    order: 3 !important;
}

/* Ukrycie filtrów Nowość i Promocje */
#box_filter [id*="news"],
#box_filter [id*="new"],
#box_filter [data-provider*="New"],
#box_filter [id*="novelties"],
#box_filter [id*="promo"],
#box_filter [id*="promotion"],
#box_filter [data-provider*="Promo"],
#box_filter .multiselect:has(span:contains("Nowość")),
#box_filter .multiselect:has(span:contains("Nowości")),
#box_filter .multiselect:has(span:contains("Promocj")) {
    display: none !important;
}

/* Pigułkowy styl nagłówków filtrów (.multiselect) */
#box_filter .multiselect {
    height: 48px !important;
    line-height: 46px !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 24px !important;
    padding: 0 38px 0 20px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    margin: 0 !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
}

#box_filter .multiselect>span {
    padding: 0 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    display: inline-block !important;
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#box_filter .multiselect:hover,
#box_filter .multiselect.selected {
    border-color: #04BBFF !important;
    background-color: #ffffff !important;
    color: #04BBFF !important;
    box-shadow: 0 4px 16px rgba(4, 187, 255, 0.18) !important;
    transform: translateY(-2px) !important;
}

#box_filter .multiselect:hover>span,
#box_filter .multiselect.selected>span {
    color: #04BBFF !important;
}

/* Rozwijana lista (dropdown) po kliknięciu na filtr */
#box_filter .multiselect ul {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    min-width: 250px !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14) !important;
    padding: 16px !important;
    z-index: 99999 !important;
    max-height: 320px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

#box_filter .multiselect ul li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 4px 0 !important;
    border-radius: 8px !important;
    line-height: normal !important;
    background: transparent !important;
}

#box_filter .multiselect ul li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 9px 12px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #334155 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

#box_filter .multiselect ul li a:hover,
#box_filter .multiselect ul li.selected a {
    background-color: rgba(4, 187, 255, 0.08) !important;
    color: #04BBFF !important;
}

/* Pola wprowadzania ceny (od - do) w dropdownie ceny - nowoczesny, czytelny układ */
#box_filter .multiselect ul li.priceinput,
.group-filter .multiselect ul li.priceinput,
li.priceinput {
    padding: 6px 4px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput br,
li.priceinput br {
    display: none !important;
}

/* Wiersz z etykietą i polem input */
#box_filter .multiselect ul li.priceinput .price-row,
#box_filter .multiselect ul li.priceinput .fromto-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    width: 100% !important;
}

#box_filter .multiselect ul li.priceinput .fromto,
li.priceinput .fromto {
    display: inline-block !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    min-width: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput input[type="text"],
#box_filter .multiselect ul li.priceinput #filterprice1,
#box_filter .multiselect ul li.priceinput #filterprice2,
li.priceinput input[type="text"],
#filterprice1,
#filterprice2 {
    display: inline-block !important;
    width: calc(100% - 44px) !important;
    height: 38px !important;
    line-height: 38px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    box-sizing: border-box !important;
    outline: none !important;
    margin: 0 !important;
    float: right !important;
    transition: all 0.2s ease !important;
}

#box_filter .multiselect ul li.priceinput input[type="text"]:focus,
#box_filter .multiselect ul li.priceinput #filterprice1:focus,
#box_filter .multiselect ul li.priceinput #filterprice2:focus,
li.priceinput input:focus,
#filterprice1:focus,
#filterprice2:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

#box_filter .multiselect ul li.priceinput .bottombuttons,
li.priceinput .bottombuttons {
    width: 100% !important;
    margin-top: 6px !important;
    padding: 0 !important;
    clear: both !important;
    float: none !important;
}

#box_filter .multiselect ul li.priceinput .btn,
#box_filter .multiselect ul li.priceinput button#filterprice {
    width: 100% !important;
    height: 38px !important;
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    box-shadow: 0 4px 12px rgba(123, 0, 255, 0.25) !important;
    transition: all 0.25s ease !important;
}

#box_filter .multiselect ul li.priceinput .btn:hover,
#box_filter .multiselect ul li.priceinput button#filterprice:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(123, 0, 255, 0.4) !important;
    filter: brightness(1.06) !important;
}

#box_filter .multiselect ul li.priceinput .btn .px1,
#box_filter .multiselect ul li.priceinput .btn img {
    display: none !important;
}

/* Stylizacja selecta sortowania (Domyślne) wewnątrz Opcji Przeglądania */
#box_filter #filter_custom_sort,
#box_productfilter #filter_custom_sort {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

#box_filter #filter_custom_sort:hover,
#box_productfilter #filter_custom_sort:hover {
    transform: translateY(-2px) !important;
}

#box_filter .sort-and-view,
#box_filter .sortlinks,
#box_filter .form-sort,
#box_productfilter .sort-and-view,
#box_productfilter .sortlinks,
#box_productfilter .form-sort,
#filter_custom_sort .sort-and-view,
#filter_custom_sort .sortlinks,
#filter_custom_sort .form-sort {
    margin: 0 !important;
    width: 100% !important;
    display: block !important;
}

#box_filter .gotourl,
#box_filter select.gotourl,
#box_productfilter .gotourl,
#box_productfilter select.gotourl,
#filter_custom_sort select,
#filter_custom_sort select.gotourl {
    display: block !important;
    width: 100% !important;
    height: 48px !important;
    background-color: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 24px !important;
    padding: 0 38px 0 20px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 14px !important;
    outline: none !important;
    box-sizing: border-box !important;
}

#box_filter .gotourl:hover,
#box_filter .gotourl:focus,
#box_productfilter .gotourl:hover,
#box_productfilter .gotourl:focus,
#filter_custom_sort select:hover,
#filter_custom_sort select:focus {
    background-color: #ffffff !important;
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    box-shadow: 0 4px 16px rgba(4, 187, 255, 0.18) !important;
}

/* Ukrycie oryginalnego kontenera sortowania pod nagłówkiem kategorii, ale NIE gdy jest w #filter_custom_sort */
.centercol .boxhead .sort-and-view:not(#filter_custom_sort .sort-and-view) {
    display: none !important;
}

/* 3. Pasek nagłówka kategorii i sortowanie (.categoryhead / .sort-and-mode) */
.centercol .boxhead,
.categoryhead,
body.shop_product_list .s-grid-9 .boxhead,
body.shop_product_list #center .boxhead,
#box_mainproducts .boxhead {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    position: relative !important;
    z-index: 1 !important;
    gap: 16px !important;
    margin-bottom: 24px !important;
    padding-bottom: 14px !important;
    border-bottom: 2px solid #f1f5f9 !important;
}

.centercol .boxhead h1,
.categoryhead h1,
.category-name,
body.shop_product_list .s-grid-9 .boxhead h1,
body.shop_product_list #center .boxhead h1,
#box_mainproducts .boxhead h1,
#box_mainproducts .category-name {
    font-size: 26px !important;
    font-weight: 900 !important;
    color: #0f172a !important;
    letter-spacing: -0.6px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
}

/* Sortowanie po lewej stronie */
.sort-and-view,
.sort-and-mode,
.centercol .sort-and-mode,
.sortlinks {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 12px auto 0 0 !important;
    /* aligned to the left */
    position: relative !important;
    left: 0 !important;
    right: auto !important;
}

.sort-and-mode select,
.sortlinks select,
.form-sort select,
.sort-and-view select,
.gotourl {
    height: 42px !important;
    background-color: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 22px !important;
    padding: 0 36px 0 16px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    cursor: pointer !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2304BBFF' stroke-width='2.2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px !important;
}

.sort-and-mode select:hover,
.sort-and-mode select:focus,
.sortlinks select:hover,
.sortlinks select:focus,
.form-sort select:hover,
.gotourl:hover,
.gotourl:focus {
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    outline: none !important;
    box-shadow: 0 3px 12px rgba(4, 187, 255, 0.15) !important;
    transform: translateY(-1px) !important;
}

/* 4. Główna siatka produktów w kategorii (Center column) */
.centercol .products.viewphot,
.centercol .products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)) !important;
    gap: 24px !important;
    margin: 20px 0 40px 0 !important;
    width: 100% !important;
}

/* Pojedyncza nowoczesna karta produktu */
.centercol .products.viewphot .product,
.centercol .products .product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border: 1px solid #eaebf0 !important;
    border-radius: 18px !important;
    padding: 18px !important;
    box-sizing: border-box !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: relative !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    min-height: 380px !important;
}

.centercol .products.viewphot .product:hover,
.centercol .products .product:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 16px 36px rgba(4, 187, 255, 0.12), 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    border-color: #04BBFF !important;
}

/* Zdjęcie produktu */
.centercol .products.viewphot .product .prodimage,
.centercol .products .product .boximgsize {
    width: 100% !important;
    height: 190px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 14px !important;
    overflow: hidden !important;
    position: relative !important;
}

.centercol .products.viewphot .product .prodimage img,
.centercol .products .product .boximgsize img {
    max-width: 100% !important;
    max-height: 180px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.centercol .products.viewphot .product:hover .prodimage img,
.centercol .products .product:hover .boximgsize img {
    transform: scale(1.08) !important;
}

/* Tytuł produktu - kontener i tekst */
.centercol .products.viewphot .product .productnamewrap,
.centercol .products .product .productnamewrap {
    display: block !important;
    width: 100% !important;
    min-height: 38px !important;
    height: 42px !important;
    max-height: 44px !important;
    margin-bottom: 10px !important;
    overflow: hidden !important;
    text-align: center !important;
}

.centercol .products.viewphot .product .productname,
.centercol .products .product .productname,
.centercol .products .product .prodname {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    height: auto !important;
    max-height: 38px !important;
    width: 100% !important;
    text-align: center !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: color 0.2s ease !important;
}

.centercol .products.viewphot .product:hover .productname,
.centercol .products .product:hover .productname {
    color: #04BBFF !important;
}

/* Dolna linia ceny i koszyka */
.centercol .products.viewphot .product .price,
.centercol .products .product .price {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-top: auto !important;
    padding-top: 6px !important;
    border: none !important;
    border-top: none !important;
    width: 100% !important;
}

.centercol .products.viewphot .product .price em,
.centercol .products .product .price em {
    font-size: 19px !important;
    font-weight: 900 !important;
    color: #04BBFF !important;
    font-style: normal !important;
    letter-spacing: -0.3px !important;
}

.centercol .products.viewphot .product .price del,
.centercol .products .product .price del {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    margin-left: 6px !important;
}

/* Przycisk koszyka na karcie */
.centercol .products.viewphot .product .addtobasket,
.centercol .products .product .addtobasket,
.centercol .products.viewphot .product button.addtobasket {
    position: static !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.centercol .products.viewphot .product .addtobasket:hover,
.centercol .products .product .addtobasket:hover {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

/* 5. Lewy sidebar (.leftcol / aside) */
.leftcol,
.leftcol.s-grid-3 {
    box-sizing: border-box !important;
}

/* Każdy boks w sidebarze jako nowoczesna biała karta */
.leftcol .box {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 18px 20px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
}

.leftcol .box .boxhead,
.leftcol .boxhead {
    font-size: 14px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #0f172a !important;
    margin: 0 0 14px 0 !important;
    padding: 0 0 10px 0 !important;
    border-bottom: 2px solid #f1f5f9 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    line-height: 1.2 !important;
    position: static !important;
}

.leftcol .box .boxhead span,
.leftcol .boxhead span,
.leftcol .box .boxhead h3,
.leftcol .boxhead h3 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    line-height: 1.2 !important;
    display: inline !important;
}

/* Kill old LESS-compiled pseudo-element decorations on leftcol boxhead (e.g. purple/maincolor bars) */
.leftcol .box .boxhead::before,
.leftcol .boxhead::before,
.leftcol .box .boxhead::after,
.leftcol .boxhead::after {
    display: none !important;
    content: none !important;
    background: none !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* Extra specificity for the slider boxes to guarantee old skin styles are overridden */
#box_lastadded .boxhead,
#box_recent .boxhead,
#box_bestsellers .leftcol .boxhead {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: 2px solid #f1f5f9 !important;
    box-shadow: none !important;
    color: #0f172a !important;
    padding: 0 0 10px 0 !important;
    margin: 0 0 14px 0 !important;
    position: static !important;
}

#box_lastadded .boxhead::before,
#box_lastadded .boxhead::after,
#box_recent .boxhead::before,
#box_recent .boxhead::after {
    display: none !important;
    content: none !important;
}

/* Drzewo kategorii w lewym sidebarze (#box_menu) */
.leftcol #box_menu .innerbox,
.leftcol #box_menu ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.leftcol #box_menu li {
    list-style: none !important;
    margin-bottom: 3px !important;
    padding: 0 !important;
    border: none !important;
}

.leftcol #box_menu li a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 9px 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #334155 !important;
    text-decoration: none !important;
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
}

.leftcol #box_menu li a:hover {
    background-color: #f1f5f9 !important;
    color: #04BBFF !important;
    padding-left: 16px !important;
}

/* Aktywna kategoria */
.leftcol #box_menu li.current>a,
.leftcol #box_menu li.active>a {
    background: linear-gradient(90deg, rgba(4, 187, 255, 0.12), rgba(123, 0, 255, 0.04)) !important;
    color: #0284c7 !important;
    font-weight: 800 !important;
    border-left: 3px solid #04BBFF !important;
    border-radius: 0 10px 10px 0 !important;
}

/* Podkategorie (2x2x2, 3x3x3, 4x4x4...) */
.leftcol #box_menu li.has-submenu>a {
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
}

.leftcol #box_menu li .toggle-submenu {
    font-size: 12px !important;
    color: #64748b !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease !important;
    margin-left: 8px !important;
    padding: 4px 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.leftcol #box_menu li.expanded>a .toggle-submenu,
.leftcol #box_menu li.expanded>.toggle-submenu {
    transform: rotate(180deg) !important;
    color: #04BBFF !important;
}

.leftcol #box_menu li ul {
    padding-left: 12px !important;
    margin: 4px 0 6px 8px !important;
    border-left: 2px solid #e2e8f0 !important;
    transition: all 0.3s ease !important;
}

.leftcol #box_menu li ul li a {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #64748b !important;
    padding: 6px 10px !important;
}

.leftcol #box_menu li ul li a:hover {
    color: #04BBFF !important;
    background: #f8fafc !important;
}

/* Moduły produktowe i slidery w lewym sidebarze (Nowości, Bestsellery, Zestawy) */
.leftcol .products,
.leftcol .products.viewphot,
.leftcol .productlist,
.leftcol .slider-wrapper {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    height: auto !important;
}

.leftcol .box.slider {
    position: relative !important;
    overflow: visible !important;
}

.leftcol .box.slider .innerbox {
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
}

.leftcol .box.slider .slider-wrap {
    display: block !important;
    position: relative !important;
    white-space: nowrap !important;
    font-size: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: height 0.3s ease, left 0.4s ease;
    /* Let JS control width — do not override */
}

.leftcol .product,
.leftcol .products .product,
.leftcol .products.viewphot .product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-align: center !important;
    padding: 16px 12px !important;
    margin: 0 0 14px 0 !important;
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    min-height: unset !important;
    height: auto !important;
    position: relative !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.25s ease !important;
}


.leftcol .slider .product,
.leftcol .box.slider .product {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: space-between !important;
    vertical-align: top !important;
    white-space: normal !important;
    font-size: 14px !important;
    margin: 0 !important;
    padding: 16px 12px !important;
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
    min-height: unset !important;
    position: relative !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
    /* JS slider engine will set exact pixel width via style.setProperty with !important */
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
}


.leftcol .product:hover {
    background: #ffffff !important;
    border-color: #04BBFF !important;
    box-shadow: 0 6px 18px rgba(4, 187, 255, 0.12) !important;
    transform: translateY(-2px) !important;
}

.leftcol .product .boximgsize,
.leftcol .product .prodimage {
    width: 100% !important;
    height: 140px !important;
    min-height: 140px !important;
    max-height: 140px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 10px auto !important;
    position: relative !important;
    overflow: hidden !important;
}

.leftcol .product .boximgsize img,
.leftcol .product .prodimage img {
    max-height: 130px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
}

.leftcol .product>a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

.leftcol .product .productnamewrap {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 2px !important;
    margin-bottom: 6px !important;
    height: 34px !important;
    max-height: 34px !important;
    overflow: hidden !important;
}

.leftcol .product .productname,
.leftcol .product .prodname {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    height: 34px !important;
    max-height: 34px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: center !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    white-space: normal !important;
}

.leftcol .product .price {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
    margin-bottom: 6px !important;
    display: block !important;
    text-align: center !important;
    border: none !important;
    padding: 0 !important;
}

.leftcol .product .price em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #04BBFF !important;
}

.leftcol .product .addtobasket,
.leftcol .product button.addtobasket {
    position: static !important;
    width: 32px !important;
    height: 32px !important;
    margin: 6px auto 0 auto !important;
}

/* Strzałki nawigacji slidera w sidebarze */
.leftcol .slider .slider-nav-left,
.leftcol .slider .slider-nav-right,
.leftcol .box.slider .slider-nav-left,
.leftcol .box.slider .slider-nav-right {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 32px !important;
    height: 32px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
    margin: 0 !important;
    opacity: 0.9;
}

.leftcol .slider .slider-nav-left:hover,
.leftcol .slider .slider-nav-right:hover,
.leftcol .box.slider .slider-nav-left:hover,
.leftcol .box.slider .slider-nav-right:hover {
    background: #04BBFF !important;
    border-color: #04BBFF !important;
    color: #ffffff !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.1) !important;
}

.leftcol .slider .slider-nav-left,
.leftcol .box.slider .slider-nav-left {
    left: 6px !important;
}

.leftcol .slider .slider-nav-right,
.leftcol .box.slider .slider-nav-right {
    right: 6px !important;
}

.leftcol .slider .slider-nav-left::before,
.leftcol .box.slider .slider-nav-left::before {
    content: '\f104' !important;
    font-family: FontAwesome !important;
    font-size: 16px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.leftcol .slider .slider-nav-right::before,
.leftcol .box.slider .slider-nav-right::before {
    content: '\f105' !important;
    font-family: FontAwesome !important;
    font-size: 16px !important;
    color: #1e293b !important;
    line-height: 1 !important;
    display: block !important;
}

.leftcol .slider .slider-nav-left:hover::before,
.leftcol .slider .slider-nav-right:hover::before,
.leftcol .box.slider .slider-nav-left:hover::before,
.leftcol .box.slider .slider-nav-right:hover::before {
    color: #ffffff !important;
}

/* Paczkomaty w sidebarze */
.leftcol #box_paczkomaty img,
.leftcol .box_paczkomaty img {
    border-radius: 12px !important;
    max-width: 100% !important;
    display: block !important;
    margin: 0 auto !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

/* Wyszukiwarka w sidebarze */
.leftcol #box_search input[type="text"],
.leftcol .box_search input[type="text"] {
    width: 100% !important;
    height: 40px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 38px 0 14px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}

.leftcol #box_search .btn,
.leftcol .box_search .btn {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    color: #64748b !important;
    cursor: pointer !important;
}

/* Logowanie w sidebarze */
.leftcol #box_loginsmall input[type="text"],
.leftcol #box_loginsmall input[type="email"],
.leftcol #box_loginsmall input[type="password"] {
    width: 100% !important;
    height: 38px !important;
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    margin-bottom: 10px !important;
    box-sizing: border-box !important;
}

.leftcol #box_loginsmall .btn.login,
.leftcol #box_loginsmall button[type="submit"] {
    width: 100% !important;
    height: 40px !important;
    background: linear-gradient(135deg, #7b00ff, #04BBFF) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    border-radius: 10px !important;
    border: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s ease !important;
    margin-top: 4px !important;
    margin-bottom: 10px !important;
    box-shadow: 0 4px 12px rgba(123, 0, 255, 0.25) !important;
}

.leftcol #box_loginsmall .btn.login:hover,
.leftcol #box_loginsmall button[type="submit"]:hover {
    opacity: 0.9 !important;
}

.leftcol #box_loginsmall a {
    font-size: 12px !important;
    color: #64748b !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 4px !important;
}

.leftcol #box_loginsmall a:hover {
    color: #04BBFF !important;
}

/* 6. Paginacja (.paginator) - idealnie okrągłe przyciski bez kresek */
.paginator,
.pagination,
.floatcenterwrap .paginator {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 45px auto 25px auto !important;
    padding: 0 !important;
    list-style: none !important;
}

.paginator li,
.pagination li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Ukrycie separatorów i kresek pionowych w paginacji */
.paginator .sep,
.pagination .sep,
.paginator .stick,
.pagination .stick,
.paginator li.stick,
.paginator li:has(.stick),
.paginator li:empty,
.pagination li:empty {
    display: none !important;
    content: none !important;
}

.paginator li::before,
.paginator li::after,
.pagination li::before,
.pagination li::after {
    display: none !important;
    content: none !important;
}

.paginator a,
.paginator span,
.pagination a,
.pagination span,
.paginator .selected,
.paginator li a,
.paginator li span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding: 0 !important;
    margin: 0 3px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    color: #334155 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03) !important;
    box-sizing: border-box !important;
    line-height: normal !important;
}

.paginator a:hover,
.pagination a:hover,
.paginator li a:hover {
    background: #f8fafc !important;
    border-color: #04BBFF !important;
    color: #04BBFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.2) !important;
}

.paginator .selected span,
.paginator .selected,
.paginator .active a,
.pagination .active a,
.pagination .selected,
.paginator li.selected span,
.paginator li.selected a {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.35) !important;
}

/* ==========================================================================
   MODAL / POPUP DODANIA DO KOSZYKA NA ŚRODKU EKRANU
   ========================================================================== */
.modal,
.modal.modal-visible,
#box_productdeliveries.modal,
.modal.modal-shipping {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: 92% !important;
    max-width: 780px !important;
    min-width: 320px !important;
    min-height: auto !important;
    height: auto !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35), 0 0 1px rgba(0, 0, 0, 0.15) !important;
    border: 1px solid #eef1f6 !important;
    padding: 32px 36px !important;
    z-index: 100005 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}

.modal.modal-not-visible,
.modal.none,
.modal.modal-hidden {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Nagłówek modala */
.modal-header,
.modal .modal-header {
    background: transparent !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 2px solid #f1f5f9 !important;
    margin-bottom: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    color: #0f172a !important;
    width: 100% !important;
    flex-shrink: 0 !important;
}

.modal-header h3,
.modal .modal-header h3,
.modal .modal-header>* {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.modal .modal-header .modal-close,
.modal-header .modal-close,
.modal-close {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    border: 1.5px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: transparent !important;
    font-size: 0 !important;
    transition: all 0.2s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-basis: auto !important;
    position: relative !important;
    box-sizing: border-box !important;
    text-indent: -9999px !important;
    overflow: hidden !important;
}

.modal .modal-header .modal-close::before,
.modal-header .modal-close::before,
.modal-close::before,
.modal .modal-header .modal-close::after,
.modal-header .modal-close::after,
.modal-close::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 14px !important;
    height: 2px !important;
    background-color: #64748b !important;
    border-radius: 2px !important;
    text-indent: 0 !important;
    display: block !important;
    transition: background-color 0.2s ease !important;
}

.modal .modal-header .modal-close::before,
.modal-header .modal-close::before,
.modal-close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}

.modal .modal-header .modal-close::after,
.modal-header .modal-close::after,
.modal-close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}

.modal-close:hover {
    background: #e2e8f0 !important;
    transform: scale(1.08) !important;
}

.modal-close:hover::before,
.modal-close:hover::after {
    background-color: #0f172a !important;
}

/* Ciało modala */
.modal-body,
.modal .modal-body {
    padding: 0 !important;
    margin: 0 0 24px 0 !important;
    width: 100% !important;
    overflow: visible !important;
    display: block !important;
}

/* Kontener produktu i podsumowania koszyka */
.ajax-basket-container,
.modal .ajax-basket-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    align-items: stretch !important;
    width: 100% !important;
    position: static !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (max-width: 680px) {

    .ajax-basket-container,
    .modal .ajax-basket-container {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
}

/* Blok dodanego produktu */
.modal .ajax-basket-container .ajax-product-block {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 18px !important;
    background: #f8fafc !important;
    border-radius: 18px !important;
    padding: 18px !important;
    border: 1.5px solid #eef1f6 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block img {
    max-height: 120px !important;
    min-height: 80px !important;
    max-width: 110px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    padding: 6px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    border: 1px solid #f1f5f9 !important;
    flex-shrink: 0 !important;
    float: none !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-grow: 1 !important;
    text-align: left !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info h3 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin: 0 !important;
    line-height: 1.35 !important;
    max-width: 100% !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info span {
    font-size: 14px !important;
    color: #64748b !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

.modal .ajax-basket-container .ajax-product-block .ajax-product-block-info span strong {
    color: #04BBFF !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    margin-left: 4px !important;
}

/* Blok stanu koszyka (ilość + wartość) */
.ajax-cart-block,
.modal .ajax-basket-container .ajax-cart-block {
    position: static !important;
    background: #f8fafc !important;
    border-radius: 18px !important;
    padding: 22px 24px !important;
    border: 1.5px solid #eef1f6 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 0 !important;
    transform: none !important;
    box-shadow: none !important;
    min-height: auto !important;
    max-height: none !important;
}

.modal .ajax-basket-container .ajax-cart-block span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 14.5px !important;
    color: #475569 !important;
    font-weight: 600 !important;
    margin: 0 !important;
    line-height: 1.4 !important;
    border-bottom: 1px dashed #e2e8f0 !important;
    padding-bottom: 8px !important;
}

.modal .ajax-basket-container .ajax-cart-block span:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.modal .ajax-basket-container .ajax-cart-block span strong {
    font-size: 18px !important;
    color: #04BBFF !important;
    font-weight: 900 !important;
    margin-left: 8px !important;
}

/* Stopka modala z przyciskami */
.modal-footer,
.modal .modal-footer {
    padding: 20px 0 0 0 !important;
    margin: 0 !important;
    border-top: 2px solid #f1f5f9 !important;
    display: flex !important;
    width: 100% !important;
    flex-shrink: 0 !important;
}

.modal-footer .ajax-product-block,
.modal .modal-footer .ajax-product-block {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 16px !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 600px) {

    .modal-footer .ajax-product-block,
    .modal .modal-footer .ajax-product-block,
    .modal-footer,
    .modal .modal-footer {
        flex-direction: column-reverse !important;
        gap: 12px !important;
    }
}

/* Przycisk Kontynuuj zakupy w modalu */
.modal .btn,
.modal a.continue,
.modal button.continue,
.modal .modal-close-btn,
.modal-footer .ajax-product-block a.btn:not(.btn-red),
.modal .modal-footer .btn:not(.btn-red) {
    background: #f1f5f9 !important;
    border: 1.5px solid #e2e8f0 !important;
    color: #475569 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 13px 28px !important;
    border-radius: 30px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 !important;
    width: auto !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    margin: 0 !important;
}

.modal .btn:hover,
.modal a.continue:hover,
.modal-footer .ajax-product-block a.btn:not(.btn-red):hover,
.modal .modal-footer .btn:not(.btn-red):hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
}

/* Przycisk Przejdź do koszyka / Do kasy w modalu */
.modal .btn-red,
.modal .btn.btn-red,
.modal a[href*="basket"],
.modal button.forward,
.modal .btn.forward,
.modal-footer .ajax-product-block a.btn.btn-red,
.modal .modal-footer .btn.btn-red {
    background: linear-gradient(135deg, #7b00ff 0%, #04BBFF 100%) !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    padding: 14px 32px !important;
    border-radius: 30px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(123, 0, 255, 0.35) !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1.2 !important;
    width: auto !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    margin: 0 !important;
}

.modal .btn-red:hover,
.modal a[href*="basket"]:hover,
.modal button.forward:hover,
.modal-footer .ajax-product-block a.btn.btn-red:hover,
.modal .modal-footer .btn.btn-red:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(123, 0, 255, 0.55) !important;
    filter: brightness(1.08) !important;
    color: #ffffff !important;
}

/* Przyciemniający overlay tła */
.mask,
.modal-overlay {
    background: rgba(5, 12, 30, 0.65) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    z-index: 10000 !important;
}

/* Responsywność strony kategorii */
@media (max-width: 980px) {

    .centercol .products.viewphot,
    .centercol .products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
}

@media (max-width: 600px) {

    .centercol .products.viewphot,
    .centercol .products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .centercol .products.viewphot .product,
    .centercol .products .product {
        padding: 12px !important;
        min-height: 310px !important;
    }

    .centercol .products.viewphot .product .prodimage,
    .centercol .products .product .boximgsize {
        height: 135px !important;
    }

    .centercol .products.viewphot .product .price em,
    .centercol .products .product .price em {
        font-size: 16px !important;
    }
}

/* Product cards: two-line names with ellipsis and no lowest-price label. */
.product .productnamewrap {
    display: block !important;
    width: 100% !important;
    min-height: 36px !important;
    height: 42px !important;
    max-height: 44px !important;
    overflow: hidden !important;
    margin-bottom: 8px !important;
    text-align: center !important;
}

.product .productname,
.product .prodname {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    height: auto !important;
    max-height: 38px !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.product .price__omnibus,
.product .js__omnibus-price-container {
    display: none !important;
}

/* Product labels, promotion prices and looping slider cards. */
.custom-product-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 4 !important;
    pointer-events: none !important;
}

.custom-product-badge {
    display: inline-block !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

.custom-product-badge--promo {
    background: #e53935 !important;
}

.custom-product-badge--new {
    background: #22a447 !important;
}

.custom-product-badge--bestseller {
    background: #f59e0b !important;
}

.product.custom-promo-product .main-price,
.product.custom-promo-product .price em.color,
.product-main-box .main-price.color {
    color: #e53935 !important;
}

.product.custom-promo-product .price__regular del,
.product-main-box .price__regular del {
    color: #64748b !important;
    text-decoration: line-through !important;
}

/* The slider always has a visible next step when it contains multiple cards. */
.box.slider .slider-nav-left,
.box.slider .slider-nav-right {
    visibility: visible !important;
}

/* Promotion prices in category cards. */
.centercol .products .product.custom-promo-product .price .promo-price,
.centercol .products .product.custom-promo-product .price em.promo-price {
    display: inline-block !important;
    width: auto !important;
    margin: 0 8px 0 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
    order: 2 !important;
}

.centercol .products .product.custom-promo-product .price .promo-old-price,
.centercol .products .product.custom-promo-product .price del.promo-old-price {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: middle !important;
    order: 1 !important;
}

/* Keep the promotional pair together inside the price row. */
.centercol .products .product.custom-promo-product .price .promo-price-row {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.centercol .products .product.custom-promo-product .price>div:first-child {
    white-space: nowrap !important;
}

@media (max-width: 480px) {

    .centercol .products .product.custom-promo-product .price .promo-price,
    .centercol .products .product.custom-promo-product .price em.promo-price {
        font-size: 16px !important;
        margin-right: 5px !important;
    }

    .centercol .products .product.custom-promo-product .price .promo-old-price,
    .centercol .products .product.custom-promo-product .price del.promo-old-price {
        font-size: 11px !important;
    }
}

/* Promotional prices in homepage boxes and sliders. */
.product.custom-promo-product .price_extended {
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.product.custom-promo-product .price_extended>p {
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    border: 0 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) em.color,
.product.custom-promo-product .price_extended>p:not(.price__regular) em.main-price,
.product.custom-promo-product .price_extended>p:not(.price__regular) em {
    display: inline-block !important;
    width: auto !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: baseline !important;
}

.product.custom-promo-product .price_extended>p.price__regular {
    display: inline-block !important;
    width: auto !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    order: 1 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) {
    order: 2 !important;
}

.product.custom-promo-product .price_extended>p.price__regular del,
.product.custom-promo-product .price_extended>p.price__regular .price__inactive {
    display: inline-block !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

@media (max-width: 480px) {

    .product.custom-promo-product .price_extended>p:not(.price__regular) em.color,
    .product.custom-promo-product .price_extended>p:not(.price__regular) em.main-price,
    .product.custom-promo-product .price_extended>p:not(.price__regular) em {
        font-size: 16px !important;
    }

    .product.custom-promo-product .price_extended>p.price__regular del,
    .product.custom-promo-product .price_extended>p.price__regular .price__inactive {
        font-size: 11px !important;
    }
}

/* Direct old price markup used by promotional homepage cards. */
.product.custom-promo-product .price_extended>.promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) {
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.product.custom-promo-product .price_extended>p:not(.price__regular) em.color {
    color: #e53935 !important;
}

/* Promotional price pair in category product cards. */
.products .product.custom-promo-product .price>div:first-child {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

.products .product.custom-promo-product .promo-price {
    display: inline-block !important;
    order: 2 !important;
    width: auto !important;
    margin: 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

@media (max-width: 480px) {
    .products .product.custom-promo-product .promo-price {
        font-size: 16px !important;
    }

    .products .product.custom-promo-product .promo-old-price {
        font-size: 11px !important;
    }
}

/* Final category-card promotion price layout. */
.products .product.custom-promo-product .price .promo-price-row {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .price>div:first-child {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .price .promo-old-price,
.products .product.custom-promo-product .price>div:first-child .promo-old-price {
    display: inline-block !important;
    order: 1 !important;
    width: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    vertical-align: baseline !important;
}

.products .product.custom-promo-product .price .promo-price,
.products .product.custom-promo-product .price>div:first-child .promo-price {
    display: inline-block !important;
    order: 2 !important;
    width: auto !important;
    margin: 0 !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    vertical-align: baseline !important;
}

@media (max-width: 480px) {

    .products .product.custom-promo-product .price .promo-old-price,
    .products .product.custom-promo-product .price>div:first-child .promo-old-price {
        font-size: 11px !important;
    }

    .products .product.custom-promo-product .price .promo-price,
    .products .product.custom-promo-product .price>div:first-child .promo-price {
        font-size: 16px !important;
    }
}

/* Final fix: direct old price in promotional slider cards. */
.box:not(#box_productfull) .product.custom-promo-product .price.price_extended {
    display: flex !important;
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p {
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p>em.color {
    display: inline-block !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>.promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>p {
    order: 2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.hide {
    display: none !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide) {
    display: contents !important;
    order: 2 !important;
}

/* Netto variant: price and old price are wrapped in .price-netto. */
.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide) {
    display: contents !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>p {
    display: block !important;
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>p>em {
    display: inline-block !important;
    color: #e53935 !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.box:not(#box_productfull) .product.custom-promo-product .price.price_extended>span.price-netto:not(.hide)>.promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
}

/* Final visible old price for promotional cards. */
.products .product.custom-promo-product .promo-old-price,
.box:not(#box_productfull) .product.custom-promo-product .promo-old-price {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    margin: 0 8px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    color: #94a3b8 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-decoration: line-through !important;
    white-space: nowrap !important;
}

.products .product.custom-promo-product .promo-price,
.box:not(#box_productfull) .product.custom-promo-product .price_extended>p>em.color {
    color: #e53935 !important;
}

/* Category badges for Magnetic and Maglev products. */
.custom-product-badge--magnetic,
.custom-category-tag--magnetic {
    background: #0840d3 !important;
}

.custom-product-badge--maglev,
.custom-category-tag--maglev {
    background: #7c3aed !important;
}

.custom-product-badge--smart,
.custom-category-tag--smart {
    background: #f08aa8 !important;
    color: #ffffff !important;
}

.product-detail-tags .custom-category-tag,
.productimg .mainimg .custom-category-tag {
    display: inline-block !important;
    padding: 4px 8px !important;
    margin: 0 5px 5px 0 !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

/* Final green color for both New badge markup variants. */
.custom-product-badge--new,
.tags li.new {
    background: #22a447 !important;
    background-color: #22a447 !important;
}

/* ==========================================================================
   NOWA STRONA PRODUKTU (PRODUCT PAGE REDESIGN) - KOSTKOLAND
   ========================================================================== */

/* 1. Główny kontener karty produktu */
body.shop_product #box_productfull,
#box_productfull {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 20px !important;
    padding: 32px !important;
    margin-bottom: 35px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.03) !important;
    position: relative !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

#box_productfull .boxhead,
#box_productfull>.custom-product-badges {
    display: none !important;
    /* Ukryj zewnętrzny duplikat tagów oraz stary pusty boxhead */
}

#box_productfull .innerbox {
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

#box_productfull .maininfo {
    margin: 0 !important;
    padding: 0 !important;
}

/* Wyłączenie clearfixów które w flexboxie stają się osobnymi flex itemami i psują układ 2-kolumnowy */
#box_productfull .maininfo>.f-row::before,
#box_productfull .maininfo>.f-row::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
}

#box_productfull .maininfo>.f-row {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 40px !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productfull .maininfo>.f-row>[class*='grid'] {
    margin-left: 0 !important;
    margin-right: 0 !important;
    float: none !important;
}

/* 2. Lewa kolumna: Galeria produktu */
#box_productfull .productimg,
#box_productfull .productimg.f-grid-6 {
    flex: 0 0 calc(50% - 20px) !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    box-sizing: border-box !important;
}

#box_productfull .productimg .mainimg {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 18px !important;
    padding: 20px !important;
    min-height: 380px !important;
    height: 400px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.02) !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    line-height: normal !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

#box_productfull .productimg .mainimg a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

#box_productfull .productimg .mainimg img {
    max-height: 350px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: block !important;
    margin: 0 auto !important;
}

#box_productfull .productimg .mainimg:hover img {
    transform: scale(1.05) !important;
}

/* Badge tags w lewym górnym rogu zdjęcia */
#box_productfull .productimg .tags,
#box_productfull .productimg .mainimg .custom-product-badges {
    position: absolute !important;
    top: 16px !important;
    left: 16px !important;
    z-index: 10 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    pointer-events: none !important;
}

#box_productfull .productimg .tags li,
#box_productfull .productimg .custom-product-badge {
    border-radius: 20px !important;
    padding: 5px 12px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1.2 !important;
}

#box_productfull .productimg .tags li.promo,
#box_productfull .productimg .custom-product-badge--promo {
    background: #ff4757 !important;
}

#box_productfull .productimg .tags li.new,
#box_productfull .productimg .custom-product-badge--new {
    background: #10b981 !important;
}

#box_productfull .productimg .tags li.bestseller,
#box_productfull .productimg .custom-product-badge--bestseller {
    background: #f59e0b !important;
}

#box_productfull .productimg .tags li.custom-category-tag--magnetic,
#box_productfull .productimg .custom-product-badge--magnetic {
    background: #2563eb !important;
}

#box_productfull .productimg .tags li.custom-category-tag--maglev,
#box_productfull .productimg .custom-product-badge--maglev {
    background: #8b5cf6 !important;
}

#box_productfull .productimg .tags li.custom-category-tag--smart,
#box_productfull .productimg .custom-product-badge--smart {
    background: #ec4899 !important;
}

/* Miniaturki galerii */
#box_productfull .smallgallery {
    margin-top: 14px !important;
    padding: 0 !important;
}

#box_productfull .smallgallery .innersmallgallery ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

#box_productfull .smallgallery .innersmallgallery li {
    width: 64px !important;
    height: 64px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    background: #ffffff !important;
    padding: 4px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

#box_productfull .smallgallery .innersmallgallery li:hover,
#box_productfull .smallgallery .innersmallgallery li.current {
    border-color: #04BBFF !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.25) !important;
    transform: translateY(-2px) !important;
}

#box_productfull .smallgallery .innersmallgallery li img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 6px !important;
}

/* 3. Prawa kolumna: Informacje o produkcie i zakup */
#box_productfull .maininfo>.f-row>.f-grid-6:not(.productimg) {
    flex: 0 0 calc(50% - 20px) !important;
    width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    min-width: 0 !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box !important;
}

/* Główny tytuł produktu (H1) */
#box_productfull h1.name {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 1.3 !important;
    margin: 0 0 16px 0 !important;
    padding: 0 !important;
    border: none !important;
    text-align: center !important;
    word-break: break-word !important;
    display: block !important;
    width: 100% !important;
}



/* Blok ceny */
#box_productfull .bottomborder {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#box_productfull .basket {
    margin: 0 !important;
    padding: 0 !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 8px 0 14px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #64748b !important;
    margin-right: 4px !important;
    display: inline-block !important;
    min-width: auto !important;
}

#box_productfull .basket .price em.main-price {
    font-size: 30px !important;
    font-weight: 900 !important;
    color: #04BBFF !important;
    letter-spacing: -0.5px !important;
    line-height: 1 !important;
    display: inline-block !important;
}

#box_productfull.custom-promo-product .basket .price em.main-price,
#box_productfull .basket .price em.main-price.color {
    color: #ef4444 !important;
}

#box_productfull .basket .price .price__regular {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 0 0 8px !important;
    font-size: 14px !important;
    color: #94a3b8 !important;
}

#box_productfull .basket .price del.price__inactive {
    font-size: 16px !important;
    color: #94a3b8 !important;
    text-decoration: line-through !important;
    font-weight: 600 !important;
    display: inline !important;
}

#box_productfull .js__omnibus-price-container {
    font-size: 11.5px !important;
    color: #64748b !important;
    width: 100% !important;
    margin-top: 4px !important;
    font-weight: 500 !important;
}

/* Opcje wariantów produktu (.stocks) */
#box_productfull .stocks {
    margin: 12px 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

#box_productfull .stocks .f-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    margin: 0 !important;
}

#box_productfull .stocks .label label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.2 !important;
}

#box_productfull .stocks select,
#box_productfull .stocks input[type="text"] {
    width: 100% !important;
    height: 44px !important;
    border-radius: 12px !important;
    border: 1.5px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

#box_productfull .stocks select:focus,
#box_productfull .stocks input[type="text"]:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

/* Pole ilości i Przycisk DO KOSZYKA */
#box_productfull .addtobasket-container,
#box_productfull fieldset.addtobasket-container {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin: 16px 0 10px 0 !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    float: none !important;
    width: auto !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap .number-wrap {
    display: inline-flex !important;
    align-items: center !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

#box_productfull .quantity_wrap input[name="quantity"] {
    width: 60px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    background: #f8fafc !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 44px !important;
    vertical-align: middle !important;
}

#box_productfull .quantity_wrap input[name="quantity"]:focus {
    border-color: #04BBFF !important;
    background: #ffffff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.15) !important;
}

#box_productfull .quantity_wrap .unit {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 48px !important;
    height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
}

#box_productfull .button_wrap,
#box_productfull .basket .button_wrap,
#box_productfull .basket .form-basket .button_wrap {
    flex: 1 1 auto !important;
    float: none !important;
    min-width: 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin: 0 !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
}

#box_productfull button.addtobasket,
#box_productfull .basket .button_wrap button.addtobasket {
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #04BBFF 0%, #009de0 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    border: none !important;
    box-shadow: 0 4px 18px rgba(4, 187, 255, 0.35) !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    line-height: 48px !important;
}

#box_productfull button.addtobasket::before {
    font-family: FontAwesome !important;
    content: '\f07a' !important;
    font-size: 16px !important;
    margin-right: 4px !important;
}

#box_productfull button.addtobasket:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(4, 187, 255, 0.5) !important;
    background: linear-gradient(135deg, #00b4f8 0%, #008cc7 100%) !important;
}

/* Przycisk i Widget InPost Pay (inpost-izi-button) */
#box_productfull inpost-izi-button {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    margin: 4px 0 0 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
    clear: both !important;
    box-sizing: border-box !important;
}

/* Punkty lojalnościowe */
#box_productfull .loyalty_points {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #15803d !important;
    border-radius: 20px !important;
    padding: 5px 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    margin: 0 0 0 12px !important;
    width: auto !important;
    float: none !important;
    vertical-align: middle !important;
}

#box_productfull .basket .button_wrap {
    margin: 0 !important;
    margin-top: 0 !important;
}

/* Sekcja metadanych: ocena, producent, pytania */
#box_productfull .productdetails-more-details {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: none !important;
    padding: 14px 0 0 0 !important;
    margin-top: 14px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
    clear: both !important;
}

#box_productfull .productdetails-more {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px 18px !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

#box_productfull .productdetails-more .evaluation,
#box_productfull .productdetails-more .manufacturer,
#box_productfull .productdetails-more .code {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 13px !important;
    color: #64748b !important;
    margin: 0 !important;
    float: none !important;
}

#box_productfull .productdetails-more em {
    float: none !important;
    margin: 0 !important;
    font-style: normal !important;
    font-weight: 600 !important;
    color: #64748b !important;
}

#box_productfull .productdetails-more .brand {
    font-weight: 700 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}

#box_productfull .productdetails-more .brand:hover {
    color: #04BBFF !important;
}

/* 3. Przyciski akcji pod koszykiem: Dodaj do ulubionych, Zapytaj o produkt, Dodaj opinię */
#box_productfull .productdetails-more-details {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;
    padding-top: 12px !important;
    border-top: 1px solid #f1f5f9 !important;
    box-sizing: border-box !important;
}

#box_productfull .productdetails-more-details .links-q,
#box_productfull .links-q {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

#box_productfull .links-q li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}

#box_productfull .links-q li a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 999px !important;
    padding: 8px 16px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    line-height: 1.2 !important;
    cursor: pointer !important;
}

#box_productfull .links-q li a img.px1 {
    display: none !important;
}

#box_productfull .links-q li a span {
    display: inline-flex !important;
    align-items: center !important;
}

#box_productfull .links-q li a span::before {
    font-family: FontAwesome !important;
    font-size: 13px !important;
    margin-right: 6px !important;
    display: inline-block !important;
    line-height: 1 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

/* Dodaj do ulubionych */
#box_productfull .links-q li.favourite a.addtofav span::before,
#box_productfull .links-q li a.addtofav span::before {
    content: '\f08a' !important;
    color: #f43f5e !important;
}

#box_productfull .links-q li.favourite a.addtofav:hover,
#box_productfull .links-q li a.addtofav:hover {
    background: #fff1f2 !important;
    border-color: #fecdd3 !important;
    color: #e11d48 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(244, 63, 94, 0.18) !important;
}

#box_productfull .links-q li.favourite a.addtofav:hover span::before,
#box_productfull .links-q li a.addtofav:hover span::before {
    content: '\f004' !important;
    color: #e11d48 !important;
    transform: scale(1.1) !important;
}

/* Zapytaj o produkt */
#box_productfull .links-q li.question a.question span::before,
#box_productfull .links-q li a.question span::before {
    content: '\f0e0' !important;
    color: #0284c7 !important;
}

#box_productfull .links-q li.question a.question:hover,
#box_productfull .links-q li a.question:hover {
    background: #f0f9ff !important;
    border-color: #bae6fd !important;
    color: #0284c7 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(2, 132, 199, 0.15) !important;
}

#box_productfull .links-q li.question a.question:hover span::before,
#box_productfull .links-q li a.question:hover span::before {
    transform: scale(1.1) !important;
}

/* Dodaj opinię */
#box_productfull .links-q li.comment a.comment span::before,
#box_productfull .links-q li a.comment span::before {
    content: '\f086' !important;
    color: #04bbff !important;
}

#box_productfull .links-q li.comment a.comment:hover,
#box_productfull .links-q li a.comment:hover {
    background: #f0fdf4 !important;
    border-color: #bbf7d0 !important;
    color: #16a34a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(22, 163, 74, 0.15) !important;
}

#box_productfull .links-q li.comment a.comment:hover span::before,
#box_productfull .links-q li a.comment:hover span::before {
    color: #16a34a !important;
    transform: scale(1.1) !important;
}

/* Poleć znajomemu */
#box_productfull .links-q li.mailfriend a.mailfriend span::before,
#box_productfull .links-q li a.mailfriend span::before {
    content: '\f064' !important;
    color: #8b5cf6 !important;
}

#box_productfull .links-q li.mailfriend a.mailfriend:hover,
#box_productfull .links-q li a.mailfriend:hover {
    background: #f5f3ff !important;
    border-color: #ddd6fe !important;
    color: #7c3aed !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.15) !important;
}

#box_productfull .links-q li.mailfriend a.mailfriend:hover span::before,
#box_productfull .links-q li a.mailfriend:hover span::before {
    transform: scale(1.1) !important;
}

/* 4. Zakładki i moduły na dole strony (.product-modules) */
.product-modules,
.tab-container {
    margin-top: 35px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Pasek nawigacji zakładek - bez poziomego paska przewijania */
.tab-container nav,
.product-modules nav {
    margin-bottom: 24px !important;
    overflow: visible !important;
    width: 100% !important;
}

.tab-container nav ul,
.product-modules nav ul {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border-bottom: 2px solid #f1f5f9 !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

.tab-container nav ul li,
.product-modules nav ul li {
    padding: 12px 22px !important;
    border-radius: 12px 12px 0 0 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border-bottom: 3px solid transparent !important;
    margin-bottom: -2px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
}

.tab-container nav ul li:hover,
.product-modules nav ul li:hover {
    color: #0f172a !important;
}

.tab-container nav ul li.active,
.product-modules nav ul li.active {
    color: #04BBFF !important;
    border-bottom-color: #04BBFF !important;
    font-weight: 800 !important;
    background: transparent !important;
}

.tab-container nav ul li .boxhead,
.product-modules nav ul li .boxhead {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}

.tab-container nav ul li .boxhead h3,
.product-modules nav ul li .boxhead h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    font-weight: inherit !important;
    color: inherit !important;
    border: none !important;
}

/* Treść poszczególnych zakładek (Białe karty z miękkim cieniem) */
.box.tab,
#box_description,
#box_productdeliveries,
#box_productcomments,
#box_productdata {
    background: #ffffff !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 18px !important;
    padding: 32px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02) !important;
    margin-bottom: 30px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.box.tab .boxhead,
#box_description .boxhead,
#box_productdeliveries .boxhead,
#box_productcomments .boxhead,
#box_productdata .boxhead {
    display: none !important;
    /* W trybie zakładek nagłówek jest w nawigacji */
}

/* Opis produktu (#box_description) - wyśrodkowana, estetyczna treść */
#box_description .innerbox,
#box_description .resetcss {
    font-size: 15px !important;
    line-height: 1.75 !important;
    color: #334155 !important;
    text-align: center !important;
    max-width: 960px !important;
    margin: 0 auto !important;
}

#box_description .resetcss p,
#box_description .resetcss div {
    text-align: center !important;
}

#box_description .resetcss h2,
#box_description .resetcss h3,
#box_description .resetcss h4 {
    color: #0f172a !important;
    font-weight: 800 !important;
    margin: 24px auto 12px auto !important;
    text-align: center !important;
}

#box_description .resetcss iframe {
    max-width: 100% !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08) !important;
    margin: 20px auto !important;
    display: block !important;
}

#box_description .resetcss img {
    border-radius: 12px !important;
    max-width: 100% !important;
    height: auto !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
    margin: 15px auto !important;
    display: inline-block !important;
}

/* Dane techniczne / Atrybuty (#box_productdata) */
#box_productdata .product-attributes table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #f1f5f9 !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

#box_productdata .product-attributes tr {
    border-bottom: 1px solid #f1f5f9 !important;
    transition: background 0.15s ease !important;
}

#box_productdata .product-attributes tr:last-child {
    border-bottom: none !important;
}

#box_productdata .product-attributes tr:nth-child(even) {
    background: #f8fafc !important;
}

#box_productdata .product-attributes td.name {
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    background: transparent !important;
    border: none !important;
    width: 40% !important;
    text-align: left !important;
}

#box_productdata .product-attributes td.value {
    padding: 14px 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    background: transparent !important;
    border: none !important;
    text-align: left !important;
}

/* Opinie o produkcie (#box_productcomments) */
#box_productcomments .productcomment {
    background: #f8fafc !important;
    border: 1px solid #eef1f6 !important;
    border-radius: 14px !important;
    padding: 20px 24px !important;
    margin-bottom: 16px !important;
    text-align: left !important;
}

#box_productcomments .productcomment .reviewer {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
}

#box_productcomments .productcomment .date {
    font-size: 12px !important;
    color: #94a3b8 !important;
}

#box_productcomments .productcomment .description {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #334155 !important;
    margin-top: 10px !important;
}

#box_productcomments form {
    background: #ffffff !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 24px !important;
    margin-top: 24px !important;
    text-align: left !important;
}

#box_productcomments form input[type="text"],
#box_productcomments form textarea {
    border-radius: 10px !important;
    border: 1.5px solid #e2e8f0 !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    background: #f8fafc !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#box_productcomments form button[type="submit"] {
    border-radius: 12px !important;
    background: linear-gradient(135deg, #04BBFF 0%, #009de0 100%) !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    padding: 12px 28px !important;
    border: none !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(4, 187, 255, 0.3) !important;
}

/* Responsywność strony produktu (RWD) */
@media (max-width: 768px) {
    #box_productfull {
        padding: 20px 16px !important;
        border-radius: 16px !important;
    }

    #box_productfull .maininfo>.f-row {
        flex-direction: column !important;
        flex-wrap: wrap !important;
        gap: 24px !important;
    }

    #box_productfull .productimg,
    #box_productfull .productimg.f-grid-6,
    #box_productfull .maininfo>.f-row>.f-grid-6:not(.productimg) {
        max-width: 100% !important;
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    #box_productfull .productimg > .addtofav {
        top: 0 !important;
        margin-top: 0 !important;
    }

    #box_productfull .productimg .mainimg {
        min-height: 280px !important;
        height: 300px !important;
    }

    #box_productfull h1.name {
        font-size: 22px !important;
    }

    #box_productfull .basket .price em.main-price {
        font-size: 28px !important;
    }

    .box.tab,
    #box_description,
    #box_productdeliveries,
    #box_productcomments,
    #box_productdata {
        padding: 20px 16px !important;
        border-radius: 14px !important;
    }
}

/* ==========================================================================
   PRODUCT GALLERY FIXES
   ========================================================================== */

/* Keep product thumbnails in one horizontal, touch-scrollable row. */
#box_productfull .smallgallery .innersmallgallery {
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: thin !important;
    overscroll-behavior-x: contain !important;
}

#box_productfull .smallgallery .innersmallgallery ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: 100% !important;
    gap: 10px !important;
}

#box_productfull .smallgallery .innersmallgallery li {
    flex: 0 0 64px !important;
    margin: 0 !important;
}

/* The footer overlay must not cover the page in its idle state. */
.modal-overlay {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Allow the overlay only while the Shoper lightbox is actually open. */
body.shop-gallery-open .modal-overlay,
body:has(.shop-gallery:not(.inactive)) .modal-overlay,
body:has(.shop-gallery.active) .modal-overlay,
body:has(.shop-gallery.visible) .modal-overlay,
body:has(.shop-gallery.modal-visible) .modal-overlay {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* The gallery itself must remain above its backdrop. */
.shop-gallery,
.rwd-gallery {
    z-index: 10001 !important;
}

/* On small screens the row remains horizontal and does not wrap. */
@media (max-width: 768px) {
    #box_productfull .smallgallery .innersmallgallery li {
        flex-basis: 60px !important;
        width: 60px !important;
        height: 60px !important;
    }
}

/* ==========================================================================
   LIGHTBOX PRODUCT GALLERY DESIGN
   ========================================================================== */

/* Rounded lightbox card and clean white image area. */
.shop-gallery {
    z-index: 10001 !important;
}

.shop-gallery .shop-gallery-skin {
    background: #ffffff !important;
    border: 1px solid #e6edf3 !important;
    border-radius: 22px !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.22) !important;
    overflow: visible !important;
    padding-bottom: 18px !important;
}

.shop-gallery .shop-gallery-inner {
    border-top: none !important;
    margin: 0 18px !important;
    overflow: visible !important;
    border-radius: 16px !important;
}

.shop-gallery .shop-gallery-img-container {
    padding: 12px 48px !important;
    background: #ffffff !important;
}

.shop-gallery .shop-gallery-img {
    border-radius: 14px !important;
}

/* Round close button instead of the rectangular "zamknij X" label. */
.shop-gallery .shop-gallery-close {
    top: -18px !important;
    right: -18px !important;
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 38px !important;
    text-align: center !important;
    text-indent: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
    transition: background 0.15s ease !important;
    animation: none !important;
}

.shop-gallery .shop-gallery-close > * {
    display: none !important;
}

.shop-gallery .shop-gallery-close::after {
    content: '\00d7' !important;
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    color: #6b7280 !important;
    font-family: Arial, sans-serif !important;
    font-size: 25px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
}

.shop-gallery .shop-gallery-close:hover {
    background: #ffffff !important;
    border-color: #d9dee5 !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, 0.14) !important;
    transform: scale(1.04) !important;
    animation: none !important;
}

.shop-gallery .shop-gallery-close:hover::after {
    color: #ef4444 !important;
}

/* Smaller circular navigation controls over the image edges. */
.shop-gallery .shop-gallery-nav {
    top: 50% !important;
    bottom: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 5px 16px rgba(15, 23, 42, 0.14) !important;
    color: #1e293b !important;
    transform: translateY(-50%) !important;
    transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease !important;
}

.shop-gallery .shop-gallery-nav:hover {
    background: #ffffff !important;
    color: #04BBFF !important;
    border-color: #04BBFF !important;
    box-shadow: 0 7px 20px rgba(4, 187, 255, 0.3) !important;
    transform: translateY(-50%) scale(1.06) !important;
}

.shop-gallery .shop-gallery-nav::after {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 10px !important;
    height: 10px !important;
    margin: 0 !important;
    border: solid currentColor !important;
    border-width: 0 2px 2px 0 !important;
    display: block !important;
    content: '' !important;
    transform: translate(-50%, -50%) rotate(135deg) !important;
}

.shop-gallery .shop-gallery-nav-prev::after {
    transform: translate(-50%, calc(-50% - 1px)) rotate(135deg) !important;
}

.shop-gallery .shop-gallery-nav-next::after {
    transform: translate(-50%, calc(-50% - 1px)) rotate(-45deg) !important;
}

.shop-gallery .shop-gallery-nav-prev {
    left: 0 !important;
}

.shop-gallery .shop-gallery-nav-next {
    left: auto !important;
    right: 0 !important;
}


/* Rounded thumbnail tray and active image state. */
.shop-gallery .shop-gallery-preview {
    min-width: 0 !important;
    max-width: calc(100% - 36px) !important;
    height: 92px !important;
    margin: 16px auto 0 !important;
    padding: 10px 38px !important;
    border: 1px solid #e6edf3 !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    box-sizing: border-box !important;
}

.shop-gallery .shop-gallery-container {
    height: 70px !important;
    border-radius: 10px !important;
}

.shop-gallery .shop-gallery-item-preview {
    width: 70px !important;
    height: 70px !important;
    margin-right: 7px !important;
    padding: 4px !important;
    border: 2px solid transparent !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.shop-gallery .shop-gallery-item-preview:hover,
.shop-gallery .shop-gallery-item-preview.active {
    border-color: #04BBFF !important;
    border-radius: 10px !important;
    box-shadow: 0 0 0 3px rgba(4, 187, 255, 0.16) !important;
    transform: translateY(-2px) !important;
}

.shop-gallery .shop-gallery-item-preview img {
    border-radius: 6px !important;
}

.shop-gallery .shop-gallery-mini-prev,
.shop-gallery .shop-gallery-mini-next {
    width: 34px !important;
    border-radius: 10px !important;
}

.shop-gallery .shop-gallery-mini-prev::after,
.shop-gallery .shop-gallery-mini-next::after {
    top: 50% !important;
    margin-top: -5px !important;
    border-width: 2px !important;
    border-color: #334155 !important;
}

.shop-gallery .shop-gallery-mini-prev:hover,
.shop-gallery .shop-gallery-mini-next:hover {
    background: rgba(4, 187, 255, 0.1) !important;
}

@media (max-width: 767px) {
    .shop-gallery .shop-gallery-skin {
        border-radius: 16px !important;
        padding-bottom: 12px !important;
    }

    .shop-gallery .shop-gallery-inner {
        margin: 0 10px !important;
        border-radius: 12px !important;
    }

    .shop-gallery .shop-gallery-img-container {
        padding: 8px 38px !important;
    }

    .shop-gallery .shop-gallery-close {
        top: -12px !important;
        right: -12px !important;
        width: 32px !important;
        height: 32px !important;
        line-height: 32px !important;
    }

    .shop-gallery .shop-gallery-close::after {
        line-height: 1 !important;
    }

    .shop-gallery .shop-gallery-nav-prev {
        top: 50% !important;
        left: 0 !important;
        transform: translateY(-50%) !important;
    }

    .shop-gallery .shop-gallery-nav-next {
        top: 50% !important;
        left: auto !important;
        right: 0 !important;
        transform: translateY(-50%) !important;
    }

    .shop-gallery .shop-gallery-preview {
        max-width: calc(100% - 20px) !important;
        border-radius: 12px !important;
    }
}

/* --- Final product information layout --- */

#box_productfull .availability {
    padding: 20px 18px 16px !important;
    gap: 14px !important;
}

#box_productfull .availability > .row > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    justify-items: center !important;
    gap: 4px !important;
}

#box_productfull .availability > .row > .row > .availability {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .availability .second {
    color: #159947 !important;
    font-weight: 800 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    gap: 8px !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second,
#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    justify-self: end !important;
    white-space: nowrap !important;
}

#box_productfull .bottomborder {
    position: relative !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-height: 38px !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    width: auto !important;
    min-width: 0 !important;
}

#box_productfull .basket .form-basket .button_wrap {
    position: relative !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    left: 150px !important;
    bottom: calc(100% + 10px) !important;
    margin: 0 !important;
    white-space: nowrap !important;
    z-index: 3 !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 16px !important;
    padding-top: 14px !important;
}

#box_productfull .productdetails-more,
#box_productfull .links-q {
    align-items: center !important;
}

@media (max-width: 768px) {
    #box_productfull .availability > .row > .row > .shipping-costs {
        grid-template-columns: 1fr !important;
        justify-items: center !important;
        text-align: center !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first,
    #box_productfull .availability > .row > .row > .shipping-costs .second,
    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        justify-self: center !important;
        text-align: center !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 0 !important;
        white-space: normal !important;
    }
}

/* --- Final delivery panel alignment --- */

#box_productfull .availability > .row > .row {
    justify-items: stretch !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability {
    justify-content: flex-start !important;
    justify-items: start !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first::before,
#box_productfull .availability > .row > .row > .shipping-costs .first::before {
    display: inline-block !important;
    width: 22px !important;
    margin-right: 8px !important;
    font-size: 16px !important;
    line-height: 1 !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .availability .first::before {
    content: '\\2713' !important;
    color: #10a768 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first::before {
    content: '\\1F69A' !important;
    filter: grayscale(1) !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    justify-content: initial !important;
    gap: 8px !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first {
    justify-self: start !important;
    text-align: left !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    justify-self: start !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    justify-self: end !important;
    align-items: center !important;
    padding: 6px 10px !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

@media (max-width: 768px) {
    #box_productfull .availability > .row > .row > .shipping-costs {
        grid-template-columns: 1fr auto !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first {
        grid-column: 1 / -1 !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .second {
        grid-column: 1 !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        grid-column: 2 !important;
        grid-row: 2 !important;
    }
}

/* --- Product panel final arrangement --- */

#box_productfull .availability {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
    padding: 18px 18px !important;
    text-align: left !important;
}

#box_productfull .availability > .row {
    display: contents !important;
}

#box_productfull .availability > .row > .row > .availability {
    display: flex !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    flex-direction: column !important;
    gap: 3px !important;
    width: auto !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first::before {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second {
    width: auto !important;
    text-align: center !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 10px !important;
    margin: 2px 0 0 !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

#box_productfull .availability-manufacturer {
    display: flex !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .first {
    width: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    color: #64748b !important;
}

#box_productfull .availability-manufacturer .brand {
    color: #0f172a !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

#box_productfull .productdetails-more .evaluation,
#box_productfull .productdetails-more .manufacturer,
#box_productfull .productdetails-more .voted-message {
    display: none !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 14px !important;
    padding-top: 12px !important;
}

#box_productfull .productdetails-more-details .links-q {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

#box_productfull .basket .form-basket .button_wrap {
    position: static !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 2px !important;
    left: 218px !important;
    bottom: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

@media (max-width: 768px) {
    #box_productfull .availability {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    #box_productfull .availability > .row {
        display: flex !important;
        width: 100% !important;
    }

    #box_productfull .availability > .row > .row > .availability,
    #box_productfull .availability > .row > .row > .shipping-costs,
    #box_productfull .availability-manufacturer {
        width: 100% !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .first,
    #box_productfull .availability > .row > .row > .shipping-costs .second {
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
        align-self: flex-start !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 !important;
        white-space: normal !important;
    }
}

/* --- Stable product details layout --- */

#box_productfull .availability {
    display: grid !important;
    grid-template-columns: minmax(125px, 1fr) minmax(190px, 1.35fr) minmax(90px, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 106px !important;
    padding: 18px 16px !important;
    box-sizing: border-box !important;
}

#box_productfull .availability > .row,
#box_productfull .availability > .row > .row {
    display: contents !important;
}

#box_productfull .availability > .row > .row > .availability {
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    min-width: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .availability .first,
#box_productfull .availability > .row > .row > .availability .second {
    width: auto !important;
    margin: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .availability .second {
    color: #159947 !important;
    font-weight: 800 !important;
}

#box_productfull .availability > .row > .row > .shipping-costs {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid !important;
    grid-template-columns: auto minmax(72px, 1fr) auto !important;
    align-items: center !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first,
#box_productfull .availability > .row > .row > .shipping-costs .second,
#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .first {
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .second {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .lowest-cost-shipping {
    display: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 9px !important;
    border-radius: 8px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}

#box_productfull .availability > .row > .row > .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    color: #ffffff !important;
}

#box_productfull .availability-manufacturer {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: center !important;
    gap: 3px !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .first,
#box_productfull .availability-manufacturer .brand {
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
    text-align: right !important;
}

#box_productfull .availability-manufacturer .brand {
    color: #0f172a !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

#box_productfull .basket .price,
#box_productfull .basket .price-netto {
    position: relative !important;
    display: flex !important;
    align-items: baseline !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    min-height: 40px !important;
    padding-right: 174px !important;
    box-sizing: border-box !important;
}

#box_productfull .basket .price .price-name,
#box_productfull .basket .price-netto .price-name {
    min-width: auto !important;
    width: auto !important;
    white-space: nowrap !important;
}

#box_productfull .basket .price .price__regular,
#box_productfull .basket .price-netto .price__regular {
    margin: 0 !important;
    white-space: nowrap !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 0 !important;
    left: 202px !important;
    bottom: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
    z-index: 4 !important;
}

#box_productfull .productdetails-more-details {
    margin-top: 18px !important;
    padding-top: 14px !important;
}

#box_productfull .productdetails-more-details .links-q {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
}

@media (max-width: 768px) {
    #box_productfull .availability {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        min-height: 0 !important;
    }

    #box_productfull .availability > .row,
    #box_productfull .availability > .row > .row {
        display: flex !important;
        width: 100% !important;
    }

    #box_productfull .availability > .row > .row > .availability,
    #box_productfull .availability > .row > .row > .shipping-costs,
    #box_productfull .availability-manufacturer {
        width: 100% !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    #box_productfull .availability > .row > .row > .shipping-costs {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
    }

    #box_productfull .basket .price,
    #box_productfull .basket .price-netto {
        flex-wrap: wrap !important;
        padding-right: 0 !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 8px 0 0 !important;
        white-space: normal !important;
    }
}

/* ==========================================================================
   POPRAWKI: SZARY BLOK DOSTĘPNOŚCI, PUNKTY LOJALNOŚCIOWE I CENA REGULARNA
   ========================================================================== */

/* 1. Szary prostokąt pod tytułem (1. Dostępność, 2. Producent, 3. Dostawa - 3 równe kolumny w jednym wierszu, wyrównane od góry) */
#box_productfull .product-details-summary,
#box_productfull .availability.row {
    background: #f8fafc !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 16px !important;
    padding: 16px 12px 16px 12px !important;
    margin: 0 0 20px 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    grid-auto-rows: min-content !important;
    row-gap: 6px !important;
    column-gap: 8px !important;
    align-content: center !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

#box_productfull .product-details-summary > .pds-col,
#box_productfull .product-details-summary > div,
#box_productfull .availability.row > .pds-col,
#box_productfull .availability.row > div {
    display: contents !important;
}

/* 1. Dostępność */
#box_productfull .product-details-summary .pds-stock .first,
#box_productfull .availability.row .pds-stock .first { grid-column: 1 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-stock .second,
#box_productfull .availability.row .pds-stock .second { grid-column: 1 !important; grid-row: 2 !important; }

#box_productfull .product-details-summary > .pds-stock img,
#box_productfull .availability.row > .availability img {
    display: none !important;
}

/* 2. Producent (now on the right) */
#box_productfull .product-details-summary .pds-brand .first,
#box_productfull .availability.row .pds-brand .first { grid-column: 3 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-brand .brand,
#box_productfull .availability.row .pds-brand .brand,
#box_productfull .availability-manufacturer .brand { grid-column: 3 !important; grid-row: 2 !important; }

/* 3. Dostawa (now in the center) */
#box_productfull .product-details-summary .pds-shipping .first,
#box_productfull .product-details-summary .pds-delivery .first,
#box_productfull .availability.row .pds-shipping .first,
#box_productfull .availability.row .pds-delivery .first { grid-column: 2 !important; grid-row: 1 !important; }
#box_productfull .product-details-summary .pds-shipping .second,
#box_productfull .product-details-summary .pds-delivery .second,
#box_productfull .availability.row .pds-shipping .second,
#box_productfull .availability.row .pds-delivery .second { grid-column: 2 !important; grid-row: 2 !important; }

/* Pierwszy wiersz (etykiety): DOSTĘPNOŚĆ, PRODUCENT, DOSTAWA - identyczna wysokość i linia bazowa */
#box_productfull .product-details-summary .first,
#box_productfull .availability.row .first {
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 18px !important;
    height: 18px !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    float: none !important;
}

/* Drugi wiersz (wartości): na wyczerpaniu, GAN, od 10,99 zł - identyczna linia i wysokość */
#box_productfull .product-details-summary .pds-stock .second,
#box_productfull .availability.row .pds-stock .second,
#box_productfull .availability.row .availability .second {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #16a34a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
}

#box_productfull .product-details-summary .pds-brand .brand,
#box_productfull .availability.row .pds-brand .brand,
#box_productfull .availability-manufacturer .brand {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
    transition: color 0.2s ease !important;
}

#box_productfull .product-details-summary .pds-brand .brand:hover,
#box_productfull .availability-manufacturer .brand:hover {
    color: #04bbff !important;
}

#box_productfull .product-details-summary .pds-shipping .second,
#box_productfull .product-details-summary .pds-delivery .second,
#box_productfull .availability.row .pds-shipping .second,
#box_productfull .availability.row .shipping-costs .second,
#box_productfull .availability.row .delivery .second {
    font-size: 13.5px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    height: 20px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
}

/* Ukrycie pytajnika (hint) przy dostawie */
#box_productfull .shipping-costs .hint,
#box_productfull .hint {
    display: none !important;
}

#box_productfull .shipping-costs .lowest-cost-shipping,
#box_productfull .shipping-costs .lowest-cost-shipping-country {
    display: none !important;
}

/* Trzeci wiersz (przycisk): sprawdź formy dostawy */
#box_productfull .shipping-costs .showShippingCost {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 6px 0 0 0 !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    background: #04bbff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 6px rgba(4, 187, 255, 0.25) !important;
    float: none !important;
}

#box_productfull .shipping-costs .showShippingCost:hover {
    background: #009de0 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(4, 187, 255, 0.4) !important;
    color: #ffffff !important;
}

/* 2. Ukrycie ceny regularnej dla produktów bez promocji */
#box_productfull .basket .price .price__regular.none,
#box_productfull .basket .price-netto .price__regular.none,
#box_productfull .basket .price .price__regular:has(del:empty),
#box_productfull .basket .price-netto .price__regular:has(del:empty) {
    display: none !important;
}

#box_productfull .basket .price .price__regular:not(.none),
#box_productfull .basket .price-netto .price__regular:not(.none) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 0 0 8px !important;
    font-size: 13.5px !important;
    color: #94a3b8 !important;
}

/* 3. Wyśrodkowanie plakietki z punktami lojalnościowymi względem ceny */
#box_productfull .bottomborder {
    position: relative !important;
}

#box_productfull .basket .form-basket .button_wrap .loyalty_points {
    position: absolute !important;
    top: 14px !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    white-space: nowrap !important;
    z-index: 4 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #15803d !important;
    border-radius: 20px !important;
    padding: 6px 14px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 1px 3px rgba(21, 128, 61, 0.08) !important;
}

/* Responsywność (RWD) dla sekcji dostępności i ceny */
@media (max-width: 768px) {
    #box_productfull .availability.row,
    #box_productfull > .innerbox .availability.row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 14px !important;
    }

    #box_productfull .availability.row > .row {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
    }

    #box_productfull .availability-manufacturer {
        align-items: flex-start !important;
        text-align: left !important;
        border-top: 1px solid #eef2f6 !important;
        padding-top: 8px !important;
    }

    #box_productfull .availability-manufacturer .first,
    #box_productfull .availability-manufacturer .brand {
        text-align: left !important;
    }

    #box_productfull .basket .form-basket .button_wrap .loyalty_points {
        position: static !important;
        margin: 10px 0 0 0 !important;
        white-space: normal !important;
        display: inline-flex !important;
    }
}

/* --- END OF CUSTOM SHOPER THEME STYLES --- */

/* =========================================================================
   MODERN SHOPPING CART REDESIGN (KOSZYK)
   ========================================================================= */

/* 1. Main Container (Karta koszyka) */
#box_basketlist {
    background: #ffffff !important;
    border: 1px solid #eef2f6 !important;
    border-radius: 20px !important;
    padding: 24px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.03) !important;
    margin-bottom: 30px !important;
}

#box_basketlist .boxhead {
    margin-bottom: 20px !important;
    border-bottom: 2px solid #f8fafc !important;
    padding-bottom: 12px !important;
}
#box_basketlist .boxhead h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
}

/* 2. Product Table (Tabela produktów) */
#box_basketlist table.productlist {
    display: table !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important;
    width: 100% !important;
    table-layout: fixed !important;
    border: none !important;
    margin: 0 0 24px 0 !important;
}

#box_basketlist table.productlist thead {
    display: table-header-group !important;
}
#box_basketlist table.productlist tbody {
    display: table-row-group !important;
}
#box_basketlist table.productlist thead tr,
#box_basketlist table.productlist tbody tr {
    display: table-row !important;
}

#box_basketlist table.productlist thead td {
    display: table-cell !important;
    background: transparent !important;
    border: none !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: #64748b !important;
    padding: 12px 8px !important;
    border-bottom: 2px solid #eef2f6 !important;
    white-space: nowrap !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist thead td.name {
    text-align: left !important;
    padding-left: 0 !important;
}

/* Explicit widths applied to BOTH thead and tbody */
#box_basketlist table.productlist .img {
    width: 75px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .name {
    width: auto !important;
    text-align: left !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .time {
    width: 105px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .quantity {
    width: 140px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .price {
    width: 110px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .sum {
    width: 115px !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist .actions {
    width: 55px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* Row styling */
#box_basketlist table.productlist tbody tr {
    background: #f8fafc !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    border-radius: 12px !important;
    transition: background 0.2s ease !important;
}
#box_basketlist table.productlist tbody tr:hover {
    background: #f1f5f9 !important;
}
#box_basketlist table.productlist tbody tr td {
    display: table-cell !important;
    border: none !important;
    padding: 14px 8px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}
#box_basketlist table.productlist tbody tr td:first-child {
    border-radius: 12px 0 0 12px !important;
    padding-left: 12px !important;
}
#box_basketlist table.productlist tbody tr td:last-child {
    border-radius: 0 12px 12px 0 !important;
    padding-right: 12px !important;
}

#box_basketlist table.productlist tbody td.img img {
    border-radius: 8px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    object-fit: contain !important;
    mix-blend-mode: multiply !important;
    display: block !important;
    margin: 0 auto !important;
}

#box_basketlist table.productlist tbody td.name a {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 4px !important;
    line-height: 1.35 !important;
    word-break: break-word !important;
}
#box_basketlist table.productlist tbody td.name a:hover {
    color: #04bbff !important;
}
#box_basketlist table.productlist tbody td.name .variant {
    font-size: 12px !important;
    color: #64748b !important;
    display: block !important;
}

#box_basketlist table.productlist tbody td.time {
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    vertical-align: middle !important;
}

/* Quantity Stepper styling */
#box_basketlist table.productlist tbody td.quantity {
    vertical-align: middle !important;
    text-align: center !important;
}
#box_basketlist table.productlist .quantity-stepper {
    display: inline-flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 2px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist .quantity-stepper .btn-qty {
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: none !important;
    border-radius: 6px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    padding: 0 !important;
    user-select: none !important;
}
#box_basketlist table.productlist .quantity-stepper .btn-qty:hover {
    background: #04bbff !important;
    color: #ffffff !important;
}
#box_basketlist table.productlist .quantity-stepper input {
    width: 36px !important;
    height: 28px !important;
    border: none !important;
    background: transparent !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    padding: 0 !important;
    margin: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}
#box_basketlist table.productlist .quantity-stepper .shaded_inputwrap {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist tbody td.quantity .unit-name {
    font-size: 12px !important;
    color: #64748b !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
    display: inline-block !important;
    font-weight: 600 !important;
}

#box_basketlist table.productlist tbody td.price {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    text-align: center !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
}
#box_basketlist table.productlist tbody td.price .color_dim.line-through {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    display: block !important;
    margin-bottom: 2px !important;
}

#box_basketlist table.productlist tbody td.sum {
    font-size: 15.5px !important;
    font-weight: 800 !important;
    color: #04bbff !important;
    text-align: center !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
}
#box_basketlist table.productlist tbody td.sum em,
#box_basketlist table.productlist tbody td.sum em.color {
    font-style: normal !important;
    color: #04bbff !important;
    font-size: 15.5px !important;
    font-weight: 800 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1.2 !important;
    position: static !important;
    top: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

#box_basketlist table.productlist tbody td.actions {
    text-align: center !important;
    vertical-align: middle !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    color: #94a3b8 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    float: none !important;
    margin: 0 auto !important;
    cursor: pointer !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove:hover {
    background: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #ef4444 !important;
    transform: scale(1.1) !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove span {
    display: none !important;
}
#box_basketlist table.productlist tbody td.actions .prodremove i {
    font-size: 13px !important;
    border: none !important;
    padding: 0 !important;
    color: inherit !important;
}

/* 3. Cart Options Container (Layout dolny) */
#box_basketlist #cart-options {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    margin-top: 24px !important;
}

/* Columns for Delivery and Payment */
#box_basketlist .delivery-container,
#box_basketlist .payment-container {
    flex: 1 1 300px !important;
    background: #f8fafc !important;
    border-radius: 16px !important;
    padding: 20px !important;
    border: 1px solid #eef2f6 !important;
}

#box_basketlist .delivery-container h5,
#box_basketlist .payment-container h5 {
    font-size: 14px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-bottom: 1px solid #eef2f6 !important;
    padding-bottom: 8px !important;
}

/* Delivery/Payment Items (Radio Buttons as Cards) */
#box_basketlist .delivery,
#box_basketlist .payment {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border: 2px solid transparent !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
    margin-bottom: 8px !important;
    cursor: pointer !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.02) !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .delivery:hover,
#box_basketlist .payment:hover {
    border-color: #bae6fd !important;
}
#box_basketlist .delivery.selected,
#box_basketlist .payment.selected {
    border-color: #04bbff !important;
    background: #f0f9ff !important;
}

/* Inactive / Disabled cards */
#box_basketlist .delivery.disabled,
#box_basketlist .payment.disabled,
#box_basketlist .delivery:has(input:disabled),
#box_basketlist .payment:has(input:disabled),
#box_basketlist .delivery.inactive,
#box_basketlist .payment.inactive,
#box_basketlist .delivery_inactive,
#box_basketlist .payment_inactive {
    opacity: 0.35 !important;
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    box-shadow: none !important;
    filter: grayscale(1) !important;
}
#box_basketlist .delivery.disabled *,
#box_basketlist .payment.disabled *,
#box_basketlist .delivery:has(input:disabled) *,
#box_basketlist .payment:has(input:disabled) * {
    cursor: not-allowed !important;
    color: #94a3b8 !important;
}

#box_basketlist .delivery .name,
#box_basketlist .payment .name {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
}
#box_basketlist .delivery .value {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
}

/* Custom Radio button styling */
#box_basketlist .radio-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin: 0 !important;
}

#box_basketlist .radio-wrap input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 100% !important;
    height: 100% !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 2 !important;
}

#box_basketlist .radio-wrap label {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    border: 2px solid #cbd5e1 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
}

#box_basketlist .delivery:hover:not(.disabled) .radio-wrap label,
#box_basketlist .payment:hover:not(.disabled) .radio-wrap label {
    border-color: #04bbff !important;
}

#box_basketlist .delivery.selected .radio-wrap label,
#box_basketlist .payment.selected .radio-wrap label,
#box_basketlist .radio-wrap input[type="radio"]:checked + label {
    border-color: #04bbff !important;
    background: #ffffff !important;
}

#box_basketlist .delivery.selected .radio-wrap label::after,
#box_basketlist .payment.selected .radio-wrap label::after,
#box_basketlist .radio-wrap input[type="radio"]:checked + label::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #04bbff !important;
    display: block !important;
    box-shadow: 0 0 6px rgba(4, 187, 255, 0.4) !important;
}

/* 4. Summary Container */
#box_basketlist .summary-container {
    flex: 1 1 300px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 24px !important;
    border: 2px solid #04bbff !important;
    box-shadow: 0 8px 24px rgba(4, 187, 255, 0.1) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    text-align: left !important;
}

/* Promocode */
#box_basketlist .promocode {
    background: #f8fafc !important;
    border-radius: 12px !important;
    padding: 14px !important;
    display: block !important;
}
#box_basketlist .promocode .checkbox-wrap {
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
}
#box_basketlist .promocode .checkbox-wrap input[type="checkbox"] {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 8px 0 0 !important;
    opacity: 1 !important;
    position: static !important;
    accent-color: #04bbff !important;
}
#box_basketlist .promocode .checkbox-wrap label {
    display: none !important; /* hide fake shoper checkbox */
}
#box_basketlist .promocode .desc {
    display: inline-block !important;
    vertical-align: middle !important;
}
#box_basketlist .promocode .desc label {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #334155 !important;
    cursor: pointer !important;
}
#box_basketlist .promocode .input {
    display: block !important;
    margin-top: 10px !important;
}
#box_basketlist .promocode .input input {
    width: 100% !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}
#box_basketlist .promocode .action {
    display: block !important;
}
#box_basketlist .promocode .action .btn {
    background: #0f172a !important;
    color: #fff !important;
    padding: 10px 16px !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    width: 100% !important;
    margin-top: 8px !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    border: none !important;
    transition: background 0.2s !important;
}
#box_basketlist .promocode .action .btn:hover {
    background: #1e293b !important;
}

/* Recount (Przelicz koszyk) */
#box_basketlist .recount {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #eef2f6 !important;
}
#box_basketlist .recount > span {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}
#box_basketlist .recount .desc {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
}
#box_basketlist .recount .sum em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    font-style: normal !important;
}
#box_basketlist .recount .button,
#box_basketlist .recount #recalc {
    display: block !important;
    width: 100% !important;
    margin: 0 0 6px 0 !important;
}
#box_basketlist .recount #recalc button,
#box_basketlist .recount .button .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 10px 16px !important;
    background: #f1f5f9 !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .recount #recalc button:hover,
#box_basketlist .recount .button .btn:hover {
    background: #04bbff !important;
    border-color: #04bbff !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(4, 187, 255, 0.25) !important;
}

/* Delivery cost line */
#box_basketlist .deliveryhead {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    border-bottom: 1px dashed #eef2f6 !important;
}
#box_basketlist .deliveryhead .cost {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #64748b !important;
}
#box_basketlist .deliveryhead .value em {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    font-style: normal !important;
}

/* To pay (Do zapłaty) */
#box_basketlist .sum {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: none !important;
    background: #f0f9ff !important;
    margin: 8px -24px -24px -24px !important;
    padding: 20px 24px !important;
    border-radius: 0 0 14px 14px !important;
}
#box_basketlist .sum .desc {
    font-size: 16px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    text-transform: uppercase !important;
}
#box_basketlist .sum .value {
    font-size: 24px !important;
    font-weight: 900 !important;
    color: #04bbff !important;
}

/* 5. Buttons Row */
#box_basketlist .buttons {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-top: 16px !important;
    gap: 16px !important;
}

/* Kontynuuj zakupy */
#box_basketlist .buttons .back .btn {
    background: transparent !important;
    border: 2px solid #e2e8f0 !important;
    color: #64748b !important;
    padding: 14px 24px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    transition: all 0.2s ease !important;
}
#box_basketlist .buttons .back .btn:hover {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
}

/* Zamawiam */
#box_basketlist .buttons .forward .btn {
    background: #04bbff !important;
    color: #ffffff !important;
    padding: 16px 40px !important;
    border-radius: 12px !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(4, 187, 255, 0.3) !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}
#box_basketlist .buttons .forward .btn:hover {
    transform: translateY(-2px) !important;
    background: #009de0 !important;
    box-shadow: 0 12px 24px rgba(4, 187, 255, 0.4) !important;
}
/* =========================================
   NEW LOGIN PAGE UI (#box_login)
========================================= */

#box_login {
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08) !important;
    overflow: hidden !important;
    border: 1px solid #f1f5f9 !important;
    padding: 0 !important;
    margin: 40px auto 60px auto !important;
    max-width: 950px !important;
}

#box_login .social-login-buttons {
    background: #f8fafc !important;
    padding: 40px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    text-align: center !important;
}

#box_login .social-login-buttons h3 {
    font-size: 18px !important;
    color: #475569 !important;
    font-weight: 600 !important;
    margin-bottom: 24px !important;
    text-transform: none !important;
}

#box_login .social-login-buttons .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 12px 28px !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
    text-transform: none !important;
    margin: 5px !important;
    border: 1px solid transparent !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

#box_login .social-login-buttons .btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1) !important;
}

#box_login .social-login-buttons p {
    margin-top: 20px !important;
    color: #94a3b8 !important;
}

#box_login .innerbox {
    padding: 50px !important;
}

#box_login .innerbox .f-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 40px !important;
}

#box_login .innerbox .f-grid-6 {
    flex: 1 1 0 !important;
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
}

/* Headings */
#box_login .login-head,
#box_login .register-head {
    font-size: 26px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 30px !important;
    text-transform: none !important;
    border: none !important;
    padding: 0 !important;
}

#box_login .login-head img,
#box_login .register-head img {
    display: none !important;
}

#box_login .login-head span,
#box_login .register-head span {
    background: transparent !important;
    padding: 0 !important;
}

/* Form Elements */
#box_login .login-inner label {
    display: block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    margin-bottom: 8px !important;
}

#box_login .login-inner input[type="text"],
#box_login .login-inner input[type="password"],
#box_login .login-inner input[type="email"] {
    width: 100% !important;
    height: 52px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    background: #f8fafc !important;
    padding: 0 16px !important;
    font-size: 16px !important;
    transition: all 0.3s ease !important;
    margin-bottom: 24px !important;
    box-sizing: border-box !important;
    color: #0f172a !important;
}

#box_login .login-inner input:focus {
    border-color: #04bbff !important;
    box-shadow: 0 0 0 4px rgba(4, 187, 255, 0.1) !important;
    outline: none !important;
    background: #ffffff !important;
}

/* Login Button */
#box_login .login-inner .btn.login {
    width: 100% !important;
    height: 54px !important;
    background: linear-gradient(135deg, #04bbff, #009de0) !important;
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(4, 187, 255, 0.3) !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#box_login .login-inner .btn.login img {
    display: none !important;
}

#box_login .login-inner .btn.login:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 12px 24px rgba(4, 187, 255, 0.4) !important;
    background: linear-gradient(135deg, #00aaff, #008cc9) !important;
}

/* Forgot Password */
#box_login .login-inner p {
    text-align: right !important;
    margin-top: -12px !important;
    margin-bottom: 24px !important;
    font-size: 13px !important;
    color: #64748b !important;
}

/* Align buttons to the bottom (Foolproof Absolute Method) */
#box_login .innerbox .f-row {
    align-items: stretch !important;
}

#box_login .login-inner,
#box_login .register-inner {
    position: relative !important;
    padding-bottom: 70px !important; /* reserve space for buttons */
    display: block !important;
}

#box_login .login-inner .btn.login,
#box_login .register-form {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

#box_login .login-inner fieldset,
#box_login .register-form fieldset {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

#box_login .login-inner p a {
    color: #04bbff !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

#box_login .login-inner p a:hover {
    color: #009de0 !important;
    text-decoration: underline !important;
}

/* Register Section */
#box_login .register-inner p {
    font-size: 15px !important;
    color: #475569 !important;
    margin-bottom: 20px !important;
    line-height: 1.6 !important;
}

#box_login .register-addons {
    list-style: none !important;
    padding: 0 !important;
    margin-bottom: 40px !important;
}

#box_login .register-addons li {
    position: relative !important;
    padding-left: 32px !important;
    margin-bottom: 16px !important;
    font-size: 15px !important;
    color: #334155 !important;
    line-height: 1.5 !important;
}

#box_login .register-addons li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0 !important;
    top: -2px !important;
    color: #04bbff !important;
    font-weight: 900 !important;
    font-size: 18px !important;
}

#box_login .register-inner .btn.register {
    width: 100% !important;
    height: 54px !important;
    background: transparent !important;
    color: #04bbff !important;
    border: 2px solid #04bbff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#box_login .register-inner .btn.register img {
    display: none !important;
}

#box_login .register-inner .btn.register:hover {
    background: #04bbff !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(4, 187, 255, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* Responsive */
@media (max-width: 800px) {
    #box_login .innerbox .f-grid-6 {
        width: 100% !important;
        flex: none !important;
    }
    
    #box_login .innerbox .f-row {
        flex-wrap: wrap !important;
        gap: 40px !important;
    }
    
    #box_login .innerbox {
        padding: 30px 20px !important;
    }
    
    #box_login .social-login-buttons {
        padding: 30px 20px !important;
    }
}