/* ============================================================
   BidZone — Karlssons-inspired Scandinavian auction theme
   Clean, minimal, editorial — light only
   ============================================================ */

:root {
  --primary:       var(--color-primary,      #1a1a1a);
  --primary-hover: var(--color-primary-hover,#333333);
  --accent:        var(--color-accent,       #2563eb);
  --bg-body:       var(--color-bg-body,      #f7f7f5);
  --bg-card:       var(--color-bg-card,      #ffffff);
  --bg-header:     var(--color-bg-header,    #ffffff);
  --text-main:     var(--color-text-main,    #1a1a1a);
  --text-muted:    var(--color-text-muted,   #888888);
  --border:        var(--color-border,       #e8e8e4);
  --success:       #16a34a;
  --danger:        #dc2626;
  --radius:        3px;
  --radius-lg:     6px;
  --transition:    all .15s ease;
  --header-h:      58px;
  --font-display:  'Work Sans', system-ui, sans-serif;
  --font-body:     'Work Sans', system-ui, sans-serif;
  /* Accent color separate from primary (used for links, bids) */
  --link:          var(--color-accent, #2563eb);
}

/* ── Reset ───────────────────────────────────────────────── */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  font-family: var(--font-body);
  background: var(--bg-body);
  color: var(--text-main);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; transition: var(--transition); }
img { max-width:100%; height:auto; display:block; }
input,textarea,select,button { font-family:inherit; }
ul { list-style:none; }
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-thumb { background:#d4d4cf; border-radius:2px; }
::selection { background:var(--accent); color:#fff; }

/* ── Utilities ───────────────────────────────────────────── */
.container    { width:100%; max-width:1200px; margin:0 auto; padding:0 24px; }
.container-sm { max-width:860px; margin:0 auto; padding:0 24px; }
.section      { padding:56px 0; }
.section-sm   { padding:36px 0; }
.text-muted   { color:var(--text-muted)!important; }
.text-center  { text-align:center; }
.hidden       { display:none!important; }
.divider      { height:1px; background:var(--border); margin:28px 0; }

.section-header { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:24px; gap:16px; flex-wrap:wrap; }
.section-title  { font-size:clamp(1.2rem,2.2vw,1.6rem); font-weight:800; font-family:var(--font-display); }
.label-tag      { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:4px; }

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 20px; border-radius:var(--radius);
  font-size:.85rem; font-weight:700; cursor:pointer;
  border:1.5px solid transparent; transition:var(--transition);
  white-space:nowrap; font-family:var(--font-display);
  letter-spacing:.01em;
}
.btn-primary { background:var(--text-main); color:#fff; border-color:var(--text-main); }
.btn-primary:hover { opacity:.85; }
.btn-outline { background:transparent; color:var(--text-main); border-color:var(--text-main); }
.btn-outline:hover { background:var(--text-main); color:#fff; }
.btn-ghost { background:transparent; color:var(--text-muted); border-color:var(--border); }
.btn-ghost:hover { color:var(--text-main); border-color:var(--text-main); }
.btn-sm  { padding:6px 14px; font-size:.78rem; }
.btn-lg  { padding:12px 28px; font-size:.95rem; }
.btn-xs  { padding:4px 10px; font-size:.72rem; }
.btn-block { width:100%; justify-content:center; }

/* ── Forms ───────────────────────────────────────────────── */
.form-label { display:block; font-size:.72rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:5px; }
.form-control { width:100%; background:#fff; border:1px solid var(--border); color:var(--text-main); padding:9px 12px; border-radius:var(--radius); font-size:.88rem; outline:none; transition:var(--transition); }
.form-control:focus { border-color:var(--accent); box-shadow:0 0 0 2px rgba(37,99,235,.1); }
.form-group { margin-bottom:16px; }
.form-grid  { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.input-icon { position:relative; }
.input-icon i { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:.82rem; pointer-events:none; }
.input-icon .form-control { padding-left:34px; }

/* Alerts */
.alert { padding:11px 14px; border-radius:var(--radius); font-size:.86rem; margin-bottom:16px; display:flex; align-items:flex-start; gap:8px; }
.alert-success { background:#f0fdf4; color:#166534; border:1px solid #bbf7d0; }
.alert-danger  { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.alert-warning { background:#fffbeb; color:#92400e; border:1px solid #fde68a; }
.alert-info    { background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }

/* ── Badges ──────────────────────────────────────────────── */
.badge         { display:inline-flex; align-items:center; gap:3px; padding:2px 8px; border-radius:2px; font-size:.65rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.badge-live    { background:#f0fdf4; color:#166534; }
.badge-upcoming{ background:#eff6ff; color:#1e40af; }
.badge-ended   { background:#f3f4f6; color:#6b7280; }
.badge-sold    { background:#fffbeb; color:#92400e; }
.live-dot { width:6px; height:6px; border-radius:50%; background:#16a34a; display:inline-block; animation:ldot 1.4s infinite; }
@keyframes ldot{0%,100%{opacity:1}50%{opacity:.3}}

/* ── HEADER ──────────────────────────────────────────────── */
.site-header {
  position: sticky; top:0; z-index:100;
  background: var(--bg-header);
  border-bottom: 1px solid var(--border);
  height: var(--header-h);
}
.header-inner {
  display: flex; align-items: center;
  height: var(--header-h); gap:0;
}

/* Logo */
.site-logo {
  display:flex; align-items:center; gap:8px;
  flex-shrink:0; margin-right:32px;
}
.site-logo img { height:32px; width:auto; }
.logo-text {
  font-size:1.25rem; font-weight:900; color:var(--text-main);
  font-family:var(--font-display); letter-spacing:-.02em;
  white-space:nowrap;
}
.logo-text span { color:var(--accent); }
.logo-icon { display:none; }

/* Desktop nav */
.header-nav {
  display:flex; align-items:center; gap:28px;
  flex:1;
}
.header-nav a {
  font-size:.84rem; font-weight:600; color:var(--text-muted);
  padding:4px 0; border-bottom:2px solid transparent;
  transition:color .15s, border-color .15s;
  white-space:nowrap;
}
.header-nav a:hover, .header-nav a.nav-active {
  color:var(--text-main); border-bottom-color:var(--text-main);
}
.header-nav .btn { border-bottom:none; }
.header-nav .btn:hover { border-bottom:none; }

/* Header search */
.header-search {
  position:relative; margin-left:auto; margin-right:20px;
  flex-shrink:0;
}
.header-search input {
  background:#f4f4f2; border:1px solid var(--border);
  border-radius:2px; padding:7px 12px 7px 34px;
  font-size:.82rem; width:200px; outline:none; color:var(--text-main);
  transition:width .2s, border-color .2s;
}
.header-search input:focus { width:260px; border-color:var(--text-main); background:#fff; }
.header-search i { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--text-muted); font-size:.78rem; }

/* Watch badge */
.watch-btn { position:relative; font-size:1rem; display:flex; align-items:center; }
.watch-badge { position:absolute; top:-7px; right:-9px; background:var(--accent); color:#fff; border-radius:50%; width:16px; height:16px; font-size:.6rem; display:flex; align-items:center; justify-content:center; font-weight:800; }

/* Notif badge */
.notif-badge { position:absolute; top:-7px; right:-9px; background:var(--danger); color:#fff; border-radius:50%; width:16px; height:16px; font-size:.6rem; display:flex; align-items:center; justify-content:center; font-weight:800; }

/* Theme + mobile */
.theme-toggle { background:none; border:none; cursor:pointer; color:var(--text-muted); font-size:.95rem; padding:4px; margin-left:8px; }
.theme-toggle:hover { color:var(--text-main); }
.mobile-toggle { display:none; background:none; border:none; cursor:pointer; color:var(--text-main); font-size:1.1rem; padding:4px; margin-left:8px; }

/* Mobile nav */
.mobile-nav { display:none; position:fixed; inset:0; top:var(--header-h); background:#fff; z-index:99; overflow-y:auto; transform:translateX(100%); transition:transform .25s ease; }
.mobile-nav.open { transform:translateX(0); }
.mobile-nav-inner { padding:20px; }
.mobile-nav-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid var(--border); }
.mobile-nav-inner a { display:flex; align-items:center; gap:10px; padding:13px 0; border-bottom:1px solid var(--border); font-size:.9rem; font-weight:600; color:var(--text-main); }
.mobile-nav-inner a:hover { color:var(--accent); }
.mobile-nav-inner a i { width:18px; text-align:center; color:var(--text-muted); font-size:.85rem; }
.lang-wrap { margin-top:16px; }

/* ── FLASH / TOAST ───────────────────────────────────────── */
.flash-wrap { position:fixed; top:calc(var(--header-h)+12px); left:50%; transform:translateX(-50%); z-index:999; transition:opacity .4s; }
.flash-msg  { display:flex; align-items:center; gap:10px; padding:12px 20px; border-radius:var(--radius); font-size:.86rem; font-weight:600; box-shadow:0 4px 20px rgba(0,0,0,.12); white-space:nowrap; }
.flash-msg.success { background:#fff; color:#166534; border:1px solid #bbf7d0; }
.flash-msg.danger  { background:#fff; color:#991b1b; border:1px solid #fecaca; }
.flash-msg.warning { background:#fff; color:#92400e; border:1px solid #fde68a; }
.toast-wrap { position:fixed; bottom:20px; right:20px; z-index:999; display:flex; flex-direction:column; gap:8px; }

/* ── FOOTER ──────────────────────────────────────────────── */
.site-footer { background:#1a1a1a; color:#d4d4ce; padding:48px 0 28px; margin-top:60px; }
.footer-grid { display:grid; grid-template-columns:1.8fr 1fr 1fr 1fr; gap:40px; margin-bottom:40px; }
.footer-brand p { font-size:.82rem; line-height:1.7; color:#888; margin-top:8px; max-width:260px; }
.footer-brand .logo-text { color:#fff; font-size:1.2rem; }
.footer-brand .logo-text span { color:var(--accent); }
.footer-col h4 { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:#888; margin-bottom:14px; }
.footer-col a  { display:block; font-size:.83rem; color:#aaa; margin-bottom:9px; }
.footer-col a:hover { color:#fff; }
.footer-social { display:flex; gap:10px; margin-top:16px; }
.footer-social a { width:32px; height:32px; border-radius:2px; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:#aaa; font-size:.82rem; }
.footer-social a:hover { background:rgba(255,255,255,.15); color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:20px; font-size:.76rem; color:#666; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.footer-contact-line { font-size:.82rem; color:#aaa; display:flex; align-items:center; gap:6px; margin-bottom:6px; }
.footer-contact-line a { color:#aaa; }
.footer-contact-line a:hover { color:#fff; }

/* ── AUCTION CARD GRID ───────────────────────────────────── */
/* Karlssons style: 4-col grid, image-first cards */
.k-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
}
@media(max-width:1024px){ .k-grid { grid-template-columns: repeat(3,1fr); } }
@media(max-width:700px)  { .k-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:400px)  { .k-grid { grid-template-columns: 1fr; } }

.k-card {
  background: #fff;
  display:flex; flex-direction:column;
  text-decoration:none; color:var(--text-main);
  transition: background .15s;
  position:relative;
}
.k-card:hover { background:#fafaf8; }
.k-card:hover .k-card-img img { transform:scale(1.02); }

.k-card-img {
  width:100%; aspect-ratio:1/1; overflow:hidden;
  background:#f4f4f2; flex-shrink:0;
}
.k-card-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .3s ease;
}
.k-card-body { padding:12px 14px 14px; flex:1; display:flex; flex-direction:column; gap:4px; }
.k-card-lot  { font-size:.68rem; color:var(--text-muted); font-weight:700; }
.k-card-title { font-size:.82rem; font-weight:700; line-height:1.35; color:var(--text-main); flex:1; }
.k-card-bid  { margin-top:6px; font-size:.78rem; color:var(--text-muted); }
.k-card-bid strong { color:var(--accent); font-weight:800; font-size:.88rem; }
.k-card-time { position:absolute; top:8px; left:8px; background:rgba(255,255,255,.92); backdrop-filter:blur(4px); border-radius:2px; padding:2px 7px; font-size:.68rem; font-weight:700; color:var(--text-main); letter-spacing:.02em; }

/* ── BROWSE LAYOUT ───────────────────────────────────────── */
.browse-layout { display:grid; grid-template-columns:220px 1fr; gap:32px; align-items:start; }
@media(max-width:768px){ .browse-layout { grid-template-columns:1fr; } }

/* Sidebar */
.browse-sidebar { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:20px; position:sticky; top:calc(var(--header-h)+12px); }
.browse-sidebar h3 { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:12px; padding-bottom:8px; border-bottom:1px solid var(--border); }
.sidebar-cat { display:block; font-size:.83rem; padding:7px 0; border-bottom:1px solid var(--border); color:var(--text-muted); font-weight:500; transition:color .15s; }
.sidebar-cat:last-child { border-bottom:none; }
.sidebar-cat:hover, .sidebar-cat.active { color:var(--text-main); font-weight:700; }

/* Browse filter bar */
.browse-filters { display:flex; align-items:center; gap:10px; margin-bottom:18px; flex-wrap:wrap; }
.browse-tab { padding:6px 14px; border-radius:2px; font-size:.8rem; font-weight:700; cursor:pointer; text-decoration:none; border:1px solid var(--border); color:var(--text-muted); background:#fff; transition:var(--transition); }
.browse-tab:hover  { border-color:var(--text-main); color:var(--text-main); }
.browse-tab.active { background:var(--text-main); color:#fff; border-color:var(--text-main); }
.browse-count { font-size:.78rem; color:var(--text-muted); margin-left:auto; }

/* Pagination */
.k-pagination { display:flex; gap:4px; justify-content:center; margin-top:28px; flex-wrap:wrap; }
.k-page { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:var(--radius); font-size:.82rem; font-weight:700; text-decoration:none; border:1px solid var(--border); color:var(--text-muted); background:#fff; transition:var(--transition); }
.k-page:hover    { border-color:var(--text-main); color:var(--text-main); }
.k-page.active   { background:var(--text-main); color:#fff; border-color:var(--text-main); }

/* ── INDEX PAGE ──────────────────────────────────────────── */
.k-hero { padding:40px 0 32px; border-bottom:1px solid var(--border); margin-bottom:0; }
.k-hero-inner { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.k-hero h1 { font-size:clamp(1.6rem,3.5vw,2.6rem); font-weight:900; line-height:1.15; font-family:var(--font-display); letter-spacing:-.02em; }
.k-hero-cta { font-size:.88rem; font-weight:700; color:var(--accent); text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.k-hero-cta:hover { color:var(--text-main); }

/* Services strip (index page bottom) */
.k-services { padding:40px 0; border-top:1px solid var(--border); }
.k-services h2 { font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:14px; }
.k-services ul li { font-size:.86rem; padding:5px 0; border-bottom:1px solid var(--border); color:var(--text-muted); }
.k-services ul li:last-child { border-bottom:none; }

/* ── DASHBOARD LAYOUT ────────────────────────────────────── */
.dashboard-layout { display:grid; grid-template-columns:210px 1fr; gap:28px; align-items:start; padding:32px 0 60px; }
@media(max-width:768px){ .dashboard-layout { grid-template-columns:1fr; } }
.dash-content { min-width:0; }

.dash-sidebar { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; position:sticky; top:calc(var(--header-h)+12px); }
.dash-avatar-wrap { padding:20px; border-bottom:1px solid var(--border); text-align:center; }
.dash-avatar { width:56px; height:56px; border-radius:50%; object-fit:cover; background:var(--accent); color:#fff; font-size:1.3rem; font-weight:800; align-items:center; justify-content:center; margin:0 auto 8px; }
.dash-name  { font-size:.88rem; font-weight:800; color:var(--text-main); }
.dash-email { font-size:.72rem; color:var(--text-muted); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dash-nav { } .dash-nav a {
  display:flex; align-items:center; gap:9px;
  padding:10px 16px; font-size:.83rem; font-weight:600;
  color:var(--text-muted); border-left:2px solid transparent;
  transition:var(--transition); border-bottom:1px solid var(--border);
}
.dash-nav a:last-child { border-bottom:none; }
.dash-nav a:hover, .dash-nav a.active { color:var(--text-main); background:#fafaf8; border-left-color:var(--text-main); }
.dash-nav a i { width:14px; text-align:center; font-size:.82rem; flex-shrink:0; }
.dash-stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }
@media(max-width:600px){ .dash-stat-grid { grid-template-columns:repeat(2,1fr); } }
.dash-stat { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:16px; display:flex; align-items:center; gap:12px; }
.sicon { width:38px; height:38px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; font-size:.95rem; flex-shrink:0; }
.si-blue  { background:#eff6ff; color:#2563eb; }
.si-green { background:#f0fdf4; color:#16a34a; }
.si-gold  { background:#fffbeb; color:#d97706; }
.si-red   { background:#fef2f2; color:#dc2626; }
.snum { font-size:1.2rem; font-weight:900; color:var(--text-main); font-family:var(--font-display); }
.slbl { font-size:.7rem; color:var(--text-muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }

/* ── CARD (generic) ──────────────────────────────────────── */
.card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.card-body { padding:20px; }

/* ── DATA TABLE ──────────────────────────────────────────── */
.data-table { width:100%; border-collapse:collapse; font-size:.84rem; }
.data-table th { padding:10px 14px; text-align:left; font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); font-weight:800; border-bottom:2px solid var(--border); background:#fafaf8; }
.data-table td { padding:11px 14px; border-bottom:1px solid var(--border); color:var(--text-main); vertical-align:middle; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:hover td { background:#fafaf8; }

/* ── LIGHTBOX ────────────────────────────────────────────── */
.lightbox { display:none; position:fixed; inset:0; background:rgba(0,0,0,.92); z-index:9999; align-items:center; justify-content:center; }
.lightbox.open { display:flex; }
.lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:var(--radius); }
.lightbox-close { position:absolute; top:16px; right:16px; background:#fff; border:none; border-radius:50%; width:36px; height:36px; cursor:pointer; font-size:1rem; display:flex; align-items:center; justify-content:center; }

/* ── BREADCRUMB ──────────────────────────────────────────── */
.breadcrumb { display:flex; align-items:center; gap:6px; font-size:.76rem; color:var(--text-muted); flex-wrap:wrap; margin-bottom:16px; }
.breadcrumb a { color:var(--text-muted); }
.breadcrumb a:hover { color:var(--text-main); }
.breadcrumb .sep { opacity:.4; }

/* ── STATS BAR (footer top) ──────────────────────────────── */
.stats-bar { background:var(--text-main); color:#fff; padding:20px 0; }
.stats-bar-inner { display:flex; justify-content:space-around; align-items:center; flex-wrap:wrap; gap:16px; }
.stat-item { text-align:center; }
.stat-num { font-size:1.5rem; font-weight:900; font-family:var(--font-display); }
.stat-lbl { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; opacity:.6; margin-top:2px; }

/* ── PAGE CONTENT (CMS pages) ────────────────────────────── */
.page-content { font-size:.9rem; line-height:1.8; color:var(--text-muted); }
.page-content h2 { font-size:1.2rem; font-weight:800; color:var(--text-main); margin:24px 0 10px; }
.page-content h3 { font-size:1rem; font-weight:700; color:var(--text-main); margin:18px 0 8px; }
.page-content p  { margin-bottom:14px; }
.page-content ul { margin:0 0 14px 18px; list-style:disc; }
.page-content li { margin-bottom:5px; }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media(max-width:768px){
  .header-search { display:none; }
  .header-nav    { display:none; }
  .mobile-toggle { display:block; }
  .mobile-nav    { display:block; }
  .footer-grid   { grid-template-columns:1fr 1fr; gap:28px; }
  .form-grid     { grid-template-columns:1fr; }
  .browse-filters{ gap:6px; }
}
@media(max-width:480px){
  .footer-grid { grid-template-columns:1fr; }
  .dash-stat-grid { grid-template-columns:1fr 1fr; }
}

/* ── PAGE HERO (used by categories, gallery, videos, page.php etc) ── */
.page-hero { background:#fff; border-bottom:1px solid var(--border); padding:24px 0 20px; }
.page-hero h1 { font-size:clamp(1.3rem,2.5vw,1.8rem); font-weight:900; font-family:var(--font-display); line-height:1.2; }
.page-hero h1 span { color:var(--accent); }

/* ── AUCTION GRID (used in dashboard won tab, watchlist, auction related) ── */
.auction-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1px; background:var(--border); }
.auction-card { background:#fff; display:flex; flex-direction:column; transition:background .15s; }
.auction-card:hover { background:#fafaf8; }
.card-img-wrap { position:relative; aspect-ratio:4/3; overflow:hidden; background:#f4f4f2; }
.card-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.auction-card:hover .card-img-wrap img { transform:scale(1.03); }
.card-status { position:absolute; top:8px; left:8px; }
.card-watch { position:absolute; top:8px; right:8px; background:rgba(255,255,255,.85); border:none; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:.85rem; color:var(--text-muted); transition:var(--transition); }
.card-watch:hover, .card-watch.watching { color:var(--danger); }
.card-body { padding:12px 14px; flex:1; display:flex; flex-direction:column; gap:3px; }
.card-category { font-size:.68rem; color:var(--text-muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.card-title { font-size:.84rem; font-weight:700; color:var(--text-main); line-height:1.35; flex:1; }
.card-meta { display:flex; align-items:center; justify-content:space-between; margin-top:8px; gap:8px; flex-wrap:wrap; }
.meta-price .lbl { font-size:.65rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em; }
.meta-price .val { font-size:.95rem; font-weight:800; color:var(--accent); font-family:var(--font-display); }
.meta-timer { text-align:right; font-size:.75rem; color:var(--text-muted); font-weight:600; }
.meta-timer .tlbl { font-size:.65rem; text-transform:uppercase; letter-spacing:.04em; }

/* ── SECTION HEADER / LABEL TAG / SECTION TITLE ── */
.section-header { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:22px; gap:12px; flex-wrap:wrap; }
.section-title  { font-size:clamp(1.2rem,2.2vw,1.6rem); font-weight:900; font-family:var(--font-display); }
.section-title span { color:var(--accent); }
.label-tag { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:4px; display:block; }

/* ── PAGE CONTENT ── */
.page-content { font-size:.9rem; line-height:1.8; color:var(--text-muted); max-width:760px; }
.page-content h2 { font-size:1.15rem; font-weight:800; color:var(--text-main); margin:22px 0 8px; }
.page-content h3 { font-size:.98rem; font-weight:700; color:var(--text-main); margin:16px 0 6px; }
.page-content p  { margin-bottom:12px; }
.page-content ul { margin:0 0 12px 18px; list-style:disc; }
.page-content li { margin-bottom:4px; }
.page-content strong { color:var(--text-main); }

/* ── BID HISTORY (used in auction.php) ── */
.bid-history-header { display:flex; align-items:center; gap:8px; padding:12px 16px; border-top:1px solid var(--border); }
.bid-history-title  { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); }
.bid-history-count  { font-size:.72rem; color:var(--text-muted); }
.bid-history-list   { padding:0 0 8px; }
.bid-row   { display:flex; align-items:center; gap:8px; padding:8px 16px; border-bottom:1px solid var(--border); font-size:.83rem; }
.bid-empty { padding:20px 16px; text-align:center; color:var(--text-muted); font-size:.83rem; }
.bid-rank  { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.62rem; font-weight:800; flex-shrink:0; }
.bid-rank-blue  { background:#2563eb; color:#fff; }
.bid-rank-red   { background:#dc2626; color:#fff; }
.bid-rank-green { background:#16a34a; color:#fff; }
.bid-rank-gray  { background:var(--bg-body); color:var(--text-muted); border:1px solid var(--border); }
.bid-date-col   { font-size:.75rem; color:var(--text-muted); width:46px; flex-shrink:0; }
.bid-time-col   { font-size:.75rem; color:var(--text-muted); width:54px; flex-shrink:0; }
.bid-amount-col { margin-left:auto; font-weight:700; color:var(--text-main); }
.bid-amount-top { color:var(--accent); font-weight:800; }

/* ── DASHBOARD STAT GRID ── */
.dash-stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:20px; }
@media(max-width:600px){ .dash-stat-grid { grid-template-columns:repeat(2,1fr); } }
.dash-stat { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:14px; display:flex; align-items:center; gap:10px; }
.sicon { width:36px; height:36px; border-radius:var(--radius); display:flex; align-items:center; justify-content:center; font-size:.9rem; flex-shrink:0; }
.si-blue  { background:#eff6ff; color:#2563eb; }
.si-green { background:#f0fdf4; color:#16a34a; }
.si-gold  { background:#fffbeb; color:#d97706; }
.si-red   { background:#fef2f2; color:#dc2626; }
.snum { font-size:1.15rem; font-weight:900; color:var(--text-main); font-family:var(--font-display); }
.slbl { font-size:.68rem; color:var(--text-muted); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }

/* ── DATA TABLE ── */
.data-table { width:100%; border-collapse:collapse; font-size:.84rem; }
.data-table th { padding:10px 12px; text-align:left; font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); font-weight:800; border-bottom:2px solid var(--border); background:#fafaf8; }
.data-table td { padding:10px 12px; border-bottom:1px solid var(--border); vertical-align:middle; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:hover td { background:#fafaf8; }

/* ── STATS BAR (footer top, now removed but keep for compat) ── */
.stats-bar { background:var(--text-main); color:#fff; padding:20px 0; }
.stats-bar-inner { display:flex; justify-content:space-around; align-items:center; flex-wrap:wrap; gap:12px; }
.stat-item { text-align:center; }
.stat-num  { font-size:1.5rem; font-weight:900; font-family:var(--font-display); }
.stat-lbl  { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; opacity:.6; margin-top:2px; }

.meta-price { display:flex; flex-direction:column; }

/* ── BROWSE PAGE (lots-* classes from browse.php) ── */
.lots-wrap { max-width:1200px; margin:0 auto; padding:0 0 60px; }
.lots-tabs { display:flex; align-items:baseline; border-bottom:1px solid var(--border); padding:0 24px; }
.lots-tab  { display:inline-flex; align-items:baseline; gap:5px; padding:14px 20px 12px 0; font-size:.88rem; font-weight:700; color:var(--text-muted); text-decoration:none; border-bottom:2px solid transparent; margin-bottom:-1px; transition:color .15s; }
.lots-tab:hover  { color:var(--text-main); }
.lots-tab.active { color:var(--text-main); border-bottom-color:var(--text-main); }
.lots-tab-count  { font-size:.75rem; font-weight:600; color:var(--text-muted); }
.lots-layout  { display:grid; grid-template-columns:200px 1fr; gap:0; align-items:start; padding:0 24px; }
.lots-sidebar { padding:24px 24px 24px 0; position:sticky; top:calc(var(--header-h)); }
.lots-sidebar-label { font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; color:var(--text-muted); margin-bottom:12px; display:block; }
.lots-cat   { display:block; font-size:.83rem; color:var(--text-muted); padding:5px 0; border-bottom:1px solid var(--border); text-decoration:none; font-weight:500; transition:color .15s; }
.lots-cat:last-child { border-bottom:none; }
.lots-cat:hover, .lots-cat.active { color:var(--text-main); font-weight:700; }
.lots-cat-count { float:right; font-size:.72rem; color:var(--text-muted); font-weight:400; }
.lots-main  { border-left:1px solid var(--border); }
.lots-grid  { display:grid; grid-template-columns:repeat(4,1fr); background:var(--border); gap:1px; }
.lots-pagination { display:flex; align-items:center; gap:2px; padding:10px 16px; border-bottom:1px solid var(--border); font-size:.8rem; flex-wrap:wrap; }
.lots-pagination .pag-count { color:var(--text-muted); margin-right:12px; font-size:.78rem; }
.lots-pagination a, .lots-pagination span { display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:26px; padding:0 6px; font-size:.8rem; font-weight:700; border-radius:2px; color:var(--text-muted); text-decoration:none; transition:var(--transition); }
.lots-pagination a:hover { color:var(--text-main); background:#f4f4f2; }
.lots-pagination span.cur { background:var(--text-main); color:#fff; }
.lots-empty { padding:60px 24px; text-align:center; color:var(--text-muted); }
.lots-sort-label { font-size:.73rem; color:var(--text-muted); display:block; margin:18px 0 4px; font-style:italic; }
.lots-per-page { font-size:.73rem; color:var(--text-muted); }

/* LOT CARD */
.lot-card   { background:#fff; display:flex; flex-direction:column; text-decoration:none; color:var(--text-main); transition:background .12s; }
.lot-card:hover { background:#fafaf8; }
.lot-card:hover .lot-img img { transform:scale(1.03); }
.lot-time   { font-size:.72rem; font-weight:600; color:var(--text-muted); padding:10px 12px 4px; display:block; }
.lot-img    { width:100%; aspect-ratio:1/1; overflow:hidden; background:#f4f4f2; }
.lot-img img { width:100%; height:100%; object-fit:cover; transition:transform .28s ease; }
.lot-body   { padding:8px 12px 14px; }
.lot-number { font-size:.68rem; color:#aaa; font-weight:600; display:block; margin-bottom:3px; }
.lot-title  { font-size:.82rem; font-weight:700; color:#1a1a1a; line-height:1.35; display:block; margin-bottom:8px; }
.lot-bid-lbl{ font-size:.68rem; color:#aaa; display:block; font-weight:600; }
.lot-bid-val{ font-size:.9rem; font-weight:800; color:#1a1a1a; display:block; margin-top:1px; }

/* AUCTION PAGE (ap-* classes) */
.ap-grid      { display:grid; grid-template-columns:1fr 400px; gap:48px; align-items:start; }
.ap-main-img  { width:100%; aspect-ratio:4/3; object-fit:contain; background:#f8f8f6; border:1px solid var(--border); border-radius:4px; display:block; cursor:zoom-in; }
.ap-thumbs    { display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }
.ap-thumb     { width:80px; height:80px; object-fit:cover; border:2px solid transparent; border-radius:3px; cursor:pointer; transition:.15s; background:#f4f4f2; }
.ap-thumb:hover, .ap-thumb.active { border-color:var(--accent); }
.ap-bid-panel { border:1px solid var(--border); border-radius:8px; overflow:hidden; position:sticky; top:82px; background:var(--bg-card); }
.ap-bid-top   { padding:20px 22px; border-bottom:1px solid var(--border); }
.ap-bid-body  { padding:20px 22px; }
.ap-status-badge { display:inline-flex; align-items:center; gap:5px; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; margin-bottom:12px; }
.ap-status-live    { color:#16a34a; }
.ap-status-upcoming{ color:#2563eb; }
.ap-status-ended   { color:var(--text-muted); }
.ap-bid-label { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); margin-bottom:5px; }
.ap-current-price { font-size:2.1rem; font-weight:900; font-family:var(--font-display); color:var(--accent); line-height:1; }
.ap-bid-count { font-size:.78rem; color:var(--text-muted); margin-top:4px; }
.ap-end-date  { font-size:.8rem; color:var(--text-muted); margin-top:10px; display:flex; align-items:center; gap:5px; }
.ap-bid-input { width:100%; border:1.5px solid var(--border); border-radius:6px; padding:11px 14px; font-size:1.05rem; font-weight:700; text-align:center; color:var(--text-main); background:var(--bg-body); font-family:var(--font-display); outline:none; transition:border-color .2s; }
.ap-bid-input:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(37,99,235,.1); }
.ap-btn-bid   { width:100%; padding:13px; border:none; border-radius:6px; background:var(--accent); color:#fff; font-weight:800; font-size:.95rem; cursor:pointer; font-family:var(--font-display); display:flex; align-items:center; justify-content:center; gap:8px; transition:opacity .2s; margin-bottom:8px; }
.ap-btn-bid:hover { opacity:.88; }
.ap-btn-watch { flex:1; padding:10px; border-radius:6px; background:var(--bg-body); color:var(--text-main); border:1px solid var(--border); font-weight:700; font-size:.85rem; cursor:pointer; font-family:var(--font-display); display:flex; align-items:center; justify-content:center; gap:7px; text-decoration:none; transition:border-color .2s; }
.ap-btn-watch:hover  { border-color:var(--text-main); }
.ap-btn-watch.watching { color:var(--accent); border-color:rgba(37,99,235,.3); }
.ap-btn-share { width:44px; height:44px; border-radius:6px; background:var(--bg-body); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--text-muted); cursor:pointer; transition:border-color .2s; }
.ap-btn-share:hover { border-color:var(--text-main); }
.ap-bh-title  { font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--text-muted); margin:16px 0 10px; border-top:1px solid var(--border); padding-top:14px; }
.ap-bh-row    { display:flex; align-items:center; gap:8px; padding:7px 0; border-bottom:1px solid var(--border); font-size:.83rem; }
.ap-bh-row:last-child { border-bottom:none; }
.ap-bh-rank   { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.62rem; font-weight:800; flex-shrink:0; }
.ap-bh-r1     { background:#2563eb; color:#fff; }
.ap-bh-r2     { background:#dc2626; color:#fff; }
.ap-bh-r3     { background:#16a34a; color:#fff; }
.ap-bh-rn     { background:var(--bg-body); color:var(--text-muted); border:1px solid var(--border); }
.ap-bh-name   { flex:1; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-muted); }
.ap-bh-amount { font-weight:800; color:var(--accent); }
.ap-bh-time   { font-size:.72rem; color:var(--text-muted); white-space:nowrap; }
.ap-details-list { list-style:none; padding:0; margin:0 0 22px; border-top:1px solid var(--border); }
.ap-details-list li { display:flex; padding:9px 0; border-bottom:1px solid var(--border); font-size:.87rem; }
.ap-details-list li .dk { color:var(--text-muted); min-width:120px; font-weight:600; }
.ap-details-list li .dv { font-weight:700; }
.ap-fees-table { width:100%; border-collapse:collapse; font-size:.87rem; margin-bottom:22px; }
.ap-fees-table td { padding:9px 0; border-bottom:1px solid var(--border); }
.ap-fees-table td:first-child { color:var(--text-muted); }
.ap-fees-table td:last-child  { font-weight:700; text-align:right; }
.ap-fees-table tr:first-child td { border-top:1px solid var(--border); }
.ap-shipping  { font-size:.84rem; line-height:1.7; color:var(--text-muted); margin-bottom:22px; }
.ap-shipping strong { display:block; font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--text-main); margin-bottom:6px; }
.ap-section-title { font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--text-main); margin-bottom:8px; border-bottom:1px solid var(--border); padding-bottom:6px; }
.ap-desc { font-size:.87rem; line-height:1.75; color:var(--text-muted); margin-bottom:22px; }
.ap-alert { padding:11px 14px; border-radius:6px; margin-bottom:16px; font-size:.87rem; display:flex; align-items:center; gap:8px; }
.ap-alert-err { background:rgba(220,38,38,.07); border:1px solid rgba(220,38,38,.2); color:#dc2626; }
.ap-alert-ok  { background:rgba(22,163,74,.07); border:1px solid rgba(22,163,74,.2); color:#16a34a; }

/* Footer col */
.footer-col { }

/* Responsive */
@media(max-width:700px){
  .lots-layout { grid-template-columns:1fr; padding:0 16px; }
  .lots-grid   { grid-template-columns:repeat(2,1fr); }
  .ap-grid     { grid-template-columns:1fr; gap:24px; }
}
@media(max-width:400px){
  .lots-grid { grid-template-columns:1fr; }
}