/* Brand palette (derived from logo teal) */
:root{
    --brand:#7AC1C7;          /* teal */
    --brand-dark:#5DA5AA;     /* darker teal */
    --brand-deep:#2E7E87;     /* deep accent */
    --brand-soft:#E9F6F7;     /* soft bg */
    --text:#23323A;
}

/* Auth background */
body.auth-bg{
    background: radial-gradient(1200px 600px at 10% -10%, var(--brand-soft), transparent 60%),
                radial-gradient(1000px 600px at 110% 110%, #ffffff, var(--brand-soft) 60%);
    min-height:100vh;
}

/* Backend background (subtle soft) */
body.backend-bg{
    background: linear-gradient(180deg, #ffffff, var(--brand-soft) 120%);
    min-height: 100vh;
    display:flex;
    flex-direction:column;
}

/* Auth container helpers */
.auth-wrap{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:32px 16px; }
.brand-logo{ max-width:140px; filter: drop-shadow(0 2px 4px rgba(0,0,0,.08)); }

/* Auth card */
.auth-card{ border:none; border-radius:14px; overflow:hidden; box-shadow:0 12px 30px rgba(46,126,135,.15); }
.auth-card .card-header{ background:linear-gradient(135deg, var(--brand), var(--brand-dark)); color:#fff; letter-spacing:.5px; font-weight:600; text-align:center; }
.auth-card .card-body{ background:#fff; }

/* Inputs */
.form-control:focus{ border-color:var(--brand); box-shadow:0 0 0 .25rem rgba(122,193,199,.25); }

/* Make primary auth button more distinct from background */
.btn-brand{ 
    background: linear-gradient(135deg, var(--brand-deep), var(--brand)); 
    color:#fff; 
    border:1px solid var(--brand-deep); 
    box-shadow:0 6px 14px rgba(46,126,135,.25);
    font-weight:700;
}
.btn-brand:hover{ background: var(--brand-deep); color:#fff; box-shadow:0 8px 18px rgba(46,126,135,.3); transform: translateY(-1px); }
.btn-brand:active{ background: var(--brand-dark); transform: translateY(0); }
.btn-brand:focus{ box-shadow:0 0 0 .25rem rgba(46,126,135,.35);}

/* Backend navbar */
.bg-brand{
    background: linear-gradient(135deg, var(--brand), var(--brand-deep));
}
.navbar .nav-link{ color:#e9f6f7 !important; }
.navbar .nav-link:hover{ color:#fff !important; }
.navbar .navbar-brand{ color:#fff !important; }

/* Brand footer */
.brand-footer{ background: linear-gradient(135deg, var(--brand-deep), var(--brand)); color:#e9f6f7; }

/* Card & section look */
.card, .border-0.rounded-3, .shadow-sm{ border: none; border-radius: 14px !important; box-shadow:0 8px 24px rgba(46,126,135,.12) !important; }
.table{ background:#fff; }
.table thead{ background: #dff0f2; }
.btn-primary{ background: var(--brand-deep); border-color: var(--brand-deep); }
.btn-primary:hover{ background: var(--brand); border-color: var(--brand); }
.btn-outline-primary{ color: var(--brand-deep); border-color: var(--brand-deep); }
.btn-outline-primary:hover{ background: var(--brand-deep); color:#fff; }
.badge.bg-success{ background-color:#3AAFA9 !important; }
.badge.bg-danger{ background-color:#E76F51 !important; }

/* Bootstrap 5 text-bg-* badges (used in Razor pages) */
.badge.text-bg-primary{ background-color: var(--brand-deep) !important; color:#fff !important; }
.badge.text-bg-warning{ background-color: #f6c343 !important; color:#212529 !important; }
.badge.text-bg-secondary{ background-color:#6c757d !important; color:#fff !important; }
.badge.text-bg-success{ background-color:#198754 !important; color:#fff !important; }
.badge.text-bg-danger{ background-color:#dc3545 !important; color:#fff !important; }
.badge.text-bg-dark{ background-color:#212529 !important; color:#fff !important; }
.badge.text-bg-light{ background-color:#f8f9fa !important; color:#212529 !important; border:1px solid rgba(0,0,0,.1);}

/* Subtle helper text */
.text-muted-small{ color:#6b7a82 !important; font-size:.875rem; }
.text-muted{ color:#5f6f75 !important; }

/* Tables hover rows subtle */
.table-hover tbody tr:hover{ background-color:#f4fbfc; }

/* Form labels */
.form-label{ color:#2b3a40; font-weight:600; }

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

/* Utility spacing for cards inside pages */
.container .card,
.container-fluid .card{ margin-bottom: 1rem; }

/* Navbar dropdown: hover to open (desktop) + smooth animation */
@media (min-width: 992px) {
    .navbar .dropdown:hover > .dropdown-menu {
        display: block;
        margin-top: 0;
    }

    .navbar .dropdown-menu {
        display: block;            /* keep in flow for animation */
        opacity: 0;
        visibility: hidden;
        transform: translateY(6px);
        transition: opacity .18s ease, transform .18s ease, visibility .18s;
        pointer-events: none;
    }

    .navbar .dropdown:hover > .dropdown-menu,
    .navbar .dropdown.show > .dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
        pointer-events: auto;
    }
}

@media (max-width: 991.98px) {
    .navbar .dropdown-menu {
        display: block;
        margin-top: .25rem;
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        padding-top: 0;
        padding-bottom: 0;
        border-width: 0;
        transform: translateY(-8px);
        transition: max-height .25s ease, opacity .2s ease, transform .2s ease, padding .2s ease, border-width .2s ease;
        pointer-events: none;
    }

    .navbar .dropdown.show > .dropdown-menu {
        max-height: 20rem;
        opacity: 1;
        overflow-y: auto;
        padding-top: .5rem;
        padding-bottom: .5rem;
        border-width: 1px;
        transform: translateY(0);
        pointer-events: auto;
    }

    .navbar .dropdown-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}