/*
Theme Name: BD Theme
Theme URI: https://example.com
Author: Ariful Islam BD
Version: 1.0.0
Text Domain: bd-theme
Description: Premium Ecommerce Theme
*/

/* ── Reset ─────────────────────────────────── */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ── Base ──────────────────────────────────── */
:root {
    --brand:      #6366f1;
    --brand-dark: #2563eb;
    --accent:     #ff4da6;
    --header-bg:  #081426;
    --header-text:#ffffff;
    --btn-text:   #ffffff;
    --radius-sm:  8px;
    --radius-md:  14px;
    --radius-lg:  20px;
    --shadow-sm:  0 2px 8px rgba(0,0,0,.06);
    --shadow-md:  0 8px 28px rgba(0,0,0,.1);
    --shadow-lg:  0 20px 52px rgba(99,102,241,.15);
}

html { scroll-behavior: smooth; }

body {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans Bengali', 'Hind Siliguri', 'Segoe UI', Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;
    color: #334155;
    background: #f8fafc;
    -webkit-font-smoothing: antialiased;
}

/* ── Typography ────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.3;
    color: #0f172a;
}
a { color: var(--brand); }
a:hover { color: var(--brand-dark); }
img { max-width: 100%; height: auto; }

/* ── Layout ────────────────────────────────── */
.container {
    width: 95%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
}

/* ── WooCommerce fixes ─────────────────────── */
.woocommerce-notices-wrapper { padding: 0 20px; }
.price ins { text-decoration: none; }
.woocommerce ul.products { padding: 0; margin: 0; }

/* ── Page body ─────────────────────────────── */
.bd-page-body { padding: 30px 0 60px; }

/* ── Scrollbar (Webkit) ────────────────────── */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* ── Selection color ───────────────────────── */
::selection { background: rgba(99,102,241,.2); color: #1e293b; }

/* ── Dark mode base ────────────────────────── */

/* Light mode (default) global tokens */
:root {
    --page-bg:        #f8fafc;
    --page-bg-2:      #ffffff;
    --page-bg-3:      #f1f5f9;
    --page-text:      #334155;
    --page-text-2:    #64748b;
    --page-text-3:    #94a3b8;
    --page-border:    #e2e8f0;
    --page-card-bg:   #ffffff;
    --page-card-shadow: 0 4px 20px rgba(0,0,0,.06);
    --page-input-bg:  #ffffff;
    --page-input-border: #e2e8f0;
    --page-input-text: #1e293b;
    --brand:          #6366f1;
    --brand-dark:     #2563eb;
    --accent:         #ff4da6;
    --btn-text:       #ffffff;
    --success:        #10b981;
    --warning:        #f59e0b;
    --error:          #ef4444;
}

/* Dark mode global tokens */
body.dark-mode {
    --page-bg:        #0f172a;
    --page-bg-2:      #1e293b;
    --page-bg-3:      #0d1526;
    --page-text:      #cbd5e1;
    --page-text-2:    #94a3b8;
    --page-text-3:    #64748b;
    --page-border:    rgba(255,255,255,.08);
    --page-card-bg:   #1e293b;
    --page-card-shadow: 0 4px 24px rgba(0,0,0,.3);
    --page-input-bg:  #1e293b;
    --page-input-border: rgba(255,255,255,.12);
    --page-input-text: #e2e8f0;
    --brand:          #818cf8;
    --brand-dark:     #60a5fa;
    --accent:         #f472b6;
}

body.dark-mode {
    background: var(--page-bg);
    color: var(--page-text);
}

/* Smooth page-level transition when toggling */
body {
    transition: background-color .3s ease, color .3s ease;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 { color: #f1f5f9; }

body.dark-mode a { color: #a5b4fc; }
body.dark-mode a:hover { color: #c7d2fe; }

/* Dark mode scrollbar */
body.dark-mode ::-webkit-scrollbar-track { background: #0f172a; }
body.dark-mode ::-webkit-scrollbar-thumb { background: #334155; }
body.dark-mode ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* Dark mode selection */
body.dark-mode ::selection { background: rgba(129,140,248,.3); color: #e2e8f0; }

/* ── Global card dark mode ──────────────────── */
body.dark-mode .bd-product-card,
body.dark-mode .bd-cat-card,
body.dark-mode .bd-hc-card,
body.dark-mode .pf-svc-card:not(.pf-svc-dark),
body.dark-mode .pf-testi-card,
body.dark-mode .pf-review-card,
body.dark-mode .pf-news-card,
body.dark-mode .bd-ab-stat-card,
body.dark-mode .bd-ct-form-card,
body.dark-mode .bd-ct-info-card,
body.dark-mode .bd-ct-quick {
    background: var(--page-card-bg);
    border-color: var(--page-border);
}

/* ── Global input dark mode ─────────────────── */
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="tel"],
body.dark-mode input[type="search"],
body.dark-mode input[type="url"],
body.dark-mode input[type="password"],
body.dark-mode input[type="number"],
body.dark-mode textarea,
body.dark-mode select {
    background: var(--page-input-bg) !important;
    border-color: var(--page-input-border) !important;
    color: var(--page-input-text) !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder { color: #64748b; }

/* ── WooCommerce dark mode ──────────────────── */
body.dark-mode .woocommerce-notices-wrapper .woocommerce-message,
body.dark-mode .woocommerce-notices-wrapper .woocommerce-info {
    background: var(--page-card-bg);
    border-top-color: var(--brand);
    color: var(--page-text);
}
body.dark-mode table.shop_table,
body.dark-mode table.shop_table thead,
body.dark-mode table.shop_table tbody td {
    border-color: var(--page-border);
    color: var(--page-text);
    background: var(--page-card-bg);
}

/* ── Utility ───────────────────────────────── */
.bd-sr-only {
    position: absolute; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.bd-visually-hidden { @extend .bd-sr-only; }