/*
 * brand.css — Farmacomer Warm Editorial Luxury Override
 * Overrides inline CSS across login.php, index.php, order.php
 * Transforms Apple OLED dark/blue aesthetic → warm editorial brand
 */

/* ── Color tokens ── */
:root {
  --page-bg:    #F6F5F0;   /* cream */
  --white:      #FAFAF6;   /* ivory */
  --card-bg:    #F2F1EC;   /* oyster */
  --divider:    #E5E5E0;   /* line */
  --mid-gray:   #6B6B6B;
  --light-gray: #8C8C8C;
  --font-mono:  'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
}

/* ── Body background ── */
body {
  background: var(--page-bg);
}

/* ── Remove gradient top-border accents ── */
.card::before,
.header::before,
.header::after,
.session-bar::before {
  content: none !important;
}

/* ── Card / section radius — flat editorial, no pill cards ── */
.card,
.summary-card,
.sidebar-section,
.inactivity-card {
  border-radius: 6px !important;
}

.table-wrap {
  border-radius: 4px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

/* ── Input / form radius ── */
.form-input,
.search-input,
.input,
.qty-stepper {
  border-radius: 4px !important;
}

/* ── Action / primary / ghost buttons — flat edges (NOT cur-btn or filter-btn) ── */
.action-btn,
.btn.btn-primary,
.btn.btn-ghost {
  border-radius: 4px !important;
}

/* ── Focus rings — warm neutral instead of blue ── */
.input:focus,
.form-input:focus,
.search-input:focus,
.qty-input:focus,
.qty-num:focus {
  box-shadow: 0 0 0 3px rgba(0,0,0,0.08) !important;
  border-color: var(--brand) !important;
}

/* ── Row hover — warm instead of blue ── */
tbody tr:hover {
  background: rgba(0,0,0,0.025) !important;
}

/* ── Highlighted rows (has qty) ── */
tbody tr.has-qty {
  background: rgba(0,0,0,0.04) !important;
}

/* ── Hero title — Playfair Display serif ── */
.hero-title {
  font-family: 'Playfair Display', Georgia, serif !important;
  letter-spacing: -0.02em !important;
}

/* ── Summary card hover — warm lift ── */
.summary-card:hover {
  border-color: var(--brand) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
  transform: translateY(-2px);
}