/* ===== RESET & BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --red:#e62e2e;--red-dark:#b91c1c;--orange:#ff6600;--yellow:#ffd700;
  --bg:#f5f5f5;--white:#fff;--text:#1a1a1a;--muted:#666;
  --border:#e8e8e8;--radius:6px;--shadow:0 2px 8px rgba(0,0,0,.08)
}
body{font-family:'Segoe UI',Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{max-width:1200px;margin:0 auto;padding:0 14px}

/* ===== TOPBAR ===== */
.topbar{background:#222;color:#bbb;font-size:12px;text-align:center;padding:6px 12px}
.topbar a{color:var(--orange)}

/* ===== HEADER ===== */
header{background:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.header-inner{display:flex;align-items:center;gap:16px;padding:12px 14px;flex-wrap:wrap}
.logo{font-size:26px;font-weight:900;color:var(--red);white-space:nowrap;flex-shrink:0}
.logo span{color:var(--orange)}

/* ===== SEARCH ===== */
.search{flex:1;display:flex;max-width:640px}
.search input{flex:1;border:2px solid var(--red);border-right:none;padding:10px 14px;font-size:14px;border-radius:4px 0 0 4px;outline:none}
.search input:focus{border-color:var(--red-dark)}
.search button{background:var(--red);color:#fff;border:none;padding:10px 20px;font-size:14px;font-weight:700;border-radius:0 4px 4px 0;cursor:pointer;white-space:nowrap}
.search button:hover{background:var(--red-dark)}

/* ===== HEADER NAV / ICONS ===== */
.header-nav{display:flex;gap:20px;flex-shrink:0;align-items:center}
.header-nav a{font-size:13px;color:#555;display:flex;flex-direction:column;align-items:center;gap:3px}
.header-nav a:hover{color:var(--red)}
.admin-link{font-size:12px;color:#888 !important}

/* ===== NAV BAR ===== */
.nav{background:var(--red);position:sticky;top:62px;z-index:99}
.nav-inner{display:flex;overflow-x:auto;scrollbar-width:none}
.nav-inner::-webkit-scrollbar{display:none}
.nav-inner a{color:rgba(255,255,255,.88);padding:10px 15px;font-size:13px;white-space:nowrap;transition:background .15s}
.nav-inner a:hover,.nav-inner a.active{background:rgba(0,0,0,.18);color:#fff}

/* ===== HERO ===== */
.hero{
  background:linear-gradient(135deg,#e62e2e 0%,#ff6600 60%,#ffd700 100%);
  border-radius:var(--radius);margin:18px 0;padding:42px 36px;color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:20px
}
.hero h1{font-size:36px;font-weight:900;line-height:1.15}
.hero p{margin-top:10px;font-size:16px;opacity:.92}
.hero-emoji{font-size:90px;flex-shrink:0}
.btn-hero{display:inline-block;background:#fff;color:var(--red);padding:12px 28px;border-radius:4px;font-weight:800;font-size:15px;margin-top:18px}
.btn-hero:hover{background:#fff5f5}

/* ===== FLASH SALE BAR ===== */
.flash-bar{background:#fff;border-radius:var(--radius);padding:14px 18px;margin-bottom:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;box-shadow:var(--shadow)}
.flash-title{font-size:20px;font-weight:900;color:var(--red);display:flex;align-items:center;gap:6px}
.countdown{display:flex;gap:5px;align-items:center}
.count-box{background:var(--red);color:#fff;font-weight:800;font-size:18px;padding:4px 10px;border-radius:4px;min-width:36px;text-align:center}
.count-sep{font-weight:900;font-size:18px;color:var(--red)}
.flash-bar .see-all{margin-left:auto;color:var(--red);font-size:13px;font-weight:700}

/* ===== SECTION ===== */
.section{margin:24px 0}
.section-header,.section h2+*{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.section h2,.section-header h2{font-size:20px;font-weight:800;border-left:4px solid var(--red);padding-left:10px}
.section-header a{color:var(--red);font-size:13px;font-weight:600}

/* ===== CATEGORY TABS ===== */
.cat-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.tab{background:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.tab:hover,.tab.active{border-color:var(--red);color:var(--red);background:#fff5f5}

/* ===== PRODUCT GRID ===== */
.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:20px}

/* ===== PRODUCT CARD ===== */
.card{background:#fff;border-radius:var(--radius);overflow:hidden;transition:box-shadow .2s,transform .2s;cursor:pointer;border:1px solid var(--border)}
.card:hover{box-shadow:0 6px 24px rgba(0,0,0,.14);transform:translateY(-2px)}
.card-top{position:relative}
.card-img{aspect-ratio:1;background:#f8f8f8;display:flex;align-items:center;justify-content:center;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover}
.card-img .emoji-fallback{font-size:52px}
.badge{position:absolute;top:8px;left:8px;background:var(--red);color:#fff;padding:2px 7px;border-radius:3px;font-size:11px;font-weight:800}
.badge-flash{position:absolute;top:8px;right:8px;background:var(--orange);color:#fff;padding:2px 7px;border-radius:3px;font-size:10px;font-weight:800}
.card-body{padding:10px}
.title{font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px;color:#333}
.price{margin-top:8px;color:var(--red);font-size:16px;font-weight:900}
.old{text-decoration:line-through;color:#aaa;font-size:12px;margin-left:4px}
.meta{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:6px}
.btn-buy{display:block;background:var(--red);color:#fff;text-align:center;padding:9px;font-weight:700;font-size:13px;border-top:1px solid #f0f0f0}
.btn-buy:hover{background:var(--red-dark)}

/* ===== PRODUCT DETAIL ===== */
.product-detail{display:grid;grid-template-columns:420px 1fr;gap:28px;background:#fff;border-radius:var(--radius);padding:24px;margin:20px 0;box-shadow:var(--shadow)}
.product-detail>img,.gallery-main{width:100%;border-radius:var(--radius);border:1px solid var(--border)}
.detail-title{font-size:22px;font-weight:700;line-height:1.4;margin-bottom:12px}
.rating-row{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.stars{color:#f5a623;font-size:16px}
.rating-num{font-size:22px;font-weight:800;color:var(--red)}
.detail-price-box{background:#fff5f5;border-radius:var(--radius);padding:14px;margin-bottom:16px}
.detail-price{color:var(--red);font-size:30px;font-weight:900}
.detail-old{color:#aaa;font-size:16px;text-decoration:line-through;margin-left:8px}
.detail-disc{background:var(--red);color:#fff;font-size:13px;font-weight:800;padding:3px 10px;border-radius:3px;display:inline-block;margin-top:6px}
.detail-meta{display:flex;gap:20px;font-size:13px;color:#888;margin-bottom:16px;flex-wrap:wrap}
.detail-meta strong{color:#333}
.detail-desc{font-size:14px;line-height:1.8;color:#555;border-top:1px solid #eee;padding-top:16px;margin-top:16px}
.buy-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.detail-buy,.btn-buy-now{flex:1;background:var(--red);color:#fff;border:none;padding:13px 24px;font-size:15px;font-weight:800;border-radius:4px;cursor:pointer;text-align:center;display:block}
.detail-buy:hover,.btn-buy-now:hover{background:var(--red-dark)}
.btn-cart{flex:1;background:#fff;color:var(--red);border:2px solid var(--red);padding:13px 24px;font-size:15px;font-weight:800;border-radius:4px;cursor:pointer;text-align:center}
.btn-cart:hover{background:#fff5f5}

/* ===== FLASH SALE PAGE ===== */
.flash-hero{background:linear-gradient(135deg,var(--red),var(--orange));color:#fff;text-align:center;padding:36px;border-radius:var(--radius);margin-bottom:20px}
.flash-hero h1{font-size:32px;font-weight:900}
.flash-countdown{display:flex;justify-content:center;gap:10px;margin-top:18px}
.fc-box{background:rgba(0,0,0,.3);padding:10px 18px;border-radius:6px;text-align:center}
.fc-num{font-size:28px;font-weight:900;display:block}
.fc-label{font-size:11px;opacity:.8}

/* ===== BLOG ===== */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin:20px 0}
.blog-card{background:#fff;border-radius:var(--radius);overflow:hidden;transition:box-shadow .2s;border:1px solid var(--border)}
.blog-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.12)}
.blog-card img{width:100%;height:180px;object-fit:cover}
.blog-body{padding:16px}
.blog-cat{background:#fff0f0;color:var(--red);font-size:11px;font-weight:700;padding:3px 8px;border-radius:3px;display:inline-block;margin-bottom:8px}
.blog-body h3{font-size:16px;font-weight:700;line-height:1.4;margin-bottom:8px}
.blog-body p{font-size:13px;color:#666;line-height:1.6}
.blog-footer{padding:10px 16px;border-top:1px solid #f0f0f0;font-size:12px;color:#aaa}

/* ===== FOOTER ===== */
.footer{background:#1a1a1a;color:#aaa;margin-top:40px;padding:40px 0 20px;font-size:13px}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:28px;margin-bottom:28px}
.footer-col h4{color:#fff;font-size:14px;font-weight:700;margin-bottom:12px}
.footer-col a{display:block;color:#aaa;margin-bottom:7px}
.footer-col a:hover{color:var(--orange)}
.footer-bottom{border-top:1px solid #333;padding-top:18px;text-align:center;font-size:12px;color:#555}
/* Legacy footer-links support */
.footer strong{color:#fff}
.footer-links{margin-top:12px;display:flex;gap:16px;flex-wrap:wrap}
.footer-links a{color:#fff}

/* ===== BREADCRUMB ===== */
.breadcrumb{font-size:13px;color:#888;margin:14px 0}
.breadcrumb a{color:var(--red)}
.breadcrumb span{margin:0 6px}

/* ===== PAGINATION ===== */
.pagination{display:flex;gap:6px;justify-content:center;margin:24px 0;flex-wrap:wrap}
.pagination a{background:#fff;border:1px solid var(--border);padding:7px 13px;border-radius:4px;font-size:13px;color:#333}
.pagination a.active,.pagination a:hover{background:var(--red);color:#fff;border-color:var(--red)}

/* ===== ALERTS ===== */
.alert{padding:12px 16px;border-radius:4px;margin-bottom:16px;font-size:14px}
.alert-success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}
.alert-danger{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}
.alert-info{background:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}
.empty{background:#fff;border-radius:var(--radius);padding:24px;color:var(--muted);text-align:center}

/* ===== ADMIN ===== */
.admin-wrap{display:flex;min-height:100vh}
.admin-sidebar{width:220px;flex-shrink:0;background:#1a1a2e;padding:20px 0;position:sticky;top:0;height:100vh;overflow-y:auto}
.admin-sidebar .logo{color:var(--red);font-size:18px;font-weight:900;padding:0 20px 20px;display:block;border-bottom:1px solid #333}
.admin-sidebar a{display:block;color:#ccc;padding:11px 20px;font-size:13px;transition:background .15s}
.admin-sidebar a:hover,.admin-sidebar a.active{background:var(--red);color:#fff}
.admin-main{flex:1;padding:28px;background:#f5f5f5}
.admin-main h1{font-size:22px;font-weight:800;margin-bottom:20px}
.admin-card{background:#fff;border-radius:var(--radius);padding:20px;margin-bottom:20px;box-shadow:var(--shadow)}
.admin-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;margin-bottom:24px}
.stat-box{background:#fff;border-radius:var(--radius);padding:20px;text-align:center;box-shadow:var(--shadow)}
.stat-num{font-size:28px;font-weight:900;color:var(--red)}
.stat-label{font-size:13px;color:#888;margin-top:4px}

/* ===== TABLE ===== */
table{width:100%;border-collapse:collapse;font-size:13px}
th{background:#f5f5f5;padding:10px 12px;text-align:left;font-weight:700;border-bottom:2px solid #eee}
td{padding:10px 12px;border-bottom:1px solid #f0f0f0;vertical-align:middle}
tr:hover td{background:#fafafa}

/* ===== FORMS ===== */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:#555}
.form-control{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;outline:none;font-family:inherit}
.form-control:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(230,46,46,.1)}
textarea.form-control{resize:vertical}
select.form-control{appearance:auto}
.btn-primary{background:var(--red);color:#fff;border:none;padding:10px 24px;font-size:14px;font-weight:700;border-radius:4px;cursor:pointer}
.btn-primary:hover{background:var(--red-dark)}
.btn-danger{background:#dc3545;color:#fff;border:none;padding:6px 14px;font-size:12px;border-radius:4px;cursor:pointer}
.btn-success{background:#28a745;color:#fff;border:none;padding:6px 14px;font-size:12px;border-radius:4px;cursor:pointer}
.badge-pill{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700}
.badge-success{background:#d4edda;color:#155724}
.badge-warning{background:#fff3cd;color:#856404}
.badge-danger{background:#f8d7da;color:#721c24}

/* ===== RESPONSIVE ===== */
@media(max-width:1100px){.product-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){
  .product-grid{grid-template-columns:repeat(3,1fr)}
  .product-detail{grid-template-columns:1fr}
  .hero h1{font-size:26px}
  .hero-emoji{display:none}
}
@media(max-width:600px){
  .product-grid{grid-template-columns:repeat(2,1fr)}
  .header-inner{flex-wrap:wrap}
  .search{order:3;flex-basis:100%;max-width:100%}
  .admin-link,.header-nav{display:none}
  .hero{padding:28px 20px}
  .admin-wrap{flex-direction:column}
  .admin-sidebar{width:100%;height:auto;position:static}
}

/* ===== PICKNEST PREMIUM OVERRIDES ===== */
:root{--red:#111827;--red-dark:#030712;--orange:#2563eb;--yellow:#d4af37;--bg:#f7f8fb;--text:#111827;--muted:#6b7280;--border:#e5e7eb;--radius:14px;--shadow:0 12px 30px rgba(17,24,39,.08)}
body{font-family:Inter,'Segoe UI',Arial,sans-serif;background:var(--bg);color:var(--text)}
.topbar{background:#0f172a;color:#cbd5e1;padding:8px 12px;letter-spacing:.01em}
header{box-shadow:0 1px 0 rgba(17,24,39,.08);background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}
.logo{font-size:25px;letter-spacing:-.04em;color:#111827;text-transform:uppercase}.logo span{color:#2563eb}
.search input{border:1px solid var(--border);background:#f9fafb;border-right:none;border-radius:999px 0 0 999px}.search input:focus{border-color:#2563eb;background:#fff}.search button{background:#111827;border-radius:0 999px 999px 0;padding:10px 22px}.search button:hover{background:#2563eb}
.header-nav a{font-weight:700;color:#475569;flex-direction:row}.header-nav a:hover{color:#2563eb}.admin-link{opacity:.7}
.nav{background:#fff;top:61px;border-bottom:1px solid var(--border)}.nav-inner a{color:#475569;padding:12px 16px;font-weight:700}.nav-inner a:hover,.nav-inner a.active{background:#eff6ff;color:#2563eb}
.hero.premium-hero{background:linear-gradient(135deg,#0f172a 0%,#1e293b 58%,#2563eb 100%);border-radius:24px;margin:24px 0;padding:54px 48px;color:#fff;box-shadow:0 24px 60px rgba(15,23,42,.20)}
.hero-copy{max-width:690px}.eyebrow{display:inline-block;font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:900;color:#93c5fd;margin-bottom:12px}.hero h1{font-size:48px;line-height:1.04;letter-spacing:-.05em;max-width:680px}.hero p{font-size:18px;line-height:1.7;color:#dbeafe;max-width:680px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.btn-hero{background:#fff;color:#111827;border-radius:999px;margin-top:0}.btn-secondary{display:inline-block;border:1px solid rgba(255,255,255,.35);color:#fff;padding:12px 24px;border-radius:999px;font-weight:800}.btn-secondary:hover{background:rgba(255,255,255,.12)}
.hero-panel{min-width:260px;display:grid;gap:12px}.panel-card{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:16px;backdrop-filter:blur(10px)}.panel-card strong{display:block;font-size:16px}.panel-card span{display:block;color:#cbd5e1;font-size:13px;margin-top:4px}
.trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 28px}.trust-row div{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.trust-row strong{display:block;font-size:16px}.trust-row span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.clean-header{align-items:flex-end}.clean-header h2{border:0;padding:0;font-size:28px;letter-spacing:-.03em}.clean-header p{color:var(--muted);margin-top:5px}.clean-header a{color:#2563eb;font-weight:900}
.guide-strip{background:#fff;border:1px solid var(--border);border-radius:22px;padding:28px;display:flex;justify-content:space-between;gap:20px;align-items:center;box-shadow:var(--shadow)}.guide-strip h2{border:0;padding:0;max-width:640px;letter-spacing:-.03em}.guide-cards{display:flex;gap:10px;flex-wrap:wrap}.guide-cards a{background:#f1f5f9;border:1px solid #e2e8f0;padding:12px 16px;border-radius:999px;font-weight:800;color:#334155}.guide-cards a:hover{background:#eff6ff;color:#2563eb;border-color:#bfdbfe}
.tab{border-radius:999px;background:#fff}.tab:hover,.tab.active{border-color:#2563eb;color:#2563eb;background:#eff6ff}.product-grid{gap:16px}.card{border-radius:18px;box-shadow:0 1px 0 rgba(17,24,39,.04);cursor:default}.card:hover{box-shadow:0 18px 35px rgba(17,24,39,.12)}.badge{background:#111827;border-radius:999px}.badge-flash{background:#2563eb;border-radius:999px}.title{font-weight:700;color:#1f2937}.price{color:#111827}.btn-buy{background:#111827;border-radius:0 0 18px 18px}.btn-buy:hover{background:#2563eb}.section-header span,.meta{color:#64748b}.footer{background:#0f172a}.footer-col h4{letter-spacing:.02em}.footer-bottom{color:#94a3b8}
@media(max-width:900px){.hero.premium-hero{padding:34px 24px}.hero h1{font-size:34px}.hero-panel{min-width:100%;width:100%}.trust-row{grid-template-columns:1fr}.guide-strip{display:block}.guide-cards{margin-top:18px}.clean-header h2{font-size:24px}}