/*
 * Theme: Elegant
 * Inspired by MG Profile — luxury brand, warm cream & gold, refined serif typography.
 * Breathable layout, restrained decoration, premium quiet confidence.
 */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Lato:wght@300;400;700&display=swap');

:root {
    --sf-primary:         #b59a6a;
    --sf-primary-hover:   #9d8459;
    --sf-accent:          #b59a6a;
    --sf-bg:              #faf7f2;
    --sf-surface:         #ffffff;
    --sf-text:            #1c1410;
    --sf-text-muted:      #8b7d6b;
    --sf-border:          #e8e0d4;
    --sf-header-bg:       #faf7f2;
    --sf-font:            'Lato', 'Helvetica Neue', Arial, sans-serif;
    --sf-font-serif:      'Playfair Display', 'Didot', 'Georgia', serif;
    --sf-radius:          0;
    --sf-radius-sm:       0;
    --sf-radius-lg:       0;
    --sf-shadow:          0 1px 4px 0 rgba(28,20,16,0.06);
    --sf-shadow-md:       0 4px 20px 0 rgba(28,20,16,0.10);
    --sf-shadow-lg:       0 8px 32px 0 rgba(28,20,16,0.12);
    --sf-card-shadow:     none;
    --sf-btn-transform:   uppercase;
    --sf-btn-tracking:    0.1em;
    --sf-btn-weight:      400;
}

/* ── Header — cream with gold underline ── */
.sf-header {
    background: #faf7f2;
    color: #1c1410;
    border-bottom: 1px solid #e8e0d4;
    box-shadow: none;
    height: 72px;
}
.sf-header-logo { color: #1c1410; }
.sf-header-logo-initial {
    background: #b59a6a;
    color: #ffffff;
    border-radius: 0;
    font-family: var(--sf-font-serif);
}
.sf-header-name {
    font-family: var(--sf-font-serif);
    font-weight: 600;
    letter-spacing: 0.04em;
    font-size: 1.15rem;
    color: #1c1410;
}
/* ── Lang switcher — warm cream header ── */
.sf-lang-btns { border-color: #d8cfc4; }
.sf-lang-btn { color: rgba(28,20,16,0.45); }
.sf-lang-btn:hover { background: rgba(28,20,16,0.06); color: #1c1410; }
.sf-lang-btn.active { background: #b59a6a; color: #ffffff; }
.sf-lang-btn + .sf-lang-btn { border-left-color: #d8cfc4; }
/* ── Currency switcher — warm cream header ── */
.sf-currency-btn { color: rgba(28,20,16,0.35); }
.sf-currency-btn:hover { color: #1c1410; }
.sf-currency-btn.active { color: #b59a6a; font-weight: 800; }
.sf-currency-btn + .sf-currency-btn { border-left-color: #d8cfc4; }
.sf-mobile-menu-footer .sf-currency-btn { color: rgba(255,255,255,0.6); }
.sf-mobile-menu-footer .sf-currency-btn.active { background: #b59a6a; color: #ffffff; }
.sf-mobile-menu-footer .sf-currency-btns { border-color: rgba(181,154,106,0.4); }
.sf-mobile-menu-footer .sf-currency-btn + .sf-currency-btn { border-left-color: rgba(181,154,106,0.4); }

.sf-account-btn {
    color: rgba(28,20,16,0.55);
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.sf-account-btn:hover { color: #1c1410; }
.sf-cart-btn {
    background: transparent;
    border: 1px solid #c8b89a;
    color: #1c1410;
    border-radius: 0;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
}
.sf-cart-btn:hover {
    background: #f0ebe2;
    color: #1c1410;
}
.sf-cart-count { background: #b59a6a; border-radius: 999px; }

/* ── Category bar ── */
.sf-category-bar {
    background: #faf7f2;
    border-bottom: 1px solid #e8e0d4;
}
.sf-category-tab {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 400;
    color: #8b7d6b;
    padding: 1.1rem 1.5rem;
}
.sf-category-tab:hover { color: #1c1410; }
.sf-category-tab.active {
    color: #b59a6a;
    border-bottom-color: #b59a6a;
    font-weight: 700;
}

/* ── Search ── */
.sf-search { border-color: #ddd5c8; border-radius: 0; background: #ffffff; }
.sf-search:focus { border-color: #b59a6a; box-shadow: 0 0 0 3px rgba(181,154,106,0.12); }

/* ── Product grid — more spacious ── */
.sf-grid { gap: 1.75rem; }
.sf-card {
    border: 1px solid #e8e0d4;
    border-radius: 0;
    box-shadow: none;
}
.sf-card:hover {
    box-shadow: 0 6px 24px rgba(28,20,16,0.1);
    transform: none;
    border-color: #c8b89a;
}
.sf-card-brand {
    font-family: var(--sf-font);
    font-size: 0.65rem;
    color: #b59a6a;
    letter-spacing: 0.12em;
    font-weight: 700;
}
.sf-card-name {
    font-family: var(--sf-font-serif);
    font-weight: 500;
    font-size: 0.95rem;
    color: #1c1410;
    line-height: 1.35;
}
.sf-card-price { color: #1c1410; font-family: var(--sf-font); font-weight: 300; font-size: 0.95rem; }
.sf-card-img-placeholder { background: #f0ebe2; color: #c8b89a; }

/* ── Product detail ── */
.sf-info-name { font-family: var(--sf-font-serif); font-weight: 600; font-size: 2rem; letter-spacing: -0.01em; }
.sf-info-brand { color: #b59a6a; letter-spacing: 0.12em; font-size: 0.75rem; }
.sf-price-display { color: #1c1410; font-family: var(--sf-font); font-weight: 300; font-size: 1.75rem; }
.sf-gallery-main { border-color: #e8e0d4; border-radius: 0; background: #faf7f2; }
.sf-gallery-thumb { border-color: #e8e0d4; border-radius: 0; }
.sf-gallery-thumb.active, .sf-gallery-thumb:hover { border-color: #b59a6a; }

/* ── Variant buttons ── */
.sf-attr-btn {
    border-radius: 0;
    border-color: #ddd5c8;
    font-size: 0.82rem;
    letter-spacing: 0.03em;
}
.sf-attr-btn:hover { border-color: #b59a6a; background: #fdf9f4; }
.sf-attr-btn.selected { background: #b59a6a; border-color: #b59a6a; color: #ffffff; }

/* ── Qty ── */
.sf-qty-ctrl { border-color: #ddd5c8; border-radius: 0; }

/* ── Buttons — warm gold ── */
.sf-add-btn {
    background: #1c1410;
    border-radius: 0;
    font-weight: 400;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    box-shadow: none;
}
.sf-add-btn:hover:not(:disabled) { opacity: 1; background: #3a2c24; }

.sf-btn-primary {
    background: #1c1410;
    border-radius: 0;
    font-weight: 400;
    font-size: 0.85rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.sf-btn-primary:hover { opacity: 1; background: #3a2c24; }

/* ── Auth ── */
.sf-auth-wrap { background: #f0ebe2; }
.sf-auth-card { border: 1px solid #e8e0d4; border-radius: 0; box-shadow: none; background: #faf7f2; }
.sf-auth-title { font-family: var(--sf-font-serif); font-weight: 600; letter-spacing: 0.01em; }
.sf-auth-sub { font-weight: 300; letter-spacing: 0.04em; font-size: 0.8rem; text-transform: uppercase; color: #8b7d6b; }
.sf-input { border-radius: 0; border-color: #ddd5c8; background: #ffffff; }
.sf-input:focus { border-color: #b59a6a; box-shadow: 0 0 0 3px rgba(181,154,106,0.12); }
.sf-auth-link a { color: #b59a6a; }

/* ── Header nav dropdown — elegant override ── */
.sf-header-nav-link { color: rgba(28,20,16,0.65); }
.sf-header-nav-link:hover { color: #1c1410; }
.sf-nav-dropdown { border-color: #e8e0d4; box-shadow: 0 8px 32px rgba(28,20,16,0.1); }
.sf-nav-dropdown-item { font-family: var(--sf-font); font-size: 0.82rem; letter-spacing: 0.03em; }
.sf-nav-dropdown-item:hover { background: #faf7f2; color: #b59a6a; }

/* ── Footer ── */
.sf-footer { background: #1c1410; color: #8b7d6b; border-top: none; }
.sf-footer a { color: #8b7d6b !important; }

/* ── Tabs ── */
.sf-tab-btn.active { color: #b59a6a; border-bottom-color: #b59a6a; }
.sf-section-title { font-family: var(--sf-font-serif); font-weight: 500; }

/* ── Mobile overrides ── */
.sf-mobile-menu { top: 72px; max-height: calc(100vh - 72px); background: #1c1410; border-top-color: rgba(181,154,106,0.2); }
.sf-burger span { background: #1c1410; }
.sf-burger:hover { background: rgba(28,20,16,0.06); }
.sf-mobile-nav-link { color: rgba(255,255,255,0.75); border-bottom-color: rgba(255,255,255,0.08); }
.sf-mobile-nav-link:hover { color: #b59a6a; }
.sf-mobile-nav-group { color: rgba(181,154,106,0.6); border-bottom-color: rgba(255,255,255,0.05); }
.sf-mobile-menu-footer .sf-account-btn { color: rgba(255,255,255,0.7); }
.sf-mobile-menu-footer .sf-lang-btns { border-color: rgba(181,154,106,0.4); }
.sf-mobile-menu-footer .sf-lang-btn { color: rgba(255,255,255,0.55); }
.sf-mobile-menu-footer .sf-lang-btn:hover { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.9); }
.sf-mobile-menu-footer .sf-lang-btn.active { background: #b59a6a; color: #ffffff; }
.sf-mobile-menu-footer .sf-lang-btn + .sf-lang-btn { border-left-color: rgba(181,154,106,0.4); }
/* ── Footer currency dropdown ── */
.sf-footer-currency-wrap { display: flex; align-items: center; }
.sf-footer-currency-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='rgba(181,154,106,0.5)'/%3E%3C/svg%3E");
    border-color: rgba(181,154,106,0.3);
    color: rgba(255,255,255,0.5);
}
.sf-footer-currency-select:hover,
.sf-footer-currency-select:focus { border-color: #b59a6a; color: rgba(255,255,255,0.85); }
.sf-footer-currency-select option { background: #1c1410; color: #e8e0d4; }
/* ── USP block — elegant: soft card per item, serif heading ── */
.sf-block-usp { background: #faf7f2; }
.sf-usp-item { background: #ffffff; border: 1px solid #e8e0d4; padding: 2rem 1.5rem; }
.sf-usp-icon { color: #b59a6a; font-size: 1.5rem; }
.sf-usp-heading { font-family: var(--sf-font-serif); font-size: 1rem; font-weight: 500; color: #1c1410; }
.sf-usp-text { color: #8b7d6b; font-size: 0.82rem; }

/* ── Policy strip — elegant: cream bg, gold icons ── */
.sf-block-policy { background: #faf7f2; border-top: 1px solid #e8e0d4; border-bottom: 1px solid #e8e0d4; }
.sf-policy-icon { color: #b59a6a; }
.sf-policy-label { font-family: var(--sf-font); font-size: 0.75rem; letter-spacing: 0.06em; text-transform: uppercase; color: #1c1410; }
.sf-policy-sub { color: #8b7d6b; }

/* ── CTA banner — elegant: dark charcoal, gold button, serif heading ── */
.sf-block-cta { background: #1c1410 !important; }
.sf-cta-heading { font-family: var(--sf-font-serif); font-size: 2.25rem; font-weight: 600; color: #faf7f2; }
.sf-cta-sub { color: #8b7d6b; }
.sf-cta-btn { background: #b59a6a !important; color: #ffffff !important; border-radius: 0; font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 400; }
.sf-cta-btn:hover { background: #9d8459 !important; }

@media (max-width: 480px) {
    .sf-category-tab { padding: 0.85rem 1rem; font-size: 0.73rem; }
    .sf-info-name { font-size: 1.35rem; }
    .sf-price-display { font-size: 1.35rem; }
}
@media (max-width: 768px) {
    .sf-header { height: 64px; }
}

/* ── Testimonials ── */
.sf-block-testimonials { background: #fffdf7; }
.sf-testimonial-card { background: #ffffff; box-shadow: 0 2px 12px rgba(0,0,0,0.07); border-color: transparent; }
.sf-testimonial-quote { font-style: italic; font-size: 1rem; }
.sf-star--filled { color: #c9a84c; }

/* ── Image gallery ── */
.sf-gallery-caption { font-family: var(--sf-font-heading, 'Playfair Display', serif); font-style: italic; }
