/* Shared UI layer: loaded after legacy Milligram, Cake and Bootstrap styles.
   Keep the existing 10px rem scale for layout compatibility; explicitly restore
   readable type instead of allowing Bootstrap's 1rem body to become 10px. */
:root {
    --ui-text: #203547;
    --ui-muted: #526575;
    --ui-line: #d8e3eb;
    --ui-surface: #fff;
    --ui-background: #f4f7fb;
    --ui-radius: 1.2rem;
    --ui-shadow: 0 .4rem 2rem rgba(24, 54, 75, .05);
    --bs-body-font-size: 1.6rem;
    --bs-body-line-height: 1.6;
    --bs-body-color: var(--ui-text);
}
html { font-size: 62.5%; }
body {
    font-family: system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: normal;
    color: var(--ui-text);
    background: var(--ui-background);
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.top-nav-links, .side-nav { font-family: inherit; }
h1, .h1 { font-size: clamp(2.8rem, 2rem + 1vw, 3.2rem); }
h2, .h2 { font-size: 2.4rem; }
h3, .h3 { font-size: 2.1rem; }
h4, .h4 { font-size: 1.8rem; }
h5, .h5, h6, .h6 { font-size: 1.6rem; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 650;
    line-height: 1.25;
    letter-spacing: -.02em;
    color: #18364a;
    margin-bottom: 1.2rem;
    overflow-wrap: anywhere;
}
p { margin-bottom: 1.6rem; }
small, .small, .form-text, .text-small { font-size: 1.4rem; line-height: 1.5; }
.lead { font-size: 1.8rem; font-weight: 400; }
.display-4 { font-size: clamp(3.2rem, 2.3rem + 2vw, 4.8rem); line-height: 1.15; }
.text-muted { color: var(--ui-muted) !important; }
a { text-underline-offset: .2em; }
a, p, dd, .nav-user-name, .dashboard-user-summary { overflow-wrap: anywhere; }
code, pre { font-size: 1.4rem; }
.container { max-width: 128rem; padding-inline: 2.4rem; }
.main { padding-block: 2.4rem 5rem; }
.row:has(> [class*="col-"]) { flex-direction: row; }
.top-nav { padding-block: 1.8rem; gap: 2rem; }
.top-nav-title { flex-shrink: 0; }
.top-nav-title a { font-size: 3.2rem; white-space: nowrap; text-decoration-thickness: .15rem; }
.top-nav-links { flex-wrap: wrap; justify-content: flex-end; gap: .8rem; }
.nav-user-name { font-size: 1.6rem; }
.top-nav-links .btn { font-size: 1.6rem; min-height: 4.4rem; padding: 1rem 1.4rem; }

/* Controls are readable on mobile and have room for multiline labels. */
input, select, textarea, button, .btn { font-family: inherit; }
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),
select, textarea, .form-control, .form-select {
    font-size: 1.6rem;
    line-height: 1.5;
    min-height: 4.4rem;
    height: auto;
    padding: .9rem 1.2rem;
    color: var(--ui-text);
    background-color: var(--ui-surface);
    border: 1px solid #aebfcd;
    border-radius: .7rem;
    max-width: 100%;
}
select, .form-select { padding-right: 3.4rem; }
input::placeholder, textarea::placeholder { color: #657582; opacity: 1; }
textarea, .contact-form textarea, .care-card textarea { min-height: 12rem; resize: vertical; }
label, legend { color: var(--ui-text); line-height: 1.5; }
label { font-size: 1.6rem; font-weight: 600; margin-bottom: .7rem; }
legend { font-size: 1.9rem; font-weight: 650; margin-bottom: 1.6rem; }
.input { margin-bottom: 1.6rem; }
.input input, .input select, .input textarea,
.contact-form .input input, .contact-form .input select, .contact-form .input textarea,
.auth-form .input input { margin-bottom: 0; }
.input .error-message { margin-top: .6rem; }
input[type=checkbox], input[type=radio] { width: 1.8rem; height: 1.8rem; accent-color: var(--color-monash-blue); vertical-align: middle; }
button, .button, .btn, input[type=submit], input[type=button], input[type=reset] {
    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: normal;
    line-height: 1.4;
    min-height: 4.4rem;
    height: auto;
    padding: 1rem 1.6rem;
    border-radius: .7rem;
    text-transform: none;
    white-space: normal;
}
.btn { --bs-btn-font-size: 1.6rem; --bs-btn-line-height: 1.4; }
.btn-sm, .pagination a, .manager-review-link, .communication-retry { font-size: 1.4rem; }
:focus-visible { outline: .3rem solid #137eba; outline-offset: .3rem; }
button:focus-visible, .btn:focus-visible { outline: .3rem solid #137eba; outline-offset: .3rem; }
button:disabled, input:disabled, select:disabled { cursor: not-allowed; }
.form-error-summary, .error-message, .contact-field-error, .invalid-feedback,
.valid-feedback, .message { font-size: 1.5rem; line-height: 1.5; }
.message { border-radius: .8rem; padding: 1.4rem 1.8rem; }
.form-error-summary { margin-top: 1rem; }

/* One calm visual language for public, account and staff pages. */
.auth-shell, .contact-shell { max-width: 116rem; margin: 1rem auto 3rem; box-shadow: var(--ui-shadow); }
.auth-intro, .contact-intro { padding: 3.2rem; }
.auth-intro { min-height: auto; }
.auth-intro h1, .contact-intro h1 { color: #fff; font-size: 3rem; }
.auth-intro > p:not(.auth-kicker), .contact-intro > p:not(.section-eyebrow) { font-size: 1.6rem; line-height: 1.6; }
.auth-intro-points, .contact-intro-points { font-size: 1.4rem; line-height: 1.6; gap: 1rem; }
.auth-kicker, .section-eyebrow, .hero-eyebrow { font-size: 1.4rem; line-height: 1.5; }
.auth-form-panel, .contact-form-panel { padding: 3.2rem; min-width: 0; }
.auth-form-heading, .contact-form-heading { margin-bottom: 2rem; }
.auth-form-heading p, .contact-form-heading p { font-size: 1.4rem; color: var(--ui-muted); }
.auth-form-heading h2, .contact-form-heading h2 { font-size: 2.6rem; }
.auth-help-text, .auth-form-support small, .contact-captcha-help, .contact-form-choice-help,
#contact-preference-help, .booking-sms-demo > div p, #booking-sms-demo-status {
    font-size: 1.4rem; line-height: 1.6; color: var(--ui-muted);
}
.contact-privacy-note { font-size: 1.4rem !important; }
.auth-captcha { display: block; }
.auth-captcha, .contact-captcha { max-width: 100%; overflow-x: auto; margin-block: 2rem; }
.auth-captcha .auth-help-text { text-align: left; margin-top: 1rem; }
.auth-form-support { font-size: 1.5rem; margin-block: 1.6rem; gap: .4rem; }
.auth-submit, .contact-submit { min-height: 4.8rem; }
.password-control { margin-bottom: 2rem; }
.password-control .input { margin-bottom: 0; }
.password-control input { padding-right: 12.5rem !important; }
.password-toggle { bottom: .2rem; right: .6rem; min-height: 4.4rem; padding: .7rem; font-size: 1.4rem; line-height: 1.4; }
/* Compact sign-in page: keep every control visible without clipping content.
   Error messages and enlarged text may still expand the page naturally. */
body:has(.auth-login) .top-nav { padding-block: 1.2rem; }
body:has(.auth-login) .main { padding-block: 1.2rem; }
.auth-login { max-width: 108rem; margin-block: 0; }
.auth-login .auth-intro, .auth-login .auth-form-panel { padding: 2.4rem; }
.auth-login .auth-intro h1 { font-size: 2.6rem; margin-bottom: 1.2rem; }
.auth-login .auth-intro > p:not(.auth-kicker) { font-size: 1.5rem; }
.auth-login .auth-kicker { margin-bottom: .8rem; }
.auth-login .auth-intro-points { margin-top: 1.6rem; }
.auth-login .auth-form-heading { margin-bottom: 1.2rem; }
.auth-login .auth-form-heading h2 { font-size: 2.4rem; margin-bottom: .6rem; }
.auth-login .auth-form-heading p { margin-bottom: .6rem; line-height: 1.45; }
.auth-login .auth-form-heading .section-eyebrow { font-size: 1.4rem; }
.auth-login .auth-form { margin-bottom: 0; }
.auth-login .auth-form label { font-size: 1.4rem; margin-bottom: .4rem; }
.auth-login .auth-form input { font-size: 1.5rem; min-height: 4rem; height: 4rem; padding-block: .7rem; }
.auth-login .input, .auth-login .password-control { margin-bottom: 1.2rem; }
.auth-login .password-control .input { margin-bottom: 0; }
.auth-login .password-toggle { min-height: 3.6rem; font-size: 1.4rem; }
.auth-login .auth-form-support { font-size: 1.4rem; margin-block: .8rem; gap: 0; }
.auth-login .auth-account-links { display: flex; justify-content: space-between; align-items: start; gap: 1.2rem; margin-block: .8rem; }
.auth-login .auth-account-links .auth-form-support { margin: 0; }
.auth-login .auth-account-links .auth-form-support:first-child { flex-shrink: 0; }
.auth-login .auth-account-links small { text-align: right; }
.auth-login .auth-captcha { display: flex; align-items: center; gap: 1.2rem; margin-block: 1.2rem; }
.auth-login .g-recaptcha { flex: 0 0 30.4rem; min-height: 7.8rem; }
.auth-login .auth-captcha .auth-help-text { margin: 0; flex: 1; }
.auth-login .auth-help-text { font-size: 1.4rem; line-height: 1.4; margin-top: 1rem; }
.auth-login .auth-submit { min-height: 4rem; padding-block: .8rem; font-size: 1.5rem; }
@media (max-width: 1100px) {
    .auth-login .auth-captcha { flex-wrap: wrap; }
    .auth-login .auth-captcha .auth-help-text { flex-basis: 100%; }
}
.auth-register { display: block; max-width: 62rem; }
.auth-register .auth-form-panel { max-width: none; }
.contact-shell { align-items: start; gap: 2.4rem; border: 0; background: transparent; box-shadow: none; }
.contact-intro, .contact-form-panel, .form-container, .listing, .view.content, .content,
.dashboard-simple-header, .error-container {
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius);
    box-shadow: var(--ui-shadow);
}
.contact-intro { border: 0; }
.contact-form-panel, .form-container, .listing, .view.content, .content, .error-container { background: #fff; }
.contact-form-panel { width: 100%; }
.form-container, .listing, .view.content, .content, .error-container { padding: 2.8rem; margin-block: 1rem 3rem; }
.form-container { max-width: 72rem; margin-inline: auto; }
.page-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.6rem; margin-bottom: 2rem; }
.page-header h1 { margin: 0; }
.page-header > div { display: flex; flex-wrap: wrap; gap: .8rem; }
.appointment-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; margin-block: 1.6rem; }
.contact-name-grid { align-items: start; row-gap: 0; }
.listing > br { display: none; }
.listing form[type=get] { margin-bottom: 2rem; }
.dashboard-simple { max-width: 116rem; margin: 1rem auto 3rem; }
.dashboard-simple-header { padding: 3rem; background: #fff; border-top: .4rem solid var(--color-monash-blue); gap: 2.4rem; }
.dashboard-user-summary { border-radius: .8rem; padding: 1.8rem; flex-basis: 27rem; }
.dashboard-stat-card, .care-card, .card { border-radius: var(--ui-radius); border-color: var(--ui-line); box-shadow: var(--ui-shadow); }
.dashboard-stat-card { padding: 2.4rem; gap: 1rem; }
.dashboard-stat-card strong { font-size: 2.6rem; overflow-wrap: anywhere; }
a.dashboard-stat-card { color: var(--color-monash-blue-dark); font-weight: 600; text-decoration: none; justify-content: center; }
a.dashboard-stat-card:hover { background: #edf6fc; border-color: #81b9d8; }
.dashboard-modules { padding: 2.4rem; background: #fff; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); }
.care-card { padding: 2.4rem; }
.care-card h2 { font-size: 2.4rem; }
.care-card h3 { font-size: 2rem; }
.care-card h4, .care-card legend { font-size: 1.8rem; }
.care-badge, .role-preview-status, .enquiry-status, .delivery-status, .slot-state,
.enquiry-metadata dt, .communication-meta, .communication-item-heading span,
.booking-results-heading span, .booking-result-card small, .booking-calendar-weekdays,
.booking-calendar-header button, .booking-time-grid button, .booking-selection-summary {
    font-size: 1.4rem;
}
.diary-pain-selection { display: flex; align-items: baseline; gap: .8rem; margin: .8rem 0 1.6rem; padding: 1rem 1.4rem; border: 1px solid #b8d8ec; border-radius: .7rem; background: #edf6fc; color: #18364a; font-size: 1.6rem; }
.diary-pain-selection output { font-size: 2.8rem; font-weight: 750; line-height: 1.2; color: #006fa6; }
.care-grid { gap: 2.4rem; }
.care-help, .role-account-card small, .dashboard-user-summary small, .dashboard-module-list small { color: var(--ui-muted); }
.manager-page-header { padding: 2.8rem; }
.manager-page-header .btn { font-size: 1.5rem; flex-shrink: 0; }
.manager-detail-grid > *, .care-grid > *, .dashboard-simple-header > *, .contact-name-grid > * { min-width: 0; }
.manager-detail-card, .manager-response-card { padding: 2.4rem; }
.hero-section { padding: 4.8rem; background: #eaf4fb; border-radius: var(--ui-radius); }
.hero-section .lead { max-width: 68rem; }
.card .card-body { padding: 2.4rem; }

/* Data stays legible: horizontal scrolling belongs to the table, not the page. */
table, .table { font-size: 1.5rem; color: var(--ui-text); margin-bottom: 1.6rem; }
table th, table td, .table > :not(caption) > * > * { padding: 1.4rem 1.6rem; vertical-align: middle; }
table th { background: #edf3f8; color: #304b60; font-weight: 650; }
table td { border-color: #e2eaf0; }
table tbody tr:hover { background: #f7fafc; }
.table-responsive { position: relative; border-radius: .8rem; max-width: 100%; }
.listing > table, .view.content > table { display: block; overflow-x: auto; width: 100%; }
.table-responsive:focus-visible { outline-offset: -.3rem; }
.actions { white-space: normal; }
.actions a { display: inline-block; margin: .3rem; }
.filter-actions, .appointment-filter-actions { flex-wrap: wrap; gap: 1rem; }
.slot-date-filter { flex-wrap: wrap; gap: 1.6rem; }
.slot-date-filter .input { min-width: 0; flex: 1 1 20rem; }
dl { margin-block: 2rem; }
dt { font-weight: 650; margin-top: 1.2rem; color: var(--ui-muted); }
dd { margin-left: 0; }
.error-container { max-width: 76rem; margin: 5rem auto; }
.booking-sms-demo { grid-template-columns: minmax(0, 1fr); }
.booking-sms-demo button { justify-self: start; }
.booking-calendar { max-width: 100%; }
.booking-calendar-header strong { font-size: 1.6rem; }
.booking-calendar-weekday, .booking-calendar-legend { font-size: 1.4rem; }
.booking-calendar-grid button { padding: .4rem; font-size: 1.4rem; }
.booking-planner-heading { gap: 1.2rem; flex-wrap: wrap; }
@media (max-width: 960px) {
    .auth-shell, .contact-shell, .manager-detail-grid { grid-template-columns: 1fr; }
    .auth-intro, .contact-intro { padding: 3rem; }
    .auth-intro-points, .contact-intro-points { margin-top: 2rem; }
    .auth-form-panel, .contact-form-panel { padding: 3rem; }
    .dashboard-simple-header { flex-direction: column; }
    .dashboard-user-summary { width: 100%; flex-basis: auto; }
}
@media (max-width: 600px) {
    .container { padding-inline: 1.2rem; }
    .main { padding-top: 1.2rem; }
    .top-nav { flex-wrap: wrap; gap: 1.4rem; }
    .top-nav-links { width: 100%; justify-content: flex-start; }
    .top-nav-links .nav-user-name { text-align: left; }
    .top-nav-links .btn { padding: 1rem 1.2rem; }
    .auth-intro, .contact-intro { padding: 2.4rem; }
    .auth-form-panel, .contact-form-panel { padding: 2.4rem 1.2rem; }
    .form-container, .listing, .view.content, .content, .care-card, .dashboard-simple-header,
    .dashboard-modules, .manager-page-header, .manager-detail-card, .manager-response-card,
    .communication-history { padding: 2rem 1.6rem; }
    .hero-section { padding: 3rem 2rem; }
    .dashboard-stat-grid { grid-template-columns: 1fr; }
    .page-header { align-items: flex-start; flex-direction: column; }
    .care-grid, .care-two-columns, .care-client-grid { grid-template-columns: 1fr; }
    .appointment-detail-grid { grid-template-columns: 1fr; }
    .error-container { margin: 2rem 1.2rem; }
}