@charset "UTF-8";
/*!
 * Replace Bootstrap colors
 * Wanted color bs-primary-rgb: 202,68,74;
 * #ca444a
 */


:root,
[data-bs-theme=light] {
    --bs-blue: #4f73a8;
    --bs-indigo: #5a61ac;
    --bs-purple: #676fc9;
    --bs-pink: #c05f85;
    --bs-red: #ca444a;
    --bs-orange: #c8743a;
    --bs-yellow: #c9ad4d;
    --bs-green: #6da45b;
    --bs-teal: #3aa39a;
    --bs-cyan: #5aaec4;
    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: var(--bs-blue);
    --bs-secondary: #8a8875;
    --bs-success: var(--bs-green);
    --bs-info: var(--bs-cyan);
    --bs-warning: var(--bs-red);
    --bs-danger: var(--bs-red);
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 202,68,74;
    --bs-secondary-rgb: 138, 136, 117;
    --bs-success-rgb: var(--pc-green-rgb);
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: var(--pc-red-rgb);
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-primary-text-emphasis: #052c65;
    --bs-secondary-text-emphasis: #2b2f32;
    --bs-success-text-emphasis: #0a3622;
    --bs-info-text-emphasis: #055160;
    --bs-warning-text-emphasis: #58151c;
    --bs-danger-text-emphasis: #58151c;
    --bs-light-text-emphasis: #495057;
    --bs-dark-text-emphasis: #495057;
    --bs-primary-bg-subtle: #cfe2ff;
    --bs-secondary-bg-subtle: #efefe8;
    --bs-success-bg-subtle: #d1e7dd;
    --bs-info-bg-subtle: #cff4fc;
    --bs-warning-bg-subtle: #f8d7da;
    --bs-danger-bg-subtle: #f8d7da;
    --bs-light-bg-subtle: #fcfcfd;
    --bs-dark-bg-subtle: #ced4da;
    --bs-primary-border-subtle: #9ec5fe;
    --bs-secondary-border-subtle: #d2d0c5;
    --bs-success-border-subtle: #a3cfbb;
    --bs-info-border-subtle: #9eeaf9;
    --bs-warning-border-subtle: #842029;
    --bs-danger-border-subtle: #f1aeb5;
    --bs-light-border-subtle: #e9ecef;
    --bs-dark-border-subtle: #adb5bd;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg: #e9edf3;
    --bs-body-bg-rgb: 233, 237, 243;
    --bs-emphasis-color: #000;
    --bs-emphasis-color-rgb: 0, 0, 0;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);
    --bs-secondary-color-rgb: 33, 37, 41;
    --bs-secondary-bg: #e9ecef;
    --bs-secondary-bg-rgb: 233, 236, 239;
    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
    --bs-tertiary-color-rgb: 33, 37, 41;
    --bs-tertiary-bg: #f8f9fa;
    --bs-tertiary-bg-rgb: 248, 249, 250;
    --bs-heading-color: inherit;
    --bs-link-color: var(--bs-primary);
    --bs-link-color-rgb: 13, 110, 253;
    --bs-link-decoration: underline;
    --bs-link-hover-color: #a53a3f;
    --bs-link-hover-color-rgb: 10, 88, 202;
    --bs-code-color: #d63384;
    --bs-highlight-color: #212529;
    --bs-highlight-bg: #fff3cd;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
    --bs-border-radius-pill: 50rem;
    --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
    --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    --bs-focus-ring-width: 0.25rem;
    --bs-focus-ring-opacity: 0.25;
    --bs-focus-ring-color: rgba(var(--bs-primary-rgb), 0.25);
    --bs-form-valid-color: #198754;
    --bs-form-valid-border-color: #198754;
    --bs-form-invalid-color: #dc3545;
    --bs-form-invalid-border-color: #dc3545;
    --pc-secondary-600: var(--bs-secondary);
    --pc-secondary-700: color-mix(in srgb, var(--bs-secondary), black 12%);
    --pc-secondary-800: color-mix(in srgb, var(--bs-secondary), black 24%);
}

[data-bs-theme=dark] {
    color-scheme: dark;
    --bs-body-color: #dee2e6;
    --bs-body-color-rgb: 222, 226, 230;
    --bs-body-bg: #212529;
    --bs-body-bg-rgb: 33, 37, 41;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: rgba(222, 226, 230, 0.75);
    --bs-secondary-color-rgb: 222, 226, 230;
    --bs-secondary-bg: #343a40;
    --bs-secondary-bg-rgb: 52, 58, 64;
    --bs-tertiary-color: rgba(222, 226, 230, 0.5);
    --bs-tertiary-color-rgb: 222, 226, 230;
    --bs-tertiary-bg: #2b3035;
    --bs-tertiary-bg-rgb: 43, 48, 53;
    --bs-primary-text-emphasis: #6ea8fe;
    --bs-secondary-text-emphasis: #45443a;
    --bs-success-text-emphasis: #75b798;
    --bs-info-text-emphasis: #6edff6;
    --bs-warning-text-emphasis: #ea868f;
    --bs-danger-text-emphasis: #ea868f;
    --bs-light-text-emphasis: #f8f9fa;
    --bs-dark-text-emphasis: #dee2e6;
    --bs-primary-bg-subtle: #031633;
    --bs-secondary-bg-subtle: #161719;
    --bs-success-bg-subtle: #051b11;
    --bs-info-bg-subtle: #032830;
    --bs-warning-bg-subtle: #2c0b0e;
    --bs-danger-bg-subtle: #2c0b0e;
    --bs-light-bg-subtle: #343a40;
    --bs-dark-bg-subtle: #1a1d20;
    --bs-primary-border-subtle: #084298;
    --bs-secondary-border-subtle: #41464b;
    --bs-success-border-subtle: #0f5132;
    --bs-info-border-subtle: #087990;
    --bs-warning-border-subtle: #842029;
    --bs-danger-border-subtle: #842029;
    --bs-light-border-subtle: #495057;
    --bs-dark-border-subtle: #343a40;
    --bs-heading-color: inherit;
    --bs-link-color: #6ea8fe;
    --bs-link-hover-color: #8bb9fe;
    --bs-link-color-rgb: 110, 168, 254;
    --bs-link-hover-color-rgb: 139, 185, 254;
    --bs-code-color: #e685b5;
    --bs-highlight-color: #dee2e6;
    --bs-highlight-bg: #664d03;
    --bs-border-color: #495057;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
    --bs-form-valid-color: #75b798;
    --bs-form-valid-border-color: #75b798;
    --bs-form-invalid-color: #ea868f;
    --bs-form-invalid-border-color: #ea868f;
    /* Fallback shades for buttons (approx 12% and 24% darker) */
    --pc-secondary-600: var(--bs-secondary);
    --pc-secondary-700: color-mix(in srgb, var(--bs-secondary), black 12%);
    --pc-secondary-800: color-mix(in srgb, var(--bs-secondary), black 24%);
}

.bg-success,
.text-bg-success,
.bg-warning,
.text-bg-warning {
    color: #fff !important;
}


.bs-icon {
    --bs-icon-size: .75rem;
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    font-size: var(--bs-icon-size);
    width: calc(var(--bs-icon-size) * 2);
    height: calc(var(--bs-icon-size) * 2);
    color: var(--bs-primary);
}

.bs-icon-xs {
    --bs-icon-size: 1rem;
    width: calc(var(--bs-icon-size) * 1.5);
    height: calc(var(--bs-icon-size) * 1.5);
}

.bs-icon-sm {
    --bs-icon-size: 1rem;
}

.bs-icon-md {
    --bs-icon-size: 1.5rem;
}

.bs-icon-lg {
    --bs-icon-size: 2rem;
}

.bs-icon-xl {
    --bs-icon-size: 2.5rem;
}

.bs-icon.bs-icon-primary {
    color: var(--bs-white);
    background: var(--bs-primary);
}

.bs-icon.bs-icon-primary-light {
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .2);
}

.bs-icon.bs-icon-semi-white {
    color: var(--bs-primary);
    background: rgba(255, 255, 255, .5);
}

.bs-icon.bs-icon-rounded {
    border-radius: .5rem;
}

.bs-icon.bs-icon-circle {
    border-radius: 50%;
}
/* Primary theme */
:root,
[data-bs-theme="light"] {
    --bs-primary: #ca444a;
    --bs-primary: var(--bs-blue);
    --bs-primary-rgb: var(--pc-blue-rgb);
    /* Links and focus ring aligned to primary */
    --bs-link-color: #ca444a;
    --bs-link-color-rgb: 202, 68, 74;
    --bs-link-hover-color: #a53a3f;
    --bs-link-hover-color-rgb: 165, 58, 63;
    --bs-focus-ring-color: rgba(var(--bs-primary-rgb), 0.25);
}

/* Make Bootstrap button variants use your primary */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-red);
    --bs-btn-border-color: var(--bs-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #b53c41;
    --bs-btn-hover-border-color: #ae393e;
    --bs-btn-focus-shadow-rgb: var(--bs-red-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #a5363b;
    --bs-btn-active-border-color: #9e3338;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-red);
    --bs-btn-disabled-border-color: var(--bs-red);
}

.btn-outline-primary {
    --bs-btn-color: var(--bs-red);
    --bs-btn-border-color: var(--bs-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-red);
    --bs-btn-hover-border-color: var(--bs-red);
    --bs-btn-focus-shadow-rgb: var(--bs-red-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-red);
    --bs-btn-active-border-color: var(--bs-red);
    --bs-btn-disabled-color: var(--bs-red);
    --bs-btn-disabled-border-color: var(--bs-red);
}

/* Make Bootstrap secondary buttons use derived shades */
.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-secondary-600);
    --bs-btn-border-color: var(--pc-secondary-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-secondary-700);
    --bs-btn-hover-border-color: var(--pc-secondary-700);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-secondary-800);
    --bs-btn-active-border-color: var(--pc-secondary-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-secondary-600);
    --bs-btn-disabled-border-color: var(--pc-secondary-600);
}

.btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-hover-border-color: var(--bs-secondary);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-secondary-700);
    --bs-btn-active-border-color: var(--pc-secondary-700);
    --bs-btn-disabled-color: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}

/* Contrast-aware outline on colored backgrounds */
.btn-outline-blue {
    --bs-btn-color: var(--bs-blue);
    --bs-btn-border-color: var(--bs-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-blue);
    --bs-btn-hover-border-color: var(--bs-blue);
    --bs-btn-focus-shadow-rgb: var(--bs-blue-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-blue);
    --bs-btn-active-border-color: var(--bs-blue);
    --bs-btn-disabled-color: var(--bs-blue);
    --bs-btn-disabled-border-color: var(--bs-blue);
}
.btn-outline-red {
    --bs-btn-color: var(--bs-red);
    --bs-btn-border-color: var(--bs-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-red);
    --bs-btn-hover-border-color: var(--bs-red);
    --bs-btn-focus-shadow-rgb: var(--bs-red-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-red);
    --bs-btn-active-border-color: var(--bs-red);
    --bs-btn-disabled-color: var(--bs-red);
    --bs-btn-disabled-border-color: var(--bs-red);
}
.btn-outline-light {
    /* Switch to a mid gray for visibility on white */
    --bs-btn-color: var(--bs-gray-700);
    --bs-btn-border-color: var(--bs-gray-300);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-gray-600);
    --bs-btn-hover-border-color: var(--bs-gray-600);
    --bs-btn-focus-shadow-rgb: var(--bs-gray-300);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-gray-700);
    --bs-btn-active-border-color: var(--bs-gray-700);
    --bs-btn-disabled-color: var(--bs-gray-400);
    --bs-btn-disabled-border-color: var(--bs-gray-300);
}



/* Background utilities for base palette */
.bg-blue {
    background-color: var(--bs-blue) !important;
    color: #fff !important;
}

.bg-indigo {
    background-color: var(--bs-indigo) !important;
    color: #fff !important;
}

.bg-purple {
    background-color: var(--bs-purple) !important;
    color: #fff !important;
}

.bg-pink {
    background-color: var(--bs-pink) !important;
    color: #fff !important;
}

.bg-red {
    background-color: var(--bs-red) !important;
    color: #fff !important;
}

.bg-orange {
    background-color: var(--bs-orange) !important;
    color: #fff !important;
}

.bg-yellow {
    background-color: var(--bs-yellow) !important;
    color: #212529 !important;
}
/* better contrast */
.bg-green {
    background-color: var(--bs-green) !important;
    color: #fff !important;
}

.bg-teal {
    background-color: var(--bs-teal) !important;
    color: #fff !important;
}

.bg-cyan {
    background-color: var(--bs-cyan) !important;
    color: #fff !important;
}

/* Button variants for each base color using your dusty palette */
/* Derived shades (hover/active) from each base color */
:root,
[data-bs-theme="light"] {
    /* RGB for focus ring */
    --pc-blue-rgb: 79,115,168;
    --pc-indigo-rgb: 90,97,172;
    --pc-purple-rgb: 103,111,201;
    --pc-pink-rgb: 192,95,133;
    --pc-red-rgb: 202,68,74;
    --pc-orange-rgb: 200,116,58;
    --pc-yellow-rgb: 201,173,77;
    --pc-green-rgb: 109,164,91;
    --pc-teal-rgb: 58,163,154;
    --pc-cyan-rgb: 90,174,196;
    /* Shades via color-mix (fallback is the base color) */
    --pc-blue-600: var(--bs-blue);
    --pc-blue-700: color-mix(in srgb, var(--bs-blue), black 12%);
    --pc-blue-800: color-mix(in srgb, var(--bs-blue), black 24%);
    --pc-indigo-600: var(--bs-indigo);
    --pc-indigo-700: color-mix(in srgb, var(--bs-indigo), black 12%);
    --pc-indigo-800: color-mix(in srgb, var(--bs-indigo), black 24%);
    --pc-purple-600: var(--bs-purple);
    --pc-purple-700: color-mix(in srgb, var(--bs-purple), black 12%);
    --pc-purple-800: color-mix(in srgb, var(--bs-purple), black 24%);
    --pc-pink-600: var(--bs-pink);
    --pc-pink-700: color-mix(in srgb, var(--bs-pink), black 12%);
    --pc-pink-800: color-mix(in srgb, var(--bs-pink), black 24%);
    --pc-red-600: var(--bs-red);
    --pc-red-700: color-mix(in srgb, var(--bs-red), black 12%);
    --pc-red-800: color-mix(in srgb, var(--bs-red), black 24%);
    --pc-orange-600: var(--bs-orange);
    --pc-orange-700: color-mix(in srgb, var(--bs-orange), black 12%);
    --pc-orange-800: color-mix(in srgb, var(--bs-orange), black 24%);
    --pc-yellow-600: var(--bs-yellow);
    --pc-yellow-700: color-mix(in srgb, var(--bs-yellow), black 12%);
    --pc-yellow-800: color-mix(in srgb, var(--bs-yellow), black 24%);
    --pc-green-600: var(--bs-green);
    --pc-green-700: color-mix(in srgb, var(--bs-green), black 12%);
    --pc-green-800: color-mix(in srgb, var(--bs-green), black 24%);
    --pc-teal-600: var(--bs-teal);
    --pc-teal-700: color-mix(in srgb, var(--bs-teal), black 12%);
    --pc-teal-800: color-mix(in srgb, var(--bs-teal), black 24%);
    --pc-cyan-600: var(--bs-cyan);
    --pc-cyan-700: color-mix(in srgb, var(--bs-cyan), black 12%);
    --pc-cyan-800: color-mix(in srgb, var(--bs-cyan), black 24%);
}

/* Solid button variants (use with .btn) */
.btn-blue {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-blue-600);
    --bs-btn-border-color: var(--pc-blue-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-blue-700);
    --bs-btn-hover-border-color: var(--pc-blue-700);
    --bs-btn-focus-shadow-rgb: var(--pc-blue-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-blue-800);
    --bs-btn-active-border-color: var(--pc-blue-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-blue-600);
    --bs-btn-disabled-border-color: var(--pc-blue-600);
}


.btn-indigo {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-indigo-600);
    --bs-btn-border-color: var(--pc-indigo-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-indigo-700);
    --bs-btn-hover-border-color: var(--pc-indigo-700);
    --bs-btn-focus-shadow-rgb: var(--pc-indigo-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-indigo-800);
    --bs-btn-active-border-color: var(--pc-indigo-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-indigo-600);
    --bs-btn-disabled-border-color: var(--pc-indigo-600);
}

.btn-purple {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-purple-600);
    --bs-btn-border-color: var(--pc-purple-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-purple-700);
    --bs-btn-hover-border-color: var(--pc-purple-700);
    --bs-btn-focus-shadow-rgb: var(--pc-purple-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-purple-800);
    --bs-btn-active-border-color: var(--pc-purple-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-purple-600);
    --bs-btn-disabled-border-color: var(--pc-purple-600);
}

.btn-pink {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-pink-600);
    --bs-btn-border-color: var(--pc-pink-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-pink-700);
    --bs-btn-hover-border-color: var(--pc-pink-700);
    --bs-btn-focus-shadow-rgb: var(--pc-pink-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-pink-800);
    --bs-btn-active-border-color: var(--pc-pink-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-pink-600);
    --bs-btn-disabled-border-color: var(--pc-pink-600);
}

.btn-red {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-red-600);
    --bs-btn-border-color: var(--pc-red-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-red-700);
    --bs-btn-hover-border-color: var(--pc-red-700);
    --bs-btn-focus-shadow-rgb: var(--pc-red-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-red-800);
    --bs-btn-active-border-color: var(--pc-red-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-red-600);
    --bs-btn-disabled-border-color: var(--pc-red-600);
}

.btn-orange {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-orange-600);
    --bs-btn-border-color: var(--pc-orange-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-orange-700);
    --bs-btn-hover-border-color: var(--pc-orange-700);
    --bs-btn-focus-shadow-rgb: var(--pc-orange-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-orange-800);
    --bs-btn-active-border-color: var(--pc-orange-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-orange-600);
    --bs-btn-disabled-border-color: var(--pc-orange-600);
}

.btn-yellow {
    --bs-btn-color: #212529; /* dark text for contrast */
    --bs-btn-bg: var(--pc-yellow-600);
    --bs-btn-border-color: var(--pc-yellow-600);
    --bs-btn-hover-color: #212529;
    --bs-btn-hover-bg: var(--pc-yellow-700);
    --bs-btn-hover-border-color: var(--pc-yellow-700);
    --bs-btn-focus-shadow-rgb: var(--pc-yellow-rgb);
    --bs-btn-active-color: #212529;
    --bs-btn-active-bg: var(--pc-yellow-800);
    --bs-btn-active-border-color: var(--pc-yellow-800);
    --bs-btn-disabled-color: #212529;
    --bs-btn-disabled-bg: var(--pc-yellow-600);
    --bs-btn-disabled-border-color: var(--pc-yellow-600);
}

.btn-green {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-green-600);
    --bs-btn-border-color: var(--pc-green-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-green-700);
    --bs-btn-hover-border-color: var(--pc-green-700);
    --bs-btn-focus-shadow-rgb: var(--pc-green-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-green-800);
    --bs-btn-active-border-color: var(--pc-green-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-green-600);
    --bs-btn-disabled-border-color: var(--pc-green-600);
}

.btn-teal {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-teal-600);
    --bs-btn-border-color: var(--pc-teal-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-teal-700);
    --bs-btn-hover-border-color: var(--pc-teal-700);
    --bs-btn-focus-shadow-rgb: var(--pc-teal-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-teal-800);
    --bs-btn-active-border-color: var(--pc-teal-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-teal-600);
    --bs-btn-disabled-border-color: var(--pc-teal-600);
}

.btn-cyan {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--pc-cyan-600);
    --bs-btn-border-color: var(--pc-cyan-600);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pc-cyan-700);
    --bs-btn-hover-border-color: var(--pc-cyan-700);
    --bs-btn-focus-shadow-rgb: var(--pc-cyan-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--pc-cyan-800);
    --bs-btn-active-border-color: var(--pc-cyan-800);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--pc-cyan-600);
    --bs-btn-disabled-border-color: var(--pc-cyan-600);
}

.dropdown-menu {
    --bs-dropdown-link-hover-bg: rgba(var(--pc-blue-rgb), .08);
    --bs-dropdown-link-active-bg: var(--pc-blue-700);
    --bs-dropdown-link-active-color: #fff;
}


.form-check-input:checked {
    background-color: var(--bs-green);
    border-color: var(--bs-green);
}

/* Green focus ring for checks */
.form-check-input:focus {
    border-color: var(--bs-green);
    box-shadow: 0 0 0 .25rem rgba(var(--pc-green-rgb), .25);
}

/* Ensure switch uses same green (unifies with site.css) */
.form-switch .form-check-input:checked {
    background-color: var(--bs-green);
    border-color: var(--bs-green);
}

/* Make Bootstrap Icons “check” glyphs green everywhere */
.bi-check,
.bi-check2,
.bi-check-lg,
.bi-check-circle,
.bi-check-circle-fill,
.bi-check-square,
.bi-check-square-fill,
.bi-check-all {
    color: var(--bs-green) !important;
}

/* Inside badges, icons must inherit the badge text color for contrast */
.badge .bi-check,
.badge .bi-check2,
.badge .bi-check-lg,
.badge .bi-check-circle,
.badge .bi-check-circle-fill,
.badge .bi-check-square,
.badge .bi-check-square-fill,
.badge .bi-check-all {
    color: inherit !important;
}

/* Optional: align validation green to theme green */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-form-valid-color: var(--bs-green);
    --bs-form-valid-border-color: var(--bs-green);
}

/* Slider color = brand green (changed from yellow) */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --pc-slider: var(--bs-green);
    --pc-slider-rgb: var(--pc-green-rgb);
}

input[type="range"],
.form-range {
    accent-color: var(--pc-slider);
}

.form-range {
    --bs-form-range-thumb-bg: var(--pc-slider);
    --bs-form-range-thumb-active-bg: color-mix(in srgb, var(--pc-slider), black 12%);
    --bs-form-range-thumb-focus-box-shadow: 0 0 0 .25rem rgba(var(--pc-slider-rgb), .25);
    --bs-form-range-track-bg: rgba(var(--pc-slider-rgb), .25);
    --bs-form-range-thumb-disabled-bg: rgba(var(--pc-slider-rgb), .5);
}

input[type="range"]::-webkit-slider-thumb {
    background-color: var(--pc-slider);
    border: none;
}

input[type="range"]::-webkit-slider-runnable-track {
    background: rgba(var(--pc-slider-rgb), .35);
}

input[type="range"]::-moz-range-thumb {
    background-color: var(--pc-slider);
    border: none;
}

input[type="range"]::-moz-range-track {
    background: rgba(var(--pc-slider-rgb), .35);
}

input[type="range"]::-moz-range-progress {
    background-color: var(--pc-slider);
}

/* Base styling shared by all alerts */
.alert {
    position: relative;
    display: block;
    padding: 3rem 1.2rem 1rem; /* enough space for icon + line */
    border-width: 2px;
    border-style: dashed;
    border-radius: 6px;
    font-size: 0.95rem;
}

    /* Icon (above text) */
    .alert::before {
        font-family: "bootstrap-icons";
        font-size: 1.6rem;
        line-height: 1;
        position: absolute;
        top: 0.6rem;
        left: 50%;
        transform: translateX(-50%);
    }

    /* Divider line between icon and text */
    .alert::after {
        content: "";
        position: absolute;
        top: 2.7rem; /* increased from ~2.3rem → adds space */
        left: 50%;
        transform: translateX(-50%);
        width: 70%;
        border-top: 1px solid currentColor;
        opacity: 0.55;
    }

/* DANGER */
.alert-danger {
    background-color: #F3DAD8;
    border-color: var(--bs-red);
    color: var(--bs-red);
}

    .alert-danger::before {
        content: "\F628";
    }

/* WARNING */
.alert-warning {
    background-color: #F4EED4;
    border-color: var(--bs-yellow);
    color: var(--bs-yellow);
}

    .alert-warning::before {
        content: "\F33B";
    }

/* SUCCESS */
.alert-success {
    background-color: #D6E7D1;
    border-color: var(--bs-green);
    color: var(--bs-green);
}

    .alert-success::before {
        content: "\F26B";
    }

/* INFO */
.alert-info {
    background-color: #D3DFEF;
    border-color: var(--bs-blue);
    color: var(--bs-blue);
}

    .alert-info::before {
        content: "\F430";
    }

/* Glassy look */
/* === Glassmorphism base === */
.glass-panel {
    background: rgba(255, 255, 255, 0.16);
    border-radius: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.25) inset;
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
}

/* Dark theme variant */
[data-bs-theme="dark"] .glass-panel {
    background: rgba(15, 15, 15, 0.28);
    border-color: rgba(255, 255, 255, 0.18);
}

.bg-primary {
    background: linear-gradient( 145deg, rgba(var(--pc-blue-rgb), 0.85), rgba(var(--pc-red-rgb), 0.9) ) !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(255, 255, 255, 0.18) inset;
}

/* Glassy primary background for big blocks (AdventureConfig, Panel/Index, etc.) */
.bg-primary {
    background: linear-gradient( 145deg,
    /* start: mid blue */
    color-mix(in srgb, var(--bs-blue) 75%, black 10%),
    /* end: deeper blue */
    color-mix(in srgb, var(--bs-blue) 85%, black 25%) ) !important;
    /* less transparency = richer color, still a bit see‑through */
    background-color: rgba(var(--pc-blue-rgb), 0.90);
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.25) inset;
    backdrop-filter: blur(20px) saturate(170%);
    -webkit-backdrop-filter: blur(20px) saturate(170%);
    border-radius: 1.4rem;
}

/* Make cards feel like glass tiles */
.card {
    border-radius: 1.2rem;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.12);
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.35), 0 1px 0 rgba(255, 255, 255, 0.15) inset;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
}

/* Dark cards */
[data-bs-theme="dark"] .card {
    background: rgba(15, 15, 15, 0.55);
}

/* Inner primary cards (like those inside .bg-primary sections) a bit lighter */
.bg-primary .card {
    background: rgba(255, 255, 255, 0.10);
}

/* Rounded containers (Bootstrap .container) slightly floating */
.container {
    position: relative;
    z-index: 0;
}


/* Optional subtle gradient on body background */
body {
    background: radial-gradient(circle at top left, rgba(var(--pc-blue-rgb), 0.06), transparent 55%), radial-gradient(circle at bottom right, rgba(var(--pc-pink-rgb), 0.05), transparent 55%), var(--bs-body-bg);
    color: var(--bs-body-color);
}

/* Brand watermark background ONLY for _Layout_Main (Panel) */
    body.layout-main {
        background: radial-gradient(circle at top left, rgba(var(--pc-blue-rgb), 0.06), transparent 55%), radial-gradient(circle at bottom right, rgba(var(--pc-pink-rgb), 0.05), transparent 55%), url("/img/pinclues.svg") center center no-repeat, var(--bs-body-bg); /* was #f7f7fa */
        background-size: auto, auto, min(520px, 70vw), auto;
        background-attachment: fixed;
    }


/* Shared modern button feel */
.btn {
    border-radius: 999px;
    font-weight: 600;
    letter-spacing: 0.02em;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.30), 0 0 0 1px rgba(255, 255, 255, 0.08) inset;
    transition: transform 0.15s ease-out, box-shadow 0.15s ease-out, background 0.15s ease-out, border-color 0.15s ease-out;
    backdrop-filter: blur(6px) saturate(140%);
    -webkit-backdrop-filter: blur(6px) saturate(140%);
}

/* Primary and red variants get a soft glow */
.btn-primary,
.btn-red {
    background-image: linear-gradient( to bottom right, rgba(var(--pc-red-rgb), 0.95), rgba(var(--pc-red-rgb), 0.80) );
    border-color: rgba(var(--pc-red-rgb), 0.9);
}

/* Hover / active micro‑motion */
.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 35px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.14) inset;
}

.btn:active {
    transform: translateY(0);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(255, 255, 255, 0.12) inset;
}

/* Light buttons inside glass cards */
.btn-light {
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(255, 255, 255, 0.70);
    color: #222;
}

    .btn-light:hover {
        background: rgba(255, 255, 255, 0.88);
    }

/* Glass dropdown */
.dropdown-menu {
    border-radius: 0.9rem;
    padding: 0.35rem 0;
    background: rgba(15, 23, 42, 0.66); /* already dark glass */
    border: 1px solid rgba(148, 163, 184, 0.55);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06) inset;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
}

    /* Default dropdown items in glass menus */
    .dropdown-menu .dropdown-item {
        color: #e5e7eb;
        padding: 0.55rem 1rem;
    }

/* User profile dropdown: force light text for name, titles, etc. */
.user-profile-dropdown {
    color: #e5e7eb; /* default text color inside panel */
}

    /* Name + email in header */
    .user-profile-dropdown h6 {
        color: #f9fafb;
    }

    .user-profile-dropdown small,
    .user-profile-dropdown .text-muted {
        color: rgba(209, 213, 219, 0.85) !important; /* softer light grey */
    }

        /* Section labels like "CURRENT ADVENTURE" */
        .user-profile-dropdown small.text-muted.d-block {
            color: rgba(148, 163, 184, 0.95) !important;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            font-size: 0.68rem;
        }

    /* Role badge */
    .user-profile-dropdown .badge.bg-red {
        color: #fff;
    }

    /* Hover state remains bright */
    .user-profile-dropdown .dropdown-item:hover {
        background-color: rgba(var(--pc-blue-rgb), 0.25);
        color: #f9fafb;
    }

/* Modal = frosted glass with colored header already using .bg-red */
.modal-content {
    border-radius: 1.2rem;
    border: 1px solid rgba(148, 163, 184, 0.6);
    background: radial-gradient(circle at top left, rgba(255, 255, 255, 0.16), rgba(15, 23, 42, 0.88));
    box-shadow: 0 20px 55px rgba(15, 23, 42, 0.7), 0 0 0 1px rgba(255, 255, 255, 0.08) inset;
    backdrop-filter: blur(22px) saturate(170%);
    -webkit-backdrop-filter: blur(22px) saturate(170%);
}

.modal-header,
.modal-footer {
    border-color: rgba(148, 163, 184, 0.4);
}