/* Air Varee friendly UI refresh. Presentation only; existing IDs and behavior stay intact. */
@import url("./airvaree-design-tokens.css");
:root,
:root[data-bs-theme="light"] {
  --ax-bg: var(--airvaree-friendly-bg);
  --ax-paper: var(--airvaree-friendly-paper);
  --ax-paper-soft: var(--airvaree-friendly-paper-soft);
  --ax-line: var(--airvaree-friendly-line);
  --ax-ink: var(--airvaree-friendly-ink);
  --ax-muted: var(--airvaree-friendly-muted);
  --ax-blue: var(--airvaree-friendly-blue);
  --ax-blue-deep: var(--airvaree-friendly-blue-deep);
  --ax-blue-soft: var(--airvaree-friendly-blue-soft);
  --ax-mint-soft: var(--airvaree-friendly-mint-soft);
  --ax-peach-soft: var(--airvaree-friendly-peach-soft);
  --ax-lavender-soft: var(--airvaree-friendly-lavender-soft);
  --ax-shadow: var(--airvaree-friendly-shadow);
}
:root[data-bs-theme="dark"] {
  --ax-bg: var(--airvaree-friendly-bg);
  --ax-paper: var(--airvaree-friendly-paper);
  --ax-paper-soft: var(--airvaree-friendly-paper-soft);
  --ax-line: var(--airvaree-friendly-line);
  --ax-ink: var(--airvaree-friendly-ink);
  --ax-muted: var(--airvaree-friendly-muted);
  --ax-blue: var(--airvaree-friendly-blue);
  --ax-blue-deep: var(--airvaree-friendly-blue-deep);
  --ax-blue-soft: var(--airvaree-friendly-blue-soft);
  --ax-mint-soft: var(--airvaree-friendly-mint-soft);
  --ax-peach-soft: var(--airvaree-friendly-peach-soft);
  --ax-lavender-soft: var(--airvaree-friendly-lavender-soft);
  --ax-shadow: var(--airvaree-friendly-shadow);
}

body {
  background-color: var(--ax-bg) !important;
  color: var(--ax-ink);
  -webkit-tap-highlight-color: transparent;
}
body :is(h1,h2,h3,h4,h5,h6) { color: var(--ax-ink); letter-spacing: -.015em; }
body :is(.card,.app-card,.modal-content,.offcanvas,.dropdown-menu) {
  background-color: var(--ax-paper);
  border-color: var(--ax-line);
}
body :is(.card,.app-card) {
  border-radius: var(--airvaree-radius-card);
  box-shadow: var(--ax-shadow);
}
body :is(.text-muted,.form-text) { color: var(--ax-muted) !important; }
body :is(.form-control,.form-select,.input-group-text) {
  color: var(--ax-ink);
  background-color: var(--ax-paper);
  border-color: var(--ax-line);
  border-radius: var(--airvaree-radius-control);
  min-height: var(--airvaree-touch-target);
}
body :is(.form-control,.form-select):focus {
  color: var(--ax-ink);
  background-color: var(--ax-paper);
  border-color: var(--airvaree-brand-primary);
  box-shadow: var(--airvaree-focus-ring);
}
body .form-control::placeholder { color: var(--ax-muted); opacity: .8; }
body .btn:not(.btn-close) { border-radius: var(--airvaree-radius-control); font-weight: 650; }
body .btn-primary {
  --bs-btn-color: var(--airvaree-text-on-brand);
  --bs-btn-bg: var(--airvaree-brand-primary);
  --bs-btn-border-color: var(--airvaree-brand-primary);
  --bs-btn-hover-color: #ffffff;
  --bs-btn-hover-bg: #1178bd;
  --bs-btn-hover-border-color: #1178bd;
  --bs-btn-active-color: #ffffff;
  --bs-btn-active-bg: #0d69a7;
  --bs-btn-active-border-color: #0d69a7;
}
body .btn-success {
  --bs-btn-bg: #179d79;
  --bs-btn-border-color: #179d79;
  --bs-btn-hover-bg: #107959;
  --bs-btn-hover-border-color: #107959;
}
body .btn-outline-primary {
  --bs-btn-color: var(--ax-blue-deep);
  --bs-btn-border-color: var(--airvaree-brand-primary);
  --bs-btn-hover-bg: var(--airvaree-brand-primary);
  --bs-btn-hover-border-color: var(--airvaree-brand-primary);
  --bs-btn-hover-color: var(--airvaree-text-on-brand);
}
body .badge { border-radius: 999px; padding: .42em .72em; }
body .alert { border-radius: 15px; }
body .modal-content { border: 1px solid var(--ax-line); border-radius: var(--airvaree-radius-dialog); overflow: hidden; }
body .modal-header, body .modal-footer { border-color: var(--ax-line); }
body :is(.table,.table-responsive) { --bs-table-border-color: var(--ax-line); }
body .table-responsive { border-radius: 16px; }
body :is(button,a,input,select,textarea):focus-visible { outline: 3px solid #8bbcff; outline-offset: 2px; }

/* Existing command dashboard: retain its markup and callbacks, soften the shell. */
body:has(#adminTabs) {
  background:
    radial-gradient(circle at 92% 5%, color-mix(in srgb, var(--ax-mint-soft) 70%, transparent), transparent 25rem),
    var(--ax-bg) !important;
}
body:has(#adminTabs) .header-bar {
  color: var(--ax-ink) !important;
  background: linear-gradient(110deg, #e7f2ff, #f0f6ff 58%, #ebf9f4) !important;
  border: 1px solid #d2e5fd;
  border-radius: 22px;
  box-shadow: var(--ax-shadow) !important;
}
[data-bs-theme="dark"] body:has(#adminTabs) .header-bar {
  color: var(--ax-ink) !important;
  background: linear-gradient(110deg, #1d3150, #1c2b42 58%, #1c3939) !important;
  border-color: var(--ax-line);
}
body:has(#adminTabs) #adminTabs { border-color: var(--ax-line) !important; }
body:has(#adminTabs) #adminTabs .nav-link {
  min-height: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  font-weight: 650;
}
body:has(#adminTabs) #adminTabs .nav-link.active { background: var(--ax-blue); color: #fff; }
body:has(#contentArea) #contentArea > .card,
body:has(#contentArea) #contentArea > .row > [class*="col"] > .card { border-color: var(--ax-line); }
body:has(#contentArea) .app-card { border-radius: 18px; }

/* Technician earnings controls stay API-backed and keep their current form IDs. */
body:has(#earningsAdminForms) > main { padding-top: clamp(1rem, 3vw, 2rem) !important; }
body:has(#earningsAdminForms) > main > header {
  padding: 1rem 1.1rem;
  border: 1px solid var(--ax-line);
  border-radius: 20px;
  background: linear-gradient(110deg, var(--ax-blue-soft), var(--ax-mint-soft));
}
body:has(#earningsAdminForms) #earningsAdminForms form { gap: .15rem; }
body:has(#earningsAdminForms) #earningsAdminForms form h2 { margin-bottom: .75rem; }
body:has(#earningsAdminForms) #earningsAdminSummary > [class*="col"] > .card { height: 100%; }

@media (max-width: 767.98px) {
  body:has(#adminTabs) .header-bar { padding: 1rem !important; }
  body:has(#earningsAdminForms) > main { padding-inline: 1rem; }
  body:has(#earningsAdminForms) > main > header { align-items: flex-start !important; }
  body:has(#earningsAdminForms) > main > header .btn { flex: 0 0 auto; }
  body:has(#earningsAdminForms) #earningsAdminForms > [class*="col"] { margin-bottom: .1rem; }
}
@media (prefers-reduced-motion: reduce) {
  body *, body *::before, body *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}