/* ══════════════════════════════════════════════════
   WineCellar – custom styles (Bootstrap 5 base)
   Primary: #722F37  |  Gold: #C8A951
═══════════════════════════════════════════════════ */

:root {
  --wine:       #722F37;
  --wine-dark:  #5a2229;
  --wine-light: #9a4050;
  --gold:       #C8A951;
  --card-bg:    #fff;
  --body-bg:    #f5f0eb;
}

/* ── Base ── */
body {
  background-color: var(--body-bg);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  min-height: 100dvh;
}

/* ── Bootstrap color overrides ── */
.btn-wine {
  background-color: var(--wine);
  border-color: var(--wine);
  color: #fff;
}
.btn-wine:hover, .btn-wine:focus, .btn-wine:active {
  background-color: var(--wine-dark);
  border-color: var(--wine-dark);
  color: #fff;
}
.btn-outline-wine {
  color: var(--wine);
  border-color: var(--wine);
}
.btn-outline-wine:hover, .btn-outline-wine:focus {
  background-color: var(--wine);
  color: #fff;
}
.text-wine { color: var(--wine) !important; }
.bg-wine   { background-color: var(--wine) !important; }
.spinner-border.text-wine { color: var(--wine) !important; }

/* ── Navbar ── */
.navbar.bg-wine { background-color: var(--wine) !important; }
.navbar .dropdown-toggle::after { vertical-align: 0.15em; }

/* ── App tabs ── */
.app-tabs {
  background: #fff;
  border-bottom: 2px solid var(--wine);
  position: sticky;
  top: 56px;
  z-index: 100;
}
.app-tabs .nav-link {
  color: #555;
  font-size: 0.85rem;
  padding: 0.6rem 0.5rem;
  border-radius: 0;
  border: none;
}
.app-tabs .nav-link.active {
  color: var(--wine);
  border-bottom: 3px solid var(--wine);
  font-weight: 700;
  background: rgba(114,47,55,0.08);
}
.app-tabs .nav-link:hover { color: var(--wine); }

.tab-content-area {
  padding: 1rem;
  max-width: 1100px;
  margin: 0 auto;
}
#tab-ledger {
  max-width: 1400px;
  margin: 0 auto;
}
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* ── Auth screen ── */
.auth-container {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: linear-gradient(160deg, #722F37 0%, #3d1519 100%);
}
.auth-logo {
  text-align: center;
  margin-bottom: 1.5rem;
  color: #fff;
}
.auth-logo h1 {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 1px;
}
.wine-icon { font-size: 3rem; display: block; margin-bottom: 0.25rem; }
.auth-card {
  background: #fff;
  border-radius: 12px;
  padding: 1.75rem;
  width: 100%;
  max-width: 420px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35);
}
.auth-card h2 {
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 1.25rem;
  color: var(--wine);
}
.auth-links a {
  color: var(--wine);
  text-decoration: none;
  font-size: 0.9rem;
}
.auth-links a:hover { text-decoration: underline; }

/* ── Scan ── */
.scan-upload-area {
  border: 2px dashed #ccc;
  border-radius: 12px;
  background: #fff;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  text-align: center;
}
.scan-icon { font-size: 3rem; margin-bottom: 0.5rem; }
.scan-prompt p { color: #666; margin-bottom: 1rem; }
.scan-preview-img {
  max-width: 100%;
  max-height: 300px;
  border-radius: 8px;
  display: block;
  margin: 0 auto;
  box-shadow: 0 2px 12px rgba(0,0,0,0.15);
}

.result-header {
  padding: 0.75rem 1rem;
  border-radius: 8px;
  font-weight: 600;
  margin: 1rem 0 0.5rem;
  display: flex;
  align-items: center;
}
.result-header.match    { background: #d4edda; color: #155724; }
.result-header.no-match { background: #cce5ff; color: #004085; }

.identified-badge {
  background: #fff3cd;
  border: 1px solid #ffc107;
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  font-size: 0.9rem;
  color: #856404;
}

/* ── Star rating ── */
.star-rating { font-size: 1.8rem; cursor: pointer; color: #ccc; user-select: none; }
.star-rating span { transition: color 0.1s; }
.star-rating span.active,
.star-rating span:hover,
.star-rating span.hover { color: var(--gold); }

/* ── Spinners ── */
.spinner-group { max-width: 160px; }
.spinner-group .btn { width: 2.5rem; flex-shrink: 0; }
.spinner-group input[type=number] {
  -moz-appearance: textfield;
}
.spinner-group input[type=number]::-webkit-outer-spin-button,
.spinner-group input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* ── Wine cards in inventory ── */
.wine-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.wine-card-item {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.wine-card-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.14);
}
.wine-card-photo {
  width: 100%;
  height: 160px;
  object-fit: cover;
  background: #f0e8e8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: var(--wine-light);
}
.wine-card-photo img { width: 100%; height: 100%; object-fit: cover; }
.wine-card-body { padding: 0.85rem; }
.wine-card-title {
  font-weight: 600;
  font-size: 0.95rem;
  margin-bottom: 0.1rem;
  color: #1a1a1a;
}
.wine-card-winery { font-size: 0.82rem; color: #888; margin-bottom: 0.4rem; }
.wine-card-meta   { font-size: 0.82rem; color: #555; margin-bottom: 0.5rem; }
.wine-card-qty {
  display: inline-block;
  background: var(--wine);
  color: #fff;
  border-radius: 20px;
  padding: 0.15rem 0.6rem;
  font-size: 0.78rem;
  font-weight: 600;
}
.wine-card-qty.qty-zero { background: #aaa; }

/* ── Swipe-to-consume ── */
.swipe-wrap {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  touch-action: pan-y; /* allow vertical scroll, we handle horizontal */
}
.swipe-reveal {
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 80px;
  background: #dc3545;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.75rem;
  gap: 2px;
  cursor: pointer;
  user-select: none;
}
.swipe-reveal .swipe-icon { font-size: 1.4rem; }
.wine-card-item {
  position: relative;
  will-change: transform;
  /* keep existing transition but override for swipe */
}
.wine-card-item.swiping { transition: none !important; }
.wine-card-item.snap-back { transition: transform 0.25s ease !important; }
/* list row long-press highlight */
.inv-list-row.lp-active { background: #f8d7da !important; }

/* ── Quick Consume bottom sheet ── */
.quick-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1040;
  animation: fadeIn 0.18s;
}
.quick-sheet-body {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: #fff;
  border-radius: 16px 16px 0 0;
  padding: 1.25rem 1.25rem 2rem;
  z-index: 1041;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.18);
  animation: slideUp 0.22s ease;
  max-width: 560px;
  margin: 0 auto;
}
@keyframes slideUp {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.qc-stars span {
  font-size: 1.5rem;
  color: #ddd;
  cursor: pointer;
  transition: color 0.1s;
}
.qc-stars span.active { color: #C8A951; }

/* Scan result wine card (compact) */
.wine-card {
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e5d5d8;
  padding: 1rem;
}
.wine-card .wine-title  { font-size: 1.1rem; font-weight: 700; }
.wine-card .wine-winery { color: #888; font-size: 0.9rem; }
.wine-card .wine-meta   { font-size: 0.85rem; color: #555; margin-top: 0.4rem; }

/* ── Inventory filters ── */
.inventory-filters .card-body { padding: 0.75rem; }

/* ── Settings ── */
.settings-section .card-header {
  font-weight: 600;
  background: #f9f4f4;
  color: var(--wine);
}

/* ── Members list ── */
.member-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid #f0e8e8;
}
.member-row:last-child { border-bottom: none; }
.member-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--wine-light);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 600;
  flex-shrink: 0;
}
.member-info { flex: 1; min-width: 0; }
.member-name  { font-weight: 500; font-size: 0.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.member-email { font-size: 0.78rem; color: #888; }
.badge-role-owner  { background: var(--wine) !important; }
.badge-role-member { background: #6c757d !important; }
.badge-role-guest  { background: #adb5bd !important; }

/* ── Empty state ── */
.empty-state {
  text-align: center;
  padding: 3rem 1rem;
  color: #888;
}
.empty-state .empty-icon { font-size: 3rem; margin-bottom: 0.75rem; }

/* ── Toast ── */
#app-toast          { background: var(--wine); color: #fff; }
#app-toast .btn-close-white { filter: invert(1); }

/* ── Modal ── */
.modal-header.bg-wine .btn-close { filter: invert(1) brightness(2); }

/* ── Consumption history table ── */
.history-table { font-size: 0.85rem; }
.stars-display { color: var(--gold); letter-spacing: -2px; }

/* ── Responsive tweaks ── */
@media (max-width: 576px) {
  .tab-content-area { padding: 0.75rem; }
  .wine-grid { grid-template-columns: 1fr; }
  .tab-label { display: none; }
  .app-tabs .nav-link { font-size: 1.2rem; padding: 0.7rem; }
  .auth-card { padding: 1.25rem; }
}

/* ── Print styles ── */
@media print {
  /* Hide chrome */
  .navbar,
  .app-tabs,
  .inventory-filters,
  #inv-pagination,
  #inv-loading,
  .btn-print,
  .toast-container,
  .modal,
  #map-no-data { display: none !important; }

  /* Remove background, padding */
  body { background: #fff !important; }
  .tab-content-area { padding: 0 !important; }
  .container-fluid { padding: 0 !important; }

  /* Keep only visible tab panel */
  .tab-panel.d-none { display: none !important; }
  .tab-panel       { display: block !important; box-shadow: none !important; }

  /* Print header (cellar name + date) */
  #print-header { display: block !important; margin-bottom: 0.75rem; }

  /* Inventory list: full width, no overflow clip */
  .table-responsive { overflow: visible !important; }
  .table { font-size: 0.8rem; }
  /* Show all columns when printing */
  .d-none.d-sm-table-cell,
  .d-none.d-md-table-cell { display: table-cell !important; }

  /* Cards: 3 per row, keep photos */
  .wine-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .wine-card-item { break-inside: avoid; }

  /* Map: fill page */
  #map-container { height: 85vh !important; border-radius: 0 !important; }
  .leaflet-control-zoom { display: none !important; }
}