:root {
    /* ---- Header ---- */
    --header-primary: #0e1726;
    /* ---- Brand Colors ---- */
    --color-primary: #0057b8;
    --color-primary-btn: #0b5dba;
    --color-primary-dark: #02152f;
    /* ---- Text ---- */
    --color-text: #1d1d1d;
    --color-text-muted: #565860;
    --color-black: #12141c;
    --color-white: #ffffff;
    --color-light-text: #f2f2f4;
    --color-form-bg: #fafafa;
    /* ---- Backgrounds ---- */
    --color-secondary: #f4f4f4;
    --service-background: #f2f2f4;
    --invoice-background: #fcfcfc;
    --color-icon-bg: #e6e7ea;
    --color-dark-card: #33353d;
    --color-hero-gradient: #002d62;
    --color-sidebar-bg: #fffaec;
    /* ---- Borders ---- */
    --border-muted: #d6d7db;
    --invoice-border: #cccdd3;
    --color-border: #d8d8d8;
    --color-border-hover: #9ca3af;
    --color-link-border: #b2b4bc;
    --color-sidebar-border: #705300;
    --color-form-border: #72747c;
    --color-step-inactive: #b2b4bc;
    --color-step-line: #d9d9d9;
    /* ---- Sidebar Statistics ---- */
    --color-sidebar-text: #705300;
    --color-sidebar-label: #4f4320;
    --color-sidebar-heading: #1a1400;
    --color-sidebar-divider: rgba(112, 83, 0, 0.2);
    /* ---- Buttons ---- */
    --button-primary: #d1e3f7;
    --button-text-primary: #073d79;
    /* ---- Focus, Errors & Status ---- */
    --color-focus: #005fcc;
    --color-focus-form: #1a73e8;
    --color-error: #d32f2f;
    --color-required: #d32f2f;
    --color-success: #1a7a1a;
    --color-text-secondary: #3e4048;
    /* ---- Container ---- */
    --container-width: 1200px;
    /* ---- Font ---- */
    --font-family: 'Inter', sans-serif;
    /* ---- Shadow ---- */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-login-card: 0px 1px 4px rgba(0, 0, 0, 0.16), 0px 4px 12px 2px rgba(0, 0, 0, 0.32);
    /* ---- Transition ---- */
    --transition: 0.3s ease;
    /* ---- Login / Tooltip ---- */
    --color-tooltip-bg: #23252d;
    --color-login-btn-text: #f7fafe;
    --login-card-max-width: 432px;
    /* ---- Forgot Password ---- */
    --shadow-forgot-card: 0px 2px 14px rgba(0, 0, 0, 0.17);
    --color-forgot-card-border: #d6d7db;
    --color-alert-bg: #d70b13;
    --color-alert-text: #fef7f8;
    /* ---- Radius ---- */
    --radius-sm: 4px;
    /* ---- Font Weights ---- */
    --weight-medium: 500;
    /* ---- Alert Variants ---- */
    --color-alert-danger-bg: #FEF2F2;
    --color-alert-danger-border: #FECACA;
    --color-alert-danger-text: #d32f2f;
    /* ---- Destructive button (remove rows) — light pink, not the same as alert banners ---- */
    --color-destructive-bg: #FEF2F2;
    --color-destructive-border: #FECACA;
    --color-destructive-text: #d32f2f;
    --color-alert-success-bg: #00755C;
    --color-alert-success-border: #00755C;
    --color-alert-success-text: #F2F2F4;
    --color-alert-warning-bg: #FFFBEB;
    --color-alert-warning-border: #FDE68A;
    --color-alert-warning-text: #92400E;
    /* ---- Pending Info Banner ---- */
    --color-pending-bg: #EFF6FF;
    --color-pending-border: #BFDBFE;
    --color-pending-text: #1E40AF;
    /* ---- Phone Badge ---- */
    --color-phone-badge-bg: #FEF9C3;
    --color-phone-badge-border: #FDE047;
    --color-phone-badge-text: #713F12;
    --color-phone-badge-dismiss-hover: #78350F;
    /* ---- Shadows ---- */
    --shadow-tooltip: 0 8px 24px rgba(0, 0, 0, 0.32);
    --shadow-card-mobile: 0px 1px 4px rgba(0, 0, 0, 0.12);
    /* ---- Dropdown / Select ---- */
    --color-dropdown-bg: #FCFCFC;
    --color-dropdown-border: #CCCDD3;
    --shadow-dropdown: 0px 1px 4px rgba(0, 0, 0, 0.16), 0px 1px 4px rgba(0, 0, 0, 0.16);
    --radius-dropdown: 12px;
    --color-dropdown-item-hover-bg: rgba(0, 0, 0, 0.06);
    --color-dropdown-item-selected-bg: rgba(0, 0, 0, 0.10);
    --color-dropdown-item-text: #12141C;
    --dropdown-item-height: 40px;
}