/*
  auction2026.css
  StampAuctionNetwork modern layer
  Layered on top of auctiontld.css -- does not replace it.
  Design vocabulary: philatelic catalog, engraving, perforations, postal blue.
*/

/* ============================================================
   TOKENS
   ============================================================ */
:root {
  /* Brand palette */
  --san-navy:       #1a2e4a;   /* deep postal blue -- primary chrome  */
  --san-blue:       #2563a8;   /* mid blue -- links, active states    */
  --san-gold:       #b8860b;   /* dark goldenrod -- accent, badges    */
  --san-gold-lt:    #f5e8c0;   /* pale gold -- hover fills            */
  --san-red:        #8b1a1a;   /* maroon -- sale alerts, prices       */
  --san-bg:         #f2f0eb;   /* warm off-white -- page ground       */
  --san-surface:    #ffffff;
  --san-border:     #cbc8c0;
  --san-muted:      #6b6560;
  --san-text:       #1c1a18;

  /* Typography */
  --font-display:   'Georgia', 'Times New Roman', serif;
  --font-body:      'Helvetica Neue', Arial, sans-serif;
  --font-mono:      'Courier New', monospace;

  /* Spacing scale */
  --sp-xs:  4px;
  --sp-sm:  8px;
  --sp-md:  16px;
  --sp-lg:  24px;
  --sp-xl:  40px;

  /* Nav heights */
  --topbar-h:  56px;
  --nav-h:     44px;
}

/* ============================================================
   RESET LAYER (scoped -- does not nuke auctiontld.css globally)
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

/* ============================================================
   PAGE GROUND
   ============================================================ */
body {
  background: var(--san-bg);
  color: var(--san-text);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  margin: 0;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

/* ============================================================
   TOPBAR  (logo + login + search)
   The signature perforation strip runs along the bottom edge.
   ============================================================ */
#san-topbar {
  background: var(--san-navy);
  color: #fff;
  width: 100%;
  position: relative;
  padding-bottom: 6px;
}

#san-topbar::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -8px;
  left: 0;
  right: 0;
  height: 16px;
  background:
    radial-gradient(circle at 8px 8px, var(--san-bg) 7px, transparent 7px);
  background-size: 18px 16px;
  background-repeat: repeat-x;
  z-index: 10;
}

.san-topbar-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: var(--sp-md);
  padding: var(--sp-sm) var(--sp-md);
  min-height: var(--topbar-h);
  flex-wrap: wrap;
}

/* Logo slot */
.san-logo-slot {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  flex-shrink: 0;
}

.san-logo-slot a { display: flex; align-items: center; }

.san-logo-slot img {
  height: auto;
  width: auto;
  max-height: none;
  display: block;
}

/* Secondary logos (CAN, StampEx etc.) */
.san-logo-secondary img {
  height: 36px;
  width: auto;
  display: block;
  opacity: 0.9;
}

/* Login / status block */
.san-topbar-status {
  flex: 1 1 220px;
  font-size: 13px;
  color: #d0dce8;
  line-height: 1.4;
}

.san-topbar-status a { color: #7fb3e0; text-decoration: none; }
.san-topbar-status a:hover { color: #fff; text-decoration: underline; }

.san-topbar-status .san-status-msg {
  color: #ffd580;
  font-weight: 600;
}

/* Login form inline */
.san-login-form {
  display: flex;
  align-items: center;
  gap: var(--sp-xs);
  flex-wrap: wrap;
}

.san-login-form label {
  color: #adc8e0;
  font-size: 12px;
  white-space: nowrap;
}

.san-login-form input[type="text"],
.san-login-form input[type="password"] {
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  padding: 4px 7px;
  font-size: 13px;
  border-radius: 3px;
  width: 110px;
}

.san-login-form input[type="text"]::placeholder,
.san-login-form input[type="password"]::placeholder { color: #8aaccc; }

/* Membership info strip */
.san-membership-info {
  flex: 0 1 280px;
  font-size: 12px;
  color: #b0c8dc;
  line-height: 1.4;
}

/* Search in topbar */
.san-topbar-search {
  display: flex;
  align-items: center;
  gap: var(--sp-xs);
  flex-shrink: 0;
}

.san-topbar-search label {
  color: #adc8e0;
  font-size: 12px;
  white-space: nowrap;
}

.san-topbar-search input[type="text"] {
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  padding: 5px 8px;
  font-size: 13px;
  border-radius: 3px;
  width: 140px;
}

/* Translate widget slot */
.san-translate-slot {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

/* Clock */
.san-clock {
  font-size: 12px;
  color: #7fb3e0;
  font-family: var(--font-mono);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ============================================================
   MAIN NAV BAR
   ============================================================ */
#san-navbar {
  background: var(--san-blue);
  width: 100%;
  position: relative;
  margin-top: 6px;
  z-index: 100;
}

.san-navbar-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  min-height: var(--nav-h);
}

/* Hamburger toggle (hidden on desktop) */
.san-nav-toggle {
  display: none;
  background: none;
  border: none;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  padding: 10px var(--sp-md);
  line-height: 1;
}

/* Nav list */
.san-nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: stretch;
  width: 100%;
  flex-wrap: nowrap;
}

.san-nav-list > li {
  position: relative;
  display: flex;
  align-items: stretch;
}

.san-nav-list > li > a {
  display: flex;
  align-items: center;
  padding: 0 14px;
  color: #e8f0f8;
  text-decoration: none;
  font-size: 13.5px;
  font-family: var(--font-body);
  font-weight: 500;
  white-space: nowrap;
  border-right: 1px solid rgba(255,255,255,0.1);
  transition: background 0.15s, color 0.15s;
  min-height: var(--nav-h);
}

.san-nav-list > li > a:hover,
.san-nav-list > li:hover > a {
  background: var(--san-navy);
  color: #fff;
}

/* Active/current item */
.san-nav-list > li.san-nav-active > a {
  background: var(--san-navy);
  color: var(--san-gold);
  font-weight: 600;
}

/* Dropdown panels */
.san-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 280px;
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-top: 3px solid var(--san-gold);
  box-shadow: 0 6px 20px rgba(0,0,0,0.18);
  z-index: 200;
  padding: var(--sp-md);
}

/* Wide dropdowns */
.san-dropdown-wide {
  min-width: 600px;
  max-width: 800px;
}

.san-nav-list > li:hover > .san-dropdown {
  display: block;
}

/* Dropdown sections */
.san-dropdown-section {
  margin-bottom: var(--sp-md);
}

.san-dropdown-section:last-child { margin-bottom: 0; }

.san-dropdown-section-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--san-muted);
  padding-bottom: var(--sp-xs);
  border-bottom: 1px solid var(--san-border);
  margin-bottom: var(--sp-sm);
}

.san-dropdown ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.san-dropdown ul li {
  padding: 0;
  margin: 0;
}

.san-dropdown ul li a {
  display: block;
  padding: 5px var(--sp-sm);
  color: var(--san-blue);
  text-decoration: none;
  font-size: 13.5px;
  border-radius: 2px;
  transition: background 0.1s, color 0.1s;
}

/* Override: links that sit side-by-side within one li (e.g. "Bid by Lot# | Bid by Category...")
   must stay inline, not block, or each one forces a new line */
.san-dropdown ul li a.san-inline-link {
  display: inline;
  padding: 0;
}

.san-dropdown ul li a:hover {
  background: var(--san-gold-lt);
  color: var(--san-navy);
}

/* Two-column dropdown layout */
.san-dropdown-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 var(--sp-lg);
}

/* Three-column */
.san-dropdown-cols3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0 var(--sp-md);
}

/* Highlight link (StampAuction Insider) */
.san-dropdown ul li a.san-highlight {
  color: var(--san-gold);
  font-weight: 600;
}

.san-dropdown ul li a.san-highlight:hover {
  background: var(--san-gold);
  color: var(--san-surface);
}

/* ============================================================
   CATALOG HEADER STRIP  (sanheaderstrip.cfm)
   Compact nav for ik56.cfm / ik561.cfm etc.
   ============================================================ */
#san-catalog-strip {
  background: var(--san-navy);
  border-bottom: 3px solid var(--san-gold);
  width: 100%;
}

.san-catalog-strip-inner {
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: var(--sp-md);
  padding: 8px var(--sp-md);
  flex-wrap: wrap;
}

.san-catalog-strip-logo img {
  height: 32px;
  width: auto;
}

.san-catalog-strip-back a {
  color: var(--san-gold-lt);
  text-decoration: none;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.san-catalog-strip-back a:hover { color: #fff; }
.san-catalog-strip-back a::before { content: '\2190'; }

.san-catalog-strip-status {
  flex: 1;
  color: #b0c8dc;
  font-size: 12px;
}

.san-catalog-strip-search {
  display: flex;
  align-items: center;
  gap: var(--sp-xs);
}

.san-catalog-strip-search input[type="text"] {
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  padding: 4px 7px;
  font-size: 13px;
  border-radius: 3px;
  width: 130px;
}

/* Full dropdown nav inside catalog strip */
#san-catalog-nav {
  background: var(--san-blue);
  width: 100%;
}

.san-catalog-nav-inner {
  max-width: 1400px;
  margin: 0 auto;
}

/* ============================================================
   PAGE LAYOUT
   ============================================================ */
.san-page-wrap {
  max-width: 1400px;
  margin: 0 auto;
  padding: 18px var(--sp-md) var(--sp-xl);
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: var(--sp-lg);
}

.san-main-col { min-width: 0; }
.san-side-col { min-width: 0; }

/* ============================================================
   SECTION PANELS (replace bordered-list tables)
   ============================================================ */
.san-panel {
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-radius: 4px;
  margin-bottom: var(--sp-lg);
  overflow: hidden;
}

.san-panel-head {
  background: var(--san-navy);
  color: #fff;
  padding: 9px var(--sp-md);
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: normal;
  letter-spacing: 0.03em;
  border-bottom: 2px solid var(--san-gold);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.san-panel-head a {
  color: var(--san-gold-lt);
  font-size: 12px;
  text-decoration: none;
}

.san-panel-head a:hover { text-decoration: underline; }

.san-panel-body {
  padding: var(--sp-sm) var(--sp-md);
}

/* Auction list items inside panels */
.san-auction-list {
  list-style: none;
  margin: 0;
  padding: var(--sp-xs) 0;
}

.san-auction-list li {
  padding: 7px 0;
  border-bottom: 1px solid #edeae4;
  display: flex;
  gap: var(--sp-sm);
  align-items: flex-start;
  line-height: 1.4;
  font-size: 13.5px;
}

.san-auction-list li:last-child { border-bottom: none; }

.san-auction-list li a {
  color: var(--san-blue);
  text-decoration: none;
  flex: 1;
}

.san-auction-list li a:hover { text-decoration: underline; color: var(--san-navy); }

.san-auction-list li strong { color: var(--san-text); }

/* Badge icons (PTS, ASDA etc.) */
.san-auction-list li img {
  flex-shrink: 0;
  vertical-align: middle;
}

/* Two-column inner layout for Newly Listed / Stamp of Day row */
.san-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-md);
  margin-bottom: var(--sp-lg);
}

/* Featured auction item with image */
.san-feature-item {
  display: flex;
  gap: var(--sp-md);
  padding: var(--sp-sm) 0;
  border-bottom: 1px solid #edeae4;
}

.san-feature-item:last-child { border-bottom: none; }

.san-feature-item img {
  width: 120px;
  height: auto;
  flex-shrink: 0;
  object-fit: contain;
  border: 1px solid var(--san-border);
}

.san-feature-item-text { flex: 1; font-size: 13.5px; line-height: 1.45; }
.san-feature-item-text a { color: var(--san-blue); text-decoration: none; }
.san-feature-item-text a:hover { text-decoration: underline; }
.san-feature-item-text strong { color: var(--san-red); }

/* Show/Hide toggle buttons */
.san-toggle-bar {
  text-align: center;
  padding: var(--sp-sm);
  border-top: 1px solid var(--san-border);
}

.san-toggle-bar a {
  color: var(--san-muted);
  font-size: 12px;
  text-decoration: none;
  border: 1px solid var(--san-border);
  padding: 3px 10px;
  border-radius: 3px;
  display: inline-block;
  transition: background 0.1s;
}

.san-toggle-bar a:hover { background: var(--san-gold-lt); color: var(--san-navy); }

/* ============================================================
   SIDEBAR PANELS
   ============================================================ */
.san-side-panel {
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-radius: 4px;
  margin-bottom: var(--sp-md);
  overflow: hidden;
}

.san-side-panel-head {
  background: var(--san-navy);
  color: #fff;
  padding: 8px var(--sp-md);
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: normal;
  border-bottom: 2px solid var(--san-gold);
}

.san-side-panel-body {
  padding: var(--sp-sm) var(--sp-md);
}

/* Insider promo panel */
.san-insider-promo {
  background: linear-gradient(135deg, var(--san-navy) 0%, #2a4a7a 100%);
  border: 2px solid var(--san-gold);
  border-radius: 4px;
  padding: var(--sp-md);
  margin-bottom: var(--sp-md);
  color: #e8f0f8;
}

.san-insider-promo-title {
  font-family: var(--font-display);
  font-size: 16px;
  color: var(--san-gold);
  margin: 0 0 var(--sp-sm);
  letter-spacing: 0.02em;
}

.san-insider-promo p {
  font-size: 13px;
  margin: 0 0 var(--sp-sm);
  line-height: 1.5;
  color: #b8cce0;
}

.san-insider-promo a {
  display: inline-block;
  background: var(--san-gold);
  color: var(--san-navy);
  text-decoration: none;
  font-weight: 700;
  font-size: 13px;
  padding: 6px 14px;
  border-radius: 3px;
  transition: background 0.15s;
}

.san-insider-promo a:hover { background: #d4a017; }

/* ============================================================
   CATALOG PAGES  (TOC + lot display)
   ============================================================ */
.san-catalog-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--sp-md) var(--sp-md) var(--sp-xl);
}

/* Catalog TOC */
.san-toc-intro {
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-top: 4px solid var(--san-navy);
  border-radius: 0 0 4px 4px;
  padding: var(--sp-lg);
  margin-bottom: var(--sp-lg);
}

.san-toc-intro h1 {
  font-family: var(--font-display);
  font-size: 22px;
  color: var(--san-navy);
  margin: 0 0 var(--sp-sm);
}

.san-toc-intro h2 {
  font-size: 16px;
  color: var(--san-muted);
  font-weight: normal;
  margin: 0 0 var(--sp-md);
  font-family: var(--font-body);
}

.san-toc-intro p { font-size: 14px; line-height: 1.65; margin: 0 0 var(--sp-sm); }

/* Session info */
.san-toc-sessions {
  background: var(--san-gold-lt);
  border: 1px solid #d4b870;
  border-radius: 4px;
  padding: var(--sp-md);
  margin: var(--sp-md) 0;
  font-size: 13.5px;
}

.san-toc-sessions p { margin: 0 0 4px; line-height: 1.5; }
.san-toc-sessions strong { color: var(--san-navy); }

/* TOC link list */
.san-toc-section {
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-radius: 4px;
  margin-bottom: var(--sp-md);
  overflow: hidden;
}

.san-toc-section-head {
  background: var(--san-navy);
  color: var(--san-gold);
  padding: 10px var(--sp-md);
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: normal;
}

.san-toc-list {
  list-style: none;
  margin: 0;
  padding: var(--sp-sm) 0;
  column-count: 2;
  column-gap: var(--sp-lg);
}

.san-toc-list li {
  padding: 4px var(--sp-md);
  font-size: 13.5px;
  break-inside: avoid;
}

.san-toc-list li a {
  color: var(--san-blue);
  text-decoration: none;
}

.san-toc-list li a:hover { text-decoration: underline; color: var(--san-navy); }

.san-toc-list li i { color: var(--san-muted); font-size: 12px; }

/* Lot display table modernization */
.san-lot-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: var(--sp-md);
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-radius: 4px;
  overflow: hidden;
}

.san-lot-table caption {
  background: var(--san-navy);
  color: var(--san-gold);
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: normal;
  text-align: left;
  padding: 10px var(--sp-md);
  caption-side: top;
}

.san-lot-table thead tr {
  background: #e8edf3;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--san-muted);
}

.san-lot-table thead th {
  padding: 7px var(--sp-sm);
  border-bottom: 1px solid var(--san-border);
  text-align: left;
}

.san-lot-table tbody tr {
  border-bottom: 1px solid #edeae4;
  transition: background 0.1s;
}

.san-lot-table tbody tr:hover { background: #f7f5f0; }
.san-lot-table tbody tr:last-child { border-bottom: none; }

.san-lot-table td {
  padding: var(--sp-sm);
  vertical-align: top;
  font-size: 13.5px;
}

.san-lot-table td.san-lot-desc { background: #f7f5f0; }

.san-lot-bid {
  text-align: right;
  white-space: nowrap;
  min-width: 150px;
}

.san-lot-bid input[type="text"] {
  width: 80px;
  padding: 3px 6px;
  border: 1px solid var(--san-border);
  border-radius: 2px;
  font-size: 13px;
}

.san-lot-price-current {
  color: var(--san-blue);
  font-weight: 700;
  font-size: 14px;
}

.san-lot-price-sold {
  color: var(--san-red);
  font-weight: 700;
  font-size: 14px;
}

.san-lot-price-closed {
  color: var(--san-muted);
  font-weight: 600;
}

.san-lot-estimate {
  font-size: 12px;
  color: var(--san-muted);
  margin-bottom: 4px;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.san-btn,
input[type="submit"].san-btn,
button.san-btn {
  background: var(--san-blue);
  color: #fff;
  border: none;
  padding: 7px 16px;
  font-size: 13px;
  font-family: var(--font-body);
  border-radius: 3px;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  transition: background 0.15s;
}

.san-btn:hover { background: var(--san-navy); }

.san-btn-submit {
  background: var(--san-gold);
  color: var(--san-navy);
  font-weight: 700;
}

.san-btn-submit:hover { background: #d4a017; }

/* Legacy .button class override */
input.button, button.button {
  background: var(--san-blue);
  color: #fff;
  border: 1px solid var(--san-navy);
  padding: 5px 12px;
  font-size: 13px;
  border-radius: 3px;
  cursor: pointer;
}

input.button:hover { background: var(--san-navy); }

/* ============================================================
   SECTION HEADINGS (replace <h3 class="bordered-title">)
   ============================================================ */
h3.bordered-title {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: normal;
  color: var(--san-navy);
  border-bottom: 2px solid var(--san-gold);
  padding-bottom: 5px;
  margin: var(--sp-md) 0 var(--sp-sm);
  letter-spacing: 0.02em;
}

/* ============================================================
   LEGACY LIST OVERRIDES
   ============================================================ */
ul.bordered-list,
ul.bordered-listflex {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.bordered-list li,
ul.bordered-listflex li {
  padding: 6px 0;
  border-bottom: 1px solid #edeae4;
  font-size: 13.5px;
}

ul.bordered-list li:last-child,
ul.bordered-listflex li:last-child { border-bottom: none; }

/* ============================================================
   FOOTER / COPYRIGHT
   ============================================================ */
.san-footer {
  background: var(--san-navy);
  color: #8aaccc;
  font-size: 12px;
  text-align: center;
  padding: var(--sp-md) var(--sp-lg);
  margin-top: var(--sp-xl);
}

.san-footer a { color: #7fb3e0; text-decoration: none; }
.san-footer a:hover { text-decoration: underline; }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* Tablet */
@media (max-width: 900px) {
  .san-page-wrap {
    grid-template-columns: 1fr;
  }
  .san-side-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-md);
  }
  .san-toc-list { column-count: 1; }
  .san-dropdown-wide { min-width: 400px; }
  .san-dropdown-cols, .san-dropdown-cols3 { grid-template-columns: 1fr 1fr; }
}

/* Mobile */
@media (max-width: 640px) {
  /* Topbar stacks */
  .san-topbar-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-sm);
  }

  .san-membership-info { display: none; }

  /* Hamburger appears */
  .san-nav-toggle { display: block; }

  .san-navbar-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .san-nav-list {
    display: none;
    flex-direction: column;
    width: 100%;
  }

  .san-nav-list.san-nav-open { display: flex; }

  .san-nav-list > li { width: 100%; }

  .san-nav-list > li > a {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 12px var(--sp-md);
  }

  /* Dropdowns become full-width below item */
  .san-dropdown {
    position: static;
    box-shadow: none;
    border-top: none;
    border-left: 3px solid var(--san-gold);
    display: none;
    min-width: 100%;
    max-width: 100%;
  }

  .san-nav-list > li.san-mobile-open > .san-dropdown {
    display: block;
  }

  /* Show dropdown on tap (needs JS toggle, handled in nav2026.cfm) */
  .san-nav-list > li > a.san-has-dropdown::after {
    content: ' \25BE';
    font-size: 10px;
  }

  .san-two-col { grid-template-columns: 1fr; }
  .san-side-col { grid-template-columns: 1fr; }
  .san-dropdown-cols, .san-dropdown-cols3 { grid-template-columns: 1fr; }

  /* Lot table on mobile: stack cells */
  .san-lot-table thead { display: none; }
  .san-lot-table tbody tr {
    display: block;
    border: 1px solid var(--san-border);
    border-radius: 4px;
    margin-bottom: var(--sp-sm);
    padding: var(--sp-sm);
  }
  .san-lot-table td {
    display: block;
    border: none;
    padding: 4px 0;
  }
  .san-lot-bid { text-align: left; }
}

/* Print */
@media print {
  #san-topbar, #san-navbar, #san-catalog-strip, #san-catalog-nav { display: none; }
  .san-page-wrap { grid-template-columns: 1fr; }
  .san-side-col { display: none; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* ============================================================
   3-COLUMN PAGE LAYOUT  (auctions2026.cfm)
   Col 1: 45%  Col 2: 22%  Col 3: 33%
   ============================================================ */
.san-page-wrap-3col {
  max-width: 1400px;
  margin: 0 auto;
  padding: 14px 12px 40px;
  display: grid !important;
  grid-template-columns: 45fr 22fr 33fr !important;
  gap: 14px;
  align-items: start;
  width: 100%;
  box-sizing: border-box;
}

.san-col1, .san-col2, .san-col3 {
  min-width: 0;
  display: block !important;
  float: none !important;
  width: auto !important;
}

/* TEMP DIAGNOSTIC -- remove after confirming CSS loads */
.san-col1 { background: #fffde7; }
.san-col2 { background: #e8f5e9; }
.san-col3 { background: #e3f2fd; }

/* Tablet: collapse col1+col2 into one, col3 below */
@media (max-width: 1024px) {
  .san-page-wrap-3col {
    grid-template-columns: 1fr 1fr;
  }
  .san-col3 {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
  .san-col3 > .san-insider-promo { grid-column: 1 / -1; }
}

/* Mobile: single column */
@media (max-width: 640px) {
  .san-page-wrap-3col {
    grid-template-columns: 1fr;
    padding: 10px 8px 30px;
  }
  .san-col3 {
    grid-column: auto;
    display: block;
  }
}

/* ============================================================
   COLLAPSIBLE PANELS
   ============================================================ */
.san-panel-head,
.san-side-panel-head {
  cursor: pointer;
  user-select: none;
}

.san-panel-head::after,
.san-side-panel-head::after {
  content: ' \25BE';
  float: right;
  font-size: 12px;
  opacity: 0.7;
  transition: transform 0.2s;
  display: inline-block;
}

.san-panel-head.san-collapsed::after,
.san-side-panel-head.san-collapsed::after {
  transform: rotate(-90deg);
}

.san-panel-body.san-collapsed,
.san-side-panel-body.san-collapsed,
.san-toggle-bar.san-body-hidden {
  display: none;
}

/* No bullets on featured auctions list */
.san-featured-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.san-featured-item {
  padding: 8px 0;
  border-bottom: 1px solid #edeae4;
  overflow: hidden;
}

.san-featured-item:last-child { border-bottom: none; }

/* ============================================================
   TOP SPACING RESET
   Kills margin/padding that intro2012.cfm, auctiontld.css,
   or browser defaults add above the nav.
   ============================================================ */
body {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Kill any table or TD top padding that intro2012 wraps itself in */
body > table:first-of-type,
body > table:first-of-type > tbody > tr:first-child > td {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ============================================================
   MOBILE RESPONSIVE -- 3-COLUMN TABLE
   The main layout table uses inline WIDTH attributes.
   Override those with CSS at breakpoints.
   ============================================================ */

/* Tablet (max 900px): stack col3 below col1+col2 */
@media (max-width: 900px) {
  .san-main-table > tbody > tr,
  .san-main-table > tr {
    display: flex;
    flex-wrap: wrap;
  }
  .san-main-table > tbody > tr > td,
  .san-main-table > tr > td {
    width: 50% !important;
    box-sizing: border-box;
  }
  .san-main-table > tbody > tr > td:last-child,
  .san-main-table > tr > td:last-child {
    width: 100% !important;
  }
}

/* Mobile (max 640px): single column */
@media (max-width: 640px) {
  .san-main-table > tbody > tr,
  .san-main-table > tr {
    display: block;
  }
  .san-main-table > tbody > tr > td,
  .san-main-table > tr > td {
    width: 100% !important;
    display: block;
  }

  /* Topbar stacks vertically */
  .san-topbar-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    padding: 8px;
  }

  .san-membership-info { display: none; }
  .san-clock { display: none; }

  /* Hamburger shows, nav collapses */
  .san-nav-toggle { display: block; }

  .san-nav-list {
    display: none;
    flex-direction: column;
    width: 100%;
  }

  .san-nav-list.san-nav-open { display: flex; }

  .san-nav-list > li { width: 100%; }

  .san-nav-list > li > a {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 12px 16px;
  }

  .san-dropdown {
    position: static;
    box-shadow: none;
    border-top: none;
    border-left: 3px solid var(--san-gold);
    min-width: 100%;
    max-width: 100%;
    display: none;
  }

  .san-nav-list > li.san-mobile-open > .san-dropdown { display: block; }

  /* Panels full width */
  .san-panel, .san-side-panel { margin-bottom: 8px; }

  /* Featured images smaller on mobile */
  .san-featured-item img { width: 80px !important; }
}

/* ============================================================
   INTRO2012.CFM RESPONSIVE FIX
   Scoped to .san-intro-wrap so only the welcome section
   is affected -- not the main table or footer tables.
   ============================================================ */
.san-intro-wrap {
  width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .san-intro-wrap table {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .san-intro-wrap td,
  .san-intro-wrap th {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  .san-intro-wrap img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* Restore san-main-table behavior -- not inside intro-wrap anyway */
  .san-main-table,
  .san-main-table > tbody,
  .san-main-table > tbody > tr {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
  }

  .san-main-table > tbody > tr > td {
    display: block !important;
    width: 50% !important;
  }

  .san-main-table > tbody > tr > td:last-child {
    width: 100% !important;
  }
}

@media (max-width: 640px) {
  .san-main-table > tbody > tr > td {
    width: 100% !important;
  }
}

/* ============================================================
   WELCOME / INTRO COLLAPSIBLE
   ============================================================ */
.san-intro-toggle {
  background: var(--san-navy);
  color: #fff;
  padding: 9px 16px;
  font-family: var(--font-display);
  font-size: 15px;
  cursor: pointer;
  user-select: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 2px solid var(--san-gold);
}

.san-intro-toggle::after {
  content: '\25BE';
  font-size: 12px;
  opacity: 0.7;
  transition: transform 0.2s;
  display: inline-block;
}

.san-intro-toggle.san-collapsed::after {
  transform: rotate(-90deg);
}

.san-intro-content {
  overflow: hidden;
  transition: max-height 0.25s ease;
}

.san-intro-content.san-collapsed {
  display: none;
}

/* ============================================================
   NAV DROPDOWN Z-INDEX FIX
   MagicZoomPlus slider renders at very high z-index.
   Nav dropdowns must be higher.
   ============================================================ */
#san-navbar {
  position: relative;
  z-index: 9999 !important;
}

.san-dropdown {
  z-index: 10000 !important;
}

/* MagicZoom container forced below nav */
.MagicZoomPlus,
.mz-figure,
.mz-expand,
.MagicZoom,
.MagicZoomBig,
.MagicZoomPup,
[class*="MagicZoom"] {
  z-index: 100 !important;
}

/* ============================================================
   WELCOME PANEL  (intro2012.cfm)
   Two-column layout matching the san-panel design language.
   Sits inside .san-intro-wrap, which the JS turns into a
   collapsible accordion (header pill + content body).
   ============================================================ */
.san-welcome-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-lg);
  background: var(--san-surface);
  border: 1px solid var(--san-border);
  border-top: 4px solid var(--san-gold);
  border-radius: 0 0 4px 4px;
  padding: var(--sp-lg);
}

.san-welcome-left {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.san-welcome-left h1 {
  font-family: var(--font-display);
  font-size: 24px;
  line-height: 1.25;
  color: var(--san-navy);
  margin: 0 0 var(--sp-sm);
  font-weight: normal;
}

.san-welcome-sub {
  font-size: 15px;
  line-height: 1.55;
  color: var(--san-muted);
  margin: 0;
}

.san-welcome-right {
  border-left: 1px solid var(--san-border);
  padding-left: var(--sp-lg);
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
}

.san-welcome-alert {
  background: var(--san-gold-lt);
  border: 1px solid #d4b870;
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 13px;
  color: var(--san-navy);
  margin: 0;
  line-height: 1.5;
}

.san-welcome-alert a {
  color: var(--san-blue);
  font-weight: 600;
  text-decoration: underline;
}

.san-welcome-membership-blue,
.san-welcome-membership-maroon {
  font-size: 13.5px;
  line-height: 1.55;
  margin: 0;
  padding: 10px 12px;
  border-radius: 4px;
}

.san-welcome-membership-blue {
  background: #eaf2fa;
  border: 1px solid #b8d4ec;
  color: var(--san-navy);
}

.san-welcome-membership-maroon {
  background: #f7eaea;
  border: 1px solid #e0bcbc;
  color: var(--san-red);
}

.san-welcome-membership-blue a,
.san-welcome-membership-maroon a {
  font-weight: 600;
  text-decoration: underline;
}

.san-welcome-membership-blue a { color: var(--san-blue); }
.san-welcome-membership-maroon a { color: var(--san-red); }

.san-welcome-contact {
  font-size: 13px;
  color: var(--san-muted);
  margin: 0;
}

.san-welcome-highlights {
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--san-text);
  border-top: 1px solid var(--san-border);
  padding-top: var(--sp-sm);
  margin-top: 4px;
}

.san-welcome-highlights a {
  color: var(--san-blue);
  text-decoration: none;
  font-weight: 600;
}

.san-welcome-highlights a:hover { text-decoration: underline; }

/* Mobile: stack welcome columns */
@media (max-width: 768px) {
  .san-welcome-panel {
    grid-template-columns: 1fr;
    padding: var(--sp-md);
  }
  .san-welcome-right {
    border-left: none;
    border-top: 1px solid var(--san-border);
    padding-left: 0;
    padding-top: var(--sp-md);
  }
  .san-welcome-left h1 {
    font-size: 20px;
  }
}