/*
Theme Name:   Shoptimizer Child - Thoitrangdvc
Theme URI:    https://thoitrangdvc.com
Description:  Child theme của Shoptimizer dành riêng cho thoitrangdvc.com — Fashion WooCommerce store.
Author:       Antigravity AI
Author URI:   https://thoitrangdvc.com
Template:     shoptimizer
Version:      1.0.0
Text Domain:  shoptimizer-child-thoitrangdvc
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         e-commerce, woocommerce, fashion, custom-colors, child-theme
*/

/* ============================================================
   THOITRANGDVC.COM — Custom Styles
   Tất cả CSS tùy chỉnh viết ở đây, KHÔNG sửa theme gốc.
   
   Cấu trúc:
   1. CSS Variables (Brand Colors)
   2. Typography
   3. Header / Navigation
   4. Homepage
   5. Product / Shop
   6. Cart / Checkout
   7. Footer
   8. Mobile Responsive
   ============================================================ */

/* ── 1. CSS Variables — Màu thương hiệu thoitrangdvc ─────── */
:root {
    /* Brand Colors */
    --color-primary:     #c8a882;   /* Vàng đồng — sang trọng, thời trang */
    --color-primary-dk:  #a8845f;   /* Primary tối hơn (hover) */
    --color-secondary:   #1a1a1a;   /* Đen lịch sự */
    --color-accent:      #e8d5bf;   /* Vàng nhạt — highlight */
    --color-bg:          #ffffff;
    --color-bg-light:    #faf8f5;   /* Nền nhẹ ấm */
    --color-text:        #2c2c2c;
    --color-text-muted:  #888888;
    --color-border:      #e8e0d5;

    /* Typography */
    --font-heading: 'Playfair Display', 'Georgia', serif;
    --font-body:    'Inter', 'Helvetica Neue', sans-serif;

    /* Spacing */
    --container-max: 1280px;
    --border-radius: 4px;
}

/* ── 2. Google Fonts Import ──────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap');

/* ── 3. Base Typography ──────────────────────────────────── */
body {
    font-family: var(--font-body);
    color: var(--color-text);
    background-color: var(--color-bg);
}

h1, h2, h3, h4, h5, h6,
.woocommerce-loop-product__title,
.product_title {
    font-family: var(--font-heading);
    font-weight: 600;
}

/* ── 4. Brand — Buttons & Links ─────────────────────────── */
a {
    color: var(--color-primary);
}

a:hover {
    color: var(--color-primary-dk);
}

.button,
button,
input[type="submit"],
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #place_order {
    background-color: var(--color-secondary) !important;
    color: #ffffff !important;
    border: 2px solid var(--color-secondary) !important;
    border-radius: var(--border-radius) !important;
    font-family: var(--font-body) !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 13px !important;
    padding: 12px 28px !important;
    transition: all 0.25s ease !important;
}

.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #ffffff !important;
}

/* Add to Cart — nổi bật hơn */
.woocommerce .single_add_to_cart_button {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    font-size: 14px !important;
    padding: 14px 36px !important;
}

.woocommerce .single_add_to_cart_button:hover {
    background-color: var(--color-primary-dk) !important;
    border-color: var(--color-primary-dk) !important;
}

/* ── 5. Shop / Product Grid ──────────────────────────────── */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 15px;
    font-family: var(--font-heading);
}

.woocommerce ul.products li.product .price {
    color: var(--color-primary);
    font-weight: 600;
}

/* Sale badge */
.woocommerce span.onsale {
    background-color: var(--color-primary);
    border-radius: 2px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    min-height: auto;
    min-width: auto;
    padding: 4px 10px;
    line-height: 1.5;
}

/* ── 6. Product Page ─────────────────────────────────────── */
.woocommerce div.product .product_title {
    font-size: clamp(24px, 4vw, 36px);
    line-height: 1.3;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--color-primary);
    font-size: 22px;
    font-weight: 700;
}

/* ── 7. Background phụ ───────────────────────────────────── */
.site-header,
.sg-container {
    background-color: var(--color-bg) !important;
}

.woocommerce-account .entry-content,
body.woocommerce-page {
    background-color: var(--color-bg-light);
}