/* =============================================================
   MOTADATA DESIGN SYSTEM — Late-load Overrides
   -------------------------------------------------------------
   This file is linked AFTER @stack('custom-style') in the layout
   headers so it beats per-page <style> blocks that use !important.

   Purpose: hunt down the last navy/blue accents that leaked into
   per-page styles and replace them with the motadata orange.
   ============================================================= */

:root {
  --md-orange: #f17463;
  --md-orange-dark: #d95a48;
  --md-orange-light: #fbe6e1;
}

/* =====================================================
   SELECT2 — used everywhere, focus border was #1180c5
   ===================================================== */
html:not(.dark) .select2-container--default.select2-container--focus .select2-selection--single,
html:not(.dark) .select2-container--default.select2-container--focus .select2-selection--multiple,
html:not(.dark) .select2-container--default .select2-selection--single:focus,
html:not(.dark) .select2-container--default .select2-selection--multiple:focus {
  border-color: var(--md-orange) !important;
  box-shadow: 0 0 0 2px hsl(7 84% 67% / 0.18) !important;
}

/* Selected option highlight */
html:not(.dark) .select2-container--default .select2-results__option--highlighted[aria-selected],
html:not(.dark) .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--md-orange) !important;
  color: #fff !important;
}

html:not(.dark) .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: hsl(7 84% 67% / 0.12) !important;
  border-color: hsl(7 84% 67% / 0.35) !important;
  color: #7a2a1d !important;
}

/* =====================================================
   ANNOUNCEMENT CARD — dashboard.blade.php, was #0284c7
   ===================================================== */
.static-announcement {
  border-left-color: var(--md-orange) !important;
}

/* =====================================================
   DASHBOARD-specific — active-lead card was #114E80
   (motadata-theme already handles; reinforce here)
   ===================================================== */
html:not(.dark) .active-lead .card {
  background: linear-gradient(135deg, hsl(7 84% 67%), hsl(350 75% 55%)) !important;
  color: #fff !important;
  border: 0 !important;
}

/* =====================================================
   AUDIT LOG — event badges (audit-log-list.blade.php)
   Original: bg rgba(59,130,246,0.15), color #2563eb
   ===================================================== */
.event-badge.badge-added,
.event-badge.badge-login,
.event-badge.badge-created,
.event-badge.badge-updated {
  background: hsl(7 84% 67% / 0.15) !important;
  color: #a0361f !important;
}

/* =====================================================
   LMS dashboard text-primary custom color — #114E80
   ===================================================== */
.lms-primary,
.dashboard-stat-primary {
  color: var(--md-orange) !important;
}

/* =====================================================
   ANY inline OR page-level rule that sets these hex codes
   on background/border/color — CSS attribute selectors as
   a belt-and-braces catch-all.
   NOTE: only works when the style is set on the element
   itself, not in a descendant <style> block. Still useful
   for inline style="border-color:#1180c5" cases.
   ===================================================== */
[style*="#1180c5"] { border-color: var(--md-orange) !important; }
[style*="#114E80"] { background-color: var(--md-orange) !important; }
[style*="#114e80"] { background-color: var(--md-orange) !important; }
[style*="#0284c7"] { border-color: var(--md-orange) !important; }

/* =====================================================
   Fallback: any .btn that still ends up blue because of
   per-page overrides should at least read orange on hover.
   ===================================================== */
html:not(.dark) .btn.bg-primary,
html:not(.dark) .btn.hover\:bg-primary-focus:hover {
  background-color: var(--md-orange) !important;
}