/* ============================================================
   Outpost — Diamond Stop Theme
   Palette: slate blue, cream, warm brown — Americana
   Fonts: Avenir Next (loaded locally if available), Libre Baskerville
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&family=IBM+Plex+Mono:wght@400;600&display=swap');

/* Avenir Next — served from /assets/fonts/ if uploaded */
@font-face {
  font-family: 'Avenir Next LT Pro';
  src: url('/assets/fonts/AvenirNextLTPro-Regular.otf') format('opentype');
  font-weight: 400; font-style: normal;
}
@font-face {
  font-family: 'Avenir Next LT Pro';
  src: url('/assets/fonts/AvenirNextLTPro-Bold.otf') format('opentype');
  font-weight: 700; font-style: normal;
}
@font-face {
  font-family: 'Avenir Next LT Pro';
  src: url('/assets/fonts/AvenirNextLTPro-It.otf') format('opentype');
  font-weight: 400; font-style: italic;
}

:root {
  /* Typography */
  --font-sans:    'Avenir Next LT Pro', 'Libre Baskerville', Georgia, serif;
  --font-display: 'Avenir Next LT Pro', 'Libre Baskerville', Georgia, serif;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;

  /* Brand — slate/cream/brown */
  --store-color:       #3a506b;
  --store-color-dark:  #2b3d52;
  --store-accent:      #7e5c3a;

  /* Surfaces */
  --bg:            #f4f1e9;   /* cream base */
  --bg-surface:    #ede9df;   /* slightly deeper cream */
  --bg-card:       #faf8f4;   /* warm white card */
  --login-bg:      #e8e3d8;

  /* Text */
  --text:          #1e1d1a;
  --text-muted:    #6b5e50;

  /* Borders */
  --border:        #d9d0c0;

  /* Component-level */
  --nav-hover-bg:  rgba(58,80,107,.07);
  --nav-active-bg: rgba(58,80,107,.12);
  --badge-bg:      rgba(58,80,107,.1);
  --badge-border:  rgba(58,80,107,.25);
  --row-hover:     rgba(58,80,107,.04);
  --card-shadow:   rgba(30,29,26,.07);
  --topbar-shadow: rgba(30,29,26,.06);
  --input-bg:      #fff;
  --input-border:  #d9d0c0;
  --focus-ring:    rgba(58,80,107,.18);

  /* Decorative rule used in headings */
  --rule-color:    #c6a58b;
}

/* ---- Sidebar brand stripe --------------------------------- */
.sidebar { border-right-color: #cdc5b5; }

.sidebar-brand {
  background: var(--store-color);
  border-bottom-color: transparent;
}

.sidebar-brand .brand-mark  { color: #c6a58b; }
.sidebar-brand .brand-app   { color: #fff; }
.sidebar-brand .brand-store { color: rgba(255,255,255,.65); }

/* ---- Nav active state uses slate rig ---------------------- */
.nav-link.active { border-left-color: var(--store-color); }

/* ---- User avatar ------------------------------------------ */
.user-avatar { background: var(--store-color); }

/* ---- Stat card accent ------------------------------------- */
.stat-card::after { background: var(--store-color); }

/* ---- Store badge ------------------------------------------ */
.store-badge {
  background: rgba(58,80,107,.1);
  color: var(--store-color);
  border-color: rgba(58,80,107,.25);
}

/* ---- Topbar ----------------------------------------------- */
.topbar { border-bottom-color: #cdc5b5; }

/* ---- Page title font -------------------------------------- */
.page-header h2 { font-weight: 700; color: var(--store-color); }

/* ---- Table header background ------------------------------ */
th { background: #ede9df; color: #6b5e50; border-bottom-color: #cdc5b5; }

/* ---- Card light warm shadow ------------------------------- */
.card { border-color: #d9d0c0; }

/* ---- Divider rule ----------------------------------------- */
hr { border: none; border-top: 1px solid var(--rule-color); opacity: .5; margin: 20px 0; }