/* ============================================================
   SIP — The Ultimate Tasting Experience
   Primary:  #F15E33  (Vermilion)
   CTA:      #F15E33  (Vermilion)
   Accent:   #DBA871  (Tan)
   Mauve:    #CD7298
   Olive:    #C4C653
   BG:       #F6E3D5  (Peach Rose)
   Font:     Poppins
   ============================================================ */

:root {
  --maroon:        #F15E33;
  --maroon-med:    #C2431E;
  --maroon-light:  rgba(241, 94, 51, .90);
  --vermilion:     #F15E33;
  --vermilion-hover: #d44d26;
  --tan:           #DBA871;
  --tan-dark:      #b8895a;
  --mauve:         #CD7298;
  --olive:         #C4C653;
  --peach:         #F6E3D5;
  --dark:          #1d1d1d;
  --mid:           #3e3e3e;
  --light:         #faf5f0;
  --lighter:       #fdf9f6;
  --border:        #e8d8cc;
  --text:          #000000;
  --heading:       #000000;
  --text-muted:    #7a5a4a;
  --white:         #ffffff;
}

/* Vendor-portal pages (register/login/dashboard/events/staff/SKUs/checkout) use
   Olive instead of Vermilion — everything else keys off these two vars, so
   overriding them here recolors nav/hero/buttons/badges/etc. in one place. */
.vendor-portal {
  --maroon:          #C4C653;
  --maroon-med:      #9D9E42;
  --maroon-light:    rgba(196, 198, 83, .90);
  --vermilion:       #C4C653;
  --vermilion-hover: #9D9E42;
}

/* Base */
body {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 400;
  color: var(--text);
  background: var(--lighter);
  font-size: 15px;
  line-height: 1.65;
}
.admin-body { background: #f5ede7; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--heading);
}

a { color: var(--vermilion); }
a:hover { color: var(--vermilion-hover); }

/* ---- Navbar ---- */
.wine-navbar {
  background: var(--maroon) !important;
  border-bottom: 3px solid var(--tan);
  padding: .6rem 0;
}
.wine-navbar .navbar-brand {
  font-weight: 800;
  font-size: 1.2rem;
  letter-spacing: .03em;
  color: #fff !important;
}
.wine-navbar .navbar-brand img {
  height: 36px;
  width: auto;
}
.wine-navbar .navbar-brand:hover { opacity: .85; }
.wine-navbar .nav-link {
  color: rgba(255,255,255,.85) !important;
  font-weight: 500;
  font-size: .88rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .4rem .9rem !important;
  transition: color .15s;
}
.wine-navbar .nav-link:hover { color: var(--tan) !important; }
.wine-btn-outline {
  border: 1px solid var(--tan);
  color: var(--tan) !important;
  border-radius: 20px;
  font-weight: 600;
}
.wine-btn-outline:hover {
  background: var(--tan);
  color: var(--maroon) !important;
}

/* ---- Buttons ---- */
.btn-wine {
  background: var(--vermilion);
  color: #fff;
  border: none;
  border-radius: 20px;
  font-weight: 600;
  letter-spacing: .03em;
  font-size: .88rem;
  transition: background .15s, transform .1s;
}
.btn-wine:hover { background: var(--vermilion-hover); color: #fff; transform: translateY(-1px); }

.btn-wine-outline {
  border: 2px solid var(--vermilion);
  color: var(--vermilion);
  background: transparent;
  border-radius: 20px;
  font-weight: 600;
  letter-spacing: .03em;
  font-size: .88rem;
}
.btn-wine-outline:hover { background: var(--vermilion); color: #fff; }

.btn-gold {
  background: var(--tan);
  color: var(--maroon);
  border: none;
  border-radius: 20px;
  font-weight: 700;
  letter-spacing: .03em;
  font-size: .88rem;
}
.btn-gold:hover { background: var(--tan-dark); color: var(--maroon); }

/* ---- Cards ---- */
.wine-card {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(241,94,51,.08);
  background: var(--white);
}
.wine-card .card-header {
  background: var(--maroon);
  color: #fff;
  border-radius: 12px 12px 0 0;
  font-weight: 700;
  font-size: .85rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: .9rem 1.25rem;
}

/* ---- Event cards ---- */
.event-card { transition: transform .15s, box-shadow .15s; }
.event-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(241,94,51,.14);
}
.event-badge {
  background: var(--vermilion);
  color: #fff;
  font-size: .72rem;
  padding: 3px 12px;
  border-radius: 20px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ---- Hero section ---- */
.wine-hero {
  position: relative;
  background: var(--maroon);
  color: #fff;
  padding: 80px 0 72px;
  margin-bottom: 40px;
  overflow: hidden;
}
.wine-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/uploads/site/photos/photo1.png') center/cover no-repeat;
  opacity: .22;
}
.wine-hero > * { position: relative; }
.wine-hero h1 {
  font-size: 2.8rem;
  font-weight: 800;
  letter-spacing: -.03em;
  color: #fff;
}
.wine-hero .lead { color: rgba(255,255,255,.85); font-weight: 400; }
.wine-hero .sip-logo-hero {
  height: 70px;
  width: auto;
  display: block;
  margin: 0 auto 16px;
  filter: brightness(0) invert(1);
  opacity: .95;
}

/* ---- Footer ---- */
.wine-footer {
  background: var(--maroon);
  border-top: 3px solid var(--tan);
}
.wine-footer .text-muted { color: rgba(255,255,255,.45) !important; }

/* ---- Admin sidebar ---- */
.wine-sidebar {
  min-height: 100vh;
  width: 235px;
  background: var(--maroon);
  border-right: 3px solid var(--tan);
  position: sticky;
  top: 0;
  flex-shrink: 0;
}
.wine-sidebar .navbar-brand {
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: .04em;
  color: #fff !important;
}
.wine-sidebar .navbar-brand img {
  height: 32px;
  width: auto;
}
.wine-sidebar .nav-link {
  padding: .45rem .85rem;
  border-radius: 8px;
  font-size: .83rem;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: rgba(255,255,255,.75) !important;
  transition: background .12s, color .12s;
}
.wine-sidebar .nav-link:hover {
  background: rgba(255,255,255,.10);
  color: var(--tan) !important;
}
.wine-sidebar .nav-link.active {
  background: var(--vermilion);
  color: #fff !important;
}

/* ---- Tables ---- */
.table thead th {
  background: var(--maroon);
  color: #fff;
  border: none;
  font-size: .78rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  font-weight: 600;
}
.table-hover tbody tr:hover td { background: rgba(241,94,51,.03); }

/* ---- Status badges ---- */
.badge-pending         { background: var(--tan); color: var(--heading); }
.badge-paid            { background: #198754; color: #fff; }
.badge-cancelled       { background: #6c757d; color: #fff; }
.badge-refunded        { background: #0dcaf0; color: #000; }
.badge-pending_offline { background: var(--mauve); color: #fff; }

/* ---- Forms ---- */
.form-label { font-weight: 600; font-size: .88rem; color: var(--heading); letter-spacing: .01em; }
.form-control:focus,
.form-select:focus {
  border-color: var(--vermilion);
  box-shadow: 0 0 0 .2rem rgba(241,94,51,.15);
}

/* ---- SKU form ---- */
.sku-section {
  border-left: 4px solid var(--tan);
  padding: 12px 18px;
  margin-bottom: 28px;
  background: rgba(219,168,113,.06);
  border-radius: 0 8px 8px 0;
}
.sku-section h5 { color: var(--heading); font-weight: 700; }

/* ---- Stat cards ---- */
.stat-card {
  border-radius: 12px;
  padding: 24px;
  color: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
}
.stat-card .stat-number { font-size: 2.2rem; font-weight: 800; }
.stat-card .stat-label  { font-size: .8rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; opacity: .85; }

/* ---- Price ---- */
.price-tag { font-size: 1.25rem; font-weight: 800; color: var(--vermilion); }

/* ---- Alerts override ---- */
.alert { border-radius: 10px; border-left-width: 4px; }
.alert-success { border-left-color: #198754; }
.alert-danger  { border-left-color: var(--vermilion); }
.alert-warning { border-left-color: var(--tan); }
.alert-info    { border-left-color: var(--mauve); }

/* ---- Rich text editor (contenteditable, used for broadcast messages + option descriptions) ---- */
.rte-toolbar{display:flex;flex-wrap:wrap;gap:4px;align-items:center;border:1px solid #ced4da;border-bottom:none;border-radius:6px 6px 0 0;padding:6px;background:#f8f5f0}
.rte-toolbar button{border:1px solid transparent;background:#fff;border-radius:4px;padding:3px 9px;font-size:.85rem;cursor:pointer;line-height:1.3;color:#3a2a1a}
.rte-toolbar button:hover{border-color:#ccc;background:#fdf6ee}
.rte-toolbar button:disabled{opacity:.5;cursor:wait}
.rte-toolbar .sep{width:1px;height:20px;background:#d9cdbd;margin:0 3px}
.rte-editor{border:1px solid #ced4da;border-radius:0 0 6px 6px;min-height:210px;max-height:460px;overflow:auto;padding:12px 14px;background:#fff;font-size:.95rem;line-height:1.6}
.rte-editor:focus{outline:none;border-color:#86b7fe;box-shadow:0 0 0 .2rem rgba(13,110,253,.15)}
.rte-editor img{max-width:100%;height:auto;border-radius:4px}
.rte-editor:empty:before{content:attr(data-ph);color:#9a9a9a}
.rte-editor ul,.rte-editor ol{padding-left:1.4em;margin-bottom:.5em}

/* ---- Breadcrumb ---- */
.breadcrumb { font-size: .83rem; }
.breadcrumb-item a { color: var(--vermilion); }

/* ---- Pagination ---- */
.page-link { color: var(--maroon); }
.page-item.active .page-link { background: var(--maroon); border-color: var(--maroon); }

/* ---- Progress bar ---- */
.progress-bar { background-color: var(--vermilion); }

/* ---- Tier cards (event registration) ---- */
.tier-card { border-color: var(--border) !important; }
.tier-card:hover { border-color: var(--maroon) !important; background: rgba(241,94,51,.03); }
.tier-card.selected { border-color: var(--vermilion) !important; background: rgba(241,94,51,.06); }

@media (max-width: 768px) {
  .wine-sidebar { display: none !important; }
  .wine-hero h1 { font-size: 2rem; }
  .wine-hero .sip-logo-hero { height: 52px; }
  .stat-card .stat-number { font-size: 1.7rem; }
}

/* ── Interactive floor map (Phase 11) ── */
.floor-map{position:relative;display:block;width:100%;border-radius:10px;overflow:hidden;
  border:1px solid #e6ddd3;background:#f5f0ec}
.floor-map-img{display:block;width:100%;height:auto}
.floor-map-svg{position:absolute;inset:0;width:100%;height:100%}
.floor-map-svg .fm-booth rect{fill:rgba(241,94,51,.12);stroke:#F15E33;stroke-width:2;
  vector-effect:non-scaling-stroke;transition:fill .2s}
.floor-map-svg .fm-booth text{fill:#5a3b2e;font-size:20px;font-weight:700;text-anchor:middle;
  dominant-baseline:middle;paint-order:stroke;stroke:#fff;stroke-width:3px}
.floor-map-svg .fm-booth.hl rect{fill:rgba(241,94,51,.55);stroke-width:4;
  animation:fmPulse 1s ease-in-out 3}
@keyframes fmPulse{0%,100%{fill:rgba(241,94,51,.55)}50%{fill:rgba(241,94,51,.18)}}

/* Admin floor-map editor */
.fm-edit-wrap{position:relative;width:100%;user-select:none;touch-action:none;
  border:1px solid #dee2e6;border-radius:8px;overflow:hidden;background:#f5f0ec}
.fm-edit-wrap img{display:block;width:100%;height:auto;pointer-events:none}
.fm-edit-svg{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair}
.fm-edit-svg rect.shape{fill:rgba(13,110,253,.15);stroke:#0d6efd;stroke-width:2;
  vector-effect:non-scaling-stroke}
.fm-edit-svg rect.shape.sel{fill:rgba(13,110,253,.32);stroke-width:3}
.fm-edit-svg text.shape-label{fill:#0a3d91;font-size:18px;font-weight:700;text-anchor:middle;
  dominant-baseline:middle;pointer-events:none;paint-order:stroke;stroke:#fff;stroke-width:3px}
.fm-edit-svg rect.handle{fill:#fff;stroke:#0d6efd;stroke-width:1.5;vector-effect:non-scaling-stroke;
  cursor:nwse-resize}
.fm-booth-row.active{background:rgba(13,110,253,.08)}
.fm-edit-scroll{overflow:auto;max-height:78vh;border:1px solid #dee2e6;border-radius:8px;background:#f5f0ec}
.fm-edit-scroll .fm-edit-wrap{border:0}
.fm-hint{font:inherit}