/* =========================================================================
   ASTROMATA · ADMIN PANEL STYLESHEET
   Imperial Vedic palette — oxblood sidebar, parchment workspace, gold accents.
   Token names retained for backward compatibility; values point to the new system.
   ========================================================================= */

:root {
  --admin-sidebar-w: 240px;
  --admin-header-h: 56px;

  /* Legacy names mapped to Imperial Vedic palette */
  --plum-900:    #2D0A0F;   /* oxblood-950 — sidebar, header */
  --plum-800:    #1F0509;   /* oxblood-900 — sidebar pressed */
  --plum-700:    #4A0E17;   /* oxblood-800 — active nav item */
  --magenta-500: #E2B44C;   /* accent role is now gold */
  --rose-600:    #4A0E17;   /* oxblood-800 — primary button bg */
  --rose-700:    #1F0509;   /* oxblood-900 — primary button hover */
  --gold-500:    #E2B44C;
  --gold-400:    #F3D78C;
  --ivory-50:    #F4EDE3;   /* parchment-100 — page bg */
  --ivory-100:   #FBF6EF;   /* parchment-200 — card bg */
  --ivory-200:   #FBF6EF;
  --slate-800:   #2C2A26;   /* ink-800 */
  --slate-600:   #5E5854;   /* ink-600 */
  --slate-500:   #6B6560;   /* ink-500 */
  --text-inv:    #FDF8F0;   /* cream-100 */
  --border-soft: #C4A87C;   /* bronze-300 */
  --r-md: 8px;
  --r-lg: 14px;
  --shadow-sm: 0 1px 3px rgba(45,10,15,.06);
  --shadow-md: 0 4px 12px rgba(45,10,15,.08);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 15px; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--ivory-50);
  color: var(--slate-800);
  line-height: 1.5;
  min-height: 100vh;
  display: flex;
}
a { color: var(--rose-600); text-decoration: none; }
a:hover { color: var(--rose-700); }
img { max-width: 100%; display: block; }

/* ---------- SIDEBAR ---------- */
.admin-sidebar {
  width: var(--admin-sidebar-w);
  min-height: 100vh;
  background: var(--plum-900);
  color: var(--text-inv);
  display: flex;
  flex-direction: column;
  position: fixed; top: 0; left: 0; bottom: 0;
  z-index: 50;
  overflow-y: auto;
}
.admin-sidebar .brand {
  padding: 20px 18px;
  border-bottom: 1px solid rgba(255,248,242,.08);
  display: flex; align-items: center; gap: 10px;
  text-decoration: none;
}
.admin-sidebar .brand img { height: 36px; }
.admin-sidebar .brand span { font-weight: 700; font-size: 14px; color: var(--magenta-500); letter-spacing: .03em; }
.admin-sidebar nav { padding: 12px 0; flex: 1; }
.admin-sidebar nav a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 18px;
  font-size: 13px; font-weight: 500;
  color: rgba(255,248,242,.7);
  transition: all .15s;
  border-left: 3px solid transparent;
}
.admin-sidebar nav a svg { width: 18px; height: 18px; flex-shrink: 0; opacity: .65; }
.admin-sidebar nav a:hover { background: rgba(255,248,242,.05); color: var(--text-inv); }
.admin-sidebar nav a.active { background: rgba(255,248,242,.08); color: var(--gold-400); border-left-color: var(--gold-500); }
.admin-sidebar nav a.active svg { opacity: 1; }
.admin-sidebar .sidebar-section { padding: 16px 18px 6px; font-size: 10px; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,248,242,.35); font-weight: 700; }
.admin-sidebar .logout-link { margin-top: auto; border-top: 1px solid rgba(255,248,242,.08); }
.admin-sidebar .logout-link a { color: rgba(255,248,242,.55); }
.admin-sidebar .logout-link a:hover { color: #F44336; }

/* ---------- MAIN CONTENT ---------- */
.admin-main {
  margin-left: var(--admin-sidebar-w);
  flex: 1;
  min-height: 100vh;
  display: flex; flex-direction: column;
}
.admin-topbar {
  height: var(--admin-header-h);
  background: var(--ivory-100);
  border-bottom: 1px solid var(--border-soft);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 28px;
  position: sticky; top: 0; z-index: 40;
  box-shadow: var(--shadow-sm);
}
.admin-topbar h1 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 18px; font-weight: 600; color: var(--plum-900); }
.admin-topbar .meta { font-size: 12px; color: var(--slate-500); }
.admin-content { padding: 28px; flex: 1; }

/* ---------- CARDS ---------- */
.card {
  background: var(--ivory-100);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: 24px;
  box-shadow: var(--shadow-sm);
}
.card + .card { margin-top: 20px; }
.card h2 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 16px; margin-bottom: 16px; color: var(--plum-900); }

/* Stat cards row */
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 24px; }
.stat-card {
  background: var(--ivory-100);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: 20px;
  box-shadow: var(--shadow-sm);
}
.stat-card .label { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--slate-500); font-weight: 600; margin-bottom: 6px; }
.stat-card .value { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 2rem; font-weight: 700; color: var(--rose-600); }
.stat-card .sub { font-size: 12px; color: var(--slate-500); margin-top: 4px; }

/* ---------- TABLES ---------- */
.tbl-wrap { overflow-x: auto; }
table.admin-table { width: 100%; border-collapse: collapse; font-size: 13px; }
table.admin-table th {
  text-align: left; padding: 10px 12px;
  font-size: 11px; text-transform: uppercase; letter-spacing: .08em;
  color: var(--slate-500); font-weight: 600;
  border-bottom: 2px solid var(--border-soft);
  white-space: nowrap;
}
table.admin-table td {
  padding: 12px; border-bottom: 1px solid var(--border-soft);
  vertical-align: middle;
}
table.admin-table tr:hover td { background: rgba(247,243,232,.6); }
table.admin-table .actions { white-space: nowrap; display: flex; gap: 6px; }

/* ---------- BADGES / STATUS PILLS ---------- */
.badge {
  display: inline-block; padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 600; letter-spacing: .03em;
}
/* Muted, on-brand status pills (Imperial Vedic palette). */
.badge-success { background: rgba(45,90,61,0.10);  color: #2D5A3D; }
.badge-warning { background: rgba(139,105,20,0.12); color: #8B6914; }
.badge-danger  { background: rgba(90,26,26,0.10);  color: #5A1A1A; }
.badge-info    { background: rgba(74,14,23,0.08);  color: #4A0E17; }
.badge-muted   { background: rgba(94,88,84,0.10);  color: #5E5854; }

/* ---------- FORMS ---------- */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-grid.full { grid-template-columns: 1fr; }
.fg { margin-bottom: 16px; }
.fg label { display: block; font-size: 12px; font-weight: 600; color: var(--slate-600); margin-bottom: 5px; letter-spacing: .02em; }
.fg label .req { color: var(--rose-600); }
.fg input, .fg select, .fg textarea {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border-soft); border-radius: 6px;
  font-family: inherit; font-size: 14px; color: var(--slate-800); background: #fff;
  transition: border .15s;
}
.fg input:focus, .fg select:focus, .fg textarea:focus {
  outline: none; border-color: var(--rose-600);
  box-shadow: 0 0 0 3px rgba(74,14,23,.14);
}
.fg textarea { min-height: 100px; resize: vertical; }
.fg .help { font-size: 11px; color: var(--slate-500); margin-top: 4px; }

/* ---------- BUTTONS ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 20px; border-radius: 8px;
  font-family: inherit; font-size: 13px; font-weight: 600;
  border: none; cursor: pointer; transition: all .15s; text-decoration: none; line-height: 1;
}
.btn-primary { background: var(--rose-600); color: #fff; }
.btn-primary:hover { background: var(--rose-700); color: #fff; }
.btn-gold { background: var(--gold-500); color: var(--plum-900); }
.btn-gold:hover { background: var(--gold-400); }
.btn-ghost { background: transparent; color: var(--slate-800); border: 1px solid var(--border-soft); }
.btn-ghost:hover { background: var(--ivory-200); }
.btn-danger { background: #FFEBEE; color: #C62828; }
.btn-danger:hover { background: #FFCDD2; }
.btn-sm { padding: 6px 12px; font-size: 12px; border-radius: 6px; }
.btn-block { width: 100%; justify-content: center; }
.btn + .btn { margin-left: 6px; }

/* ---------- ALERTS ---------- */
.alert { padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; font-size: 13px; border: 1px solid; }
.alert-success { background: #E8F5E9; border-color: #A5D6A7; color: #1B5E20; }
.alert-error   { background: #FFEBEE; border-color: #EF9A9A; color: #B71C1C; }
.alert-info    { background: #E3F2FD; border-color: #90CAF9; color: #0D47A1; }

/* ---------- LOGIN PAGE ---------- */
.login-page {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: var(--plum-900);
  background-image: radial-gradient(at 30% 20%, rgba(94,22,34,.15), transparent 50%),
                    radial-gradient(at 70% 80%, rgba(212,175,55,.08), transparent 50%);
}
.login-box {
  width: 100%; max-width: 400px;
  background: rgba(255,248,242,.04); border: 1px solid rgba(212,175,55,.3);
  border-radius: 16px; padding: 40px 32px;
}
.login-box h1 { font-family: 'Cormorant Garamond', Georgia, serif; color: var(--gold-500); font-size: 1.5rem; margin-bottom: 6px; }
.login-box .sub { color: rgba(255,248,242,.6); font-size: 13px; margin-bottom: 24px; }
.login-box label { color: rgba(255,248,242,.85); }
.login-box input {
  background: rgba(255,248,242,.06); border-color: rgba(255,248,242,.15); color: var(--text-inv);
}
.login-box input::placeholder { color: rgba(255,248,242,.35); }
.login-box input:focus { border-color: var(--gold-500); box-shadow: 0 0 0 3px rgba(212,175,55,.15); }

/* ---------- MISC ---------- */
.photo-thumb { width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: var(--ivory-200); }
.page-actions { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; flex-wrap: wrap; gap: 10px; }
.empty { text-align: center; padding: 48px 16px; color: var(--slate-500); }
.empty h3 { font-family: inherit; font-weight: 500; margin-bottom: 8px; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.mt-2 { margin-top: 12px; } .mt-4 { margin-top: 24px; }
.mb-2 { margin-bottom: 12px; } .mb-4 { margin-bottom: 24px; }

/* Slot grid for availability page */
.slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; }
.slot-btn {
  padding: 8px; border-radius: 6px; text-align: center; font-size: 13px; font-weight: 600;
  border: 1px solid var(--border-soft); cursor: pointer; transition: all .15s;
}
.slot-btn.available { background: #E8F5E9; color: #2E7D32; border-color: #A5D6A7; }
.slot-btn.available:hover { background: #C8E6C9; }
.slot-btn.blocked { background: #FFEBEE; color: #C62828; border-color: #EF9A9A; }
.slot-btn.blocked:hover { background: #FFCDD2; }
.slot-btn.booked { background: #E3F2FD; color: #1565C0; border-color: #90CAF9; cursor: not-allowed; }

/* Settings groups */
.settings-group { margin-bottom: 28px; }
.settings-group h3 { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--slate-500); margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); }

/* Pricing matrix table */
.pricing-matrix td input { width: 100px; text-align: right; }
.pricing-matrix td { text-align: center; }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 768px) {
  .admin-sidebar { width: 0; transform: translateX(-100%); transition: transform .25s; }
  .admin-sidebar.open { width: var(--admin-sidebar-w); transform: translateX(0); }
  .admin-main { margin-left: 0; }
  .admin-content { padding: 16px; }
  .form-grid { grid-template-columns: 1fr; }
  .stat-row { grid-template-columns: 1fr 1fr; }
}
