@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,600&display=swap");

.patient-app-shell {
    display: grid;
    grid-template-columns: 224px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    min-height: calc(100vh - 106px);
}

body > .topbar {
    height: 78px;
    padding: 0 clamp(18px, 4vw, 54px);
    background: rgba(245, 245, 245, .97);
}

body > .topbar .brand img { width: 154px; height: 58px; }

body > .page {
    max-width: none;
    margin: 0;
    padding: 0;
}

.patient-topbar-profile {
    display: flex;
    align-items: center;
    gap: 12px;
}
.patient-topbar-actions { display: flex; align-items: center; gap: 14px; }
.patient-notifications { position: relative; }
.patient-notifications > summary { position: relative; display: grid; width: 44px; height: 44px; place-items: center; color: #073f78; background: #fff; border: 1px solid #cedde5; border-radius: 12px; cursor: pointer; list-style: none; }
.patient-notifications > summary::-webkit-details-marker { display: none; }
.patient-notifications > summary .ui-icon { width: 21px; height: 21px; }
.patient-notifications > summary > strong { position: absolute; top: -7px; right: -7px; min-width: 21px; height: 21px; padding: 0 5px; display: grid; place-items: center; color: #fff; background: #cf4b46; border: 2px solid #fff; border-radius: 999px; font-size: 10px; line-height: 1; }
.patient-notifications[open] > summary { color: #fff; background: #073f78; border-color: #073f78; }
.patient-notifications-popover { position: absolute; top: calc(100% + 12px); right: 0; z-index: 80; width: min(390px, calc(100vw - 28px)); max-height: min(560px, calc(100vh - 125px)); overflow: auto; background: #fff; border: 1px solid #d7e2e8; border-radius: 18px; box-shadow: 0 20px 50px rgba(5,47,95,.2); }
.patient-notifications-popover > header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; background: #fff; border-bottom: 1px solid #e1e8ec; }
.patient-notifications-popover > header span { color: #078a82; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.patient-notifications-popover > header h2 { margin: 2px 0 0; color: #052f5f; font: 600 23px/1.1 "Fraunces", Georgia, serif; }
.patient-notifications-popover > header > strong { display: grid; min-width: 30px; height: 30px; padding: 0 8px; place-items: center; color: #fff; background: #073f78; border-radius: 999px; }
.patient-notifications-popover > a { display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 14px 18px; color: inherit; text-decoration: none; border-bottom: 1px solid #edf1f3; }
.patient-notifications-popover > a:hover { background: #f2f8f8; }
.patient-notifications-popover > a > span { display: grid; width: 36px; height: 36px; place-items: center; color: #087f78; background: #e1f3f1; border-radius: 10px; }
.patient-notifications-popover > a .ui-icon { width: 18px; height: 18px; }
.patient-notifications-popover > a div { display: grid; gap: 3px; }
.patient-notifications-popover > a div strong { color: #123c5c; font-size: 13px; }
.patient-notifications-popover > a div small { color: #677b88; font-size: 11px; line-height: 1.35; }
.patient-notifications-popover > a > i { color: #78909d; font-style: normal; font-size: 20px; }
.patient-notifications-empty { min-height: 170px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 24px; color: #627985; text-align: center; }
.patient-notifications-empty .ui-icon { width: 30px; height: 30px; color: #0b948b; }
.patient-notifications-empty strong { color: #123c5c; }

.patient-topbar-profile form { margin: 0; }

.patient-topbar-profile form button {
    min-height: 38px;
    white-space: nowrap;
}

.portal-demo-banner {
    min-height: 30px;
    padding: 6px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #e8f8f7;
    background: #063b62;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .02em;
}

.portal-demo-banner .status-dot {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #27c7b8;
    box-shadow: 0 0 0 4px rgba(39, 199, 184, .14);
}

.patient-topbar-profile > span {
    display: grid;
    gap: 2px;
    text-align: right;
}

.patient-topbar-profile strong {
    color: #052f5f;
    font-size: 13px;
}

.patient-topbar-profile small {
    color: #687985;
    font-size: 9px;
}

.patient-topbar-profile i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    color: #073f78;
    background: #ddecf5;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.patient-app-sidebar {
    position: sticky;
    top: 0;
    height: calc(100vh - 106px);
    min-height: 620px;
    padding: 28px 15px 20px;
    display: flex;
    flex-direction: column;
    border: 0;
    border-right: 1px solid var(--line);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}

.patient-app-sidebar nav { display: grid; gap: 5px; }

.patient-app-sidebar nav a,
.patient-sidebar-logout button {
    width: 100%;
    min-height: 44px;
    border: 0;
    border-radius: 10px;
    padding: 0 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #557084;
    background: transparent;
    text-align: left;
    text-decoration: none;
    font-size: 12px;
    cursor: pointer;
}

.patient-app-sidebar nav a:hover { color: #073f78; background: #edf7f7; }
.patient-app-sidebar nav a.active {
    color: #073f78;
    background: #e4f2f6;
    box-shadow: inset 3px 0 #10b9aa;
    font-weight: 700;
}
.patient-app-sidebar nav a span,
.patient-sidebar-logout button span { width: 22px; text-align: center; font-size: 17px; }
.patient-sidebar-help { margin-top: auto; padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: #f7fafb; }
.patient-sidebar-help strong { color: #052f5f; font-size: 12px; }
.patient-sidebar-help p { margin: 6px 0; color: #687985; font-size: 10px; line-height: 1.45; }
.patient-sidebar-help small { color: #a34b3b; font-size: 9px; }
.patient-sidebar-logout { margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.patient-sidebar-sos {
  width: 100%; min-height: 48px;
  margin: auto 0 8px; padding: 0 12px;
  display: flex; align-items: center; gap: 11px;
  color: #8c2f29; background: #fff1ee; border: 1px solid #f0c4bd;
  border-radius: 10px; text-decoration: none;
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.patient-sidebar-sos:hover, .patient-sidebar-sos.active {
  color: #fff; background: #a64038; border-color: #c8665e;
  box-shadow: inset 3px 0 #ffb1aa;
}
.patient-sidebar-sos:focus-visible { outline: 3px solid #f0c4bd; outline-offset: 2px; }
.patient-sidebar-sos span { display: grid; width: 21px; height: 21px; place-items: center; }
.patient-sidebar-sos .ui-icon { width: 20px; height: 20px; }
.patient-sidebar-sos strong { font-size: 13px; font-weight: 700; letter-spacing: .035em; }
.patient-sidebar-logout button { color: #fff; background: #073f78; font-weight: 700; }
.patient-sidebar-logout button:hover { background: #052f5f; }

.patient-sos-section { max-width: 980px; margin-inline: auto; }
.patient-sos-heading { max-width: 760px; margin-bottom: 24px; }
.patient-sos-heading h1 { margin: 5px 0 10px; color: #052f5f; font: 600 clamp(36px, 5vw, 52px)/1.05 "Fraunces", Georgia, serif; }
.patient-sos-heading p { margin: 0; color: #637886; font-size: 15px; line-height: 1.55; }
.patient-sos-notice { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 16px; align-items: center; padding: 19px 20px; border: 1px solid #efc0b9; border-radius: 16px; background: #fff4f1; color: #6f302b; }
.patient-sos-notice > span { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 13px; background: #f7d9d3; }
.patient-sos-notice .ui-icon { width: 23px; height: 23px; }
.patient-sos-notice strong { display: block; margin-bottom: 4px; color: #7f2924; font-size: 14px; }
.patient-sos-notice p { margin: 0; font-size: 13px; line-height: 1.55; }
.patient-sos-section > h2 { margin: 30px 0 16px; color: #052f5f; font: 600 24px/1.2 "Fraunces", Georgia, serif; }
.patient-sos-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.patient-sos-resource { min-width: 0; padding: 20px; display: grid; grid-template-columns: 46px minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: 0 14px; border: 1px solid #d7e2e8; border-radius: 16px; background: #fff; box-shadow: 0 8px 22px rgba(5,47,95,.07); }
.patient-sos-resource-icon { grid-row: 1 / 3; display: grid; width: 46px; height: 46px; place-items: center; color: #a64038; background: #fff0ed; border-radius: 13px; }
.patient-sos-resource-icon .ui-icon { width: 23px; height: 23px; }
.patient-sos-resource-copy h3 { margin: 1px 0 7px; color: #052f5f; font: 600 19px/1.25 "Fraunces", Georgia, serif; }
.patient-sos-resource-copy p { margin: 0; color: #526a79; font-size: 13px; line-height: 1.5; }
.patient-sos-call-actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 9px; margin-top: 18px; }
.patient-sos-call-actions a { min-height: 52px; padding: 8px 13px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #fff; background: #073f78; border-radius: 11px; text-decoration: none; box-shadow: 0 6px 14px rgba(5,47,95,.13); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.patient-sos-call-actions a:hover { background: #052f5f; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(5,47,95,.18); }
.patient-sos-call-actions a:focus-visible { outline: 3px solid rgba(32,191,178,.34); outline-offset: 2px; }
.patient-sos-call-actions a > span { min-width: 0; display: grid; gap: 1px; }
.patient-sos-call-actions a strong { font-size: 15px; letter-spacing: .01em; }
.patient-sos-call-actions a small { color: #dcebf4; font-size: 10px; }
.patient-sos-call-actions a > .ui-icon { width: 19px; height: 19px; }
.patient-sos-footer { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 15px; align-items: center; margin-top: 22px; padding: 20px; color: #173d59; background: #edf7f6; border: 1px solid #bfe2df; border-radius: 16px; }
.patient-sos-footer > span { display: grid; width: 46px; height: 46px; place-items: center; color: #087f78; background: #d4efec; border-radius: 13px; }
.patient-sos-footer .ui-icon { width: 23px; height: 23px; }
.patient-sos-footer strong { display: block; margin-bottom: 4px; color: #105d62; font-size: 14px; }
.patient-sos-footer p { margin: 0; font-size: 13px; line-height: 1.55; }

@media (max-width: 760px) {
  .patient-sos-grid { grid-template-columns: 1fr; }
  .patient-sos-heading { margin-bottom: 20px; }
  .patient-sos-heading h1 { font-size: 36px; }
  .patient-sos-heading p { font-size: 14px; }
  .patient-sos-notice, .patient-sos-footer { grid-template-columns: 42px minmax(0, 1fr); gap: 12px; padding: 16px; }
  .patient-sos-notice > span, .patient-sos-footer > span { width: 42px; height: 42px; }
  .patient-sos-section > h2 { margin-top: 26px; font-size: 22px; }
  .patient-sos-resource { padding: 17px; grid-template-columns: 42px minmax(0, 1fr); gap: 0 12px; }
  .patient-sos-resource-icon { width: 42px; height: 42px; }
  .patient-sos-call-actions { margin-top: 16px; }
  .patient-sos-call-actions a { min-height: 54px; }
  .patient-mobile-sos { color: #ffd4ce !important; }
  .patient-mobile-sos.active { color: #fff !important; background: #9f4139 !important; }
}
.patient-app-content {
    width: 100%;
    max-width: 1250px;
    min-width: 0;
    margin: 0 auto;
    padding: clamp(28px, 4vw, 52px);
}
.patient-panel[hidden] { display: none !important; }
.patient-section { margin-top: 0; }
.patient-mobile-nav { display: none; }
.patient-mobile-logout { display: none; }

.patient-portal-heading { margin-bottom: 20px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.patient-portal-heading h1 { margin: 4px 0 7px; color: #052f5f; font: 700 clamp(30px, 4vw, 42px)/1.08 Georgia, serif; }
.patient-portal-heading p,
.patient-section-heading p { margin: 0; color: #687985; font-size: 13px; }
.patient-portal-heading time { min-width: 105px; padding: 12px 15px; border-left: 3px solid #10b9aa; background: rgba(255,255,255,.55); }
.patient-portal-heading time strong,
.patient-portal-heading time span { display: block; }
.patient-portal-heading time strong { color: #073f78; font: 700 27px/1 Georgia, serif; }
.patient-portal-heading time span { margin-top: 4px; color: #687985; font-size: 9px; letter-spacing: .07em; }

.patient-onboarding-card { margin-bottom: 18px; padding: 19px; border: 1px solid #efd4a3; border-radius: 18px; background: linear-gradient(100deg, #fff8eb, #fff 58%); box-shadow: 0 8px 24px rgba(5,47,95,.05); }
.patient-onboarding-card > header { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.patient-onboarding-card h2 { margin: 4px 0; color: #052f5f; font: 700 20px/1.2 Georgia, serif; }
.patient-onboarding-card p { margin: 0; color: #687985; font-size: 10px; }
.patient-onboarding-card > header > strong { color: #9a6518; font: 700 25px/1 Georgia, serif; }
.patient-onboarding-progress { height: 7px; margin: 15px 0; overflow: hidden; border-radius: 999px; background: #f0e4cb; }
.patient-onboarding-progress i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #10b9aa, #0b7ea1); }
.patient-onboarding-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.patient-onboarding-steps a { min-width: 0; padding: 11px; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 3px 9px; align-items: center; border: 1px solid #ead8b6; border-radius: 11px; color: #052f5f; background: rgba(255,255,255,.75); text-decoration: none; }
.patient-onboarding-steps a > span { grid-row: 1 / 3; width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; color: white; background: #d98b18; font-weight: 800; }
.patient-onboarding-steps a.complete { border-color: #c7e6df; }
.patient-onboarding-steps a.complete > span { background: #0f9685; }
.patient-onboarding-steps strong,
.patient-onboarding-steps small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.patient-onboarding-steps strong { font-size: 10px; }
.patient-onboarding-steps small { color: #687985; font-size: 8px; }
.patient-onboarding-complete { margin-bottom: 18px; padding: 15px 18px; display: flex; align-items: center; gap: 12px; border: 1px solid #b8dfd4; border-radius: 15px; background: linear-gradient(90deg, #eef9f6, #fff 52%); }
.patient-onboarding-complete > span { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 10px; color: white; background: #158777; font-weight: 800; }
.patient-onboarding-complete strong,
.patient-onboarding-complete small { display: block; }
.patient-onboarding-complete strong { color: #052f5f; font-size: 12px; }
.patient-onboarding-complete small { margin-top: 3px; color: #687985; font-size: 9px; }
.patient-activation-alert { margin-bottom: 18px; padding: 15px 17px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; align-items: center; border: 1px solid #efd4a3; border-radius: 15px; background: #fff9ec; }
.patient-activation-alert > span { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 10px; color: white; background: #d98b18; font-weight: 800; }
.patient-activation-alert strong, .patient-activation-alert small { display: block; }
.patient-activation-alert strong { color: #052f5f; font-size: 12px; }
.patient-activation-alert small { margin-top: 4px; color: #687985; font-size: 9px; }
.patient-activation-alert a { text-decoration: none; }
.patient-consent-signature-alert {
    position: relative;
    margin-bottom: 18px;
    padding: 21px 22px 21px 25px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    overflow: hidden;
    border: 1px solid #efd4a3;
    border-radius: 17px;
    background:
        radial-gradient(circle at 96% 0, rgba(217, 139, 24, .12), transparent 24%),
        linear-gradient(110deg, #fff8e9 0%, #ffffff 64%);
    box-shadow: 0 10px 25px rgba(154, 101, 24, .08);
}
.patient-consent-signature-alert::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    content: "";
    background: linear-gradient(180deg, #efaa36, #d98b18);
}
.patient-consent-signature-alert > header { display: flex; align-items: center; gap: 16px; }
.patient-consent-signature-alert .patient-consent-signature-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: grid;
    place-items: center;
    border: 5px solid rgba(255, 255, 255, .62);
    border-radius: 50%;
    color: #ffffff;
    background: linear-gradient(145deg, #efa92e, #d98b18);
    box-shadow: 0 6px 14px rgba(185, 112, 12, .22);
    font-size: 20px;
    font-weight: 800;
}
.patient-consent-signature-alert header small {
    display: block;
    margin-bottom: 5px;
    color: #a3670d;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}
.patient-consent-signature-alert h2 {
    margin: 0 0 6px;
    color: #052f5f;
    font: 700 clamp(19px, 2vw, 24px)/1.2 Georgia, serif;
}
.patient-consent-signature-alert p { max-width: 720px; margin: 0; color: #536b79; font-size: 12px; line-height: 1.55; }
.patient-consent-signature-alert footer { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
.patient-consent-signature-alert a {
    min-height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    border-radius: 11px;
    text-decoration: none;
    white-space: nowrap;
}
.patient-consent-signature-alert .patient-consent-signature-primary {
    padding: 0 17px;
    border-color: #d98b18;
    color: #ffffff;
    background: #d98b18;
    box-shadow: 0 7px 15px rgba(185, 112, 12, .2);
}
.patient-consent-signature-alert .patient-consent-signature-primary:hover { border-color: #bd7410; background: #bd7410; }
.patient-consent-signature-alert .patient-consent-signature-primary i { font-size: 17px; font-style: normal; }

.patient-portal-summary { margin-bottom: 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.patient-portal-summary article { min-height: 88px; padding: 16px; display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 15px; background: white; box-shadow: 0 8px 22px rgba(5,47,95,.05); }
.patient-portal-summary article > span { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: #073f78; background: #e9f6f7; font-size: 17px; }
.patient-portal-summary strong,
.patient-portal-summary small { display: block; }
.patient-portal-summary strong { color: #052f5f; font: 700 23px/1 Georgia, serif; }
.patient-portal-summary small { margin-top: 5px; color: #687985; font-size: 9px; }

.patient-portal-home-grid,
.patient-session-grid,
.patient-document-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.patient-portal-card,
.patient-document-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(5,47,95,.05); }
.patient-portal-card > header { min-height: 72px; padding: 17px 19px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.patient-portal-card h2,
.patient-portal-card h3 { margin: 0 0 4px; color: #052f5f; font: 700 18px/1.2 Georgia, serif; }
.patient-portal-card header p { margin: 0; color: #687985; font-size: 10px; }
.patient-next-session { padding-bottom: 17px; }
.patient-next-session-content { min-height: 104px; padding: 22px 19px; display: flex; align-items: center; gap: 14px; }
.patient-next-session-content > span { width: 43px; height: 43px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 13px; color: #073f78; background: #e9f6f7; font-size: 20px; }
.patient-next-session-content strong,
.patient-next-session-content small { display: block; }
.patient-next-session-content strong { color: #052f5f; font-size: 13px; }
.patient-next-session-content small { margin-top: 6px; color: #687985; font-size: 10px; }
.patient-next-session-content .status-pill { margin-left: auto; white-space: nowrap; }
.patient-next-session-actions { padding: 0 19px; display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.patient-next-session-actions > a { margin: 0; text-decoration: none; }
.patient-next-session-actions .change-request-pending { margin: 0; }
.patient-action-list { padding: 5px 18px 12px; }
.patient-action-list a { min-height: 65px; padding: 10px 2px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 11px; align-items: center; border-bottom: 1px solid #e9edf0; color: inherit; text-decoration: none; }
.patient-action-list a:last-child { border-bottom: 0; }
.patient-action-list a > span { width: 25px; height: 25px; display: grid; place-items: center; border: 2px solid #b8c9d3; border-radius: 7px; color: #073f78; font-size: 10px; }
.patient-action-list a.pending-action > span { border-color: #d98b18; color: #ffffff; background: #d98b18; }
.patient-action-list a.pending-action > i { color: #b36d0b; }
.patient-action-list strong,
.patient-action-list small { display: block; }
.patient-action-list strong { color: #052f5f; font-size: 11px; }
.patient-action-list small { margin-top: 4px; color: #687985; font-size: 9px; }
.patient-action-list i { color: #073f78; font-size: 19px; font-style: normal; }

.patient-section-heading { margin-bottom: 16px; }
.patient-section-heading h2 { margin: 4px 0 6px; color: #052f5f; font: 700 28px/1.1 Georgia, serif; }
.patient-session-list { padding: 5px 18px 12px; }
.patient-session-list > div { min-height: 82px; padding: 12px 2px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 13px; align-items: center; border-bottom: 1px solid #e9edf0; }
.patient-session-list > div:last-child { border-bottom: 0; }
.patient-session-list time { width: 48px; height: 52px; display: grid; place-items: center; align-content: center; border-radius: 11px; color: #073f78; background: #e9f6f7; }
.patient-session-list time strong,
.patient-session-list time small,
.patient-session-list > div > span strong,
.patient-session-list > div > span small { display: block; }
.patient-session-list time strong { font: 700 19px/1 Georgia, serif; }
.patient-session-list time small { margin-top: 3px; font-size: 8px; }
.patient-session-list > div > span strong { color: #052f5f; font-size: 11px; }
.patient-session-list > div > span small { margin-top: 5px; color: #687985; font-size: 9px; }
.patient-session-list em,
.patient-questionnaire-list em { padding: 5px 8px; border-radius: 999px; color: #126355; background: #e8f5f1; font-size: 8px; font-style: normal; font-weight: 700; }
.patient-session-list em.cancelled { color: #8c3d31; background: #fff0ed; }
.patient-info-note,
.patient-locked-note { margin-top: 13px; padding: 13px 15px; border: 1px solid #cfe5ea; border-radius: 12px; color: #486c7b; background: #f1fafb; font-size: 10px; line-height: 1.5; }
.patient-locked-note { border-color: #efd4a3; color: #7a581e; background: #fff9ec; }

.patient-task-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.patient-task-card { min-height: 190px; padding: 17px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 15px; background: white; box-shadow: 0 8px 22px rgba(5,47,95,.05); }
.patient-task-card header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.patient-task-card header span { color: #087d8f; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.patient-task-card header em { padding: 5px 8px; border-radius: 999px; color: #7a581e; background: #fff2cf; font-size: 8px; font-style: normal; font-weight: 700; }
.patient-task-card h3 { margin: 18px 0 7px; color: #052f5f; font-size: 14px; }
.patient-task-card p { margin: 0 0 15px; color: #687985; font-size: 11px; line-height: 1.5; }
.patient-task-card footer { margin-top: auto; padding-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #e9edf0; color: #687985; font-size: 9px; }
.patient-task-card footer a { min-height: 34px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; color: #fff; background: #073f78; text-decoration: none; font-size: 9px; font-weight: 800; white-space: nowrap; }
.patient-subsection-heading { margin: 25px 0 11px; display: flex; align-items: center; gap: 8px; }
.patient-subsection-heading h3 { margin: 0; color: #052f5f; font: 700 19px/1.2 Georgia, serif; }
.patient-subsection-heading span { min-width: 23px; padding: 4px 7px; border-radius: 999px; color: #087d8f; background: #e9f6f7; text-align: center; font-size: 9px; }
.patient-questionnaire-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.patient-questionnaire-list article { min-width: 0; padding: 14px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 11px; align-items: center; border: 1px solid var(--line); border-radius: 13px; background: white; }
.patient-questionnaire-list article > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #073f78; background: #e9f6f7; }
.patient-questionnaire-list strong,
.patient-questionnaire-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.patient-questionnaire-list strong { color: #052f5f; font-size: 11px; }
.patient-questionnaire-list small { margin-top: 4px; color: #687985; font-size: 9px; }
.patient-next-session-note-card {
    margin-top: 18px;
    padding: 22px;
    display: grid;
    grid-template-columns: minmax(250px, .8fr) minmax(320px, 1.2fr);
    gap: 24px;
    align-items: center;
    border: 1px solid #b9ded8;
    border-radius: 18px;
    background: linear-gradient(120deg, #edf9f6 0%, #ffffff 62%);
    box-shadow: 0 8px 24px rgba(5,47,95,.055);
}
.patient-next-session-note-card > header { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 14px; align-items: start; }
.patient-next-session-note-card > header > span { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; color: #087f76; background: #ccefeb; }
.patient-next-session-note-card > header small { color: #087f76; font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.patient-next-session-note-card h2 { margin: 4px 0 7px; color: #052f5f; font: 650 22px/1.2 "Fraunces", Georgia, serif; }
.patient-next-session-note-card p { margin: 0; color: #587181; font-size: 12px; line-height: 1.55; }
.patient-next-session-note-card form { display: grid; gap: 10px; }
.patient-next-session-note-card textarea { width: 100%; min-height: 88px; resize: vertical; padding: 13px 14px; border: 1px solid #b9ced5; border-radius: 12px; color: #17344e; background: #fff; font: 13px/1.55 "DM Sans", system-ui, sans-serif; }
.patient-next-session-note-card textarea:focus { outline: 3px solid rgba(16,185,170,.15); border-color: #10a99d; }
.patient-next-session-note-card form footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.patient-next-session-note-card form small { color: #687985; font-size: 10px; }
.patient-next-session-note-card button { min-width: 112px; }
.patient-onboarding-complete.is-final { margin: 18px 0 0; }
.patient-next-steps-tabs { width: min(560px, 100%); margin: 0 0 16px; padding: 4px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; border: 1px solid #cbdde2; border-radius: 14px; background: #f3f7f8; }
.patient-next-steps-tabs button { min-height: 46px; padding: 9px 14px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 10px; color: #607684; background: transparent; font: 800 12px "DM Sans", system-ui, sans-serif; cursor: pointer; }
.patient-next-steps-tabs button span { min-width: 24px; padding: 4px 7px; border-radius: 999px; color: #557280; background: #e4edef; font-size: 9px; text-align: center; }
.patient-next-steps-tabs button.is-active { color: #fff; background: #0b4d87; box-shadow: 0 6px 16px rgba(5, 47, 95, .16); }
.patient-next-steps-tabs button.is-active span { color: #075f5a; background: #dff4f0; }
.patient-next-steps-tabs button:focus-visible { outline: 3px solid rgba(11, 77, 135, .2); outline-offset: 2px; }
.patient-next-steps-groups { display: block; }
.patient-next-steps-group[hidden] { display: none; }
.patient-next-steps-group { padding: 22px; scroll-margin-top: 24px; border: 1px solid var(--patient-line, #d8e3e8); border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(5,47,95,.05); }
.patient-next-steps-group-header { margin-bottom: 18px; padding-bottom: 16px; display: flex; align-items: center; gap: 13px; border-bottom: 1px solid #e4ecef; }
.patient-next-steps-group-header > span { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: #073f78; background: #e9f6f7; }
.patient-next-steps-group-header h2 { margin: 0 0 4px; color: #052f5f; font: 650 23px/1.2 "Fraunces", Georgia, serif; }
.patient-next-steps-group-header p { margin: 0; color: #687985; font-size: 12px; }
.patient-worked-tools-tabs { margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.patient-worked-tools-tabs button { min-height:40px; padding:8px 15px; display:inline-flex; align-items:center; gap:8px; border:1px solid #c9dce1; border-radius:999px; color:#486879; background:#fff; font:750 11px "DM Sans",system-ui,sans-serif; cursor:pointer; }
.patient-worked-tools-tabs button span { min-width:22px; padding:3px 6px; border-radius:999px; color:#557280; background:#edf3f5; font-size:9px; text-align:center; }
.patient-worked-tools-tabs button.is-active { border-color:#087f76; color:#fff; background:#087f76; box-shadow:0 6px 16px rgba(8,127,118,.16); }
.patient-worked-tools-tabs button.is-active span { color:#075f5a; background:#dff4f0; }
.patient-worked-tools-list { display: grid; gap: 14px; }
.patient-worked-tool-entry { position:relative; min-width:0; }
.patient-worked-tool-entry[hidden] { display:none; }
.patient-worked-tool-entry > .patient-worked-tool-card { height:100%; }
.patient-tool-favorite-form { position:absolute; z-index:4; top:16px; right:18px; margin:0; }
.patient-tool-favorite-button { width:42px; height:42px; display:grid; place-items:center; border:1px solid #cadde1; border-radius:50%; color:#486879; background:rgba(255,255,255,.94); box-shadow:0 5px 14px rgba(5,47,95,.09); cursor:pointer; transition:transform .16s ease,border-color .16s ease,color .16s ease,background .16s ease; }
.patient-tool-favorite-button span { font:400 24px/1 Georgia,serif; transform:translateY(-1px); }
.patient-tool-favorite-button:hover { transform:translateY(-2px); border-color:#d46a73; color:#bd3f4b; }
.patient-tool-favorite-button.is-favorite { border-color:#e4a3aa; color:#bd3f4b; background:#fff0f2; }
.patient-tool-favorite-button:focus-visible { outline:3px solid rgba(189,63,75,.18); outline-offset:2px; }
.patient-worked-tool-entry > details > summary { padding-right:78px; }
.patient-psychoeducation-document > header { padding-right:82px; }
.patient-favorites-empty { padding:42px 24px; display:grid; justify-items:center; gap:8px; border:1px dashed #bfd5d9; border-radius:17px; color:#607987; background:#f8fbfb; text-align:center; }
.patient-favorites-empty[hidden] { display:none; }
.patient-favorites-empty > span { color:#bd3f4b; font:400 34px/1 Georgia,serif; }
.patient-favorites-empty strong { color:#052f5f; font:650 18px/1.3 "Fraunces",Georgia,serif; }
.patient-favorites-empty p { margin:0; font-size:11px; }
.patient-worked-tool-card { overflow: hidden; border: 1px solid #cbdedf; border-radius: 17px; background: #fff; box-shadow: 0 8px 22px rgba(5,47,95,.055); }
.patient-worked-tool-card > summary { min-height: 108px; padding: 18px 20px; display: grid; grid-template-columns: 44px minmax(0,1fr) auto; gap: 14px; align-items: center; cursor: pointer; list-style: none; }
.patient-worked-tool-card > summary::-webkit-details-marker { display: none; }
.patient-worked-tool-card > summary > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: #087f76; background: #e7f6f3; }
.patient-worked-tool-card > summary small, .patient-worked-tool-card > summary strong, .patient-worked-tool-card > summary p { display: block; margin: 0; }
.patient-worked-tool-card > summary small { color: #087b78; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.patient-worked-tool-card > summary strong { margin-top: 5px; color: #052f5f; font: 650 20px/1.2 Georgia, serif; }
.patient-worked-tool-card > summary p { margin-top: 5px; color: #617681; font-size: 11px; line-height: 1.5; }
.patient-worked-tool-card > summary > i { color: #087f76; font-size: 22px; font-style: normal; transition: transform .18s ease; }
.patient-worked-tool-card[open] > summary > i { transform: rotate(180deg); }
.patient-chain-document { position: relative; padding: 4px 22px 18px; display: grid; }
.patient-chain-document::before { position: absolute; top: 26px; bottom: 38px; left: 41px; width: 3px; content: ""; border-radius: 3px; background: #c5dfdb; }
.patient-chain-document > article { position: relative; min-width: 0; padding: 12px 0; display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; }
.patient-chain-document > article > span { position: relative; z-index: 1; width: 40px; height: 40px; display: grid; place-items: center; border: 6px solid #fff; border-radius: 50%; color: #fff; background: #168a80; font-size: 9px; font-weight: 850; box-shadow: 0 0 0 2px #8cc7c0; }
.patient-chain-document > article.is-intervention > span { background: #c48119; box-shadow: 0 0 0 2px #e1bd71; }
.patient-chain-document > article > div { padding: 12px 14px; border: 1px solid #d5e2e3; border-radius: 12px; background: #f9fcfb; }
.patient-chain-document > article.is-intervention > div { border-color: #ead3a2; background: #fffaf0; }
.patient-chain-document small { color: #087b78; font-size: 9px; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.patient-chain-document p { margin: 6px 0 0; color: #294c5d; font-size: 12px; line-height: 1.6; white-space: pre-line; }
.patient-chain-document dl { margin: 11px 0 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.patient-chain-document dl > div { padding: 8px 9px; border-radius: 8px; background: #fff; }
.patient-chain-document dt { color: #667c85; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.patient-chain-document dd { margin: 3px 0 0; color: #173e55; font-size: 10px; line-height: 1.45; }
.patient-chain-document aside { margin-top: 10px; padding: 10px; border: 1px solid #e4c882; border-radius: 9px; color: #75571f; background: #fff7e4; }
.patient-chain-document aside strong { font-size: 9px; text-transform: uppercase; }
.patient-worked-tool-card > footer { padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #dce6e7; color: #687d85; background: #f6f9f9; font-size: 9px; }
.patient-psychoeducation-document { position:relative; isolation:isolate; display:grid; overflow:hidden; border-color:#b9deda; background:linear-gradient(125deg,#f2fbf9 0%,#fff 56%,#f4f8fc 100%); box-shadow:0 14px 34px rgba(5,47,95,.08); }
.patient-psychoeducation-accent { position:absolute; z-index:-1; top:-70px; right:-45px; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,rgba(93,194,181,.2),rgba(93,194,181,0) 70%); }
.patient-psychoeducation-document > header { min-height:132px; padding:25px 26px 22px; display:grid; grid-template-columns:58px minmax(0,1fr); gap:18px; align-items:start; }
.patient-psychoeducation-icon { width:58px; height:58px; display:grid; place-items:center; border:1px solid #a9d8d2; border-radius:17px; color:#087f76; background:linear-gradient(145deg,#dff5f1,#fff); box-shadow:0 7px 18px rgba(8,127,118,.1); }
.patient-psychoeducation-icon .ui-icon { width:27px; height:27px; }
.patient-psychoeducation-document > header small { display:inline-flex; width:max-content; max-width:100%; margin-bottom:8px; padding:5px 9px; border-radius:999px; color:#08766f; background:#dff4f0; font-size:9px; font-weight:850; letter-spacing:.075em; text-transform:uppercase; }
.patient-psychoeducation-document > header strong { display:block; color:#052f5f; font:650 clamp(20px,2.2vw,27px)/1.18 "Fraunces",Georgia,serif; }
.patient-psychoeducation-document > header p { max-width:680px; margin:9px 0 0; color:#587181; font-size:12px; line-height:1.6; }
.patient-psychoeducation-document > footer { padding:15px 26px; background:rgba(255,255,255,.72); }
.patient-psychoeducation-document > footer > span { line-height:1.5; }
.patient-psychoeducation-document > footer > span strong { color:#315566; }
.patient-psychoeducation-open { min-height:42px; gap:8px; padding:9px 15px; border-color:#087f76; color:#fff; background:#087f76; font-size:10px; }
.patient-tool-pdf-link.patient-psychoeducation-open:hover { border-color:#066d66; color:#fff; background:#066d66; }
.patient-psychoeducation-open .ui-icon { width:15px; height:15px; }
.patient-psychoeducation-open i { font-size:13px; font-style:normal; }
.patient-tool-pdf-link { flex: 0 0 auto; min-height: 36px; padding: 8px 13px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #9fcac6; border-radius: 9px; color: #075f5a; background: #fff; font-size: 9px; font-weight: 850; text-decoration: none; }
.patient-tool-pdf-link:hover { border-color: #168a80; background: #eef9f7; }
@media (max-width: 640px) {
  .patient-psychoeducation-document > header { grid-template-columns:46px minmax(0,1fr); gap:13px; padding:20px 18px; }
  .patient-psychoeducation-icon { width:46px; height:46px; border-radius:14px; }
  .patient-psychoeducation-document > footer { padding:14px 18px; align-items:stretch; flex-direction:column; }
  .patient-psychoeducation-open { width:100%; }
}
.patient-missing-links-plan { border-top: 5px solid #315d9b; }
.patient-crisis-plan-card { border-top: 5px solid #087f76; }
.patient-crisis-plan-document { padding: 0 20px 20px; display: grid; gap: 12px; }
.patient-crisis-plan-document > section { padding: 16px; border: 1px solid #d4e3e4; border-left: 4px solid #168a80; border-radius: 12px; background: #fbfdfd; }
.patient-crisis-plan-document h4, .patient-crisis-plan-document p { margin: 0; }
.patient-crisis-plan-document h4 { margin-bottom: 9px; color: #08766f; font: 650 16px/1.3 Georgia,serif; }
.patient-crisis-plan-document p, .patient-crisis-plan-document small, .patient-crisis-plan-document dd { color: #496873; font-size: 11px; line-height: 1.6; white-space: pre-line; }
.patient-crisis-plan-document dl { margin: 10px 0 0; display: grid; gap: 8px; }
.patient-crisis-plan-document dl div { padding-top: 8px; border-top: 1px solid #e1eaeb; }
.patient-crisis-plan-document dt { color: #315564; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.patient-crisis-plan-document dd { margin: 3px 0 0; }
.patient-crisis-plan-document article { padding: 10px 0; border-top: 1px solid #e1eaeb; }
.patient-crisis-plan-document article strong { display: block; color: #173e55; font-size: 11px; }
.patient-crisis-plan-document .patient-crisis-plan-commitment { border-left-color: #c48119; background: #fffaf0; }
.patient-missing-links-plan > header { padding: 18px 20px 10px; display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 13px; align-items: center; }
.patient-missing-links-plan > header > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: #315d9b; background: #eaf0f9; }
.patient-missing-links-plan > header small, .patient-missing-links-plan > header strong { display: block; }
.patient-missing-links-plan > header small { color: #315d9b; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.patient-missing-links-plan > header strong { margin-top: 4px; color: #052f5f; font: 650 20px/1.2 Georgia,serif; }
.patient-missing-links-plan blockquote { margin: 10px 20px 20px; padding: 18px 20px; border: 1px solid #c9d8eb; border-left: 5px solid #315d9b; border-radius: 12px; color: #173e55; background: #f4f7fc; font-size: 14px; font-weight: 650; line-height: 1.65; white-space: pre-line; }

.patient-document-card { border-color: #ecd9b6; background: linear-gradient(110deg, #fff8eb, #fff 55%); }
.patient-document-card.complete { border-color: #b8dfd4; background: linear-gradient(110deg, #eef9f6, #fff 55%); }
.patient-document-grid { grid-template-columns: 1fr; }
.patient-document-card {
    display: grid;
    grid-template-columns: minmax(300px, 1.35fr) minmax(400px, 1.55fr) auto;
    align-items: stretch;
}
.patient-document-card > header {
    min-height: 108px;
    padding: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.patient-document-card > header > span { width: 39px; height: 39px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 11px; color: white; background: #c08731; font-size: 18px; font-weight: 900; }
.patient-document-card.complete > header > span { background: #158777; }
.patient-document-card header small { color: #486879; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.patient-document-card h3 { margin: 6px 0; color: #052f5f; font: 800 15px/1.2 Inter, system-ui, sans-serif; }
.patient-document-card header p { margin: 0; color: #687985; font-size: 10px; line-height: 1.45; }
.patient-document-card dl {
    margin: 0;
    display: grid;
    grid-template-columns: minmax(145px, .8fr) minmax(220px, 1.2fr);
    grid-template-rows: repeat(2, 1fr);
}
.patient-document-card dl > div {
    min-width: 0;
    min-height: 54px;
    padding: 14px 12px 9px;
}
.patient-document-card dl > div:nth-child(1) { grid-column: 1; grid-row: 1; }
.patient-document-card dl > div:nth-child(2) { grid-column: 1; grid-row: 2; padding-top: 5px; }
.patient-document-card dl > div:nth-child(3) { grid-column: 2; grid-row: 1; }
.patient-document-card dl > div:nth-child(4) { grid-column: 2; grid-row: 2; padding-top: 5px; }
.patient-document-card dt { color: #687985; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.patient-document-card dd { margin: 5px 0 0; overflow: hidden; color: #052f5f; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.patient-document-card > footer {
    min-width: 176px;
    min-height: 68px;
    padding: 13px 15px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}
.patient-document-card > footer a {
    min-width: 80px;
    min-height: 44px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d4dfe5;
    border-radius: 12px;
    color: #63048a;
    background: #fff;
    text-decoration: none;
    font-size: 11px;
    font-weight: 800;
}
.patient-document-card > footer a.primary-button {
    border-color: #073f78;
    color: #fff;
    background: #073f78;
    box-shadow: 0 8px 18px rgba(5, 47, 95, .16);
}
.patient-document-waiting { padding: 8px 10px; border-radius: 999px; color: #7a581e; background: #fff2cf; font-size: 9px; font-weight: 700; }
.patient-privacy-note { margin-top: 14px; padding: 15px 17px; border: 1px solid #cfe5ea; border-radius: 13px; background: #f1fafb; }
.patient-privacy-note strong { color: #052f5f; font-size: 12px; }
.patient-privacy-note p { margin: 5px 0 0; color: #687985; font-size: 10px; line-height: 1.55; }
.portal-readonly-banner { border-bottom: 1px solid #d8b86a; background: #fff7df; color: #745719; }
.patient-portal-readonly .patient-readonly-control,
.patient-portal-readonly button:disabled,
.patient-portal-readonly input:disabled,
.patient-portal-readonly textarea:disabled,
.patient-portal-readonly select:disabled { cursor: not-allowed; opacity: .58; }
.patient-portal-readonly .patient-readonly-control { pointer-events: none; filter: grayscale(.18); }
.patient-portal-readonly label:has(input:disabled),
.patient-portal-readonly .patient-receipt-upload:has(input:disabled) { cursor: not-allowed; opacity: .58; }
.patient-empty { margin: 0; padding: 28px 18px; color: #687985; text-align: center; font-size: 11px; }
.patient-empty-panel { border: 1px dashed var(--line); border-radius: 13px; background: rgba(255,255,255,.5); }
.patient-private-banner {
    margin-top: 16px;
    min-height: 82px;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 13px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(5, 47, 95, .05);
}

.patient-private-banner > span {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    color: #9a6518;
    background: #fff2cf;
    font-size: 17px;
}

.patient-private-banner strong,
.patient-private-banner small {
    display: block;
}

.patient-private-banner strong {
    color: #052f5f;
    font: 700 17px/1.2 Georgia, serif;
}

.patient-private-banner small {
    margin-top: 4px;
    color: #687985;
    font-size: 9px;
}

.patient-private-banner a { text-decoration: none; }

.patient-task-flash { margin-bottom: 18px; padding: 13px 16px; display: flex; align-items: center; gap: 10px; border: 1px solid #b8dfd4; border-radius: 13px; color: #052f5f; background: #eef9f6; font-size: 12px; }
.patient-task-flash span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: #158777; }
.patient-task-workspace { max-width: 980px; }
.patient-task-back { display: inline-flex; margin-bottom: 20px; color: #073f78; text-decoration: none; font-size: 12px; font-weight: 800; }
.patient-task-heading { margin-bottom: 20px; }
.patient-task-heading h1 { margin: 5px 0 8px; color: #052f5f; font: 700 clamp(28px, 4vw, 40px)/1.08 Georgia, serif; }
.patient-task-heading p { max-width: 760px; margin: 0; color: #687985; font-size: 13px; line-height: 1.55; }
.patient-task-error { margin-bottom: 16px; padding: 14px 16px; border: 1px solid #efc8c2; border-radius: 13px; color: #8c3d31; background: #fff0ed; font-size: 11px; }
.patient-task-error ul { margin: 7px 0 0; padding-left: 18px; }
.patient-task-submitted { margin-bottom: 16px; padding: 14px 16px; display: flex; align-items: center; gap: 11px; border: 1px solid #b8dfd4; border-radius: 13px; background: #eef9f6; }
.patient-task-submitted > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: #158777; font-weight: 900; }
.patient-task-submitted strong, .patient-task-submitted small { display: block; }
.patient-task-submitted strong { color: #052f5f; font-size: 12px; }
.patient-task-submitted small { margin-top: 3px; color: #687985; font-size: 9px; }
.patient-task-autosave { margin-bottom: 16px; padding: 11px 14px; display: flex; align-items: center; gap: 8px; border: 1px solid #cfe5ea; border-radius: 11px; color: #486c7b; background: #f1fafb; font-size: 10px; }
.patient-task-date-select { margin-bottom: 16px; }
.patient-dbt-date-card { padding: 16px 18px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 18px; border: 1px solid #c8dde4; border-radius: 16px; background: linear-gradient(135deg, #f3faf9, #fff 72%); box-shadow: 0 7px 20px rgba(5,47,95,.055); }
.patient-dbt-date-current { min-width: 0; display: flex; align-items: center; gap: 12px; }
.patient-dbt-date-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #12a69e, #087d86); }
.patient-dbt-date-icon .ui-icon { width: 20px; height: 20px; }
.patient-dbt-date-current div small, .patient-dbt-date-current div strong { display: block; }
.patient-dbt-date-current div small { color: #66808d; font-size: 10px; font-weight: 700; }
.patient-dbt-date-current div strong { margin-top: 3px; color: #052f5f; font-size: 17px; text-transform: capitalize; }
.patient-dbt-date-status { margin-left: 4px; padding: 6px 9px; display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; color: #0b7468; background: #ddf4ee; font-size: 9px; font-weight: 900; }
.patient-dbt-date-status .ui-icon { width: 13px; height: 13px; }
.patient-task-date-select details summary { cursor: pointer; list-style: none; }
.patient-task-date-select details summary::-webkit-details-marker { display: none; }
.patient-dbt-date-change { position: relative; }
.patient-dbt-date-change > summary { min-height: 42px; padding: 0 13px; display: flex !important; align-items: center; gap: 8px; border: 1px solid #9fc3d1; border-radius: 11px; color: #073f78 !important; background: #fff; box-shadow: 0 3px 10px rgba(5,47,95,.06); font-size: 11px !important; font-weight: 900 !important; }
.patient-dbt-date-change > summary:hover { border-color: #0f9685; background: #f1faf8; }
.patient-dbt-date-change > summary .ui-icon { width: 16px; height: 16px; color: #0f9685; }
.patient-dbt-date-change > summary i { margin-left: 5px; font-style: normal; transition: transform .16s ease; }
.patient-dbt-date-change[open] > summary i { transform: rotate(180deg); }
.patient-task-date-select details form { margin-top: 10px; display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.patient-task-date-select details .patient-task-field { min-width: 180px; }
.patient-task-date-select details .patient-task-field input[type="date"] { width: 100%; min-height: 38px; border: 1px solid #cbd8df; border-radius: 10px; padding: 8px 10px; color: #17344e; background: #fff; font: inherit; font-size: 12px; }
.patient-dbt-date-change[open] { grid-column: 1 / -1; }
.patient-dbt-date-change[open] > summary { width: max-content; margin-left: auto; }
.patient-dbt-date-change[open] form { padding-top: 12px; border-top: 1px solid #dce8eb; }
.patient-dbt-date-help { grid-column: 1 / -1; margin: 0; color: #647a86; font-size: 10px; line-height: 1.45; }
.patient-task-autosave span { width: 8px; height: 8px; border-radius: 50%; background: #10b9aa; box-shadow: 0 0 0 3px rgba(16,185,170,.13); }
.patient-task-form-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 8px 24px rgba(5,47,95,.05); }
.patient-task-form-card > header { padding: 20px 22px; border-bottom: 1px solid var(--line); background: linear-gradient(100deg, #eef9f6, #fff 65%); }
.patient-task-form-card > header h2 { margin: 6px 0 0; color: #052f5f; font-size: 17px; }
.patient-task-scale-hint { margin: 16px 22px 0; padding: 12px 14px; display: flex; align-items: flex-start; gap: 9px; border: 1px solid #bfe0f0; border-radius: 12px; color: #1c4a63; background: #eef8fc; font-size: 11px; line-height: 1.5; }
.patient-task-scale-hint span { flex: none; font-size: 13px; }
.patient-task-form-body { padding: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.patient-questionnaire-form-body { grid-template-columns: minmax(0, 1fr); }
.patient-questionnaire-form-body > .patient-task-field { grid-column: 1; }
.patient-task-field { min-width: 0; margin: 0; padding: 0; display: grid; gap: 8px; border: 0; }
.patient-task-field legend, .patient-task-field > span { margin-bottom: 8px; color: #073f78; font-size: 11px; font-weight: 800; }
.patient-task-field legend small { margin-left: 6px; padding: 3px 6px; border-radius: 999px; color: #087d8f; background: #e9f6f7; font-size: 7px; text-transform: uppercase; }
.patient-task-field input[type="text"], .patient-task-field input[type="number"], .patient-task-field input[type="datetime-local"], .patient-task-field select, .patient-task-field textarea { width: 100%; min-height: 44px; border: 1px solid #cbd8df; border-radius: 10px; padding: 10px 12px; color: #17344e; background: #fff; font: inherit; font-size: 12px; }
.patient-task-field textarea { resize: vertical; line-height: 1.5; }
.patient-task-field input:focus, .patient-task-field select:focus, .patient-task-field textarea:focus { outline: 3px solid rgba(16,185,170,.15); border-color: #10b9aa; }
.patient-task-field:has(textarea), .patient-task-field:has(.patient-task-options-list), .patient-task-field:has(.patient-task-range), .patient-task-form-body > .patient-task-field:first-child { grid-column: 1 / -1; }
.patient-task-options { display: flex; flex-wrap: wrap; gap: 9px; }
.patient-task-options label { cursor: pointer; }
.patient-task-options input { position: absolute; opacity: 0; pointer-events: none; }
.patient-task-options label span { min-height: 42px; min-width: 82px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #cbd8df; border-radius: 10px; color: #486c7b; background: #fff; font-size: 11px; font-weight: 700; }
.patient-task-options input:checked + span { border-color: #0f9685; color: #073f78; background: #e8f5f1; box-shadow: inset 0 0 0 1px #0f9685; }
.patient-task-options-list { align-items: stretch; flex-direction: column; }
.patient-task-options-list label span { width: 100%; justify-content: flex-start; }
.patient-task-range { display: grid; gap: 10px; color: #486c7b; font-size: 11px; }
.patient-task-range input { width: 100%; accent-color: #0f9685; }
.patient-task-number { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; }
.patient-task-number span { min-height: 44px; padding: 0 12px; display: flex; align-items: center; border: 1px solid #cbd8df; border-left: 0; border-radius: 0 10px 10px 0; color: #687985; background: #f7fafb; font-size: 10px; }
.patient-task-number input { border-radius: 10px 0 0 10px !important; }
.patient-task-duration { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.patient-task-duration label { display: grid; grid-template-columns: 1fr auto; align-items: center; }
.patient-task-duration label span { padding: 0 10px; color: #687985; font-size: 10px; }
.patient-task-info { grid-column: 1 / -1; padding: 14px; display: flex; gap: 10px; border: 1px solid #cfe5ea; border-radius: 11px; color: #486c7b; background: #f1fafb; font-size: 11px; line-height: 1.5; }
.patient-task-info p { margin: 0; }
.patient-task-section-title { grid-column: 1 / -1; padding: 16px 0 5px; border-bottom: 1px solid var(--line); }
.patient-task-section-title h3 { margin: 0; color: #052f5f; font: 700 18px/1.2 Georgia, serif; }
.patient-task-section-title p { margin: 5px 0 0; color: #687985; font-size: 10px; }
.patient-task-skill-fields .full { grid-column: 1 / -1; }
.mood-scale { grid-column: 1 / -1; padding: 4px 22px 22px; display: grid; gap: 14px; }
.mood-scale-track { display: flex; justify-content: space-between; gap: 6px; }
.mood-scale-option { position: relative; flex: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.mood-scale-option input { position: absolute; opacity: 0; pointer-events: none; }
.mood-scale-option span { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1; min-width: 30px; border-radius: 999px; color: #fff; font-size: 12px; font-weight: 800; box-shadow: inset 0 0 0 2px rgba(255,255,255,.35); transition: transform .15s ease, box-shadow .15s ease; }
.mood-scale-option input:checked + span { transform: scale(1.28); box-shadow: 0 0 0 3px #052f5f, 0 6px 14px rgba(5,47,95,.28); }
.mood-scale-option input:focus-visible + span { outline: 3px solid #10b9aa; outline-offset: 2px; }
.mood-scale-labels { display: flex; justify-content: space-between; color: #687985; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.mood-scale-option-0 span { background: hsl(0, 68%, 52%); }
.mood-scale-option-1 span { background: hsl(9, 68%, 52%); }
.mood-scale-option-2 span { background: hsl(18, 68%, 52%); }
.mood-scale-option-3 span { background: hsl(27, 68%, 51%); }
.mood-scale-option-4 span { background: hsl(36, 68%, 51%); }
.mood-scale-option-5 span { background: hsl(45, 68%, 50%); }
.mood-scale-option-6 span { background: hsl(68, 60%, 45%); }
.mood-scale-option-7 span { background: hsl(90, 55%, 42%); }
.mood-scale-option-8 span { background: hsl(112, 55%, 40%); }
.mood-scale-option-9 span { background: hsl(126, 58%, 37%); }
.mood-scale-option-10 span { background: hsl(140, 60%, 35%); }
.patient-task-discuss { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; color: #486c7b; font-size: 11px; }
.patient-task-discuss input { width: 18px; height: 18px; accent-color: #0f9685; }
.patient-task-actions { position: sticky; bottom: 12px; margin-top: 16px; padding: 13px; display: flex; justify-content: flex-end; gap: 9px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.96); box-shadow: 0 10px 28px rgba(5,47,95,.12); backdrop-filter: blur(12px); }
.patient-task-actions button { min-height: 44px; padding: 0 18px; border: 1px solid #cbd8df; border-radius: 11px; color: #073f78; background: #fff; font-weight: 800; cursor: pointer; }
.patient-task-actions button.primary-button { border-color: #073f78; color: #fff; background: #073f78; }
.patient-dbt-submit-actions { position: static; bottom: auto; margin-top: 22px; padding: 16px 18px; align-items: center; justify-content: space-between; background: #fff; box-shadow: 0 7px 22px rgba(5,47,95,.08); backdrop-filter: none; }
.patient-dbt-submit-actions > div strong, .patient-dbt-submit-actions > div small { display: block; }
.patient-dbt-submit-actions > div strong { color: #052f5f; font-size: 12px; }
.patient-dbt-submit-actions > div small { margin-top: 3px; color: #687985; font-size: 9.5px; }
.patient-dbt-submit-actions button.primary-button { min-width: 210px; }
.patient-mood-submit-actions { position: static; bottom: auto; margin-top: 22px; padding: 16px 18px; align-items: center; justify-content: space-between; background: #fff; box-shadow: 0 7px 22px rgba(5,47,95,.08); backdrop-filter: none; }
.patient-mood-submit-actions > div strong, .patient-mood-submit-actions > div small { display: block; }
.patient-mood-submit-actions > div strong { color: #052f5f; font-size: 12px; }
.patient-mood-submit-actions > div small { margin-top: 3px; color: #687985; font-size: 9.5px; }
.patient-mood-submit-actions button.primary-button { min-width: 210px; }

.patient-task-empty { padding: 18px; color: #687985; font-size: 12px; }
.patient-task-example { margin-bottom: 16px; padding: 14px 16px; border: 1px solid #cfe5ea; border-radius: 11px; color: #486c7b; background: #f1fafb; font-size: 12px; }
.patient-task-example summary { cursor: pointer; font-weight: 700; color: #073f78; }
.patient-task-example p { margin: 8px 0 0; line-height: 1.5; }
.episodic-log-list { display: grid; gap: 10px; margin-bottom: 16px; }
.episodic-log-entry-card { border: 1px solid var(--line); border-radius: 14px; background: #fff; overflow: hidden; }
.episodic-log-entry-card summary { display: flex; align-items: center; gap: 12px; padding: 13px 16px; cursor: pointer; list-style: none; }
.episodic-log-entry-card summary::-webkit-details-marker { display: none; }
.episodic-log-entry-time { flex: 0 0 auto; padding: 6px 10px; border-radius: 999px; background: #eef4f2; color: #0f9685; font-weight: 800; font-size: 12px; }
.episodic-log-entry-preview { flex: 1 1 auto; color: #073f78; font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.episodic-log-entry-card[open] summary { border-bottom: 1px solid var(--line); }
.episodic-log-entry-card .task-response-answer-grid { padding: 16px; }
.episodic-log-entry-card footer { padding: 0 16px 16px; }
.task-response-answer-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.task-response-answer-grid article { min-width: 0; display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 11px; background: #fbfefd; }
.task-response-answer-grid article.wide { grid-column: 1 / -1; }
.task-response-answer-grid small { color: #687985; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.task-response-answer-grid p { margin: 0; color: #073f78; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.episodic-log-edit-form { padding: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; border: 1px solid var(--line); border-radius: 14px; background: #fbfefd; margin-top: 10px; }
.episodic-log-row-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 9px; }
.episodic-log-add summary { list-style: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; min-height: 44px; padding: 0 18px; border-radius: 11px; }
.episodic-log-add summary::-webkit-details-marker { display: none; }
.activity-monitoring-list { display: grid; gap: 10px; }
.activity-monitoring-row { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.activity-monitoring-row-time { flex: 0 0 auto; min-width: 52px; padding: 6px 10px; border-radius: 999px; background: #eef4f2; color: #0f9685; font-weight: 800; font-size: 12px; text-align: center; }
.activity-monitoring-row-main { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; }
.activity-monitoring-row-main strong { font-size: 13px; color: #073f78; }
.activity-monitoring-row-main small { color: #687985; font-size: 11px; }
.activity-monitoring-row-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; }
.activity-monitoring-row-actions form { display: contents; }
.activity-monitoring-add { margin-top: 16px; }
.activity-monitoring-add summary { list-style: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; min-height: 44px; padding: 0 18px; border-radius: 11px; }
.activity-monitoring-add summary::-webkit-details-marker { display: none; }
.activity-monitoring-add[open] summary { margin-bottom: 14px; }
.activity-monitoring-edit-form { display: grid; gap: 16px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: #fbfefd; }
.activity-monitoring-field-row { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; }
.activity-monitoring-field-row label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; color: #486c7b; font-weight: 700; }
.activity-monitoring-field-row label.full { grid-column: 1 / -1; }
.activity-monitoring-field-row input { min-height: 42px; padding: 0 12px; border: 1px solid #cbd8df; border-radius: 10px; font-size: 13px; }
.activity-scale-field { display: grid; gap: 8px; }
.activity-scale-field > span { font-size: 11px; color: #486c7b; font-weight: 700; }
.activity-scale { display: grid; gap: 10px; }
.activity-scale-track { display: flex; justify-content: space-between; gap: 6px; }
.activity-scale-option { position: relative; flex: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.activity-scale-option input { position: absolute; opacity: 0; pointer-events: none; }
.activity-scale-option span { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 1; min-width: 28px; border-radius: 999px; color: #fff; font-size: 11px; font-weight: 800; box-shadow: inset 0 0 0 2px rgba(255,255,255,.35); transition: transform .15s ease, box-shadow .15s ease; }
.activity-scale-option input:checked + span { transform: scale(1.28); box-shadow: 0 0 0 3px #052f5f, 0 6px 14px rgba(5,47,95,.28); }
.activity-scale-option input:focus-visible + span { outline: 3px solid #10b9aa; outline-offset: 2px; }
.activity-scale-labels { display: flex; justify-content: space-between; color: #687985; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.activity-scale-option-0 span { background: hsl(0, 68%, 52%); }
.activity-scale-option-1 span { background: hsl(9, 68%, 52%); }
.activity-scale-option-2 span { background: hsl(18, 68%, 52%); }
.activity-scale-option-3 span { background: hsl(27, 68%, 51%); }
.activity-scale-option-4 span { background: hsl(36, 68%, 51%); }
.activity-scale-option-5 span { background: hsl(45, 68%, 50%); }
.activity-scale-option-6 span { background: hsl(68, 60%, 45%); }
.activity-scale-option-7 span { background: hsl(90, 55%, 42%); }
.activity-scale-option-8 span { background: hsl(112, 55%, 40%); }
.activity-scale-option-9 span { background: hsl(126, 58%, 37%); }
.activity-scale-option-10 span { background: hsl(140, 60%, 35%); }

@media (max-width: 980px) {
    .patient-app-shell { grid-template-columns: 190px minmax(0, 1fr); }
    .patient-portal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .patient-app-content { padding: 30px 24px; }
    .patient-document-card { grid-template-columns: minmax(230px, 1fr) minmax(280px, 1.25fr) auto; }
}

@media (max-width: 560px) {
    .mood-scale-track { flex-wrap: wrap; }
    .mood-scale-option { flex: 0 0 calc(100% / 6 - 6px); }
    .activity-scale-track { flex-wrap: wrap; }
    .activity-scale-option { flex: 0 0 calc(100% / 6 - 6px); }
    .activity-monitoring-field-row { grid-template-columns: minmax(0, 1fr); }
    .activity-monitoring-row { flex-wrap: wrap; }
    .episodic-log-edit-form { grid-template-columns: minmax(0, 1fr); }
    .task-response-answer-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
    body > .topbar { justify-content: space-between; padding-inline: 16px; }
    body > .topbar .brand img { width: min(48vw, 180px); height: 58px; }
    body > .topbar .patient-topbar-profile { display: none; }
    .patient-topbar-actions { margin-left: auto; }
    .patient-notifications-popover { position: fixed; top: 88px; right: 10px; max-height: calc(100vh - 110px); }
    .patient-app-shell { display: block; }
    .patient-app-sidebar { display: none; }
    .patient-app-content { max-width: none; padding: 24px 14px calc(104px + env(safe-area-inset-bottom)); }
    .patient-mobile-nav {
        position: fixed;
        left: 9px;
        right: 9px;
        bottom: max(8px, env(safe-area-inset-bottom));
        z-index: 50;
        height: auto;
        min-height: 72px;
        padding: 6px;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 4px;
        border: 1px solid rgba(255,255,255,.14);
        border-radius: 18px;
        color: #bdd3de;
        background: rgba(5,47,95,.97);
        box-shadow: 0 12px 30px rgba(5,47,95,.28);
    }
    .patient-mobile-logout { margin-top: 14px; display: block; }
    .patient-mobile-logout button { width: 100%; min-height: 44px; border: 1px solid #cbd8df; border-radius: 11px; color: #073f78; background: white; font-weight: 800; }
    .patient-mobile-nav a {
        min-width: 0;
        min-height: 58px;
        padding: 6px 3px 5px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        border-radius: 12px;
        color: inherit;
        text-align: center;
        text-decoration: none;
        line-height: 1.08;
    }
    .patient-mobile-nav a > span:first-child { width: 22px; height: 22px; display: grid; place-items: center; }
    .patient-mobile-nav a > span:first-child .ui-icon { width: 20px; height: 20px; }
    .patient-mobile-nav-label { width: 100%; min-width: 0; min-height: 22px; display: flex; align-items: center; justify-content: center; font-size: 10px; line-height: 1.08; text-wrap: balance; }
    .patient-mobile-nav a.active { color: #56d6ca; font-weight: 800; }
    .patient-portal-heading { align-items: flex-start; }
    .patient-portal-heading time { display: none; }
    .patient-onboarding-card > header { align-items: flex-start; }
    .patient-activation-alert { grid-template-columns: auto minmax(0,1fr); }
    .patient-activation-alert a { grid-column: 1 / -1; width: 100%; justify-content: center; text-align: center; }
    .patient-consent-signature-alert { padding: 18px 17px 18px 21px; grid-template-columns: 1fr; gap: 16px; }
    .patient-consent-signature-alert > header { align-items: flex-start; }
    .patient-consent-signature-alert .patient-consent-signature-icon { width: 42px; height: 42px; flex-basis: 42px; }
    .patient-consent-signature-alert footer { align-items: stretch; justify-content: flex-start; flex-direction: column; }
    .patient-consent-signature-alert footer a { width: 100%; justify-content: center; text-align: center; }
    .patient-next-session-note-card { padding: 18px; grid-template-columns: 1fr; gap: 17px; }
    .patient-next-session-note-card form footer { align-items: stretch; flex-direction: column; }
    .patient-next-session-note-card button { width: 100%; }
    .patient-next-steps-group { padding: 16px; }
    .patient-onboarding-steps,
    .patient-portal-home-grid,
    .patient-session-grid,
    .patient-task-grid,
    .patient-questionnaire-list,
    .patient-document-grid { grid-template-columns: 1fr; }
    .patient-portal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .patient-portal-summary article { min-height: 78px; padding: 13px; }
    .patient-document-card > footer { align-items: stretch; flex-direction: column; }
    .patient-document-card > footer a { width: 100%; justify-content: center; text-align: center; }
    .patient-session-list > div { grid-template-columns: auto minmax(0,1fr); }
    .patient-session-list em { grid-column: 2; justify-self: start; }
    .patient-private-banner { grid-template-columns: auto minmax(0,1fr); }
    .patient-private-banner a { grid-column: 1 / -1; justify-content: center; text-align: center; }
    .patient-document-card { display: block; }
    .patient-worked-tool-card > summary { padding: 15px; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; }
    .patient-worked-tool-card > summary > span { width: 38px; height: 38px; }
    .patient-missing-links-plan > header { padding: 15px 14px 8px; grid-template-columns: 38px minmax(0,1fr); }
    .patient-missing-links-plan > header > span { width: 38px; height: 38px; }
    .patient-missing-links-plan blockquote { margin: 8px 14px 16px; padding: 15px; font-size: 13px; }
    .patient-chain-document { padding-inline: 12px; }
    .patient-chain-document::before { left: 30px; }
    .patient-chain-document > article { grid-template-columns: 36px minmax(0,1fr); gap: 9px; }
    .patient-chain-document > article > span { width: 36px; height: 36px; }
    .patient-chain-document dl { grid-template-columns: 1fr; }
    .patient-document-card dl { margin: 0 6px; border: 0; }
    .patient-task-form-body { grid-template-columns: 1fr; padding: 17px; }
    .patient-task-field,
    .patient-task-field:has(textarea),
    .patient-task-field:has(.patient-task-options-list),
    .patient-task-field:has(.patient-task-range),
    .patient-task-form-body > .patient-task-field:first-child { grid-column: 1; }
    .patient-task-actions { bottom: 78px; display: grid; grid-template-columns: 1fr 1fr; }
    .patient-task-actions > * { width: 100%; }
    .patient-dbt-date-card { grid-template-columns: minmax(0, 1fr); padding: 14px; }
    .patient-dbt-date-change > summary, .patient-dbt-date-change[open] > summary { width: 100%; margin: 0; justify-content: center; }
    .patient-dbt-date-change > summary i { margin-left: auto; }
    .patient-dbt-date-change[open] { grid-column: 1; }
    .patient-dbt-date-change form { align-items: stretch !important; flex-direction: column; }
    .patient-dbt-submit-actions { bottom: auto; grid-template-columns: minmax(0, 1fr); gap: 13px; }
    .patient-dbt-submit-actions button.primary-button { min-width: 0; }
    .patient-mood-submit-actions { bottom: auto; grid-template-columns: minmax(0, 1fr); gap: 13px; }
    .patient-mood-submit-actions button.primary-button { min-width: 0; }
}

@media (max-width: 430px) {
    .patient-portal-summary article { align-items: flex-start; flex-direction: column; }
    .patient-document-card dl { grid-template-columns: 1fr; }
    .patient-document-card dl > div,
    .patient-document-card dl > div:nth-child(n) {
        grid-column: 1;
        grid-row: auto;
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
    }
}
.patient-appointment-row { display:flex !important; flex-wrap:wrap; align-items:center; }
.patient-appointment-row > time { flex:0 0 48px; }
.patient-appointment-row > span { flex:1 1 220px; }
.patient-appointment-actions { flex:1 0 100%; display:flex; align-items:center; gap:10px; padding:10px 0 4px 64px; flex-wrap:wrap; }
.patient-appointment-actions form { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.patient-receipt-form { width:100%; }
.receipt-selected-file { max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#426174; font-size:11px; }
.receipt-upload-help { flex-basis:100%; color:#6b7f8d; font-size:10px; }
.patient-task-error { color:#8b2626 !important; background:#fff0f0 !important; border-color:#efc4c4 !important; }
.receipt-file-button { cursor:pointer; border:1px solid #cbd8e2; border-radius:9px; padding:9px 12px; color:#153d5c; font-size:11px; font-weight:700; background:#fff; }
.receipt-file-button input { width:1px; height:1px; opacity:0; position:absolute; }
.receipt-uploaded-status { display:inline-flex; align-items:center; gap:5px; padding:8px 11px; border-radius:9px; color:#0b7468; background:#eaf8f5; font-size:11px; font-weight:800; }
.appointment-status-reserved { color:#986400 !important; background:#fff3d9 !important; }
.appointment-change-area { flex:1 0 100%; margin:8px 0 0 64px; }
.appointment-change-button { min-height: 40px; }
.appointment-change-forms { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.appointment-change-forms form { display:grid; align-content:start; gap:12px; padding:16px; border:1px solid #dbe5eb; border-radius:13px; background:#f8fbfc; }
.appointment-change-forms form > div { display:grid; gap:4px; }
.appointment-change-forms form > div strong { color:#052f5f; font-size:14px; }
.appointment-change-forms form > div small { color:#687985; font-size:10px; }
.appointment-change-forms label { display:grid; gap:5px; color:#456477; font-size:10px; font-weight:700; }
.appointment-change-forms input,.appointment-change-forms textarea { width:100%; box-sizing:border-box; border:1px solid #c9d7e0; border-radius:8px; padding:9px; background:#fff; }
.appointment-change-forms textarea { min-height:64px; resize:vertical; }
.change-request-pending { display:flex; gap:8px; flex-wrap:wrap; padding:10px 12px; border-radius:9px; background:#fff7df; color:#795713; }
.change-request-pending.compact { padding:8px 11px; font-size:10px; }
.patient-change-dialog { width:min(760px,calc(100vw - 28px)); max-height:calc(100vh - 36px); margin:auto; padding:0; border:0; border-radius:20px; color:#17344e; background:#fff; box-shadow:0 24px 70px rgba(5,47,95,.25); overflow:hidden; }
.patient-change-dialog::backdrop { background:rgba(5,35,61,.52); backdrop-filter:blur(4px); }
.patient-change-dialog > header { min-height:76px; padding:16px 20px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid #dce4e8; }
.patient-change-dialog > header h2 { margin:3px 0 0; color:#052f5f; font:700 22px/1.2 Georgia,serif; }
.patient-change-dialog > header button { width:40px; height:40px; border:1px solid #d3dfe5; border-radius:11px; color:#17344e; background:#fff; cursor:pointer; font-size:21px; }
.patient-change-dialog-body { padding:20px; overflow-y:auto; }
.patient-late-cancellation-warning { display:flex; align-items:flex-start; gap:14px; padding:16px; border:1px solid #f1c7c7; border-radius:14px; background:#fff7f7; color:#743535; }
.patient-late-cancellation-warning > span { flex:0 0 auto; width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:#fbe4e4; }
.patient-late-cancellation-warning svg { width:20px; height:20px; }
.patient-late-cancellation-warning strong { display:block; margin-bottom:5px; color:#8a2525; }
.patient-late-cancellation-warning p { margin:0; line-height:1.55; }
.patient-late-cancellation-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
.patient-late-cancellation-actions .danger-button { background:#a83232; border-color:#a83232; }
.patient-monthly-statement { margin-bottom:18px; padding:20px; border:1px solid #bdd4e8; border-radius:18px; background:linear-gradient(145deg,#f5faff,#fff); box-shadow:0 10px 28px rgba(5,55,95,.08); }
.patient-monthly-statement > header { display:flex; align-items:flex-start; gap:13px; }
.patient-monthly-statement > header > span { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:12px; color:#fff; background:#1769aa; }
.patient-monthly-statement > header small,.patient-monthly-statement > header h2,.patient-monthly-statement > header p { display:block; margin:0; }
.patient-monthly-statement > header small { color:#1769aa; font-size:10px; font-weight:900; letter-spacing:.1em; }
.patient-monthly-statement > header h2 { margin-top:3px; color:#073461; }
.patient-monthly-statement > header p { margin-top:5px; color:#5f7485; }
.patient-monthly-statement ol { margin:16px 0; padding:0; list-style:none; border-top:1px solid #dce7ef; }
.patient-monthly-statement li { display:flex; justify-content:space-between; gap:14px; padding:10px 2px; border-bottom:1px solid #e5edf2; }
.patient-monthly-statement form { display:grid; gap:7px; }
.patient-monthly-statement.is-paid { border-color:#8ec6ed; background:#eef7ff; }
.patient-monthly-statement.is-review { border-color:#e6cf8c; background:#fffaf0; }
.patient-monthly-covered { display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border-radius:9px; color:#0759c7; background:#e6f1ff; font-size:11px; font-weight:800; }
.patient-monthly-covered svg { width:15px; height:15px; }
.patient-change-appointment-summary { padding:14px; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; border:1px solid #cfe3e4; border-radius:13px; background:#f2faf9; }
.patient-change-appointment-summary > span:first-child { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#073f78; background:#e2f1f4; }
.patient-change-appointment-summary strong,.patient-change-appointment-summary small { display:block; }
.patient-change-appointment-summary strong { color:#052f5f; font-size:12px; text-transform:capitalize; }
.patient-change-appointment-summary small { margin-top:5px; color:#687985; font-size:10px; }
.patient-booking-card { margin-top:20px; }
.danger-text { color:#b43c3c !important; }
.patient-payment-deadline-alert {
  margin:18px 0 22px;
  padding:20px 22px;
  border:1px solid #e8bd56;
  border-radius:17px;
  color:#493910;
  background:linear-gradient(135deg,#fff8df 0%,#fffdf7 70%);
  box-shadow:0 10px 26px rgba(131,91,10,.08);
}
.patient-payment-deadline-alert > header { display:flex; align-items:flex-start; gap:14px; }
.patient-payment-deadline-alert > header > span {
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  color:#fff;
  background:#c48716;
  font-size:20px;
  font-weight:900;
}
.patient-payment-deadline-alert header small { display:block; color:#98701e; font-size:9px; font-weight:900; letter-spacing:.13em; }
.patient-payment-deadline-alert h2 { margin:5px 0 7px; color:#47350e; font:700 clamp(18px,2vw,23px)/1.2 Georgia,serif; }
.patient-payment-deadline-alert header p { margin:0; color:#66521f; font-size:12px; line-height:1.6; }
.patient-payment-consequence { margin:16px 0 0; padding:12px 14px; border-radius:10px; background:#fff0c2; font-size:12px; line-height:1.55; }
.patient-payment-deadline-alert details { margin-top:13px; border-top:1px solid rgba(151,104,16,.2); padding-top:12px; }
.patient-payment-deadline-alert summary { width:max-content; max-width:100%; color:#6f5012; font-size:11px; font-weight:900; cursor:pointer; }
.patient-payment-deadline-alert ul { margin:12px 0 0; padding-left:20px; color:#66521f; font-size:11px; line-height:1.55; }
.patient-payment-deadline-alert li { margin:6px 0; }
.patient-payment-deadline-alert details p { margin:11px 0 0; color:#7b682f; font-size:10px; line-height:1.5; }
.patient-payment-deadline-alert footer { margin-top:16px; display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
@media (max-width:760px) {
  .patient-appointment-actions,.appointment-change-area { padding-left:0; margin-left:0; }
  .appointment-change-forms { grid-template-columns:1fr; }
  .patient-next-session-content { align-items:flex-start; flex-wrap:wrap; }
  .patient-next-session-content .status-pill { margin-left:57px; }
  .patient-next-session-actions { align-items:stretch; flex-direction:column; }
  .patient-next-session-actions > * { width:100%; justify-content:center; text-align:center; }
  .patient-home-receipt-button { width: 100%; }
  .patient-change-dialog-body { padding:15px; }
  .patient-late-cancellation-warning { flex-direction:column; }
  .patient-late-cancellation-actions { align-items:stretch; flex-direction:column-reverse; }
  .patient-late-cancellation-actions button { width:100%; justify-content:center; }
  .patient-change-appointment-summary { grid-template-columns:auto minmax(0,1fr); }
  .patient-change-appointment-summary .status-pill { grid-column:2; justify-self:start; }
  .patient-payment-deadline-alert { padding:17px; }
  .patient-payment-deadline-alert footer { align-items:stretch; flex-direction:column; }
  .patient-payment-deadline-alert footer a { width:100%; justify-content:center; text-align:center; }
}

/* Patient portal visual system — aligned with the professional workspace. */
body:has(.patient-app-shell) {
  --patient-navy: #073f78;
  --patient-navy-dark: #052f5f;
  --patient-blue: #0b679f;
  --patient-teal: #20bfb2;
  --patient-bg: #f4f7f8;
  --patient-paper: #ffffff;
  --patient-line: #dce4e8;
  --patient-muted: #687985;
  color: #17344e;
  background: var(--patient-bg);
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}

.patient-app-shell .ui-icon { display: block; flex: 0 0 auto; }
.patient-app-sidebar nav a span .ui-icon,
.patient-sidebar-logout button span .ui-icon,
.patient-mobile-nav a span .ui-icon { width: 18px; height: 18px; }
.patient-onboarding-steps a > span .ui-icon { width: 16px; height: 16px; }
.patient-onboarding-complete > span .ui-icon,
.patient-activation-alert > span .ui-icon,
.patient-action-list a > span .ui-icon { width: 18px; height: 18px; }
.patient-private-banner > span .ui-icon,
.patient-document-card > header > span .ui-icon,
.patient-consent-signature-icon .ui-icon { width: 21px; height: 21px; }
.patient-app-shell .ui-empty-state__icon .ui-icon { width: 21px; height: 21px; }

body:has(.patient-app-shell) .primary-button,
body:has(.patient-app-shell) .secondary-button {
  min-height: 42px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--patient-navy);
  border-radius: 11px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
body:has(.patient-app-shell) .primary-button {
  color: #fff;
  background: var(--patient-navy);
  box-shadow: 0 7px 16px rgba(5, 47, 95, .14);
}
body:has(.patient-app-shell) .secondary-button {
  color: var(--patient-navy);
  border-color: #cfdae1;
  background: #fff;
}
body:has(.patient-app-shell) .primary-button:hover,
body:has(.patient-app-shell) .secondary-button:hover {
  transform: translateY(-1px);
  border-color: var(--patient-navy);
  box-shadow: 0 8px 18px rgba(5, 47, 95, .12);
}
body:has(.patient-app-shell) .status-pill {
  min-height: 27px;
  padding: 4px 10px;
  font-size: 10px;
  letter-spacing: .01em;
}

body:has(.patient-app-shell) > .topbar {
  height: 88px;
  padding: 0 clamp(24px, 4vw, 64px);
  border-bottom-color: var(--patient-line);
  background: #fff;
}
body:has(.patient-app-shell) > .topbar .brand img { width: 174px; height: 66px; }
.patient-topbar-profile { gap: 14px; }
.patient-topbar-profile strong { font-size: 14px; }
.patient-topbar-profile small { font-size: 10px; }
.patient-topbar-profile i { width: 42px; height: 42px; border-radius: 12px; font-size: 12px; }
.patient-topbar-profile form button { min-height: 42px; }
.portal-demo-banner { min-height: 32px; font-size: 11px; }

.patient-app-shell { grid-template-columns: 244px minmax(0, 1fr); }
.patient-app-sidebar {
  height: calc(100vh - 120px);
  min-height: 620px;
  padding: 18px 12px 14px;
  border-right: 0;
  color: #eaf2f7;
  background: var(--patient-navy);
}
.patient-app-sidebar nav { gap: 4px; }
.patient-app-sidebar nav a {
  min-height: 48px;
  padding: 0 12px;
  gap: 11px;
  border-radius: 10px;
  color: #bcd0c9;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
}
.patient-app-sidebar nav a span {
  width: 21px;
  height: auto;
  display: grid;
  place-items: center;
  border-radius: 0;
  color: #a8c1b9;
  background: transparent;
  font-size: 18px;
}
.patient-app-sidebar nav a:hover { color: #fff; background: rgba(255, 255, 255, .06); }
.patient-app-sidebar nav a.active {
  color: #fff;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 3px 0 var(--patient-teal);
  font-weight: 500;
}
.patient-app-sidebar nav a.active span { color: var(--patient-teal); background: transparent; }
.patient-sidebar-help {
  padding: 15px 12px;
  border: 0;
  border-top: 1px solid rgba(255,255,255,.08);
  border-radius: 0;
  background: transparent;
}
.patient-sidebar-help strong { color: #fff; font: 600 15px/1.2 "Fraunces", serif; }
.patient-sidebar-help p { color: #d5e5ee; font-size: 11px; }
.patient-sidebar-help small { color: #ffd5cb; font-size: 10px; }
.patient-sidebar-logout { margin-top: 0; padding: 8px 0 0; border-top-color: rgba(255,255,255,.08); }
.patient-sidebar-logout button {
  min-height: 48px;
  padding: 0 12px;
  gap: 11px;
  border: 0;
  border-radius: 10px;
  color: #bcd0c9;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
}
.patient-sidebar-logout button span { width: 21px; height: auto; color: #a8c1b9; background: transparent; }
.patient-sidebar-logout button:hover { color: #fff; background: rgba(255,255,255,.06); }

.patient-app-content { max-width: 1380px; padding: 36px clamp(28px, 4vw, 58px) 56px; }

.patient-portal-heading { margin-bottom: 24px; align-items: center; }
.patient-portal-heading .eyebrow,
.patient-section-heading .eyebrow,
.ui-page-header .eyebrow { color: var(--patient-blue); font-size: 11px; letter-spacing: .14em; }
.patient-portal-heading h1 { margin: 5px 0 8px; font: 600 clamp(34px, 4vw, 46px)/1.06 "Fraunces", Georgia, serif; }
.patient-portal-heading p,
.patient-section-heading p,
.ui-page-header p { color: var(--patient-muted); font-size: 14px; line-height: 1.5; }
.patient-portal-heading time {
  min-width: 112px;
  padding: 14px 17px;
  border-left: 4px solid var(--patient-teal);
  border-radius: 0 12px 12px 0;
  background: #fff;
  box-shadow: 0 5px 16px rgba(5,47,95,.05);
}
.patient-portal-heading time strong { font: 600 29px/1 "Fraunces", serif; }
.patient-portal-heading time span { font-size: 10px; }
.ui-page-header { margin-bottom: 24px; }
.ui-page-header h1 { font: 600 34px/1.1 "Fraunces", Georgia, serif; }

.patient-onboarding-complete,
.patient-onboarding-card,
.patient-activation-alert,
.patient-consent-signature-alert,
.patient-payment-deadline-alert { margin-bottom: 20px; }
.patient-onboarding-complete { min-height: 68px; padding: 15px 18px; border-radius: 16px; box-shadow: 0 5px 16px rgba(5,47,95,.04); }
.patient-onboarding-complete > span { width: 39px; height: 39px; }
.patient-onboarding-complete strong { font-size: 14px; }
.patient-onboarding-complete small { font-size: 11px; }

.patient-portal-home-grid,
.patient-session-grid,
.patient-document-grid { gap: 18px; }
.patient-portal-card,
.patient-document-card,
.patient-task-card,
.patient-questionnaire-list article,
.patient-private-banner {
  border-color: var(--patient-line);
  border-radius: 17px;
  box-shadow: 0 1px 2px rgba(5,47,95,.04), 0 7px 22px rgba(5,47,95,.055);
}
.patient-portal-card > header {
  min-height: 82px;
  padding: 18px 21px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}
.patient-portal-card h2,
.patient-portal-card h3 { font: 600 21px/1.2 "Fraunces", Georgia, serif; }
.patient-portal-card header p { font-size: 11px; }

.patient-next-session { padding-bottom: 18px; }
.patient-next-session-content {
  position: relative;
  min-height: 126px;
  margin: 15px 18px 13px;
  padding: 19px 20px 19px 23px;
  overflow: hidden;
  border: 1px solid #b9ded8;
  border-radius: 14px;
  color: #17344e;
  background: linear-gradient(115deg, #eef9f6 0%, #f8fbfc 68%, #ffffff 100%);
  box-shadow: inset 0 1px rgba(255,255,255,.8);
}
.patient-next-session-content::before {
  position: absolute;
  inset: 13px auto 13px 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  content: "";
  background: var(--patient-teal);
}
.patient-next-session-content > span { width: 46px; height: 46px; color: var(--patient-navy); background: #ccefeb; }
.patient-next-session-content > .patient-calendar-icon { display: grid; place-items: center; border-radius: 13px; }
.patient-calendar-icon svg { width: 23px; height: 23px; }
body:has(.patient-app-shell) .meet-join-button { background: #f8fbfc; border: 0.5px solid #b5b5b5; color: #073f78; box-shadow: none; }
body:has(.patient-app-shell) .meet-join-button:hover { background: #ffffff; border-color: #b5b5b5; }
.patient-next-session-content strong { color: var(--patient-navy-dark); font-size: 17px; }
.patient-next-session-content small { color: #587181; font-size: 11px; }
.patient-next-session-content > .status-pill {
  width: auto;
  height: auto;
  min-width: 82px;
  min-height: 32px;
  margin-left: auto;
  padding: 5px 12px;
  flex: 0 0 auto;
  display: inline-flex;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}
.patient-next-session-content > .status-pill--warning { color: #704c0a; border-color: #f0d18a; background: #fff2cf; }
.patient-next-session-content > .status-pill--success { color: #075d50; border-color: #9dd9ca; background: #dff5ef; }
.patient-next-session-content > .status-pill--danger { color: #8c3d31; border-color: #efbdb5; background: #ffebe7; }
.patient-next-session-content > .status-pill--info,
.patient-next-session-content > .status-pill--neutral { color: #174f72; border-color: #bddcea; background: #e8f5fb; }
.patient-next-session-actions { padding: 0 18px; justify-content: flex-end; }
.patient-home-receipt-form { margin: 0; }
.patient-home-receipt-button { margin: 0; white-space: nowrap; }
.patient-home-receipt-button input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.patient-home-receipt-button span,
.patient-home-receipt-view span { color: #0d8479; font-weight: 900; }

.patient-action-list { padding: 9px 18px 15px; display: grid; gap: 7px; }
.patient-action-list a {
  min-height: 66px;
  padding: 10px 12px;
  border: 1px solid #e1e8ec;
  border-radius: 11px;
  background: #fff;
}
.patient-action-list a:hover { border-color: #bfd8d4; background: #f8fcfb; }
.patient-action-list a:last-child { border-bottom: 1px solid #e1e8ec; }
.patient-action-list strong { font-size: 12px; }
.patient-action-list small { font-size: 10px; }
.patient-private-banner { min-height: 88px; margin-top: 18px; padding: 17px 20px; }
.patient-private-banner strong { font: 600 18px/1.2 "Fraunces", serif; }
.patient-private-banner small { font-size: 10px; line-height: 1.45; }

.patient-section-heading h2 { font: 600 32px/1.1 "Fraunces", Georgia, serif; }
.patient-session-list { padding: 14px 16px 16px; display: grid; gap: 9px; }
.patient-session-list > div {
  min-height: 76px;
  padding: 11px 12px;
  border: 1px solid #e0e8ec;
  border-radius: 12px;
  background: #fff;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.patient-session-list > div:last-child { border-bottom: 1px solid #e0e8ec; }
.patient-session-list > div:hover { transform: translateY(-1px); border-color: #bad5d1; box-shadow: 0 5px 14px rgba(5,47,95,.06); }
.patient-session-list time { width: 51px; height: 54px; background: #eaf5f8; }
.patient-session-list time strong { font: 600 19px/1 "Fraunces", serif; }
.patient-session-list > div > span strong { font-size: 13px; }
.patient-session-list > div > span small { font-size: 10px; }
.patient-session-list em,
.patient-questionnaire-list em { padding: 6px 10px; font-size: 9px; }
.patient-appointment-row { display: grid !important; grid-template-columns: auto minmax(0,1fr) auto; column-gap: 13px; }
.patient-appointment-row > time { flex: none; }
.patient-appointment-row > span { flex: none; }
.patient-appointment-actions,
.appointment-change-area { grid-column: 2 / -1; margin: 8px 0 0; padding: 0; }
.appointment-change-button { min-height: 38px; }
.patient-appointment-controls {
  grid-column: 2 / -1;
  width: 100%;
  margin-top: 9px;
  display: grid;
  grid-template-columns: repeat(2, minmax(154px, 1fr));
  align-items: stretch;
  justify-self: stretch;
  gap: 9px;
}
.patient-appointment-controls form,
.patient-appointment-controls .patient-receipt-form { width: 100%; min-width: 0; margin: 0; }
.patient-appointment-controls > a,
.patient-appointment-controls > button,
.patient-appointment-controls form > label { width: 100%; }
.patient-single-receipt-button,
.patient-receipt-view-button,
.patient-appointment-controls .appointment-change-button { min-width: 154px; min-height: 40px; margin: 0; }
.patient-single-receipt-button { white-space: nowrap; }
.patient-single-receipt-button input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.patient-receipt-view-button span { color: #0d8479; font-weight: 900; }

.patient-task-grid { gap: 14px; }
.patient-task-card { min-height: 210px; padding: 19px; }
.patient-task-card header span { font-size: 10px; }
.patient-task-card header em { font-size: 9px; }
.patient-task-card h3 { margin: 20px 0 8px; color: var(--patient-navy-dark); font: 600 19px/1.25 "Fraunces", Georgia, serif; }
.patient-task-card p { font-size: 12px; line-height: 1.55; }
.patient-task-card footer { font-size: 10px; }
.patient-task-card footer a { min-height: 39px; padding: 0 14px; border-radius: 10px; font-size: 10px; }
.patient-subsection-heading h3 { font: 600 21px/1.2 "Fraunces", Georgia, serif; }
.patient-questionnaire-list article { min-height: 72px; padding: 14px 15px; }
.patient-questionnaire-list strong { font-size: 12px; }
.patient-questionnaire-list small { font-size: 10px; }

.patient-document-card > header { padding: 20px; }
.patient-document-card h3 { font: 600 18px/1.2 "Fraunces", Georgia, serif; }
.patient-document-card header small,
.patient-document-card dt { font-size: 9px; }
.patient-document-card header p,
.patient-document-card dd { font-size: 11px; }
.patient-document-card > footer a { min-height: 42px; font-size: 11px; }
.patient-privacy-note { padding: 17px 19px; }
.patient-privacy-note strong { font: 600 17px/1.2 "Fraunces", serif; }
.patient-privacy-note p { font-size: 11px; }

.patient-change-dialog {
  width: min(820px, calc(100vw - 32px));
  border: 1px solid var(--patient-line);
  border-radius: 20px;
  font-family: "DM Sans", system-ui, sans-serif;
}
.patient-change-dialog::backdrop { background: rgba(5, 35, 61, .58); backdrop-filter: blur(8px); }
.patient-change-dialog > header { min-height: 82px; padding: 17px 21px; background: linear-gradient(180deg, #fff, #fafcfd); }
.patient-change-dialog > header h2 { font: 600 25px/1.15 "Fraunces", Georgia, serif; }
.patient-change-dialog > header button { display: grid; place-items: center; font-family: inherit; }
.patient-change-dialog-body { padding: 21px; }
.patient-change-appointment-summary { padding: 15px; border-radius: 14px; }
.patient-change-appointment-summary strong { font-size: 13px; }
.patient-change-appointment-summary small { font-size: 11px; }
.appointment-change-forms { gap: 14px; margin-top: 14px; }
.appointment-change-forms form { gap: 13px; padding: 18px; border-radius: 14px; background: #f7fafb; }
.appointment-change-forms form > div strong { font: 600 17px/1.2 "Fraunces", Georgia, serif; }
.appointment-change-forms form > div small { font-size: 11px; }
.appointment-change-forms label { gap: 7px; font-size: 11px; }
.appointment-change-forms input,
.appointment-change-forms textarea { min-height: 43px; border-radius: 10px; padding: 10px 11px; color: #17344e; font: 12px "DM Sans", system-ui, sans-serif; }
.appointment-change-forms textarea { min-height: 82px; }
.appointment-change-forms form > button { width: 100%; }

@media (min-width: 761px) {
  body:has(.patient-app-shell) { font-size: 15px; }
  .patient-app-shell { align-items: start; }
  .patient-app-sidebar {
    position: sticky;
    top: 0;
    align-self: start;
    height: 100vh;
    min-height: 0;
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .28) transparent;
  }
  .patient-app-sidebar::-webkit-scrollbar { width: 6px; }
  .patient-app-sidebar::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(255, 255, 255, .28);
  }
  .patient-app-sidebar nav a,
  .patient-sidebar-logout button { font-size: 14px; }
  .patient-portal-heading p,
  .patient-section-heading p,
  .ui-page-header p { font-size: 15px; }
  .patient-onboarding-card h2 { font-size: 23px; }
  .patient-onboarding-card p { font-size: 13px; line-height: 1.45; }
  .patient-onboarding-steps a { min-height: 66px; padding: 12px 13px; }
  .patient-onboarding-steps strong,
  .patient-onboarding-steps small {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.35;
  }
  .patient-onboarding-steps strong { font-size: 13px; }
  .patient-onboarding-steps small { font-size: 12px; }
  .patient-portal-card h2,
  .patient-portal-card h3 { font-size: 22px; }
  .patient-portal-card header p { font-size: 13px; line-height: 1.45; }
  .patient-next-session-content strong { font-size: 18px; }
  .patient-next-session-content small { font-size: 13px; line-height: 1.4; }
  .patient-action-list strong { font-size: 14px; line-height: 1.35; }
  .patient-action-list small { font-size: 12px; line-height: 1.45; }
  .patient-private-banner small { font-size: 12px; line-height: 1.5; }
  .patient-app-shell .ui-empty-state p { font-size: 13px; line-height: 1.55; }
  .patient-session-list > div > span strong,
  .patient-questionnaire-list strong { font-size: 14px; }
  .patient-session-list > div > span small,
  .patient-questionnaire-list small { font-size: 12px; line-height: 1.4; }
  .patient-task-card p { font-size: 13px; }
  .patient-document-card header p,
  .patient-document-card dd,
  .patient-privacy-note p { font-size: 12px; }
}

@media (max-width: 980px) {
  .patient-app-shell { grid-template-columns: 210px minmax(0, 1fr); }
  .patient-app-content { padding: 32px 24px 48px; }
}

@media (max-width: 760px) {
  body:has(.patient-app-shell) > .topbar { height: 76px; padding-inline: 14px; }
  body:has(.patient-app-shell) > .topbar .brand img { width: min(64vw, 220px); height: 58px; }
  .patient-app-content { padding: 25px 14px calc(104px + env(safe-area-inset-bottom)); }
  .patient-portal-heading { align-items: center; text-align: center; }
  .patient-portal-heading > div { width: 100%; }
  .patient-portal-heading h1 { font-size: 34px; }
  .patient-portal-heading p { font-size: 13px; }
  .patient-portal-heading time { display: none; }
  .ui-page-header h1 { font-size: 29px; }
  .patient-next-session-content { margin: 13px; }
  .patient-next-session-content .status-pill { margin-left: 57px; }
  .patient-session-list { padding: 12px; }
  .patient-appointment-row { grid-template-columns: auto minmax(0,1fr) !important; }
  .patient-appointment-row > .status-pill { grid-column: 2; justify-self: start; }
  .patient-appointment-actions,
  .appointment-change-area { grid-column: 1 / -1; margin-left: 0; }
  .patient-appointment-controls { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; justify-content: stretch; }
  .patient-appointment-controls form,
  .patient-appointment-controls .patient-receipt-form,
  .patient-single-receipt-button,
  .patient-receipt-view-button,
  .patient-appointment-controls .appointment-change-button { width: 100%; }
  .patient-mobile-nav { height: auto; min-height: 72px; border-radius: 18px; background: rgba(7, 63, 120, .97); }
  .patient-mobile-nav a { color: #cfe0eb; }
  .patient-mobile-nav a.active { color: #fff; background: rgba(255,255,255,.13); box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
}

@media (max-width: 480px) {
  .patient-portal-home-grid,
  .patient-session-grid,
  .patient-task-grid,
  .patient-questionnaire-list { grid-template-columns: 1fr; }
  .patient-next-session-actions { display: grid; grid-template-columns: 1fr; }
  .patient-next-session-actions > * { width: 100%; }
  .patient-private-banner { grid-template-columns: auto minmax(0,1fr); }
  .patient-private-banner a { grid-column: 1 / -1; }
  .patient-mobile-nav { left: 6px; right: 6px; gap: 2px; padding: 5px; }
  .patient-mobile-nav a { padding-inline: 2px; }
  .patient-mobile-nav-label { font-size: 9px; }
}

/* Guided appointment picker: date strip + grouped time list. Selection is confirmed only from the summary bar. */
.patient-agenda-workspace {
  margin-top: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 16px;
}
.patient-agenda-workspace:has(> .patient-slot-picker),
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)) {
  grid-template-columns: minmax(520px, 1.15fr) minmax(360px, .85fr);
}
.patient-agenda-workspace > .patient-info-note { margin: 0; align-self: start; }
.patient-agenda-workspace:not(:has(> .patient-slot-picker)):not(:has(> :is(.patient-agenda-next-action, .patient-monthly-statement))) > .patient-agenda-records {
  max-width: 920px;
  height: auto;
  min-height: 170px;
}
.patient-agenda-next-action {
  height: 460px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #b9dfdf;
  border-radius: 16px;
  background: linear-gradient(145deg, #f5fcfc, #fff 68%);
  box-shadow: 0 1px 2px rgba(5,47,95,.035), 0 8px 22px rgba(5,47,95,.055);
}
.patient-agenda-next-action > header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.patient-agenda-next-action > header > span {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, #13a8a6, #087d86);
  box-shadow: 0 5px 13px rgba(8,125,134,.18);
}
.patient-agenda-next-action > header > span .ui-icon { width: 21px; height: 21px; }
.patient-agenda-next-action > header small {
  display: block;
  margin-bottom: 4px;
  color: #087c80;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.patient-agenda-next-action h2 {
  margin: 0 0 5px;
  color: #052f5f;
  font: 600 23px/1.15 "Fraunces", Georgia, serif;
}
.patient-agenda-next-action header p {
  margin: 0;
  max-width: 520px;
  color: #627784;
  font-size: 11.5px;
  line-height: 1.5;
}
.patient-agenda-next-action-summary {
  margin-top: 19px;
  padding: 13px 14px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid #dce8eb;
  border-radius: 12px;
  background: #fff;
}
.patient-agenda-next-action-summary time {
  width: 42px;
  height: 48px;
  display: grid;
  place-content: center;
  border-radius: 10px;
  color: #087d86;
  background: #e8f7f7;
  text-align: center;
}
.patient-agenda-next-action-summary time strong,
.patient-agenda-next-action-summary time small,
.patient-agenda-next-action-summary > div strong,
.patient-agenda-next-action-summary > div small { display: block; }
.patient-agenda-next-action-summary time strong { font: 700 17px/1 "Fraunces", Georgia, serif; }
.patient-agenda-next-action-summary time small { margin-top: 3px; font-size: 8px; font-weight: 900; }
.patient-agenda-next-action-summary > div strong { color: #123957; font-size: 12px; }
.patient-agenda-next-action-summary > div small { margin-top: 4px; color: #71838e; font-size: 10px; }
.patient-agenda-next-action-rejected {
  margin: 12px 0 0;
  padding: 9px 11px;
  border-radius: 9px;
  color: #8b3434;
  background: #fff0f0;
  font-size: 10.5px;
  line-height: 1.45;
}
.patient-agenda-next-action form {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
}
.patient-agenda-next-action form > small { color: #788a94; font-size: 9.5px; }
.patient-agenda-next-action-upload { min-height: 42px; cursor: pointer; }
.patient-agenda-next-action-upload input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.patient-agenda-next-action-deadline { margin: 11px 0 0; color: #6b7e89; font-size: 10.5px; }
.patient-agenda-next-action-receipt { width: max-content; margin-top: auto; }
.patient-agenda-next-change-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.patient-agenda-next-change-actions .secondary-button { min-height:40px; }
.patient-agenda-next-action.is-waiting { border-color: #b8dfcf; background: linear-gradient(145deg, #edf9f5, #fff 68%); }
.patient-agenda-next-action.is-waiting > header > span { background: linear-gradient(135deg, #24a184, #11745f); }
.patient-agenda-next-action.is-waiting h2,
.patient-agenda-next-action.is-waiting > header small { color: #08715f; }
.patient-agenda-next-action.is-complete { border-color: #c9e3d2; background: linear-gradient(145deg, #f5fbf7, #fff 68%); }
.patient-agenda-next-action.is-complete > header > span { background: linear-gradient(135deg, #2da36b, #197a4d); }
.patient-slot-picker {
  width: 100%;
  max-width: none;
  height: 460px;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 16px;
  background: var(--patient-paper, #fff);
  box-shadow: 0 1px 2px rgba(5,47,95,.035), 0 8px 22px rgba(5,47,95,.055);
}
.patient-slot-picker-heading {
  flex: 0 0 auto;
  padding: 17px 22px 12px;
}
.patient-slot-picker-heading h3 {
  margin: 0 0 4px;
  color: var(--patient-navy-dark, #052f5f);
  font: 600 22px/1.15 "Fraunces", Georgia, serif;
}
.patient-slot-picker-heading p {
  margin: 0;
  color: var(--patient-muted, #687985);
  font-size: 11.5px;
}
.patient-slot-picker form {
  min-height: 0;
  margin: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
}

.patient-slot-week-nav {
  width: 100%;
  max-width: 600px;
  margin-inline: auto;
  padding: 0 20px 10px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 12px;
}
.patient-slot-week-nav > strong {
  color: #123957;
  text-align: center;
  font-size: 13px;
  font-weight: 800;
}
.patient-slot-week-arrow {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 9px;
  color: var(--patient-navy, #073f78);
  background: #fff;
  font-family: inherit;
  font-size: 17px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}
.patient-slot-week-arrow:hover:not(:disabled) { border-color: #1ca9aa; background: #f3fbfb; }
.patient-slot-week-arrow:disabled { opacity: .35; cursor: not-allowed; }
.patient-slot-week-viewport {
  width: 100%;
  max-width: 600px;
  margin-inline: auto;
  flex: 0 0 auto;
  padding: 0 20px 12px;
  overflow: hidden;
  touch-action: pan-y;
}
.patient-slot-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}
.patient-slot-week[hidden] { display: none !important; }

.patient-slot-strip-nav {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 32px;
  align-items: center;
  gap: 8px;
  padding: 0 14px 12px;
}
.patient-slot-strip-arrow {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 9px;
  color: var(--patient-navy, #073f78);
  background: #fff;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  transition: opacity .15s ease, border-color .15s ease;
}
.patient-slot-strip-arrow:hover { border-color: #1ca9aa; }
.patient-slot-strip-arrow:disabled { opacity: .35; cursor: not-allowed; }
.patient-slot-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  padding: 2px;
}
.patient-slot-strip::-webkit-scrollbar { display: none; }

.patient-day-chip {
  position: relative;
  flex: 0 0 52px;
  scroll-snap-align: start;
  padding: 7px 4px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 10px;
  background: #fff;
  color: #123957;
  font-family: inherit;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.patient-slot-week .patient-day-chip {
  width: 100%;
  min-width: 0;
  height: 68px;
  flex: initial;
}
.patient-day-chip.is-unavailable {
  color: #96a7b2;
  background: #fbfcfd;
  cursor: not-allowed;
}
.patient-day-chip.is-unavailable:hover { border-color: var(--patient-line, #dce4e8); }
.patient-day-chip:hover { border-color: #1ca9aa; }
.patient-day-chip:focus-visible { outline: 3px solid rgba(32,191,178,.28); outline-offset: 2px; }
.patient-day-chip-dow {
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--patient-muted, #687985);
}
.patient-day-chip-num { font: 600 17px/1 "Fraunces", Georgia, serif; }
.patient-day-chip-density { display: flex; gap: 3px; align-items: center; justify-content: center; height: 6px; }
.patient-day-chip-density i { width: 4px; height: 4px; border-radius: 50%; background: #1ca9aa; }
.patient-day-chip.is-today { border-color: #78c8c8; background: #effafa; }
.patient-day-chip.is-today .patient-day-chip-dow { color: #087c80; }
.patient-day-chip.is-selected {
  border-color: #0b8f91;
  background: linear-gradient(135deg, #13a8a6, #087d86);
  box-shadow: 0 3px 9px rgba(8,125,134,.18);
}
.patient-day-chip.is-selected .patient-day-chip-dow,
.patient-day-chip.is-selected .patient-day-chip-num { color: #fff; }
.patient-day-chip.is-selected .patient-day-chip-density i { background: #fff; }

.patient-slot-groups {
  min-height: 0;
  padding: 12px 20px 10px;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 16px;
  max-height: none;
  overflow-y: auto;
  border-top: 1px solid #edf1f3;
  overscroll-behavior-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-color: #9acdcc transparent;
  scrollbar-width: thin;
}
.patient-slot-groups::-webkit-scrollbar { width: 8px; }
.patient-slot-groups::-webkit-scrollbar-track { background: transparent; }
.patient-slot-groups::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #9acdcc;
  background-clip: padding-box;
}
.patient-slot-day-panel.is-hidden { display: none; }
.patient-slot-group-label {
  margin: 0 0 7px;
  color: #6f8290;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.patient-slot-group + .patient-slot-group { margin-top: 14px; }
.patient-slot-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.patient-slot-option { position: relative; min-width: 0; cursor: pointer; }
.patient-slot-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.patient-slot-option > span {
  min-height: 38px;
  padding: 7px 10px;
  display: grid;
  place-items: center;
  border: 1px solid #1ca9aa;
  border-radius: 8px;
  color: #087c80;
  background: #fff;
  font-size: 12px;
  font-weight: 800;
  transition: color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
.patient-slot-option > i {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 15px;
  height: 15px;
  display: none;
  color: #fff;
  font-style: normal;
  transform: translateY(-50%);
}
.patient-slot-option > i .ui-icon { width: 15px; height: 15px; }
.patient-slot-option:hover > span { background: #f0fbfa; transform: translateY(-1px); }
.patient-slot-option input:focus-visible + span { outline: 3px solid rgba(32,191,178,.28); outline-offset: 2px; }
.patient-slot-option.is-selected > span,
.patient-slot-option:has(input:checked) > span {
  padding-right: 30px;
  border-color: #0b8f91;
  color: #fff;
  background: linear-gradient(135deg, #13a8a6, #087d86);
  box-shadow: 0 5px 13px rgba(8,125,134,.22);
}
.patient-slot-option.is-selected > i,
.patient-slot-option:has(input:checked) > i { display: block; }
.patient-slot-selection-bar {
  position: relative;
  flex: 0 0 auto;
  z-index: 5;
  bottom: auto;
  min-height: 62px;
  margin-top: 0;
  padding: 8px 16px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  border-top: 1px solid #dce9eb;
  border-radius: 0 0 16px 16px;
  background: linear-gradient(100deg, #effafa, #fff 72%);
  box-shadow: 0 -7px 18px rgba(5,47,95,.055);
}
.patient-slot-selection-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #12aaa5, #087b83);
  box-shadow: 0 5px 13px rgba(8,125,134,.2);
}
.patient-slot-selection-icon .ui-icon { width: 18px; height: 18px; }
.patient-slot-selection-bar small,
.patient-slot-selection-bar strong { display: block; }
.patient-slot-selection-bar small { margin-bottom: 3px; color: #78909e; font-size: 10px; }
.patient-slot-selection-bar strong { color: #123957; font-size: 13px; }
.patient-slot-selection-bar button {
  min-width: 118px;
  min-height: 38px;
  padding: 0 20px;
  border: 0;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(135deg, #0ca39f, #087684);
  box-shadow: 0 5px 13px rgba(8,118,132,.19);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.patient-slot-selection-bar button:disabled {
  color: #8da0ab;
  background: #dce6e9;
  box-shadow: none;
  cursor: not-allowed;
}

.patient-agenda-records {
  width: 100%;
  max-width: none;
  height: 460px;
  margin: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 16px;
  background: var(--patient-paper, #fff);
  box-shadow: 0 8px 22px rgba(5,47,95,.05);
}
.patient-agenda-tabs {
  flex: 0 0 auto;
  padding: 8px 10px 0;
  display: flex;
  gap: 4px;
  border-bottom: 1px solid #e5ecef;
  background: #f8fbfc;
}
.patient-agenda-tabs button {
  min-height: 43px;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  border-bottom: 3px solid transparent;
  color: #667c8a;
  background: transparent;
  font-family: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}
.patient-agenda-tabs button span {
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  color: #59717f;
  background: #e6eef1;
  font-size: 10px;
}
.patient-agenda-tabs button:hover { color: #0a6682; }
.patient-agenda-tabs button:focus-visible { outline: 3px solid rgba(32,191,178,.25); outline-offset: -2px; }
.patient-agenda-tabs button.is-active {
  border-bottom-color: #0b9997;
  color: #064d70;
  background: #fff;
}
.patient-agenda-tabs button.is-active span { color: #fff; background: #0b8f91; }
.patient-agenda-tab-panel { padding: 10px 18px 16px; }
.patient-agenda-tab-panel:not([hidden]) {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow-y: auto;
}
.patient-agenda-tab-panel[hidden] { display: none !important; }
.patient-agenda-tab-panel .patient-session-list {
  min-height: 100%;
  grid-auto-rows: max-content;
  align-content: start;
}
.patient-agenda-tab-panel .patient-session-list:has(.patient-agenda-empty) {
  display: flex;
  align-items: center;
}
.patient-agenda-tab-panel .patient-agenda-empty { width: 100%; }
.patient-agenda-empty {
  min-height: 78px;
  padding: 14px 16px;
  display: flex !important;
  align-items: center;
  gap: 13px;
  border: 1px solid #e1e9ed !important;
  border-radius: 12px;
  background: #fbfcfd;
}
.patient-agenda-empty > span {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #087d8c;
  background: #e7f5f7;
}
.patient-agenda-empty > span .ui-icon { width: 20px; height: 20px; }
.patient-agenda-empty strong,
.patient-agenda-empty small { display: block; }
.patient-agenda-empty strong { margin-bottom: 3px; color: #123957; font-size: 12px; }
.patient-agenda-empty small { color: #70838f; font-size: 10.5px; }

@media (max-width: 1050px) {
  .patient-agenda-workspace:has(> .patient-slot-picker),
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)) { grid-template-columns: minmax(0, 1fr); }
  .patient-slot-picker,
  .patient-agenda-records,
  .patient-agenda-next-action { width: 100%; max-width: 720px; margin-inline: auto; }
  .patient-agenda-next-action { height: auto; min-height: 360px; }
  .patient-agenda-records { height: auto; min-height: 170px; max-height: 520px; }
}

@media (max-width: 760px) {
  .patient-slot-picker { height: min(540px, calc(100dvh - 96px)); min-height: 480px; touch-action: pan-y; }
  .patient-slot-picker form { touch-action: pan-y; }
  .patient-slot-groups { overscroll-behavior-y: auto; }
  .patient-slot-picker-heading { padding: 19px 17px 14px; }
  .patient-slot-picker-heading h3 { font-size: 22px; }
  .patient-slot-week-nav { padding: 0 12px 12px; grid-template-columns: 34px minmax(0, 1fr) 34px; }
  .patient-slot-week-arrow { width: 34px; height: 34px; }
  .patient-slot-week-viewport { padding: 0 12px 13px; }
  .patient-slot-week { gap: 5px; }
  .patient-slot-week .patient-day-chip { height: 66px; padding-inline: 2px; }
  .patient-slot-strip-nav { padding: 0 10px 10px; grid-template-columns: 28px minmax(0, 1fr) 28px; }
  .patient-slot-strip-arrow { width: 28px; height: 28px; font-size: 13px; }
  .patient-day-chip { flex-basis: 46px; }
  .patient-slot-groups { padding: 14px 12px 10px; max-height: none; }
  .patient-slot-options { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .patient-slot-selection-bar { margin-top: 8px; padding: 11px 13px; gap: 10px; }
  .patient-slot-selection-icon { width: 38px; height: 38px; }
  .patient-slot-selection-bar button { min-width: 98px; min-height: 40px; padding: 0 14px; }
  .patient-agenda-records { margin: 0 auto; }
  .patient-agenda-tab-panel { padding: 8px 10px 12px; }
}

@media (max-width: 420px) {
  .patient-slot-picker { min-height: 480px; }
  .patient-slot-week { gap: 4px; }
  .patient-slot-week .patient-day-chip { height: 64px; }
  .patient-day-chip-dow { font-size: 8px; }
  .patient-day-chip-num { font-size: 15px; }
  .patient-slot-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .patient-slot-selection-bar { grid-template-columns: auto minmax(0, 1fr); }
  .patient-slot-selection-bar button { grid-column: 1 / -1; width: 100%; }
  .patient-agenda-next-action { min-height: 400px; padding: 18px; }
  .patient-agenda-next-action-summary { grid-template-columns: auto minmax(0, 1fr); }
  .patient-agenda-next-action-summary .status-pill { grid-column: 1 / -1; width: max-content; }
  .patient-agenda-next-action form { align-items: stretch; flex-direction: column; }
  .patient-agenda-next-action-upload { width: 100%; justify-content: center; }
}

/* Unified home: the agenda is part of the patient's main workflow. */
.patient-legacy-home-grid[hidden] { display: none !important; }
.patient-process-overview {
  margin-top: 18px;
  padding: 20px 22px;
  border: 1px solid var(--patient-line, #dce4e8);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(5,47,95,.05);
}
.patient-process-overview > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.patient-process-overview .eyebrow { color: #087f76; }
.patient-process-overview h2 { margin: 4px 0 6px; color: #052f5f; font: 650 24px/1.2 "Fraunces", Georgia, serif; }
.patient-process-overview p { margin: 0; color: #587181; font-size: 12px; line-height: 1.5; }
.patient-process-overview-counts {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.patient-process-overview-counts > div {
  min-height: 76px;
  padding: 13px 15px;
  display: grid;
  align-content: center;
  gap: 3px;
  border: 1px solid #dce8eb;
  border-radius: 12px;
  background: #f8fbfc;
}
.patient-process-overview-counts strong { color: #087f76; font: 700 24px/1 "Fraunces", Georgia, serif; }
.patient-process-overview-counts span { color: #587181; font-size: 11px; font-weight: 700; }
.patient-unified-agenda { margin-top: 30px; scroll-margin-top: 22px; }
.patient-unified-agenda-heading { margin-bottom: 14px; }
.patient-unified-agenda-heading .eyebrow { color: #087f76; }
.patient-unified-agenda-heading h2 { margin: 4px 0 6px; color: #052f5f; font: 650 28px/1.15 "Fraunces", Georgia, serif; }
.patient-unified-agenda-heading p { margin: 0; color: #587181; font-size: 13px; }

@media (max-width: 640px) {
  .patient-process-overview { padding: 18px; }
  .patient-process-overview > header { align-items: flex-start; flex-direction: column; }
  .patient-process-overview > header .secondary-button { width: 100%; justify-content: center; }
  .patient-process-overview-counts { grid-template-columns: 1fr; }
  .patient-process-overview-counts > div { min-height: 62px; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 8px; }
  .patient-process-overview-counts strong { grid-row: 1 / span 2; }
  .patient-unified-agenda { margin-top: 24px; }
}

/* Appointment action row: one clear place for payment, appointments and preparation. */
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > :is(.patient-agenda-next-action, .patient-monthly-statement),
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > .patient-agenda-records,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > .patient-agenda-session-note {
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 460px;
  margin: 0;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > :is(.patient-agenda-next-action, .patient-monthly-statement) {
  overflow: visible;
}
.patient-agenda-session-note {
  padding: 22px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 18px;
  overflow: hidden;
  border: 1px solid #b9ded8;
  border-radius: 16px;
  background: linear-gradient(120deg, #edf9f6 0%, #ffffff 62%);
  box-shadow: 0 8px 24px rgba(5,47,95,.055);
}
.patient-agenda-session-note > header { flex: 0 0 auto; }
.patient-agenda-session-note h2 { font-size: 20px; }
.patient-agenda-session-note form { width: 100%; min-height: 0; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.patient-session-note-label { color: #173f4f; font-size: 12px; font-weight: 750; line-height: 1.35; }
.patient-agenda-session-note textarea { box-sizing: border-box; min-height: 112px; flex: 1; }
.patient-agenda-session-note form footer { margin-top: 10px; }
.patient-process-panel { margin-top: 18px; }
.patient-process-panel .patient-process-overview { margin-top: 0; }

@media (max-width: 1350px) and (min-width: 1051px) {
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > .patient-agenda-session-note {
    grid-column: 1 / -1;
    height: auto;
    min-height: 250px;
  }
}

/* Future sessions are progressively revealed in small, easy-to-scan batches. */
.patient-agenda-tab-panel .patient-session-list[data-patient-future-list] {
  min-height: 0;
  flex: 0 0 auto;
}
.patient-session-list > .patient-appointment-row[hidden] {
  display: none !important;
}
.patient-future-load-more {
  flex: 0 0 auto;
  margin: 4px 12px 12px;
  display: grid;
  gap: 5px;
  text-align: center;
}
.patient-future-load-more button {
  width: 100%;
  min-height: 38px;
  justify-content: center;
}
.patient-future-load-more small {
  color: #69808d;
  font-size: 10px;
}

/* Desktop portal shell: keep navigation and the top bar in place. Only the
   content column owns page scrolling, so the app never scrolls as a whole. */
@media (min-width: 761px) {
  html:has(.patient-app-shell),
  body:has(.patient-app-shell) {
    height: 100%;
    overflow: hidden;
  }
  body:has(.patient-app-shell) {
    min-height: 100dvh;
    height: 100dvh;
    display: flex;
    flex-direction: column;
  }
  body:has(.patient-app-shell) > .staging-banner,
  body:has(.patient-app-shell) > .topbar {
    flex: 0 0 auto;
  }
  body:has(.patient-app-shell) > .page {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }
  .patient-app-shell {
    height: 100%;
    min-height: 0;
    align-items: stretch;
  }
  .patient-app-sidebar {
    position: static;
    top: auto;
    align-self: stretch;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
  }
  .patient-app-content {
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }
}

/* Keep the compact future-appointments column readable on wide screens.
   Its cards live beside the next-session and preparation panels, so their
   controls need to stack rather than forcing a horizontal scrollbar. */
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-agenda-tab-panel {
  overflow-x: hidden;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-session-list {
  padding: 10px 12px 12px;
  gap: 8px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-row {
  min-width: 0;
  grid-template-columns: 50px minmax(0, 1fr);
  column-gap: 9px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-row > .status-pill {
  grid-column: 2;
  justify-self: start;
  margin-top: 3px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  margin-top: 8px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls > *,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls form {
  min-width: 0;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-single-receipt-button,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-receipt-view-button,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls .appointment-change-button {
  min-width: 0;
  min-height: 36px;
  white-space: normal;
  justify-content: center;
  text-align: center;
}

/* A future appointment has a compact identity: when it is, its status, then
   the two relevant actions. This prevents the status from floating alone in
   the card and keeps the list easy to scan. */
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-row {
  align-items: start;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary {
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 7px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary > span {
  min-width: 0;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary strong,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary small {
  display: block;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary strong {
  color: #052f5f;
  font-size: 13px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary small {
  margin-top: 5px;
  color: #687985;
  font-size: 10px;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-summary > .status-pill {
  width: max-content;
  min-height: 22px;
  margin: 1px 0 0;
  padding: 3px 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: start;
  border: 1px solid #d2e1e5;
  border-radius: 999px;
  color: #3c6173;
  background: #f4f9fa;
  font-size: 9px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls {
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  align-items: stretch;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls > :only-child,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls:has(> :nth-child(3)) > :first-child,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls .change-request-pending {
  grid-column: 1 / -1;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-single-receipt-button,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-receipt-view-button,
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls .appointment-change-button {
  min-height: 44px;
  padding-inline: 12px;
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}
.patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) .patient-appointment-controls .appointment-change-button {
  white-space: normal;
  text-wrap: balance;
}

/* Card descriptions sit below the icon/title row and use the full card width. */
.patient-agenda-next-action > header,
.patient-agenda-session-note > header {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  column-gap: 14px;
  row-gap: 0;
  align-items: start;
}
.patient-agenda-next-action > header > span,
.patient-agenda-session-note > header > span {
  grid-column: 1;
  grid-row: 1 / span 2;
}
.patient-agenda-next-action > header > div,
.patient-agenda-session-note > header > div {
  display: contents;
}
.patient-agenda-next-action > header small,
.patient-agenda-session-note > header small {
  grid-column: 2;
  grid-row: 1;
}
.patient-agenda-next-action > header h2,
.patient-agenda-session-note > header h2 {
  grid-column: 2;
  grid-row: 2;
  margin: 2px 0 0;
}
.patient-agenda-next-action > header p,
.patient-agenda-session-note > header p {
  grid-column: 1 / -1;
  grid-row: 3;
  width: 100%;
  max-width: none;
  margin: 9px 0 0;
}

@media (max-width: 1050px) {
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) {
    grid-template-columns: minmax(0, 1fr);
  }
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > :is(.patient-agenda-next-action, .patient-monthly-statement) {
    height: auto;
    min-height: 0;
    max-width: 720px;
    margin-inline: auto;
  }
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > .patient-agenda-session-note {
    height: auto;
    min-height: 300px;
    max-width: 720px;
    margin-inline: auto;
  }
}

@media (max-width: 760px) {
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > :is(.patient-agenda-next-action, .patient-monthly-statement) {
    padding: 18px 16px;
    border-radius: 16px;
  }
  .patient-agenda-next-action > header { column-gap: 12px; row-gap: 0; }
  .patient-agenda-next-action > header > span { width: 42px; height: 42px; flex-basis: 42px; border-radius: 12px; }
  .patient-agenda-next-action h2 { font-size: 22px; }
  .patient-agenda-next-action-summary { margin-top: 16px; padding: 12px; }
  .patient-agenda-next-action form,
  .patient-agenda-next-action-receipt { margin-top: 16px; }
  .patient-agenda-workspace:has(> :is(.patient-agenda-next-action, .patient-monthly-statement)):has(> .patient-agenda-session-note) > .patient-agenda-session-note {
    min-height: 0;
    padding: 18px 16px;
    gap: 12px;
    border-radius: 16px;
  }
  .patient-agenda-session-note > header {
    grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 12px;
    row-gap: 0;
  }
  .patient-agenda-session-note > header > span { width: 42px; height: 42px; border-radius: 12px; }
  .patient-agenda-session-note h2 { margin-top: 3px; font-size: 22px; }
  .patient-agenda-session-note p { font-size: 12.5px; line-height: 1.5; }
  .patient-agenda-session-note form { gap: 8px; }
  .patient-session-note-label { font-size: 12px; }
  .patient-agenda-session-note textarea {
    min-height: 110px;
    flex: 0 0 auto;
    padding: 13px 14px;
    font-size: 14px;
    resize: vertical;
  }
  .patient-agenda-session-note form footer { margin-top: 2px; gap: 9px; }
  .patient-agenda-session-note form footer small { align-self: flex-start; font-size: 10.5px; line-height: 1.4; }
  .patient-agenda-session-note button { min-height: 46px; }
}
.patient-debt-notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    margin: 0 0 20px;
    padding: 18px 20px;
    border: 1px solid #efb4ae;
    border-left: 5px solid #c94b42;
    border-radius: 16px;
    background: #fff6f4;
    color: #5d2925;
    box-shadow: 0 8px 24px rgba(86, 37, 33, .08);
}
.patient-debt-notice-icon {
    display: inline-grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border-radius: 13px;
    background: #f9dcd8;
    color: #a63831;
}
.patient-debt-notice-icon svg { width: 22px; height: 22px; }
.patient-debt-notice small { display: block; color: #a63831; font-size: 11px; font-weight: 900; letter-spacing: .09em; }
.patient-debt-notice h2 { margin: 3px 0 4px; color: #6f211c; font-size: 21px; }
.patient-debt-notice p { margin: 0; color: #71413d; line-height: 1.5; }
.patient-debt-notice em { display: block; margin-top: 5px; color: #7e5c58; font-size: 13px; font-style: normal; }
.patient-debt-details { margin-top: 12px; }
.patient-debt-details summary { width: fit-content; color: #7b2924; font-size: 13px; font-weight: 800; cursor: pointer; }
.patient-debt-details summary:hover { color: #a63831; }
.patient-debt-details ul { min-width: min(520px, 100%); margin: 10px 0 0; padding: 0; overflow: hidden; border: 1px solid #efc9c5; border-radius: 11px; background: rgba(255,255,255,.62); list-style: none; }
.patient-debt-details li { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 12px; border-bottom: 1px solid #f1d8d5; }
.patient-debt-details li:last-child { border-bottom: 0; }
.patient-debt-details li > span { min-width: 0; }
.patient-debt-details li strong { color: #642a26; font-size: 12px; white-space: nowrap; }
.patient-debt-details li small { margin-top: 2px; color: #80534f; font-size: 11px; font-weight: 500; letter-spacing: 0; }
.patient-debt-notice form { margin: 0; }
.patient-debt-notice label { position: relative; display: inline-flex; cursor: pointer; white-space: nowrap; }
.patient-debt-notice label input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.patient-debt-notice.is-under-review { border-color: #9ed9ca; border-left-color: #18947f; background: #effaf7; color: #174e45; box-shadow: 0 8px 24px rgba(24, 111, 94, .08); }
.patient-debt-notice.is-under-review .patient-debt-notice-icon { background: #cdeee6; color: #087e6e; }
.patient-debt-notice.is-under-review small { color: #087465; }
.patient-debt-notice.is-under-review h2 { color: #125c50; }
.patient-debt-notice.is-under-review p,
.patient-debt-notice.is-under-review em { color: #376c63; }
.patient-debt-notice.is-under-review .patient-debt-details summary { color: #176f61; }
.patient-debt-notice.is-under-review .patient-debt-details ul { border-color: #b9dfd5; }
.patient-debt-notice.is-under-review .patient-debt-details li { border-color: #d4ebe5; }
.patient-debt-notice.is-under-review .patient-debt-details li strong { color: #215f55; }
.patient-debt-notice.is-under-review .patient-debt-details li small { color: #52796f; }
@media (max-width: 760px) {
    .patient-debt-notice { grid-template-columns: auto minmax(0, 1fr); }
    .patient-debt-notice form, .patient-debt-notice > .secondary-button { grid-column: 1 / -1; width: 100%; }
    .patient-debt-notice label { width: 100%; justify-content: center; }
    .patient-debt-details ul { min-width: 100%; }
    .patient-debt-details li { align-items: flex-start; flex-direction: column; gap: 5px; }
}
.patient-fee-update{position:relative;margin:0 0 20px;padding:20px;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(230px,300px);gap:18px;align-items:start;overflow:hidden;border:1px solid #d9bf78;border-radius:18px;background:linear-gradient(115deg,#fffaf0,#fff4d7);box-shadow:0 10px 25px rgba(114,78,16,.08)}.patient-fee-update::before{position:absolute;inset:0 auto 0 0;width:5px;background:#d79b2d;content:""}.patient-fee-update-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#e5a93f;color:#fff;font:700 22px/1 "Fraunces",serif}.patient-fee-update-copy>small{color:#8a6210;font-size:10px;font-weight:800;letter-spacing:.1em}.patient-fee-update-copy h2{margin:5px 0 7px;color:#073665;font:600 21px/1.2 "Fraunces",serif}.patient-fee-update-copy p{margin:0;color:#526979;font-size:13px;line-height:1.55}.patient-fee-update-copy blockquote{margin:12px 0 8px;padding:10px 12px;border-left:3px solid #d79b2d;background:rgba(255,255,255,.6);color:#526979;font-size:12px;line-height:1.5}.patient-fee-update-copy>span{display:block;margin-top:8px;color:#7b6a44;font-size:11px}.patient-fee-update-actions{display:grid;gap:9px}.patient-fee-update-actions form{display:grid;gap:9px}.patient-fee-update-actions label{display:flex;align-items:flex-start;gap:8px;color:#5b513d;font-size:10px;line-height:1.4}.patient-fee-update-actions input{width:16px;height:16px;flex:0 0 auto;margin:0;accent-color:#087f79}.patient-fee-update-actions button{width:100%}.patient-fee-update-document{overflow:hidden;border:1px solid #d9e5e9;border-radius:16px;background:#fff}.patient-fee-update-document header{padding:17px 18px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #e6ecef}.patient-fee-update-document header>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff2d8;color:#96672d;font-weight:800}.patient-fee-update-document header small{color:#087d78;font-size:9px;font-weight:800;letter-spacing:.09em}.patient-fee-update-document h3{margin:3px 0 0;color:#073665;font:600 17px "Fraunces",serif}.patient-fee-update-document dl{margin:0;padding:10px 18px}.patient-fee-update-document dl>div{padding:8px 0;display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid #edf1f3}.patient-fee-update-document dl>div:last-child{border-bottom:0}.patient-fee-update-document dt{color:#687f8e;font-size:10px}.patient-fee-update-document dd{margin:0;color:#073665;font-size:11px;font-weight:700;text-align:right}.patient-fee-update-document footer{padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #e6ecef;background:#f8fafb}.patient-fee-update-document footer>small{color:#7b8d98;font-size:8px;overflow-wrap:anywhere;text-align:right}
@media(max-width:850px){.patient-fee-update{grid-template-columns:auto minmax(0,1fr)}.patient-fee-update-actions{grid-column:1/-1}}
@media(max-width:560px){.patient-fee-update{grid-template-columns:1fr;padding:18px}.patient-fee-update-icon{width:40px;height:40px}.patient-fee-update-actions{grid-column:auto}.patient-fee-update-document footer{align-items:flex-start;flex-direction:column}.patient-fee-update-document footer>small{text-align:left}}