/*
 * Front-page light-mode palette
 * Reference direction: deep clinic blue -> soft sky blue -> pale aqua -> warm cream.
 * Kept in a page-scoped layer so the established dark theme and admin surfaces stay intact.
 */
html:not([data-bs-theme="dark"]) body[data-page="index"] {
    --light-gradient-blue-deep: #2d5683;
    --light-gradient-blue: #3d70a7;
    --light-gradient-sky: #6aa6c2;
    --light-gradient-aqua: #c7dddd;
    --light-gradient-cream: #f4efe5;
    --home-blue: var(--light-gradient-blue);
    --home-blue-deep: var(--light-gradient-blue-deep);
    --home-sky: #e8f1ef;
    --home-ink: #203348;
    --home-muted: #4e687a;
    --home-border: rgba(61, 112, 167, 0.24);
    --home-glass: rgba(255, 253, 248, 0.76);
    --home-glass-strong: rgba(255, 253, 248, 0.92);
    --home-shadow: 0 24px 70px rgba(45, 86, 131, 0.16);
    --home-gradient: linear-gradient(135deg, var(--light-gradient-blue) 0%, var(--light-gradient-sky) 42%, var(--light-gradient-aqua) 74%, var(--light-gradient-cream) 100%);
    --home-gradient-soft: linear-gradient(135deg, rgba(61, 112, 167, 0.22) 0%, rgba(106, 166, 194, 0.18) 42%, rgba(199, 221, 221, 0.3) 74%, rgba(244, 239, 229, 0.68) 100%);
    --home-surface-gradient: linear-gradient(135deg, rgba(255, 253, 248, 0.95) 0%, rgba(236, 245, 242, 0.86) 58%, rgba(199, 221, 221, 0.62) 100%);
    --home-action-gradient: linear-gradient(135deg, var(--light-gradient-blue) 0%, var(--light-gradient-blue-deep) 100%);
    --home-action-gradient-hover: linear-gradient(135deg, #4d86b5 0%, #23476f 100%);
    --bs-primary: var(--light-gradient-blue);
    --bs-primary-rgb: 61, 112, 167;
    --bs-link-color: var(--light-gradient-blue-deep);
    --bs-link-hover-color: #23476f;
    background:
        radial-gradient(circle at 8% 8%, rgba(61, 112, 167, 0.13), transparent 25rem),
        linear-gradient(180deg, var(--light-gradient-cream) 0%, #e9f1ef 28%, var(--light-gradient-aqua) 64%, #f7f2e9 100%);
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .homepage-shell::before {
    background: linear-gradient(180deg, rgba(61, 112, 167, 0.15) 0%, rgba(106, 166, 194, 0.11) 38%, rgba(199, 221, 221, 0.15) 72%, rgba(244, 239, 229, 0.24) 100%);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .homepage-section {
    background: transparent !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .home-hero {
    background-color: var(--light-gradient-blue-deep) !important;
    background-image:
        linear-gradient(180deg, rgba(61, 112, 167, 0.16) 0%, rgba(244, 239, 229, 0.5) 100%),
        linear-gradient(90deg, rgba(32, 61, 94, 0.9) 0%, rgba(61, 112, 167, 0.68) 42%, rgba(106, 166, 194, 0.28) 72%, rgba(244, 239, 229, 0.08) 100%),
        url("../img/home-hero-clinic-front.jpg") !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .home-hero::after {
    background: linear-gradient(180deg, transparent 0%, rgba(244, 239, 229, 0.96) 100%) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-kicker {
    color: #dceeea;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-system-copy {
    color: rgba(255, 253, 248, 0.93);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.glass-panel, .info-card, .service-card, .contact-card, .map-frame, #calendar) {
    background: var(--home-surface-gradient) !important;
    border-color: var(--home-border) !important;
    box-shadow: var(--home-shadow) !important;
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-content {
    text-shadow: 0 2px 20px rgba(32, 61, 94, 0.42);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-actions .btn-primary,
html:not([data-bs-theme="dark"]) body[data-page="index"] .track-panel .btn-primary,
html:not([data-bs-theme="dark"]) body[data-page="index"] .btn-primary,
html:not([data-bs-theme="dark"]) body[data-page="index"] .navbar-custom .btn-menu,
html:not([data-bs-theme="dark"]) body[data-page="index"] .nav-desktop .nav-login {
    background: var(--home-action-gradient) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 14px 30px rgba(45, 86, 131, 0.28);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.hero-actions .btn-primary, .track-panel .btn-primary, .btn-primary, .navbar-custom .btn-menu, .nav-desktop .nav-login):hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.hero-actions .btn-primary, .track-panel .btn-primary, .btn-primary, .navbar-custom .btn-menu, .nav-desktop .nav-login):focus-visible {
    background: var(--home-action-gradient-hover) !important;
    box-shadow: 0 16px 34px rgba(45, 86, 131, 0.34);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-actions .btn-outline-primary {
    background: rgba(255, 253, 248, 0.9) !important;
    border-color: rgba(244, 239, 229, 0.82) !important;
    color: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-actions .btn-outline-primary:hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-actions .btn-outline-primary:focus-visible {
    background: var(--light-gradient-cream) !important;
    border-color: var(--light-gradient-cream) !important;
    color: #203348 !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .navbar-custom .container {
    background: linear-gradient(135deg, rgba(244, 239, 229, 0.95), rgba(199, 221, 221, 0.78)) !important;
    border-color: rgba(61, 112, 167, 0.22) !important;
    box-shadow: 0 18px 50px rgba(45, 86, 131, 0.16);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.brand-name, .brand-subtitle, .nav-desktop a, .desktop-theme-toggle) {
    color: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.nav-desktop a:hover, .nav-desktop a:focus-visible, .desktop-theme-toggle:hover, .desktop-theme-toggle:focus-visible, .nav-desktop a.active) {
    background: rgba(106, 166, 194, 0.2) !important;
    border-color: rgba(61, 112, 167, 0.24) !important;
    color: #23476f !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .offcanvas-menu {
    background: var(--home-surface-gradient) !important;
    border-color: var(--home-border) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .menu-item {
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .menu-item:hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] .menu-item:focus-visible,
html:not([data-bs-theme="dark"]) body[data-page="index"] .menu-item.active {
    background: rgba(106, 166, 194, 0.18) !important;
    border-color: rgba(61, 112, 167, 0.22) !important;
    color: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .track-panel,
html:not([data-bs-theme="dark"]) body[data-page="index"] .track-panel h2 {
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.section-heading h2, .info-card h3, .service-card .card-title, .contact-card h3, .track-panel h2) {
    color: var(--home-ink) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.text-primary, .mobile-scroll-hint, .contact-card h3 i) {
    color: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.section-heading .lead, .service-card .card-text, .contact-card p) {
    color: var(--home-muted) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #trackTicketForm :is(.form-control, .btn),
html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.form-control, .form-select, .input-group-text) {
    border-color: rgba(61, 112, 167, 0.26) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.form-control, .form-select, .input-group-text) {
    background: rgba(255, 253, 248, 0.94) !important;
    color: var(--home-ink) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.form-control, .form-select):focus {
    border-color: var(--light-gradient-blue) !important;
    box-shadow: 0 0 0 0.22rem rgba(61, 112, 167, 0.2) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.form-control, .form-select)::placeholder {
    color: #6d7f8d;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-toolbar {
    border-bottom-color: rgba(61, 112, 167, 0.18);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-button-group {
    background: rgba(199, 221, 221, 0.58);
    border-color: rgba(61, 112, 167, 0.18);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-button {
    background: rgba(106, 166, 194, 0.2) !important;
    border-color: rgba(61, 112, 167, 0.2) !important;
    color: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-button-primary:not(:disabled).fc-button-active,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-button:hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-button:focus {
    background: var(--home-action-gradient) !important;
    border-color: transparent !important;
    color: #fff !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-col-header-cell {
    background: var(--light-gradient-blue) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-col-header-cell:first-child,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-col-header-cell:last-child {
    background: var(--light-gradient-blue-deep) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-daygrid-day {
    background: rgba(255, 253, 248, 0.58);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-day-today {
    background: rgba(199, 221, 221, 0.78) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-daygrid-day-number {
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-theme-standard td,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-theme-standard th,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-scrollgrid td,
html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-scrollgrid th {
    border-color: rgba(61, 112, 167, 0.14);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] #calendar .fc-event {
    background: var(--home-action-gradient) !important;
    border-color: transparent !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .contact-action {
    background: linear-gradient(135deg, rgba(106, 166, 194, 0.2), rgba(199, 221, 221, 0.7));
    border-color: rgba(61, 112, 167, 0.22);
    color: var(--light-gradient-blue-deep);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .contact-action:hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] .contact-action:focus-visible {
    background: var(--home-action-gradient);
    color: #fff;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .mobile-scroll-hint {
    background: rgba(199, 221, 221, 0.66) !important;
    border-color: rgba(61, 112, 167, 0.2) !important;
    box-shadow: 0 10px 26px rgba(45, 86, 131, 0.12) !important;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .site-footer {
    background: linear-gradient(135deg, #294f79 0%, var(--light-gradient-blue) 48%, #4d7895 100%);
    color: #fff;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.footer-brand span, .footer-copy) {
    color: rgba(255, 253, 248, 0.9);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .footer-links a {
    border-color: rgba(255, 253, 248, 0.32);
    color: #fff;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .footer-links a:hover,
html:not([data-bs-theme="dark"]) body[data-page="index"] .footer-links a:focus-visible {
    background: rgba(199, 221, 221, 0.2);
    border-color: rgba(255, 253, 248, 0.62);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] :is(a, button, input, select, textarea):focus-visible {
    outline: 3px solid rgba(45, 86, 131, 0.55);
    outline-offset: 3px;
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .modal-content {
    background: var(--home-surface-gradient) !important;
    border-color: var(--home-border) !important;
    color: var(--home-ink);
}

html:not([data-bs-theme="dark"]) body[data-page="index"] .modal-header.bg-primary {
    background: var(--home-action-gradient) !important;
}

@media (max-width: 575.98px) {
    html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-content {
        background: linear-gradient(135deg, rgba(45, 86, 131, 0.9) 0%, rgba(61, 112, 167, 0.78) 54%, rgba(106, 166, 194, 0.48) 100%) !important;
        border-color: rgba(244, 239, 229, 0.42) !important;
        box-shadow: 0 18px 54px rgba(45, 86, 131, 0.28);
    }
}

@media (prefers-reduced-motion: reduce) {
    html:not([data-bs-theme="dark"]) body[data-page="index"] :is(.btn, .menu-item, .service-card, .contact-card, .contact-action) {
        transition: none !important;
    }
}

/* Mobile hero composition: keep the clinic photo clear and the content readable. */
@media (max-width: 575.98px) {
    html:not([data-bs-theme="dark"]) body[data-page="index"] .home-hero,
    html[data-bs-theme="dark"] body[data-page="index"] .home-hero {
        background-color: #edf6f7 !important;
        background-image: none !important;
        background-position: initial !important;
        background-size: auto !important;
        min-height: 0 !important;
        padding: 5.45rem 0 1.25rem !important;
    }

    html:not([data-bs-theme="dark"]) body[data-page="index"] .home-hero::before,
    html[data-bs-theme="dark"] body[data-page="index"] .home-hero::before {
        background:
            linear-gradient(180deg, rgba(61, 112, 167, 0.16) 0%, rgba(244, 239, 229, 0.5) 100%),
            linear-gradient(90deg, rgba(32, 61, 94, 0.58) 0%, rgba(61, 112, 167, 0.42) 52%, rgba(244, 239, 229, 0.16) 100%),
            url("../img/home-hero-clinic-front.jpg") center / contain no-repeat;
        background-color: #edf6f7;
        content: "";
        filter: blur(0.75px) saturate(0.9);
        height: 75vw;
        inset: 5.2rem 0 auto;
        pointer-events: none;
        position: absolute;
        z-index: 0;
    }

    html:not([data-bs-theme="dark"]) body[data-page="index"] .home-hero::after {
        background: linear-gradient(180deg, transparent 0%, rgba(237, 246, 247, 0.98) 100%) !important;
        height: 3.75rem !important;
        z-index: 0;
    }

    html[data-bs-theme="dark"] body[data-page="index"] .home-hero {
        background-color: #05101f !important;
    }

    html[data-bs-theme="dark"] body[data-page="index"] .home-hero::before {
        background:
            linear-gradient(180deg, rgba(5, 16, 31, 0.2) 0%, rgba(5, 16, 31, 0.72) 100%),
            linear-gradient(90deg, rgba(5, 16, 31, 0.48) 0%, rgba(26, 61, 81, 0.36) 52%, rgba(5, 16, 31, 0.18) 100%),
            url("../img/home-hero-clinic-front.jpg") center / contain no-repeat;
        background-color: #05101f;
    }

    html[data-bs-theme="dark"] body[data-page="index"] .home-hero::after {
        background: linear-gradient(180deg, transparent 0%, rgba(5, 16, 31, 0.98) 100%) !important;
        height: 3.75rem !important;
        z-index: 0;
    }

    body[data-page="index"] .home-hero .container {
        position: relative;
        z-index: 1;
    }

    html:not([data-bs-theme="dark"]) body[data-page="index"] .navbar-custom .container {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255, 253, 248, 0.97) !important;
    }

    html[data-bs-theme="dark"] body[data-page="index"] .navbar-custom .container {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(26, 61, 81, 0.98) !important;
    }

    html:not([data-bs-theme="dark"]) body[data-page="index"] .hero-content {
        background: linear-gradient(145deg, #2d5683 0%, #3d70a7 60%, #4d7895 100%) !important;
        border-color: rgba(244, 239, 229, 0.46) !important;
        margin-top: calc(75vw - 0.25rem) !important;
        text-shadow: none !important;
    }

    html[data-bs-theme="dark"] body[data-page="index"] .hero-content {
        background: linear-gradient(145deg, #234a67 0%, #1a3d51 100%) !important;
        border-color: rgba(147, 197, 253, 0.28) !important;
        box-shadow: 0 18px 54px rgba(8, 30, 43, 0.34) !important;
        margin-top: calc(75vw - 0.25rem) !important;
        text-shadow: none !important;
    }

    body[data-page="index"] .track-panel {
        margin-top: 0 !important;
    }
}
