/* ==========================================================================
   med27 Design System — tokens globais
   Fonte única de paleta, tipografia, elevação e aliases do sistema.
   Carregar ANTES de style.css, site.css, clinic-saas.css, login.css.
   O Tailwind (css/tailwind.css) é a camada visual padrão do app (por último, antes do tema).
   ========================================================================== */

:root {
  /* ——— Primary — Deep Medical Teal ——— */
  --med27-primary-950: #022f2d;
  --med27-primary-900: #043c39;
  --med27-primary-800: #07514c;
  --med27-primary-700: #08665e;
  --med27-primary-600: #0b7a70;
  --med27-primary-500: #169486;
  --med27-primary: #043c39;

  /* ——— Accent — Mint ——— */
  --med27-accent-700: #269b87;
  --med27-accent-600: #35ad98;
  --med27-accent-500: #55c5ae;
  --med27-accent-400: #75d3be;
  --med27-accent-300: #a1e1d3;
  --med27-accent-200: #c9eee6;
  --med27-accent-100: #e8f7f3;
  --med27-accent-50: #f3fbf9;
  --med27-accent: #55c5ae;

  /* ——— Neutros ——— */
  --med27-white: #ffffff;
  --med27-background: #f8faf9;
  --med27-surface: #ffffff;
  --med27-surface-soft: #f2f6f5;
  --med27-gray-50: #f8faf9;
  --med27-gray-100: #f0f4f3;
  --med27-gray-200: #e1e8e6;
  --med27-gray-300: #cad5d2;
  --med27-gray-400: #98aaa6;
  --med27-gray-500: #687c78;
  --med27-gray-600: #4c605c;
  --med27-gray-700: #344743;
  --med27-gray-800: #20332f;
  --med27-gray-900: #122521;

  /* ——— Texto ——— */
  --med27-text-primary: #122521;
  --med27-text-secondary: #4c605c;
  --med27-text-muted: #7c908b;
  --med27-text-on-primary: #ffffff;

  /* ——— Semânticos (não usar o verde institucional) ——— */
  --med27-success: #16805d;
  --med27-warning: #d99a32;
  --med27-danger: #c94b4b;
  --med27-info: #397d9f;

  /* ——— Gradiente da marca (branding somente) ——— */
  --med27-brand-gradient: linear-gradient(
    135deg,
    #a1e1d3 0%,
    #55c5ae 35%,
    #169486 68%,
    #07514c 100%
  );

  /* ——— Elevação, raio, foco ——— */
  --med27-radius: 12px;
  --med27-radius-sm: 8px;
  --med27-radius-lg: 16px;
  --med27-shadow:
    0 1px 2px rgba(18, 37, 33, 0.03),
    0 4px 12px rgba(18, 37, 33, 0.04);
  --med27-shadow-sm: 0 1px 2px rgba(18, 37, 33, 0.04);
  --med27-focus-ring: 0 0 0 3px rgba(22, 148, 134, 0.1);
  --med27-font:
    Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* ——— Sidebar / header ——— */
  --med27-sidebar-bg: #16615a;
  --med27-sidebar-bg: color-mix(in srgb, var(--med27-primary-700) 78%, var(--med27-accent) 22%);
  --med27-sidebar-bg-deep: #0e4b46;
  --med27-sidebar-hover: rgba(161, 225, 211, 0.14);
  --med27-sidebar-active: rgba(85, 197, 174, 0.2);
  --med27-header-bg: var(--med27-white);
  --med27-header-border: var(--med27-gray-200);

  /* ========== Aliases do sistema (não espalhar HEX) ========== */
  --primary-color: var(--med27-primary);
  --primary-hover: var(--med27-primary-800);
  --primary-dark: var(--med27-primary-950);
  --primary-light: var(--med27-primary-600);
  --primary-lighter: var(--med27-primary-500);
  --primary-gradient: var(--med27-primary);
  --primary-gradient-light: var(--med27-primary-600);

  --secondary-color: var(--med27-gray-500);
  --secondary-hover: var(--med27-gray-600);
  --secondary-light: var(--med27-gray-400);
  --secondary-dark: var(--med27-gray-700);

  --success-color: var(--med27-success);
  --success-hover: #0f6a4c;
  --success-light: #1a9a70;
  --success-bg: var(--med27-accent-50);

  --danger-color: var(--med27-danger);
  --danger-hover: #b03e3e;
  --danger-light: #d45c5c;
  --danger-bg: #fbeaea;

  --warning-color: var(--med27-warning);
  --warning-hover: #c48728;
  --warning-light: #e0ae4a;
  --warning-bg: #fbf4e6;

  --info-color: var(--med27-info);
  --info-hover: #2f6d8a;
  --info-light: #4d93b3;
  --info-bg: #e8f2f6;

  --light-color: var(--med27-gray-50);
  --dark-color: var(--med27-gray-900);

  --text-primary: var(--med27-text-primary);
  --text-secondary: var(--med27-text-secondary);
  --text-muted: var(--med27-text-muted);
  --text-disabled: var(--med27-gray-400);
  --text-white: var(--med27-text-on-primary);
  --text-dark: var(--med27-gray-800);
  --text-light: var(--med27-gray-50);
  --text-inverse: var(--med27-text-on-primary);

  --bg-body: var(--med27-background);
  --bg-white: var(--med27-surface);
  --bg-light: var(--med27-surface-soft);
  --bg-lighter: var(--med27-white);
  --bg-dark: var(--med27-gray-800);
  --bg-darker: var(--med27-gray-900);
  --bg-card: var(--med27-surface);
  --bg-hover: var(--med27-gray-50);
  --bg-active: var(--med27-gray-100);

  --border-color: var(--med27-gray-300);
  --border-color-light: var(--med27-gray-200);
  --border-color-dark: var(--med27-gray-400);
  --border-color-focus: var(--med27-primary-500);
  --border-radius: var(--med27-radius-sm);
  --border-radius-sm: 0.375rem;
  --border-radius-lg: var(--med27-radius);
  --border-radius-xl: var(--med27-radius-lg);

  --font-family-base: var(--med27-font);
  --font-family-heading: var(--med27-font);

  --ds-font: var(--med27-font);
  --ds-icon-accent: var(--med27-primary);
  --ds-icon-color: var(--med27-primary);
  --ds-focus-ring: var(--med27-focus-ring);
  --ds-focus-border-color: var(--med27-primary-500);
  --ds-card-radius: var(--med27-radius);
  --ds-card-header-bg: var(--med27-surface-soft);
  --ds-card-border: 1px solid var(--med27-gray-200);
  --ds-input-border: 1px solid var(--med27-gray-300);
  --ds-btn-radius: var(--med27-radius-sm);

  --sidebar-bg: var(--med27-sidebar-bg);
  --sidebar-bg-solid: var(--med27-sidebar-bg);
  --sidebar-link: rgba(255, 255, 255, 0.82);
  --sidebar-link-hover-bg: var(--med27-sidebar-hover);
  --sidebar-link-active: var(--med27-sidebar-active);
  --sidebar-border: rgba(255, 255, 255, 0.08);
  --accent-primary: var(--med27-primary);
  --accent-secondary: var(--med27-accent);

  --clinic-teal: var(--med27-primary-500);
  --clinic-teal-dark: var(--med27-primary-700);
  --clinic-teal-soft: var(--med27-accent-100);
  --clinic-slate-900: var(--med27-gray-900);
  --clinic-slate-700: var(--med27-gray-700);
  --clinic-slate-600: var(--med27-gray-600);
  --clinic-slate-500: var(--med27-gray-500);
  --clinic-border: var(--med27-gray-200);
  --clinic-border-strong: var(--med27-gray-300);
  --clinic-shadow-xs: var(--med27-shadow-sm);
  --clinic-shadow-sm: var(--med27-shadow);
  --clinic-radius: var(--med27-radius);
  --clinic-radius-sm: var(--med27-radius-sm);
  --action-primary: var(--med27-primary);
  --action-primary-hover: var(--med27-primary-800);
  --action-primary-soft: var(--med27-accent-100);

  --site-primary: var(--med27-primary);
  --site-primary-dark: var(--med27-primary-800);
  --site-primary-soft: var(--med27-accent-100);
  --site-accent: var(--med27-accent);
  --site-text: var(--med27-text-primary);
  --site-text-muted: var(--med27-text-secondary);
  --site-bg: var(--med27-white);
  --site-bg-soft: var(--med27-background);
  --site-border: var(--med27-gray-200);
  --site-font: var(--med27-font);
  --site-font-display: var(--med27-font);
  --site-shadow: var(--med27-shadow);
  --site-radius: var(--med27-radius);

  --login-accent: var(--med27-primary);
  --login-accent-strong: var(--med27-primary-800);
  --login-accent-soft: var(--med27-accent-100);

  --shadow-xs: var(--med27-shadow-sm);
  --shadow-sm: var(--med27-shadow-sm);
  --shadow: var(--med27-shadow);
  --shadow-md: var(--med27-shadow);
  --shadow-lg: 0 8px 24px rgba(18, 37, 33, 0.08);
  --box-shadow: var(--med27-shadow);
  --box-shadow-lg: var(--med27-shadow);

  /* Bootstrap 5.3 — alinha btn-primary, links e focus */
  --bs-primary: #043c39;
  --bs-primary-rgb: 4, 60, 57;
  --bs-primary-text-emphasis: #022f2d;
  --bs-primary-bg-subtle: #e8f7f3;
  --bs-primary-border-subtle: #c9eee6;
  --bs-link-color: #043c39;
  --bs-link-color-rgb: 4, 60, 57;
  --bs-link-hover-color: #07514c;
  --bs-link-hover-color-rgb: 7, 81, 76;
  --bs-focus-ring-color: rgba(22, 148, 134, 0.25);
  --bs-body-font-family: var(--med27-font);
  --bs-body-color: #122521;
  --bs-body-bg: #f8faf9;
  --bs-border-color: #e1e8e6;
  --bs-secondary-color: #4c605c;
  --bs-tertiary-bg: #f2f6f5;
  --bs-body-bg-rgb: 248, 250, 249;
  --bs-secondary-bg: #f2f6f5;
}

html[data-theme="dark"] {
  --med27-background: #0e1a18;
  --med27-surface: #152422;
  --med27-surface-soft: #1a2e20;
  --med27-text-primary: #f3faf8;
  --med27-text-secondary: #c5d4d0;
  --med27-text-muted: #98aaa6;
  --primary-color: var(--med27-accent-400);
  --primary-hover: var(--med27-accent-300);
  --primary-light: var(--med27-accent-400);
  --border-color-focus: var(--med27-accent-400);
  --clinic-teal: var(--med27-accent-400);
  --clinic-teal-dark: var(--med27-accent-300);
  --clinic-teal-soft: rgba(85, 197, 174, 0.14);
  --action-primary: var(--med27-accent-400);
  --action-primary-hover: var(--med27-accent-300);
  --med27-sidebar-bg: #0f3f3c;
  --med27-sidebar-bg-deep: #0a3230;
  --sidebar-bg: var(--med27-sidebar-bg);
  --sidebar-bg-solid: var(--med27-sidebar-bg);
  --bs-primary: #75d3be;
  --bs-primary-rgb: 117, 211, 190;
  --bs-link-color: #75d3be;
  --bs-link-hover-color: #a1e1d3;
}
