@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

body { font-family: 'Poppins', sans-serif; background: #fcfcfc; margin: 0; }
/* ===== SZEROKOŚĆ JAK NOWOCZESNE E-COMMERCE ===== */
#wrapper .container,
#main .container,
.footer-container .container,
.container {
  max-width: 1520px !important;
  width: 100% !important;
}
.container {
  max-width: 1320px;
}

/* większe ekrany */
@media (min-width: 1400px) {
  .container {
    max-width: 1480px;
  }
}

/* duże monitory */
@media (min-width: 1600px) {
  .container {
    max-width: 1560px;
  }
}

@media (min-width: 992px) {

    #header {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        z-index: 1000;
        background: #fff;
        transition: box-shadow 0.3s ease;
    }

    #header:not([style*="top: -"]) {
        box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    }

    #header .header-top {
        padding: 20px;
        padding-bottom: 0;
        background: #fff;
        border-bottom: 1px solid #eee;
    }

    #header .header-top .container > .row {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Logo */
    #_desktop_logo {
        flex: 0 0 auto;
        margin-right: 30px;
    }

    #_desktop_logo img {
        max-height: 45px;
        width: auto;
    }

    /* Wyszukiwarka */
    .header-top-right {
        display: flex !important;
        align-items: center !important;
        flex-grow: 1 !important;
        justify-content: space-between !important;
    }

    #search_widget {
        flex-grow: 1 !important;
        max-width: none !important;
        margin: 0 30px;
        position: relative;
    }

    #search_widget form {
        display: flex;
        width: 100%;
        background: #f5f5f5;
        border-radius: 25px;
        border: 1px solid #e0e0e0;
        transition: all 0.3s ease;
        position: relative;
        align-items: center;
        padding: 0 !important;
    }

    #search_widget form:hover {
        background: #fff;
        border-color: #2fb13d;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }

    #search_widget i.search {
        position: absolute;
        left: 5px;
        top: 30%;
        transform: translateY(-50%);
        color: #888;
        z-index: 2;
        pointer-events: none;
        line-height: 1;
    }

    #search_widget input[type="text"] {
        background: transparent;
        border: none !important;
        width: 100%;
        height: 40px;
        outline: none !important;
        font-size: 14px;
    }

    /* Ikony użytkownika i koszyka */
    #_desktop_user_info, #_desktop_cart {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        margin-left: 10px;
    }

    .user-info i, .shopping-cart {
        font-size: 26px !important;
        color: #333;
    }
.wishlist-icon {
  margin-left: 15px;
}

.wishlist-icon a {
  color: inherit;
  display: flex;
  align-items: center;
  transition: all 0.25s ease;
}

.wishlist-icon a:hover {
  color: #1b9919;
  transform: scale(1.1);
}
.wishlist-icon i {
  font-size: 22px;
}
    /* Menu Kategorii */
    #_desktop_top_menu {
        order: -1;
        margin-right: 10px;
        position: relative;
    }

    /* Przycisk "Kategorie" */
    .menu-main-link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-weight: 600;
        text-transform: uppercase;
        font-size: 13px;
        letter-spacing: 0.5px;
        color: #fff !important;
        background: #2fb13d;
        text-decoration: none;
        white-space: nowrap;
        padding: 10px 18px;
        border-radius: 8px;
        transition: background 0.2s ease, box-shadow 0.2s ease;
    }

    .menu-main-link::before {
        content: '☰';
        font-size: 15px;
        line-height: 1;
        color: #fff !important;
    }

    .menu-main-link::after {
        content: '▾';
        font-size: 11px;
        line-height: 1;
        color: #fff !important;
        transition: transform 0.25s ease;
    }

    .menu-main-item:hover .menu-main-link {
        background: #259e32;
        box-shadow: 0 4px 14px rgba(47, 177, 61, 0.35);
        color: #fff !important;
    }

    .menu-main-item:hover .menu-main-link::after {
        transform: rotate(-180deg);
    }

    /* Dropdown */
    .menu-sub {
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 100%;
        left: 0;
        margin-top: -20px;
        padding-top: 20px;
        min-width: 260px;
        z-index: 999;
        background: transparent;
        transition: opacity 0.18s ease, visibility 0.18s ease;
    }

    .menu-main-item:hover .menu-sub {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }

    .menu-sub-list {
        list-style: none;
        margin: 0;
        padding: 8px 0;
        background: #fff;
        border-top: 3px solid #2fb13d;
        border-radius: 0 8px 8px 8px;
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    }

    .menu-sub-list li {
        margin: 0;
    }

    .menu-sub-list li + li {
        border-top: 1px solid #f0f0f0;
    }

    .menu-sub-list li a {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 11px 20px;
        font-size: 13.5px;
        font-weight: 500;
        color: #333;
        text-decoration: none;
        transition: background 0.15s ease, color 0.15s ease, padding-left 0.15s ease;
        border-left: 3px solid transparent;
    }

    .menu-sub-list li a:hover {
        background: #f4fdf5;
        color: #2fb13d;
        border-left-color: #2fb13d;
        padding-left: 26px;
    }

    /* Ikonki emoji przy kategoriach — wszystkie 10, zielone, tylko główny poziom */
    .menu-sub-list > li:nth-child(1)  > a::before { content: '💼'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(2)  > a::before { content: '👜'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(3)  > a::before { content: '⚽'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(4)  > a::before { content: '🔧'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(5)  > a::before { content: '💻'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(6)  > a::before { content: '☕'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(7)  > a::before { content: '🎁'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(8)  > a::before { content: '🏆'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(9)  > a::before { content: '👕'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    .menu-sub-list > li:nth-child(10) > a::before { content: '✏️'; font-size: 15px; filter: sepia(1) saturate(3) hue-rotate(90deg); }

    /* Brak ikonek dla podkategorii */
    .menu-sub-sub-list li a::before { content: none !important; }

    .header-nav { display: none !important; }
}


/* ================================================
   MOBILE (<992px) — tylko wygląd menu, bez ruszania layoutu paska
   ================================================ */
@media (max-width: 991px) {

    /* Wyszukiwarka — usuń nadmiarowe odstępy z desktop padding */
    .header-top {
        padding: 8px 12px !important;
    }

    #search_widget {
        margin: 0 !important;
        padding: 0 !important;
    }

    #search_widget form {
        margin: 0 !important;
    }

    /* Animacja hamburgera — trzy kreski → X */
    #menu-icon {
        width: 36px;
        height: 50px !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        position: relative;
        box-sizing: border-box;
    }

    #menu-icon i.material-icons {
        font-size: 0 !important;
        position: relative;
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 2px !important;
        background: #333;
        border-radius: 2px;
        transition: background 0.3s ease;
    }

    #menu-icon i.material-icons::before,
    #menu-icon i.material-icons::after {
        content: '';
        position: absolute;
        left: 0;
        width: 22px;
        height: 2px;
        background: #333;
        border-radius: 2px;
        transition: transform 0.3s ease, top 0.3s ease, bottom 0.3s ease, background 0.3s ease;
    }

    #menu-icon i.material-icons::before { top: -7px; }
    #menu-icon i.material-icons::after  { bottom: -7px; }

    /* Stan otwarty — X w kolorze zielonym */
    #header.is-open #menu-icon i.material-icons {
        background: transparent;
    }

    #header.is-open #menu-icon i.material-icons::before {
        top: 0;
        transform: rotate(45deg);
        background: #2fb13d;
    }

    #header.is-open #menu-icon i.material-icons::after {
        bottom: 0;
        transform: rotate(-45deg);
        background: #2fb13d;
    }

    /* Panel menu — ukryty domyślnie, PS pokazuje przez display */
    #mobile_top_menu_wrapper {
        background: #1e1e1e;
        margin: 0 !important;
        padding: 0 !important;
        border-top: 3px solid #2fb13d;
        animation: slideDown 0.35s ease forwards;
    }

    @keyframes slideDown {
        from { opacity: 0; transform: translateY(-8px); }
        to   { opacity: 1; transform: translateY(0); }
    }



    /* Lista główna */
    #_mobile_top_menu .menu-main {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #_mobile_top_menu .menu-main-item {
        border-bottom: 1px solid #2e2e2e;
    }

    /* Link "Kategorie" — toggle */
    #_mobile_top_menu .menu-main-link {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 14px 16px !important;
        color: #fff !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
        text-transform: uppercase !important;
        letter-spacing: 0.4px !important;
        background: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        gap: 0 !important;
    }

    #_mobile_top_menu .menu-main-link::before {
        content: none !important;
    }

    #_mobile_top_menu .menu-main-link::after {
        content: none !important;
    }

    /* Podmenu — widoczne tylko gdy wrapper otwarty */
    #_mobile_top_menu .menu-sub {
        display: none;
        position: static !important;
        background: #161616;
        margin: 0 !important;
    }

    #mobile_top_menu_wrapper[style*="block"] #_mobile_top_menu .menu-sub {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: none !important;
        overflow: visible !important;
        pointer-events: auto !important;
    }

    /* Wrapper — PS steruje display przez inline style, nie nadpisujemy */

    #_mobile_top_menu .menu-sub-list {
        list-style: none;
        margin: 0;
        padding: 0;
        background: #161616 !important;
        border-top: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    #_mobile_top_menu .menu-sub-list li + li {
        border-top: 1px solid #252525 !important;
    }

    #_mobile_top_menu .menu-sub-list li a {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 11px 16px 11px 28px !important;
        color: #ccc !important;
        font-size: 13px !important;
        font-weight: 400 !important;
        text-decoration: none !important;
        transition: color 0.15s, background 0.15s !important;
        border-left: 3px solid transparent !important;
    }

    #_mobile_top_menu .menu-sub-list li a:hover {
        color: #fff !important;
        background: #222 !important;
        border-left-color: #2fb13d !important;
    }

    /* Ikonki emoji w mobile podmenu — zielone, tylko główny poziom */
    #_mobile_top_menu .menu-sub-list > li:nth-child(1)  > a::before { content: '💼'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(2)  > a::before { content: '👜'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(3)  > a::before { content: '⚽'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(4)  > a::before { content: '🔧'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(5)  > a::before { content: '💻'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(6)  > a::before { content: '☕'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(7)  > a::before { content: '🎁'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(8)  > a::before { content: '🏆'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(9)  > a::before { content: '👕'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }
    #_mobile_top_menu .menu-sub-list > li:nth-child(10) > a::before { content: '✏️'; font-size: 14px; filter: sepia(1) saturate(3) hue-rotate(90deg); }

    /* Brak ikonek dla pod-podkategorii na mobile */
    #_mobile_top_menu .menu-sub-sub-list li a::before { content: none !important; }

    /* Dolna sekcja panelu */
    .js-top-menu-bottom {
        padding: 12px 16px;
        border-top: 1px solid #2e2e2e;
    }
}


/* ================================================
   PODKATEGORIE — desktop flyout + mobile rozwijane
   ================================================ */

/* Desktop — li z dziećmi ma pozycję relative */
@media (min-width: 992px) {
    .menu-sub-list li.has-children {
        position: relative;
    }

    .menu-sub-list li.has-children > a .arrow {
        float: right;
        color: #aaa;
        font-size: 15px;
        transition: color 0.15s;
    }

    .menu-sub-list li.has-children:hover > a .arrow {
        color: #2fb13d;
    }

    /* Panel pod-podkategorii — wysuwa się w prawo */
    .menu-sub-sub-list {
        display: none;
        position: absolute;
        top: 0;
        left: 100%;
        min-width: 220px;
        list-style: none;
        margin: 0;
        padding: 8px 0;
        background: #fff;
        border-top: 3px solid #2fb13d;
        border-radius: 0 8px 8px 8px;
        box-shadow: 0 12px 32px rgba(0,0,0,0.12);
        z-index: 1000;
    }

    .menu-sub-list li.has-children:hover .menu-sub-sub-list {
        display: block;
    }

    .menu-sub-sub-list li + li {
        border-top: 1px solid #f0f0f0;
    }

    .menu-sub-sub-list li a {
        display: block;
        padding: 10px 18px;
        font-size: 13px;
        font-weight: 500;
        color: #333;
        text-decoration: none;
        border-left: 3px solid transparent;
        transition: background 0.15s, color 0.15s, padding-left 0.15s;
    }

    .menu-sub-sub-list li a:hover {
        background: #f4fdf5;
        color: #2fb13d;
        border-left-color: #2fb13d;
        padding-left: 24px;
    }
}

/* Mobile — pod-podkategorie zawsze widoczne, wcięte */
@media (max-width: 991px) {
    #_mobile_top_menu .menu-sub-sub-list {
        display: block !important;
        list-style: none;
        margin: 0;
        padding: 0;
        background: #0e0e0e;
    }

    #_mobile_top_menu .menu-sub-sub-list li + li {
        border-top: 1px solid #1a1a1a;
    }

    #_mobile_top_menu .menu-sub-sub-list li a {
        display: block;
        padding: 9px 16px 9px 44px;
        color: #888;
        font-size: 12px;
        text-decoration: none;
        border-left: 3px solid transparent;
        transition: color 0.15s, background 0.15s;
    }

    #_mobile_top_menu .menu-sub-sub-list li a::before {
        content: '–';
        margin-right: 8px;
        color: #444;
    }

    #_mobile_top_menu .menu-sub-sub-list li a:hover {
        color: #fff;
        background: #1a1a1a;
        border-left-color: #2fb13d;
    }

    /* Podkreślenie kategorii która ma dzieci */
    #_mobile_top_menu .menu-sub-list li.has-children > a {
        color: #fff !important;
        font-weight: 500 !important;
        border-bottom: 1px solid #2e2e2e;
    }
}

/* ===== FOOTER BACKGROUND (STABILNY) ===== */
.footer-container {
  background-color: #1a1f2b; /* fallback */
  background-color: oklch(21% 0.034 264.665);
  padding-top: 50px;
  padding-bottom: 30px;
}

/* ===== HEADINGS ===== */
.footer-container .h3,
.footer-container .h4 {
  color: #ffffff;
  font-weight: 600;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}

/* ===== LINKS ===== */
.footer-container a {
  color: #ffffff;
  text-decoration: none;
  display: inline-block;
  position: relative;
  transition: all 0.25s ease;
}

/* hover (brand green) */
.footer-container a:hover {
  color: #1b9919;
  transform: translateX(2px);
}

/* subtelna linia pod linkiem */
.footer-container a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0%;
  height: 1px;
  background: #1b9919;
  transition: width 0.3s ease;
}

.footer-container a:hover::after {
  width: 100%;
}

/* ===== LISTS ===== */
.footer-container ul {
  padding-left: 0;
}

.footer-container li {
  list-style: none;
  margin-bottom: 6px;
  opacity: 0.85;
  transition: opacity 0.2s ease;
}

.footer-container li:hover {
  opacity: 1;
}

/* ===== GRID SPACING ===== */
.footer-container .row > div {
  margin-bottom: 20px;
}

/* ===== DIVIDER (SUBTELNY) ===== */
.footer-container .row > div:not(:last-child) {
  border-right: 1px solid rgba(255,255,255,0.05);
}

/* ===== CONTACT BLOCK ===== */
.contact-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 10px;
}

.contact-item a {
  color: #ffffff;
}

/* ===== ICONS (OUTLINE + HOVER) ===== */
.contact-icon {
  font-size: 18px;
  color: transparent;
  -webkit-text-stroke: 1px #ffffff;
  min-width: 20px;
  transition: all 0.2s ease;
}

.contact-item:hover .contact-icon {
  -webkit-text-stroke: 1px #1b9919;
  transform: scale(1.1);
}

/* ===== MY ACCOUNT ===== */
#block_myaccount_infos .account-list {
  margin-top: 10px;
  padding-left: 0;
}

#block_myaccount_infos .account-list li {
  list-style: none;
  margin-bottom: 6px;
}

#block_myaccount_infos .account-list a {
  color: #ffffff;
  display: inline-block;
  transition: all 0.25s ease;
}

#block_myaccount_infos .account-list a:hover {
  color: #1b9919;
  transform: translateX(2px);
}

/* ===== LOGO ===== */
.footer-container .logo-footer {
  margin-top: 30px;
  opacity: 0.9;
}

.footer-container .text-sm-center {
  margin-top: 20px;
}
/* ===== UNIFIKACJA WSZYSTKICH LINKÓW W FOOTERZE ===== */
.footer-container a,
.footer-container a:visited,
.footer-container a:active,
.footer-container a:focus,
.footer-container .myaccount-title a,
.footer-container .account-list a,
.footer-container .block-contact a {
  color: #ffffff !important;
  text-decoration: none;
}

/* hover dla wszystkiego */
.footer-container a:hover {
  color: #1b9919 !important;
}
/* usuwa animacje tylko */
.footer-container a img.logo-footer {
  transition: none !important;
}

.footer-container a:hover img.logo-footer {
  transform: none !important;
}
/* ===== WISHLIST HEADER ICON ===== */
/* Wspólne style dla ikon */
#_desktop_user_info a,
#_desktop_cart .cart-main-link {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
  position: relative;
}

/* Ikony */
#_desktop_user_info i,
#_desktop_cart i {
  font-size: 24px;
  transition: all 0.25s ease;
  color: #333;
}

/* HOVER – główny efekt */
#_desktop_user_info a:hover i,
#_desktop_cart .cart-main-link:hover i {
  color: #1b9919;
  transform: scale(1.15);
}

/* Subtelne podbicie całego klikalnego obszaru */
#_desktop_user_info a:hover,
#_desktop_cart .cart-main-link:hover {
  transform: translateY(-2px);
}

/* Licznik koszyka (badge) */
#_desktop_cart .cart-products-count {
  position: absolute;
  top: -6px;
  right: -11px;
  background: #1b9919;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  padding: 0px 6px;
  border-radius: 50%;
  border: 2px solid #fff;
  transition: all 0.25s ease;
}

/* Hover dla licznika */
#_desktop_cart .cart-main-link:hover .cart-products-count {
  transform: scale(1.1);
  background: #1b9919;
}

/* Opcjonalny efekt "glow" */
#_desktop_user_info a:hover i,
#_desktop_cart .cart-main-link:hover i {
  text-shadow: 0 0 8px rgba(27, 153, 25, 0.4);
}

.js-footer,#blockEmailSubscription_displayFooterBefore {
	background: #1b9919; 
}
.block_newsletter #block-newsletter-label, .block_newsletter form .row .col-xs-12:last-of-type p, .block_newsletter form .row .col-xs-12:last-of-type .page-content.page-cms ul, .page-content.page-cms .block_newsletter form .row .col-xs-12:last-of-type ul {
	color: white;
}
#footer .btn-primary {
	color: #1b9919;
	background-color: white;
}
.page-authentication #content, .page-registration #content {
	max-width: unset;
}
.btn-primary a {
	color: white;
}
/* ===== BUTTON FIX (BUTTON + LINK) ===== */
.btn-secondary {
  background-color: white;
  border: 2px solid #1b9919;
  padding: 0; /* usuwa podwójny padding */
}

/* link jako pełny button */
.btn-secondary a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 10px 16px; /* dopasuj do motywu */
  color: #1b9919;
  text-decoration: none;
  text-align: center;
}

/* HOVER NA CAŁYM BUTTONIE */
.btn-secondary:hover {
  background-color: #1b9919;
}

/* ZMIANA KOLORU TEKSTU PRZY HOVER BUTTONA */
.btn-secondary:hover a {
  color: #ffffff;
}

/* dodatkowo hover na link (bezpiecznie) */
.btn-secondary a:hover {
  color: #ffffff;
}
.js-content-wrapper {
	padding-right: unset;
	padding-left: unset;
	border-radius: 8px;
	border: 1px solid #e5e5e5;
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	background: #fff;
	overflow: hidden;
	margin-bottom:1rem;
}

/* =========================
   GRID – 5 produktów
========================= */
.products {
  display: flex;
  flex-wrap: wrap;
}

.products .product {
  display: flex;
}

@media (min-width: 1200px) {
  .products .product {
    width: calc(20% - 16px);
    flex: 0 0 calc(20% - 16px);
  }
}

@media (max-width: 1199px) {
  .products .product {
    width: calc(25% - 15px);
    flex: 0 0 calc(25% - 15px);
  }
}

@media (max-width: 768px) {
  .products .product {
    width: calc(50% - 10px);
    flex: 0 0 calc(50% - 10px);
  }
}
.products .product {
  margin-bottom: 20px;
}
/* =========================
   KARTA – RÓWNE WYSOKOŚCI
========================= */
.product-miniature {
  display: flex;
  width: 100%;
}

.thumbnail-container {
  position: relative;
  width: 100%;
  background: #fff;
  border-radius: 14px;
  padding: 10px;
  padding-bottom: 70px; /* miejsce na badge */
}

/* =========================
   HOVER
========================= */
.product-miniature {
  transition: all 0.3s ease;
}

.product-miniature:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.15);
}

/* =========================
   OBRAZEK
========================= */
.product-thumbnail img {
  transition: transform 0.4s ease;
}

.product-miniature:hover .product-thumbnail img {
  transform: scale(1.05);
}

/* =========================
   WARIANTY – NAD BADGE
========================= */
.plist_attribute_images {
  position: relative;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 3px;
  margin-bottom: unset;
}

/* usuwa kwadrat */
.plist_attribute_images .color_pick {
  display: inline-block !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
}

/* kółka */
.plist_attribute_images .color_pick span {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: block;
  border: 1px solid #ddd;
}

/* =========================
   BADGE – PRAWDZIWY DÓŁ
========================= */
.shipping-24h-badge {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}

.delivery-time {
  background: #1b9919;
  color: #fff;
  text-align: center;
  padding: 12px;
  font-size: 14px;
  font-weight: 600;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

/* =========================
   FIXY PRESTY
========================= */
.plist_attribute_images {
  background: unset !important;
  box-shadow: unset !important;
}

.product-miniature .thumbnail-container:hover .product-description::after {
  display: none;
}
.plist_attribute_images a {
	margin: unset;
}
/* =========================
   BUTTON BASE
========================= */
.wishlist-button-add {
  position: absolute;
  top: 10px;
  right: 10px;

  width: 36px;
  height: 36px;

  border-radius: 50%;
  border: none;
  background: #fff;

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;

  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: all 0.25s ease;
}

/* ikona */
.wishlist-button-add i {
  font-size: 20px;
  color: #666;
  transition: all 0.25s ease;
}

/* =========================
   HOVER
========================= */
.wishlist-button-add:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

.wishlist-button-add:hover i {
  color: #e60023; /* ❤️ czerwony */
}

/* =========================
   ACTIVE (klik)
========================= */
.wishlist-button-add:active {
  transform: scale(0.9);
}

/* =========================
   PO DODANIU (opcjonalne)
========================= */
.wishlist-button-add.active {
  background: #ffe6ea;
}

.wishlist-button-add.active i {
  color: #e60023;
}
.wishlist-button-add:hover i {
  transform: scale(1.2);
}
.wishlist-button-add {
	box-shadow: unset!important;
	background-color: unset!important;
}
.product-container {
  background: #fff;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.06);
  margin-bottom: 40px;
}
.product-cover {
  background: #f9f9f9;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}

.product-cover img {
  max-height: 420px;
  object-fit: contain;
}
.product-images {
  display: flex;
  gap: 10px;
  margin-top: 15px;
  justify-content: center;
}

.product-images img {
  border-radius: 8px;
  border: 2px solid transparent;
  transition: 0.2s;
  cursor: pointer;
}

.product-images img:hover,
.product-images .selected {
  border-color: #1b9919;
}
h1.h1 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 5px;
}

h3.h3 {
  font-size: 14px;
  color: #777;
  margin-bottom: 20px;
}
.product-price > div:last-child {
  background: #1b9919;
  border-radius: 10px;
  padding: 14px 20px;
  color: #fff;
  min-width: 200px;
  text-align: center;
  box-shadow: 0 6px 14px rgba(27,153,25,0.25);
}

.product-price strong {
  font-size: 20px;
}

.product-price small {
  font-size: 12px;
  opacity: 0.8;
}
.qty-tiles {
  display: flex;
  gap: 15px;
  align-items: stretch;
  margin-top: 20px;
}

.qty-tiles .discount-item {
  background: #f7f7f7;
  padding: 12px;
  border-radius: 10px;
  min-width: 120px;
  text-align: center;
}

.qty-tiles .header {
  font-size: 12px;
  color: #888;
  margin-bottom: 5px;
}

.qty-input {
  text-align: center;
  font-weight: 600;
}
.add-to-cart {
  background: #1b9919;
  border: none;
  border-radius: 10px;
  padding: 14px 20px;
  font-weight: 600;
  transition: 0.2s;
  box-shadow: 0 6px 12px rgba(27,153,25,0.25);
}

.add-to-cart:hover {
  background: #157d14;
  transform: translateY(-2px);
}
@media (max-width: 768px) {
  .product-container {
    padding: 15px;
  }

  .product-price {
    flex-direction: column;
    gap: 15px;
  }

  .qty-tiles {
    flex-direction: column;
  }
}

/* ===== GRID ===== */
.product-variants ul {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
  overflow: visible;
}

/* ===== ITEM ===== */
.product-variants .input-container {
  position: relative;
}

/* ===== LABEL = kafelek ===== */
.product-variants label {
  display: block;
  cursor: pointer;
  border: 2px solid #e0e0e0;
  border-radius: 8px;
  overflow: hidden;
  transition: 0.2s;
}

/* ===== IMG ===== */
.product-variants img {
  display: block;
  border-radius: 6px;
}

/* ===== HOVER (jak miniaturki) ===== */
.product-variants label:hover {
  border-color: #1b9919;
}

/* ===== ACTIVE (Prestashop way) ===== */
.product-variants label:has(.plp_replacement_checked) {
  border: 2px solid #1b9919 !important;
  border-radius: 6px;
}
.product-variants .plp_replacement_checked {
  border: none !important;
}

/* ===== TOOLTIP ===== */
.product-variants .radio-label {
  position: absolute;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
  
  background: #000;
  color: #fff;
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 6px;
  white-space: nowrap;

  opacity: 0;
  pointer-events: none;
  transition: 0.2s ease;
  z-index: 10;
}

/* pokazanie na hover */
.product-variants label:hover .radio-label {
  opacity: 1;
  bottom: -34px;
}

/* strzałka */
.product-variants .radio-label::after {
  content: "";
  position: absolute;
  top: -4px;
  left: 50%;
  transform: translateX(-50%);
  
  border-width: 4px;
  border-style: solid;
  border-color: transparent transparent #000 transparent;
}

/* ===== MOBILE ONLY ===== */
@media (max-width: 768px) {

  /* wrapper */
  .static-discounts-wrapper {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 12px;
    padding-bottom: 8px;
    position: relative;

    -webkit-overflow-scrolling: touch;

    /* ukrycie scrollbar */
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .static-discounts-wrapper::-webkit-scrollbar {
    display: none;
  }

  /* item */
  .static-discounts-wrapper .discount-item {
    flex: 0 0 auto;
  }

  /* opcjonalnie snap */
  .static-discounts-wrapper {
    scroll-snap-type: x mandatory;
  }

  .static-discounts-wrapper .discount-item {
    scroll-snap-align: start;
  }
}
/* wrapper */
.personalization-trigger-wrapper {
  margin-top: 20px;
}

/* button */
.btn-personalize {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  width: 100%;
  padding: 14px 18px;

  background: #f5f7f5;
  color: #1b9919;

  border: 2px dashed #1b9919;
  border-radius: 10px;

  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.3px;

  cursor: pointer;
  transition: all 0.25s ease;

  position: relative;
}

/* ikona */
.btn-personalize i {
  font-size: 20px;
  line-height: 1;
}

/* hover */
.btn-personalize:hover {
  background: #1b9919;
  color: #fff;
  border-style: solid;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(27,153,25,0.25);
}

/* active (klik) */
.btn-personalize:active {
  transform: translateY(0);
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* focus (accessibility) */
.btn-personalize:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(27,153,25,0.2);
}
/* ===== WRAPPER ===== */
#product-customizations-box {
  margin-top: 15px;
}

/* ===== CARD ===== */
.product-customization .card {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  border: 1px solid #eee;
  box-shadow: 0 6px 20px rgba(0,0,0,0.05);
}

/* ===== TYTUŁ ===== */
.product-customization .card-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 5px;
}

.product-customization h6 {
  font-size: 13px;
  color: #777;
  margin-bottom: 20px;
}

/* ===== LISTA ===== */
.product-customization ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.product-customization-item {
  margin-bottom: 20px;
}

/* ===== LABEL ===== */
.product-customization label {
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
}

/* ===== TEXTAREA ===== */
.product-message {
  width: 100%;
  min-height: 90px;
  border-radius: 8px;
  border: 1px solid #ddd;
  padding: 10px;
  font-size: 14px;
  resize: vertical;
  transition: 0.2s;
}

.product-message:focus {
  border-color: #1b9919;
  outline: none;
  box-shadow: 0 0 0 2px rgba(27,153,25,0.15);
}

/* ===== FILE INPUT ===== */
.custom-file {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f9f9f9;
  padding: 8px;
  border-radius: 8px;
  border: 1px dashed #ddd;
}

/* nazwa pliku */
.js-file-name {
  flex: 1;
  font-size: 13px;
  color: #666;
}

/* ukrycie natywnego inputa */
.file-input {
  display: none;
}

/* przycisk upload */
.custom-file .btn {
  background: #1b9919;
  border: none;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  transition: 0.2s;
}

.custom-file .btn:hover {
  background: #157d14;
}

/* ===== SMALL INFO ===== */
.product-customization small {
  display: block;
  font-size: 12px;
  color: #888;
  margin-top: 4px;
  text-align: right;
}

/* ===== BUTTON SAVE ===== */
.product-customization button[name="submitCustomizedData"] {
  background: #1b9919;
  border: none;
  border-radius: 10px;
  padding: 12px 18px;
  font-weight: 600;
  transition: 0.2s;
  box-shadow: 0 6px 14px rgba(27,153,25,0.25);
}

.product-customization button[name="submitCustomizedData"]:hover {
  background: #157d14;
  transform: translateY(-2px);
}

/* ===== WYŚRODKOWANIE ===== */
.qty-discount-tile .gross-price {
  display: flex;
  justify-content: center;
}

/* ===== WRAPPER ===== */
.bootstrap-touchspin {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

/* ===== ROZBICIE TOUCHSPIN ===== */
.bootstrap-touchspin .input-group-btn-vertical {
  display: contents !important;
}

/* ===== INPUT ===== */
.bootstrap-touchspin .qty-input {
  width: 60px;
  height: 44px;
  border: none;
  text-align: center;
  font-weight: 600;
  font-size: 16px;
  background: #fff;
}

/* usuń natywne strzałki */
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.qty-input[type=number] {
  -moz-appearance: textfield;
}

/* ===== PRZYCISKI ===== */
.bootstrap-touchspin .btn-touchspin {
  width: 44px;
  height: 44px;
  border: none;
  background: #f5f7f5;
  color: #1b9919;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
  font-weight: 600;
  line-height: 1;

  transition: 0.2s;
}

/* MINUS LEWA */
.bootstrap-touchspin .bootstrap-touchspin-down {
  order: -1;
  border-right: 1px solid #eee;
}

/* PLUS PRAWA */
.bootstrap-touchspin .bootstrap-touchspin-up {
  order: 1;
  border-left: 1px solid #eee;
}

/* hover */
.bootstrap-touchspin .btn-touchspin:hover {
  background: #1b9919;
  color: #fff;
}

/* ===== IKONY FIX ===== */
.bootstrap-touchspin .material-icons {
  display: none !important;
}

/* dodajemy własne znaki */
.bootstrap-touchspin .bootstrap-touchspin-down::before {
  content: "−";
}

.bootstrap-touchspin .bootstrap-touchspin-up::before {
  content: "+";
}

/* ===== FOCUS ===== */
.bootstrap-touchspin:focus-within {
  border-color: #1b9919;
  box-shadow: 0 0 0 2px rgba(27,153,25,0.15);
}
.product-quantity #quantity_wanted {
  background-color: #f5f7f5;
	min-width: 55px;
}
.bootstrap-touchspin input.form-control, .bootstrap-touchspin input.input-group {
	border: 1px solid #eee;
}

/* ===== WRAPPER ===== */
.product-extra-boxes {
  display: flex;
  gap: 12px;
  margin-top: 20px;
  flex-wrap: wrap;
}

/* ===== BOX = dokładnie jak discount-item ===== */
.total-price-box,
.shipping-box {
  background: #f7f7f7;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid #ddd;
  min-width: 120px;
  text-align: center;

  flex: 1;
}

/* ===== HEADER (jak .header) ===== */
.total-price-box::before {
  content: "Podsumowanie";
  display: block;
  font-size: 12px;
  color: #888;
  margin-bottom: 5px;
}

.shipping-box strong {
  display: block;
  font-size: 12px;
  color: #888;
  margin-bottom: 5px;
  font-weight: normal;
}

/* ===== PRICE LINES ===== */
.price-line {
  font-size: 13px;
  margin-bottom: 4px;
}

/* etykiety */
.price-line strong {
  font-weight: normal;
  color: #666;
}

/* wartości */
.price-line span {
  font-weight: 600;
  color: #222;
}

/* brutto lekko wyróżnione */
#total-product-price {
  color: #1b9919;
  font-weight: 700;
}

/* wysyłka mniejsza */
.shipping-line span {
  font-size: 12px;
  color: #666;
}

/* ===== DATA ===== */
#delivery-date {
  font-size: 13px;
  font-weight: 600;
  color: #1b9919;
}
/* ===== MODAL WRAPPER ===== */
.modal-content {
  border-radius: 14px;
  border: none;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}

/* ===== HEADER ===== */
.modal-header {
  border-bottom: 1px solid #f0f0f0;
  padding: 18px 20px;
  text-align: center;
  position: relative;
}

/* ikona check */
.modal-header .material-icons {
  color: #1b9919;
  margin-right: 6px;
  font-size: 20px;
}

/* tytuł */
.modal-title {
  font-size: 15px;
  font-weight: 600;
  color: #333;
}

/* close */
.modal-header .close {
  position: absolute;
  right: 15px;
  top: 15px;
  opacity: 0.6;
  transition: 0.2s;
}

.modal-header .close:hover {
  opacity: 1;
}

/* ===== BODY ===== */
.modal-body {
  padding: 25px;
}

/* separator */
.divide-right {
  border-right: 1px solid #f0f0f0;
}

/* ===== PRODUKT ===== */
.product-image {
  border-radius: 10px;
  background: #f7f7f7;
  padding: 10px;
}

.product-name {
  font-weight: 600;
  margin-bottom: 5px;
}

.product-price {
  color: #1b9919;
  font-weight: 700;
  margin-bottom: 8px;
}

/* detale */
.kolor,
.product-quantity {
  font-size: 13px;
  color: #666;
}

/* ===== PRAWA STRONA ===== */
.cart-content {
  padding-left: 20px;
}

/* ilość produktów */
.cart-products-count {
  font-size: 13px;
  color: #888;
  margin-bottom: 15px;
}

/* linie cen */
.cart-content p {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  margin-bottom: 6px;
}

/* label */
.cart-content .label {
  color: #666;
}

/* wartości */
.cart-content .value {
  font-weight: 600;
}

/* dostawa */
.shipping.value {
  color: #1b9919;
  font-weight: 600;
}

/* total */
.product-total {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #eee;
  font-size: 15px;
}

.product-total .value {
  color: #1b9919;
  font-weight: 700;
}

/* ===== BUTTONY ===== */
.cart-content-btn {
  margin-top: 20px;
  display: flex;
  gap: 10px;
}

/* kontynuuj */
.btn-secondary {
  flex: 1;
  background: #fff;
  border: 1px solid #ddd;
  color: #333;
  border-radius: 8px;
  padding: 10px;
  transition: 0.2s;
}

.btn-secondary:hover {
  border-color: #1b9919;
  color: #1b9919;
}

/* do kasy */
.btn-primary {
  flex: 1;
  background: #1b9919;
  border: none;
  border-radius: 8px;
  padding: 10px;
  font-weight: 600;
  transition: 0.2s;
}

.btn-primary:hover {
  background: #157d14;
}

/* ===== RESPONSYWNOŚĆ ===== */
@media (max-width: 768px) {

  .divide-right {
    border-right: none;
    border-bottom: 1px solid #eee;
    margin-bottom: 15px;
    padding-bottom: 15px;
  }

  .cart-content {
    padding-left: 0;
  }

  .cart-content-btn {
    flex-direction: column;
  }
}
#cart .js-content-wrapper {
border-radius: unset;
border: unset;
box-shadow: unset;
background: unset;
}

/* ===== WRAPPER ===== */
.custom-qty-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  height: 44px !important;
  width: auto !important;
}

/* ===== INPUT ===== */
.custom-qty-wrapper input {
  width: 50px !important;
  height: 44px;
  border: none;
  text-align: center;
  font-weight: 600;
  font-size: 15px;
  background: #fff;
}

/* ===== BUTTONY ===== */
.custom-qty-wrapper a {
  width: 44px !important;
  height: 44px !important;

  display: flex !important;
  align-items: center;
  justify-content: center;

  background: #f5f7f5;
  color: #1b9919 !important;

  text-decoration: none;
  font-size: 18px;
  font-weight: 600;

  transition: 0.2s;
}

/* ===== USUWAMY IKONY ===== */
.custom-qty-wrapper i {
  display: none !important;
}

/* ===== MINUS ===== */
.custom-qty-wrapper a:first-child::before {
  content: "−";
}

/* ===== PLUS ===== */
.custom-qty-wrapper a:last-child::before {
  content: "+";
}

/* ===== BORDERY ===== */
.custom-qty-wrapper a:first-child {
  border-right: 1px solid #eee;
}

.custom-qty-wrapper a:last-child {
  border-left: 1px solid #eee;
}

/* ===== HOVER ===== */
.custom-qty-wrapper a:hover {
  background: #1b9919;
  color: #fff !important;
}

/* ===== FOCUS (jak PDP) ===== */
.custom-qty-wrapper:focus-within {
  border-color: #1b9919;
  box-shadow: 0 0 0 2px rgba(27,153,25,0.15);
}
.badge-grawer-gratis {
  position: absolute;
  top: 10px;
  left: 10px;
  background: linear-gradient(135deg, #1b9919, #34c759);
  color: #fff;
  padding: 6px 10px;
  border-radius: 8px;
  font-family: 'Arial', sans-serif;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.1;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Główny napis */
.badge-grawer-gratis span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* Podtytuł */
.badge-grawer-gratis small {
  font-size: 10px;
  opacity: 0.9;
}

/* Hover efekt */
.thumbnail-container:hover .badge-grawer-gratis {
  transform: scale(1.05);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
}

/* Opcjonalnie: lekki efekt "shine" */
.badge-grawer-gratis::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,0.2),
    rgba(255,255,255,0.6),
    rgba(255,255,255,0.2)
  );
  transform: skewX(-25deg);
  transition: left 0.6s ease;
}

.thumbnail-container:hover .badge-grawer-gratis::after {
  left: 125%;
}
@media only screen and (min-width: 768px) {
    .ui-autocomplete.searchbar-autocomplete {
	z-index: 9999;
}
}
.menu-main {
	margin-top: 15px;
}

/* ===== KROKI CHECKOUT ===== */
.checkout-step {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #eee;
  margin-bottom: 15px;
  overflow: hidden;
}

/* aktywny krok */
.checkout-step.-current {
  border-color: #1b9919;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* header */
.step-title {
  padding: 18px 20px;
  background: #f7f7f7;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* numer kroku */
.step-number {
  background: #1b9919;
  color: #fff;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}

/* content */
.checkout-step .content {
  padding: 20px;
}

/* ===== TABS ===== */
.nav-inline {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 20px;
}

.nav-inline .nav-link {
  padding: 8px 14px;
  border-radius: 8px;
  background: #f5f5f5;
  color: #666;
  font-size: 13px;
  transition: 0.2s;
}

.nav-inline .nav-link.active {
  background: #1b9919;
  color: #fff;
}

/* ===== FORM ===== */
.form-group {
  margin-bottom: 18px;
}

/* label */
.form-control-label {
  font-size: 13px;
  font-weight: 500;
  color: #666;
}

/* input */
.form-control {
  border-radius: 8px;
  border: 1px solid #ddd;
  height: 42px;
  transition: 0.2s;
}

/* focus */
.form-control:focus {
  border-color: #1b9919;
  box-shadow: 0 0 0 2px rgba(27,153,25,0.15);
}

/* helper text */
.form-control-comment {
  font-size: 12px;
  color: #999;
}

/* ===== RADIO / CHECKBOX ===== */
.custom-radio input:checked + span,
.custom-checkbox input:checked + span {
  background: #1b9919;
  border-color: #1b9919;
}

/* ===== PASSWORD BUTTON ===== */
.input-group-btn .btn {
  border-radius: 0 8px 8px 0;
  background: #f5f5f5;
  border: 1px solid #ddd;
}

/* ===== BUTTON ===== */
.btn-primary {
  background: #1b9919;
  border: none;
  border-radius: 10px;
  padding: 12px 20px;
  font-weight: 600;
  transition: 0.2s;
}

.btn-primary:hover {
  background: #157d14;
}

/* ===== PODSUMOWANIE ===== */
#js-checkout-summary {
  border-radius: 12px;
  border: 1px solid #eee;
  box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

/* produkty */
.cart-summary-products {
  font-size: 13px;
  color: #666;
}

/* subtotal */
.cart-summary-line {
  font-size: 14px;
  margin-bottom: 6px;
}

/* total */
.cart-total {
  font-size: 16px !important;
}

.cart-total .value {
  color: #1b9919;
}

/* ===== SHIPPING BOX ===== */
#shipping-info-box {
  background: #f1f8e9 !important;
  border-radius: 10px !important;
  border: 1px solid #c5e1a5 !important;
}

/* ===== TRUST BOX ===== */
.cart-trust-section {
  border-radius: 10px !important;
  background: #fff !important;
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {

  .step-title {
    font-size: 14px;
    padding: 15px;
  }

  .checkout-step .content {
    padding: 15px;
  }

  .nav-inline {
    flex-direction: column;
  }

  .btn-primary {
    width: 100%;
  }
}
/* Ukrycie instrukcji pod polami Imię i Nazwisko */
#customer-form .form-control-comment {
    display: none !important;
}

/* Opcjonalnie: Jeśli chcesz ukryć to tylko dla pól tekstowych, a zostawić np. pod hasłem */
#field-firstname ~ .form-control-comment,
#field-lastname ~ .form-control-comment {
    display: none !important;
}
/* Ukrycie dodatkowej notki pod checkboxem newslettera */
#customer-form .form-group .custom-checkbox label em, 
#customer-form .form-group .custom-checkbox label br + em {
    display: none !important;
}

/* Dodatkowe zabezpieczenie, gdyby tekst był w innym tagu */
.js-customer-form .custom-checkbox label em {
    display: none !important;
}
#customer-form .form-group .form-control-label {
    text-align: left;
    width: 100%; /* Etykiety nad polami - bardzo modne i czytelne na mobile */
}
#customer-form .custom-checkbox {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}
.continue.btn-primary {
    margin-top: 20px;
}
#customer-form button.continue {
    margin-top: 25px !important;
}

/* ================================================================
   KROK 2: ADRESY - FINALNA WERSJA DLA VISSLY.PL
   ================================================================ */

/* 1. UKRYWANIE TEKSTU I ZBĘDNYCH ELEMENTÓW */

/* Najbardziej agresywne ukrycie tekstu informacyjnego na górze */
#delivery-address .js-address-form, 
#delivery-address {
    color: transparent !important;
    font-size: 0 !important;
}

/* Przywrócenie widoczności dla wszystkich kontenerów, pól i etykiet */
#delivery-address div, 
#delivery-address section, 
#delivery-address label, 
#delivery-address input, 
#delivery-address select, 
#delivery-address button,
#delivery-address span {
    font-size: 14px !important;
    color: #232323 !important;
}

/* Ukrycie dodatkowych tagów p, sekcji Kraju oraz komentarzy "Opcjonalne" */
#delivery-address p, 
#delivery-address .form-group:has([name="id_country"]),
#delivery-address .form-control-comment {
    display: none !important;
}


/* 2. STYLIZACJA SEKCJI B2B (FIRMA I NIP) */

#delivery-address .form-group:has([name="company"]), 
#delivery-address .form-group:has([name="vat_number"]) {
    background: #f8f9fa !important;
    border-left: 4px solid #1b9919 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 12px 0 !important;
    width: 100% !important;
}


/* 3. UKŁAD I WYRÓWNANIE FORMULARZA */

#delivery-address .form-group {
    display: flex !important;
    align-items: center;
    width: 100%;
    margin-bottom: 10px;
    font-size: 14px !important;
}

/* Wyrównanie wszystkich etykiet do lewej (Imię, Nazwisko, Adres itd.) */
#delivery-address .form-control-label {
    text-align: left !important;
    font-weight: 600 !important;
    flex: 0 0 20% !important; /* Szerokość etykiety */
    padding-left: 10px;
    margin: 0 !important;
}

/* Pola wejściowe zajmują resztę szerokości */
#delivery-address .js-input-column {
    flex: 1 !important;
    padding-right: 15px;
    max-width: none !important;
}

/* Odstęp nad sekcją adresu i nad przyciskiem Dalej */
#delivery-address .form-group:has([name="address1"]) {
    margin-top: 25px !important;
}


/* 4. CHECKBOX I STOPKA */

#delivery-address .col-md-offset-3,
#delivery-address .form-group:has(#use_same_address) {
    margin-left: 0 !important;
    padding-left: 10px !important;
    margin-top: 20px;
    display: flex !important;
    align-items: center;
}

#delivery-address #use_same_address {
    width: 18px;
    height: 18px;
    margin-right: 10px;
    cursor: pointer;
}

#delivery-address .form-footer {
    border-top: 1px solid #eee;
    padding-top: 25px;
    margin-top: 25px;
}
/* Wymuszenie równego wyrównania wszystkich pól w adresach */
#delivery-address .form-group .col-md-3.form-control-label {
    flex: 0 0 20% !important;
    max-width: 20% !important;
    text-align: left !important;
}

#delivery-address .form-group .col-md-6.js-input-column {
    flex: 0 0 80% !important;
    max-width: 80% !important;
}

/* Usunięcie marginesów, które przesuwają Imię/Nazwisko */
#delivery-address .form-group {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
#delivery-address .js-address-form {
    margin-top: -15px !important;
}

#delivery-address .form-fields {
    padding-top: 0 !important;
}

/* Wyrównanie wierszy dostawy */
.delivery-option {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    margin-bottom: 10px !important;
    padding: 15px !important;
    transition: all 0.2s ease;
}

.delivery-option:hover {
    border-color: #1b9919 !important; /* Twój zielony */
    background: #f9fff9 !important;
}

/* Pogrubienie ceny dostawy */
.delivery-option .col-sm-2 strong {
    color: #1b9919;
    font-size: 16px;
}
/* Wyróżnienie punktu odbioru */
#order-infos + .box address.text-muted {
    color: #212121 !important;
    font-weight: bold;
    background: #f8f9fa;
    padding: 10px;
    border-radius: 5px;
    border-left: 4px solid #1b9919;
}

/* Poprawa przycisku "Zamów ponownie" i "Spróbuj ponownie" */
.button-primary, .add-to-cart {
    border-radius: 4px;
    padding: 10px 20px;
    font-weight: 600;
}

/* Ukrycie pustych elementów listy */
#order-infos ul li:empty {
    display: none;
}