/* Color Scheme for NeelClinic - Based on Primary Color #275D2D */

:root {
    /* Primary Color and its shades */
    --primary-color: #275D2D;
    --primary-light-10: #2E6A35;
    --primary-light-20: #35773D;
    --primary-light-30: #3C8445;
    --primary-light-40: #43914D;
    --primary-light-50: #4A9E55;
    
    --primary-dark-10: #225026;
    --primary-dark-20: #1D4320;
    --primary-dark-30: #18361A;
    --primary-dark-40: #132914;
    --primary-dark-50: #0E1C0E;
    
    /* Hover and active states */
    --primary-hover: #2E6A35;
    --primary-active: #1D4320;
    --primary-focus: #35773D;
    
    /* Background variations */
    --primary-bg-light: #F0F7F1;
    --primary-bg-lighter: #F8FCF9;
    --primary-bg-dark: #1D4320;
    
    /* Text colors */
    --primary-text: #275D2D;
    --primary-text-light: #4A9E55;
    --primary-text-dark: #1D4320;
    
    /* Border colors */
    --primary-border: #275D2D;
    --primary-border-light: #4A9E55;
    --primary-border-dark: #1D4320;
    
    /* Alternative to #EFA286 (orange) - using #D4B483 */
    --alternative-orange: #D4B483;
    --alternative-orange-light: #E0C595;
    --alternative-orange-dark: #C8A876;
    --alternative-orange-bg: rgba(212, 180, 131, 0.1);
}

/* Button variations */
.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

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

.btn-primary:active {
    background-color: var(--primary-active);
    border-color: var(--primary-active);
}

.btn-outline-primary {
    color: var(--primary-color);
    border-color: var(--primary-color);
}

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

/* Link colors */
a {
    color: var(--primary-color);
}

a:hover {
    color: var(--primary-hover);
}

/* Form elements */
.form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.2rem rgba(39, 93, 45, 0.25);
}

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

/* Navigation */
.nav-pills .nav-link.active {
    background-color: var(--primary-color);
}

/* Progress bars */
.progress-bar {
    background-color: var(--primary-color);
}

/* Pagination */
.page-item.active .page-link {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* List groups */
.list-group-item.active {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* Dropdowns */
.dropdown-item.active {
    background-color: var(--primary-color);
}

/* Custom components */
.sidebar {
    background-color: var(--primary-color);
}

.header {
    background-color: var(--primary-color);
}

/* Card headers and footers */
.card-header-primary {
    background-color: var(--primary-bg-light);
    border-bottom-color: var(--primary-border-light);
}

.card-footer-primary {
    background-color: var(--primary-bg-light);
    border-top-color: var(--primary-border-light);
}

/* Alert variations */
.alert-primary {
    color: var(--primary-text-dark);
    background-color: var(--primary-bg-light);
    border-color: var(--primary-border-light);
}

/* Badge variations */
.badge-primary {
    background-color: var(--primary-color);
}

.badge-primary-light {
    background-color: var(--primary-light-20);
    color: var(--primary-text-dark);
}

/* Text utilities */
.text-primary {
    color: var(--primary-color) !important;
}

.text-primary-light {
    color: var(--primary-light-20) !important;
}

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

/* Background utilities */
.bg-primary {
    background-color: var(--primary-color) !important;
}

.bg-primary-light {
    background-color: var(--primary-bg-light) !important;
}

.bg-primary-lighter {
    background-color: var(--primary-bg-lighter) !important;
}

/* Border utilities */
.border-primary {
    border-color: var(--primary-color) !important;
}

.border-primary-light {
    border-color: var(--primary-border-light) !important;
}

/* Alternative color utilities (replacement for #EFA286 with #D4B483) */
.bg-alternative-orange {
    background-color: var(--alternative-orange) !important;
}

.bg-alternative-orange-light {
    background-color: var(--alternative-orange-light) !important;
}

.bg-alternative-orange-bg {
    background-color: var(--alternative-orange-bg) !important;
}

.text-alternative-orange {
    color: var(--alternative-orange) !important;
}

.border-alternative-orange {
    border-color: var(--alternative-orange) !important;
}