/**
 * REKFI Theme — Main Stylesheet
 * Red header branding (#B70100), clean product grid, REKFI design tokens
 */

/* ============================================================
   HEADER — REKFI Red Branding
   ============================================================ */

/* Red accent bar at very top */
body.rekfi-theme .site-header {
    border-top: 3px solid var(--header-accent-bar) !important;
}

/* Header background — keep white/clean */
body.rekfi-theme .site-header,
body.rekfi-theme header.site-header,
body.rekfi-theme .shoptimizer-primary-navigation {
    background-color: var(--header-bg) !important;
}

/* Logo area — REKFI red accent on brand */
body.rekfi-theme .site-branding .site-title a,
body.rekfi-theme .site-branding .custom-logo-link {
    border-bottom: 2px solid transparent;
    transition: border-color 0.15s;
}
body.rekfi-theme .site-branding .site-title a:hover {
    border-bottom-color: var(--header-accent);
}

/* Navigation links */
body.rekfi-theme .primary-navigation a,
body.rekfi-theme .main-navigation a,
body.rekfi-theme .menu-item a {
    color: var(--header-text) !important;
}

/* Active nav item — red underline */
body.rekfi-theme .primary-navigation .current-menu-item > a,
body.rekfi-theme .main-navigation .current-menu-item > a {
    color: var(--header-accent) !important;
    border-bottom: 2px solid var(--header-accent);
}

/* Cart icon — red accent */
body.rekfi-theme .site-header-cart .cart-contents .count {
    background-color: var(--header-accent) !important;
}

/* Search bar — subtle red focus ring */
body.rekfi-theme .site-search input[type="search"]:focus,
body.rekfi-theme .site-header input[type="search"]:focus {
    border-color: var(--header-accent) !important;
    box-shadow: 0 0 0 2px var(--rekfi-red-bg) !important;
}

/* Mobile menu toggle */
body.rekfi-theme .mobile-menu-toggle {
    color: var(--header-accent) !important;
}

/* ============================================================
   PRODUCT GRID — Clean 2-column
   ============================================================ */

body.rekfi-theme ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: var(--space-16);
    padding: var(--space-16);
}

body.rekfi-theme ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
}

@media (max-width: 767px) {
    body.rekfi-theme ul.products {
        grid-template-columns: 1fr !important;
    }
}

/* ============================================================
   BUTTONS — REKFI Red CTAs
   ============================================================ */

body.rekfi-theme .single_add_to_cart_button,
body.rekfi-theme button.single_add_to_cart_button,
body.rekfi-theme .add_to_cart_button {
    background-color: var(--rekfi-red) !important;
    border-color: var(--rekfi-red) !important;
    color: #FFFFFF !important;
}
body.rekfi-theme .single_add_to_cart_button:hover,
body.rekfi-theme .add_to_cart_button:hover {
    background-color: var(--rekfi-red-light) !important;
    border-color: var(--rekfi-red-light) !important;
}

/* ============================================================
   FOOTER — Subtle brand touch
   ============================================================ */

body.rekfi-theme .site-footer {
    border-top: 3px solid var(--header-accent-bar);
}

/* ============================================================
   DARK MODE
   ============================================================ */

@media (prefers-color-scheme: dark) {
    :root {
        --surface-primary: #0A0A0A;
        --surface-secondary: #141414;
        --surface-tertiary: #1A1A1A;
        --surface-elevated: #1A1A1A;
        --text-primary: #F5F5F5;
        --text-secondary: #A0A0A0;
        --text-tertiary: #707070;
        --border-primary: #242424;
        --border-secondary: #2A2A2A;
        --header-bg: #FFFFFF;
        --header-text: #111827;
        --rekfi-red-bg: #3B1010;
    }
}
