/*
 * D14.4 GLOBAL RESPONSIVE THEME RUNTIME
 * -------------------------------------
 * This file deliberately styles generic runtime components through project
 * theme variables. New pages and new dynamic data inherit the active project
 * theme without copying fixed colors/fonts into their content records.
 */

:root{
    --site-space-1:clamp(.35rem,.3rem + .2vw,.5rem);
    --site-space-2:clamp(.55rem,.45rem + .35vw,.8rem);
    --site-space-3:clamp(.8rem,.65rem + .5vw,1.1rem);
    --site-space-4:clamp(1rem,.8rem + .8vw,1.5rem);
    --site-space-5:clamp(1.35rem,1rem + 1.2vw,2.1rem);
    --site-space-6:clamp(1.8rem,1.25rem + 2vw,3.2rem);
    --site-content-max:1440px;
    --site-readable-max:76ch;
    --site-control-height:clamp(42px,3vw,50px);
    --site-touch-min:44px;
    --site-heading-1:clamp(2rem,1.25rem + 3.4vw,4.6rem);
    --site-heading-2:clamp(1.6rem,1.15rem + 2vw,3rem);
    --site-heading-3:clamp(1.25rem,1rem + 1vw,2rem);
}

html{
    box-sizing:border-box;
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
    scroll-behavior:smooth;
}
*,*::before,*::after{box-sizing:inherit}
body{
    min-width:320px;
    overflow-x:hidden;
    background:var(--theme-background);
    color:var(--theme-text);
}
img,svg,video,canvas,iframe{
    max-width:100%;
}
img,video{height:auto}
button,input,select,textarea{
    font:inherit;
}
button,a,input,select,textarea,[role="button"]{
    min-height:var(--site-touch-min);
}
a{
    text-underline-offset:.18em;
}
h1,h2,h3,h4,h5,h6{
    color:var(--theme-text);
    text-wrap:balance;
}
h1{font-size:var(--site-heading-1)}
h2{font-size:var(--site-heading-2)}
h3{font-size:var(--site-heading-3)}
p,li{
    overflow-wrap:anywhere;
}
p{
    max-width:var(--site-readable-max);
}

/* Global site shell */
.hospital-container,
.visual-section-container{
    width:min(100% - clamp(1rem,4vw,4rem),var(--site-content-max));
    margin-inline:auto;
}
.hospital-header,
.hospital-top-header,
.hospital-navigation-wrapper,
.hospital-footer{
    color:var(--theme-text);
}
.hospital-navigation-wrapper,
.hospital-top-header{
    background:var(--theme-surface);
}
.hospital-logo-image{
    max-width:clamp(120px,13vw,210px);
    height:auto;
}
.header-book-button,
.admin-button,
.visual-button,
button[type="submit"]{
    border-radius:var(--theme-radius);
}
.hospital-main-menu a,
.header-small-link,
.header-information-item{
    color:var(--theme-text);
}
.header-book-button,
.visual-button-primary{
    background:var(--theme-primary);
    border-color:var(--theme-primary);
    color:#fff;
}

/* Builder pages remain theme-driven globally */
.visual-page{
    color:var(--theme-text);
    background:var(--theme-background);
    container-type:inline-size;
}
.visual-section{
    container-type:inline-size;
    position:relative;
}
.visual-section-container{
    padding-block:var(--site-space-5);
}
.visual-component{
    min-width:0;
    color:inherit;
}
.visual-heading{
    color:var(--theme-text);
}
.visual-button-group{
    display:flex;
    flex-wrap:wrap;
    gap:var(--site-space-2);
}
.visual-button{
    min-height:var(--site-control-height);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    padding:.7rem 1.05rem;
    border-radius:var(--theme-radius);
    box-shadow:none;
}
.visual-button-secondary,
.visual-button-outline{
    background:var(--theme-surface);
    color:var(--theme-primary);
    border-color:var(--theme-primary);
}

/* Generic cards / dynamic content */
.news-card,
.doctor-card,
.specialty-card,
.medical-center-card,
.builder-metric-item,
.builder-feature-item,
.visual-table-wrap,
.dynamic-chat-widget,
.builder-contact-dock,
.builder-location-widget,
.site-card,
.card{
    background:var(--theme-surface);
    color:var(--theme-text);
    border-color:var(--theme-border,#d7e2e8);
    border-radius:var(--theme-radius);
    box-shadow:var(--theme-card-shadow,var(--theme-shadow));
}
.news-card a,
.doctor-card a,
.specialty-card a,
.medical-center-card a{
    color:var(--theme-primary);
}
.text-muted,
.muted,
small{
    color:var(--theme-muted);
}

/* Tables/forms */
.visual-table-positioner,
.visual-table-wrap{
    max-width:100%;
}
.visual-table-wrap.is-responsive,
.table-responsive{
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
}
.builder-data-table{
    min-width:min(100%,640px);
}
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea{
    max-width:100%;
    min-height:var(--site-control-height);
    border-color:var(--theme-border,#d7e2e8);
    border-radius:var(--theme-radius);
    background:var(--theme-surface);
    color:var(--theme-text);
}
input:focus,
select:focus,
textarea:focus,
button:focus-visible,
a:focus-visible{
    outline:3px solid var(--theme-focus-ring,rgba(10,124,200,.28));
    outline-offset:2px;
}

/* Responsive images and media */
.visual-image-picture,
.visual-image-picture img,
.builder-feature-media img,
.builder-banner img,
.builder-slider img{
    display:block;
    width:100%;
}
.builder-feature-media,
.builder-banner,
.builder-slider{
    overflow:hidden;
    border-radius:var(--theme-radius);
}

/* Preview shell */
.site-template-preview-banner{
    position:sticky;
    inset-block-start:0;
    z-index:1200;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:.45rem 1rem;
    padding:.65rem 1rem;
    background:var(--theme-text);
    color:var(--theme-surface);
    font-size:.9rem;
    box-shadow:var(--theme-shadow);
}
.site-template-preview-banner strong,
.site-template-preview-banner span{
    color:inherit;
}
.site-template-preview-state{
    padding:.2rem .55rem;
    border:1px solid currentColor;
    border-radius:999px;
}

/* Container-based adaptation lets components respond to their actual width,
   not to a fixed phone model list. */
@container (max-width: 760px){
    .visual-button-group{
        align-items:stretch;
    }
    .visual-button-group .visual-button{
        flex:1 1 220px;
    }
    .builder-feature-section{
        grid-template-columns:1fr!important;
    }
}
@container (max-width: 520px){
    .visual-button-group{
        display:grid;
        grid-template-columns:1fr;
    }
    .visual-button-group .visual-button{
        width:100%;
    }
}

/* Fluid shell breakpoints. These widths cover compact phones through
   tablets/desktops without targeting vendor/model names. */
@media (max-width:1199.98px){
    .header-information{
        gap:var(--site-space-2);
    }
    .hospital-main-menu{
        padding-block:.6rem;
    }
}
@media (max-width:991.98px){
    .hospital-top-header .top-header-wrapper{
        gap:var(--site-space-3);
    }
    .header-information{
        flex-wrap:wrap;
    }
    .hospital-navbar .navbar-collapse{
        max-height:min(72vh,620px);
        overflow:auto;
        overscroll-behavior:contain;
    }
}
@media (max-width:767.98px){
    :root{
        --site-content-max:100%;
    }
    .hospital-container,
    .visual-section-container{
        width:min(100% - 1.25rem,var(--site-content-max));
    }
    .hospital-top-header .top-header-wrapper{
        align-items:center;
    }
    .header-information-item.address-information,
    .header-information-separator{
        display:none!important;
    }
    .visual-section-container{
        padding-block:var(--site-space-4);
    }
    .builder-data-table{
        min-width:560px;
    }
}
@media (max-width:575.98px){
    .hospital-logo-image{
        max-width:140px;
    }
    .header-information{
        width:100%;
    }
    .header-information-item,
    .header-small-link,
    .header-book-button{
        min-height:44px;
    }
    .visual-section-container{
        width:calc(100% - 1rem);
    }
    .site-template-preview-banner{
        justify-content:flex-start;
        font-size:.78rem;
    }
}
@media (max-width:359.98px){
    body{
        min-width:320px;
    }
    .hospital-container,
    .visual-section-container{
        width:calc(100% - .75rem);
    }
}

/* Respect users and mobile accessibility. */
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{
        animation-duration:.001ms!important;
        animation-iteration-count:1!important;
        transition-duration:.001ms!important;
    }
}


/* =========================================================
   D14.8 — PROJECT-SCOPED HEADER / NAVIGATION THEME TOKENS
   Loaded after navigation-tree.css so Theme Studio tokens
   are the final runtime authority for the public shell.
========================================================= */

.hospital-top-header {
    background: var(--theme-header-background, var(--theme-surface));
    color: var(--theme-header-text, var(--theme-text));
}

.hospital-top-header .header-small-link,
.hospital-top-header .header-information-item,
.hospital-top-header .header-information-item strong,
.hospital-top-header .header-information-item span {
    color: var(--theme-header-text, var(--theme-text));
}

.hospital-navigation-wrapper,
.hospital-navbar,
.hospital-navbar .navbar-collapse {
    background: var(--theme-navigation-background, var(--theme-surface));
    color: var(--theme-navigation-text, var(--theme-text));
}

.hospital-navigation-wrapper {
    border-color: var(--theme-navigation-border, var(--theme-border));
}

.hospital-main-menu .nav-menu-trigger,
.hospital-main-menu a,
.hospital-navbar .navbar-toggler,
.header-search-button {
    color: var(--theme-navigation-text, var(--theme-text));
}

.hospital-main-menu > .nav-menu-item > .nav-menu-trigger:hover,
.hospital-main-menu > .nav-menu-item > .nav-menu-trigger:focus-visible,
.hospital-main-menu > .nav-menu-item.submenu-open > .nav-menu-trigger {
    color: var(--theme-navigation-hover-text, var(--theme-primary));
    background: var(--theme-navigation-hover-background, var(--theme-background));
}

.hospital-main-menu > .nav-menu-item > .nav-menu-trigger.active,
.hospital-main-menu > .nav-menu-item.active > .nav-menu-trigger,
.hospital-main-menu > .nav-menu-item > .nav-menu-trigger[aria-current="page"],
.hospital-main-menu > .nav-menu-item > a.active,
.hospital-main-menu > .nav-menu-item > a[aria-current="page"] {
    color: var(--theme-navigation-active-text, #FFFFFF);
    background: var(--theme-navigation-active-background, var(--theme-primary));
}

.hospital-main-menu > .nav-menu-item.submenu-open > .nav-menu-trigger::before {
    background: var(--theme-navigation-active-background, var(--theme-primary));
}

.hospital-main-menu .nav-submenu,
.hospital-main-menu .nav-submenu .nav-submenu,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel {
    background: var(--theme-navigation-dropdown-background, var(--theme-surface));
    color: var(--theme-navigation-dropdown-text, var(--theme-text));
    border-color: var(--theme-navigation-border, var(--theme-border));
}

.hospital-main-menu .nav-submenu > .nav-menu-item > .nav-menu-trigger,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item > .nav-menu-trigger {
    color: var(--theme-navigation-dropdown-text, var(--theme-text));
    background: var(--theme-navigation-dropdown-background, var(--theme-surface));
    border-color: var(--theme-navigation-border, var(--theme-border));
}

.hospital-main-menu .nav-submenu > .nav-menu-item > .nav-menu-trigger:hover,
.hospital-main-menu .nav-submenu > .nav-menu-item > .nav-menu-trigger:focus-visible,
.hospital-main-menu .nav-submenu > .nav-menu-item.submenu-open > .nav-menu-trigger,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item > .nav-menu-trigger:hover,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item > .nav-menu-trigger:focus-visible,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item.submenu-open > .nav-menu-trigger {
    color: var(--theme-navigation-hover-text, var(--theme-primary));
    background: var(--theme-navigation-hover-background, var(--theme-background));
    border-color: var(--theme-navigation-border, var(--theme-border));
}

.hospital-main-menu .nav-menu-trigger:focus-visible,
.hospital-navbar .navbar-toggler:focus-visible,
.header-search-button:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 3px
        color-mix(
            in srgb,
            var(--theme-navigation-focus-ring, var(--theme-focus-ring)) 28%,
            transparent);
}

@media (max-width: 1199.98px) {
    .hospital-main-menu > .nav-menu-item > .nav-menu-trigger {
        color: var(--theme-navigation-text, var(--theme-text));
        background: var(--theme-navigation-background, var(--theme-surface));
        border-color: var(--theme-navigation-border, var(--theme-border));
    }

    .hospital-main-menu .nav-submenu,
    .hospital-main-menu .nav-submenu .nav-submenu {
        background: var(--theme-navigation-dropdown-background, var(--theme-surface));
        border-color: var(--theme-navigation-border, var(--theme-border));
    }
}


/* =========================================================
   D14.8.3 UNIVERSAL PROJECT IDENTITY + ACTION CONTROLS
   Applies to any site type. Module-specific studios may override.
========================================================= */

.hospital-logo-wrapper {
    width: auto !important;
    min-width: 0 !important;
}

.hospital-logo-image {
    width: var(--site-header-logo-desktop-width, 190px) !important;
    height: var(--site-header-logo-desktop-height, 78px) !important;
    max-width: 100% !important;
    object-fit: contain !important;
}

.footer-dynamic-logo {
    width: var(--site-footer-logo-desktop-width, 150px) !important;
    height: var(--site-footer-logo-desktop-height, 60px) !important;
    max-width: 100% !important;
    object-fit: contain !important;
}

.header-book-button,
.booking-submit-button,
.doctor-main-book,
.doctor-actions a.primary {
    color: var(--site-action-text, #fff) !important;
    background: var(--site-action-bg, var(--theme-primary)) !important;
    border-color: var(--site-action-bg, var(--theme-primary)) !important;
}

.header-book-button:hover,
.header-book-button:focus,
.booking-submit-button:hover,
.booking-submit-button:focus,
.doctor-main-book:hover,
.doctor-main-book:focus,
.doctor-actions a.primary:hover,
.doctor-actions a.primary:focus {
    color: var(--site-action-text, #fff) !important;
    background: var(--site-action-hover-bg, var(--theme-primary)) !important;
    border-color: var(--site-action-hover-bg, var(--theme-primary)) !important;
}

@media (max-width: 991.98px) {
    .hospital-logo-image {
        width: var(--site-header-logo-tablet-width, 155px) !important;
        height: var(--site-header-logo-tablet-height, 64px) !important;
    }

    .footer-dynamic-logo {
        width: var(--site-footer-logo-tablet-width, 135px) !important;
        height: var(--site-footer-logo-tablet-height, 56px) !important;
    }
}

@media (max-width: 575.98px) {
    .hospital-logo-image {
        width: var(--site-header-logo-mobile-width, 125px) !important;
        height: var(--site-header-logo-mobile-height, 52px) !important;
    }

    .footer-dynamic-logo {
        width: var(--site-footer-logo-mobile-width, 120px) !important;
        height: var(--site-footer-logo-mobile-height, 50px) !important;
    }
}


/* =========================================================
   D14.8.4A — UNIVERSAL HEADER / NAVIGATION DIMENSIONS
========================================================= */
.hospital-top-header,
.hospital-top-header .top-header-wrapper {
    min-height: var(--site-header-desktop-height, 92px);
}

.hospital-top-header .top-header-wrapper {
    padding-block: 0 !important;
    align-items: center;
}

.hospital-top-header .header-information,
.hospital-top-header .header-information-item,
.hospital-top-header .header-small-link,
.hospital-top-header .header-book-button {
    font-size: var(--site-header-info-desktop-font-size, 14px);
}

.hospital-navigation-wrapper,
.hospital-navbar {
    min-height: var(--site-nav-desktop-height, 58px);
}

.hospital-navbar {
    padding-block: 0 !important;
}

.hospital-main-menu > .nav-menu-item > .nav-menu-trigger,
.hospital-main-menu > .nav-menu-item > a {
    min-height: var(--site-nav-desktop-height, 58px);
    font-size: var(--site-nav-desktop-font-size, 15px);
    display: flex;
    align-items: center;
}

.hospital-main-menu .nav-submenu > .nav-menu-item > .nav-menu-trigger,
.hospital-main-menu .nav-submenu > .nav-menu-item > a,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item > .nav-menu-trigger,
.hospital-main-menu > .nav-mega-root > .nav-mega-panel > .nav-menu-item > a {
    min-height: var(--site-nav-dropdown-item-min-height, 42px);
    font-size: var(--site-nav-dropdown-font-size, 14px);
    display: flex;
    align-items: center;
}

@media (max-width: 991.98px) {
    .hospital-top-header,
    .hospital-top-header .top-header-wrapper {
        min-height: var(--site-header-tablet-height, 78px);
    }

    .hospital-top-header .header-information,
    .hospital-top-header .header-information-item,
    .hospital-top-header .header-small-link,
    .hospital-top-header .header-book-button {
        font-size: var(--site-header-info-tablet-font-size, 13px);
    }

    .hospital-navigation-wrapper,
    .hospital-navbar,
    .hospital-main-menu > .nav-menu-item > .nav-menu-trigger,
    .hospital-main-menu > .nav-menu-item > a {
        min-height: var(--site-nav-tablet-height, 54px);
    }

    .hospital-main-menu > .nav-menu-item > .nav-menu-trigger,
    .hospital-main-menu > .nav-menu-item > a {
        font-size: var(--site-nav-tablet-font-size, 14px);
    }
}

@media (max-width: 575.98px) {
    .hospital-top-header,
    .hospital-top-header .top-header-wrapper {
        min-height: var(--site-header-mobile-height, 68px);
    }

    .hospital-top-header .header-information,
    .hospital-top-header .header-information-item,
    .hospital-top-header .header-small-link,
    .hospital-top-header .header-book-button {
        font-size: var(--site-header-info-mobile-font-size, 12px);
    }

    .hospital-navigation-wrapper,
    .hospital-navbar,
    .hospital-main-menu > .nav-menu-item > .nav-menu-trigger,
    .hospital-main-menu > .nav-menu-item > a {
        min-height: var(--site-nav-mobile-height, 52px);
    }

    .hospital-main-menu > .nav-menu-item > .nav-menu-trigger,
    .hospital-main-menu > .nav-menu-item > a {
        font-size: var(--site-nav-mobile-font-size, 14px);
    }
}