/*
 * d2-theme.css — TailoredQuote D2 (Apple-inspired) theme
 * Include as the last stylesheet in <head> on every page.
 * Cascades over inline <style> blocks via source order.
 */

/* ── Global ── */
body {
  background: #f5f5f7;
  color: #1d1d1f;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ── Admin topbar (was dark navy #0f1b2d) ── */
.topbar {
  background: rgba(255,255,255,.88) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
.topbar .brand {
  color: #1d1d1f !important;
}
.topbar .brand span,
.topbar .brand b {
  color: #0071e3 !important;
}
.topbar .badge {
  color: #6e6e73 !important;
}
.topbar .logout-btn,
.topbar .signout {
  color: #0071e3 !important;
  border: 1px solid rgba(0,113,227,.3) !important;
  border-radius: 980px !important;
  background: transparent !important;
  font-size: 12px;
  padding: 6px 14px;
}
.topbar .logout-btn:hover,
.topbar .signout:hover {
  background: rgba(0,113,227,.06) !important;
  color: #0071e3 !important;
}

/* ── Admin sidebar (was dark navy #162033) ── */
.sidebar {
  background: #fff !important;
  border-right: 1px solid rgba(0,0,0,.07) !important;
}
.sidebar-label {
  color: #ababab !important;
}
.sidebar a {
  color: #1d1d1f !important;
  border-radius: 8px !important;
}
.sidebar a svg,
.sidebar a .icon { opacity: 0.55 !important; }
.sidebar a:hover {
  background: rgba(0,0,0,.04) !important;
  color: #1d1d1f !important;
}
.sidebar a.active {
  background: rgba(0,113,227,.08) !important;
  color: #0071e3 !important;
  font-weight: 600 !important;
}
.sidebar a.active svg,
.sidebar a.active .icon { opacity: 1 !important; }

/* ── Main content area ── */
.main {
  background: #f5f5f7 !important;
}

/* ── Page titles ── */
.page-title, h1 { color: #1d1d1f; }
.page-sub, .subtitle { color: #6e6e73; }

/* ── Stat / tool cards ── */
.stat-card,
.tool-card,
.table-card,
.card-section,
.detail-card {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.07) !important;
  border-radius: 16px !important;
  box-shadow: 0 2px 16px rgba(0,0,0,.06) !important;
}
.stat-card .value { color: #1d1d1f !important; }
.stat-card .value.gold,
.stat-card .value.blue { color: #0071e3 !important; }
.stat-card .label { color: #6e6e73 !important; }
.tool-card:hover {
  border-color: rgba(0,113,227,.3) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,.1) !important;
}
.tool-card .icon {
  background: rgba(0,113,227,.08) !important;
  border-radius: 10px !important;
}

/* ── Auth / centred cards (login, signup) ── */
.card {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.07) !important;
  border-radius: 20px !important;
  box-shadow: 0 4px 32px rgba(0,0,0,.08) !important;
}
.card h2 { color: #1d1d1f !important; }

/* ── Buttons ── */
.btn,
button.btn,
a.btn,
.generate-btn,
.save-btn,
.action-btn,
.primary-btn,
.btn-primary {
  border-radius: 980px !important;
}
.btn-primary,
.generate-btn,
.save-btn,
.primary-btn {
  background: #0071e3 !important;
  color: #fff !important;
  border-color: #0071e3 !important;
}
.btn-primary:hover,
.generate-btn:hover,
.save-btn:hover,
.primary-btn:hover {
  background: #0077ed !important;
}
.btn:not(.btn-primary):not(.generate-btn):not(.save-btn) {
  border-radius: 980px !important;
}
/* Page-level buttons with class "btn" that are the main CTA */
button.btn[style*="background:#1a56db"],
button.btn[style*="background: #1a56db"] {
  background: #0071e3 !important;
}

/* ── Form inputs & selects ── */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
select,
textarea {
  border-radius: 10px !important;
  border-color: rgba(0,0,0,.12) !important;
  background: #fafafa !important;
  color: #1d1d1f !important;
}
input:focus,
select:focus,
textarea:focus {
  border-color: #0071e3 !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,.12) !important;
  background: #fff !important;
  outline: none !important;
}

/* ── Tables ── */
th {
  background: #f5f5f7 !important;
  color: #6e6e73 !important;
}
tr:hover td {
  background: rgba(0,113,227,.03) !important;
}

/* ── Links ── */
a { color: #0071e3; }
a:hover { color: #0077ed; }

/* ── Sign-out / nav buttons ── */
.signout-btn {
  color: #0071e3 !important;
  border: 1px solid rgba(0,113,227,.3) !important;
  border-radius: 980px !important;
  background: transparent !important;
}
.signout-btn:hover {
  background: rgba(0,113,227,.06) !important;
}

/* ── Status pills ── */
.status-pill,
.badge-pill {
  border-radius: 980px !important;
}

/* ── Brand mark on login/auth pages ── */
.brand-block h1 { color: #1d1d1f !important; }
.brand-block p  { color: #6e6e73 !important; }
.brand-block span { color: #0071e3 !important; }

/* ── Error / message states ── */
#loginMsg.error,
.error-msg {
  background: #fff2f2 !important;
  border-color: #ffb3b3 !important;
  color: #c00 !important;
  border-radius: 10px !important;
}

/* ── Signup link colours ── */
.signup-link a { color: #0071e3 !important; }
