/*
 * CondoGestão UI foundations / Owner: ui-foundation
 *
 * Raw canonical values live here. New UI consumes --cg-*; legacy aliases
 * below are compatibility only and must not be copied into new components.
 */
:root,
html[data-theme="light"] {
  --cg-font-ui: "DM Sans", system-ui, sans-serif;
  --cg-font-display: Manrope, sans-serif;
  --cg-font-size-ui: 16px;
  --cg-font-size-control: 15px;
  --cg-font-size-meta: 13px;
  --cg-font-size-heading: 28px;
  --cg-font-size-heading-mobile: 24px;
  --cg-line-body: 1.55;
  --cg-line-compact: 1.45;

  --cg-bg: #F3F5F5;
  --cg-surface: #FFFFFF;
  --cg-surface-subtle: #ECF2F0;
  --cg-surface-elevated: #FFFFFF;
  --cg-nav-bg: #0D1922;
  --cg-border: #D8E1DF;
  --cg-border-strong: #B6C8C2;
  --cg-text-primary: #152923;
  --cg-text-secondary: #49615A;
  --cg-nav-text: #EDF4F2;
  --cg-nav-muted: #B5C8C2;
  --cg-muted: #60756E;
  --cg-primary: #087561;
  --cg-primary-strong: #065C4D;
  --cg-on-primary: #FFFFFF;
  --cg-accent: #62D7B6;

  --cg-success: #08704D;
  --cg-success-bg: #DDF4EB;
  --cg-warning: #8A5A00;
  --cg-warning-bg: #FFF2CC;
  --cg-danger: #A02A3E;
  --cg-danger-bg: #FBE8EC;
  --cg-info: #2D62A5;
  --cg-info-bg: #E6EFFB;
  --cg-focus: #087561;

  --cg-shadow-0: none;
  --cg-shadow-1: 0 1px 2px rgba(21, 41, 35, .06);
  --cg-shadow-2: 0 8px 24px rgba(21, 41, 35, .10);
  --cg-shadow-3: 0 18px 44px rgba(21, 41, 35, .16);
  --cg-blur-0: 0px;
  --cg-blur-8: 8px;

  --cg-radius-control: 8px;
  --cg-radius-card: 12px;
  --cg-radius-overlay: 16px;
  --cg-radius-pill: 999px;

  --cg-space-1: 4px;
  --cg-space-2: 8px;
  --cg-space-3: 12px;
  --cg-space-4: 16px;
  --cg-space-5: 20px;
  --cg-space-6: 24px;
  --cg-space-7: 32px;
  --cg-space-8: 40px;
  --cg-space-9: 48px;
  --cg-space-10: 64px;

  --cg-motion-instant: 0ms;
  --cg-motion-fast: 120ms;
  --cg-motion-base: 180ms;
  --cg-motion-panel: 240ms;
  --cg-motion-slow: var(--cg-motion-panel);
  --cg-motion-entrance: 360ms;
  --cg-easing-standard: cubic-bezier(.2, .8, .2, 1);
  --cg-easing-exit: cubic-bezier(.4, 0, 1, 1);
  --cg-easing: var(--cg-easing-standard);
  --cg-focus-ring: 0 0 0 3px var(--cg-surface), 0 0 0 6px var(--cg-focus);
  --cg-disabled-opacity: .68;
  --cg-touch-target: 44px;

  --cg-z-base: 0;
  --cg-z-nav: 30;
  --cg-z-overlay: 40;
  --cg-z-dropdown: 60;
  --cg-z-modal: 70;
  --cg-z-toast: 80;
}

html[data-theme="dark"] {
  --cg-bg: #0C1219;
  --cg-surface: #131D27;
  --cg-surface-subtle: #172530;
  --cg-surface-elevated: #1D2C39;
  --cg-nav-bg: #091018;
  --cg-border: #2B3A47;
  --cg-border-strong: #415362;
  --cg-text-primary: #EDF4F2;
  --cg-text-secondary: #B5C8C2;
  --cg-nav-text: #EDF4F2;
  --cg-nav-muted: #B5C8C2;
  --cg-muted: #91A8A0;
  --cg-primary: #62D7B6;
  --cg-primary-strong: #82E5C8;
  --cg-on-primary: #08281F;
  --cg-accent: #62D7B6;

  --cg-success: #77E2B7;
  --cg-success-bg: #153D31;
  --cg-warning: #FFD37A;
  --cg-warning-bg: #4C3510;
  --cg-danger: #FF9BAA;
  --cg-danger-bg: #4C202A;
  --cg-info: #9FC4FF;
  --cg-info-bg: #1A334F;
  --cg-focus: #62D7B6;

  --cg-shadow-0: none;
  --cg-shadow-1: 0 1px 2px rgba(0, 0, 0, .20);
  --cg-shadow-2: 0 8px 24px rgba(0, 0, 0, .28);
  --cg-shadow-3: 0 18px 44px rgba(0, 0, 0, .42);
}

/*
 * Compatibility references: app.css remains the owner of the old light
 * palette. These references make the migration boundary explicit without
 * silently changing any legacy page.
 */
:root {
  --cg-legacy-bg: var(--bg);
  --cg-legacy-surface: var(--surface);
  --cg-legacy-surface-subtle: var(--surface-2);
  --cg-legacy-text: var(--text);
  --cg-legacy-muted: var(--muted);
  --cg-legacy-border: var(--line);
  --cg-legacy-primary: var(--primary);
  --cg-legacy-primary-strong: var(--primary-strong);
  --cg-legacy-shadow: var(--shadow);
  --cg-legacy-shadow-lg: var(--shadow-lg);
}

/* LEGACY: global type selectors stay until every consuming page is migrated. */
:root {
  --font-body: var(--cg-font-ui);
  --font-display: var(--cg-font-display);
  --text-xs: 12px;
  --text-sm: 13px;
  --text-control: 15px;
  --text-base: 16px;
  --text-lg: 20px;
  --line-body: 1.55;
  --line-compact: 1.45;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --focus-ring: 0 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent);
}

:where(a, button, input, select, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 70%, #fff);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="light"],
  html[data-theme="dark"] {
    --cg-motion-fast: var(--cg-motion-instant);
    --cg-motion-base: var(--cg-motion-instant);
    --cg-motion-panel: var(--cg-motion-instant);
    --cg-motion-slow: var(--cg-motion-instant);
    --cg-motion-entrance: var(--cg-motion-instant);
  }

  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* LEGACY: existing typography selectors; do not expand this list. */
body {
  font-size: var(--text-base);
  line-height: var(--line-body);
}

body :is(button, input, select, textarea, .button, .nav-link, .tabs a, .segmented a, .profile-dropdown > a, .profile-dropdown form button, .clear-search, .help-card a, .dashboard-clear-filter) {
  font-size: var(--text-control) !important;
}

body :is(label, .label, .form-panel label, .filter-panel label, .support-form label, .support-admin label, .access-log-form label) {
  font-size: var(--text-control) !important;
  line-height: var(--line-compact);
}

body :is(
  small, dt, th, time, .eyebrow, .muted, .error, .help-text, .field-help, .small,
  .nav-section, .nav-count, .tenant-chevron, .tenant-switcher strong, .profile-mini strong, .topbar-breadcrumb, .topbar-icon b, .topbar-profile span,
  .kpi span, .status, .tile-label, .profile-meta, .form-section-title, .selection-hint, .form-error,
  .summary-card em, .toolbar-count, .segmented a b, .tour-card-kicker, .tour-card p, .tour-card-actions > button:first-child,
  .quick-period span, .quick-period a, .priority-panel p, .priority-list em,
  .vehicle-overview p, .vehicle-search label > span, .vehicle-location, .vehicle-card-foot, .vehicle-empty p, .vehicle-specs,
  .help-card p, .faq details p, .shortcut, .vehicle-workspace-head p:not(.eyebrow),
  .help-section-heading p:not(.eyebrow), .help-tour-card > b, .help-workflow > div > p:not(.eyebrow),
  .help-workflow li > b, .help-workflow li strong, .help-support strong, .help-support p,
  .testimonials .testimonial p, .profile-card > p, .profile-card dd, .vehicle-status,
  .vehicle-status-reason p, .access-log-row p, .infinite-loading, .pulse-list em,
  .support-ticket-row strong, .support-empty p, .support-message p
) {
  font-size: var(--text-sm) !important;
  line-height: var(--line-compact);
}

[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after {
  font-size: var(--text-sm) !important;
  line-height: var(--line-compact);
}