/*!
 * "The Deer" brand theme.
 * Loaded after app.css / auth.css / pos.css and only re-points colours: the
 * gold of the antlers is the primary, the charcoal of the wordmark carries the
 * sidebar and dark buttons, the burgundy of the flowers is reserved for danger.
 * Layout, spacing and typography stay in the files that own them.
 */

:root,
[data-bs-theme="light"] {
  --deer-gold: #d6a63a;
  --deer-gold-2: #e5bd58;
  --deer-gold-dark: #b98d27;
  --deer-gold-rgb: 214, 166, 58;
  --deer-ink: #1f1f1f;
  --deer-ink-2: #2d2d2d;
  --deer-ink-rgb: 31, 31, 31;
  --deer-wine: #8c1d2e;
  --deer-wine-rgb: 140, 29, 46;
  --deer-cream: #f8f6f1;

  /* Bootstrap 5.3 tokens */
  --bs-primary: var(--deer-gold);
  --bs-primary-rgb: var(--deer-gold-rgb);
  --bs-primary-text: #8a6a1c;
  --bs-primary-text-emphasis: #8a6a1c;
  --bs-primary-bg-subtle: #f8efd9;
  --bs-primary-border-subtle: #ecd28f;
  --bs-info: var(--deer-ink);
  --bs-info-rgb: var(--deer-ink-rgb);
  --bs-info-text: var(--deer-ink);
  --bs-info-text-emphasis: var(--deer-ink);
  --bs-info-bg-subtle: #ececec;
  --bs-info-border-subtle: #d4d4d4;
  --bs-danger: var(--deer-wine);
  --bs-danger-rgb: var(--deer-wine-rgb);
  --bs-danger-text: #7a1626;
  --bs-danger-text-emphasis: #7a1626;
  --bs-danger-bg-subtle: #f6e3e6;
  --bs-danger-border-subtle: #e6b8bf;
  --bs-link-color: var(--deer-ink);
  --bs-link-color-rgb: var(--deer-ink-rgb);
  --bs-link-hover-color: var(--deer-gold-dark);
  --bs-link-hover-color-rgb: 185, 141, 39;
  --bs-focus-ring-color: rgba(var(--deer-gold-rgb), 0.25);

  /* app.css tokens */
  --app-canvas: var(--deer-cream);
  --app-sidebar-bg: linear-gradient(180deg, #1c1c1c 0%, #262626 55%, #1a1a1a 100%);
  --app-primary-gradient: linear-gradient(135deg, var(--deer-gold-dark) 0%, var(--deer-gold) 55%, var(--deer-gold-2) 100%);
  --tone-sale: var(--deer-gold-dark);
  --tone-return: var(--deer-wine);
}

[data-bs-theme="dark"] {
  --bs-primary: var(--deer-gold);
  --bs-primary-rgb: var(--deer-gold-rgb);
  --bs-primary-text: #e9c86c;
  --bs-primary-text-emphasis: #e9c86c;
  --bs-primary-bg-subtle: #3a2f12;
  --bs-primary-border-subtle: #6b5520;
  --bs-info: #3a3a3a;
  --bs-info-rgb: 58, 58, 58;
  --bs-info-text: #d9d9d9;
  --bs-info-text-emphasis: #d9d9d9;
  --bs-info-bg-subtle: #262626;
  --bs-info-border-subtle: #444;
  --bs-danger: #b8354a;
  --bs-danger-rgb: 184, 53, 74;
  --bs-danger-text: #e79aa7;
  --bs-danger-text-emphasis: #e79aa7;
  --bs-danger-bg-subtle: #3d151d;
  --bs-danger-border-subtle: #6a2432;
  --bs-link-color: #f0f0f0;
  --bs-link-color-rgb: 240, 240, 240;
  --bs-link-hover-color: var(--deer-gold-2);
  --bs-link-hover-color-rgb: 229, 189, 88;
  --app-sidebar-bg: linear-gradient(180deg, #141414 0%, #1c1c1c 55%, #121212 100%);
  --app-primary-gradient: linear-gradient(135deg, var(--deer-gold-dark) 0%, var(--deer-gold) 55%, var(--deer-gold-2) 100%);
  --tone-sale: var(--deer-gold);
  --tone-return: #c9475b;
}

/* ================================================================= buttons */
.btn-primary {
  --bs-btn-color: var(--deer-ink);
  --bs-btn-bg: var(--deer-gold);
  --bs-btn-border-color: var(--deer-gold);
  --bs-btn-hover-color: var(--deer-ink);
  --bs-btn-hover-bg: var(--deer-gold-dark);
  --bs-btn-hover-border-color: var(--deer-gold-dark);
  --bs-btn-active-color: var(--deer-ink);
  --bs-btn-active-bg: var(--deer-gold-dark);
  --bs-btn-active-border-color: var(--deer-gold-dark);
  --bs-btn-disabled-color: var(--deer-ink);
  --bs-btn-disabled-bg: var(--deer-gold);
  --bs-btn-disabled-border-color: var(--deer-gold);
  --bs-btn-focus-shadow-rgb: var(--deer-gold-rgb);
  color: var(--deer-ink);
  box-shadow: 0 6px 16px -8px rgba(var(--deer-gold-rgb), 0.9);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:first-child:active { color: var(--deer-ink); }

.btn-info {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--deer-ink);
  --bs-btn-border-color: var(--deer-ink);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #000;
  --bs-btn-hover-border-color: #000;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #000;
  --bs-btn-active-border-color: #000;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--deer-ink);
  --bs-btn-disabled-border-color: var(--deer-ink);
  --bs-btn-focus-shadow-rgb: var(--deer-ink-rgb);
}
.btn-outline-primary {
  --bs-btn-color: var(--deer-gold-dark);
  --bs-btn-border-color: var(--deer-gold);
  --bs-btn-hover-color: var(--deer-ink);
  --bs-btn-hover-bg: var(--deer-gold);
  --bs-btn-hover-border-color: var(--deer-gold);
  --bs-btn-active-color: var(--deer-ink);
  --bs-btn-active-bg: var(--deer-gold);
  --bs-btn-active-border-color: var(--deer-gold);
  --bs-btn-focus-shadow-rgb: var(--deer-gold-rgb);
}
.btn-danger {
  --bs-btn-bg: var(--deer-wine);
  --bs-btn-border-color: var(--deer-wine);
  --bs-btn-hover-bg: #731626;
  --bs-btn-hover-border-color: #731626;
  --bs-btn-active-bg: #731626;
  --bs-btn-active-border-color: #731626;
  --bs-btn-disabled-bg: var(--deer-wine);
  --bs-btn-disabled-border-color: var(--deer-wine);
  --bs-btn-focus-shadow-rgb: var(--deer-wine-rgb);
}
.btn-outline-danger {
  --bs-btn-color: var(--deer-wine);
  --bs-btn-border-color: var(--deer-wine);
  --bs-btn-hover-bg: var(--deer-wine);
  --bs-btn-hover-border-color: var(--deer-wine);
  --bs-btn-active-bg: var(--deer-wine);
  --bs-btn-active-border-color: var(--deer-wine);
}
.bg-primary { background-color: var(--deer-gold) !important; }
.bg-info { background-color: var(--deer-ink) !important; }
.bg-danger { background-color: var(--deer-wine) !important; }
.text-primary { color: var(--deer-gold-dark) !important; }
.text-info { color: var(--deer-ink) !important; }
.text-danger { color: var(--deer-wine) !important; }
.badge.bg-primary, .badge.text-bg-primary { color: var(--deer-ink) !important; }
.form-check-input:checked { background-color: var(--deer-gold); border-color: var(--deer-gold); }
.page-item.active .page-link {
  color: var(--deer-ink);
  border-color: transparent;
  box-shadow: 0 6px 14px -8px rgba(var(--deer-gold-rgb), 0.9);
}

/* ================================================================= sidebar */
.page-sidebar::after {
  background: radial-gradient(circle, rgba(var(--deer-gold-rgb), 0.28) 0%, rgba(var(--deer-gold-rgb), 0) 70%);
}
.page-sidebar .aside-logo img {
  max-height: 44px;
  padding: 3px 8px;
  background: #fff;
  border-radius: 0.6rem;
}
.page-sidebar .sidebar-title { color: rgba(var(--deer-gold-rgb), 0.75); }
.page-sidebar .nav-link.active,
.page-sidebar .nav-link[data-bs-toggle="collapse"].active,
.page-sidebar .sidebar-item .sidebar-link.active,
.page-sidebar li.active > .nav-link,
.page-sidebar li.active > .sidebar-link {
  color: var(--deer-ink);
  box-shadow: 0 6px 18px -6px rgba(var(--deer-gold-rgb), 0.85);
}
.page-sidebar .sidebar-dropdown::before { background: rgba(var(--deer-gold-rgb), 0.3); }
.page-sidebar .sidebar-dropdown .sidebar-link.active {
  background: rgba(var(--deer-gold-rgb), 0.2);
  color: #fff;
}
.page-sidebar .sidebar-icon { color: rgba(var(--deer-gold-rgb), 0.9); }
.page-sidebar .sidebar-link.active .sidebar-icon,
.page-sidebar li.active > .sidebar-link .sidebar-icon { color: inherit; }

/* Header brand text */
.page-header .navbar-brand,
.page-header .brand-text { color: var(--deer-ink); }

/* Card headings get a thin gold rule */
.card > .card-header { border-bottom: 2px solid rgba(var(--deer-gold-rgb), 0.45); }

/* Data tables: toolbar buttons */
div.dt-buttons .btn,
div.dt-buttons .dt-button { --tone: var(--deer-ink-rgb); }
div.dt-buttons .buttons-colvis { --tone: var(--deer-gold-rgb); }

/* ============================================================== auth pages */
.auth-brand { background: var(--deer-ink); }
.auth-brand::before {
  background: radial-gradient(circle, rgba(var(--deer-gold-rgb), 0.9) 0%, rgba(var(--deer-gold-rgb), 0) 68%);
  opacity: 0.55;
}
.auth-brand::after {
  background: radial-gradient(circle, rgba(var(--deer-wine-rgb), 0.95) 0%, rgba(var(--deer-wine-rgb), 0) 70%);
  opacity: 0.6;
}
.auth-brand-mark img {
  width: auto;
  height: 56px;
  padding: 6px 10px;
  border-radius: 0.75rem;
}
.auth-features i {
  color: var(--deer-gold-2);
  background: rgba(var(--deer-gold-rgb), 0.12);
  border-color: rgba(var(--deer-gold-rgb), 0.3);
}
.auth-brand-body h1 span { color: var(--deer-gold-2); }

/* The logo sits above the form on every screen size. */
.auth-logo {
  display: flex;
  justify-content: center;
  margin: 0 auto 1.5rem;
}
.auth-logo img {
  width: min(100%, 17rem);
  height: auto;
  object-fit: contain;
}
.auth-card h2 { color: var(--deer-ink); }
.auth-card-mark { display: none !important; }

.auth-input-wrap .form-control:focus + i.auth-lead,
.auth-input-wrap .form-control:focus ~ i.auth-lead { color: var(--deer-gold-dark); }
.auth-meta a,
.auth-meta a.forgot-pass { color: var(--deer-gold-dark); }

.auth-submit {
  color: var(--deer-ink);
  background: var(--app-primary-gradient);
  box-shadow: 0 12px 26px -12px rgba(var(--deer-gold-rgb), 0.95);
}
.auth-submit:hover:not(:disabled) { box-shadow: 0 16px 30px -12px rgba(var(--deer-gold-rgb), 1); }
.auth-submit .spinner { border-color: rgba(var(--deer-ink-rgb), 0.3); border-top-color: var(--deer-ink); }
.auth-lang a:hover,
.auth-lang a.active {
  background: rgba(var(--deer-gold-rgb), 0.15);
  color: var(--deer-gold-dark);
}
.auth-alert-danger {
  color: var(--deer-wine);
  background: rgba(var(--deer-wine-rgb), 0.08);
  border-color: rgba(var(--deer-wine-rgb), 0.25);
}

/* ==================================================================== POS */
.pos-modern {
  --pos-nav: #1c1c1c;
  --pos-nav-2: #2a2a2a;
  --pos-accent: var(--deer-gold);
  --pos-accent-ink: var(--deer-ink);
  --pos-accent-soft: #f8efd9;
  --pos-canvas: var(--deer-cream);
  --pos-ink: var(--deer-ink);
  --pos-blue: var(--deer-gold-dark);
  --pos-blue-soft: #f8efd9;
  --pos-blue-line: #ecd28f;
  --pos-red: var(--deer-wine);
}
.pos-modern .modal .btn-primary:hover,
.pos-modern .pos-shift-key--ok:hover { background: var(--deer-gold-dark) !important; color: var(--deer-ink) !important; }
