:root {
    --dx-primary: #4f46e5;
    --dx-primary-dark: #4338ca;
    --dx-accent: #06b6d4;
    --dx-bg: #f8f9ff;
    --dx-border: #e2e8f0;
    --dx-text: #1e293b;
    --dx-muted: #64748b;
}

body {
    background: var(--dx-bg);
    color: var(--dx-text);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

/* ---------- Navbar ---------- */
.navbar { background: #fff; border-bottom: 1px solid var(--dx-border); box-shadow: 0 1px 3px rgba(30,41,59,.04); }
.navbar-brand { font-weight: 800; color: var(--dx-primary) !important; font-size: 1.25rem; }
.domain-search { border-radius: 999px; padding: .55rem 1.25rem; border-color: var(--dx-border); min-width: 320px; }
.domain-search:focus { border-color: var(--dx-primary); box-shadow: 0 0 0 .2rem rgba(79,70,229,.15); }
.suggestions-box { z-index: 1050; max-height: 320px; overflow-y: auto; }
.suggestions-box .suggestion-item { padding: .6rem 1rem; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.suggestions-box .suggestion-item:hover { background: var(--dx-bg); }
.notif-dot { position: absolute; top: 0; right: -2px; width: 8px; height: 8px; background: #ef4444; border-radius: 50%; }
.cart-badge { position: absolute; top: -4px; right: -8px; font-size: .65rem; }

/* ---------- Hero ---------- */
.hero {
    background: linear-gradient(135deg, #312e81 0%, #4f46e5 55%, #06b6d4 130%);
    color: #fff; padding: 4.5rem 0 5.5rem; position: relative; overflow: hidden;
}
.hero::after {
    content: ""; position: absolute; inset: 0; opacity: .12; pointer-events: none;
    background-image: radial-gradient(circle at 20% 30%, #fff 0 2px, transparent 2px), radial-gradient(circle at 70% 60%, #fff 0 3px, transparent 3px), radial-gradient(circle at 40% 80%, #fff 0 2px, transparent 2px);
    background-size: 240px 240px, 320px 320px, 180px 180px;
}
.hero h1 { font-weight: 800; letter-spacing: -.02em; }
.hero .domain-search { min-width: 0; padding: .9rem 1.5rem; font-size: 1.05rem; }
.hero-trust { font-size: .9rem; opacity: .92; }
.hero-stat { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22); border-radius: 12px; padding: .9rem 1rem; backdrop-filter: blur(4px); }
.hero-stat .num { font-size: 1.4rem; font-weight: 800; }

/* ---------- Cards ---------- */
.card { border: 1px solid var(--dx-border); border-radius: 14px; }
.domain-card { transition: transform .15s ease, box-shadow .15s ease; height: 100%; }
.domain-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(30,41,59,.12); }
.domain-card .domain-name { font-weight: 700; font-size: 1.05rem; color: var(--dx-text); word-break: break-all; }
.domain-card .domain-tld { color: var(--dx-primary); }
.domain-card .price { font-weight: 800; font-size: 1.15rem; color: var(--dx-primary); }
.domain-card .sale-type { font-size: .72rem; }
.badge-premium { background: linear-gradient(135deg, #f59e0b, #ef4444); color: #fff; }
.featured-corner { position: absolute; top: 10px; right: 10px; }

.section-title { font-weight: 800; letter-spacing: -.01em; }

/* ---------- Filters ---------- */
.filter-panel .form-label { font-size: .82rem; font-weight: 600; color: var(--dx-muted); margin-bottom: .2rem; }

/* ---------- Auction ---------- */
.auction-timer { font-variant-numeric: tabular-nums; font-weight: 700; color: #dc2626; }
.auction-live { color: #16a34a; font-weight: 600; }

/* ---------- Dashboard ---------- */
.sidebar-card { position: sticky; top: 80px; }
.sidebar-nav .nav-link { color: var(--dx-text); border-radius: 8px; padding: .5rem .9rem; font-size: .93rem; display: flex; align-items: center; }
.sidebar-nav .nav-link:hover { background: var(--dx-bg); }
.sidebar-nav .nav-link.active { background: var(--dx-primary); color: #fff; }
.stat-card .label { font-size: .8rem; color: var(--dx-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.stat-card .value { font-size: 1.5rem; font-weight: 800; }
.timeline { position: relative; padding-left: 28px; }
.timeline::before { content: ""; position: absolute; left: 8px; top: 4px; bottom: 4px; width: 2px; background: var(--dx-border); }
.timeline-item { position: relative; padding-bottom: 1.1rem; }
.timeline-item::before {
    content: ""; position: absolute; left: -26px; top: 4px; width: 12px; height: 12px;
    border-radius: 50%; background: #fff; border: 3px solid var(--dx-primary);
}
.timeline-item.done::before { background: var(--dx-primary); }
.timeline-item.pending::before { border-color: var(--dx-border); }

/* ---------- Admin ---------- */
.admin-body { background: #f1f5f9; }
.admin-navbar { background: #1e1b4b; height: 56px; }
.admin-navbar .navbar-brand { font-size: 1.05rem; }
.admin-sidebar { background: #312e81; min-height: calc(100vh - 56px); }
.admin-sidebar .nav-link { color: #c7d2fe; padding: .5rem 1rem; font-size: .9rem; }
.admin-sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.06); }
.admin-sidebar .nav-link.active { color: #fff; background: var(--dx-primary); border-radius: 8px; margin: 0 .5rem; padding-left: .7rem; }
.admin-sidebar .nav-header { font-size: .68rem; letter-spacing: .08em; padding-top: .75rem; }

/* ---------- Auth ---------- */
.auth-body { background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%); min-height: 100vh; display: flex; align-items: center; }
.auth-wrapper { width: 100%; max-width: 440px; margin: 2rem auto; padding: 0 1rem; }
.auth-card { border: 0; border-radius: 18px; box-shadow: 0 12px 40px rgba(30,41,59,.14); }
.auth-logo { font-weight: 800; font-size: 1.5rem; color: var(--dx-primary); text-decoration: none; }

/* ---------- Footer ---------- */
.site-footer { background: #fff; border-top: 1px solid var(--dx-border); }
.site-footer h5, .site-footer h6 { font-weight: 700; }
.site-footer a { color: var(--dx-muted); text-decoration: none; }
.site-footer a:hover { color: var(--dx-primary); }

/* ---------- Misc ---------- */
.table > :not(caption) > * > * { padding: .7rem .75rem; }
.mobile-sticky-actions { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; border-top: 1px solid var(--dx-border); padding: .65rem 1rem; display: none; z-index: 1040; }
@media (max-width: 767.98px) {
    .mobile-sticky-actions { display: block; }
    .domain-search { min-width: 0; }
}
.valuation-range { background: linear-gradient(90deg, #06b6d4, #4f46e5); height: 8px; border-radius: 999px; }
.copy-btn { cursor: pointer; }