/* ================================================================
   settings.css — admin settings panel, drag list, data tables
   ================================================================ */

/* ── LAYOUT ─────────────────────────────────────────────────────── */
.settings-sidebar { background: var(--pa); border-right: 1px solid var(--bo); }

.settings-body { padding: var(--sp-lg); background: var(--cr); }
.settings-body h2 {
  font-family: var(--heading-font); font-size: 18.7px; color: var(--rd); font-style: italic;
  margin-bottom: 1rem; padding-bottom: .4rem; border-bottom: 1px solid var(--go);
}

/* ── SETTINGS SECTION CARD ──────────────────────────────────────── */
.settings-section {
  background: #fff; border: 1px solid var(--bo);
  border-radius: var(--r-lg); padding: 1rem; margin-bottom: var(--sp-md);
}
.settings-section h3 {
  font-size: 9.9px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); margin-bottom: .75rem;
  padding-bottom: .3rem; border-bottom: 1px solid var(--bo);
}

/* ── SAVE BAR ───────────────────────────────────────────────────── */
.settings-save-bar {
  background: var(--pa); border: 1px solid var(--bo);
  border-radius: var(--r-md); padding: var(--sp-sm) 1rem;
  display: flex; align-items: center; justify-content: space-between;
  margin-top: var(--sp-md);
}
.settings-save-bar p { font-size: 11px; color: var(--muted); font-style: italic; }

/* ── STAT BOX ───────────────────────────────────────────────────── */
.stat-box   { background: var(--pa); padding: .75rem; border-radius: var(--r-md); text-align: center; }
.stat-n     { font-family: var(--heading-font); font-size: 24.2px; color: var(--rd); }
.stat-l     { font-size: 11px; color: var(--muted); margin-top: 2px; }
.stat-grid  { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-sm); }

/* ── STATUS BADGES ──────────────────────────────────────────────── */
.badge-on  { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: var(--r-pill); font-size: 11px; background: rgba(45,80,22,.1); color: var(--gn); }
.badge-off { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: var(--r-pill); font-size: 11px; background: rgba(139,26,26,.1); color: var(--red); }

/* ── DRAG HANDLE ────────────────────────────────────────────────── */
.drag-handle { color: var(--muted); font-size: 15.4px; cursor: grab; display: flex; align-items: center; }

/* ── PREVIEW BOX ────────────────────────────────────────────────── */
.preview-box   { background: var(--rd); border-radius: var(--r-md); padding: var(--sp-md) 1rem; text-align: center; margin-bottom: var(--sp-md); }
.preview-name  { font-family: var(--heading-font); font-size: 18.7px; color: var(--pa); font-style: italic; margin-bottom: 1px; }
.preview-name strong { color: var(--gl); font-style: normal; }
.preview-slogan { font-size: 9.9px; letter-spacing: .18em; text-transform: uppercase; color: var(--go); opacity: .8; }

/* ── COMPACT SITE SETTINGS TAB ──────────────────────────────────── */
.settings-compact .preview-box     { padding: var(--sp-sm) 1rem; margin-bottom: var(--sp-sm); }
.settings-compact .preview-name    { font-size: 16.5px; }
.settings-compact .settings-section { padding: .65rem .85rem; margin-bottom: var(--sp-sm); }
.settings-compact .settings-section h3 { margin-bottom: .5rem; padding-bottom: .25rem; }
.settings-compact .form-row        { gap: var(--sp-sm); }
.settings-compact .form-group      { margin-bottom: var(--sp-sm); }
.settings-compact .form-group:last-child { margin-bottom: 0; }
.settings-compact .form-group input,
.settings-compact .form-group select,
.settings-compact .form-group textarea { padding: 6px 8px; }
.settings-compact .form-group label { margin-bottom: 2px; }
.settings-compact .form-check      { margin-top: .35rem; }
.settings-compact .settings-save-bar { margin-top: var(--sp-sm); padding: var(--sp-xs) 1rem; }