/* ── Override Bootstrap 5.1.3 primary color to green brand ── */
/* Bootstrap 5.1.3 uses hardcoded properties, NOT CSS variables for buttons.
   --bs-btn-* variables only work in Bootstrap 5.3+. Use direct overrides. */
:root {
    --bs-primary: #2d6e3f;
    --bs-primary-rgb: 45, 110, 63;
}

/* Bootstrap buttons */
.btn-primary {
    background-color: #2d6e3f !important;
    border-color: #2d6e3f !important;
    color: #fff !important;
}

.btn-primary:hover {
    background-color: #1a4a2e !important;
    border-color: #1a4a2e !important;
}

.btn-primary:active,
.btn-primary:focus {
    background-color: #164025 !important;
    border-color: #164025 !important;
}

.btn-primary:disabled {
    background-color: #2d6e3f !important;
    border-color: #2d6e3f !important;
}

.btn-primary:focus {
    box-shadow: 0 0 0 0.25rem rgba(45, 110, 63, 0.5) !important;
}

.btn-outline-primary {
    color: #2d6e3f !important;
    border-color: #2d6e3f !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:active {
    background-color: #2d6e3f !important;
    border-color: #2d6e3f !important;
    color: #fff !important;
}

/* DevExpress DxButton with RenderStyle.Primary —
   uses .dxbl-btn-standalone.dxbl-btn-primary (high specificity) */
.dxbl-btn-standalone.dxbl-btn-primary {
    background-color: #2d6e3f !important;
    border-color: #2d6e3f !important;
    color: #fff !important;
}

.dxbl-btn-standalone.dxbl-btn-primary:hover {
    background-color: #1a4a2e !important;
    border-color: #1a4a2e !important;
}

.dxbl-btn-standalone.dxbl-btn-primary:active,
.dxbl-btn-standalone.dxbl-btn-primary:focus {
    background-color: #164025 !important;
    border-color: #164025 !important;
}

/* ── Override DevExpress text edit focus to green brand ── */
.dxbl-text-edit {
    --dxbl-text-edit-focus-border-color: rgba(45, 110, 63, 0.5);
    --dxbl-text-edit-focus-shadow-color: rgba(45, 110, 63, 0.25);
}

/* ── Override Bootstrap hardcoded blue focus/active styles ── */
/* Bootstrap 5.1.3 uses hardcoded #86b7fe and rgba(13,110,253,.25) instead of CSS variables */
.form-control:focus {
    border-color: #96b79f;
    box-shadow: 0 0 0 0.25rem rgba(45, 110, 63, 0.25);
}

.form-select:focus {
    border-color: #96b79f;
    box-shadow: 0 0 0 0.25rem rgba(45, 110, 63, 0.25);
}

.form-check-input:checked {
    background-color: #2d6e3f;
    border-color: #2d6e3f;
}

.form-check-input:focus {
    border-color: #96b79f;
    box-shadow: 0 0 0 0.25rem rgba(45, 110, 63, 0.25);
}

a {
    color: #2d6e3f;
}

a:hover {
    color: #1a4a2e;
}

.text-primary {
    color: #2d6e3f !important;
}

.bg-primary {
    background-color: #2d6e3f !important;
}

/* Prevent scrollbar appearance from shifting viewport width (fixes layout flickering) */
html {
    scrollbar-gutter: stable;
}

.feature-icon {
    width: 3rem;
    height: 3rem;
    background-color: #2d6e3f;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}


/* Responsive Design */
@media (max-width: 768px) {
    .section-container {
        padding: 3rem 1rem;
    }
}

/* ── Account Pages ── */

/* Card headers on account pages — green gradient to match site hero */
.account-card .card-header {
    background: linear-gradient(315deg, #1a4a2e 0%, #2d7a4a 100%);
    color: white;
    border-bottom: none;
    padding: 1.25rem 1.5rem;
}
.account-card .card-header h2 {
    color: white;
    margin-bottom: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

/* Green top accent on account cards (visible when no card-header) */
.account-card {
    border-top: 4px solid #2d6e3f;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

/* Cards WITH a header don't need the top border (gradient replaces it) */
.account-card:has(.card-header) {
    border-top: none;
}

/* Manage nav menu — green active pill */
.manage-nav .nav-link.active {
    background-color: #2d6e3f !important;
    color: white !important;
}
.manage-nav .nav-link {
    color: #2d6e3f;
    border-radius: 0.375rem;
    transition: background-color 0.15s ease;
}
.manage-nav .nav-link:hover:not(.active) {
    background-color: #f0faf3;
    color: #1a4a2e;
}