/* =====================================================================
   Tafari Tribe — woocommerce.css
   Editorial styling for product archives, single products, cart, checkout.
   ===================================================================== */

.tt-woo { padding: 64px 0 120px; }
.tt-woo__inner { max-width: var(--tt-container); margin: 0 auto; padding: 0 var(--tt-gutter); }

/* ---------- Shop header ---------- */
.tt-shop-header { text-align: center; padding: 24px 0 56px; }
.tt-shop-header__title { font-size: clamp(2.4rem, 4.5vw, 3.6rem); margin: 0; }
.tt-shop-header__desc { max-width: 60ch; margin: 18px auto 0; color: var(--tt-midnight); }

/* ---------- Sort + result bar ---------- */
.woocommerce-result-count,
.woocommerce-ordering {
    font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--tt-clay);
}
.woocommerce-ordering select {
    background: transparent; border: 1px solid var(--tt-line); padding: 10px 14px;
    font-family: var(--tt-font-body); font-size: 12px; letter-spacing: .15em; text-transform: uppercase;
    color: var(--tt-obsidian);
}

/* ---------- Product grid ---------- */
.woocommerce ul.products, ul.products {
    list-style: none; margin: 0 !important; padding: 0 !important;
    display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 48px 28px;
}
.woocommerce ul.products li.product {
    width: 100% !important; margin: 0 !important; padding: 0 !important; float: none !important;
    text-align: left;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
    display: block; text-decoration: none; color: inherit;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--tt-font-display);
    font-size: 1.25rem !important; font-weight: 400 !important;
    line-height: 1.25;
    margin: 18px 0 6px !important;
    padding: 0 !important;
    color: var(--tt-obsidian);
}
.woocommerce ul.products li.product .price {
    font-family: var(--tt-font-body) !important;
    color: var(--tt-clay) !important;
    font-size: 13px !important;
    letter-spacing: .15em;
    text-transform: uppercase;
}
.woocommerce ul.products li.product .price del { opacity: .55; }
.woocommerce ul.products li.product .price ins { background: transparent; color: var(--tt-terracotta); text-decoration: none; }
.woocommerce ul.products li.product img {
    width: 100%; aspect-ratio: 3/4; object-fit: cover;
    margin: 0 !important;
    transition: transform 1.2s var(--tt-ease);
}
.woocommerce ul.products li.product:hover img { transform: scale(1.03); }

/* Sale flash */
.woocommerce span.onsale {
    background: var(--tt-obsidian) !important; color: var(--tt-cream) !important;
    border-radius: 0 !important; min-width: 0 !important; min-height: 0 !important;
    padding: 6px 10px !important; font-size: 10px !important; letter-spacing: .22em; text-transform: uppercase;
    line-height: 1 !important; top: 14px !important; left: 14px !important; right: auto !important;
    font-weight: 400 !important; font-family: var(--tt-font-body) !important;
}

/* Loop add-to-cart */
.woocommerce ul.products li.product .button {
    background: transparent !important;
    color: var(--tt-obsidian) !important;
    border: 1px solid var(--tt-obsidian) !important;
    border-radius: 0 !important;
    font-family: var(--tt-font-body) !important;
    font-size: 11px !important; letter-spacing: .25em; text-transform: uppercase;
    padding: 12px 22px !important;
    margin-top: 14px !important;
    transition: background .3s var(--tt-ease), color .3s var(--tt-ease);
}
.woocommerce ul.products li.product .button:hover {
    background: var(--tt-obsidian) !important; color: var(--tt-cream) !important;
}

/* ---------- Single product ---------- */
.single-product div.product {
    display: grid !important;
    grid-template-columns: 1.1fr 1fr;
    gap: 80px;
    align-items: flex-start;
    margin-top: 24px;
}
.single-product .woocommerce-product-gallery {
    width: 100% !important; float: none !important;
}
.single-product .woocommerce-product-gallery__image img {
    width: 100%; aspect-ratio: 3/4; object-fit: cover;
}
.single-product .product_title {
    font-size: clamp(2rem, 3.6vw, 3rem);
    margin: 0 0 16px;
}
.single-product .summary { padding-top: 8px; }
.single-product .price {
    font-size: 1.1rem !important;
    color: var(--tt-clay) !important;
    margin-bottom: 24px !important;
    letter-spacing: .04em;
}
.single-product .woocommerce-product-details__short-description {
    color: var(--tt-midnight); margin-bottom: 32px; line-height: 1.7;
}
.single-product .cart {
    display: flex !important; align-items: center; gap: 16px; flex-wrap: wrap;
    border-top: 1px solid var(--tt-line); padding-top: 28px;
}
.single-product .quantity .qty {
    width: 80px; height: 52px; padding: 0 12px;
    border: 1px solid var(--tt-line); background: transparent;
    font-family: var(--tt-font-body); font-size: 1rem; color: var(--tt-obsidian);
    border-radius: 0;
}
.single-product .single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: var(--tt-obsidian) !important;
    color: var(--tt-cream) !important;
    border-radius: 0 !important;
    font-family: var(--tt-font-body) !important;
    font-size: 12px !important; letter-spacing: .28em; text-transform: uppercase;
    padding: 18px 36px !important;
    border: 1px solid var(--tt-obsidian) !important;
    transition: background .3s var(--tt-ease), color .3s var(--tt-ease);
    font-weight: 400 !important;
}
.single-product .single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: var(--tt-clay) !important; color: var(--tt-cream) !important; border-color: var(--tt-clay) !important;
}
.woocommerce-message, .woocommerce-info, .woocommerce-error {
    background: var(--tt-ivory) !important;
    border-top: 2px solid var(--tt-gold) !important;
    color: var(--tt-obsidian) !important;
    padding: 18px 24px !important;
    font-size: 13px; letter-spacing: .04em;
    border-radius: 0 !important;
}

/* Product meta */
.single-product .product_meta {
    margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--tt-line);
    font-size: 12px; letter-spacing: .15em; text-transform: uppercase; color: var(--tt-clay);
}
.single-product .product_meta a { color: var(--tt-obsidian); }

/* Tabs */
.woocommerce div.product .woocommerce-tabs {
    margin-top: 96px;
    border-top: 1px solid var(--tt-line);
    padding-top: 56px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
    list-style: none; padding: 0; margin: 0 0 40px; display: flex; gap: 32px;
    border-bottom: 1px solid var(--tt-line);
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    border: 0 !important; background: transparent !important; border-radius: 0 !important;
    padding: 0 !important; margin: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: 16px 0 !important; display: inline-block;
    font-family: var(--tt-font-body) !important;
    font-size: 11px !important; letter-spacing: .28em !important; text-transform: uppercase;
    color: var(--tt-clay) !important; border-bottom: 2px solid transparent !important; font-weight: 500;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--tt-obsidian) !important; border-bottom-color: var(--tt-obsidian) !important;
}
.woocommerce-Tabs-panel { color: var(--tt-midnight); line-height: 1.75; }

/* Related products */
.related.products, .upsells.products {
    margin-top: 120px; padding-top: 56px; border-top: 1px solid var(--tt-line);
}
.related.products > h2, .upsells.products > h2 {
    text-align: center; margin-bottom: 48px;
}

/* ---------- Cart ---------- */
.woocommerce-cart .tt-woo,
.woocommerce-checkout .tt-woo { padding-top: 96px; }
.woocommerce-cart table.shop_table,
.woocommerce-checkout table.shop_table {
    border: none !important; border-collapse: collapse; width: 100%;
}
.woocommerce table.shop_table th {
    font-family: var(--tt-font-body); font-size: 11px; letter-spacing: .25em; text-transform: uppercase;
    color: var(--tt-clay); border-bottom: 1px solid var(--tt-line) !important;
    padding: 18px 12px !important; text-align: left;
}
.woocommerce table.shop_table td {
    border-bottom: 1px solid var(--tt-line) !important;
    padding: 24px 12px !important; vertical-align: middle;
}
.woocommerce-cart-form .product-thumbnail img { width: 96px; height: 120px; object-fit: cover; }
.woocommerce-cart-form .product-name a {
    font-family: var(--tt-font-display); font-size: 1.2rem; color: var(--tt-obsidian);
}
.woocommerce-cart-form .product-remove a.remove {
    color: var(--tt-obsidian) !important; background: transparent !important;
    font-size: 18px !important; width: auto !important; height: auto !important;
}
.woocommerce .cart-collaterals { margin-top: 48px; display: grid; grid-template-columns: 1fr; gap: 32px; }
.woocommerce .cart_totals h2 { font-size: 1.6rem; margin-bottom: 24px; }
.woocommerce .coupon { display: flex; gap: 12px; margin-bottom: 24px; }
.woocommerce .coupon input[type=text] {
    flex: 1; max-width: 280px; padding: 14px 16px;
    border: 1px solid var(--tt-line); background: transparent;
    font-family: var(--tt-font-body); font-size: 14px;
}

/* ---------- Checkout ---------- */
.woocommerce-checkout form.checkout {
    display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px;
}
.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3 {
    font-size: 1.6rem; margin-bottom: 24px; padding-bottom: 12px; border-bottom: 1px solid var(--tt-line);
}
.woocommerce form .form-row label {
    display: block; font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
    color: var(--tt-clay); margin-bottom: 8px;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single {
    width: 100% !important;
    background: transparent !important;
    border: 1px solid var(--tt-line) !important;
    border-radius: 0 !important;
    padding: 14px 16px !important;
    font-family: var(--tt-font-body) !important;
    font-size: 1rem !important; color: var(--tt-obsidian) !important;
    height: auto !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.5 !important; color: var(--tt-obsidian) !important; padding: 0 !important;
}
.woocommerce form .form-row { margin-bottom: 18px; }
.woocommerce-checkout #payment {
    background: var(--tt-ivory) !important; border-radius: 0 !important; padding: 32px;
}
.woocommerce-checkout #payment ul.payment_methods {
    border-bottom: 1px solid var(--tt-line) !important;
    padding: 0 0 18px !important; margin: 0 0 24px !important;
}
.woocommerce-checkout #payment ul.payment_methods li { padding: 8px 0; }
.woocommerce-checkout #payment div.payment_box { background: var(--tt-cream) !important; }
.woocommerce-checkout #payment div.payment_box::before { display: none !important; }
.woocommerce-checkout #place_order { width: 100%; padding: 22px !important; font-size: 12px !important; }

/* ---------- Account ---------- */
.woocommerce-MyAccount-navigation ul {
    list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px;
    border-right: 1px solid var(--tt-line); padding-right: 24px;
}
.woocommerce-MyAccount-navigation ul li a {
    display: block; padding: 12px 0;
    font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
    color: var(--tt-clay);
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li a:hover { color: var(--tt-obsidian); }
.woocommerce-account .woocommerce { display: grid; grid-template-columns: 220px 1fr; gap: 48px; align-items: flex-start; }
