/**
 * Healingphotons Brand Colors – Master stylesheet
 * Include this file first (after Bootstrap) on every page. Use the variables below
 * for all colors so branding stays in one place.
 *
 * Brand palette:
 *   Purple dark: #2D1343
 *   Purple light: #474073
 *   Green dark:   #51A73A
 *   Green light:  #8ABA41
 *
 * Usage in your CSS:
 *   color: var(--brand-purple-dark);
 *   background: linear-gradient(135deg, var(--brand-purple-dark) 0%, var(--brand-purple-light) 100%);
 *   border-color: var(--brand-green-dark);
 */

:root {
    /* Brand palette – change only here to update globally */
    --brand-purple-dark: #2D1343;
    --brand-purple-light: #474073;
    --brand-green-dark: #51A73A;
    --brand-green-light: #8ABA41;

    /* Semantic aliases */
    --brand-primary: var(--brand-purple-dark);
    --brand-primary-light: var(--brand-purple-light);
    --brand-accent: var(--brand-green-dark);
    --brand-accent-light: var(--brand-green-light);

    /* UI defaults */
    --brand-bg-page: #f8f9fa;
    --brand-bg-card: #fff;
    --brand-text-heading: #2c3e50;
    --brand-text-muted: #5d6d7e;
    --brand-text-muted-light: #7f8c8d;
}

/* Bootstrap overrides using brand colors */
.btn-primary,
.btn-custom.bg-primary,
.bg-primary {
    background-color: var(--brand-green-dark) !important;
    border-color: var(--brand-green-dark) !important;
}
.btn-primary:hover,
.btn-custom.bg-primary:hover {
    background-color: var(--brand-green-light) !important;
    border-color: var(--brand-green-light) !important;
}
.btn-outline-primary {
    color: var(--brand-green-dark);
    border-color: var(--brand-green-dark);
}
.btn-outline-primary:hover {
    background-color: var(--brand-green-dark);
    color: #fff;
    border-color: var(--brand-green-dark);
}

.badge.bg-success,
.bg-success {
    background-color: var(--brand-green-dark) !important;
}
.badge.bg-primary,
.bg-primary.badge {
    background-color: var(--brand-purple-dark) !important;
}

.text-primary {
    color: var(--brand-green-dark) !important;
}

/* Focus rings */
.form-control:focus,
.form-select:focus {
    border-color: var(--brand-purple-light);
    box-shadow: 0 0 0 0.2rem rgba(71, 64, 115, 0.25);
}

/* Site footer – dark bar, white text, full width */
.site-footer {
    background-color: var(--brand-purple-dark);
    color: #fff;
    width: 100%;
    flex-shrink: 0;
    padding: 10px;
}
.site-footer .footer-link {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.site-footer .footer-link:hover {
    color: var(--brand-green-light);
}
