/**
 * Wepesi hotel — system-wide theme (matches logo: navy + teal + cyan).
 * Loaded on all platform pages; legacy --primary-green names map to brand teal/navy.
 */
:root {
    --brand-navy: #0c2d5c;
    --brand-navy-dark: #061e3d;
    --brand-navy-deeper: #041428;
    --brand-teal: #0d9488;
    --brand-teal-light: #14b8a6;
    --brand-cyan: #22d3ee;
    --brand-muted: #64748b;
    --brand-surface: #f0f9ff;
    --brand-surface-alt: #ecfeff;
    --brand-border: #bae6fd;
    --brand-border-teal: #99f6e4;

    /* Legacy variable names used across hotel modules */
    --primary-green: var(--brand-teal);
    --secondary-green: var(--brand-teal-light);
    --light-green: #ccfbf1;
    --dark-green: var(--brand-navy);
    --accent: var(--brand-surface);

    --bs-primary: var(--brand-teal);
    --bs-secondary: var(--brand-teal-light);
    --bs-success: var(--brand-teal);
    --bs-info: var(--brand-cyan);

    /* Super-admin / elegant UI */
    --elegant-primary: var(--brand-teal);
    --elegant-primary-dark: var(--brand-navy-dark);
    --elegant-text: var(--brand-navy);
    --elegant-muted: var(--brand-muted);
    --elegant-border: var(--brand-border-teal);
    --elegant-bg: #f8fafc;
    --elegant-bg-soft: var(--brand-surface-alt);
    --elegant-shadow: 0 14px 36px rgba(12, 45, 92, 0.08);
    --elegant-shadow-soft: 0 6px 18px rgba(12, 45, 92, 0.06);

    --sidebar-bg: var(--brand-navy);
    --sidebar-hover: #0f3d6e;
    --sidebar-active: var(--brand-teal);
    --sidebar-glow: var(--brand-teal-light);
}

/* Bootstrap & common components */
.btn-primary,
.bg-primary {
    background-color: var(--brand-teal) !important;
    border-color: var(--brand-navy-dark) !important;
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--brand-teal-light) !important;
    border-color: var(--brand-navy) !important;
}
.btn-outline-primary {
    color: var(--brand-teal) !important;
    border-color: var(--brand-teal) !important;
}
.btn-outline-primary:hover {
    background-color: var(--brand-teal) !important;
    color: #fff !important;
}
.text-primary {
    color: var(--brand-teal) !important;
}
.border-primary {
    border-color: var(--brand-teal) !important;
}
a {
    color: var(--brand-teal);
}
a:hover {
    color: var(--brand-navy);
}

.navbar-dark,
.navbar.bg-primary {
    background: linear-gradient(135deg, var(--brand-navy) 0%, var(--brand-navy-dark) 100%) !important;
}

.badge.bg-success,
.badge-success {
    background-color: var(--brand-teal) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--brand-teal) !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 148, 136, 0.2) !important;
}

.product-brand__wepesi {
    color: var(--brand-navy);
}
.product-brand__hotel {
    color: var(--brand-teal);
}
