:root{--primary:#0d6efd;--accent:#22c55e;--danger:#ef4444;--warning:#f59e0b;--dark:#111827;--muted:#6b7280;--bg:#f5f7fb;--card:#ffffff;--radius:14px;--shadow:0 10px 30px rgba(17,24,39,.08)}
body{background:var(--bg)}
.card{border:0;border-radius:var(--radius);box-shadow:var(--shadow)}
.card .card-header{border-bottom:0;background:transparent}
.btn{border-radius:999px}
.btn-main{background:linear-gradient(135deg,var(--primary),#3b82f6);color:#fff;border:0}
.btn-main:hover{opacity:.95;color:#fff}
.badge{border-radius:999px}
.table{background:var(--card)}
.table thead th{background:#f1f5f9;color:#111827;border-bottom:0}
.table tr:hover{background:#f9fafb}
.form-control,.form-select{border-radius:10px;border-color:#e5e7eb}
.form-control:focus,.form-select:focus{box-shadow:0 0 0 .25rem rgba(13,110,253,.15);border-color:#bfdbfe}
.header-nav{box-shadow:0 6px 20px rgba(17,24,39,.06)}
.product-card{transition:transform .2s ease, box-shadow .2s ease;border:0;border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.product-card:hover{transform:translateY(-4px);box-shadow:0 14px 35px rgba(17,24,39,.12)}
.product-card .price{font-weight:700;color:#111827}
.ribbon{position:absolute;top:10px;left:-8px;background:var(--danger);color:#fff;padding:6px 14px;border-radius:0 8px 8px 0;font-size:.8rem}
.status-badge{position:absolute;top:10px;right:10px}
.badge-success{background:var(--accent)!important}
.badge-warning{background:var(--warning)!important}
.badge-danger{background:var(--danger)!important}
.nav-pills .nav-link{border-radius:999px}
.dropdown-menu{border-radius:12px;box-shadow:0 12px 30px rgba(17,24,39,.12)}
.footer{color:var(--muted)}
/* utilities */
.shadow-soft{box-shadow:var(--shadow)!important}
.rounded-xl{border-radius:16px}
.hover-raise{transition:transform .2s ease, box-shadow .2s ease}
.hover-raise:hover{transform:translateY(-3px);box-shadow:0 14px 35px rgba(17,24,39,.12)}

/* Hero banner */
.hero{background:linear-gradient(120deg,#fff, #eef2ff);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}
.hero .hero-content{padding:40px 28px}
.hero h1{font-weight:800;letter-spacing:.2px}
.hero p{color:#4b5563}
.hero .cta{margin-top:14px}
.hero-img{min-height:240px;background:#f8fafc;display:flex;align-items:center;justify-content:center}

/* Top categories */
.top-cats{display:flex;gap:18px;flex-wrap:wrap}
.cat-pill{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px 16px;display:flex;align-items:center;gap:12px;min-width:160px;transition:transform .2s ease, box-shadow .2s ease}
.cat-pill:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(17,24,39,.12)}
.cat-pill .icon{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#eef2ff;color:#334155;font-size:20px}
.cat-pill .name{font-weight:600}