/* ============================================================================
   FRESH THEME — modern override layer
   Loads AFTER style.css / responsive.css. Brand colors admin theke dynamic
   (general settings → Primary/Secondary color). Fallback niche :root-e.
   ========================================================================== */

:root {
    --brand: #635bff;              /* overridden inline from admin settings */
    --brand-dark: #4b45d1;
    --brand-soft: rgba(99, 91, 255, 0.08);
    --ink: #10172a;
    --ink-soft: #5b6474;
    --line: #e8ebf0;
    --bg: #f6f7fb;
    --card: #ffffff;
    --radius: 14px;
    --radius-sm: 10px;
    --shadow: 0 1px 2px rgba(16, 23, 42, .05), 0 8px 24px -12px rgba(16, 23, 42, .12);
    --shadow-hover: 0 2px 4px rgba(16, 23, 42, .06), 0 16px 32px -12px rgba(16, 23, 42, .18);
}

/* ---------- Base ---------- */
body.gotop {
    background: var(--bg);
    color: var(--ink);
    font-family: "Inter", "Hind Siliguri", -apple-system, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { color: var(--ink); font-weight: 700; letter-spacing: -.01em; }
a { transition: color .18s ease; }
img { max-width: 100%; }

/* ---------- Buttons ---------- */
.btn, button.cmn, .comn-btn, .confirm-btn, .order-btn, a.cmn {
    border-radius: 999px !important;
    font-weight: 600;
    letter-spacing: .01em;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover, button.cmn:hover, .confirm-btn:hover { transform: translateY(-1px); box-shadow: var(--shadow-hover); }
.btn:active { transform: translateY(0); }

/* ---------- Cards: product / category / campaign ---------- */
.product-item, .category-item, .campaign-item, .brand-item,
.cart-summary, .checkout-shipping, .contact-form, .success-table {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    overflow: hidden;
}
.product-item:hover, .category-item:hover, .campaign-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
    border-color: color-mix(in srgb, var(--brand) 35%, var(--line));
}
.product-item img { transition: transform .35s ease; }
.product-item:hover img { transform: scale(1.04); }

/* ---------- Header / nav ---------- */
header, .header, .menu-section {
    background: var(--card);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 1px 0 rgba(16,23,42,.03);
}
.wsmenu > .wsmenu-list > li > a:hover { color: var(--brand); }

/* ---------- Badges / price ---------- */
.new-price, .price ins, .amount { color: var(--brand); font-weight: 700; }
.old-price, .price del { color: var(--ink-soft); }
.sale-badge, .discount-badge, .badge-sale {
    background: var(--brand);
    color: #fff;
    border-radius: 999px;
    font-weight: 600;
    padding: 3px 10px;
}

/* ---------- Forms ---------- */
input.form-control, textarea.form-control, select.form-control, .nice-select, .select2-container .select2-selection--single {
    border: 1.5px solid var(--line) !important;
    border-radius: var(--radius-sm) !important;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}
input.form-control:focus, textarea.form-control:focus, select.form-control:focus {
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 4px var(--brand-soft) !important;
    outline: none;
}

/* ---------- Footer ---------- */
footer, .footer-top {
    background: #0e1424;
    color: #c6cbda;
}
footer a { color: #c6cbda; }
footer a:hover { color: #fff; }
.copyright { border-top: 1px solid rgba(255,255,255,.08); }
.copyright p { color: #8b93a7; }

/* ---------- Sections rhythm ---------- */
section { scroll-margin-top: 90px; }
.section-title h2, .section-title h3 { position: relative; padding-bottom: 10px; }
.section-title h2::after, .section-title h3::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 44px; height: 3px; border-radius: 3px; background: var(--brand);
}

/* ---------- Toast / misc polish ---------- */
#toast-container > div { border-radius: var(--radius-sm); box-shadow: var(--shadow-hover); opacity: 1; }
::selection { background: var(--brand); color: #fff; }

/* ---------- Scrollbar (webkit) ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #c9cfdb; border-radius: 8px; border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: #aab2c2; }

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
    :root { --radius: 12px; }
    .product-item:hover { transform: none; }
}