/*
Theme Name: CouponHub
Theme URI: https://example.com
Author: Your Name
Author URI: https://example.com
Description: Custom coupon, deals & cashback marketplace theme with dynamic Stores, Coupons and Categories management.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: couponhub
*/

/* =========================================================
   Theme design system — colors, layout, components
   ========================================================= */

  :root{
    --radius:14px;
    --font:'Segoe UI', Roboto, Arial, sans-serif;
    --bg:#FFFFFF; --section-alt:#F7F3FB; --surface:#FFFFFF;
    --primary:#561381; --primary-dark:#3B0C59; --primary-tint:#EFE6F7;
    --accent:#ED254E; --accent-dark:#C01035; --accent-tint:#FDE7EB;
    --text:#221430; --text-muted:#6B6178; --border:#E8E2EF;
    --success:#0F8A5F; --success-tint:#E3F5EC;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{font-family:var(--font); background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased;}
  img,svg{display:block;}
  button{font-family:inherit;}

  /* scrollbar hide for carousels */
  .scroll-row{ scrollbar-width:none; -ms-overflow-style:none; }
  .scroll-row::-webkit-scrollbar{ display:none; }

  /* ============ HEADER ============ */
  header{ background:var(--surface); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:150; }
  .header-top{ display:flex; align-items:center; gap:18px; max-width:1240px; margin:0 auto; padding:14px 20px; }
  .logo{ display:flex; align-items:center; gap:6px; font-size:21px; font-weight:700; color:var(--primary); white-space:nowrap; flex-shrink:0; }
  .logo .dot{ color:var(--accent); }
  .search-bar{ flex:1; display:flex; align-items:center; background:var(--section-alt); border-radius:24px; padding:9px 16px; gap:8px; max-width:520px; }
  .search-bar input{ border:none; background:transparent; outline:none; width:100%; font-size:14px; color:var(--text); }
  .search-bar svg{ flex-shrink:0; color:var(--text-muted); }
  .country-pill{ display:flex; align-items:center; gap:6px; border:1px solid var(--border); border-radius:20px; padding:7px 12px; font-size:13px; font-weight:600; color:var(--text); white-space:nowrap; cursor:pointer; }
  .flag{ width:18px; height:13px; border-radius:2px; background:linear-gradient(180deg,#FF9933 33%,#fff 33%,#fff 66%,#128807 66%); flex-shrink:0; }
  .btn-outline{ border:1.5px solid var(--primary); color:var(--primary); background:transparent; padding:8px 18px; border-radius:22px; font-size:14px; font-weight:600; cursor:pointer; white-space:nowrap; }
  .btn-cta{ background:var(--accent); color:#fff; border:none; padding:9px 20px; border-radius:22px; font-size:14px; font-weight:600; cursor:pointer; white-space:nowrap; }
  .desktop-only{ display:flex; }
  .mobile-only{ display:none; }
  .header-nav{ border-top:1px solid var(--border); display:flex; gap:26px; max-width:1240px; margin:0 auto; padding:10px 20px; font-size:13.5px; font-weight:600; color:var(--text-muted); }
  .header-nav span{ cursor:pointer; }
  .header-nav span:hover{ color:var(--primary); }

  .menu-toggle{ width:40px; height:40px; border-radius:10px; border:1px solid var(--border); background:var(--surface); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; }

  /* mobile dropdown menu panel */
  .mobile-menu{ display:none; border-top:1px solid var(--border); background:var(--surface); padding:14px 20px 18px; }
  .mobile-menu.open{ display:block; }
  .mobile-menu .btn-cta{ display:block; width:100%; text-align:center; margin-bottom:14px; }
  .mm-tabs{ display:flex; gap:10px; margin-bottom:14px; }
  .mm-tab{ flex:1; aspect-ratio:1/1; max-height:74px; border-radius:16px; background:var(--primary-tint); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; cursor:pointer; border:1.5px solid transparent; color:var(--primary); }
  .mm-tab.active{ border-color:var(--primary); background:var(--primary); color:#fff; }
  .mm-tab span{ font-size:11.5px; font-weight:700; }
  .mm-panel{ display:none; }
  .mm-panel.active{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
  .mm-item{ text-align:center; }
  .mm-item .ic{ width:44px; height:44px; margin:0 auto 6px; border-radius:12px; background:var(--section-alt); color:var(--primary); display:flex; align-items:center; justify-content:center; }
  .mm-item .lb{ font-size:10.5px; font-weight:600; color:var(--text); }

  /* ============ HERO SLIDER ============ */
  .hero-wrap{ max-width:1240px; margin:20px auto 0; padding:0 20px; }
  .hero{ position:relative; border-radius:20px; overflow:hidden; background:var(--primary); }
  .hero-track{ display:flex; transition:transform .5s ease; }
  .hero-slide{ min-width:100%; aspect-ratio:21/8; position:relative; display:flex; align-items:flex-end; }
  .hero-slide .bgtag{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.3); font-size:13px; font-weight:700; }
  .hero-slide .overlay{ position:relative; z-index:2; padding:22px 30px; color:#fff; background:linear-gradient(0deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 70%); width:100%; }
  .hero-slide h1{ font-size:clamp(16px,3vw,28px); font-weight:700; margin-bottom:6px; }
  .hero-slide p{ font-size:clamp(11px,1.4vw,14px); opacity:.9; }
  .hero-arrow{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.2); border:none; color:#fff; width:34px; height:34px; border-radius:50%; cursor:pointer; font-size:16px; z-index:5; }
  .hero-arrow.prev{ left:10px; } .hero-arrow.next{ right:10px; }
  .hero-captions{ display:flex; gap:22px; justify-content:center; margin:14px 0 4px; flex-wrap:wrap; }
  .hero-captions span{ font-size:13px; font-weight:600; color:var(--text-muted); cursor:pointer; padding-bottom:6px; border-bottom:2px solid transparent; }
  .hero-captions span.active{ color:var(--primary); font-weight:700; border-color:var(--accent); }

  /* ============ SECTION SHELL ============ */
  section.block{ max-width:1240px; margin:0 auto; padding:40px 20px; }
  .section-alt{ background:var(--section-alt); }
  .section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:18px; gap:10px; }
  .section-head h2{ font-size:clamp(17px,2.2vw,22px); font-weight:700; color:var(--text); }
  .section-head .sub{ font-size:12.5px; color:var(--text-muted); margin-top:2px; }
  .see-all{ font-size:13px; font-weight:600; color:var(--primary); cursor:pointer; white-space:nowrap; }
  .row-nav{ display:flex; gap:8px; }
  .row-nav button{ width:32px; height:32px; border-radius:50%; border:1px solid var(--border); background:var(--surface); cursor:pointer; font-size:14px; color:var(--text); }
  .row-nav button:hover{ background:var(--primary-tint); }

  /* ============ DEALS CAROUSEL ============ */
  .deals-row{ display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; }
  .deal-card{ scroll-snap-align:start; flex:0 0 auto; width:28%; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; cursor:pointer; transition:.15s; }
  .deal-card:hover{ box-shadow:0 6px 18px rgba(0,0,0,.08); }
  .deal-img{ aspect-ratio:16/10; background:var(--primary-tint); display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:12px; font-weight:600; }
  .deal-body{ padding:16px; }
  .deal-body .badge{ display:inline-block; background:var(--accent-tint); color:var(--accent-dark); font-size:11px; font-weight:700; padding:3px 9px; border-radius:6px; margin-bottom:8px; }
  .deal-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
  .deal-text h4{ font-size:15px; font-weight:700; line-height:1.35; margin-bottom:6px; }
  .deal-text p{ font-size:12.5px; color:var(--text-muted); line-height:1.5; }
  .store-logo{ width:40px; height:40px; border-radius:50%; background:var(--section-alt); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; color:var(--text-muted); flex-shrink:0; }

  @media(max-width:1023px){ .deal-card{ width:40%; } }
  @media(max-width:639px){ .deal-card{ width:78%; } }

  /* ============ TRENDING STORES ============ */
  .trending-wrap{ display:grid; grid-template-columns:270px 1fr; gap:18px; }
  .featured-store{ border-radius:var(--radius); background:var(--primary); color:#fff; padding:22px; display:flex; flex-direction:column; justify-content:flex-end; min-height:410px; position:relative; overflow:hidden; }
  .featured-store::before{ content:"FEATURED STORE IMAGE"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.6) 100%), var(--primary-dark); color:rgba(255,255,255,.35); font-size:11px; font-weight:700; text-align:center; padding:20px; }
  .featured-store .content{ position:relative; z-index:2; }
  .featured-tag{ background:var(--accent); color:#fff; font-size:11px; font-weight:700; padding:4px 10px; border-radius:6px; display:inline-block; margin-bottom:10px; }
  .featured-store .store-mark{ width:54px; height:54px; border-radius:14px; background:#fff; color:var(--primary); font-weight:700; display:flex; align-items:center; justify-content:center; font-size:12px; margin-bottom:10px; }
  .featured-store h3{ font-size:19px; margin-bottom:6px; }
  .featured-store .stats{ font-size:12.5px; opacity:.9; line-height:1.6; }

  .stores-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; align-content:start; }
  .store-card{ text-align:center; cursor:pointer; }
  .store-sq{ aspect-ratio:1/1; border-radius:var(--radius); background:var(--surface); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; margin-bottom:8px; font-size:11px; font-weight:700; color:var(--text-muted); }
  .store-sq .hover-count{ position:absolute; inset:0; background:rgba(86,19,129,.9); color:#fff; display:flex; align-items:center; justify-content:center; font-size:11.5px; font-weight:700; text-align:center; opacity:0; transition:.15s; padding:8px; }
  .store-card:hover .hover-count{ opacity:1; }
  .store-card .name{ font-size:12.5px; font-weight:600; color:var(--text); }

  @media(max-width:1023px){
    .trending-wrap{ grid-template-columns:1fr; }
    .featured-store{ min-height:180px; flex-direction:row; align-items:flex-end; }
    .stores-grid{ grid-template-columns:repeat(4,1fr); }
  }
  @media(max-width:639px){
    .stores-grid{ grid-template-columns:repeat(3,1fr); }
    .featured-store{ min-height:150px; padding:16px; }
    .featured-store h3{ font-size:16px; }
  }

  /* ============ TODAY'S BEST OFFERS ============ */
  .offer-tabs{ display:flex; gap:8px; overflow-x:auto; margin-bottom:18px; padding-bottom:4px; }
  .offer-tab{ flex:0 0 auto; padding:8px 18px; border-radius:20px; border:1.5px solid var(--border); font-size:13px; font-weight:600; color:var(--text-muted); cursor:pointer; background:var(--surface); white-space:nowrap; }
  .offer-tab.active{ background:var(--primary); border-color:var(--primary); color:#fff; }
  .offers-panel{ display:none; }
  .offers-panel.active{ display:block; }
  .offers-grid{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(2,1fr); grid-auto-columns:30%; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; }
  .offer-card{ scroll-snap-align:start; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px; display:flex; flex-direction:column; gap:8px; cursor:pointer; transition:.15s; min-height:150px; }
  .offer-card:hover{ box-shadow:0 6px 18px rgba(0,0,0,.08); }
  .offer-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .offer-head .store{ display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; }
  .offer-head .discount{ font-size:14px; font-weight:800; color:var(--accent-dark); text-align:right; line-height:1.25; }
  .offer-desc{ font-size:12px; color:var(--text-muted); line-height:1.5; flex:1; }
  .offer-link{ font-size:11px; font-weight:700; color:var(--primary); border-top:1px solid var(--border); padding-top:8px; letter-spacing:.2px; }

  @media(max-width:1023px){ .offers-grid{ grid-auto-columns:47%; } }
  @media(max-width:639px){ .offers-grid{ grid-auto-columns:82%; } }

  /* ============ CATEGORIES ============ */
  .cat-grid-desktop{ display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
  .cat-grid-scroll{ display:none; }
  .cat-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px 8px; text-align:center; cursor:pointer; transition:.15s; }
  .cat-card:hover{ border-color:var(--primary); }
  .cat-card .icon{ width:42px; height:42px; margin:0 auto 8px; border-radius:50%; background:var(--primary-tint); color:var(--primary); display:flex; align-items:center; justify-content:center; }
  .cat-card .name{ font-size:12px; font-weight:600; color:var(--text); }

  @media(max-width:1023px){ .cat-grid-desktop{ grid-template-columns:repeat(4,1fr); } }
  @media(max-width:639px){
    .cat-grid-desktop{ display:none; }
    .cat-grid-scroll{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(4,1fr); grid-auto-columns:44%; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:4px; }
    .cat-grid-scroll .cat-card{ scroll-snap-align:start; padding:12px 6px; }
  }

  /* ============ TRUST / HOW IT WORKS ============ */
  .trust-strip{ display:grid; grid-template-columns:repeat(4,1fr); text-align:center; gap:16px; }
  .trust-strip .num{ font-size:24px; font-weight:800; color:var(--primary); }
  .trust-strip .label{ font-size:12px; color:var(--text-muted); margin-top:4px; }
  .how-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
  .how-card{ text-align:center; padding:20px 14px; }
  .how-num{ width:32px; height:32px; border-radius:50%; background:var(--accent); color:#fff; font-weight:700; font-size:13px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; }
  .how-card h4{ font-size:14.5px; margin-bottom:6px; }
  .how-card p{ font-size:12.5px; color:var(--text-muted); line-height:1.5; }
  @media(max-width:639px){ .trust-strip, .how-grid{ grid-template-columns:repeat(2,1fr); } }

  /* ============ NEWSLETTER / FOOTER ============ */
  .newsletter{ background:var(--primary); border-radius:18px; padding:32px; display:flex; align-items:center; justify-content:space-between; gap:20px; color:#fff; max-width:1240px; margin:0 auto; flex-wrap:wrap; }
  .newsletter h3{ font-size:19px; margin-bottom:4px; }
  .newsletter p{ font-size:12.5px; opacity:.85; }
  .nl-form{ display:flex; gap:8px; width:100%; max-width:360px; }
  .nl-form input{ flex:1; padding:11px 16px; border-radius:22px; border:none; font-size:13px; outline:none; min-width:0; }
  .nl-form button{ background:var(--accent); color:#fff; border:none; padding:11px 20px; border-radius:22px; font-weight:600; font-size:13px; cursor:pointer; flex-shrink:0; }

  footer{ background:var(--section-alt); margin-top:40px; padding:36px 20px 22px; }
  .footer-grid{ max-width:1240px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:26px; }
  .footer-grid h5{ font-size:13px; margin-bottom:12px; }
  .footer-grid ul{ list-style:none; }
  .footer-grid li{ font-size:12.5px; color:var(--text-muted); margin-bottom:8px; cursor:pointer; }
  .app-badges{ display:flex; gap:8px; margin-top:12px; }
  .app-badges div{ border:1px solid var(--border); border-radius:8px; padding:7px 11px; font-size:10px; font-weight:600; color:var(--text-muted); }
  .footer-bottom{ max-width:1240px; margin:20px auto 0; padding-top:16px; border-top:1px solid var(--border); font-size:11.5px; color:var(--text-muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; }
  @media(max-width:639px){ .footer-grid{ grid-template-columns:repeat(2,1fr); } }

  /* ============ RESPONSIVE HEADER SWITCH ============ */
  @media(max-width:1023px){
    .desktop-only{ display:none; }
    .mobile-only{ display:flex; }
    .header-nav{ display:none; }
  }

  /* ============ STORE PAGE ============ */
  .store-hero{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-bottom:10px; }
  .store-hero .logo-lg{ width:84px; height:84px; border-radius:18px; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px; overflow:hidden; flex-shrink:0; }
  .store-hero h1{ font-size:24px; margin-bottom:4px; }
  .store-hero .meta{ font-size:13px; color:var(--text-muted); }
  .store-hero .actions{ margin-left:auto; display:flex; gap:10px; }
  .btn-follow{ border:1.5px solid var(--primary); color:var(--primary); background:#fff; padding:9px 18px; border-radius:22px; font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; cursor:pointer; }
  .store-desc{ font-size:13.5px; color:var(--text-muted); line-height:1.7; max-width:760px; margin:14px 0 30px; }

  /* ============ FULL-WIDTH COUPON ROW (GrabOn-style, used on store pages) ============ */
  .coupon-list{ display:flex; flex-direction:column; gap:18px; }
  .coupon-row{ position:relative; background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
  .coupon-row:hover{ box-shadow:0 6px 20px rgba(86,19,129,.08); }
  .badge-tag{ display:inline-flex; align-items:center; gap:5px; color:#fff; font-size:10.5px; font-weight:700; letter-spacing:.3px; padding:6px 14px 6px 12px; border-radius:0 0 10px 0; }
  .badge-tag.limited{ background:var(--accent); }
  .badge-tag.flash{ background:#F59E0B; }
  .badge-tag.recommended{ background:var(--primary); }
  .badge-tag.trending{ background:var(--success); }

  .coupon-row-inner{ display:flex; flex-wrap:wrap; align-items:center; gap:20px; padding:18px 22px; }
  .cr-discount{ flex:0 0 150px; font-size:19px; font-weight:800; color:var(--accent-dark); line-height:1.25; }
  .cr-info{ flex:1 1 280px; min-width:220px; }
  .cr-info h4{ font-size:14.5px; font-weight:700; line-height:1.4; margin-bottom:6px; }
  .details-toggle{ background:none; border:none; padding:0; font-size:12px; font-weight:700; color:var(--primary); display:inline-flex; align-items:center; gap:4px; cursor:pointer; }
  .details-toggle svg{ transition:.2s; }
  .details-toggle.open svg{ transform:rotate(180deg); }
  .details-panel{ display:none; font-size:12px; color:var(--text-muted); line-height:1.7; margin-top:10px; padding-top:10px; border-top:1px dashed var(--border); }
  .details-panel.open{ display:block; }

  .cr-code-col{ flex:0 0 220px; display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
  .code-pill{ position:relative; width:190px; height:46px; border:1.5px dashed var(--primary); border-radius:10px; overflow:hidden; cursor:pointer; background:var(--primary-tint); flex-shrink:0; display:block; text-decoration:none; }
  .code-pill .code-text-mask{ position:absolute; inset:0; display:flex; align-items:center; justify-content:flex-end; padding-right:16px; font-size:16px; font-weight:800; letter-spacing:3px; color:var(--primary); white-space:nowrap; }
  .code-pill .cta-overlay{ position:absolute; left:0; top:0; bottom:0; width:130px; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; gap:4px; font-size:10.5px; font-weight:700; z-index:2; }
  .code-pill .cta-overlay.full{ width:100%; }
  .code-pill.no-code{ border-style:solid; }
  .code-pill:hover .cta-overlay{ filter:brightness(1.08); }

  .cr-meta{ display:flex; align-items:center; gap:8px; flex-wrap:nowrap; justify-content:flex-end; font-size:10.5px; overflow-x:auto; max-width:100%; scrollbar-width:none; }
  .cr-meta::-webkit-scrollbar{ display:none; }
  .verified-tag{ display:flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; color:var(--success); white-space:nowrap; }
  .success-rate{ display:flex; align-items:center; gap:3px; font-size:10.5px; font-weight:600; color:var(--success); cursor:pointer; white-space:nowrap; }
  .used-count{ font-size:10.5px; color:var(--text-muted); white-space:nowrap; }
  .dot-sep{ width:3px; height:3px; border-radius:50%; background:var(--border); flex-shrink:0; }

  @media(max-width:640px){
    .cr-code-col{ align-items:flex-start; flex:1 1 100%; }
    .cr-meta{ justify-content:flex-start; }
    .cr-discount{ flex:1 1 100%; }
    .coupon-row-inner{ padding-top:26px; }
  }

  /* ============ STAR RATING (store page) ============ */
  .rating-block{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:14px 0 26px; }
  .rating-avg{ display:flex; align-items:center; gap:6px; font-size:14px; font-weight:700; color:var(--text); }
  .rating-avg .stars-static{ display:flex; gap:2px; color:#F5B301; }
  .rating-avg .count{ font-size:12px; font-weight:500; color:var(--text-muted); }
  .rate-store{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text-muted); }
  .rate-store .stars-input{ display:flex; gap:3px; cursor:pointer; }
  .rate-store .stars-input svg{ color:var(--border); transition:.1s; }
  .rate-store .stars-input svg.on{ color:#F5B301; }
  .rate-store .rate-msg{ font-size:12px; color:var(--success); font-weight:600; display:none; }

  /* ============ EXPIRED COUPONS SECTION ============ */
  .expired-section{ margin-top:36px; padding-top:24px; border-top:1px dashed var(--border); }
  .expired-section .section-head h2{ color:var(--text-muted); }
  .coupon-row.is-expired{ opacity:.6; }
  .coupon-row.is-expired .code-pill{ pointer-events:none; }
  .coupon-row.is-expired .cta-overlay{ background:var(--text-muted) !important; }
  .expired-tag{ display:inline-block; background:#F1EDF5; color:var(--text-muted); font-size:10px; font-weight:700; padding:3px 8px; border-radius:5px; margin-left:8px; }

  /* ============ ARCHIVE HEADER (Stores/Categories pages) ============ */
  .archive-header{ background:var(--section-alt); padding:30px 20px; }
  .archive-header-inner{ max-width:1240px; margin:0 auto; }
  .archive-header h1{ font-size:24px; margin-bottom:12px; }
  .archive-stats-row{ display:flex; gap:28px; flex-wrap:wrap; }
  .archive-stats-row .stat{ display:flex; align-items:baseline; gap:6px; }
  .archive-stats-row .stat .num{ font-size:20px; font-weight:800; color:var(--primary); }
  .archive-stats-row .stat .lbl{ font-size:12.5px; color:var(--text-muted); }

  .archive-layout{ max-width:1240px; margin:0 auto; padding:30px 20px; display:grid; grid-template-columns:270px 1fr; gap:26px; align-items:start; }
  .archive-sidebar{ display:flex; flex-direction:column; gap:16px; }
  .widget-block{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:18px; }
  .widget-title{ font-size:14px; margin-bottom:12px; }

  .trending-chip-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:32px; }
  .trending-chip{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px 8px; text-align:center; text-decoration:none; color:inherit; }
  .trending-chip .icon{ width:36px; height:36px; margin:0 auto 8px; border-radius:50%; background:var(--primary-tint); color:var(--primary); display:flex; align-items:center; justify-content:center; }
  .trending-chip .name{ font-size:11.5px; font-weight:600; }

  .archive-search{ display:flex; align-items:center; gap:8px; background:var(--section-alt); border-radius:24px; padding:10px 18px; margin-bottom:20px; max-width:420px; }
  .archive-search input{ border:none; background:transparent; outline:none; width:100%; font-size:13.5px; }
  .archive-search svg{ color:var(--text-muted); flex-shrink:0; }

  .all-items-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
  .item-tile{ text-align:center; text-decoration:none; color:inherit; }
  .item-tile .sq{ aspect-ratio:1/1; border-radius:var(--radius); background:var(--surface); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; margin-bottom:8px; overflow:hidden; }
  .item-tile .sq.round{ border-radius:50%; color:var(--primary); background:var(--primary-tint); }
  .item-tile .name{ font-size:12px; font-weight:600; }

  @media(max-width:900px){
    .archive-layout{ grid-template-columns:1fr; }
    .trending-chip-grid, .all-items-grid{ grid-template-columns:repeat(3,1fr); }
    .archive-stats-row{ gap:18px; }
  }

  /* ============ COUPON DETAIL PAGE ============ */
  .terms-box{ border-top:1px solid var(--border); padding-top:20px; margin-top:24px; }
  .terms-box h4{ font-size:14px; margin-bottom:10px; }

  /* ============ SUBMIT PAGE ============ */
  .submit-layout{ display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; }
  .submit-tabs{ display:flex; gap:10px; margin-bottom:20px; }
  .submit-tab{ flex:1; text-align:center; padding:12px; border-radius:10px; border:1.5px solid var(--border); font-weight:700; font-size:13.5px; cursor:pointer; color:var(--text-muted); background:var(--surface); }
  .submit-tab.active{ background:var(--primary); border-color:var(--primary); color:#fff; }
  .submit-form-panel{ display:none; }
  .submit-form-panel.active{ display:block; }

  @media(max-width:900px){
    .submit-layout{ grid-template-columns:1fr; }
  }

  /* ============ SHARED FORM / CARD COMPONENTS (submit page, account page) ============ */
  .card-block{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:24px; }
  .form-row{ margin-bottom:14px; }
  .form-row label{ display:block; font-size:12.5px; font-weight:600; margin-bottom:6px; color:var(--text-muted); }
  .form-row input{ width:100%; border:1px solid var(--border); border-radius:8px; padding:10px 12px; font-size:13.5px; font-family:inherit; }
  .google-btn:hover{ border-color:var(--primary); }