:root{
  --color-primary:#534133; /* Primary brown from hero */
  --color-secondary:#95684C; /* Secondary brown from hero */
  --color-bg:#825d26; /* Warm brown-gray */
  --color-accent:#BF9663; /* Accent gold from hero */

  --radius:12px;
  --shadow:0 8px 24px rgba(0,0,0,0.08);
  --shadow-hover:0 12px 30px rgba(0,0,0,0.12);
  --max-readable:780px;
}

/* Dark mode overrides */
.dark {
  --color-bg: #000000; /* Pure black for dark mode */
  --color-primary: #534133; /* Keep original brown for buttons in dark mode */
  --color-secondary: #e5e5e5; /* Light gray text for dark mode */
}

body{ background:var(--color-bg); color:var(--color-secondary); }

.ui-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 18px; border-radius:10px; font-weight:700; cursor:pointer; transition:.2s ease; border:2px solid transparent; box-shadow:var(--shadow); }
.ui-btn:hover{ transform:translateY(-1px) scale(1.01); box-shadow:var(--shadow-hover); }
.ui-btn-cta{ background:var(--color-accent); color:#fff; }
.ui-btn-primary{ background:var(--color-primary); color:#fff; }
.ui-btn-outline{ background:#FEFCF9; border-color:var(--color-primary); color:var(--color-primary); }

.ui-card{ background:#FEFCF9; border:1px solid rgba(83,65,51,.10); border-radius:var(--radius); box-shadow:var(--shadow); }
.dark .ui-card{ background:#111111; border-color:rgba(255,255,255,.1); }
.ui-card-hover:hover{ transform:translateY(-2px); box-shadow:var(--shadow-hover); }

.ui-article{ width:100%; max-width:var(--max-readable); margin:0 auto; }

/* Product / Auction layout */
.product-grid{ display:grid; grid-template-columns: 60% 40%; gap:24px; align-items:start; }
.sticky-right{ position:sticky; top:16px; }
@media (max-width: 900px){ .product-grid{ grid-template-columns: 1fr; } .sticky-right{ position:static; } }

/* Auction urgent block */
.auction-urgent{ display:flex; align-items:center; justify-content:space-between; gap:16px; background:var(--color-accent); color:#fff; border-radius:12px; padding:14px 16px; box-shadow:var(--shadow); }
.auction-urgent .label{ font-size:12px; text-transform:uppercase; opacity:.9; letter-spacing:.5px; }
.auction-urgent .price{ font-size:28px; font-weight:800; line-height:1; }
.auction-urgent .time{ font-size:22px; font-weight:800; letter-spacing:.5px; }
.auction-urgent .divider{ width:1px; height:36px; background:rgba(255,255,255,.45); }
@media (max-width: 900px){ .auction-urgent{ flex-direction:column; align-items:flex-start; } .auction-urgent .divider{ display:none; } }