/**
 * Malabar Technology Service Management
 * Core Design Tokens & Theme Mapping
 * Supporting Light & Dark Mode via [data-bs-theme]
 */

:root,
[data-bs-theme="light"] {
  /* Brand Palettes */
  --mt-primary: #0B3B8F;
  --mt-primary-rgb: 11, 59, 143;
  --mt-primary-hover: #082c6c;
  --mt-primary-subtle: #e0ecff;

  --mt-accent: #0EA5A4;
  --mt-accent-rgb: 14, 165, 164;
  --mt-accent-subtle: #e0f7f6;

  --mt-success: #16A34A;
  --mt-success-rgb: 22, 163, 74;
  --mt-success-subtle: #dcfce7;

  --mt-warning: #F59E0B;
  --mt-warning-rgb: 245, 158, 11;
  --mt-warning-subtle: #fef3c7;

  --mt-danger: #DC2626;
  --mt-danger-rgb: 220, 38, 38;
  --mt-danger-subtle: #fee2e2;

  --mt-info: #0284C7;
  --mt-info-rgb: 2, 132, 199;
  --mt-info-subtle: #e0f2fe;

  /* Surfaces & Layout */
  --mt-bg-body: #f8fafc;
  --mt-surface: #ffffff;
  --mt-surface-card: #ffffff;
  --mt-surface-subtle: #f1f5f9;
  --mt-surface-hover: #f8fafc;

  /* Borders & Dividers */
  --mt-border: #e2e8f0;
  --mt-border-light: #f1f5f9;
  --mt-border-subtle: #cbd5e1;

  /* Typography */
  --mt-text-main: #0f172a;
  --mt-text-muted: #64748b;
  --mt-text-inverse: #ffffff;

  /* Radii & Shadows */
  --mt-radius: 12px;
  --mt-radius-sm: 8px;
  --mt-radius-lg: 16px;
  --mt-radius-pill: 9999px;

  --mt-shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
  --mt-shadow: 0 2px 4px -1px rgba(15, 23, 42, 0.06), 0 1px 2px -1px rgba(15, 23, 42, 0.04);
  --mt-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08), 0 2px 4px -2px rgba(15, 23, 42, 0.06);
  --mt-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);

  /* App Shell Layout Dimensions */
  --sidebar-w: 260px;
  --sidebar-w-collapsed: 72px;
  --topbar-h: 64px;

  /* Documented Unified Z-Index Scale */
  --z-sticky-action: 1010;
  --z-topbar: 1020;
  --z-sidebar: 1020;
  --z-dropdown: 1030;
  --z-backdrop: 1040;
  --z-offcanvas: 1045;
  --z-modal-backdrop: 1050;
  --z-modal: 1055;
  --z-popover: 1060;
  --z-toast: 1090;

  /* Bootstrap Variable Overrides */
  --bs-primary: var(--mt-primary);
  --bs-primary-rgb: var(--mt-primary-rgb);
  --bs-info: var(--mt-info);
  --bs-info-rgb: var(--mt-info-rgb);
  --bs-success: var(--mt-success);
  --bs-success-rgb: var(--mt-success-rgb);
  --bs-warning: var(--mt-warning);
  --bs-warning-rgb: var(--mt-warning-rgb);
  --bs-danger: var(--mt-danger);
  --bs-danger-rgb: var(--mt-danger-rgb);

  --bs-body-bg: var(--mt-bg-body);
  --bs-body-color: var(--mt-text-main);
  --bs-secondary-color: var(--mt-text-muted);
  --bs-card-bg: var(--mt-surface-card);
  --bs-card-border-color: var(--mt-border);
  --bs-border-color: var(--mt-border);
  --bs-border-radius: var(--mt-radius);
  --bs-border-radius-sm: var(--mt-radius-sm);
  --bs-border-radius-lg: var(--mt-radius-lg);

  --bs-link-color: var(--mt-primary);
  --bs-link-hover-color: var(--mt-primary-hover);
}

[data-bs-theme="dark"] {
  /* Brand Palettes Dark Adjusted */
  --mt-primary: #3b82f6;
  --mt-primary-rgb: 59, 130, 246;
  --mt-primary-hover: #60a5fa;
  --mt-primary-subtle: rgba(59, 130, 246, 0.15);

  --mt-accent: #14b8a6;
  --mt-accent-rgb: 20, 184, 166;
  --mt-accent-subtle: rgba(20, 184, 166, 0.15);

  --mt-success: #22c55e;
  --mt-success-rgb: 34, 197, 94;
  --mt-success-subtle: rgba(34, 197, 94, 0.15);

  --mt-warning: #f59e0b;
  --mt-warning-rgb: 245, 158, 11;
  --mt-warning-subtle: rgba(245, 158, 11, 0.15);

  --mt-danger: #ef4444;
  --mt-danger-rgb: 239, 68, 68;
  --mt-danger-subtle: rgba(239, 68, 68, 0.15);

  --mt-info: #38bdf8;
  --mt-info-rgb: 56, 189, 248;
  --mt-info-subtle: rgba(56, 189, 248, 0.15);

  /* Dark Surfaces & Layout */
  --mt-bg-body: #0b1120;
  --mt-surface: #131c31;
  --mt-surface-card: #141e34;
  --mt-surface-subtle: #1e2d4f;
  --mt-surface-hover: #192644;

  /* Dark Borders */
  --mt-border: #263554;
  --mt-border-light: #1f2b45;
  --mt-border-subtle: #33446b;

  /* Typography */
  --mt-text-main: #f1f5f9;
  --mt-text-muted: #94a3b8;
  --mt-text-inverse: #0f172a;

  /* Shadows Dark */
  --mt-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
  --mt-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.35);
  --mt-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.45);
  --mt-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.55);

  /* Bootstrap Overrides Dark */
  --bs-primary: var(--mt-primary);
  --bs-primary-rgb: var(--mt-primary-rgb);
  --bs-info: var(--mt-info);
  --bs-info-rgb: var(--mt-info-rgb);
  --bs-success: var(--mt-success);
  --bs-success-rgb: var(--mt-success-rgb);
  --bs-warning: var(--mt-warning);
  --bs-warning-rgb: var(--mt-warning-rgb);
  --bs-danger: var(--mt-danger);
  --bs-danger-rgb: var(--mt-danger-rgb);

  --bs-body-bg: var(--mt-bg-body);
  --bs-body-color: var(--mt-text-main);
  --bs-secondary-color: var(--mt-text-muted);
  --bs-card-bg: var(--mt-surface-card);
  --bs-card-border-color: var(--mt-border);
  --bs-border-color: var(--mt-border);
  --bs-tertiary-bg: var(--mt-surface-subtle);

  --bs-link-color: var(--mt-primary);
  --bs-link-hover-color: var(--mt-primary-hover);
}

/* Base resets & typography */
html {
  scroll-padding-top: var(--topbar-h);
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* Focus visibility for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.form-control:focus,
.btn:focus-visible {
  outline: 2px solid var(--mt-accent) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* Touch targets at least 44px on phone */
@media (max-width: 767.98px) {
  .btn,
  .nav-link,
  .form-control,
  .form-select,
  .clickable-touch {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

/* Unified Layout Container Padding - Mobile-first and Unconditional */
.page-container,
.client-container,
.tech-container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 12px;
  padding-right: 12px;
}

@media (min-width: 576px) {
  .page-container,
  .client-container,
  .tech-container {
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media (min-width: 992px) {
  .page-container,
  .client-container,
  .tech-container {
    padding-left: 24px;
    padding-right: 24px;
  }
}

/* Active Segmented / Pill / Nav-Tab High Contrast */
.nav-pills .nav-link.active,
.status-chip.active,
.segmented-tab.active,
.tech-tab-item.active,
.client-tab-item.active {
  color: #ffffff !important;
  background-color: var(--mt-primary) !important;
}

.nav-pills .nav-link.active *,
.status-chip.active *,
.segmented-tab.active *,
.tech-tab-item.active *,
.client-tab-item.active * {
  color: #ffffff !important;
}

.nav-pills .nav-link.active .badge,
.status-chip.active .badge,
.segmented-tab.active .badge {
  color: var(--mt-primary) !important;
  background-color: #ffffff !important;
}


