/* Nobat Yar final field-QA patch: mobile booking stability and readability. */

/* Doctor-facing/patient notes: keep clinical context readable. */
.np-appointment-clinical{display:block!important;max-width:360px!important;margin-top:8px!important;padding:0!important;border:1px solid #d9e6e7!important;border-radius:12px!important;background:#f8fbfb!important;overflow:hidden!important}
.np-appointment-clinical>summary{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;padding:9px 11px!important;color:#31545b!important;font-size:11px!important;font-weight:850!important;cursor:pointer!important;list-style:none!important}
.np-appointment-clinical>summary::-webkit-details-marker{display:none}.np-appointment-clinical>summary:after{content:'⌄';font-size:14px;transition:transform .16s ease}.np-appointment-clinical[open]>summary:after{transform:rotate(180deg)}
.np-patient-note-preview{background:#f2faf7!important;border-color:#d8e9e5!important}.np-patient-note-text{max-height:190px;padding:11px 13px;border-top:1px solid #d8e9e5;color:#405d56;font-size:12px;line-height:1.9;white-space:pre-wrap;overflow:auto;overflow-wrap:anywhere}
.np-booking-shell textarea[data-note]{min-height:132px!important;resize:vertical!important;line-height:1.9!important}
.np-appointment-files{background:#f7fbfd!important}.np-appointment-file-list{display:grid;gap:6px;padding:0 9px 9px;border-top:1px solid #d9e6eb}.np-appointment-file-link{display:grid;gap:2px;margin-top:8px;padding:9px 10px;border:1px solid #e1eaed;border-radius:9px;background:#fff;color:var(--np-primary)!important;text-decoration:none!important;overflow-wrap:anywhere}.np-appointment-file-link strong{font-size:11px}.np-appointment-file-link small{color:#71858b;font-size:9px;font-weight:700}.np-appointment-file-link:hover{border-color:color-mix(in srgb,var(--np-primary) 30%,#dbe8ec);box-shadow:0 5px 14px rgba(22,66,76,.06)}
.np-appointment-files-state{font-size:12px;line-height:1.8;color:#50666e}.np-appointment-files[data-state="loading"]{background:#f7fbff;border-color:#d7e7f7}.np-appointment-files[data-state="error"]{background:#fff8f7;border-color:#efcfca}.np-appointment-files[data-state="error"] .np-appointment-files-state{color:#8a3f36}.np-appointment-files-retry{justify-self:start;border:1px solid color-mix(in srgb,var(--np-primary) 36%,#d7e4e8);border-radius:9px;background:#fff;color:var(--np-primary);font:inherit;font-size:12px;font-weight:800;padding:7px 11px;cursor:pointer}.np-appointment-files-retry:hover,.np-appointment-files-retry:focus-visible{background:color-mix(in srgb,var(--np-primary) 8%,#fff);outline:2px solid color-mix(in srgb,var(--np-primary) 32%,transparent);outline-offset:2px}

/* Scheduling actions and time controls use the product blue treatment. */
.np-admin-portal-page .np-workday-card .np-button-primary,
.np-admin-portal-page .np-workday-card button[type="submit"],
.np-admin-portal-page .np-mini-button{border-color:color-mix(in srgb,var(--np-primary) 32%,#d7e4e8)!important;color:var(--np-primary)!important}
.np-admin-portal-page .np-day-toggle input:checked+span{background:var(--np-primary)!important}
.np-admin-portal-page .np-time-select{border:1px solid color-mix(in srgb,var(--np-primary) 28%,#cad9df)!important;background:#fff!important;color:#183f55!important;box-shadow:none!important}
.np-admin-portal-page .np-time-select:hover{border-color:color-mix(in srgb,var(--np-primary) 58%,#cad9df)!important}
.np-admin-portal-page .np-time-select:focus{border-color:var(--np-primary)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--np-primary) 16%,transparent)!important;outline:none!important}

/* SMS operations: distinguish gateway acceptance from handset delivery. */
.np-sms-cron-health{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 14px;padding:14px 16px;border:1px solid #dce7e9;border-radius:15px;background:#f7fbfb}.np-sms-cron-health strong{display:block;color:#244b53}.np-sms-cron-health p{margin:4px 0 0;color:#637980;font-size:11px;line-height:1.8}.np-sms-cron-health.is-healthy{border-color:#cce8dc;background:#f3fbf7}.np-sms-cron-health.is-healthy strong{color:#28705d}.np-sms-cron-health.is-warning{border-color:#edd8aa;background:#fffaf0}.np-sms-cron-health.is-warning strong{color:#805f1e}.np-sms-monitor-stats .is-delivered{border-color:#cce8dc!important;background:#f3fbf7!important;color:#28705d!important}.np-delivery-state{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:#eef4f5;color:#47636b;font-size:10px;font-weight:850;white-space:nowrap}.np-delivery-state:before{content:"";width:7px;height:7px;border-radius:50%;background:#8aa0a6}.np-delivery-state.is-delivered{background:#edf9f4;color:#24705a}.np-delivery-state.is-delivered:before{background:#31a57f}.np-delivery-state.is-undelivered,.np-delivery-state.is-failed{background:#fff0f0;color:#a1434b}.np-delivery-state.is-undelivered:before,.np-delivery-state.is-failed:before{background:#d45c66}.np-delivery-state.is-accepted,.np-delivery-state.is-pending{background:#eef7ff;color:#28658b}.np-delivery-state.is-accepted:before,.np-delivery-state.is-pending:before{background:#438fbe}.np-sms-monitor td code{display:block;max-width:180px;overflow-wrap:anywhere;white-space:normal}

/* Sidebar/settings group buttons keep readable contrast in all states. */
.np-admin-portal-page .np-portal-nav-group-toggle{background:#f4f8fb!important;color:#244b61!important;border-color:#d8e5ec!important}
.np-admin-portal-page .np-portal-nav-group-toggle:hover,.np-admin-portal-page .np-portal-nav-group-toggle:focus-visible{background:color-mix(in srgb,var(--np-primary) 10%,#fff)!important;color:var(--np-primary)!important;border-color:color-mix(in srgb,var(--np-primary) 35%,#d8e5ec)!important}
.np-admin-portal-page .np-portal-nav-group-toggle[aria-expanded="true"],.np-admin-portal-page .np-portal-nav-group.is-open>.np-portal-nav-group-toggle{background:var(--np-primary)!important;color:#fff!important;border-color:var(--np-primary)!important}

/* Settings cards: remove low-contrast danger/red surfaces unless the control is truly destructive. */
.np-admin-portal-page .np-form-section,
.np-admin-portal-page .np-switch-card,
.np-admin-portal-page fieldset.np-provider-fields{border-color:#dfe8eb!important;background:#fbfdfd!important;color:#314b53!important}

/* Mobile booking: reserve stable space and avoid layout jumps while validation/loading changes. */
.np-booking-shell .np-inline-error{min-height:24px!important}
.np-booking-shell .np-upload-status{min-height:24px!important}
.np-booking-shell .np-action-row{min-height:52px!important}
.np-booking-shell .np-button{touch-action:manipulation!important}
.np-booking-shell .np-button.is-busy{pointer-events:none!important}
.np-booking-shell .np-panel{scroll-margin-top:12px!important}

@media(max-width:700px){
 html:has(.np-booking-shell){scroll-behavior:auto!important}
 .np-booking-shell{overflow-anchor:none!important;contain:layout style!important}
 .np-booking-shell .np-booking-card{overflow:clip!important}
 .np-booking-shell .np-panel{overflow-anchor:none!important;scroll-margin-top:8px!important}
 .np-booking-shell input,.np-booking-shell textarea,.np-booking-shell select{font-size:16px!important}
 .np-booking-shell textarea[data-note]{min-height:140px!important}
 .np-booking-shell .np-action-row{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;width:100%!important}
 .np-booking-shell .np-action-row .np-button{width:100%!important;min-height:50px!important}
 .np-booking-shell .np-action-row .np-selection-summary{width:100%!important;min-width:0!important}
 .np-booking-shell .np-consent{align-items:flex-start!important;line-height:1.9!important}
 .np-booking-shell .np-consent span{font-size:12px!important;line-height:1.9!important}
 .np-booking-shell .np-slot-grid,.np-booking-shell .np-date-strip{overflow-anchor:none!important}
 .np-booking-shell .np-calendar-sheet{max-height:min(88dvh,760px)!important;padding-bottom:max(16px,env(safe-area-inset-bottom))!important}
 .np-appointment-files{max-width:none}
}

@media(max-width:430px){
 .np-booking-shell .np-booking-card{border-radius:16px!important}
 .np-booking-shell .np-panel{padding-inline:14px!important}
 .np-booking-shell .np-action-row{padding-bottom:max(4px,env(safe-area-inset-bottom))!important}
}

/*
 * Keep post-OTP booking actions in the normal document flow. The older UI layer
 * applies a fixed footer only after np-step-engaged is added; that footer covers
 * date/time controls and is the source of the post-login layout break.
 */
@media(max-width:760px){
 .np-app.np-booking-shell.np-step-engaged .np-booking-hero{display:grid!important}
 .np-booking-shell .np-panel{padding-bottom:22px!important}
 .np-booking-shell .np-action-row{position:static!important;right:auto!important;left:auto!important;bottom:auto!important;z-index:auto!important;grid-template-columns:1fr!important;gap:9px!important;width:100%!important;margin:20px 0 0!important;padding:15px 0 max(4px,env(safe-area-inset-bottom))!important;border-top:1px solid #edf1f2!important;background:transparent!important;backdrop-filter:none!important;box-shadow:none!important}
 .np-booking-shell .np-action-row>.np-button:only-child,.np-booking-shell .np-action-row>.np-button:last-child{min-width:0!important;width:100%!important}
 .np-booking-shell .np-action-row .np-selection-summary{width:100%!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
 .np-app .np-toast{bottom:16px!important}
}