/* ============================================================
   Turnero Theme — Bootstrap 5 CSS Variable Overrides
   Color Palette:
     #272643  → Dark navy    (--bs-dark)
     #ffffff  → White        (keep)
     #e3f6f5  → Light teal   (--bs-light)
     #bae8e8  → Light teal   (--bs-info)
     #2c698d  → Blue-teal    (--bs-primary)
   ============================================================ */

:root {
    /* ── Primary: #2c698d ─────────────────────────────── */
    --bs-primary: #2c698d;
    --bs-primary-rgb: 44, 105, 141;
    --bs-primary-text-emphasis: #1e4a63;
    --bs-primary-bg-subtle: #d4e8f0;
    --bs-primary-border-subtle: #a9d1e1;

    /* ── Info: #bae8e8 ────────────────────────────────── */
    --bs-info: #bae8e8;
    --bs-info-rgb: 186, 232, 232;
    --bs-info-text-emphasis: #0e6b6b;
    --bs-info-bg-subtle: #e6f9f9;
    --bs-info-border-subtle: #bae8e8;

    /* ── Light: #e3f6f5 ───────────────────────────────── */
    --bs-light: #e3f6f5;
    --bs-light-rgb: 227, 246, 245;
    --bs-light-text-emphasis: #1e4a63;
    --bs-light-bg-subtle: #f2fcfb;
    --bs-light-border-subtle: #c8edec;

    /* ── Dark: #272643 ────────────────────────────────── */
    --bs-dark: #272643;
    --bs-dark-rgb: 39, 38, 67;
    --bs-dark-text-emphasis: #e3f6f5;
    --bs-dark-bg-subtle: #3a3960;
    --bs-dark-border-subtle: #4d4c7d;

    /* ── Link colors ──────────────────────────────────── */
    --bs-link-color: #2c698d;
    --bs-link-hover-color: #1e4a63;

    /* ── Transition speed ─────────────────────────────── */
    --turnero-transition: 0.2s ease-in-out;
}

/* ── Buttons ─────────────────────────────────────────── */

/* btn-primary */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #2c698d;
    --bs-btn-border-color: #2c698d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #255978;
    --bs-btn-hover-border-color: #235471;
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1e4a63;
    --bs-btn-active-border-color: #1c455d;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #2c698d;
    --bs-btn-disabled-border-color: #2c698d;
    --bs-btn-border-radius: 1.5rem;
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition),
                box-shadow var(--turnero-transition);
}

/* btn-outline-primary */
.btn-outline-primary {
    --bs-btn-color: #2c698d;
    --bs-btn-border-color: #2c698d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2c698d;
    --bs-btn-hover-border-color: #2c698d;
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2c698d;
    --bs-btn-active-border-color: #2c698d;
    --bs-btn-disabled-color: #2c698d;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #2c698d;
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition),
                box-shadow var(--turnero-transition);
}

/* btn-info — lighter teal */
.btn-info {
    --bs-btn-color: #1e4a63;
    --bs-btn-bg: #bae8e8;
    --bs-btn-border-color: #bae8e8;
    --bs-btn-hover-color: #1e4a63;
    --bs-btn-hover-bg: #a4dcdc;
    --bs-btn-hover-border-color: #96d4d4;
    --bs-btn-active-color: #1e4a63;
    --bs-btn-active-bg: #96d4d4;
    --bs-btn-active-border-color: #88cccc;
    --bs-btn-border-radius: 1.5rem;
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition),
                box-shadow var(--turnero-transition);
}

/* btn-outline-info */
.btn-outline-info {
    --bs-btn-color: #0e6b6b;
    --bs-btn-border-color: #bae8e8;
    --bs-btn-hover-color: #1e4a63;
    --bs-btn-hover-bg: #bae8e8;
    --bs-btn-hover-border-color: #bae8e8;
    --bs-btn-active-color: #1e4a63;
    --bs-btn-active-bg: #bae8e8;
    --bs-btn-active-border-color: #bae8e8;
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition),
                box-shadow var(--turnero-transition);
}

/* ── Navbar ──────────────────────────────────────────── */
.navbar.bg-light {
    background-color: #e3f6f5 !important;
}

/* ── Nav links ────────────────────────────────────────── */
.nav-link {
    color: #272643;
    transition: color var(--turnero-transition);
}
.nav-link:hover,
.nav-link:focus {
    color: #2c698d;
}

/* ── Dropdown items ──────────────────────────────────── */
.dropdown-item {
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition);
}
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #e3f6f5;
    color: #272643;
}
.dropdown-item.active,
.dropdown-item:active {
    background-color: #2c698d;
    color: #fff;
}

/* ── Pagination ──────────────────────────────────────── */
.page-link {
    color: #2c698d;
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition);
}
.page-link:hover {
    color: #1e4a63;
}
.active > .page-link,
.page-link.active {
    background-color: #2c698d;
    border-color: #2c698d;
    color: #fff;
}

/* ── Nav pills ───────────────────────────────────────── */
.nav-pills .nav-link {
    transition: color var(--turnero-transition),
                background-color var(--turnero-transition),
                border-color var(--turnero-transition);
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: #fff;
    background-color: #2c698d;
    border-color: #2c698d;
}

/* ── Badges ──────────────────────────────────────────── */
.badge.bg-info {
    color: #1e4a63;
}
.badge.bg-light {
    color: #272643;
}
.badge.bg-dark {
    color: #e3f6f5;
}

/* ── Table ───────────────────────────────────────────── */
.table-light {
    --bs-table-bg: #e3f6f5;
    --bs-table-striped-bg: #d8efee;
    --bs-table-striped-color: #272643;
    --bs-table-active-bg: #c8edec;
    --bs-table-hover-bg: #d8efee;
    color: #272643;
}

/* ── Progress bars ───────────────────────────────────── */
.bg-primary {
    background-color: #2c698d !important;
}
.bg-info {
    background-color: #bae8e8 !important;
}
.bg-light {
    background-color: #e3f6f5 !important;
}
.bg-dark {
    background-color: #272643 !important;
}

/* ── Text colors ─────────────────────────────────────── */
.text-primary {
    color: #2c698d !important;
}
.text-info {
    color: #1c7a7a !important;
}
.text-dark {
    color: #272643 !important;
}
.text-light {
    color: #e3f6f5 !important;
}

/* ── Border colors ───────────────────────────────────── */
.border-primary {
    border-color: #2c698d !important;
}
.border-info {
    border-color: #bae8e8 !important;
}
.border-light {
    border-color: #e3f6f5 !important;
}
.border-dark {
    border-color: #272643 !important;
}

/* ── Alerts ──────────────────────────────────────────── */
.alert-primary {
    --bs-alert-color: #1e4a63;
    --bs-alert-bg: #d4e8f0;
    --bs-alert-border-color: #a9d1e1;
}
.alert-info {
    --bs-alert-color: #0e6b6b;
    --bs-alert-bg: #e6f9f9;
    --bs-alert-border-color: #bae8e8;
}
.alert-light {
    --bs-alert-color: #272643;
    --bs-alert-bg: #f2fcfb;
    --bs-alert-border-color: #c8edec;
}
.alert-dark {
    --bs-alert-color: #e3f6f5;
    --bs-alert-bg: #3a3960;
    --bs-alert-border-color: #4d4c7d;
}

/* ── Cards ───────────────────────────────────────────── */
.card.bg-primary {
    color: #fff;
}
.card.bg-info {
    color: #1e4a63;
}
.card.bg-light {
    color: #272643;
}
.card.bg-dark {
    color: #e3f6f5;
}

/* ── List group ──────────────────────────────────────── */
.list-group-item-primary {
    color: #1e4a63;
    background-color: #d4e8f0;
}
.list-group-item-info {
    color: #0e6b6b;
    background-color: #e6f9f9;
}
.list-group-item-light {
    color: #272643;
    background-color: #f2fcfb;
}
.list-group-item-dark {
    color: #e3f6f5;
    background-color: #3a3960;
}

/* ── Button-close filter for dark backgrounds ────────── */
.btn-close-white {
    filter: invert(1) grayscale(100%) brightness(200%);
}
