/* The shared appearance owns neutral colors and components; this file owns
   AudiogramIQ typography and its photographic login composition. */
:root[data-appearance="nexora"] body {
    --app-font-body: 'Noto Sans Thai Looped', 'Source Sans 3', sans-serif;
    --app-font-heading: 'Noto Sans Thai Looped', 'Figtree', sans-serif;
    font-family: var(--app-font-body);
    background: var(--app-background);
}

:root[data-appearance="nexora"] .access-page-layout__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) {
    justify-content: flex-start;
    gap: 1.5rem;
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo)::before {
    background: linear-gradient(180deg, color-mix(in srgb, var(--app-surface-muted) 98%, transparent), color-mix(in srgb, var(--app-surface-muted) 93%, transparent) 25%, color-mix(in srgb, var(--app-surface-muted) 72%, transparent) 44%, transparent 70%, #253b3ac9);
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content > picture.aiq-login-photo img {
    object-position: right center;
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) blockquote {
    max-width: 20ch;
    font-family: 'Noto Serif Thai', 'Cormorant Garamond', serif;
    font-weight: 500;
    font-size: clamp(1.75rem, 2.5vw, 2.75rem);
    line-height: 1.5;
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) .identity-showcase-copy p {
    max-width: 46ch;
    font-size: .9rem;
}

:root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) .identity-showcase-status {
    margin-top: auto;
    color: #f3f4ef;
    border-color: #ffffff52;
}

@container (max-width: 60rem) {
    :root[data-appearance="nexora"] .access-page-layout__grid { grid-template-columns: minmax(0, 1fr); }
    :root[data-appearance="nexora"] .access-page-layout__showcase:has(picture.aiq-login-photo) { min-height: 32rem; }
}

/* Keep the primary command readable on phones and use the toolbar's existing
   disclosure for supporting actions, even after its width observer is ready. */
@media (max-width: 40rem) {
    :root[data-appearance="nexora"] .page-heading .page-action-toolbar:has(.page-action-toolbar__more) :is(.page-action-toolbar__supporting, .page-action-toolbar__inline-overflow) { display: none; }
    :root[data-appearance="nexora"] .page-heading .page-action-toolbar .page-action-toolbar__primary { min-width: max-content; }
    :root[data-appearance="nexora"] .page-heading .page-action-toolbar .page-action-toolbar__more { display: block; }
}

/* The phone layout puts the complete scene below the introduction so the booth
   and the technician remain visible instead of cropping a landscape photo. */
@container (max-width: 48rem) {
    :root[data-appearance="nexora"] .access-page-layout__showcase:has(picture.aiq-login-photo) { min-height: 0; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) { min-height: 0; padding: 1.25rem; gap: 1rem; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo)::before { display: none; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content > picture.aiq-login-photo { position: relative; z-index: auto; inset: auto; order: 2; height: auto; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content > picture.aiq-login-photo img { display: block; height: auto; object-fit: contain; border-radius: var(--app-radius-md); }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) blockquote { margin: 0; font-size: 1.6rem; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) .identity-showcase-status { order: 3; margin-top: 0; color: var(--app-foreground-muted); border-color: var(--app-border); }
}

@media (forced-colors: active) {
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo)::before { display: none; }
    :root[data-appearance="nexora"] .access-page-layout__showcase-content:has(> picture.aiq-login-photo) .identity-showcase-status { color: CanvasText; border-color: CanvasText; }
}
/* Keep the shared stealth controls visible on access pages at every width. */
:root[data-appearance="nexora"] .access-page-layout .identity-layout__preferences .preferences-selector__desktop {
    display: flex;
}

:root[data-appearance="nexora"] .access-page-layout .identity-layout__preferences .preferences-selector__mobile {
    display: none;
}

/* Keep the longer hearing-health introduction readable over the login photo. */
.access-login-layout:has(picture.aiq-login-photo) {
    --access-showcase-overlay: linear-gradient(180deg, #fffffff0 0%, #ffffffdb 68%, #ffffffad 88%, #253b3ae8 100%);
}
.access-login-showcase-content > picture.aiq-login-photo img {
    object-position: right center;
}