/**
* Theme Name: Azaautowheel Child
* Description: This is a child theme of Azaautowheel.
* Author: <a href="http://Azaautowheel.com/about">Azaautowheel</a>
* Template: fitment
* Version: 1.1.4
*/

body.woocommerce-cart .nt-fitment-inner-container 
.fitment-cart-row .fitment-cart-goal-wrapper {
    padding: 20px 20px 30px!important;
    margin-bottom: 0!important;
    border: 1px solid var(--fitment-primary)!important;
    background-color: var(--fitment-primary-bg)!important;
    border-radius: 10px 10px 0 0!important;
    max-width: 100%!important;
}

.woocommerce-form-coupon-toggle {
    background-color: var(--fitment-primary-bg);
    padding: 10px 20px;
    border: 1px solid var(--fitment-primary);
    max-width: 380px;
    color: var(--fitment-primary);   /* було: #df6a2d — замінено на CSS-змінну */
    margin: 0;
    border-radius: 3px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* NOTE: оригінальний селектор
   `.fitment-before-checkout-form- .woocommerce-form-coupon-toggle`
   містив незакритий клас із пробілом — схоже на помилку.
   Якщо потрібна вкладеність, уточніть назву батьківського класу. */

.ninetheme-form-toggle-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}


/* -------------------------------------------------------------
   2. ФОРМА — РЯДКИ ТА ЛЕЙБЛИ
   ------------------------------------------------------------- */
.woocommerce form .form-row,
.fitment-customer-billing-details .woocommerce-billing-fields .form-row {
    margin: 0 0 25px;
}

.woocommerce form .form-row label,
.product-review-form label,
.fitment-customer-billing-details .woocommerce-billing-fields .form-row label {
    display: block;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    text-transform: uppercase;
    color: var(--fitment-dark-soft);
    margin-bottom: 15px;
}

.woocommerce form .form-row input.input-text {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 10px 15px;
    border-radius: 0;
    background-clip: padding-box;
    outline: 0;
    box-shadow: none;       /* прибрані -moz-box-shadow та -webkit-box-shadow як застарілі */
    vertical-align: middle;
    font-weight: 400;
    transition: background-color .3s ease-in-out,
                border-color    .3s ease-in-out,
                color           .3s ease-in-out;
}

/* NOTE: прибрано -webkit-border-radius (застаріле) */


/* -------------------------------------------------------------
   3. SELECT2
   ------------------------------------------------------------- */
.select2-container .selection .country_to_state .country_select {
    width: 100%;
}


/* -------------------------------------------------------------
   4. ORDER REVIEW (sticky sidebar)
   ------------------------------------------------------------- */
.fitment-order-review {
    border: 2px solid var(--fitment-border);
    border-top: 0;
    background: #fff;
    box-shadow:
        0 -1px 1px rgba(0, 0, 0, 0.15),
        0 -10px 0 -5px #eee,
        0 -10px 1px -4px rgba(0, 0, 0, 0.15),
        0 -20px 0 -10px #eee,
        0 -20px 1px -9px rgba(0, 0, 0, 0.15);
    padding: 30px;
    position: sticky;
    top: 135px;
}


/* -------------------------------------------------------------
   5. CHECKOUT REVIEW TABLE
   ------------------------------------------------------------- */
.fitment-checkout-review-order-table {
    margin-bottom: 20px;
}

.fitment-checkout-review-order-table .fitment-cart-items {
    margin-top: -10px;
    padding-top: 10px;
    flex-wrap: wrap;
    flex-direction: column;
}

/* Cart item та footer item — спільні стилі (були продубльовані) */
.fitment-checkout-review-order-table .fitment-cart-item,
.fitment-checkout-review-order-table .fitment-checkout-footer-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--fitment-border);
}

/* Відступи для cart item та order-total
   (дублювали border-top з блоку вище — залишено лише padding/margin) */
.fitment-checkout-review-order-table .fitment-cart-item,
.fitment-checkout-footer-item .order-total {
    padding-top: 10px;
    margin-top: 10px;
}

.fitment-checkout-review-order-table .fitment-cart-item .product-name,
.fitment-checkout-review-order-table .fitment-cart-item .product-img {
    margin-right: 10px;
}

.fitment-checkout-review-order-table .fitment-checkout-review-order-footer {
    margin-top: 15px;
    padding-top: 15px;
    gap: 6px;
}


/* -------------------------------------------------------------
   6. CART TOTALS
   ------------------------------------------------------------- */
.fitment-cart-totals .fitment-cart-total {
    color: var(--fitment-red);
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
}


/* -------------------------------------------------------------
   7. LAYOUT — двоколонковий чекаут
   ------------------------------------------------------------- */
.fitment-checkout-wrapper {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 40px;
    align-items: start;
}

@media (max-width: 1024px) {
    .fitment-checkout-wrapper {
        grid-template-columns: 1fr;
    }

    .fitment-order-review {
        position: static;
    }
}


/* -------------------------------------------------------------
   8. BILLING / SHIPPING FIELDS
   ------------------------------------------------------------- */
.fitment-customer-billing-details .woocommerce-billing-fields,
.fitment-customer-billing-details .woocommerce-shipping-fields {
    margin-bottom: 30px;
}

.fitment-customer-billing-details .woocommerce-billing-fields__field-wrapper,
.fitment-customer-billing-details .woocommerce-shipping-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
}

.fitment-customer-billing-details .woocommerce-billing-fields__field-wrapper .form-row.form-row-wide,
.fitment-customer-billing-details .woocommerce-shipping-fields__field-wrapper .form-row.form-row-wide {
    grid-column: 1 / -1;
}

@media (max-width: 600px) {
    .fitment-customer-billing-details .woocommerce-billing-fields__field-wrapper,
    .fitment-customer-billing-details .woocommerce-shipping-fields__field-wrapper {
        grid-template-columns: 1fr;
    }
}

/* Heading секцій білінгу/доставки */
.woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3 {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--fitment-border);
    color: var(--fitment-dark);
}


/* -------------------------------------------------------------
   9. ФОРМА — ІНПУТИ, SELECT, TEXTAREA
   ------------------------------------------------------------- */
.woocommerce form .form-row select,
.woocommerce form .form-row textarea,
.fitment-customer-billing-details .woocommerce-billing-fields .form-row select {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 10px 15px;
    border-radius: 0;
    outline: 0;
    box-shadow: none;
    font-weight: 400;
    transition: background-color .3s ease-in-out,
                border-color    .3s ease-in-out,
                color           .3s ease-in-out;
}

.woocommerce form .form-row textarea {
    min-height: 100px;
    resize: vertical;
}

/* Select2 dropdown */
.select2-container--default .select2-selection--single {
    height: auto;
    border-radius: 0;
    padding: 10px 15px;
    border: 1px solid var(--fitment-border);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: inherit;
    padding: 0;
    color: inherit;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    top: 0;
    right: 10px;
}

/* Валідація */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
    border-color: var(--fitment-red);
}

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
    border-color: var(--fitment-primary);
}

/* Обов'язкове поле — зірочка */
.woocommerce form .form-row label .required,
abbr.required {
    color: var(--fitment-red);
    text-decoration: none;
    margin-left: 2px;
}


/* -------------------------------------------------------------
   10. COUPON FORM (розгортається)
   ------------------------------------------------------------- */
.woocommerce-form-coupon-toggle .showcoupon {
    color: var(--fitment-primary);
    text-decoration: underline;
    cursor: pointer;
}

.checkout_coupon.woocommerce-form-coupon {
    margin: 0 0 20px;
    padding: 20px;
    border: 1px solid var(--fitment-border);
    border-top: 0;
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: wrap;
}

.checkout_coupon .form-row {
    margin: 0 !important;
    flex: 1;
    min-width: 180px;
}

.checkout_coupon .form-row-last {
    flex: 0 0 auto;
}


/* -------------------------------------------------------------
   11. КНОПКИ ЧЕКАУТУ
   ------------------------------------------------------------- */
#place_order,
.fitment-place-order-btn {
    display: block;
    width: 100%;
    padding: 15px 20px;
    background-color: var(--fitment-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color .3s ease-in-out, opacity .3s ease-in-out;
}

#place_order:hover,
.fitment-place-order-btn:hover {
    opacity: 0.88;
}

#place_order:disabled,
.fitment-place-order-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}


/* -------------------------------------------------------------
   12. PAYMENT METHODS
   ------------------------------------------------------------- */
#payment {
    background: var(--fitment-light-bg, #f8f8f8);
    border-radius: 3px;
    padding: 20px;
    margin-bottom: 20px;
}

#payment ul.payment_methods {
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    border-bottom: 1px solid var(--fitment-border);
}

#payment ul.payment_methods li {
    padding: 12px 0;
    border-top: 1px solid var(--fitment-border);
}

#payment ul.payment_methods li label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
}

#payment ul.payment_methods li img {
    max-height: 24px;
    width: auto;
    vertical-align: middle;
}

#payment .payment_box {
    padding: 12px 15px;
    margin: 8px 0 0;
    background: var(--fitment-primary-bg);
    border-left: 3px solid var(--fitment-primary);
    font-size: 13px;
    color: var(--fitment-dark-soft);
}


/* SHIPING METHODS (у чекауті)*/
.woocommerce-shipping-totals td {
    padding: 10px 0;
}

.woocommerce-shipping-methods {
    list-style: none;
    margin: 0;
    padding: 0;
}

.woocommerce-shipping-methods li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    font-size: 13px;
}

.woocommerce-shipping-methods li label {
    margin: 0;
    cursor: pointer;
    font-size: 13px !important;
    text-transform: none !important;
    color: var(--fitment-dark) !important;
    font-weight: 400 !important;
}


/* -------------------------------------------------------------
   14. ORDER REVIEW — ПРОДУКТИ
   ------------------------------------------------------------- */
.fitment-checkout-review-order-table .fitment-cart-item .product-img img {
    width: 52px;
    height: 52px;
    object-fit: cover;
    border: 1px solid var(--fitment-border);
}

.fitment-checkout-review-order-table .fitment-cart-item .product-name {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
}

.fitment-checkout-review-order-table .fitment-cart-item .product-name .product-quantity {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--fitment-dark-soft);
    margin-top: 3px;
}

.fitment-checkout-review-order-table .fitment-cart-item .product-total {
    font-size: 14px;
    font-weight: 600;
    color: var(--fitment-dark);
    white-space: nowrap;
}


/* -------------------------------------------------------------
   15. ORDER REVIEW — ПІДСУМКИ (subtotal, shipping, total)
   ------------------------------------------------------------- */
.fitment-checkout-footer-item .fitment-label {
    font-size: 13px;
    color: var(--fitment-dark-soft);
    text-transform: uppercase;
    font-weight: 500;
}

.fitment-checkout-footer-item .fitment-value {
    font-size: 13px;
    font-weight: 600;
    color: var(--fitment-dark);
}

.fitment-checkout-footer-item.order-total .fitment-label {
    font-size: 14px;
    color: var(--fitment-dark);
}

.fitment-checkout-footer-item.order-total .fitment-value {
    font-size: 18px;
    color: var(--fitment-red);
}


/* -------------------------------------------------------------
   16. NOTICES / ПОВІДОМЛЕННЯ
   ------------------------------------------------------------- */
.woocommerce-NoticeGroup .woocommerce-error,
.woocommerce-NoticeGroup .woocommerce-message,
.woocommerce-NoticeGroup .woocommerce-info {
    list-style: none;
    margin: 0 0 20px;
    padding: 12px 20px;
    border-left: 4px solid;
    font-size: 13px;
}

.woocommerce-NoticeGroup .woocommerce-error {
    background: #fff5f5;
    border-color: var(--fitment-red);
    color: var(--fitment-red);
}

.woocommerce-NoticeGroup .woocommerce-message {
    background: var(--fitment-primary-bg);
    border-color: var(--fitment-primary);
    color: var(--fitment-primary);
}

.woocommerce-NoticeGroup .woocommerce-info {
    background: #f0f7ff;
    border-color: #3b82f6;
    color: #1d4ed8;
}


/* -------------------------------------------------------------
   17. ДОДАТКОВИЙ РОЗДІЛ — "Ship to different address"
   ------------------------------------------------------------- */
.woocommerce-shipping-fields .ship-to-different-address {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    cursor: pointer;
}

.woocommerce-shipping-fields .ship-to-different-address label {
    margin: 0 !important;
    font-size: 14px !important;
    text-transform: none !important;
    cursor: pointer;
    font-weight: 500 !important;
}


/* -------------------------------------------------------------
   18. ORDER NOTES
   ------------------------------------------------------------- */
.woocommerce-additional-fields h3 {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--fitment-border);
    color: var(--fitment-dark);
}

.woocommerce-additional-fields .form-row {
    margin-bottom: 0 !important;
}

/* задає фіксовану рамку незалежно від реального розміру фото*/
.fitment-loop-product .thumb-wrapper {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2; 
}

.fitment-loop-product .thumb-wrapper .product-thumb {
    display: block;
    width: 100%;
    height: 100%;
}

.fitment-loop-product .thumb-wrapper img.attachment-woocommerce_thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;   
    object-position: center;
    display: block;
}