/*
 * Nodly legibility system
 * Final presentation layer shared by professional, admin and patient surfaces.
 * Keeps Cuaderno Vivo visual language while enforcing readable type, contrast
 * and interaction states in light/dark themes. No product behavior lives here.
 */

:root{
  --nodly-type-body:14px;
  --nodly-type-copy:13px;
  --nodly-type-small:12px;
  --nodly-type-micro:11px;
  --nodly-leading-body:1.55;
  --nodly-leading-compact:1.4;
}

html[data-nodly-theme="light"] body.authenticated{
  --nodly-text-primary:#243043;
  --nodly-text-secondary:#4f5d6d;
  --nodly-text-tertiary:#647183;
  --nodly-text-link:#3f5f90;
  --nodly-text-positive:#385f82;
  --nodly-text-warning:#825f20;
  --nodly-text-danger:#963f42;
  --nodly-focus:#526f9e;
}

html[data-nodly-theme="dark"] body.authenticated{
  --nodly-text-primary:#f4f0e8;
  --nodly-text-secondary:#c9d1da;
  --nodly-text-tertiary:#b2bdc8;
  --nodly-text-link:#c1d0e7;
  --nodly-text-positive:#c5d7e9;
  --nodly-text-warning:#f0ce82;
  --nodly-text-danger:#efaaa8;
  --nodly-focus:#e2c776;
}

/* Base reading rhythm. */
body.authenticated{font-size:var(--nodly-type-body);line-height:var(--nodly-leading-body);text-rendering:optimizeLegibility}
body.authenticated .app-shell{color:var(--nodly-text-primary)}
body.authenticated .app-shell :is(p,li,dd,td){line-height:var(--nodly-leading-body)}
body.authenticated .app-shell p{color:var(--nodly-text-secondary);font-size:var(--nodly-type-copy)!important}
body.authenticated .app-shell small{color:var(--nodly-text-secondary);font-size:var(--nodly-type-small)!important;line-height:var(--nodly-leading-compact)!important}
body.authenticated .app-shell :is(h1,h2,h3,h4,strong,b){text-wrap:pretty}
body.authenticated .app-shell :is(p,small,span,td,th,label,button,a){-webkit-font-smoothing:antialiased}

/* Secondary copy uses verified tokens instead of inherited low-opacity greens. */
body.authenticated .app-shell :is(
  .page-head p,.card-title small,.section-heading p,.field-help,.editor-help,
  .table-subtext,.session-subtext,.payment-origin,.agenda-origin,.detail-list-row small,
  .patient-facts dt,.patient-detail-card>p,.activity p,.activity time,.activity-empty p,
  .empty-state p,.patient-empty p,.automation-row small,.reminder-step small,.meet-preview small,
  .integration p,.integration small,.account-section p,.settings-group p,.module-guide p,
  .context-help-popover p,.notification-popover p,.agenda-patient-time-popover small
){color:var(--nodly-text-secondary)!important}

body.authenticated .app-shell :is(
  .eyebrow,.page-head-gesture,.nav-label,.metric-top,.metric-foot,.control-label,
  .channel-chip,.badge,.status-pill,.patient-status,.mobile-patient-status,.agenda-list-repeat,
  .calendar-legend,.matrix-legend span,.autosave-note,.count-chip,.package-badge
){font-size:var(--nodly-type-micro)!important;line-height:var(--nodly-leading-compact)!important}

body.authenticated .app-shell :is(.text-link,.card-title a,.row-action,.add-range){color:var(--nodly-text-link)!important;font-size:var(--nodly-type-small)!important}
body.authenticated .app-shell :is([class*="-hint"],[class*="-help"],[class*="-note"],[class*="-subtext"],[class*="-description"],[class*="-caption"]){font-size:var(--nodly-type-small)!important;line-height:var(--nodly-leading-body)!important}
body.authenticated .app-shell :is([class*="-label"],[class*="-meta"]){font-size:11.5px!important;line-height:var(--nodly-leading-compact)!important}
body.authenticated .app-shell :is([class*="-badge"],[class*="-chip"],[class*="-pill"],[class*="-status"]){font-size:var(--nodly-type-micro)!important;line-height:var(--nodly-leading-compact)!important}
body.authenticated .app-shell :is([class*="-foot"],[class*="-footer"]) :is(small,span,p,em){font-size:11.5px!important;line-height:var(--nodly-leading-compact)!important}
html[data-nodly-theme="dark"] body.authenticated .app-shell a:not(.nav-item):not(.primary-button):not(.secondary-button):not(.soft-button):not(.sky-next-meet){color:var(--nodly-text-link)}

/* Navigation and shell. */
body.authenticated :is(.main-nav,.patient-nav,.admin-nav) .nav-item{min-height:44px;font-size:13px;line-height:1.3}
body.authenticated :is(.main-nav,.patient-nav,.admin-nav) .nav-item b{font-size:13px!important;line-height:1.3!important}
body.authenticated .sidebar :is(.brand small,.profile-card small,.sidebar-plan small,.profile-mode,.profile-plan){color:var(--nodly-sidebar-muted)!important;font-size:11.5px!important;line-height:1.4!important}
body.authenticated .sidebar .nav-label{color:color-mix(in srgb,var(--nodly-sidebar-muted),white 10%)!important;font-weight:700}
html[data-nodly-theme="dark"] body.authenticated :is(.main-nav,.patient-nav,.admin-nav) .nav-item{color:#c4ced9}
html[data-nodly-theme="dark"] body.authenticated :is(.main-nav,.patient-nav,.admin-nav) .nav-item:hover{color:#fffaf0}

/* Tables and dense operational lists. */
body.authenticated .app-shell .data-table th{font-size:11.5px!important;line-height:1.4!important;color:var(--nodly-text-secondary)!important;font-weight:750}
body.authenticated .app-shell .data-table td{font-size:13px!important;line-height:1.5!important;color:var(--nodly-text-primary)}
body.authenticated .app-shell .data-table :is(.person small,.table-subtext){font-size:12px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .app-shell .data-table .person strong{font-size:13.5px!important;color:var(--nodly-text-primary)}
body.authenticated .app-shell :is(.detail-list-row,.activity,.admin-alert-row,.admin-notification-history-row){min-height:48px}

/* Forms and interactive targets. */
body.authenticated .app-shell :is(.form-group,.editor-two,.agenda-editor-form,.email-field)>label,
body.authenticated .app-shell form>label{font-size:12px!important;line-height:1.4!important;color:var(--nodly-text-primary)}
body.authenticated .app-shell :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){min-height:44px;font-size:14px!important;line-height:1.4!important}
body.authenticated .app-shell textarea{padding-block:11px}
body.authenticated .app-shell :is(.primary-button,.secondary-button,.soft-button,.row-action,.icon-button){min-height:40px;font-size:12.5px!important;line-height:1.25!important;font-weight:700}
body.authenticated .app-shell :is(button,a,input,select,textarea,[tabindex]):focus-visible{outline:3px solid color-mix(in srgb,var(--nodly-focus),transparent 48%)!important;outline-offset:2px!important}
body.authenticated .app-shell :is(button,input,select,textarea):disabled{opacity:.62;cursor:not-allowed}
html[data-nodly-theme="dark"] body.authenticated .app-shell :is(input,select,textarea)::placeholder{color:#9faab5;opacity:1}

/* Dashboard — the main source of sub-11px text in the reference capture. */
body.authenticated .sky-card-label{font-size:11px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-agenda-copy p{font-size:13px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-agenda-visual small{font-size:11px!important}
body.authenticated .sky-kpi small{font-size:12px!important;line-height:1.35!important}
body.authenticated .sky-kpi span{font-size:11.5px!important;line-height:1.4!important;opacity:1!important}
body.authenticated .sky-kpi :is(small,span){color:#fff!important}
body.authenticated .sky-next-eyebrow{font-size:11px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-next-status{font-size:11px!important}
body.authenticated .sky-next-time span{font-size:11px!important;opacity:1!important}
body.authenticated .sky-next-person strong{font-size:13.5px!important;color:var(--nodly-text-primary)!important}
body.authenticated .sky-next-person small{font-size:12px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-next-person span{font-size:11.5px!important;color:var(--nodly-text-tertiary)!important}
body.authenticated .sky-next-access small{font-size:10.5px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-next-access strong{font-size:12.5px!important;color:var(--nodly-text-primary)!important}
body.authenticated .sky-next-access p{font-size:11.5px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-next-access-state{font-size:11px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-next-meet{min-height:40px;font-size:11.5px!important}
body.authenticated .sky-next-pro-actions button{min-height:40px;font-size:11.5px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-account-card>header span{font-size:10.5px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-account-card>header em{font-size:11px!important;color:var(--nodly-text-link)!important}
body.authenticated .sky-account-content>div>strong{font-size:13px!important;color:var(--nodly-text-primary)!important}
body.authenticated .sky-account-content p{font-size:11.5px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-membership-ring small{font-size:10.5px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .sky-account-badge{font-size:10.5px!important}
body.authenticated .sky-practice-status span{font-size:12px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .mobile-next-card :is(p,small,span){color:var(--nodly-sidebar-muted)!important}
body.authenticated .dashboard-income-head h3{font-size:16px!important;color:var(--nodly-text-primary)!important}
body.authenticated .dashboard-income-head>div>small{font-size:12px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .dashboard-income-actions>a{font-size:11.5px!important;color:var(--nodly-text-link)!important}
body.authenticated .income-total>small{font-size:10.5px!important;color:var(--nodly-text-secondary)!important}
body.authenticated .income-total>strong{font-size:12px!important}
body.authenticated .dashboard-income-foot{font-size:11px!important;color:var(--nodly-text-secondary)!important}

/* Cards, empty states, messages, help, tooltips and overlays. */
body.authenticated .app-shell :is(.card-title h3,.section-heading h3,.modal h3){font-size:16px!important;line-height:1.3!important;color:var(--nodly-text-primary)}
body.authenticated .app-shell :is(.activity-empty,.patient-empty,.empty-state) strong{font-size:13px!important;color:var(--nodly-text-primary)!important}
body.authenticated :is(.modal,.mobile-sheet,.notification-popover,.context-help-popover,.agenda-patient-time-popover,.leaflet-tooltip,.map-patient-tooltip){font-size:13px;line-height:1.5}
body.authenticated :is(.modal,.mobile-sheet,.notification-popover,.context-help-popover,.agenda-patient-time-popover) small{font-size:12px!important;line-height:1.45!important;color:var(--nodly-text-secondary)}
html[data-nodly-theme="dark"] body.authenticated :is(.notification-popover,.context-help-popover,.agenda-patient-time-popover,.leaflet-tooltip,.map-patient-tooltip){background:var(--nodly-surface-raised)!important;border-color:var(--nodly-border)!important;color:var(--nodly-text-primary)!important}

/* Status colors carry meaning with AA-oriented foregrounds, not opacity alone. */
html[data-nodly-theme="dark"] body.authenticated :is(.badge,.status-ok,.status-pill,.patient-status,.mobile-patient-status){color:var(--nodly-text-positive)!important}
html[data-nodly-theme="dark"] body.authenticated :is(.badge.amber,.status-warning,.attention .badge){color:var(--nodly-text-warning)!important}
html[data-nodly-theme="dark"] body.authenticated :is(.status-error,.danger,.badge.red){color:var(--nodly-text-danger)!important}
html[data-nodly-theme="dark"] body.authenticated .app-shell :is(.eyebrow,.page-head-gesture,.text-link,.card-title a,.add-range){color:var(--nodly-text-link)!important}

/* Login follows the same minimums without changing its editorial composition. */
.auth-gateway{font-size:14px;line-height:1.5}
.auth-gateway .auth-heading p{font-size:15px!important;line-height:1.55!important}
.auth-gateway .auth-form>label,.auth-gateway .auth-form-grid label{font-size:12px!important;line-height:1.4!important}
.auth-gateway :is(.auth-mode-switch,.auth-panel-footer,.field-error){font-size:11.5px!important;line-height:1.45!important}
.auth-gateway :is(.auth-input input,.auth-form input,.auth-form select){font-size:14px!important}
.auth-gateway :is(button,a,input,select):focus-visible{outline:3px solid rgba(226,199,118,.58)!important;outline-offset:2px!important}
html[data-nodly-theme="light"] .auth-gateway :is(.auth-mode-switch,.auth-panel-footer){color:#626c78!important}
html[data-nodly-theme="dark"] .auth-gateway :is(.auth-mode-switch,.auth-panel-footer){color:#b7c1cb!important}
.auth-gateway .auth-capabilities span small{font-size:11px!important;line-height:1.35!important}
.auth-gateway .preview-session-person small,.auth-gateway .preview-session-card footer :is(span,b){font-size:11px!important;line-height:1.35!important}

/* Patient-facing public surfaces. */
:is(.patient-portal,.patient-shell,.public-site-shell,.public-booking-shell){font-size:14px;line-height:1.55}
:is(.patient-portal,.patient-shell,.public-site-shell,.public-booking-shell) p{font-size:13px;line-height:1.55}
:is(.patient-portal,.patient-shell,.public-site-shell,.public-booking-shell) small{font-size:12px;line-height:1.45}
:is(.patient-portal,.patient-shell,.public-site-shell,.public-booking-shell) :is(button,a,input,select,textarea):focus-visible{outline:3px solid color-mix(in srgb,#526f9e,transparent 42%);outline-offset:2px}

@media(max-width:768px){
  :root{--nodly-type-body:15px;--nodly-type-copy:14px;--nodly-type-small:12px;--nodly-type-micro:11px}
  body.authenticated:not(.superadmin-mode) .page-head p{font-size:14px!important;line-height:1.55!important}
  body.authenticated .app-shell :is(.primary-button,.secondary-button,.soft-button,.row-action,.icon-button){min-height:44px}
  body.authenticated .mobile-bottom-nav button{min-height:58px;font-size:11px!important;line-height:1.2!important}
  body.authenticated :is(.mobile-sheet-action,.mobile-appointment-row,.mobile-patient-card footer button,.mobile-patient-card footer a){min-height:48px}
  body.authenticated .mobile-sheet-action{font-size:14px!important}
  body.authenticated .mobile-sheet-action small{font-size:12px!important;color:var(--nodly-text-secondary)!important}
  body.authenticated .mobile-greeting small{font-size:12px!important;color:var(--nodly-text-secondary)!important}
  body.authenticated .mobile-section-title button{min-height:44px;font-size:12px!important}
  body.authenticated .mobile-appointment-row strong{font-size:14px!important}
  body.authenticated .mobile-appointment-row :is(em,time small){font-size:11.5px!important;color:var(--nodly-text-secondary)!important}
  body.authenticated .mobile-next-card>small{font-size:11px!important}
  body.authenticated .mobile-next-main span{font-size:12px!important}
  body.authenticated .mobile-next-actions :is(button,a){min-height:46px;font-size:12px!important}
  body.authenticated .mobile-quick-grid button{min-height:88px;font-size:11.5px!important}
  body.authenticated .mobile-patient-card h3{font-size:14px!important}
  body.authenticated .mobile-patient-card header small{font-size:12px!important;color:var(--nodly-text-secondary)!important}
  body.authenticated .mobile-patient-facts small{font-size:11px!important;color:var(--nodly-text-secondary)!important}
  body.authenticated .mobile-patient-facts strong{font-size:12px!important}
  body.authenticated .data-table td{font-size:13px!important}
  .auth-gateway :is(.auth-mode-switch,.auth-panel-footer){font-size:12px!important}
}

@media(prefers-reduced-motion:reduce){
  body.authenticated *{scroll-behavior:auto!important}
}

/* Shared native date controls. Keep native semantics, validation and picker;
   size belongs to the host form/filter, never impose a global full width. */
html body input:is([type="date"],[type="datetime-local"],[type="month"]),
html body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"]){
  box-sizing:border-box;min-width:0;max-width:100%;height:48px!important;min-height:48px!important;
  padding:0 12px!important;border:1px solid #cbd7e4!important;border-radius:12px!important;
  background:#fff!important;color:#243a56!important;box-shadow:none;
  font-family:'IBM Plex Sans',sans-serif!important;font-size:16px!important;font-weight:500!important;
  line-height:1.3!important;color-scheme:light;
}
html body input:is([type="date"],[type="datetime-local"],[type="month"]):hover:not(:disabled):not(:read-only),
html body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"]):hover:not(:disabled):not(:read-only){border-color:#93a9c4!important}
html body input:is([type="date"],[type="datetime-local"],[type="month"]):is(:focus,:focus-visible),
html body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"]):is(:focus,:focus-visible){
  border-color:#496b9a!important;outline:3px solid #b7c9e4!important;outline-offset:2px!important;box-shadow:none!important;
}
html body input:is([type="date"],[type="datetime-local"],[type="month"])[aria-invalid="true"],
html body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"])[aria-invalid="true"]{border-color:#b6463d!important}
html body input:is([type="date"],[type="datetime-local"],[type="month"]):disabled{opacity:.62;cursor:not-allowed}
html body input:is([type="date"],[type="datetime-local"],[type="month"])::-webkit-date-and-time-value{text-align:left;min-height:1.3em}
html body input:is([type="date"],[type="datetime-local"],[type="month"])::-webkit-calendar-picker-indicator{opacity:.8;cursor:pointer;flex-shrink:0}
html body label:has(>input:is([type="date"],[type="datetime-local"],[type="month"])),
html body .form-group:has(>input:is([type="date"],[type="datetime-local"],[type="month"]))>label{
  min-width:0;font-size:13px!important;font-weight:600!important;color:#425a78;
}
html body label:has(>input:is([type="date"],[type="datetime-local"],[type="month"])){
  display:grid;gap:8px;
}
html body label:has(>input:is([type="date"],[type="datetime-local"],[type="month"]))>span{font-size:13px!important;color:inherit}
/* Compact independent dates in filter bars, without a second framed container. */
html body :is(.date-range,.session-date-range):not([hidden]){
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:12px;
  width:min(100%,340px);max-width:100%;padding:0;border:0;background:transparent;box-shadow:none;
}
html body .date-range>span{display:none}
html body :is(.date-range,.session-date-range)>label{min-width:0}
html body :is(.date-range,.session-date-range) input{width:100%}
html body .invoice-date-filters{display:grid;grid-template-columns:repeat(2,minmax(0,160px)) 44px auto;align-items:end;gap:12px;max-width:100%}
html body .invoice-date-filters input{width:100%;min-width:0}
html body .invoice-date-filters button{width:44px;height:48px;border-radius:12px;color:#425a78}
html body .invoice-date-filters small{font-size:12px;min-width:0}
html body .invoice-date-filters small:empty{display:none}
html body .invoice-repository-tools{align-items:flex-end;gap:12px}
html body #view .invoice-repository-tools>input,
html body #view .invoice-repository-tools>.secondary-button{height:48px;min-height:48px;border-radius:12px;font-size:14px!important}
html[data-nodly-theme="dark"] body input:is([type="date"],[type="datetime-local"],[type="month"]),
html[data-nodly-theme="dark"] body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"]){background:#303943!important;color:#edf3fc!important;border-color:#62748a!important;color-scheme:dark}
html[data-nodly-theme="dark"] body label:has(>input:is([type="date"],[type="datetime-local"],[type="month"])),
html[data-nodly-theme="dark"] body .form-group:has(>input:is([type="date"],[type="datetime-local"],[type="month"]))>label{color:#c7d5e8!important}
html[data-nodly-theme="dark"] body input:is([type="date"],[type="datetime-local"],[type="month"])[aria-invalid="true"],
html[data-nodly-theme="dark"] body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"])[aria-invalid="true"]{border-color:#efaaa3!important}
@media(max-width:600px){
  html body :is(.date-range,.session-date-range):not([hidden]){width:100%;gap:10px}
  html body .invoice-date-filters{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:10px}
  html body .invoice-date-filters button{grid-column:1;justify-self:start}
  html body .invoice-date-filters small{grid-column:2;align-self:center}
  html body input:is([type="date"],[type="datetime-local"],[type="month"]),
  html body :is(#view,#modalContent) input:is([type="date"],[type="datetime-local"],[type="month"]){padding-inline:10px!important}
}

/* Mobile reading hierarchy: same identity, no desktop sizing or agenda-grid changes. */
@media(max-width:768px){
  body.authenticated .mobile-bottom-nav button{font-size:12px!important}
  body.authenticated .mobile-section-title button{font-size:14px!important}
  body.authenticated .mobile-section-title{flex-wrap:wrap;gap:4px 12px}
  body.authenticated .mobile-home .mobile-account-row small{font-size:12px!important}
  body.authenticated .mobile-home .mobile-account-row strong{font-size:15px!important;white-space:normal}
  body.authenticated .mobile-home .mobile-account-row em{font-size:13px!important;line-height:1.4;white-space:normal}
  body.authenticated:not(.superadmin-mode) .mobile-sheet header h2{color:var(--nodly-text-primary)!important}
  body.authenticated .mobile-sheet-action:focus-visible{outline:3px solid var(--nodly-focus);outline-offset:2px}
  body.authenticated .mobile-appointment-row strong,
  body.authenticated .mobile-patient-card h3{font-size:16px!important;white-space:normal;overflow-wrap:anywhere}
  body.authenticated .mobile-appointment-row :is(em,time small),
  body.authenticated .mobile-patient-card header small,
  body.authenticated .mobile-patient-facts small,
  body.authenticated .mobile-sheet-action small{font-size:13px!important;line-height:1.4!important}
  body.authenticated .mobile-patient-facts strong{font-size:14px!important}
  body.authenticated .mobile-patient-card footer :is(button,a){font-size:14px!important;white-space:normal;overflow-wrap:anywhere}
  body.authenticated .mobile-next-main span{font-size:14px!important}
  body.authenticated .mobile-next-actions :is(button,a),
  body.authenticated .mobile-quick-grid button{font-size:14px!important;line-height:1.3!important}
}