/* ==========================================================================
   Design Tokens — Concentio Website
   Shared palette with admin + marketing-specific sizing
   ========================================================================== */

:root {
    /* Brand */
    --brand-50:  #eef2f9;
    --brand-100: #d4ddef;
    --brand-200: #a9bbe0;
    --brand-500: #2d4f8e;
    --brand-600: #1f376b;
    --brand-700: #162850;

    /* Neutral */
    --neutral-50:  #f9fafb;
    --neutral-100: #f3f4f6;
    --neutral-200: #e5e7eb;
    --neutral-300: #d1d5db;
    --neutral-400: #9ca3af;
    --neutral-500: #6b7280;
    --neutral-600: #4b5563;
    --neutral-700: #374151;
    --neutral-800: #1f2937;
    --neutral-900: #111827;
    --neutral-950: #030712;

    /* Semantic */
    --success-50:  #f0fdf4;
    --success-500: #22c55e;
    --success-600: #16a34a;

    --warning-50:  #fffbeb;
    --warning-500: #f59e0b;

    --danger-50:  #fef2f2;
    --danger-500: #ef4444;

    /* Radius */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;

    /* Shadow */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);

    /* Bootstrap overrides */
    --bs-body-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-body-color: var(--neutral-800);
    --bs-body-bg: #ffffff;
    --bs-border-color: var(--neutral-200);
    --bs-border-radius: var(--radius-md);
    --bs-link-color: var(--brand-600);
    --bs-link-hover-color: var(--brand-700);
    --bs-primary: var(--brand-600);
    --bs-primary-rgb: 31, 55, 107;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

:focus-visible {
    outline: 2px solid var(--brand-500);
    outline-offset: 2px;
}

.btn-primary {
    --bs-btn-bg: #1f376b;
    --bs-btn-border-color: #1f376b;
    --bs-btn-hover-bg: #162850;
    --bs-btn-hover-border-color: #162850;
    --bs-btn-active-bg: #162850;
    --bs-btn-active-border-color: #162850;
    --bs-btn-focus-shadow-rgb: 31, 55, 107;
    background-color: var(--bs-btn-bg);
    border-color: var(--bs-btn-border-color);
}

.btn-primary:hover {
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
}

.btn-outline-primary {
    --bs-btn-color: #1f376b;
    --bs-btn-border-color: #1f376b;
    --bs-btn-hover-bg: #1f376b;
    --bs-btn-hover-border-color: #1f376b;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #162850;
    --bs-btn-active-border-color: #162850;
    color: var(--bs-btn-color);
    border-color: var(--bs-btn-border-color);
}

.btn-outline-primary:hover {
    background-color: var(--bs-btn-hover-bg);
    border-color: var(--bs-btn-hover-border-color);
    color: var(--bs-btn-hover-color);
}

/* Links */
a {
    color: var(--brand-600);
}
a:hover {
    color: var(--brand-700);
}

/* Badge & background utilities */
.bg-primary {
    background-color: #1f376b !important;
}
.text-primary {
    color: #1f376b !important;
}
.border-primary {
    border-color: #1f376b !important;
}
