/**
 * Hi Afrika - WooCommerce Styles
 * Extended WooCommerce component styling
 * 
 * @package Hi_Afrika
 */

/* ========================================================================
   MY ACCOUNT
   ======================================================================== */
.woocommerce-account .woocommerce-MyAccount-navigation {
    background: var(--ha-cream);
    border-radius: var(--ha-radius-md);
    padding: var(--ha-gap-md);
    border: 1px solid var(--ha-sand);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin-bottom: 2px;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 0.65rem 1rem;
    font-family: var(--ha-font-body);
    font-size: 0.9rem;
    color: var(--ha-text-medium);
    border-radius: var(--ha-radius-sm);
    transition: all var(--ha-transition);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--ha-brown-dark);
    color: var(--ha-cream);
}

/* ========================================================================
   MINI CART
   ======================================================================== */
.widget_shopping_cart .cart_list li {
    padding: 0.75rem 0 !important;
    border-bottom: 1px solid var(--ha-sand) !important;
}

.widget_shopping_cart .cart_list li a {
    font-family: var(--ha-font-body);
    font-weight: 500;
    color: var(--ha-text-dark);
}

.widget_shopping_cart .total {
    font-family: var(--ha-font-body);
    font-weight: 700;
    border-top: 2px solid var(--ha-sand) !important;
    padding-top: 0.75rem !important;
}

.widget_shopping_cart .buttons a {
    border-radius: var(--ha-radius-sm) !important;
    font-family: var(--ha-font-body) !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.widget_shopping_cart .buttons a:first-child {
    background: var(--ha-brown-dark) !important;
    color: var(--ha-cream) !important;
}

.widget_shopping_cart .buttons a:last-child {
    background: var(--ha-orange) !important;
    color: white !important;
}

/* ========================================================================
   PRODUCT GALLERY
   ======================================================================== */
.woocommerce div.product div.images .flex-control-thumbs {
    margin-top: 0.75rem;
}

.woocommerce div.product div.images .flex-control-thumbs li {
    border-radius: var(--ha-radius-sm);
    overflow: hidden;
    border: 2px solid transparent;
    transition: border-color var(--ha-transition);
}

.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
    border-color: var(--ha-orange);
}

/* ========================================================================
   PRODUCT VARIATIONS
   ======================================================================== */
.woocommerce div.product form.cart .variations {
    margin-bottom: var(--ha-gap-lg);
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
    padding: 0.5rem 0;
}

.woocommerce div.product form.cart .variations label {
    font-family: var(--ha-font-body);
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--ha-text-dark);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.woocommerce div.product form.cart .variations select {
    border: 1.5px solid var(--ha-sand) !important;
    border-radius: var(--ha-radius-sm) !important;
    padding: 0.6rem 1rem !important;
    font-family: var(--ha-font-body) !important;
}

/* ========================================================================
   NOTICES & ALERTS
   ======================================================================== */
.woocommerce-info {
    border-top-color: var(--ha-orange) !important;
    background: var(--ha-cream) !important;
}

.woocommerce-info::before {
    color: var(--ha-orange) !important;
}

.woocommerce-message {
    background: var(--ha-cream) !important;
}

/* ========================================================================
   ORDER REVIEW (CHECKOUT)
   ======================================================================== */
.woocommerce-checkout-review-order-table {
    border: 1px solid var(--ha-sand) !important;
    border-radius: var(--ha-radius-md) !important;
    overflow: hidden;
}

.woocommerce-checkout-review-order-table th {
    background: var(--ha-cream) !important;
    font-family: var(--ha-font-body);
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.5px;
}

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
    border-color: var(--ha-sand) !important;
    padding: 0.75rem 1rem !important;
}

/* ========================================================================
   PAYMENT METHODS
   ======================================================================== */
.woocommerce-checkout #payment {
    background: var(--ha-cream) !important;
    border-radius: var(--ha-radius-md) !important;
    border: 1px solid var(--ha-sand);
}

.woocommerce-checkout #payment ul.payment_methods {
    border-bottom: 1px solid var(--ha-sand) !important;
    padding: var(--ha-gap-md) !important;
}

.woocommerce-checkout #payment div.place-order {
    padding: var(--ha-gap-lg) !important;
}

/* ========================================================================
   EMPTY CART
   ======================================================================== */
.woocommerce-cart .cart-empty {
    text-align: center;
    padding: var(--ha-gap-3xl) 0;
    font-family: var(--ha-font-display);
    font-size: 1.2rem;
    color: var(--ha-text-light);
}

.woocommerce-cart .return-to-shop a {
    background: var(--ha-orange) !important;
    color: white !important;
    border-radius: var(--ha-radius-sm) !important;
    font-family: var(--ha-font-body) !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    padding: 0.85rem 2rem !important;
}

/* ========================================================================
   PRODUCT SEARCH WIDGET
   ======================================================================== */
.woocommerce-product-search {
    position: relative;
}

.woocommerce-product-search input[type="search"] {
    border: 1.5px solid var(--ha-sand);
    border-radius: var(--ha-radius-sm);
    padding: 0.7rem 1rem;
    font-family: var(--ha-font-body);
    width: 100%;
}

.woocommerce-product-search button {
    background: var(--ha-brown-dark);
    color: var(--ha-cream);
    border: none;
    padding: 0.7rem 1.2rem;
    border-radius: 0 var(--ha-radius-sm) var(--ha-radius-sm) 0;
    cursor: pointer;
}

/* ========================================================================
   PRICE FILTER WIDGET
   ======================================================================== */
.woocommerce .widget_price_filter .price_slider_wrapper .ui-widget-content {
    background: var(--ha-sand) !important;
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-range {
    background: var(--ha-orange) !important;
}

.woocommerce .widget_price_filter .ui-slider .ui-slider-handle {
    background: var(--ha-brown-dark) !important;
    border: 2px solid var(--ha-orange) !important;
}

.woocommerce .widget_price_filter .price_slider_amount .button {
    background: var(--ha-brown-dark) !important;
    color: var(--ha-cream) !important;
    border-radius: var(--ha-radius-sm) !important;
    font-family: var(--ha-font-body) !important;
    font-size: 0.8rem !important;
}
