/**
 * WooCommerce Product Variants Styles
 * Stylizacja zgodna z designem: ciemny motyw, zielone akcenty (#B9E400)
 */

.wc-product-variants-wrapper {
    margin: 30px 0;
    padding: 0;
    background: transparent;
    color: #000000;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    width: 100%;
}

.wc-variants-title {
    color: #000000;
    font-size: 18px!important;
    font-weight: 500;
    margin: 0 0 10px 0;
    padding: 0;
}

.wc-variants-container {
    display: flex;
    flex-direction: row;
    gap: 20px;
    margin-bottom: 30px;
    flex-wrap: wrap;
    width: 100%;
}

.wc-variant-box {
    flex: 1;
    min-width: 250px;
    max-width: 350px;
    border: 2px solid #E5E5E5;
    border-radius: 8px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.wc-variant-box:hover {
    border-color: #B9E400;
}

.wc-variant-selected {
    border-color: #B9E400;
    border-width: 2px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.wc-variant-header {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    gap: 10px;
}

.wc-variant-radio {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 22px;
    height: 22px;
    border: 2px solid #E5E5E5;
    background: #E5E5E5;
    border-radius: 50%;
    margin: 0;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: all 0.3s ease;
}
.wc-variant-radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-radius: 50%;
    display: block;
}

.wc-variant-radio:checked {
    border-color: #B9E400;
    background: #B9E400;
    border-width: 2px;
}

.wc-variant-radio:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-radius: 50%;
    display: block;
}

.wc-variant-label {
    color: #000000;
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    margin: 0;
    flex: 1;
    user-select: none;
}

.wc-variant-selected .wc-variant-label {
    color: #000000;
    font-weight: 600;
}

.wc-variant-features {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 15px;
}

.wc-variant-feature {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #000000;
    font-size: 14px;
    line-height: 1.6;
}

.wc-feature-check {
    flex-shrink: 0;
    margin-top: 0;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
}

.wc-feature-icon {
    width: 100%;
    height: 100%;
    display: block;
}

.wc-feature-text {
    flex: 1;
    color: #000000;
    line-height: 1.6;
}

/* Przycisk "Dodaj do koszyka" - stylizacja */
.single-product .wc-product-variants-wrapper + form.cart {
    margin-top: 0;
}

.single-product form.cart .single_add_to_cart_button,
.single-product form.cart button[type="submit"],
.single-product form.cart input[type="submit"] {
    background: #B9E400 !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 15px 30px !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 20px !important;
    text-transform: none !important;
    box-shadow: 0 2px 8px rgba(185, 228, 0, 0.2) !important;
}

.single-product form.cart .single_add_to_cart_button:hover,
.single-product form.cart button[type="submit"]:hover,
.single-product form.cart input[type="submit"]:hover {
    background: #a0c800 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(185, 228, 0, 0.4) !important;
}

.single-product form.cart .single_add_to_cart_button:active,
.single-product form.cart button[type="submit"]:active,
.single-product form.cart input[type="submit"]:active {
    transform: translateY(0) !important;
}

/* Ikona koszyka w przycisku */
.single-product form.cart .single_add_to_cart_button::after,
.single-product form.cart button[type="submit"]::after {
    content: '';
    height: 24px;
    width: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M15.9004 10.2012L11.9998 5.00048L8.09912 10.2012L6.89893 9.30102L11.3997 3.30005C11.4695 3.20689 11.5601 3.13127 11.6643 3.07919C11.7685 3.02711 11.8833 3 11.9998 3C12.1162 3 12.2311 3.02711 12.3352 3.07919C12.4394 3.13127 12.53 3.20689 12.5999 3.30005L17.1006 9.30102L15.9004 10.2012Z" fill="%23191919"/><path d="M20.6989 9H3.29952C3.21459 8.99997 3.13076 9.01917 3.05431 9.05617C2.97786 9.09316 2.91078 9.14698 2.85811 9.2136C2.80543 9.28021 2.76851 9.35789 2.75014 9.44081C2.73177 9.52372 2.7324 9.60972 2.75201 9.69236L5.27675 20.344H18.7217L21.2464 9.69236C21.266 9.60972 21.2667 9.52372 21.2483 9.44081C21.2299 9.35789 21.193 9.28021 21.1403 9.2136C21.0877 9.14698 21.0206 9.09316 20.9441 9.05617C20.8677 9.01917 20.7839 8.99997 20.6989 9ZM11.9992 16.4842C11.6499 16.4825 11.3089 16.3774 11.0192 16.182C10.7296 15.9867 10.5043 15.7099 10.3719 15.3866C10.2395 15.0633 10.2058 14.7081 10.2751 14.3657C10.3445 14.0233 10.5137 13.7091 10.7615 13.4628C11.0093 13.2165 11.3245 13.0492 11.6673 12.9819C12.0102 12.9147 12.3652 12.9505 12.6877 13.0849C13.0102 13.2193 13.2856 13.4462 13.4792 13.737C13.6727 14.0279 13.7758 14.3695 13.7754 14.7189C13.7726 15.1881 13.5843 15.6372 13.2515 15.968C12.9187 16.2987 12.4685 16.4843 11.9992 16.4842Z" fill="%23191919"/></svg>');
    font-size: 18px;
    margin-left: 0;
    display: inline-block;
}

/* Responsywność */
@media (max-width: 768px) {
    .wc-variants-container {
        flex-direction: column;
    }
    
    .wc-variant-box {
        max-width: 100%;
        min-width: 100%;
    }
}

/* Ukryj domyślny selektor wariantów WooCommerce jeśli istnieje */
.single-product .variations {
    display: none !important;
}

/* Ukryj domyślny przycisk dodaj do koszyka jeśli jest duplikat */
.single-product form.cart .button:not(.single_add_to_cart_button) {
    display: none;
}

/* Ukryj pole quantity (ilość) w formularzu dodawania do koszyka */
.single-product form.cart .quantity,
.single-product form.cart .qty,
.single-product form.cart input[name="quantity"],
.single-product form.cart input.qty {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Ukryj kontener quantity jeśli istnieje */
.single-product form.cart .quantity-wrapper,
.single-product form.cart .product-quantity {
    display: none !important;
}

/* Animacja przy zmianie wariantu */
@keyframes variantSelect {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.02);
    }
    100% {
        transform: scale(1);
    }
}

.wc-variant-box.wc-variant-selected {
    animation: variantSelect 0.3s ease;
}

/* Dostępność - focus states */
.wc-variant-radio:focus {
    outline: 2px solid #B9E400;
    outline-offset: 2px;
}

.wc-variant-box:focus-within {
    border-color: #B9E400;
}

/* Dopisek brutto/netto w nowej linii pod ceną */
.wc-price-tax-label {
    display: block;
    font-size: 18px;
    color: #5D5D5D;
    font-weight: normal;
    margin-top: 4px;
    text-transform: lowercase;
    line-height: 1.2;
}

.woocommerce .elementor-widget-woocommerce-product-price .price {
    margin:20px 0 0;
}

/* Miniaturki galerii jako slider (WooCommerce) */
.woocommerce div.product div.images .flex-control-thumbs,
.woocommerce div.product div.images ol.flex-control-nav.flex-control-thumbs {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-padding: 10px;
    padding: 10px 40px; /* miejsce na przyciski */
    margin: 12px 0 0;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge legacy */
}

.woocommerce div.product div.images .flex-control-thumbs::-webkit-scrollbar,
.woocommerce div.product div.images ol.flex-control-nav.flex-control-thumbs::-webkit-scrollbar {
    display: none;
}

.woocommerce div.product div.images .flex-control-thumbs li {
    float: none !important;
    width: auto !important;
    flex: 0 0 calc((100% - 30px) / 4); /* 4 per view (3 przerwy po 10px) */
    scroll-snap-align: start;
    margin: 0 !important;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 8px;
    border: 2px solid #E5E5E5;
    opacity: 1 !important;
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.woocommerce div.product div.images .flex-control-thumbs li img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs li img:hover {
    border-color: #B9E400;
    transform: translateY(-1px);
}

.wc-thumb-slider {
    position: relative;
}

.wc-thumb-slider-btn {
    all: unset;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    margin-top:-8px;
    border-radius: 50px!important;
    border: 1px solid rgba(0,0,0,0.0) !important;
    background: rgba(255,255,255,0.95) !important;
    color: #191919 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    user-select: none;
    font-size: 28px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding:5px!important;
}

.wc-thumb-slider-btn:disabled {
    opacity: 0.4;
    cursor: default;
}

.wc-thumb-slider-btn.wc-thumb-prev {
    left: 6px;
}
.wc-thumb-slider-btn.wc-thumb-next {
    right: 6px;
}

@media (max-width: 768px) {
    .woocommerce div.product div.images .flex-control-thumbs li {
        flex-basis: calc((100% - 20px) / 3); /* 3 per view */
    }
}

@media (max-width: 480px) {
    .woocommerce div.product div.images .flex-control-thumbs li {
        flex-basis: calc((100% - 10px) / 2); /* 2 per view */
    }
}

