@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Source+Sans+3:wght@400;500;600;700&display=swap');

:root {
    color-scheme: light;
    --font-ui: "Inter", "Source Sans 3", Arial, Helvetica, sans-serif;
    --font-data: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

    --ink: #15212B;
    --muted: #5E6B78;
    --subtle: #8793A1;
    --line: #D8E0E7;
    --line-strong: #B8C5D1;
    --bg: #F5F7F8;
    --surface: #FFFFFF;
    --surface-soft: #FAFBFC;
    --surface-tint: #EEF4F5;

    --primary: #0B7A86;
    --primary-dark: #075E67;
    --primary-soft: #E6F6F7;
    --secondary: #3E8B6D;
    --accent: #C0643D;
    --danger: #B42318;
    --danger-soft: #FDECEC;
    --warning: #B7791F;
    --warning-soft: #FFF7E6;
    --success: #147D64;
    --success-soft: #E7F7F1;
    --info: #315E9E;
    --info-soft: #EAF1FB;

    --radius-panel: 8px;
    --radius-control: 6px;
    --shadow-soft: 0 1px 2px rgba(21, 33, 43, .05), 0 8px 28px rgba(21, 33, 43, .06);
    --shadow-float: 0 22px 70px rgba(21, 33, 43, .22);
    --focus-ring: 0 0 0 3px rgba(68, 184, 194, .28);
}

/* Shared compact pagination for independently paged dashboard and accounting panels. */
.clinic-pager {
    align-items: center;
    border-top: 1px solid var(--border, #dbe5ea);
    display: flex;
    gap: .75rem;
    justify-content: space-between;
    margin-top: .75rem;
    padding: .8rem .25rem .1rem;
}
.clinic-pager a,
.clinic-pager span {
    border: 1px solid #cbd9df;
    border-radius: 8px;
    color: #0b6770;
    font-size: .78rem;
    font-weight: 750;
    padding: .45rem .7rem;
    text-decoration: none;
}
.clinic-pager a:hover { background: #eaf7f7; border-color: #15909a; }
.clinic-pager span[aria-disabled="true"] { color: #94a3b8; cursor: not-allowed; }
.clinic-pager small { color: #64748b; text-align: center; }
@media (max-width: 640px) {
    .clinic-pager small { display: none; }
}

/* Accounting stage one */
.accounting-page { display:grid; gap:18px; color:#17232f; }
.accounting-hero { display:flex; justify-content:space-between; gap:24px; align-items:flex-end; padding:26px 28px; border-radius:18px; color:#fff; background:linear-gradient(125deg,#123e4b 0%,#096e75 58%,#0f8b8d 100%); box-shadow:0 18px 45px rgba(15,65,74,.16); }
.accounting-hero h2 { margin:5px 0 6px; color:#fff; font-size:30px; }
.accounting-hero p { margin:0; color:#d9f1f0; }
.accounting-eyebrow,.accounting-panel header span,.accounting-next-stage>div>span,.accounting-dialog header span { display:block; font-size:11px; font-weight:800; letter-spacing:.12em; color:#25848a; }
.accounting-hero .accounting-eyebrow { color:#9ce1dd; }
.accounting-hero-actions { display:flex; gap:10px; flex-wrap:wrap; }
.accounting-hero .btn-secondary { color:#fff; border-color:rgba(255,255,255,.4); background:rgba(255,255,255,.1); }
.accounting-filter { display:flex; align-items:end; gap:10px; padding:14px 16px; border:1px solid #dce6ea; border-radius:14px; background:#fff; }
.accounting-filter label { min-width:150px; color:#576574; font-size:12px; font-weight:700; }
.accounting-filter input { margin-top:5px; }
.accounting-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.accounting-kpi { position:relative; display:grid; gap:4px; min-height:118px; padding:18px; overflow:hidden; border:1px solid #dce6ea; border-radius:15px; color:#17232f; background:#fff; text-decoration:none; }
.accounting-kpi:before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:#0f8b8d; }
.accounting-kpi span { color:#657382; font-size:12px; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.accounting-kpi strong { font-size:27px; line-height:1.2; }
.accounting-kpi small { color:#7a8793; }
.accounting-kpi.is-expense:before { background:#dc5d53; }.accounting-kpi.is-net:before { background:#2563eb; }.accounting-kpi.is-pending:before { background:#d89418; }
.accounting-kpi.is-pending:hover { border-color:#d89418; transform:translateY(-1px); }
.accounting-primary-grid,.accounting-secondary-grid { display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); gap:16px; align-items:start; }
.accounting-secondary-grid { grid-template-columns:1.15fr .85fr; }
.accounting-panel { overflow:hidden; border:1px solid #dce6ea; border-radius:16px; background:#fff; box-shadow:0 8px 24px rgba(25,56,70,.05); }
.accounting-panel>header { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:17px 19px; border-bottom:1px solid #e5edf0; }
.accounting-panel header h3 { margin:3px 0 0; font-size:18px; }.accounting-panel header a { color:#087a80; font-weight:700; font-size:13px; }
.cash-state { padding:6px 10px; border-radius:999px; background:#eff3f4; color:#74818c; font-size:11px; font-style:normal; font-weight:800; }.cash-state.is-open { color:#086b55; background:#e7f6f0; }
.cash-balance { display:grid; gap:5px; padding:23px 20px 18px; }.cash-balance span { color:#657382; font-weight:700; }.cash-balance strong { font-size:34px; color:#0b6269; }.cash-balance small { color:#7a8793; }
.cash-guidance { display:grid; gap:3px; margin:0 18px 18px; padding:12px 14px; border-radius:11px; background:#f1f8f8; }.cash-guidance b { color:#116970; font-size:13px; }.cash-guidance span { color:#63717d; font-size:12px; line-height:1.45; }
.accounting-methods { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:16px; }.accounting-methods>div:not(.accounting-empty) { display:grid; gap:4px; padding:13px; border:1px solid #e5ecef; border-radius:11px; background:#fbfdfd; }.accounting-methods span { color:#657382; font-size:12px; }.accounting-methods strong { font-size:19px; }.accounting-methods small { color:#7d8993; }
.accounting-table-wrap { overflow:auto; }.accounting-table-wrap table { width:100%; border-collapse:collapse; min-width:840px; }.accounting-table-wrap th { padding:11px 15px; color:#657382; background:#f7fafb; font-size:11px; text-transform:uppercase; text-align:left; }.accounting-table-wrap td { padding:13px 15px; border-top:1px solid #e8eef0; vertical-align:middle; }.accounting-table-wrap td>strong,.accounting-table-wrap td>small { display:block; }.accounting-table-wrap td>small { margin-top:3px; color:#7b8791; }.accounting-table-wrap .numeric { text-align:right; white-space:nowrap; }.accounting-table-wrap td.income { color:#087058; font-weight:800; }.accounting-table-wrap td.expense { color:#b9433c; font-weight:800; }
.accounting-method-pill,.accounting-source { display:inline-flex; padding:4px 8px; border-radius:999px; color:#32636a; background:#edf6f6; font-size:11px; font-weight:700; }.accounting-source { color:#6d7882; background:#f1f3f4; }
.cash-expected-breakdown { display:grid; gap:7px; margin:0 18px 14px; padding:13px 14px; border:1px solid #dce8ea; border-radius:11px; background:#fbfdfd; }
.cash-expected-breakdown>div { display:flex; justify-content:space-between; gap:18px; color:#61717c; font-size:12px; }
.cash-expected-breakdown>div strong { color:#294852; white-space:nowrap; }
.cash-expected-breakdown>small { padding-top:7px; border-top:1px solid #e6edef; color:#78868f; font-size:11px; line-height:1.45; }
.cash-session-warning { display:grid; gap:4px; margin:0 18px 14px; padding:12px 14px; border:1px solid #efd395; border-radius:11px; color:#80530e; background:#fff8e8; }
.cash-session-warning strong { font-size:13px; }.cash-session-warning span { font-size:12px; line-height:1.45; }
.accounting-concept-cell { min-width:290px; }.accounting-concept-person { color:#113d49; font-size:14px; }
.accounting-movement-detail { margin-top:9px; }.accounting-movement-detail summary { width:max-content; color:#08777d; font-size:11px; font-weight:800; cursor:pointer; list-style-position:inside; }
.accounting-movement-detail[open] summary { margin-bottom:8px; }
.accounting-payment-breakdown { display:grid; gap:7px; min-width:300px; max-width:430px; padding:10px; border:1px solid #dce8ea; border-radius:10px; background:#f8fbfb; }
.accounting-payment-line { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding-bottom:7px; border-bottom:1px solid #e4ecee; }
.accounting-payment-line>span { display:grid; gap:2px; }.accounting-payment-line strong { color:#314751; font-size:12px; }.accounting-payment-line small { color:#7a8790; font-size:10px; }.accounting-payment-line>b { color:#087058; font-size:12px; white-space:nowrap; }
.accounting-payment-totals { display:grid; gap:4px; }.accounting-payment-totals>span { display:flex; justify-content:space-between; gap:18px; color:#687681; font-size:11px; }.accounting-payment-totals b { color:#243f49; }.accounting-payment-totals .is-credit,.accounting-payment-totals .is-credit b { color:#087058; }
.professional-fees-page { gap:20px; }.professional-fees-hero { background:linear-gradient(125deg,#123f4a,#0b7777); }
.professional-fee-alerts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.professional-fee-list { display:grid; gap:14px; padding:16px; }
.professional-fee-card { display:grid; gap:13px; padding:17px; border:1px solid #dce7e9; border-radius:13px; background:#fff; }
.professional-fee-card>header { display:flex; justify-content:space-between; gap:16px; }.professional-fee-card>header>div { display:grid; gap:3px; }.professional-fee-card>header span { color:#73818b; font-size:12px; }.professional-fee-card>header>b { color:#0a706f; font-size:20px; text-align:right; }.professional-fee-card>header>b small { display:block; color:#77858e; font-size:10px; }
.professional-fee-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }.professional-fee-metrics>span { display:grid; gap:4px; padding:10px; border-radius:9px; color:#6b7983; background:#f6f9fa; font-size:10px; }.professional-fee-metrics strong { color:#263f48; font-size:13px; }
.professional-fee-actions { display:flex; align-items:center; gap:10px; }.professional-fee-state { display:inline-flex; padding:6px 9px; border-radius:999px; color:#895d12; background:#fff5d9; font-size:11px; font-weight:800; }.professional-fee-state.is-paid { color:#087058; background:#e8f7f1; }
.professional-fee-detail summary,.professional-fee-agreement summary { color:#08777d; font-size:12px; font-weight:800; cursor:pointer; }.professional-fee-detail[open] summary,.professional-fee-agreement[open] summary { margin-bottom:10px; }
.professional-fee-lines { display:grid; border:1px solid #e1e9eb; border-radius:10px; overflow:hidden; }.professional-fee-lines>div { display:flex; justify-content:space-between; gap:18px; padding:10px 12px; border-top:1px solid #e7edef; }.professional-fee-lines>div:first-child { border-top:0; }.professional-fee-lines>div>span:first-child { display:grid; gap:2px; }.professional-fee-lines small { color:#75838c; font-size:10px; }.professional-fee-calculation { display:flex; align-items:center; gap:8px; color:#697780; font-size:11px; white-space:nowrap; }.professional-fee-calculation b { color:#087058; font-size:13px; }
.professional-fee-agreement form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:13px; border-radius:10px; background:#f5f9fa; }.professional-fee-agreement label { display:grid; gap:5px; color:#596a74; font-size:11px; font-weight:750; }.professional-fee-agreement .check-field { display:flex; align-items:center; }.professional-fee-agreement .check-field input { width:auto; }.professional-fee-agreement .span-2 { grid-column:span 2; }.professional-fee-agreement button { justify-self:start; }
.professional-settlement-list { display:grid; }.professional-settlement-list>article { display:grid; grid-template-columns:minmax(220px,1fr) auto minmax(430px,1.5fr); align-items:center; gap:16px; padding:14px 18px; border-top:1px solid #e6edef; }.professional-settlement-list>article:first-child { border-top:0; }.professional-settlement-list>article>div { display:grid; gap:3px; }.professional-settlement-list span { color:#73818b; font-size:11px; }.professional-settlement-list>article>b { color:#0b6f6f; font-size:19px; }.professional-settlement-payment { display:grid; grid-template-columns:1fr 1fr 1.3fr auto; gap:7px; }.professional-settlement-payment input,.professional-settlement-payment select { min-width:0; padding:9px; }
@media (max-width:1000px) { .professional-fee-metrics { grid-template-columns:repeat(3,1fr); }.professional-settlement-list>article { grid-template-columns:1fr auto; }.professional-settlement-payment { grid-column:1/-1; } }
@media (max-width:700px) { .professional-fee-alerts { grid-template-columns:1fr; }.professional-fee-metrics { grid-template-columns:repeat(2,1fr); }.professional-fee-card>header { flex-direction:column; }.professional-fee-card>header>b { text-align:left; }.professional-fee-lines>div,.professional-fee-calculation { flex-direction:column; }.professional-fee-calculation { align-items:flex-start; }.professional-fee-agreement form,.professional-settlement-payment { grid-template-columns:1fr; }.professional-fee-agreement .span-2 { grid-column:auto; }.professional-settlement-list>article { grid-template-columns:1fr; } }
.link-danger { border:0; padding:0; color:#bd342d; background:none; font-weight:700; cursor:pointer; }
.accounting-pending-list,.cash-closures { display:grid; }.accounting-pending-list article,.cash-closures article { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 18px; border-top:1px solid #e8eef0; }.accounting-pending-list article:first-child,.cash-closures article:first-child { border-top:0; }.accounting-pending-list article>div,.cash-closures article>div { display:grid; gap:3px; min-width:0; }.accounting-pending-list span,.cash-closures span { color:#74818c; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.accounting-pending-list article>div:last-child { text-align:right; flex:0 0 auto; }.accounting-pending-list a,.cash-closures button { color:#087a80; border:0; background:none; font-size:12px; font-weight:800; cursor:pointer; }.cash-closures article>div:nth-child(2) { text-align:right; }.cash-closures small { color:#74818c; }.cash-closures .is-difference { color:#c1493f; }
.accounting-empty { display:grid; place-items:start; gap:7px; padding:24px 20px; color:#687681; }.accounting-empty strong { color:#374651; }.accounting-empty.compact { padding:18px; place-items:center; text-align:center; grid-column:1/-1; }
.accounting-alert { display:grid; gap:3px; padding:12px 15px; border-radius:11px; color:#8b5611; background:#fff6df; font-size:13px; }.accounting-alert.is-danger { color:#9d312b; background:#feefed; }.accounting-alert.is-warning { margin:0 18px 18px; }.accounting-alert span { font-size:12px; opacity:.9; }
.accounting-next-stage { display:flex; justify-content:space-between; gap:30px; padding:22px 25px; border:1px dashed #b9cbd0; border-radius:16px; background:#f7fbfb; }.accounting-next-stage h3 { margin:4px 0; }.accounting-next-stage p { margin:0; color:#687681; }.accounting-next-stage ul { display:grid; grid-template-columns:repeat(2,minmax(180px,1fr)); gap:8px 22px; margin:0; padding-left:20px; color:#3f5660; }
.accounting-dialog { width:min(660px,calc(100vw - 28px)); padding:0; border:0; border-radius:17px; color:#17232f; background:#fff; box-shadow:0 24px 80px rgba(13,42,54,.28); }.accounting-dialog.small { width:min(470px,calc(100vw - 28px)); }.accounting-dialog::backdrop { background:rgba(11,34,45,.52); backdrop-filter:blur(2px); }.accounting-dialog form { display:grid; gap:15px; padding:22px; }.accounting-dialog header { display:flex; justify-content:space-between; align-items:flex-start; }.accounting-dialog h3 { margin:3px 0 0; font-size:22px; }.accounting-dialog header button { border:0; color:#6b7881; background:none; font-size:27px; cursor:pointer; }.accounting-dialog label { display:grid; gap:6px; color:#53616d; font-size:12px; font-weight:750; }.accounting-dialog footer { display:flex; justify-content:flex-end; gap:10px; padding-top:4px; }.accounting-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }.accounting-form-grid .span-2 { grid-column:span 2; }.cash-close-expected { display:flex; justify-content:space-between; align-items:center; padding:13px 15px; border-radius:10px; background:#eff7f7; }.cash-close-expected span { color:#566771; }.cash-close-expected strong { color:#0b6c72; font-size:22px; }
.settings-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }.settings-heading p { color:#687681; }.accounting-settings { display:grid; gap:18px; }.accounting-settings-list { display:grid; }.accounting-settings-list form { display:grid; grid-template-columns:12px 1.2fr .9fr .85fr 80px auto auto auto auto; gap:10px; align-items:end; padding:13px 16px; border-top:1px solid #e6edef; }.accounting-settings-list form:first-child { border-top:0; }.accounting-settings-list label { display:grid; gap:4px; color:#66747e; font-size:11px; font-weight:700; }.accounting-settings-list input,.accounting-settings-list select { min-width:0; padding:9px 10px; }.accounting-settings-list .check-field { display:flex; align-items:center; gap:5px; padding-bottom:10px; white-space:nowrap; }.accounting-settings-list .check-field input { width:auto; }.settings-record-state { align-self:center; width:9px; height:9px; margin-bottom:10px; border-radius:50%; background:#c8d0d3; }.settings-record-state.is-active { background:#16a177; box-shadow:0 0 0 4px #e2f5ef; }.accounting-settings-list.categories form { grid-template-columns:42px 1.4fr 1fr 80px auto auto; }.category-color { width:40px; height:40px; padding:3px!important; }
@media (max-width:1050px) { .accounting-kpis { grid-template-columns:repeat(2,1fr); }.accounting-primary-grid,.accounting-secondary-grid { grid-template-columns:1fr; }.accounting-settings-list form,.accounting-settings-list.categories form { grid-template-columns:repeat(2,minmax(0,1fr)); }.settings-record-state { display:none; } }
@media (max-width:700px) { .accounting-hero { align-items:flex-start; padding:21px; }.accounting-hero,.accounting-next-stage,.settings-heading { flex-direction:column; }.accounting-hero-actions,.accounting-hero-actions .btn { width:100%; }.accounting-filter { align-items:stretch; flex-wrap:wrap; }.accounting-filter label { flex:1 1 130px; min-width:0; }.accounting-kpis { grid-template-columns:1fr 1fr; }.accounting-kpi { min-height:104px; padding:14px; }.accounting-kpi strong { font-size:22px; }.accounting-methods { grid-template-columns:1fr 1fr; }.accounting-next-stage ul { grid-template-columns:1fr; }.accounting-form-grid { grid-template-columns:1fr; }.accounting-form-grid .span-2 { grid-column:auto; }.accounting-settings-list form,.accounting-settings-list.categories form { grid-template-columns:1fr; align-items:stretch; }.accounting-settings-list .check-field { padding:2px 0; }.accounting-dialog { max-height:calc(100vh - 24px); overflow:auto; }.accounting-pending-list article,.cash-closures article { align-items:flex-start; }.cash-closures article { flex-wrap:wrap; } }
@media (max-width:430px) { .accounting-kpis { grid-template-columns:1fr; }.accounting-methods { grid-template-columns:1fr; }.accounting-filter .btn { flex:1 1 auto; }.accounting-hero h2 { font-size:25px; } }

/* Cierre de atenciones espontaneas y cobro directo */
.attention-closeout .panel-body { display:grid; gap:16px; }
.attention-closeout-rule { display:grid; gap:5px; padding:15px 17px; border:1px solid #bfe0df; border-radius:12px; color:#31545b; background:#eff9f8; }
.attention-closeout-rule strong { color:#096e75; }
.attention-closeout-form { display:grid; gap:10px; max-width:760px; }
.auto-detected-procedures { display:grid; gap:10px; padding:13px 15px; border:1px solid #bfe0df; border-radius:11px; background:#f2faf9; }
.auto-detected-procedures strong,.auto-detected-procedures span { display:block; }
.auto-detected-procedures>div>span { margin-top:2px; color:#687681; font-size:12px; }
.auto-detected-procedure-list { display:flex; flex-wrap:wrap; gap:7px; }
.auto-detected-procedure-list span { padding:6px 9px; border-radius:999px; font-size:11px; font-weight:800; }
.auto-detected-procedure-list .is-ready { color:#096e75; background:#dff4f0; }
.auto-detected-procedure-list .is-unpriced { color:#8a5913; background:#fff1cf; }
.auto-detected-price-warning { margin:0; }
.auto-detected-price-warning a { margin-left:6px; font-weight:850; }
.attention-closeout-form>label { color:#455762; font-size:13px; font-weight:800; }
.attention-closeout-form select[multiple] { min-height:250px; padding:8px; border:1px solid #cfdde1; border-radius:11px; background:#fff; }
.attention-closeout-form select[multiple] option { padding:8px 9px; border-radius:6px; }
.attention-closeout-form .btn { justify-self:start; margin-top:4px; }
.attention-closeout-errors { padding:13px 15px; border:1px solid #e6a7a2; border-radius:10px; color:#8e2620; background:#fff1f0; }
.attention-closeout-errors strong { display:block; margin-bottom:5px; }
.attention-closeout-errors ul { margin:0; padding-left:18px; }
.checkout-procedure-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; max-height:310px; overflow:auto; padding:2px; }
.checkout-procedure { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:9px; padding:9px 10px; border:1px solid #d9e4e8; border-radius:9px; background:#fff; cursor:pointer; }
.checkout-procedure:hover { border-color:#7dbbb7; }
.checkout-procedure.is-selected { border-color:#57a99f; background:#edf9f6; box-shadow:0 0 0 1px rgba(34,139,126,.08); }
.checkout-procedure.is-disabled { cursor:not-allowed; opacity:.65; }
.checkout-procedure>span { display:grid; min-width:0; gap:1px; }
.checkout-procedure strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.checkout-procedure small { color:var(--muted); font-size:10px; }
.checkout-procedure>b { color:#086f64; font-size:12px; white-space:nowrap; }
.checkout-live-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 13px; border:1px solid #b9ded9; border-radius:9px; color:#31545b; background:#eff9f7; }
.checkout-live-summary strong { color:#075d52; font-size:20px; }
.checkout-payment { overflow:hidden; border:1px solid #c7dfe2; border-radius:10px; background:#fff; }
.checkout-payment-toggle { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px 13px; cursor:pointer; }
.checkout-payment-toggle>span { display:grid; gap:1px; }
.checkout-payment-toggle strong { color:#123e4b; font-size:13px; }
.checkout-payment-toggle small { color:var(--muted); font-size:10px; }
.checkout-payment-toggle>b { color:#087058; font-size:17px; white-space:nowrap; }
.checkout-payment-fields { display:grid; gap:10px; padding:11px 13px 13px; border-top:1px solid #dfe9ec; background:#f8fbfb; }
.checkout-payment-grid { display:grid; grid-template-columns:minmax(120px,.7fr) minmax(150px,1fr) minmax(220px,1.4fr); gap:9px; }
.checkout-payment-grid label { display:grid; gap:4px; color:#566772; font-size:11px; font-weight:800; }
.checkout-credit-note { display:grid; grid-template-columns:1fr auto; gap:2px 12px; padding:8px 10px; border-radius:8px; color:#176149; background:#eaf8f2; }
.checkout-credit-note small { grid-column:1/-1; }
.checkout-cash-warning { margin:0; color:#8a5913; font-size:11px; font-weight:700; }
.attention-closeout-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.attention-closeout-summary>div { display:grid; gap:4px; padding:13px 15px; border:1px solid #dce7ea; border-radius:11px; background:#f9fbfc; }
.attention-closeout-summary span { color:#687681; font-size:12px; }
.attention-closeout-summary strong { color:#123e4b; font-size:18px; }
.attention-charge-lines { display:grid; gap:7px; }
.attention-charge-lines>div { display:flex; justify-content:space-between; gap:18px; padding:9px 11px; border-radius:8px; color:#4f606b; background:#f5f8f9; }
.attention-charge-lines strong { color:#17232f; white-space:nowrap; }
.attention-collection-list { display:grid; gap:13px; padding:16px; }
.attention-collection-card { display:grid; gap:13px; padding:17px; border:1px solid #dce6ea; border-radius:13px; background:#fff; box-shadow:0 5px 16px rgba(25,56,70,.04); }
.attention-collection-card>header { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.attention-collection-card>header>div { display:grid; gap:4px; }
.attention-collection-card>header span { color:#71808b; font-size:12px; }
.attention-collection-card>header b { color:#087058; font-size:22px; white-space:nowrap; }
.attention-payment-form { display:grid; grid-template-columns:minmax(110px,.7fr) minmax(150px,1fr) minmax(220px,1.5fr) auto; gap:10px; align-items:end; padding-top:12px; border-top:1px solid #e5ecef; }
.attention-payment-form label { display:grid; gap:5px; color:#566772; font-size:11px; font-weight:800; }
.attention-payment-form input,.attention-payment-form select { min-width:0; }
.attention-payment-form .btn { white-space:nowrap; }
.patient-account-credit { display:flex; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid #bce2d4; border-radius:9px; color:#176149; background:#ecfaf4; }
.patient-account-credit strong { color:#087058; }
.patient-account-lines>div>span { display:grid; gap:3px; }
.patient-account-lines>div>span>strong { color:#30434e; font-size:13px; }
.patient-account-lines small { color:#75838d; font-size:11px; }
.attention-payment-form .patient-account-payment-note { grid-column:1/-1; color:#71808b; font-size:11px; font-weight:500; }
@media (max-width:900px) { .attention-payment-form { grid-template-columns:repeat(2,minmax(0,1fr)); }.attention-payment-form .btn { justify-self:start; } }
@media (max-width:600px) { .attention-closeout-summary,.attention-payment-form { grid-template-columns:1fr; }.attention-collection-card>header { flex-direction:column; }.attention-closeout-form .btn,.attention-payment-form .btn { width:100%; } }
@media (max-width:760px) { .checkout-procedure-list,.checkout-payment-grid { grid-template-columns:1fr; }.checkout-payment-toggle { align-items:start; }.checkout-payment-toggle>b { grid-column:2; } }

/* Centro contable orientado a tareas */
.accounting-dashboard { gap: 12px; }
.accounting-command-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 4px 0 2px; }
.accounting-command-bar h2 { margin: 2px 0; font-size: 20px; }
.accounting-command-bar p { margin: 0; color: #687681; font-size: 11px; }
.accounting-command-actions { display: flex; align-items: center; gap: 8px; }
.accounting-more-menu { position: relative; }
.accounting-more-menu > summary { cursor: pointer; list-style: none; }
.accounting-more-menu > summary::-webkit-details-marker { display: none; }
.accounting-more-menu > nav { position: absolute; z-index: 25; top: calc(100% + 6px); right: 0; display: grid; min-width: 235px; padding: 6px; border: 1px solid #dce6ea; border-radius: 10px; background: #fff; box-shadow: 0 16px 38px rgba(20, 50, 62, .16); }
.accounting-more-menu > nav a { padding: 9px 10px; border-radius: 7px; color: #294650; font-size: 11px; font-weight: 750; text-decoration: none; }
.accounting-more-menu > nav a:hover { color: #08777d; background: #eef8f8; }
.accounting-period-bar { position: relative; display: flex; align-items: center; gap: 5px; padding: 8px 10px; border: 1px solid #dce6ea; border-radius: 11px; background: #fff; }
.accounting-period-bar > span { margin-right: 3px; color: #6d7b85; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.accounting-period-bar > a,
.accounting-custom-period > summary { display: inline-flex; min-height: 30px; align-items: center; padding: 6px 10px; border-radius: 7px; color: #52636d; font-size: 10px; font-weight: 750; text-decoration: none; cursor: pointer; list-style: none; }
.accounting-period-bar > a:hover,
.accounting-custom-period > summary:hover { background: #f0f6f7; }
.accounting-period-bar .is-active { color: #08777d; background: #e8f7f7; }
.accounting-custom-period { position: relative; }
.accounting-custom-period > summary::-webkit-details-marker { display: none; }
.accounting-custom-period > form { position: absolute; z-index: 20; top: calc(100% + 7px); left: 0; display: grid; grid-template-columns: repeat(2, minmax(130px, 1fr)) auto; align-items: end; gap: 8px; min-width: 410px; padding: 11px; border: 1px solid #dce6ea; border-radius: 11px; background: #fff; box-shadow: 0 16px 38px rgba(20, 50, 62, .15); }
.accounting-custom-period label { display: grid; gap: 4px; color: #61717c; font-size: 9px; font-weight: 750; }
.accounting-custom-period input { min-width: 0; min-height: 34px; padding: 6px 8px; }
.accounting-custom-period .btn { min-height: 34px; }
.accounting-priority-card { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid #efd596; border-radius: 13px; background: #fff9eb; }
.accounting-priority-card.is-clear { border-color: #bfe2d4; background: #f0faf6; }
.accounting-priority-icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; color: #986514; background: #ffe8af; font-weight: 900; }
.accounting-priority-card.is-clear .accounting-priority-icon { color: #087058; background: #d9f4e8; }
.accounting-priority-card > div { display: grid; gap: 1px; }
.accounting-priority-card > div > span { color: #9a6818; font-size: 9px; font-weight: 850; letter-spacing: .08em; }
.accounting-priority-card > div > strong { color: #60400e; font-size: 16px; }
.accounting-priority-card.is-clear > div > strong { color: #176149; }
.accounting-priority-card small { color: #7c6847; font-size: 10px; }
.accounting-summary-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dce6ea; border-radius: 12px; background: #fff; }
.accounting-summary-strip article { display: grid; gap: 2px; padding: 11px 14px; border-left: 1px solid #e4ecef; }
.accounting-summary-strip article:first-child { border-left: 0; }
.accounting-summary-strip span { color: #6c7984; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.accounting-summary-strip strong { color: #263e48; font-size: 19px; }
.accounting-summary-strip strong.is-income { color: #087058; }
.accounting-summary-strip strong.is-expense { color: #b9433c; }
.accounting-summary-strip small { color: #84909a; font-size: 9px; }
.accounting-cash-strip { position: relative; display: grid; grid-template-columns: minmax(220px, 1fr) auto; align-items: center; gap: 14px; padding: 11px 14px; border: 1px solid #dce6ea; border-radius: 12px; background: #fff; }
.accounting-cash-strip.is-open { grid-template-columns: minmax(220px, 1fr) auto auto auto; border-color: #bcded5; background: #fbfefd; }
.accounting-cash-status { display: flex; align-items: center; gap: 10px; min-width: 0; }
.accounting-cash-status > div { display: grid; gap: 1px; min-width: 0; }
.accounting-cash-status strong { font-size: 12px; }
.accounting-cash-status small { overflow: hidden; color: #74818b; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.accounting-cash-total { display: grid; gap: 1px; text-align: right; }
.accounting-cash-total span { color: #6d7b85; font-size: 9px; }
.accounting-cash-total strong { color: #087058; font-size: 17px; }
.accounting-cash-detail { position: relative; }
.accounting-cash-detail > summary { color: #08777d; font-size: 10px; font-weight: 800; cursor: pointer; }
.accounting-cash-detail > .cash-expected-breakdown { position: absolute; z-index: 18; top: calc(100% + 7px); right: 0; min-width: 300px; margin: 0; background: #fff; box-shadow: 0 14px 32px rgba(20, 50, 62, .14); }
.accounting-workspace { display: grid; gap: 0; }
.accounting-tabs { display: flex; gap: 4px; padding: 4px; border: 1px solid #dce6ea; border-bottom: 0; border-radius: 12px 12px 0 0; background: #f4f8f9; }
.accounting-tabs button { display: inline-flex; min-height: 35px; align-items: center; gap: 7px; padding: 7px 12px; border: 0; border-radius: 8px; color: #5d6d77; background: transparent; font-size: 11px; font-weight: 800; cursor: pointer; }
.accounting-tabs button:hover { color: #08777d; background: #fff; }
.accounting-tabs button[aria-selected="true"] { color: #08777d; background: #fff; box-shadow: 0 1px 5px rgba(25, 56, 70, .09); }
.accounting-tabs button span { display: inline-grid; min-width: 20px; height: 20px; place-items: center; padding: 0 5px; border-radius: 99px; color: #6d7b85; background: #e8eef0; font-size: 9px; }
.accounting-tabs button[aria-selected="true"] span { color: #08777d; background: #e2f5f5; }
.accounting-tab-panel.accounting-panel { border-radius: 0 0 14px 14px; box-shadow: none; }
.accounting-tab-panel[hidden] { display: none !important; }
.accounting-operations-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-top: 12px; }
.accounting-operations-grid.is-single { grid-template-columns: 1fr; }
.patient-account-card { display: block; padding: 0; }
.patient-account-card > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; cursor: pointer; list-style: none; }
.patient-account-card > summary::-webkit-details-marker { display: none; }
.patient-account-card > summary:hover { background: #f7fbfb; }
.patient-account-card > summary > div { display: grid; gap: 2px; min-width: 0; }
.patient-account-card > summary > div strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.patient-account-card > summary > div span { color: #71808b; font-size: 10px; }
.patient-account-summary-total { display: grid; gap: 1px; flex: 0 0 auto; text-align: right; }
.patient-account-summary-total b { color: #a56c12; font-size: 16px; }
.patient-account-summary-total small { color: #08777d; font-size: 9px; font-weight: 800; }
.patient-account-card[open] > summary { border-bottom: 1px solid #e5ecef; background: #f8fbfb; }
.patient-account-body { display: grid; gap: 10px; padding: 12px 14px 14px; }
.accounting-tab-panel .attention-collection-list { gap: 7px; padding: 10px; }
.accounting-tab-panel .attention-payment-form { padding-top: 10px; }

@media (max-width: 950px) {
    .accounting-command-bar { align-items: flex-start; }
    .accounting-cash-strip.is-open { grid-template-columns: minmax(220px, 1fr) auto auto; }
    .accounting-cash-strip.is-open > .btn { grid-column: 1 / -1; justify-self: end; }
    .accounting-operations-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .accounting-command-bar { align-items: stretch; flex-direction: column; }
    .accounting-command-actions { justify-content: space-between; }
    .accounting-command-actions > .btn { flex: 1; }
    .accounting-period-bar { overflow-x: auto; }
    .accounting-period-bar > span { display: none; }
    .accounting-period-bar > a,
    .accounting-custom-period > summary { white-space: nowrap; }
    .accounting-custom-period > form { position: fixed; z-index: 40; inset: auto 14px 14px; grid-template-columns: 1fr; min-width: 0; }
    .accounting-priority-card { grid-template-columns: 34px minmax(0, 1fr); }
    .accounting-priority-card .btn { grid-column: 1 / -1; width: 100%; }
    .accounting-summary-strip { grid-template-columns: 1fr; }
    .accounting-summary-strip article { grid-template-columns: 1fr auto; align-items: center; border-top: 1px solid #e4ecef; border-left: 0; }
    .accounting-summary-strip article:first-child { border-top: 0; }
    .accounting-summary-strip article small { grid-column: 1 / -1; }
    .accounting-cash-strip,
    .accounting-cash-strip.is-open { grid-template-columns: 1fr auto; }
    .accounting-cash-strip .btn { grid-column: 1 / -1; width: 100%; }
    .accounting-cash-detail > .cash-expected-breakdown { position: fixed; z-index: 40; inset: auto 14px 14px; min-width: 0; }
    .accounting-tabs { overflow-x: auto; }
    .accounting-tabs button { flex: 1 0 auto; }
    .accounting-table-wrap { overflow: visible; }
    .accounting-table-wrap table { display: block; min-width: 0; }
    .accounting-table-wrap thead { display: none; }
    .accounting-table-wrap tbody { display: grid; gap: 8px; padding: 9px; }
    .accounting-table-wrap tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px; border: 1px solid #e1e9eb; border-radius: 10px; background: #fff; }
    .accounting-table-wrap td { display: grid; gap: 2px; padding: 5px; border: 0; text-align: left !important; }
    .accounting-table-wrap td::before { content: attr(data-label); color: #7a8791; font-size: 8px; font-weight: 800; text-transform: uppercase; }
    .accounting-table-wrap td.accounting-concept-cell { grid-column: 1 / -1; min-width: 0; }
    .accounting-payment-breakdown { min-width: 0; max-width: none; }
    .patient-account-card > summary { align-items: flex-start; }
    .patient-account-body .attention-payment-form { grid-template-columns: 1fr; }
}

/* Espacio de trabajo compacto de la atencion clinica */
.attention-clinical-page .content { padding-top:16px; }
.attention-clinical-workspace { display:grid; gap:12px; }
.attention-clinical-hero { display:grid; grid-template-columns:minmax(280px,1fr) minmax(330px,1.15fr) auto; align-items:center; gap:18px; padding:14px 16px; }
.attention-patient-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.attention-clinical-page .attention-patient-identity .patient-summary-avatar { width:48px; height:48px; }
.attention-patient-identity>div:last-child { min-width:0; }
.attention-eyebrow { display:block; color:var(--primary-dark); font-size:10px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }
.attention-patient-identity h2 { margin:1px 0 2px; overflow:hidden; font-size:20px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.attention-patient-identity p { display:flex; flex-wrap:wrap; gap:3px 12px; margin:0; color:var(--muted); font-size:11px; }
.attention-appointment-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 14px; min-width:0; }
.attention-appointment-facts>div { min-width:0; }
.attention-appointment-facts span,.attention-appointment-facts strong { display:block; }
.attention-appointment-facts span { color:var(--muted); font-size:10px; font-weight:750; text-transform:uppercase; }
.attention-appointment-facts strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.attention-treatment-fact { grid-column:1 / -1; }
.attention-status-text { color:var(--primary-dark); text-transform:capitalize; }
.attention-hero-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; min-width:290px; }
.attention-hero-actions .btn { min-height:36px; padding:7px 10px; font-size:11px; white-space:nowrap; }
.attention-flow-panel .panel-body { padding:11px 14px; }
.attention-flow-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.attention-flow-heading>div>strong,.attention-flow-heading>div>span { display:block; }
.attention-flow-heading>div>span { color:var(--muted); font-size:11px; }
.attention-clinical-page .care-flow { gap:8px; margin:9px 0 0; }
.attention-clinical-page .care-flow-step { display:flex; align-items:center; justify-content:center; gap:6px; min-height:36px; font-size:12px; }
.attention-clinical-page .care-flow-step small { font-size:9px; font-weight:750; opacity:.75; }
.attention-state-history { margin-top:8px; border-top:1px solid var(--line); padding-top:7px; }
.attention-state-history summary { display:flex; justify-content:space-between; gap:12px; width:max-content; max-width:100%; color:var(--primary-dark); cursor:pointer; font-size:11px; font-weight:800; }
.attention-state-history summary span { color:var(--muted); font-weight:650; }
.attention-state-history .state-history { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 12px; margin-top:9px; }
.attention-state-history .state-history div { gap:7px; }
.attention-clinical-page #cierre-cobro { scroll-margin-top:88px; }
.attention-clinical-page .attention-closeout>.panel-header { padding:11px 14px; }
.attention-clinical-page .attention-closeout>.panel-body { gap:11px; padding:13px 14px; }
.attention-clinical-page .attention-closeout-form { max-width:none; gap:9px; }
.attention-clinical-page .attention-closeout-rule { display:block; padding:0; overflow:hidden; }
.attention-closeout-rule summary { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:9px 11px; cursor:pointer; list-style:none; }
.attention-closeout-rule summary::-webkit-details-marker { display:none; }
.attention-closeout-rule summary span { color:var(--muted); font-size:11px; }
.attention-closeout-rule p { margin:0; padding:0 11px 10px; color:#31545b; font-size:12px; }
.attention-clinical-page .auto-detected-procedures { gap:7px; padding:10px 12px; }
.attention-clinical-page .auto-detected-procedure-list span { padding:5px 8px; }
.attention-procedure-review { border:1px solid var(--line); border-radius:var(--radius-control); background:var(--surface-soft); overflow:hidden; }
.attention-procedure-review>summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; padding:8px 11px; cursor:pointer; list-style:none; }
.attention-procedure-review>summary::-webkit-details-marker { display:none; }
.attention-procedure-review>summary span:first-child strong,.attention-procedure-review>summary span:first-child small { display:block; }
.attention-procedure-review>summary small { margin-top:1px; color:var(--muted); font-weight:650; }
.attention-review-action { color:var(--primary-dark); font-size:11px; font-weight:850; }
.attention-procedure-review[open] .attention-review-action { font-size:0; }
.attention-procedure-review[open] .attention-review-action::after { content:"Ocultar"; font-size:11px; }
.attention-procedure-review>div { display:grid; gap:7px; padding:10px 11px 11px; border-top:1px solid var(--line); }
.attention-clinical-page .attention-procedure-review select[multiple] { min-height:180px; }
.attention-closeout-submit { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:9px; border-top:1px solid var(--line); }
.attention-closeout-submit>span { color:var(--muted); font-size:11px; }
.attention-clinical-page .attention-closeout-submit .btn { justify-self:auto; margin:0; }
.attention-plan-closeout-message { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0; }
.attention-plan-closeout-message .btn { flex:0 0 auto; }
.attention-plan-closeout-form { display:grid; gap:10px; }
.attention-plan-closeout-intro { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid #b9e0d5; border-radius:var(--radius-control); background:#eef9f5; }
.attention-plan-closeout-intro>div { display:grid; gap:1px; }
.attention-plan-closeout-intro strong { color:#075d52; font-size:12px; }
.attention-plan-closeout-intro span:not(.badge) { color:#47676a; font-size:11px; }
.attention-plan-group { overflow:hidden; border:1px solid var(--line); border-radius:var(--radius-control); background:#fff; }
.attention-plan-group>summary { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:54px; padding:9px 12px; cursor:pointer; list-style:none; }
.attention-plan-group>summary::-webkit-details-marker { display:none; }
.attention-plan-group>summary>span:first-child { display:grid; gap:1px; }
.attention-plan-group>summary strong { font-size:13px; }
.attention-plan-group>summary small { color:var(--muted); font-size:10px; }
.attention-plan-group-total { color:#087058; font-size:11px; white-space:nowrap; }
.attention-plan-not-charged { color:#687984; font-size:10px; font-weight:800; text-transform:uppercase; }
.attention-plan-completed { border-left:4px solid #2d9b78; }
.attention-plan-pending { border-left:4px solid #d6a43b; }
.attention-plan-item-list { display:grid; gap:7px; padding:9px 10px 10px; border-top:1px solid var(--line); background:var(--surface-soft); }
.attention-plan-item { display:grid; grid-template-columns:minmax(220px,1fr) auto; align-items:center; gap:12px; min-width:0; padding:9px 10px; border:1px solid #dbe5e8; border-radius:9px; background:#fff; }
.attention-plan-item>div:first-child,.attention-plan-item-main { display:grid; min-width:0; gap:1px; }
.attention-plan-item strong { overflow:hidden; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.attention-plan-item>div:first-child>span,.attention-plan-item-main small { color:var(--muted); font-size:10px; font-style:normal; }
.attention-plan-item-main em { color:#7b6331; font-size:10px; font-style:normal; font-weight:750; }
.attention-plan-item-values { display:flex; align-items:center; justify-content:flex-end; gap:12px; color:var(--muted); font-size:9px; white-space:nowrap; }
.attention-plan-item-values span { display:grid; gap:0; }
.attention-plan-item-values b { color:var(--ink); font-size:11px; }
.attention-plan-item-values .is-collectable b { color:#087058; }
label.attention-plan-item { grid-template-columns:auto minmax(190px,1fr) auto auto; cursor:pointer; }
label.attention-plan-item>input { margin:0; }
.attention-plan-check-label { padding:5px 7px; border:1px solid #cbdadd; border-radius:7px; color:#31545b; font-size:10px; font-weight:800; white-space:nowrap; }
.attention-plan-item.is-selected { border-color:#68b8ae; background:#edf9f6; box-shadow:0 0 0 1px rgba(34,139,126,.08); }
.attention-plan-item.is-selected .attention-plan-item-main em { color:#087058; }
.attention-plan-item.is-selected .attention-plan-check-label { border-color:#68b8ae; color:#075d52; background:#dff4ee; }
.attention-plan-zero-confirm { display:flex; align-items:flex-start; gap:9px; padding:10px 12px; border:1px solid #dfbd71; border-radius:var(--radius-control); color:#665224; background:#fff9eb; font-size:11px; font-weight:750; cursor:pointer; }
.attention-plan-zero-confirm[hidden] { display:none; }
.attention-plan-closeout-form .field-error { padding:8px 10px; border-radius:8px; color:#8a2424; background:#fff0f0; font-size:11px; font-weight:750; }
.attention-secondary-disclosure>summary { display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; list-style:none; }
.attention-secondary-disclosure>summary::-webkit-details-marker { display:none; }
.attention-secondary-disclosure>summary small { color:var(--muted); font-weight:650; }

@media (max-width:1200px) {
    .attention-clinical-hero { grid-template-columns:minmax(260px,.85fr) minmax(330px,1.15fr); }
    .attention-hero-actions { grid-column:1 / -1; grid-template-columns:repeat(4,minmax(0,1fr)); min-width:0; }
}

@media (max-width:760px) {
    .attention-clinical-hero { grid-template-columns:1fr; gap:12px; }
    .attention-hero-actions { grid-column:auto; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .attention-state-history .state-history { grid-template-columns:1fr; }
    .attention-plan-closeout-message,.attention-closeout-submit { align-items:stretch; flex-direction:column; }
    .attention-plan-closeout-message .btn,.attention-closeout-submit .btn { width:100%; }
    .attention-plan-item,label.attention-plan-item { grid-template-columns:auto minmax(0,1fr); align-items:start; }
    .attention-plan-item.is-completed { grid-template-columns:1fr; }
    .attention-plan-item-values { grid-column:1 / -1; justify-content:space-between; width:100%; padding-top:6px; border-top:1px solid var(--line); }
    .attention-plan-check-label { align-self:center; justify-self:start; grid-column:2; }
}

@media (max-width:480px) {
    .attention-clinical-page .content { padding-top:12px; }
    .attention-clinical-hero { padding:12px; }
    .attention-appointment-facts { grid-template-columns:1fr; }
    .attention-treatment-fact { grid-column:auto; }
    .attention-hero-actions { display:flex; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin; }
    .attention-hero-actions .btn { flex:0 0 auto; }
    .attention-clinical-page .care-flow-step { flex-direction:column; gap:0; text-align:center; }
    .attention-closeout-rule summary { align-items:flex-start; flex-direction:column; gap:2px; }
    .attention-plan-closeout-intro,.attention-plan-group>summary { align-items:flex-start; flex-direction:column; }
    .attention-plan-group-total,.attention-plan-not-charged { white-space:normal; }
}

* { box-sizing: border-box; }

[hidden] {
    display: none !important;
}

html { min-width: 320px; }

body {
    margin: 0;
    font-family: var(--font-ui);
    color: var(--ink);
    background:
        linear-gradient(180deg, rgba(230, 246, 247, .72), rgba(245, 247, 248, 0) 260px),
        var(--bg);
    font-size: 15px;
    line-height: 1.5;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
input[type="checkbox"], input[type="radio"] {
    width: 18px;
    min-height: 18px;
    padding: 0;
    accent-color: #7CC7F2;
    flex: 0 0 auto;
}

.app-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 264px 1fr;
}

.sidebar {
    background: #173A49;
    color: #F4FAFA;
    padding: 22px 16px;
    border-right: 1px solid rgba(255, 255, 255, .08);
}

.brand {
    display: grid;
    gap: 10px;
    margin-bottom: 28px;
    padding: 0 8px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.brand-mark {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: var(--radius-panel);
    background: rgba(68, 184, 194, .18);
    color: #A7F3F7;
    font-weight: 800;
}

.brand-name { font-weight: 800; font-size: 18px; }
.brand span { display: block; color: #B8D9DD; font-size: 12px; font-weight: 600; margin-top: 2px; }

.nav { display: grid; gap: 6px; }

.nav a {
    display: flex;
    align-items: center;
    min-height: 42px;
    border-radius: var(--radius-control);
    padding: 10px 12px;
    color: #CFE3E5;
    font-size: 14px;
    font-weight: 600;
    transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}

.nav a:hover { background: rgba(255, 255, 255, .08); color: #FFFFFF; }
.nav a.active { background: #E6F6F7; color: #064F57; box-shadow: inset 0 0 0 1px rgba(11, 122, 134, .18); }

.main { min-width: 0; }

.topbar {
    min-height: 72px;
    background: rgba(255, 255, 255, .86);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(216, 224, 231, .9);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 0 32px;
    position: sticky;
    top: 0;
    z-index: 20;
}

.topbar h1 { font-size: 24px; line-height: 1.2; margin: 0; font-weight: 800; }
.topbar-meta { display: flex; align-items: center; gap: 10px; }

.system-pill {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 11px;
    background: var(--success-soft);
    color: #0B5E4C;
    font-size: 12px;
    font-weight: 700;
}

.content {
    padding: 30px 32px 42px;
    max-width: 1680px;
}

.toolbar {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.toolbar-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.toolbar-title { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.toolbar-title h2 { margin: 0; font-size: 24px; line-height: 1.2; }

.panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    overflow: hidden;
    box-shadow: var(--shadow-soft);
}

.panel-header {
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    font-weight: 800;
    background: var(--surface-soft);
}

.panel-body { padding: 20px; }

.grid { display: grid; gap: 16px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.metric {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    padding: 18px;
    box-shadow: var(--shadow-soft);
}

.metric strong { display: block; font-size: 28px; line-height: 1.15; margin-top: 6px; font-weight: 800; }
.muted { color: var(--muted); font-size: 13px; }
.section-note { color: var(--muted); font-size: 14px; margin: 0 0 18px; }

table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th, td {
    padding: 13px 14px;
    border-bottom: 1px solid var(--line);
    text-align: left;
    font-size: 14px;
    vertical-align: middle;
}

th {
    background: var(--surface-soft);
    color: #354552;
    font-weight: 800;
}

tr:last-child td { border-bottom: 0; }
tbody tr { transition: background .16s ease; }
tbody tr:hover { background: rgba(230, 246, 247, .48); }

label {
    display: block;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 7px;
    color: #22313C;
}

input, select, textarea {
    width: 100%;
    min-height: 42px;
    border: 1px solid #C9D4DE;
    border-radius: var(--radius-control);
    padding: 9px 11px;
    color: var(--ink);
    background: #fff;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

textarea { min-height: 98px; resize: vertical; }
input:hover, select:hover, textarea:hover { border-color: #AAB8C5; }
input:focus, select:focus, textarea:focus { outline: 0; border-color: #44B8C2; box-shadow: var(--focus-ring); }
input:disabled, select:disabled, textarea:disabled { background: #EEF2F4; color: var(--subtle); cursor: not-allowed; }

.field-error { color: var(--danger); font-size: 12px; margin-top: 5px; font-weight: 700; }

.actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    border: 1px solid transparent;
    border-radius: var(--radius-control);
    padding: 9px 14px;
    font-weight: 800;
    cursor: pointer;
    background: #E6EBEF;
    color: #1D2A33;
    transition: background .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .12s ease;
}

.btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(21, 33, 43, .08); }
.btn:disabled:hover { transform: none; box-shadow: none; }
.btn:active { transform: translateY(0); }
.btn:focus-visible { outline: 0; box-shadow: var(--focus-ring); }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-dark); }
.btn-secondary { background: var(--secondary); color: #fff; }
.btn-secondary:hover { background: #2F755A; }
.btn-whatsapp { background: #1E9E61; color: #fff; border-color: #1E9E61; }
.btn-whatsapp:hover { background: #16824E; }
.btn-outline { background: #fff; border-color: var(--line); }
.btn-danger { background: var(--danger); color: #fff; }
.btn-sm { min-height: 34px; padding: 6px 10px; font-size: 13px; }
.btn-square { width: 42px; padding-left: 0; padding-right: 0; }
.required { color: var(--danger); }

.status {
    background: var(--success-soft);
    border: 1px solid rgba(20, 125, 100, .22);
    color: #0B5E4C;
    border-radius: var(--radius-control);
    padding: 10px 12px;
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 700;
}

.status-error {
    background: var(--danger-soft);
    border-color: rgba(180, 35, 24, .22);
    color: var(--danger);
}

.status-warning {
    background: var(--warning-soft);
    border-color: rgba(183, 121, 31, .28);
    color: #875000;
}

.badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border-radius: 999px;
    background: var(--info-soft);
    color: #244F8C;
    padding: 4px 9px;
    font-size: 12px;
    font-weight: 800;
}

.badge-muted {
    background: #EEF2F4;
    color: var(--muted);
    margin-left: 8px;
}

.role-chip {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    border-radius: 999px;
    border: 1px solid var(--line);
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 800;
    color: #274452;
    background: #F3F8F8;
}

.color-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    border-radius: 999px;
    border: 1px solid var(--line);
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 800;
    color: #2D4654;
    background: #fff;
}

.color-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(21, 33, 43, .12);
}

.empty {
    padding: 28px;
    color: var(--muted);
    text-align: center;
}

.settings-shell {
    display: grid;
    grid-template-columns: 292px 1fr;
    min-height: calc(100vh - 136px);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    overflow: hidden;
    box-shadow: var(--shadow-soft);
}

.settings-nav {
    border-right: 1px solid var(--line);
    padding: 28px 0;
    background: var(--surface-soft);
}

.settings-nav a {
    display: flex;
    gap: 12px;
    align-items: center;
    min-height: 48px;
    padding: 0 24px;
    border-right: 3px solid transparent;
    color: #263743;
    font-weight: 700;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}

.settings-nav a:hover { background: rgba(230, 246, 247, .72); }
.settings-nav a.active { background: var(--primary-soft); border-right-color: var(--primary); color: var(--primary-dark); }

.settings-nav-mark {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: #A8B8C6;
    flex: 0 0 auto;
}

.settings-nav a.active .settings-nav-mark { background: var(--primary); }
.settings-content { padding: 34px 30px 46px; }
.settings-title { font-size: 24px; line-height: 1.2; margin: 0 0 28px; font-weight: 800; }

.clinic-form {
    display: grid;
    grid-template-columns: minmax(0, 700px) minmax(280px, 1fr);
    gap: 70px;
    align-items: start;
}

.form-stack { display: grid; gap: 22px; }
.phone-row { display: grid; grid-template-columns: 116px 1fr; }
.phone-row select { border-radius: var(--radius-control) 0 0 var(--radius-control); }
.phone-row input { border-left: 0; border-radius: 0 var(--radius-control) var(--radius-control) 0; }

.logo-box { text-align: center; padding-top: 72px; }

.logo-preview {
    max-width: 360px;
    min-height: 150px;
    margin: 24px auto 0;
    display: grid;
    place-items: center;
    color: #7891A4;
}

.logo-preview img { max-width: 360px; max-height: 180px; object-fit: contain; }
.logo-wordmark { font-size: 34px; font-weight: 800; color: #7E909D; }
.logo-wordmark span { display:block; font-size:13px; color:#6BAFCB; margin-top:6px; }

.collapsible {
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    padding: 16px 18px;
    background: var(--surface-soft);
}

.agenda-layout {
    display: grid;
    grid-template-columns: minmax(320px, 460px) 1fr;
    gap: 30px;
}

.time-inline {
    display: grid;
    grid-template-columns: 145px 1fr;
    gap: 14px;
    align-items: center;
    margin-bottom: 18px;
}

.day-list {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    max-height: 560px;
    overflow: auto;
    padding: 14px;
    background: var(--surface-soft);
}

.day-row {
    border-bottom: 1px solid var(--line);
    padding: 14px 0;
}

.day-row:last-child { border-bottom: 0; }
.day-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.blocks { display: grid; gap: 8px; }
.block-row { display: grid; grid-template-columns: 130px auto 130px auto; gap: 10px; align-items: center; max-width: 470px; }

.icon-button {
    width: 36px;
    min-height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: #fff;
    cursor: pointer;
    color: var(--muted);
}

.icon-button:hover { border-color: var(--danger); color: var(--danger); }
.google-box { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }

.agenda-settings-page { display: grid; gap: 16px; }
.agenda-settings-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.agenda-settings-heading .settings-title { margin: 3px 0 4px; }
.agenda-settings-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.section-kicker { display: block; color: var(--primary); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.agenda-settings-form { display: grid; gap: 14px; }
.agenda-config-card,
.agenda-work-hours-card { overflow: visible; padding: 0; }
.agenda-section-heading { display: flex; align-items: center; gap: 11px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.agenda-section-heading > div { min-width: 0; }
.agenda-section-heading h3 { margin: 0 0 2px; font-size: 16px; }
.agenda-section-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.agenda-section-number { display: grid; flex: 0 0 27px; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 12px; font-weight: 800; }
.agenda-section-heading-actions .agenda-block-count { margin-left: auto; padding: 6px 9px; border-radius: 999px; background: var(--surface-soft); color: var(--muted); font-size: 10px; white-space: nowrap; }
.agenda-section-heading-actions .agenda-block-count b { color: var(--ink); }
.agenda-options-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; padding: 14px 16px 16px; }
.agenda-option-field { display: grid; align-content: start; gap: 5px; min-width: 0; }
.agenda-option-field > span { color: var(--ink); font-size: 10px; font-weight: 800; }
.agenda-option-field input,
.agenda-option-field select { width: 100%; min-width: 0; }
.agenda-option-field small { color: var(--muted); font-size: 9px; line-height: 1.25; }
.agenda-settings-page .day-list { max-height: none; overflow: visible; border: 0; border-radius: 0; background: transparent; }
.agenda-week-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 12px 16px 16px; }
.agenda-settings-page .day-row { min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface-soft); }
.agenda-settings-page .day-head { gap: 8px; margin-bottom: 9px; }
.agenda-settings-page .day-head > div { display: grid; gap: 1px; }
.agenda-settings-page .day-head strong { font-size: 12px; }
.agenda-settings-page .day-head small { color: var(--muted); font-size: 9px; }
.agenda-settings-page .day-head .btn { min-height: 30px; padding: 5px 8px; font-size: 9px; }
.agenda-settings-page .blocks { gap: 6px; }
.agenda-settings-page .block-row { grid-template-columns: minmax(92px, 1fr) auto minmax(92px, 1fr) 30px; gap: 5px; max-width: none; }
.agenda-settings-page .block-row label { display: grid; gap: 2px; min-width: 0; }
.agenda-settings-page .block-row label > span { color: var(--muted); font-size: 8px; font-weight: 700; }
.agenda-settings-page .block-row input { width: 100%; min-width: 0; min-height: 34px; padding: 6px 7px; font-size: 11px; }
.agenda-settings-page .block-separator { align-self: end; padding-bottom: 9px; color: var(--muted); font-size: 10px; }
.agenda-settings-page .block-row .icon-button { align-self: end; width: 30px; min-height: 30px; margin-bottom: 2px; font-size: 17px; }
.day-empty-message { margin: 4px 0 0; padding: 9px; border: 1px dashed var(--line); border-radius: 7px; color: var(--muted); font-size: 10px; text-align: center; }
.agenda-save-bar { display: flex; align-items: center; justify-content: flex-end; gap: 18px; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-control); background: #fff; }
.agenda-save-bar p { display: grid; gap: 1px; margin: 0 auto 0 0; }
.agenda-save-bar p strong { font-size: 11px; }
.agenda-save-bar p span { color: var(--muted); font-size: 9px; }
.agenda-calendar-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-panel); background: #fff; }
.agenda-calendar-card h3 { margin: 2px 0; font-size: 14px; }
.agenda-calendar-card p { margin: 0; color: var(--muted); font-size: 10px; }

@media (max-width: 1280px) {
    .agenda-options-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .agenda-week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
    .agenda-options-grid,
    .agenda-week-grid { grid-template-columns: 1fr; }
    .agenda-section-heading-actions { align-items: flex-start; flex-wrap: wrap; }
    .agenda-section-heading-actions .agenda-block-count { margin-left: 38px; }
    .agenda-save-bar,
    .agenda-calendar-card { align-items: stretch; flex-direction: column; }
    .agenda-save-bar .btn,
    .agenda-calendar-card .btn { width: 100%; }
}

.agenda-page {
    display: grid;
    gap: 18px;
}

.agenda-toolbar {
    margin-bottom: 0;
}

.agenda-controls {
    min-height: 96px;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(280px, 1.4fr) minmax(300px, 1fr);
    align-items: center;
    gap: 18px;
    padding: 18px 20px;
    box-shadow: none;
}

.agenda-controls-left,
.agenda-controls-right {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.agenda-controls-right {
    justify-content: flex-end;
}

.agenda-controls-right select {
    min-width: 120px;
    width: auto;
}

.agenda-controls-right select[multiple] {
    min-width: 230px;
    overflow: hidden;
}

.agenda-date-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-size: 18px;
    font-weight: 800;
    text-align: center;
}

.agenda-date-title input {
    max-width: 150px;
}

.agenda-board-wrap {
    overflow: auto;
    max-height: calc(100vh - 278px);
    min-height: 560px;
}

.agenda-board {
    min-width: calc(96px + (var(--dentist-count) * 250px));
    display: grid;
    grid-template-columns: 88px repeat(var(--dentist-count), minmax(250px, 1fr));
    grid-template-rows: 46px repeat(var(--slot-count), 58px);
    position: relative;
    background: var(--surface);
}

.agenda-corner,
.agenda-dentist-head {
    position: sticky;
    top: 0;
    z-index: 6;
    background: var(--surface-soft);
    border-bottom: 1px solid var(--line);
}

.agenda-corner {
    left: 0;
    z-index: 7;
    border-right: 1px solid var(--line);
}

.agenda-dentist-head {
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 1px;
    padding: 6px 10px;
    border-right: 1px solid var(--line);
}

.agenda-dentist-head span {
    font-weight: 800;
    line-height: 1.2;
}

.agenda-dentist-head small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.agenda-time-label {
    position: sticky;
    left: 0;
    z-index: 4;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 8px;
    border-right: 1px solid var(--line);
    border-bottom: 1px dashed var(--line);
    background: var(--surface-soft);
    color: var(--muted);
    font-family: var(--font-data);
    font-size: 12px;
    font-weight: 700;
}

.agenda-time-label.is-hour {
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
}

.agenda-slot {
    min-height: 0;
    border: 0;
    border-right: 1px solid var(--line);
    border-bottom: 1px dashed var(--line);
    background: transparent;
    cursor: pointer;
    border-radius: 0;
    transition: background .14s ease, box-shadow .14s ease;
}

.agenda-slot:hover,
.agenda-slot:focus-visible {
    outline: 0;
    background: rgba(11, 122, 134, .06);
    box-shadow: inset 0 0 0 1px rgba(11, 122, 134, .18);
}

.appointment-card {
    z-index: 5;
    align-self: stretch;
    display: grid;
    align-content: start;
    gap: 3px;
    margin: 4px 6px;
    padding: 10px 11px;
    border: 1px solid color-mix(in srgb, var(--event-color) 42%, transparent);
    border-left: 4px solid var(--event-color);
    border-radius: var(--radius-control);
    background: var(--event-bg);
    box-shadow: 0 8px 18px rgba(21, 33, 43, .07);
    overflow: visible;
    position: relative;
}

.appointment-card.is-short {
    gap: 1px;
    margin: 3px 6px;
    padding: 5px 8px 4px;
    align-content: start;
}

.appointment-card.menu-open {
    z-index: 30;
}

.appointment-card-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
    align-items: start;
    min-width: 0;
}

.appointment-card strong {
    font-size: 13px;
    line-height: 1.25;
    color: #20313D;
}

.appointment-card span,
.appointment-card em,
.appointment-time {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.appointment-card span {
    color: #536371;
    font-size: 12px;
    font-style: normal;
}

.appointment-card em {
    color: var(--event-color);
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
}

.appointment-time {
    color: #536371;
    font-family: var(--font-data);
    font-size: 11px;
    font-weight: 800;
}

.appointment-card.is-short .appointment-card-head {
    align-items: center;
    gap: 4px;
}

.appointment-card.is-short .appointment-menu-button {
    width: 18px;
    min-height: 18px;
    font-size: 15px;
}

.appointment-card.is-short .appointment-time {
    font-size: 9px;
    line-height: 1.05;
}

.appointment-card.is-short strong {
    font-size: 11px;
    line-height: 1.05;
}

.appointment-card.is-short > span,
.appointment-card.is-short > em {
    display: none;
}

.appointment-menu-button {
    width: 24px;
    min-height: 24px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: color-mix(in srgb, var(--event-color) 72%, #536371);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    padding: 0;
}

.appointment-menu-button:hover,
.appointment-menu-button:focus-visible {
    outline: 0;
    background: rgba(255, 255, 255, .62);
    box-shadow: inset 0 0 0 1px rgba(21, 33, 43, .08);
}

.appointment-menu {
    display: none;
    position: absolute;
    right: 8px;
    top: 30px;
    z-index: 40;
    min-width: 172px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.appointment-menu.open {
    display: grid;
    gap: 2px;
}

.appointment-menu .link-button {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 40px;
    text-align: left;
    padding: 7px 9px;
    border-radius: 5px;
    color: var(--ink);
    font-weight: 700;
    text-decoration: none;
}

.appointment-menu .link-button:hover {
    background: var(--surface-tint);
    color: var(--primary-dark);
}

.appointment-menu form {
    margin: 0;
}

.danger-link {
    color: var(--danger) !important;
}

.warning-link {
    color: var(--warning) !important;
}

.success-link {
    color: #147D64 !important;
}

.appointment-quick-action {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin-top: 4px;
    text-decoration: none;
}

.appointment-action-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-height: 26px;
    border: 1px solid color-mix(in srgb, var(--event-color) 42%, transparent);
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    color: color-mix(in srgb, var(--event-color) 82%, #20313D);
    padding: 3px 9px;
    cursor: pointer;
    font: inherit;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.1;
    text-decoration: none;
}

.appointment-action-button:hover,
.appointment-action-button:focus-visible {
    outline: 0;
    background: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--event-color) 18%, transparent);
}

.appointment-action-short {
    display: none;
}

.appointment-card.is-short .appointment-quick-action {
    margin-top: 1px;
}

.appointment-card.is-short .appointment-action-button {
    min-height: 17px;
    padding: 1px 6px;
    font-size: 8px;
}

.appointment-card.is-short .appointment-action-full {
    display: none;
}

.appointment-card.is-short .appointment-action-short {
    display: inline;
}

.appointment-history {
    margin-top: 4px;
    color: #667785;
    font-size: 10px;
}

.appointment-card.is-short .appointment-history {
    display: none;
}

.appointment-history summary {
    cursor: pointer;
    font-weight: 900;
}

.appointment-history div {
    display: grid;
    gap: 3px;
    padding-top: 4px;
}

.appointment-history span {
    white-space: normal;
    line-height: 1.2;
}

.appointment-history small {
    color: #8796A5;
    font-family: var(--font-data);
}

.appointment-card.status-sin_confirmar {
    --event-color: #315E9E;
    --event-bg: #E3F2FF;
}

.appointment-card.status-confirmada,
.appointment-card.status-atendida {
    --event-color: #147D64;
    --event-bg: #DFF6EC;
}

.appointment-card.status-cancelada {
    --event-color: #B42318;
    --event-bg: #FDECEC;
    opacity: .88;
}

.appointment-card.status-no_asistio {
    --event-color: #B42318;
    --event-bg: #FDECEC;
}

.appointment-card.status-reprogramada {
    --event-color: #B7791F;
    --event-bg: #FFF3D8;
}

.appointment-card.status-en_sala {
    --event-color: #2F8F1D;
    --event-bg: #EAF9E7;
}

.appointment-card.status-en_atencion {
    --event-color: #0B7A86;
    --event-bg: #E6F6F7;
}

.agenda-modal {
    width: min(652px, calc(100vw - 32px));
    max-height: calc(100vh - 28px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.agenda-modal .modal-body {
    overflow-y: auto;
    padding-bottom: 16px;
}

.agenda-modal .actions {
    position: sticky;
    bottom: -16px;
    z-index: 2;
    margin: 4px -22px -16px;
    padding: 14px 22px 16px;
    border-top: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(255, 255, 255, .88), var(--surface) 34%);
}

.agenda-type-selector {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.agenda-type-selector label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-weight: 700;
    color: #2E3D48;
}

.agenda-modal select[multiple] {
    min-height: 86px;
}

.condition-tools {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.condition-tools form {
    width: min(280px, 100%);
}

.care-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.care-flow-step {
    min-height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    color: var(--muted);
    font-weight: 900;
}

.care-flow-step.active {
    border-color: var(--primary);
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.care-flow-step.complete {
    border-color: rgba(20, 125, 100, .32);
    background: #DFF6EC;
    color: #147D64;
}

.state-history {
    display: grid;
    gap: 8px;
}

.state-history div {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.state-history small {
    color: var(--muted);
    font-family: var(--font-data);
}

.conditions-table td {
    height: 70px;
}

.inline-form-row td,
.condition-edit-row td {
    background: var(--surface-soft);
}

.inline-edit-form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 176px auto auto;
    gap: 12px;
    align-items: center;
}

.category-inline-form {
    grid-template-columns: minmax(220px, 1fr) auto auto;
}

.category-create-form {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto auto;
    gap: 12px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    padding: 14px;
    background: var(--surface-soft);
}

.category-drawer {
    width: min(748px, 100vw);
}

.condition-state {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    border-radius: 5px;
    padding: 4px 9px;
    font-size: 12px;
    font-weight: 800;
    border: 1px solid transparent;
}

.condition-state.good {
    color: #0B5E4C;
    background: var(--success-soft);
    border-color: rgba(20, 125, 100, .24);
}

.condition-state.bad {
    color: var(--danger);
    background: var(--danger-soft);
    border-color: rgba(180, 35, 24, .24);
}

.muted-action {
    color: var(--muted);
}

.patient-page-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
}

.patient-page-head h2 {
    margin: 0;
    font-size: 26px;
    line-height: 1.2;
}

.patient-back {
    color: var(--ink);
    font-size: 28px;
}

.patient-wizard {
    padding: 28px;
}

.wizard-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 28px;
}

.wizard-step {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    background: transparent;
    color: var(--subtle);
    font-weight: 800;
    cursor: pointer;
    position: relative;
    padding: 0;
}

.wizard-step::after {
    content: "";
    height: 1px;
    background: var(--line);
    flex: 1;
}

.wizard-step span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid var(--line-strong);
    color: var(--subtle);
    background: var(--surface);
    font-weight: 800;
}

.wizard-step.active { color: var(--primary-dark); }
.wizard-step.active span { background: var(--primary); color: #fff; border-color: var(--primary); }
.wizard-step.complete { color: var(--primary); }
.wizard-step.complete span { color: var(--primary); border-color: var(--primary); background: var(--primary-soft); }

.wizard-panel {
    display: none;
    gap: 22px;
}

.wizard-panel.active {
    display: grid;
}

.wizard-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 28px;
    border-top: 1px solid var(--line);
    padding-top: 18px;
}

.wizard-tabs {
    display: inline-flex;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    overflow: hidden;
    width: max-content;
}

.wizard-tabs button {
    min-height: 40px;
    border: 0;
    border-right: 1px solid var(--line);
    background: var(--surface);
    padding: 0 18px;
    cursor: pointer;
    color: var(--ink);
}

.wizard-tabs button:last-child { border-right: 0; }
.wizard-tabs button.active { background: var(--primary-soft); color: var(--primary-dark); font-weight: 800; }

.segmented-control {
    min-height: 42px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid #C9D4DE;
    border-radius: var(--radius-control);
    overflow: hidden;
    background: #fff;
}

.segmented-control.compact {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    border: 0;
    background: transparent;
    min-height: auto;
    margin-bottom: 16px;
}

.segmented-control label {
    margin: 0;
    min-height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    font-weight: 700;
    border-right: 1px solid var(--line);
}

.segmented-control label:last-child { border-right: 0; }
.segmented-control.compact label { border-right: 0; justify-content: flex-start; }

.check-inline {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    font-weight: 700;
}

.clinical-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: 22px;
    align-items: start;
}

.clinical-block {
    box-shadow: none;
}

.clinical-question-list {
    display: grid;
}

.clinical-question {
    min-height: 68px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 180px;
    align-items: center;
    border-bottom: 1px solid var(--line);
    padding: 0 18px;
}

.clinical-question:last-child { border-bottom: 0; }
.clinical-question span { display: flex; gap: 16px; }
.clinical-question label { display: flex; align-items: center; gap: 7px; margin: 0; font-weight: 700; }

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 22px;
    margin: 16px 0;
}

.checkbox-grid.compact {
    grid-template-columns: 1fr;
    margin: 6px 0 0;
}

.checkbox-grid label {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    font-weight: 700;
}

.odontogram-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    flex-wrap: wrap;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: linear-gradient(180deg, var(--surface), var(--surface-soft));
    padding: 16px;
}

.odontogram-toolbar > div {
    min-width: 220px;
}

.odontogram-action-strip {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.icon-action {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--primary-dark);
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.icon-action:hover,
.icon-action.active {
    border-color: var(--primary);
    background: var(--primary-soft);
    box-shadow: var(--focus-ring);
    transform: translateY(-1px);
}

.odontogram-layout {
    display: grid;
    grid-template-columns: minmax(620px, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.odontogram-stage {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    overflow: hidden;
}

.odontogram-legend {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
    padding: 12px 16px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.odontogram-legend span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.legend-good { background: #2B6CB0; }
.legend-bad { background: #C7362F; }
.legend-missing { background: #8796A5; }

.odontogram-board {
    display: grid;
    gap: 28px;
    justify-content: center;
    padding: 24px 18px 32px;
    overflow-x: auto;
}

.tooth-row {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.tooth {
    width: 56px;
    min-height: 82px;
    position: relative;
    display: grid;
    gap: 7px;
    justify-items: center;
    border: 0;
    background: transparent;
    color: var(--ink);
    font-weight: 800;
    cursor: pointer;
    padding: 0;
}

.tooth-number {
    font-size: 13px;
    color: var(--muted);
    transition: color .16s ease;
}

.tooth-svg {
    width: 54px;
    height: 54px;
    filter: drop-shadow(0 4px 8px rgba(22, 38, 45, .08));
    transition: transform .16s ease, filter .16s ease;
}

.tooth-svg polygon,
.tooth-svg rect {
    fill: #FFFFFF;
    stroke: #7E8D99;
    stroke-width: 1.6;
    transition: fill .16s ease, stroke .16s ease, opacity .16s ease;
}

.tooth-svg .face-good {
    fill: #CFE8FF;
    stroke: #2B6CB0;
}

.tooth-svg .face-bad {
    fill: #FFD6D6;
    stroke: #C7362F;
}

.tooth-svg .missing-line {
    display: none;
    stroke: #768491;
    stroke-width: 5;
    stroke-linecap: round;
}

.tooth:hover .tooth-svg,
.tooth.selected .tooth-svg {
    transform: translateY(-1px);
    filter: drop-shadow(0 0 0 rgba(0, 0, 0, 0)) drop-shadow(0 8px 16px rgba(33, 108, 132, .16));
}

.tooth:hover .tooth-svg polygon,
.tooth:hover .tooth-svg rect,
.tooth.selected .tooth-svg polygon,
.tooth.selected .tooth-svg rect {
    stroke: var(--primary);
}

.tooth.selected .tooth-number,
.tooth-good .tooth-number { color: #2B6CB0; }
.tooth-bad .tooth-number { color: #B42318; }
.tooth-missing .tooth-number { color: #667785; }

.tooth-missing .tooth-svg polygon,
.tooth-missing .tooth-svg rect {
    fill: #F1F4F7;
    stroke: #9AA8B3;
    opacity: .55;
}

.tooth-missing .tooth-svg .missing-line {
    display: block;
}

.tooth-panel {
    position: sticky;
    top: 92px;
}

.tooth-panel-summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    padding: 12px 14px;
}

.tooth-panel-summary span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 800;
}

.tooth-panel-summary strong {
    font-size: 20px;
    color: var(--primary-dark);
}

.condition-preview {
    margin-top: 8px;
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    color: var(--muted);
    padding: 8px 10px;
    font-size: 13px;
    font-weight: 800;
}

.condition-preview.is-good {
    background: #EAF4FF;
    color: #2559A7;
}

.condition-preview.is-bad {
    background: #FFF1F1;
    color: #B42318;
}

.face-selector {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.face-chip {
    margin: 0;
}

.face-chip input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.face-chip span {
    min-height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--muted);
    font-weight: 900;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}

.face-chip input:checked + span {
    border-color: var(--primary);
    background: var(--primary-soft);
    color: var(--primary-dark);
    box-shadow: var(--focus-ring);
}

.odontogram-panel-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.odontogram-panel-actions .btn {
    flex: 1 1 auto;
}

.condition-state-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border-radius: 999px;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 900;
}

.condition-state-badge.is-good {
    background: #EAF4FF;
    color: #2559A7;
}

.condition-state-badge.is-bad {
    background: #FFF1F1;
    color: #B42318;
}

.condition-state-badge.is-missing {
    background: #F1F4F7;
    color: #667785;
}

.danger-link {
    color: #B42318;
}

.compact-table th,
.compact-table td {
    padding: 10px 12px;
}

.photo-step {
    min-height: 360px;
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 18px;
}

.patient-avatar-preview {
    width: 248px;
    height: 248px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #CDD2D6;
    background-size: cover;
    background-position: center;
}

.patient-avatar-preview span {
    width: 82px;
    height: 82px;
    border: 10px solid #fff;
    border-bottom: 0;
    border-radius: 50% 50% 0 0;
    position: relative;
}

.patient-avatar-preview span::before {
    content: "";
    width: 58px;
    height: 58px;
    position: absolute;
    left: 2px;
    top: -58px;
    border: 10px solid #fff;
    border-radius: 50%;
}

.patient-avatar-preview.has-photo span {
    display: none;
}

.patient-summary-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line);
}

.patient-summary-head img,
.patient-summary-avatar {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 auto;
}

.patient-summary-avatar {
    display: grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-weight: 800;
}

.patient-summary-head h2 {
    margin: 0 0 6px;
    font-size: 22px;
}

.patient-360-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.patient-360-context {
    color: var(--primary-dark);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.patient-360-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 14px;
    padding: 20px;
    border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line));
    border-radius: 12px;
    background:
        radial-gradient(circle at 88% 15%, rgba(68, 184, 194, .18), transparent 34%),
        linear-gradient(135deg, var(--surface), #F2FAF9);
    box-shadow: var(--shadow-soft);
}

.patient-360-identity {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.patient-360-identity img,
.patient-360-identity .patient-summary-avatar {
    width: 76px;
    height: 76px;
    border: 3px solid var(--surface);
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 6px 18px rgba(21, 33, 43, .12);
}

.patient-360-name-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.patient-360-name-line h2 { margin: 0; font-size: 25px; line-height: 1.15; }
.patient-360-identity p { margin: 7px 0 2px; color: var(--muted); font-size: 13px; }
.patient-360-identity > div > span { color: var(--subtle); font-size: 12px; }

.patient-360-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.patient-360-actions form { margin: 0; }
.patient-360-actions .btn { min-height: 38px; padding: 7px 11px; font-size: 13px; }

.patient-alert-banner,
.patient-clear-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #E5A39B;
    border-radius: 9px;
    background: #FFF2F0;
    color: #8A3027;
}

.patient-alert-banner > div:first-child { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.patient-alert-banner > div:first-child span { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: var(--danger); color: #fff; font-weight: 900; }
.patient-alert-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.patient-alert-chips span { padding: 3px 8px; border-radius: 999px; background: #fff; font-size: 12px; font-weight: 750; }
.patient-clear-banner { justify-content: flex-start; border-color: #BFE1D5; background: var(--success-soft); color: #0B5E4C; }
.patient-clear-banner span { color: #397262; font-size: 12px; }

.patient-360-metrics {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}

.patient-360-metrics article {
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    box-shadow: 0 3px 12px rgba(21, 33, 43, .035);
}

.patient-360-metrics span,
.patient-360-metrics small { display: block; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.patient-360-metrics article > span { min-height: 24px; overflow: visible; line-height: 1.15; white-space: normal; }
.patient-360-metrics strong { display: block; overflow: hidden; margin: 3px 0; color: var(--ink); font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.patient-mini-progress { height: 5px; overflow: hidden; margin-top: 7px; border-radius: 99px; background: var(--line); }
.patient-mini-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--primary), var(--secondary)); }

.patient-360-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.75fr) minmax(290px, .75fr);
    align-items: start;
    gap: 14px;
}

.patient-360-main,
.patient-360-side { display: grid; gap: 14px; }

.patient-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.patient-panel-title > div { display: grid; gap: 2px; }
.patient-panel-title > div span { color: var(--muted); font-size: 11px; font-weight: 500; }
.patient-panel-title > span:not(.patient-tone) { display: grid; place-items: center; min-width: 28px; height: 25px; padding: 0 8px; border-radius: 999px; background: var(--primary-soft); color: var(--primary-dark); font-size: 12px; }

.patient-tone { padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 850; }
.patient-tone.is-success { background: var(--success-soft); color: var(--success); }
.patient-tone.is-primary { background: var(--primary-soft); color: var(--primary-dark); }
.patient-tone.is-warning { background: var(--warning-soft); color: var(--warning); }
.patient-tone.is-info { background: var(--info-soft); color: var(--info); }

.patient-appointment-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 18px;
}

.patient-appointment-grid div { display: grid; gap: 3px; }
.patient-appointment-grid span { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.patient-appointment-grid strong { font-size: 13px; }

.patient-empty-action { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.patient-empty-action span { flex: 1; min-width: 180px; color: var(--muted); font-size: 12px; }

.patient-plan-summary { display: grid; grid-template-columns: 108px 1fr; align-items: center; gap: 20px; }
.patient-progress-ring { --progress: 0; display: grid; place-content: center; width: 100px; height: 100px; border-radius: 50%; background: radial-gradient(circle at center, var(--surface) 58%, transparent 60%), conic-gradient(var(--primary) calc(var(--progress) * 1%), var(--line) 0); text-align: center; }
.patient-progress-ring strong { font-size: 20px; }
.patient-progress-ring span { color: var(--muted); font-size: 9px; }
.patient-plan-numbers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.patient-plan-numbers span { padding: 10px; border-radius: 8px; background: var(--surface-soft); }
.patient-plan-numbers small,.patient-plan-numbers strong { display: block; }
.patient-plan-numbers small { color: var(--muted); font-size: 10px; }
.patient-plan-numbers strong { margin-top: 3px; font-size: 16px; }

.patient-procedure-list article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
}

.patient-procedure-list article:last-child { border-bottom: 0; }
.patient-procedure-list article > div { min-width: 0; }
.patient-procedure-list article > div strong,.patient-procedure-list article > div small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.patient-procedure-list article > div small { color: var(--muted); font-size: 10px; }
.patient-procedure-value { text-align: right; }
.patient-procedure-value strong { font-size: 13px; }
.patient-panel-footer { padding: 8px 14px; border-top: 1px solid var(--line); background: var(--surface-soft); color: var(--muted); font-size: 10px; }

.patient-document-summary { display: grid; gap: 8px; }
.patient-consent-state { display: grid; grid-template-columns: 29px 1fr; gap: 8px; padding: 9px; border-radius: 8px; background: var(--warning-soft); color: #7C5010; }
.patient-consent-state > span { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: var(--warning); color: #fff; font-weight: 900; }
.patient-consent-state strong,.patient-consent-state small { display: block; }
.patient-consent-state small { margin-top: 2px; opacity: .8; font-size: 10px; }
.patient-consent-state.is-registrado { background: var(--success-soft); color: #0B5E4C; }
.patient-consent-state.is-registrado > span { background: var(--success); }
.patient-document-row { display: flex; justify-content: space-between; gap: 8px; padding: 7px 2px; border-bottom: 1px solid var(--line); font-size: 11px; }
.patient-document-row small { color: var(--muted); }

.patient-reminder-timeline { display: grid; gap: 0; }
.patient-reminder-timeline article { display: grid; grid-template-columns: 12px 1fr; gap: 8px; position: relative; padding: 2px 0 12px; }
.patient-reminder-timeline article:not(:last-child)::before { content: ""; position: absolute; left: 4px; top: 12px; bottom: 0; width: 1px; background: var(--line); }
.patient-reminder-timeline i { z-index: 1; width: 9px; height: 9px; margin-top: 4px; border: 2px solid var(--surface); border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 1px var(--primary); }
.patient-reminder-timeline strong,.patient-reminder-timeline span,.patient-reminder-timeline small { display: block; }
.patient-reminder-timeline strong { font-size: 11px; }
.patient-reminder-timeline span,.patient-reminder-timeline small { color: var(--muted); font-size: 10px; }

.patient-secondary-details > summary,
.patient-clinical-details > summary { cursor: pointer; list-style: none; }
.patient-secondary-details > summary::-webkit-details-marker,
.patient-clinical-details > summary::-webkit-details-marker { display: none; }
.patient-secondary-details > summary::after,
.patient-clinical-details > summary::after { content: "+"; float: right; color: var(--primary); }
.patient-secondary-details[open] > summary::after,
.patient-clinical-details[open] > summary::after { content: "−"; }
.patient-secondary-details p { margin: 0 0 8px; font-size: 12px; }
.patient-clinical-details { margin-top: 14px; }

@media (max-width: 1180px) {
    .patient-360-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .patient-360-layout { grid-template-columns: minmax(0, 1fr); }
    .patient-360-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .patient-secondary-details { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    .patient-360-hero { align-items: stretch; flex-direction: column; padding: 15px; }
    .patient-360-actions { justify-content: flex-start; }
    .patient-360-actions .btn,.patient-360-actions form { flex: 1 1 calc(50% - 5px); }
    .patient-360-actions form .btn { width: 100%; }
    .patient-alert-banner,.patient-clear-banner { align-items: flex-start; flex-direction: column; }
    .patient-alert-chips { justify-content: flex-start; }
    .patient-360-metrics { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(138px, 43vw); grid-template-columns: none; overflow-x: auto; padding-bottom: 5px; scroll-snap-type: x proximity; }
    .patient-360-metrics article { scroll-snap-align: start; }
    .patient-appointment-grid,.patient-plan-numbers,.patient-360-side { grid-template-columns: 1fr; }
    .patient-plan-summary { grid-template-columns: 82px 1fr; gap: 12px; }
    .patient-progress-ring { width: 78px; height: 78px; }
    .patient-plan-numbers { display: flex; overflow-x: auto; }
    .patient-plan-numbers span { min-width: 105px; }
    .patient-procedure-list article { grid-template-columns: auto minmax(0, 1fr); }
    .patient-procedure-value { grid-column: 2; text-align: left; }
    .patient-clinical-details .grid-2 { grid-template-columns: 1fr; }
}

/* Accounting settings: keep each catalog record readable inside the nested settings layout. */
.accounting-settings-list form {
    grid-template-columns: 12px minmax(120px,1.25fr) minmax(90px,.85fr) minmax(100px,.85fr) 72px;
    align-items: end;
}
.accounting-settings-list form > .settings-record-state { grid-row: 1 / span 2; align-self: center; margin: 0; }
.accounting-settings-list form > .check-field:nth-of-type(5) { grid-column: 2; }
.accounting-settings-list form > .btn { align-self: center; justify-self: end; }
.accounting-settings-list.categories form { grid-template-columns: 42px minmax(150px,1.4fr) minmax(110px,1fr) 80px; }
.accounting-settings-list.categories form > .check-field { grid-column: 2; }
.accounting-settings-list.categories form > .btn { grid-column: 4; grid-row: 2; }

@media (max-width: 1050px) {
    .accounting-settings-list form,.accounting-settings-list.categories form { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .accounting-settings-list form > * { grid-column: auto!important; grid-row: auto!important; }
}

@media (max-width: 700px) {
    .accounting-settings-list form,.accounting-settings-list.categories form { grid-template-columns: 1fr; }
}

/* Digital consent and signatures */
.consent-workspace { display:grid; gap:16px; color:#172a34; }
.consent-workspace-hero { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:21px 24px; border:1px solid #d7e3e6; border-radius:15px; background:linear-gradient(120deg,#fff,#f0f8f8); }
.consent-workspace-hero>div:first-child>span,.consent-sign-card header span,.consent-delivery-card header span { color:#0e7c82; font-size:10px; font-weight:850; letter-spacing:.12em; }
.consent-workspace-hero h2 { margin:4px 0; font-size:25px; }.consent-workspace-hero p { margin:0; color:#65737e; }.consent-hero-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.consent-state { padding:7px 10px; border-radius:999px; color:#875818; background:#fff2d7; font-size:11px; font-style:normal; font-weight:800; }.consent-state.is-cerrado { color:#08705b; background:#e2f5ee; }.consent-state.is-reemplazado { color:#697781; background:#edf1f2; }
.consent-integrity { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:13px 16px; border:1px solid #b9ded1; border-radius:12px; background:#eff9f5; }.consent-integrity>div { display:flex; align-items:center; gap:10px; }.consent-integrity>div>span { display:grid; width:31px; height:31px; place-items:center; border-radius:50%; color:#fff; background:#16866b; font-weight:900; }.consent-integrity>div>div { display:grid; }.consent-integrity small { color:#62736e; }.consent-integrity code { max-width:42%; overflow:hidden; color:#1e6c5c; font-size:10px; text-overflow:ellipsis; }.consent-integrity.is-invalid { border-color:#efc0bc; background:#fff1ef; }.consent-integrity.is-invalid>div>span { background:#be4239; }
.consent-alert { display:grid; gap:3px; padding:12px 15px; border-radius:10px; color:#8b5513; background:#fff4da; }.consent-alert.is-danger { color:#963730; background:#feefed; }.consent-alert span { font-size:12px; }
.consent-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr); gap:18px; align-items:start; }
.consent-document { padding:32px; border:1px solid #d9e2e5; border-radius:15px; background:#fff; box-shadow:0 12px 35px rgba(21,48,60,.06); }.consent-document-heading { display:flex; justify-content:space-between; align-items:start; padding-bottom:18px; border-bottom:2px solid #123f4b; }.consent-document-heading span { color:#0c7a80; font-size:12px; font-weight:800; }.consent-document-heading h3 { margin:4px 0 0; font-size:27px; }.consent-document-heading>b { display:grid; width:42px; height:42px; place-items:center; border-radius:50%; color:#fff; background:#123f4b; }
.consent-parties { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin:19px 0; }.consent-parties>div { display:grid; gap:3px; padding:13px; border-radius:9px; background:#f4f8f9; }.consent-parties span { color:#6c7b84; font-size:10px; font-weight:800; text-transform:uppercase; }.consent-parties small { color:#72808a; }
.consent-procedures { margin:20px 0; }.consent-procedures h4,.consent-section h4,.consent-declaration strong { margin:0 0 9px; }.consent-procedures article { display:flex; gap:10px; align-items:center; padding:9px 0; border-top:1px solid #e7edef; }.consent-procedures article>span { flex:0 0 auto; padding:4px 7px; border-radius:5px; color:#08737a; background:#e8f6f6; font-size:10px; font-weight:800; }.consent-procedures article>div { display:grid; }.consent-procedures article small { color:#70808a; }
.consent-section { display:grid; grid-template-columns:42px 1fr; gap:13px; margin-top:24px; padding-top:22px; border-top:1px solid #dfe7e9; }.consent-section-number { display:grid; width:36px; height:36px; place-items:center; border-radius:9px; color:#fff; background:#0d7c82; font-size:12px; font-weight:900; }.consent-section p { margin:0 0 13px; color:#43535d; line-height:1.65; }.consent-info-line { display:grid; gap:3px; margin-top:8px; padding:10px 12px; border-left:3px solid #3c9182; background:#f3f9f7; }.consent-info-line.is-risk { border-color:#d17a45; background:#fff8f2; }.consent-info-line b { font-size:11px; }.consent-info-line span { color:#53636d; font-size:12px; line-height:1.5; }
.consent-declaration { margin-top:24px; padding:16px 18px; border:1px solid #bdd9dc; border-radius:10px; background:#f2f9f9; }.consent-declaration p { margin:0; color:#3c535c; line-height:1.6; }
.consent-seal { display:grid; gap:5px; margin-top:22px; padding:15px; border:2px solid #163f4a; border-radius:9px; }.consent-seal span { font-size:10px; font-weight:900; letter-spacing:.13em; }.consent-seal strong { overflow-wrap:anywhere; font-family:var(--font-data); font-size:11px; }.consent-seal small { color:#66757f; }
.consent-signing-column { display:grid; gap:14px; position:sticky; top:16px; }.consent-sign-card,.consent-delivery-card { overflow:hidden; border:1px solid #d8e3e6; border-radius:14px; background:#fff; box-shadow:0 8px 25px rgba(21,48,60,.05); }.consent-sign-card>header,.consent-delivery-card>header { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid #e4ecee; }.consent-sign-card h3,.consent-delivery-card h3 { margin:3px 0 0; font-size:16px; }.consent-sign-card header i { padding:5px 8px; border-radius:999px; color:#9a641d; background:#fff3dc; font-size:10px; font-style:normal; font-weight:800; }.consent-sign-card.is-signed header i { color:#08705b; background:#e4f5ef; }.consent-sign-card form { display:grid; gap:11px; padding:15px; }.consent-sign-card label { display:grid; gap:5px; color:#576671; font-size:11px; font-weight:750; }
.signature-pad { position:relative; overflow:hidden; border:1.5px dashed #90b7bc; border-radius:10px; background:repeating-linear-gradient(0deg,#fff,#fff 30px,#f4f8f8 31px); }.signature-pad canvas { display:block; width:100%; height:150px; touch-action:none; cursor:crosshair; }.signature-pad>span { position:absolute; right:10px; bottom:7px; color:#87979f; font-size:9px; pointer-events:none; }.signature-pad.is-required { border-color:#c53e35; box-shadow:0 0 0 3px rgba(197,62,53,.12); }.signature-clear { justify-self:end; margin-top:-6px; border:0; color:#08757c; background:none; font-size:11px; font-weight:750; cursor:pointer; }
.consent-check { display:flex!important; grid-template-columns:none!important; align-items:flex-start; gap:8px!important; padding:10px; border-radius:8px; background:#f4f8f9; line-height:1.4; }.consent-check input { width:auto; margin-top:2px; }
.consent-signed-block { display:grid; gap:5px; padding:15px; }.consent-signed-block img { width:100%; height:105px; object-fit:contain; border-bottom:1px solid #ccd8db; }.consent-signed-block span,.consent-signed-block small { color:#677681; }.consent-signed-block small { overflow-wrap:anywhere; font-size:9px; }
.consent-delivery-card { padding-bottom:14px; }.consent-delivery-card>p { margin:13px 15px; color:#64737d; font-size:12px; }.consent-delivery-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0 14px; }.consent-delivery-actions form,.consent-delivery-actions .btn { width:100%; }.consent-delivery-history { display:grid; gap:4px; margin:13px 14px 0; padding-top:10px; border-top:1px solid #e1e9eb; }.consent-delivery-history span { color:#64737d; font-size:10px; }
.plan-version-record { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }.plan-version-record>form { display:inline-flex; }.plan-consent-link,.plan-consent-create { display:inline-flex; padding:4px 7px; border:1px solid #b9d9db; border-radius:5px; color:#08757c; background:#eff8f8; font-size:9px; font-weight:800; text-decoration:none; }.plan-consent-link.is-cerrado { color:#08705b; border-color:#add9c9; background:#eaf7f2; }.plan-consent-link.is-reemplazado { color:#707b82; border-color:#d4dcdf; background:#f3f5f6; }.plan-consent-create { cursor:pointer; }
.patient-digital-consent { color:inherit; text-decoration:none; }.patient-digital-consent:hover { color:#08757c; }
.consent-template-settings { display:grid; gap:16px; }.consent-template-list { display:grid; gap:11px; }.consent-template-list details>summary { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:15px 17px; cursor:pointer; list-style:none; }.consent-template-list summary>div { display:flex; align-items:center; gap:11px; min-width:0; }.consent-template-list summary i { width:10px; height:38px; border-radius:5px; background:var(--template-tone); }.consent-template-list summary span { display:grid; min-width:0; }.consent-template-list summary small { color:#71808a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.consent-template-list summary>b { color:#687780; font-size:10px; white-space:nowrap; }.consent-template-list details>form { display:grid; gap:14px; padding:17px; border-top:1px solid #e3ebed; }.consent-template-list label { display:grid; gap:5px; color:#596873; font-size:11px; font-weight:750; }.consent-template-list footer { display:flex; justify-content:space-between; align-items:center; gap:15px; }.consent-template-list footer span { color:#6b7983; font-size:10px; }

.consent-portal-body { margin:0; color:#172a34; background:#eef3f4; font-family:var(--font-ui); }.consent-portal-top { display:flex; justify-content:space-between; align-items:center; padding:13px max(20px,calc((100vw - 960px)/2)); color:#fff; background:#123f4b; }.consent-portal-top>div { display:flex; align-items:center; gap:10px; }.consent-portal-top>div>span { display:grid; width:34px; height:34px; place-items:center; border-radius:8px; background:#216271; font-weight:900; }.consent-portal-top>div>div { display:grid; }.consent-portal-top small { color:#bcd6da; }.consent-portal-top button { border:1px solid #8cb4ba; border-radius:7px; padding:9px 12px; color:#fff; background:transparent; cursor:pointer; }.consent-portal-document { width:min(900px,calc(100% - 28px)); margin:22px auto; padding:38px 48px; border-radius:12px; background:#fff; box-shadow:0 18px 55px rgba(19,52,65,.12); }.consent-portal-status { display:flex; justify-content:space-between; gap:20px; align-items:center; margin:-10px 0 30px; padding:12px 14px; border-radius:8px; color:#12624f; background:#eaf7f2; }.consent-portal-status>div { display:grid; }.consent-portal-status span { font-size:11px; }.consent-portal-status i { font-size:11px; font-style:normal; }.consent-portal-status.is-invalid { color:#9b3932; background:#feefed; }.consent-portal-heading { padding-bottom:20px; border-bottom:2px solid #153e49; }.consent-portal-heading>span { color:#0c7a80; font-size:10px; font-weight:900; letter-spacing:.15em; }.consent-portal-heading h1 { margin:6px 0; font-size:30px; }.consent-portal-heading p { margin:0; color:#5f7079; }.consent-portal-procedures { margin:20px 0; }.consent-portal-procedures h2,.consent-portal-section h2,.consent-portal-declaration h2 { font-size:16px; }.consent-portal-procedures>div { display:flex; gap:10px; padding:8px 0; border-top:1px solid #e4eaec; }.consent-portal-procedures b { min-width:75px; color:#08757c; }.consent-portal-section { display:grid; grid-template-columns:38px 1fr; gap:13px; padding:21px 0; border-top:1px solid #dfe7e9; }.consent-portal-section>span { display:grid; width:34px; height:34px; place-items:center; border-radius:8px; color:#fff; background:#0e7b81; font-size:11px; font-weight:900; }.consent-portal-section h2 { margin:0 0 7px; }.consent-portal-section p,.consent-portal-section dd,.consent-portal-declaration p { color:#43545d; line-height:1.6; }.consent-portal-section dl { margin:12px 0 0; }.consent-portal-section dt { margin-top:8px; font-size:11px; font-weight:850; }.consent-portal-section dd { margin:2px 0 0; font-size:12px; }.consent-portal-declaration { padding:15px; border-radius:8px; background:#f1f8f8; }.consent-portal-signatures { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:25px; }.consent-portal-signatures article { display:grid; gap:4px; padding:14px; border:1px solid #dbe5e7; border-radius:8px; }.consent-portal-signatures article>span { color:#6b7983; font-size:10px; font-weight:800; text-transform:uppercase; }.consent-portal-signatures img { width:100%; height:100px; object-fit:contain; border-bottom:1px solid #cbd7da; }.consent-portal-signatures small { color:#64737d; }.consent-portal-signatures code { overflow:hidden; color:#6b7983; font-size:8px; text-overflow:ellipsis; }.consent-portal-seal { margin-top:24px; padding-top:17px; border-top:2px solid #153e49; }.consent-portal-seal>div { display:grid; gap:4px; }.consent-portal-seal span { font-size:9px; font-weight:900; letter-spacing:.12em; }.consent-portal-seal strong { overflow-wrap:anywhere; font-family:var(--font-data); font-size:10px; }.consent-portal-seal p { color:#687780; font-size:10px; }

@media (max-width:1000px) { .consent-layout { grid-template-columns:1fr; }.consent-signing-column { position:static; grid-template-columns:1fr 1fr; }.consent-delivery-card { grid-column:1/-1; } }
@media (max-width:700px) { .consent-workspace-hero,.consent-integrity { align-items:flex-start; flex-direction:column; }.consent-integrity code { max-width:100%; }.consent-layout,.consent-signing-column { display:grid; grid-template-columns:1fr; }.consent-document { padding:20px 16px; }.consent-parties,.consent-delivery-actions,.consent-portal-signatures { grid-template-columns:1fr; }.consent-section { grid-template-columns:34px 1fr; }.consent-delivery-card { grid-column:auto; }.consent-template-list details>summary,.consent-template-list footer { align-items:flex-start; flex-direction:column; }.consent-portal-top { align-items:flex-start; gap:10px; }.consent-portal-top button { font-size:10px; }.consent-portal-document { width:calc(100% - 18px); margin:9px auto; padding:24px 17px; }.consent-portal-heading h1 { font-size:24px; }.consent-portal-status { align-items:flex-start; flex-direction:column; } }
@media print { .consent-portal-body { background:#fff; }.consent-portal-top { display:none; }.consent-portal-document { width:100%; margin:0; padding:0; box-shadow:none; }.consent-portal-status { border:1px solid #b9ded1; }.consent-portal-section,.consent-portal-signatures { break-inside:avoid; } }

@media (max-width: 440px) {
    .patient-360-identity { align-items: flex-start; }
    .patient-360-identity img,.patient-360-identity .patient-summary-avatar { width: 58px; height: 58px; }
    .patient-360-name-line h2 { font-size: 20px; }
    .patient-360-actions .btn,.patient-360-actions form { flex-basis: 100%; }
}

.modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(12, 18, 22, .52);
    align-items: flex-start;
    justify-content: center;
    padding-top: 44px;
    z-index: 50;
}

.modal-backdrop.open { display: flex; }

#appointmentModalBackdrop.open {
    align-items: center;
    padding: 14px;
}

.modal {
    width: min(492px, calc(100vw - 32px));
    background: #fff;
    border-radius: var(--radius-panel);
    box-shadow: var(--shadow-float);
    overflow: hidden;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px;
    border-bottom: 1px solid var(--line);
    font-size: 20px;
    font-weight: 800;
}

.modal-body { padding: 24px 22px 30px; display: grid; gap: 22px; }

.link-button {
    background: none;
    border: 0;
    padding: 0;
    color: var(--primary-dark);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.link-button:hover { color: var(--accent); }

.drawer-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(12, 18, 22, .42);
    justify-content: flex-end;
}

.drawer-backdrop.open { display: flex; }

.side-drawer {
    width: min(520px, 100vw);
    height: 100vh;
    background: var(--surface);
    color: var(--ink);
    box-shadow: var(--shadow-float);
    display: grid;
    grid-template-rows: auto 1fr auto;
    overflow: hidden;
}

.permissions-drawer { width: min(724px, 100vw); }

.drawer-header {
    min-height: 72px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--line);
    background: var(--surface);
}

.drawer-header h2 {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 800;
}

.drawer-header-split { justify-content: space-between; }
.drawer-header-split > div { display: flex; align-items: center; gap: 16px; }
.drawer-close { color: var(--subtle); font-size: 22px; line-height: 1; }

.drawer-body {
    padding: 22px;
    overflow: auto;
    display: grid;
    gap: 22px;
}

.drawer-footer {
    padding: 16px 22px;
    border-top: 1px solid var(--line);
    background: var(--surface);
}

.drawer-footer .btn { width: 100%; }
.drawer-section-title { margin: 0 0 12px; font-size: 16px; }

.user-day-list {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface-soft);
    max-height: 520px;
    overflow: auto;
    padding: 14px;
}

.user-day-row {
    border-bottom: 1px solid var(--line);
    padding: 14px 0;
}

.user-day-row:first-child { padding-top: 0; }
.user-day-row:last-child { border-bottom: 0; padding-bottom: 0; }
.user-block-row { grid-template-columns: 1fr auto 1fr auto; max-width: none; }

.help-link { color: var(--primary); font-weight: 800; }
.permissions-title { margin: 0 0 4px; font-size: 22px; line-height: 1.25; }

.permission-custom-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 18px;
    border: 1px solid transparent;
    border-radius: var(--radius-panel);
    background: var(--surface-soft);
    margin: 0;
}

.permission-custom-card strong { display: block; color: var(--ink); margin-bottom: 3px; }
.permission-custom-card small { display: block; color: var(--muted); font-size: 13px; font-weight: 500; }

.permissions-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    overflow: hidden;
    background: var(--surface);
}

.permissions-panel.is-disabled { opacity: .72; }
.permission-group { border-bottom: 1px solid var(--line); }
.permission-group:last-child { border-bottom: 0; }

.permission-group-header {
    min-height: 54px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 0 18px;
    background: var(--surface-soft);
    color: #485762;
}

.permission-collapse {
    width: 28px;
    min-height: 28px;
    border: 0;
    background: transparent;
    color: var(--subtle);
    cursor: pointer;
}

.permission-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--muted);
    font-weight: 700;
}

.permission-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 28px;
    padding: 18px;
}

.permission-check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: #65727F;
    font-weight: 600;
}

.permission-check-row input:checked + span { color: #334957; }
.permission-group.collapsed .permission-options { display: none; }

.odontogram-token {
    width: 44px;
    height: 52px;
    border: 2px solid #8EA0AD;
    border-radius: 5px;
    background: linear-gradient(135deg, #fff, #F2F6F8);
}

.advanced-patient-strip { margin-bottom: 18px; }

.advanced-clinic-page .content {
    padding-top: 16px;
}

.advanced-clinic-page .content > .status {
    padding: 7px 10px;
    margin-bottom: 10px;
    font-size: 12px;
}

.advanced-clinic-page .advanced-clinic-toolbar {
    min-height: 64px;
    margin-bottom: 10px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}

.advanced-clinic-context {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.advanced-clinic-page .advanced-clinic-avatar {
    width: 42px;
    height: 42px;
}

.advanced-clinic-identity {
    min-width: 0;
}

.advanced-clinic-eyebrow {
    display: block;
    color: var(--primary-dark);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.advanced-clinic-identity h2 {
    margin: 1px 0 0;
    overflow: hidden;
    font-size: 19px;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.advanced-clinic-identity p {
    margin: 2px 0 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
}

.advanced-clinic-page .advanced-clinic-toolbar .btn {
    min-height: 36px;
    padding: 7px 11px;
    font-size: 12px;
}

.advanced-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 18px 0;
}

.advanced-clinic-page .advanced-tabs-shell {
    position: sticky;
    top: 78px;
    z-index: 18;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 10px 0;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: color-mix(in srgb, var(--surface) 95%, transparent);
    box-shadow: 0 5px 14px rgba(21, 33, 43, .07);
}

.advanced-clinic-page .advanced-tabs {
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    scrollbar-width: thin;
}

.advanced-tabs-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    padding-left: 8px;
    border-left: 1px solid var(--line);
}

.advanced-tabs-actions[hidden] { display: none; }

.advanced-clinic-page .advanced-tabs-actions .btn {
    min-height: 36px;
    padding: 7px 11px;
    white-space: nowrap;
}

.advanced-clinic-page .advanced-tabs button {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 7px 12px;
    white-space: nowrap;
}

.advanced-tabs button {
    min-height: 42px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--muted);
    padding: 9px 14px;
    cursor: pointer;
    font-weight: 800;
    transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.advanced-tabs button:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.advanced-tabs button.active {
    background: var(--primary-soft);
    border-color: rgba(11, 122, 134, .38);
    color: var(--primary-dark);
    box-shadow: inset 0 0 0 1px rgba(11, 122, 134, .18);
}

.advanced-tab-panel { display: none; }
.advanced-tab-panel.active { display: block; }

.advanced-clinic-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: start;
}

.odontogram-workspace {
    grid-template-columns: minmax(0, 1fr);
}

.advanced-panel-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.advanced-clinic-page [data-advanced-panel="odontograma"] > form > .odontogram-workspace > .panel > .panel-header {
    padding: 11px 14px;
}

.advanced-clinic-page [data-advanced-panel="odontograma"] > form > .odontogram-workspace > .panel > .panel-body {
    padding: 14px;
}

.advanced-panel-title span {
    display: block;
    color: var(--muted);
    font-size: 13px;
    font-weight: 600;
    margin-top: 2px;
}

.advanced-controls {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.advanced-clinic-page .advanced-controls {
    gap: 8px;
    margin-bottom: 10px;
}

.advanced-clinic-page .advanced-controls label {
    min-width: 200px;
}

.advanced-clinic-page .advanced-controls .btn {
    min-height: 38px;
    padding: 7px 11px;
}

.advanced-clinic-page [data-undo-finding]:disabled {
    display: none;
}

.advanced-controls label {
    min-width: 240px;
    margin: 0;
}

.advanced-odontogram-meta {
    margin: -4px 0 14px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.advanced-controls .btn.active {
    background: var(--warning-soft);
    border-color: #F1B84A;
    color: #7A4A00;
}

.advanced-odontogram {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
    justify-content: stretch;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: linear-gradient(180deg, #FFFFFF, #FAFCFC);
    overflow-x: auto;
    margin-bottom: 18px;
}

.advanced-clinic-page .advanced-odontogram {
    gap: 14px;
    padding: 14px;
    margin-bottom: 0;
}

.arch-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) clamp(48px, 5.5vw, 88px) minmax(0, 1fr);
    gap: 0;
    align-items: start;
}

.arch-row[hidden] {
    display: none !important;
}

.arch-group {
    display: grid;
    grid-template-columns: repeat(8, minmax(38px, 1fr));
    gap: clamp(6px, .85vw, 18px);
    width: 100%;
    min-width: 0;
}

.arch-group--deciduous {
    grid-template-columns: repeat(5, minmax(34px, 1fr));
    width: min(100%, 340px);
    justify-self: center;
}

.arch-gap {
    min-height: 1px;
    width: clamp(48px, 5.5vw, 88px);
    pointer-events: none;
}

.advanced-tooth {
    display: grid;
    justify-items: center;
    min-width: 0;
}

.advanced-tooth-button {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 5px;
    width: clamp(40px, 4vw, 58px);
    min-height: clamp(62px, 5.2vw, 78px);
    border: 0;
    background: transparent;
    color: var(--ink);
    padding: 0;
    cursor: pointer;
}

.advanced-tooth-button--deciduous {
    width: clamp(36px, 3.4vw, 50px);
    min-height: clamp(56px, 4.6vw, 70px);
}

.advanced-tooth-button:focus-visible {
    outline: none;
    border-radius: var(--radius-control);
    box-shadow: var(--focus-ring);
}

.tooth-number {
    display: block;
    font-size: clamp(11px, .9vw, 13px);
    font-weight: 800;
    line-height: 1;
}

.advanced-tooth--deciduous .tooth-number {
    font-size: clamp(10px, .82vw, 12px);
}

.advanced-tooth-svg {
    width: clamp(38px, 3.8vw, 56px);
    height: clamp(38px, 3.8vw, 56px);
    overflow: visible;
}

.advanced-tooth-svg--deciduous {
    width: clamp(34px, 3.2vw, 46px);
    height: clamp(34px, 3.2vw, 46px);
}

.tooth-face {
    fill: #FFFFFF;
    stroke: #7E8B94;
    stroke-width: 1.6;
    transition: fill .14s ease, stroke .14s ease, transform .14s ease;
    vector-effect: non-scaling-stroke;
}

.tooth-root-face {
    display: none;
    stroke-width: 1.35;
}

.advanced-tooth-button.has-root-surface .tooth-root-face {
    display: inline;
}

.tooth-face:hover {
    fill: var(--primary-soft);
    stroke: var(--primary);
}

.face-red { fill: #FDECEC; stroke: #E5484D; }
.face-blue { fill: #EAF1FB; stroke: #3C78C2; }
.face-green { fill: #E7F7F1; stroke: #15946F; }
.face-gray { fill: #E8ECEF; stroke: #7A8792; }
.face-amber { fill: #FFF7E6; stroke: #C7831F; }
.face-purple { fill: #F4EDFE; stroke: #7E56D8; }

.tooth-overlay {
    display: none;
    fill: none;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}

.overlay-crown,
.overlay-retained,
.overlay-presence-dot {
    stroke-width: 2.1;
}

.overlay-bridge,
.overlay-bridge-lower {
    stroke-width: 3.2;
}

.overlay-cross {
    stroke-width: 3.6;
}

.overlay-endo-main {
    stroke-width: 3;
}

.overlay-endo-side-a,
.overlay-endo-side-b,
.overlay-abutment,
.overlay-fracture,
.overlay-implant,
.overlay-removable,
.overlay-ortho,
.overlay-eruption-arrow,
.overlay-exfoliation-wave,
.overlay-presence-check {
    stroke-width: 2.3;
}

.overlay-lesion {
    stroke-width: 2.2;
    fill: rgba(229, 72, 77, .10);
}

.overlay-note-badge {
    fill: #FFF4D7;
    stroke: #C7831F;
    stroke-width: 1.4;
}

.overlay-presence-dot {
    fill: rgba(21, 148, 111, .14);
}

.overlay-note-text,
.overlay-mobility-text,
.overlay-sealant {
    display: none;
    font-weight: 900;
    text-anchor: middle;
}

.overlay-note-text,
.overlay-mobility-text {
    font-size: 10px;
}

.overlay-note-text {
    fill: #7A4A00;
}

.overlay-mobility-text {
    fill: #A4600E;
}

.overlay-sealant {
    font-size: 15px;
    dominant-baseline: middle;
    pointer-events: none;
    fill: #E5484D;
    stroke: rgba(255, 255, 255, .9);
    stroke-width: 1.15;
    paint-order: stroke fill;
}

.advanced-tooth-button.has-missing .overlay-cross,
.advanced-tooth-button.has-extraction .overlay-cross {
    display: block;
}

.advanced-tooth-button.has-missing .overlay-cross {
    stroke: var(--overlay-missing-color, #6B7781);
}

.advanced-tooth-button.has-extraction .overlay-cross {
    stroke: var(--overlay-extraction-color, #E5484D);
}

.advanced-tooth-button.has-crown .overlay-crown,
.advanced-tooth-button.bridge-start .overlay-crown,
.advanced-tooth-button.bridge-end .overlay-crown,
.advanced-tooth-button.bridge-body .overlay-crown,
.advanced-tooth-button.has-presence .overlay-crown {
    display: block;
    stroke: var(--overlay-crown-color, #3C78C2);
}

.advanced-tooth-button.bridge-body .overlay-crown {
    opacity: .55;
    stroke-dasharray: 3 2;
}

.advanced-tooth-button.has-bridge .overlay-bridge,
.advanced-tooth-button.has-bridge .overlay-bridge-lower {
    display: block;
    stroke: var(--overlay-bridge-color, #7E56D8);
}

.advanced-tooth-button.has-bridge .overlay-bridge-lower {
    opacity: .65;
}

.advanced-tooth-button.has-endo .overlay-endo-main,
.advanced-tooth-button.has-endo .overlay-endo-side-a,
.advanced-tooth-button.has-endo .overlay-endo-side-b {
    display: block;
    stroke: var(--overlay-endo-color, #3C78C2);
}

.advanced-tooth-button.has-implant .overlay-implant {
    display: block;
    stroke: var(--overlay-implant-color, #3C78C2);
}

.advanced-tooth-button.has-fracture .overlay-fracture {
    display: block;
    stroke: var(--overlay-fracture-color, #E5484D);
}

.advanced-tooth-button.has-lesion .overlay-lesion {
    display: block;
    stroke: var(--overlay-lesion-color, #C7831F);
}

.advanced-tooth-button.has-retained .overlay-retained {
    display: block;
    stroke: var(--overlay-retained-color, #7E56D8);
    stroke-dasharray: 4 3;
}

.advanced-tooth-button.has-eruption .overlay-crown {
    display: block;
    stroke: var(--overlay-eruption-color, #C7831F);
    stroke-dasharray: 3 2;
    opacity: .8;
}

.advanced-tooth-button.has-eruption .overlay-retained {
    display: block;
    stroke: var(--overlay-eruption-color, #C7831F);
    stroke-dasharray: 3 2;
}

.advanced-tooth-button.has-eruption .overlay-eruption-arrow {
    display: block;
    stroke: var(--overlay-eruption-color, #C7831F);
}

.advanced-tooth-button.has-exfoliation .overlay-removable {
    display: block;
    stroke: var(--overlay-exfoliation-color, #C7831F);
    stroke-dasharray: 4 3;
}

.advanced-tooth-button.has-exfoliation .overlay-crown {
    display: block;
    stroke: var(--overlay-exfoliation-color, #C7831F);
    stroke-dasharray: 2 3;
    opacity: .7;
}

.advanced-tooth-button.has-exfoliation .overlay-exfoliation-wave {
    display: block;
    stroke: var(--overlay-exfoliation-color, #C7831F);
}

.advanced-tooth-button.has-presence .overlay-crown {
    display: block;
    stroke: var(--overlay-presence-color, #15946F);
    stroke-width: 2.35;
}

.advanced-tooth-button.has-presence .overlay-presence-dot,
.advanced-tooth-button.has-presence .overlay-presence-check {
    display: block;
    stroke: var(--overlay-presence-color, #15946F);
}

.advanced-tooth-button.has-presence .overlay-presence-dot {
    fill: rgba(21, 148, 111, .12);
}

.advanced-tooth-button.has-implant-crown .overlay-abutment {
    display: block;
    stroke: var(--overlay-implant-crown-color, #3C78C2);
}

.advanced-tooth-button.has-implant-crown .overlay-crown,
.advanced-tooth-button.has-implant-crown .overlay-implant {
    display: block;
    stroke: var(--overlay-implant-crown-color, #3C78C2);
}

.advanced-tooth-button.has-implant-crown .overlay-crown {
    filter: drop-shadow(0 1px 1px rgba(60, 120, 194, .18));
}

.advanced-tooth-button.has-removable .overlay-removable {
    display: block;
    stroke: var(--overlay-removable-color, #7E56D8);
}

.advanced-tooth-button.has-ortho .overlay-ortho {
    display: block;
    stroke: var(--overlay-ortho-color, #7E56D8);
}

.advanced-tooth-button.has-note .overlay-note-badge,
.advanced-tooth-button.has-note .overlay-note-text,
.advanced-tooth-button.has-mobility .overlay-mobility-text {
    display: block;
}

.tooth-missing .advanced-tooth-svg {
    opacity: .76;
    filter: grayscale(.8);
}

.tooth-missing::after {
    content: none;
}

.clinical-context-menu {
    position: fixed;
    z-index: 80;
    width: min(560px, calc(100vw - 32px));
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
    overflow: hidden;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    box-shadow: var(--shadow-float);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 0;
}

.clinical-context-menu[hidden] {
    display: none !important;
}

.clinical-context-menu:focus {
    outline: none;
}

.context-menu-head {
    position: static;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 14px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
}

.context-dialog-heading {
    min-width: 0;
}

.context-dialog-heading strong,
.context-dialog-heading > span {
    display: block;
}

.context-dialog-heading > span {
    margin-top: 1px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.context-head-actions {
    display: flex;
    align-items: center;
    gap: 4px;
}

.context-history-button {
    min-height: 36px;
    border: 0;
    border-radius: var(--radius-control);
    padding: 6px 9px;
    color: var(--primary-dark);
    background: transparent;
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
}

.context-history-button:hover,
.context-history-button:focus-visible {
    background: var(--primary-soft);
    outline: none;
}

.context-close-button {
    width: 44px;
    min-height: 44px;
    border: 1px solid transparent;
    border-radius: var(--radius-control);
    background: transparent;
    color: var(--primary-dark);
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
    font-weight: 900;
}

.context-menu-body {
    display: grid;
    gap: 9px;
    min-height: 0;
    padding: 11px 14px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-block: 12px;
}

.context-menu-body > label,
.context-primary-fields label {
    margin-bottom: 0;
}

.context-menu-body [hidden] {
    display: none !important;
}

.context-close-button:hover,
.context-close-button:focus-visible {
    background: var(--primary-soft);
    border-color: rgba(11, 122, 134, .22);
    outline: none;
}

.context-actions {
    position: static;
    z-index: 2;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 10px 14px;
    background: var(--surface);
    border-top: 1px solid var(--line);
    box-shadow: 0 -8px 18px rgba(21, 33, 43, .05);
}

.context-actions .btn {
    min-height: 42px;
}

.field-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 800;
    font-size: 13px;
}

.face-chip-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 5px;
}

.face-chip-grid label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-height: 38px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    margin: 0;
    font-size: 12px;
    font-weight: 800;
}

.face-chip-grid input {
    width: 18px;
    min-height: 18px;
}

.face-chip-grid label:has(input:checked) {
    border-color: rgba(11, 122, 134, .4);
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.face-chip-grid label[hidden],
.context-meta-grid [hidden] {
    display: none !important;
}

.quick-action-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
}

.quick-action-grid .btn {
    min-height: 36px;
    padding: 6px 7px;
    font-size: 11px;
}

.context-primary-fields {
    display: grid;
    grid-template-columns: minmax(150px, .8fr) minmax(0, 1.2fr);
    gap: 9px;
}

.quick-action-grid .btn[hidden] {
    display: none !important;
}

.quick-action-grid .btn.active {
    border-color: rgba(21, 148, 111, .28);
    background: rgba(21, 148, 111, .10);
    color: #0F6A50;
}

.context-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.context-field-wide {
    grid-column: 1 / -1;
}

.field-help {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}

.automatic-clinical-state {
    display: grid;
    gap: 9px;
    padding: 10px;
    border: 1px solid rgba(11, 122, 134, .24);
    border-left: 4px solid #e5484d;
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.automatic-clinical-state[data-state="realizado"],
.automatic-clinical-state[data-state="extraida"] { border-left-color: #3c78c2; }
.automatic-clinical-state[data-state="existente"],
.automatic-clinical-state[data-state="deciduo_presente"],
.automatic-clinical-state[data-state="permanente_presente"] { border-left-color: #15946f; }
.automatic-clinical-state[data-state="ausente"] { border-left-color: #7a8792; }
.automatic-clinical-state[data-state="deciduo_exfoliacion"],
.automatic-clinical-state[data-state="permanente_erupcionando"],
.automatic-clinical-state[data-state="permanente_parcial_erupcion"] { border-left-color: #c7831f; }

.clinical-state-summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.clinical-state-summary > div {
    min-width: 0;
}

.clinical-state-summary span,
.clinical-state-choice-toolbar > span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.clinical-state-summary strong {
    display: block;
    margin-top: 2px;
    line-height: 1.25;
}

.clinical-state-origin {
    flex: 0 0 auto;
    padding: 4px 7px;
    border: 1px solid rgba(11, 122, 134, .22);
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary-dark) !important;
    text-align: center;
}

.clinical-state-origin.is-manual {
    border-color: rgba(199, 131, 31, .28);
    background: var(--warning-soft);
    color: #7A4A00 !important;
}

.clinical-state-choice-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}

.clinical-state-reset {
    min-height: 32px;
    border: 0;
    border-radius: 999px;
    padding: 4px 8px;
    background: transparent;
    color: var(--primary-dark);
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
}

.clinical-state-reset:hover,
.clinical-state-reset:focus-visible {
    background: var(--primary-soft);
    outline: none;
}

.clinical-state-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.clinical-state-choice-grid button {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 50px;
    padding: 7px 9px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    text-align: left;
}

.clinical-state-choice-grid button.is-suggested:not(.active)::after {
    content: "Sugerido";
    position: absolute;
    top: 4px;
    right: 6px;
    color: var(--primary-dark);
    font-size: 9px;
    font-weight: 850;
}

.clinical-state-choice-grid button:hover {
    border-color: rgba(11, 122, 134, .45);
    background: var(--primary-soft);
}

.clinical-state-choice-grid button:focus-visible {
    outline: 3px solid rgba(68, 184, 194, .32);
    outline-offset: 2px;
}

.clinical-state-choice-grid button.active {
    border-color: var(--primary);
    background: var(--primary-soft);
    box-shadow: inset 0 0 0 1px rgba(11, 122, 134, .18);
}

.clinical-state-choice-check {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border: 2px solid var(--line-strong);
    border-radius: 999px;
    color: transparent;
    font-size: 12px;
    font-weight: 900;
}

.clinical-state-choice-grid button.active .clinical-state-choice-check {
    border-color: var(--primary);
    background: var(--primary);
    color: #fff;
}

.clinical-state-choice-grid button[data-context-state-choice="por_realizar"].active {
    border-color: rgba(229, 72, 77, .55);
    background: rgba(229, 72, 77, .08);
}

.clinical-state-choice-grid button[data-context-state-choice="por_realizar"].active .clinical-state-choice-check {
    border-color: #e5484d;
    background: #e5484d;
}

.clinical-state-choice-grid button[data-context-state-choice="realizado"].active {
    border-color: rgba(60, 120, 194, .55);
    background: rgba(60, 120, 194, .09);
}

.clinical-state-choice-grid button[data-context-state-choice="realizado"].active .clinical-state-choice-check {
    border-color: #3c78c2;
    background: #3c78c2;
}

.clinical-state-choice-grid strong,
.clinical-state-choice-grid small {
    display: block;
}

.clinical-state-choice-grid strong {
    line-height: 1.2;
}

.clinical-state-choice-grid small {
    margin-top: 2px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.25;
}

.clinical-context-menu #contextNotes {
    min-height: 58px;
    max-height: 120px;
    resize: none;
}

.automatic-clinical-state option[data-automatic-only] {
    display: none;
}

.context-warning {
    padding: 10px 12px;
    border: 1px solid rgba(199, 131, 31, .34);
    border-radius: var(--radius-control);
    background: var(--warning-soft);
    color: #7A4A00;
    font-size: 12px;
    font-weight: 800;
}

.selected-tooth-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface-soft);
    margin-bottom: 14px;
}

.tooth-timeline-panel .panel-body {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.advanced-clinic-page .odontogram-history-disclosure {
    margin-top: 12px;
}

.advanced-clinic-page .odontogram-history-disclosure:not([open]) {
    box-shadow: none;
}

.advanced-clinic-page .timeline-disclosure-summary {
    border-bottom: 0;
}

.advanced-clinic-page .odontogram-history-disclosure[open] .timeline-disclosure-summary {
    border-bottom: 1px solid var(--line);
}

.advanced-clinic-page .timeline-expanded-toolbar {
    display: flex;
    justify-content: flex-end;
    padding: 10px 14px 0;
}

.advanced-clinic-page .odontogram-history-disclosure .panel-body {
    padding: 12px 14px 14px;
}

.tooth-timeline-panel .selected-tooth-card {
    margin-bottom: 0;
    grid-column: 1;
}

.longitudinal-clinical-summary {
    grid-column: 1;
    padding: 12px;
    border: 1px solid rgba(11, 122, 134, .2);
    border-radius: var(--radius-control);
    background: var(--primary-soft);
}

.longitudinal-clinical-summary span,
.longitudinal-clinical-summary strong,
.longitudinal-clinical-summary small {
    display: block;
}

.longitudinal-clinical-summary span,
.longitudinal-clinical-summary small {
    color: var(--muted);
    font-size: 12px;
}

.longitudinal-clinical-summary strong {
    margin: 3px 0;
    color: var(--primary-dark);
}

.timeline-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.timeline-panel-header strong,
.timeline-panel-header span {
    display: block;
}

.timeline-panel-header span {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.timeline-mode-toggle {
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    overflow: hidden;
    background: var(--surface);
}

.timeline-mode-toggle button {
    min-height: 34px;
    border: 0;
    border-right: 1px solid var(--line);
    background: transparent;
    color: var(--muted);
    padding: 6px 12px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}

.timeline-mode-toggle button:last-child {
    border-right: 0;
}

.timeline-mode-toggle button.active {
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.selected-tooth-card span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.selected-tooth-card strong {
    font-size: 24px;
    line-height: 1;
}

.tooth-timeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
    grid-column: 2;
    grid-row: 1 / span 2;
}

.timeline-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid var(--line);
    border-left-width: 4px;
    border-radius: var(--radius-control);
    background: var(--surface);
}

.timeline-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.timeline-item.color-red { border-left-color: #E5484D; }
.timeline-item.color-blue { border-left-color: #3C78C2; }
.timeline-item.color-green { border-left-color: #15946F; }
.timeline-item.color-gray { border-left-color: #7A8792; }
.timeline-item.color-amber { border-left-color: #C7831F; }
.timeline-item.color-purple { border-left-color: #7E56D8; }

.timeline-item strong,
.timeline-item span,
.timeline-item small {
    display: block;
}

.timeline-item span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.timeline-item small {
    color: var(--subtle);
    margin-top: 4px;
}

.timeline-item.is-historical {
    background: var(--surface-soft);
    border-style: dashed;
    border-left-style: solid;
}

.timeline-origin {
    color: var(--primary-dark) !important;
    font-weight: 750;
}

.historical-readonly-label {
    padding: 4px 7px;
    border-radius: 999px;
    background: #e8eef0;
    color: var(--muted) !important;
    font-size: 10px !important;
    font-weight: 800;
    text-transform: uppercase;
}

.periodontal-workspace {
    grid-template-columns: minmax(0, 1fr);
}

.periodontal-workspace > .panel {
    min-width: 0;
}

.periodontal-workspace > .panel > .panel-body {
    padding: 14px;
}

.periodontal-command-bar {
    display: grid;
    grid-template-columns: minmax(190px, .7fr) minmax(260px, .9fr) minmax(460px, 2fr);
    align-items: stretch;
    gap: 10px;
    margin-bottom: 12px;
}

.perio-command-status,
.perio-marker-actions,
.perio-keypad-panel {
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.perio-command-status {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 3px 10px;
}

.perio-command-status > span,
.perio-marker-actions > span,
.perio-keypad-panel > span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.perio-command-status > strong {
    grid-column: 2;
    grid-row: 1;
    color: var(--primary-dark);
    font-family: var(--font-data);
    font-size: 24px;
}

.perio-command-status .perio-alert {
    grid-column: 1 / -1;
    padding: 4px 0 0;
    border: 0;
    background: transparent;
    font-size: 11px;
    line-height: 1.3;
}

.perio-marker-actions {
    display: grid;
    gap: 6px;
}

.perio-marker-actions > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.perio-marker-actions button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    min-height: 40px;
    padding: 6px 8px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
}

.perio-marker-actions button:hover,
.perio-marker-actions button:focus-visible {
    border-color: var(--primary);
    outline: none;
}

.perio-marker-actions button[data-perio-marker-group="sangrado"].active {
    border-color: rgba(229, 72, 77, .55);
    background: rgba(229, 72, 77, .09);
    color: #8F1F17;
}

.perio-marker-actions button[data-perio-marker-group="supuracion"].active {
    border-color: rgba(199, 131, 31, .55);
    background: var(--warning-soft);
    color: #7A4A00;
}

.perio-marker-actions small {
    color: var(--subtle);
    font-size: 9px;
    font-weight: 650;
    line-height: 1.25;
}

.perio-keypad-panel {
    display: grid;
    gap: 6px;
}

.perio-keypad-panel .virtual-keypad {
    grid-template-columns: repeat(6, minmax(34px, 1fr));
    gap: 4px;
}

.perio-keypad-panel .virtual-keypad button {
    min-height: 34px;
    padding: 4px;
    font-size: 12px;
}

.periodontal-table-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.periodontal-table-toolbar > div:first-child strong,
.periodontal-table-toolbar > div:first-child span {
    display: block;
}

.periodontal-table-toolbar > div:first-child span {
    margin-top: 2px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 650;
}

.perio-filter-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.perio-filter-actions button {
    min-height: 34px;
    border: 0;
    border-radius: calc(var(--radius-control) - 3px);
    padding: 5px 9px;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
}

.perio-filter-actions button.active {
    background: var(--surface);
    color: var(--primary-dark);
    box-shadow: var(--shadow-soft);
}

.perio-filter-actions button:focus-visible {
    outline: 3px solid rgba(68, 184, 194, .3);
    outline-offset: 1px;
}

.periodontal-table-wrap {
    max-height: clamp(320px, calc(100dvh - 500px), 560px);
    overflow: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    margin-bottom: 12px;
    overscroll-behavior: contain;
}

.periodontal-table {
    width: 100%;
    min-width: 900px;
    table-layout: fixed;
}

.periodontal-table .perio-tooth-column { width: 6%; }
.periodontal-table .perio-measure-column { width: 17%; }
.periodontal-table .perio-marker-column { width: 13%; }

.periodontal-table th,
.periodontal-table td {
    padding: 6px 5px;
    white-space: nowrap;
    font-size: 12px;
}

.periodontal-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    text-align: center;
}

.periodontal-table thead th > span,
.periodontal-table thead th > small {
    display: block;
}

.periodontal-table thead th > small {
    margin-top: 2px;
    color: var(--subtle);
    font-size: 9px;
    letter-spacing: .08em;
}

.periodontal-table .perio-tooth-header,
.periodontal-table .perio-tooth-cell {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--surface);
    text-align: center;
}

.periodontal-table .perio-tooth-header {
    z-index: 4;
    background: var(--surface-soft);
}

.periodontal-table tr.is-active > td,
.periodontal-table tr.is-active > .perio-tooth-cell {
    background: var(--primary-soft);
}

.periodontal-table tr.is-active > .perio-tooth-cell {
    color: var(--primary-dark);
}

.perio-triplet {
    display: grid;
    grid-template-columns: repeat(3, minmax(30px, 1fr));
    gap: 4px;
}

.perio-triplet input[type="number"] {
    width: 100%;
    min-width: 0;
    min-height: 36px;
    padding: 4px;
    text-align: center;
    font-family: var(--font-data);
    font-weight: 800;
}

.perio-triplet input.danger {
    border-color: #E5484D;
    background: var(--danger-soft);
    color: #8F1F17;
}

.perio-checks {
    grid-template-columns: repeat(3, minmax(28px, 1fr));
    align-items: center;
}

.perio-site-check {
    position: relative;
    display: block;
    margin: 0;
}

.perio-site-check input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.perio-site-check span {
    display: grid;
    place-items: center;
    min-height: 36px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--muted);
    cursor: pointer;
    font-size: 10px;
    font-weight: 850;
}

.perio-site-check input:focus-visible + span {
    outline: 3px solid rgba(68, 184, 194, .32);
    outline-offset: 1px;
}

.perio-site-check input[data-group="sangrado"]:checked + span {
    border-color: #E5484D;
    background: var(--danger-soft);
    color: #8F1F17;
}

.perio-site-check input[data-group="supuracion"]:checked + span {
    border-color: #C7831F;
    background: var(--warning-soft);
    color: #7A4A00;
}

.periodontal-analysis-disclosure {
    margin: 0 0 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.periodontal-analysis-disclosure > summary {
    padding: 10px 12px;
    color: var(--primary-dark);
    cursor: pointer;
    font-size: 12px;
    font-weight: 850;
}

.periodontal-analysis-disclosure .periodontal-curve {
    display: block;
    width: calc(100% - 24px);
    max-width: 720px;
    margin: 0 12px 12px;
}

.periodontal-curve {
    width: 100%;
    height: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: linear-gradient(180deg, #FFFFFF, #F8FBFB);
}

.periodontal-curve line {
    stroke: #D8E0E7;
    stroke-dasharray: 5 5;
}

.periodontal-curve path {
    fill: none;
    stroke: var(--primary);
    stroke-width: 5;
    stroke-linecap: round;
    filter: drop-shadow(0 4px 8px rgba(11, 122, 134, .14));
}

.periodontal-curve path + path {
    stroke: #3E8B6D;
}

.periodontal-curve path.danger {
    stroke: #E5484D;
}

.perio-alert {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}

.perio-alert.danger {
    border-color: #E5484D;
    background: var(--danger-soft);
    color: #8F1F17;
}

.virtual-keypad {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.virtual-keypad button {
    min-height: 42px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    font-weight: 800;
}

.virtual-keypad button:hover {
    border-color: var(--primary);
    color: var(--primary);
}

@media (min-width: 1500px) {
    .perio-keypad-panel .virtual-keypad {
        grid-template-columns: repeat(12, minmax(34px, 1fr));
    }
}

@media (max-width: 1280px) {
    .periodontal-command-bar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .perio-keypad-panel {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .periodontal-workspace > .panel > .panel-body {
        padding: 10px;
    }

    .periodontal-command-bar {
        grid-template-columns: minmax(0, 1fr);
    }

    .perio-keypad-panel {
        grid-column: auto;
    }

    .periodontal-table-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .perio-filter-actions {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .perio-filter-actions button {
        flex: 0 0 auto;
    }

    .periodontal-table {
        min-width: 840px;
    }
}

.xray-viewer {
    display: grid;
    place-items: center;
    min-height: 340px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: #0D1214;
    overflow: hidden;
    margin-bottom: 14px;
}

.xray-viewer img {
    display: block;
    max-width: 100%;
    max-height: 520px;
    object-fit: contain;
}

.xray-viewer .empty {
    max-width: 420px;
    color: #C8D1D6;
    background: transparent;
}

.xray-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.inline-check {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.xray-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 14px;
}

.xray-card {
    display: grid;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    padding: 12px;
}

.xray-card img,
.xray-file-token {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: var(--radius-control);
    object-fit: cover;
    background: #0D1214;
}

.xray-file-token {
    display: grid;
    place-items: center;
    color: #DCE7EA;
    font-weight: 800;
    letter-spacing: .08em;
}

.xray-card span,
.xray-card small {
    color: var(--muted);
    font-size: 12px;
    overflow-wrap: anywhere;
}

.voice-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
}

.voice-result {
    min-height: 170px;
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius-panel);
    background: var(--surface-soft);
    padding: 18px;
}

.voice-result p {
    margin: 8px 0 14px;
    color: var(--muted);
    font-weight: 700;
}

.voice-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.voice-dictation-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #17365d;
    background: #eef6ff;
    border: 1px solid #9fc5ed;
}

.voice-dictation-button.is-listening {
    color: #fff;
    background: #c62828;
    border-color: #c62828;
    box-shadow: 0 0 0 4px rgba(198, 40, 40, .16);
    animation: voice-pulse 1.25s ease-in-out infinite;
}

.voice-dictation-button:disabled {
    cursor: not-allowed;
    opacity: .55;
}

.voice-status {
    min-height: 20px;
}

.odontogram-header-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.advanced-clinic-page .odontogram-tools-disclosure,
.advanced-clinic-page .odontogram-secondary-disclosure {
    margin-bottom: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    overflow: hidden;
}

.advanced-clinic-page .odontogram-tools-disclosure[hidden] { display: none; }

.advanced-clinic-page .odontogram-tools-disclosure > summary,
.advanced-clinic-page .odontogram-secondary-disclosure > summary,
.advanced-clinic-page .timeline-disclosure-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 8px 12px;
    cursor: pointer;
    list-style: none;
}

.advanced-clinic-page .odontogram-tools-disclosure > summary::-webkit-details-marker,
.advanced-clinic-page .odontogram-secondary-disclosure > summary::-webkit-details-marker,
.advanced-clinic-page .timeline-disclosure-summary::-webkit-details-marker {
    display: none;
}

.advanced-clinic-page .odontogram-tools-disclosure summary span:first-child,
.advanced-clinic-page .odontogram-secondary-disclosure summary span:first-child,
.advanced-clinic-page .timeline-disclosure-summary > div {
    min-width: 0;
}

.advanced-clinic-page .odontogram-tools-disclosure summary strong,
.advanced-clinic-page .odontogram-tools-disclosure summary small,
.advanced-clinic-page .odontogram-secondary-disclosure summary strong,
.advanced-clinic-page .odontogram-secondary-disclosure summary small,
.advanced-clinic-page .timeline-disclosure-summary strong,
.advanced-clinic-page .timeline-disclosure-summary #timelineSummary {
    display: block;
}

.advanced-clinic-page .odontogram-tools-disclosure summary small,
.advanced-clinic-page .odontogram-secondary-disclosure summary small,
.advanced-clinic-page .timeline-disclosure-summary #timelineSummary {
    margin-top: 1px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 650;
}

.advanced-clinic-page .disclosure-action {
    flex: 0 0 auto;
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 850;
}

.advanced-clinic-page details[open] > summary .disclosure-action {
    font-size: 0;
}

.advanced-clinic-page details[open] > summary .disclosure-action::after {
    content: "Ocultar";
    font-size: 11px;
}

.odontogram-voice-console {
    display: grid;
    grid-template-columns: minmax(260px, .9fr) minmax(300px, 1.1fr);
    gap: 16px;
    align-items: start;
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.advanced-clinic-page .odontogram-voice-console {
    margin: 0;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
}

.advanced-clinic-page .odontogram-secondary-disclosure {
    margin: 12px 0 0;
    background: var(--surface);
}

.advanced-clinic-page .odontogram-secondary-disclosure label {
    display: block;
    margin: 0;
    padding: 0 12px 12px;
}

.advanced-clinic-page .odontogram-secondary-disclosure textarea {
    min-height: 66px;
}

.odontogram-voice-console p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.odontogram-voice-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.voice-ai-status {
    display: inline-flex;
    margin-top: 9px;
    color: var(--muted);
    font-weight: 800;
}

.voice-ai-status.is-enabled {
    color: #0f7658;
}

.ai-settings-form {
    max-width: 760px;
}

.ai-enable-control {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.ai-enable-control input,
.ai-remove-control input {
    width: auto;
    margin-top: 3px;
}

.ai-enable-control span {
    display: grid;
    gap: 4px;
}

.ai-enable-control small,
.ai-settings-form label > small {
    color: var(--muted);
    font-weight: 600;
}

.ai-remove-control {
    display: flex;
    gap: 9px;
    align-items: center;
    color: var(--danger);
}

.odontogram-voice-quick-actions .btn {
    padding: 7px 10px;
    font-size: 12px;
}

.odontogram-voice-console[data-voice-state="active"],
.odontogram-voice-console[data-voice-state="listening"] {
    border-color: #15946f;
    background: #e7f7f1;
}

.odontogram-voice-console[data-voice-state="processing"] {
    border-color: #c7831f;
    background: #fff7e6;
}

.odontogram-voice-console[data-voice-state="error"] {
    border-color: var(--danger);
    background: var(--danger-soft);
}

.odontogram-voice-feed {
    display: grid;
    gap: 6px;
    max-height: 126px;
    overflow-y: auto;
}

.odontogram-voice-entry {
    padding: 7px 9px;
    border-left: 3px solid var(--line-strong);
    border-radius: 4px;
    background: var(--surface);
    font-size: 12px;
    font-weight: 700;
}

.odontogram-voice-entry.is-success { border-left-color: #15946f; }
.odontogram-voice-entry.is-error { border-left-color: var(--danger); }

@keyframes voice-pulse {
    50% { box-shadow: 0 0 0 8px rgba(198, 40, 40, .08); }
}

@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --ink: #E8EEEE;
        --muted: #B3C0C0;
        --subtle: #879696;
        --line: #2E3A3A;
        --line-strong: #405050;
        --bg: #0F1414;
        --surface: #171D1D;
        --surface-soft: #1D2525;
        --surface-tint: #12383D;
        --primary: #44B8C2;
        --primary-dark: #79D7DE;
        --primary-soft: #12383D;
        --danger: #FF8A80;
        --danger-soft: #3A1D1B;
        --warning: #F5C56A;
        --warning-soft: #332812;
        --success: #66D0A7;
        --success-soft: #17382E;
        --info: #8DB8F1;
        --info-soft: #192A3E;
        --shadow-soft: 0 1px 2px rgba(0, 0, 0, .22);
    }

    body {
        background: var(--bg);
    }

    label, th { color: var(--ink); }
    .topbar { background: rgba(23, 29, 29, .92); border-bottom-color: var(--line); }
    input, select, textarea, .modal { background: #121818; color: var(--ink); }
    th, .panel-header, .settings-nav, .day-list, .collapsible { background: var(--surface-soft); }
    tbody tr:hover { background: rgba(68, 184, 194, .08); }
    .btn-outline, .icon-button { background: #121818; color: var(--ink); }
    .sidebar { background: #0E272D; }
    .role-chip, .color-badge, .side-drawer, .drawer-header, .drawer-footer, .permissions-panel { background: var(--surface); color: var(--ink); }
    .permission-group-header, .permission-custom-card, .user-day-list, .inline-form-row td, .condition-edit-row td, .category-create-form { background: var(--surface-soft); }
    .permission-check-row, .permission-group-header { color: var(--muted); }
    .permission-check-row input:checked + span { color: var(--ink); }
    .segmented-control, .wizard-tabs button { background: #121818; color: var(--ink); }
    .tooth-svg polygon, .tooth-svg rect { fill: #121818; stroke: #617272; }
    .tooth-svg .face-good { fill: #13334C; stroke: #78B7F2; }
    .tooth-svg .face-bad { fill: #3A1D1B; stroke: #FF8A80; }
    .patient-avatar-preview { background: #343E42; }
    .agenda-corner, .agenda-dentist-head, .agenda-time-label { background: var(--surface-soft); }
    .appointment-card strong { color: var(--ink); }
    .appointment-card span, .appointment-time { color: var(--muted); }
    .agenda-type-selector label { color: var(--ink); }
    .agenda-modal .actions { background: linear-gradient(180deg, rgba(18, 24, 24, .88), var(--surface) 34%); }
    .appointment-menu { background: var(--surface); border-color: var(--line); }
    .appointment-menu .link-button { color: var(--ink); }
    .appointment-menu .link-button:hover { background: rgba(68, 184, 194, .12); }
    .advanced-tabs button,
    .advanced-odontogram,
    .clinical-context-menu,
    .periodontal-curve,
    .virtual-keypad button,
    .timeline-item,
    .xray-card {
        background: var(--surface);
    }
    .tooth-face { fill: #121818; stroke: #617272; }
    .face-red { fill: #3A1D1B; stroke: #FF8A80; }
    .face-blue { fill: #13293E; stroke: #8DB8F1; }
    .face-green { fill: #17382E; stroke: #66D0A7; }
    .face-gray { fill: #2C3438; stroke: #9BA8B2; }
    .face-amber { fill: #332812; stroke: #F5C56A; }
}

.procedure-create-panel > summary,
.procedure-edit-details > summary,
.plan-item-details > summary {
    cursor: pointer;
    list-style: none;
}

.procedure-form-grid,
.plan-item-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
}

.procedure-form-grid label,
.plan-item-form label,
.plan-payment-form label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}

.procedure-field-wide,
.plan-field-wide {
    grid-column: 1 / -1;
}

.procedure-table-wrap {
    overflow-x: auto;
}

.procedure-catalog-total {
    align-self: center;
    padding: 6px 9px;
    border-radius: 999px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    font-size: 10px;
    font-weight: 850;
    white-space: nowrap;
}

.procedure-catalog-toolbar {
    display: grid;
    gap: 10px;
    padding: 13px 15px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.procedure-catalog-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.procedure-catalog-heading > div { display: grid; gap: 1px; }
.procedure-catalog-heading strong { font-size: 14px; }
.procedure-catalog-heading small { color: var(--muted); font-size: 10px; }
.procedure-filter-active { padding: 4px 8px; border-radius: 999px; color: #8a5907; background: #fff0cc; font-size: 9px; font-weight: 850; }

.procedure-catalog-filters {
    display: grid;
    grid-template-columns: minmax(210px, 1.5fr) repeat(3, minmax(135px, 1fr)) auto auto;
    align-items: end;
    gap: 8px;
}

.procedure-catalog-filters label { display: grid; min-width: 0; gap: 4px; }
.procedure-catalog-filters label > span { color: var(--muted); font-size: 9px; font-weight: 800; }
.procedure-catalog-filters input,
.procedure-catalog-filters select { width: 100%; min-width: 0; min-height: 38px; padding: 7px 9px; }
.procedure-catalog-filters .btn { min-height: 38px; padding: 7px 11px; white-space: nowrap; }

.procedure-identity { display: grid; grid-template-columns: 9px minmax(0, 1fr); align-items: center; gap: 9px; }
.procedure-identity > i { width: 9px; height: 32px; border-radius: 6px; background: var(--procedure-color); box-shadow: 0 0 0 1px rgba(24, 52, 61, .1); }
.procedure-identity > span { min-width: 0; }

.procedure-table td:first-child strong,
.procedure-table td:first-child small {
    display: block;
}

@media (max-width: 1180px) {
    .procedure-catalog-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .procedure-catalog-filters .btn { width: 100%; }
}

@media (max-width: 640px) {
    .procedure-catalog-heading { align-items: flex-start; }
    .procedure-catalog-filters { grid-template-columns: minmax(0, 1fr); }
}

.diagnosis-relation-panel {
    margin-bottom: 18px;
}

.diagnosis-relation-panel .panel-header form,
.diagnosis-relation-panel .panel-header label {
    display: grid;
    gap: 5px;
    min-width: 240px;
}

.diagnosis-rule-list { display: grid; }
.diagnosis-rule-list-head,
.diagnosis-rule-item > summary {
    display: grid;
    grid-template-columns: minmax(180px, 1.15fr) minmax(220px, 1.55fr) minmax(130px, .8fr) 82px 92px;
    align-items: center;
    gap: 12px;
}
.diagnosis-rule-list-head {
    min-height: 42px;
    padding: 8px 16px;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    background: var(--surface-soft);
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
}
.diagnosis-rule-item { border-bottom: 1px solid var(--line); }
.diagnosis-rule-item:last-child { border-bottom: 0; }
.diagnosis-rule-item > summary {
    min-height: 62px;
    padding: 9px 16px;
    cursor: pointer;
    list-style: none;
    transition: background .15s ease;
}
.diagnosis-rule-item > summary::-webkit-details-marker { display: none; }
.diagnosis-rule-item > summary:hover { background: #f6fafb; }
.diagnosis-rule-item[open] > summary { border-bottom: 1px solid var(--line); background: var(--primary-soft); }
.diagnosis-rule-name,
.diagnosis-rule-procedure { display: grid; min-width: 0; gap: 2px; }
.diagnosis-rule-name strong,
.diagnosis-rule-procedure strong,
.diagnosis-rule-name small,
.diagnosis-rule-procedure small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.diagnosis-rule-name strong,
.diagnosis-rule-procedure strong { font-size: 12px; }
.diagnosis-rule-name small,
.diagnosis-rule-procedure small { color: var(--muted); font-size: 9px; }
.diagnosis-rule-phase { overflow: hidden; color: #52646f; font-size: 10px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.diagnosis-rule-manage { display: flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--primary-dark); font-size: 10px; font-weight: 850; }
.diagnosis-rule-manage b { font-size: 15px; transition: transform .16s ease; }
.diagnosis-rule-item[open] .diagnosis-rule-manage b { transform: rotate(180deg); }
.diagnosis-rule-editor { display: grid; gap: 10px; padding: 12px 15px 14px; background: #fbfcfc; }
.diagnosis-rule-editor-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.diagnosis-rule-editor-title > div { display: grid; gap: 1px; }
.diagnosis-rule-editor-title strong { font-size: 12px; }
.diagnosis-rule-editor-title small { color: var(--muted); font-size: 9px; }

.diagnosis-relation-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 10px;
    align-items: center;
}

.diagnosis-relation-form > label { display: grid; min-width: 0; gap: 4px; color: var(--muted); font-size: 9px; font-weight: 800; }
.diagnosis-relation-form > label input,
.diagnosis-relation-form > label select { width: 100%; min-width: 0; min-height: 38px; padding: 7px 9px; }
.diagnosis-rule-advanced { grid-column: 1 / -1; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.diagnosis-rule-advanced > summary { padding: 9px 11px; color: var(--primary-dark); cursor: pointer; font-size: 10px; font-weight: 850; list-style: none; }
.diagnosis-rule-advanced > summary::-webkit-details-marker { display: none; }
.diagnosis-rule-advanced > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; border-top: 1px solid var(--line); }
.diagnosis-rule-advanced label { display: grid; gap: 4px; color: var(--muted); font-size: 9px; font-weight: 800; }
.diagnosis-rule-advanced input { width: 100%; min-width: 0; min-height: 36px; }
.diagnosis-rule-save { grid-column: 1 / -1; display: flex; justify-content: flex-end; }
.clinical-rule-actions { position: relative; flex: 0 0 auto; }
.clinical-rule-actions > summary { min-height: 32px; padding: 5px 9px; cursor: pointer; list-style: none; font-size: 9px; }
.clinical-rule-actions > summary::-webkit-details-marker { display: none; }
.clinical-rule-actions > div { position: absolute; z-index: 12; right: 0; top: calc(100% + 4px); display: grid; min-width: 130px; padding: 5px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: var(--shadow-float); }
.clinical-rule-actions form { margin: 0; }
.clinical-rule-actions .link-button { width: 100%; padding: 7px 8px; border-radius: 6px; text-align: left; }
.clinical-rule-actions .link-button:hover { background: var(--surface-soft); }

.diagnosis-relation-form > button {
    min-height: 42px;
}

.diagnosis-relation-table td:first-child {
    width: 34%;
}

@media (max-width: 980px) {
    .diagnosis-rule-list-head { display: none; }
    .diagnosis-rule-item > summary { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; }
    .diagnosis-rule-phase { display: none; }
    .diagnosis-rule-item > summary > .condition-state { display: none; }
}

@media (max-width: 640px) {
    .diagnosis-rule-item > summary { grid-template-columns: minmax(0, 1fr) auto; }
    .diagnosis-rule-procedure { grid-column: 1; grid-row: 2; }
    .diagnosis-rule-manage { grid-column: 2; grid-row: 1 / span 2; }
    .diagnosis-rule-editor { padding: 10px; }
    .diagnosis-rule-advanced > div { grid-template-columns: minmax(0, 1fr); }
    .clinical-rule-list article { align-items: flex-start; }
}

.procedure-edit-details {
    display: inline-block;
    position: relative;
}

.procedure-edit-details > summary::marker {
    content: '';
}

.procedure-edit-popover {
    position: fixed;
    z-index: 80;
    left: max(16px, calc(50% - 420px));
    top: 12vh;
    width: min(840px, calc(100vw - 32px));
    max-height: calc(100vh - 24vh);
    overflow-y: auto;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    box-shadow: var(--shadow-float);
    text-align: left;
}

.procedure-edit-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.procedure-edit-header > div {
    display: grid;
    gap: 3px;
}

.procedure-edit-header strong {
    color: var(--ink);
    font-size: 18px;
}

.procedure-edit-header small {
    color: var(--muted);
}

.procedure-edit-close {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-soft);
    color: var(--muted);
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
}

.procedure-edit-close:hover,
.procedure-edit-close:focus-visible {
    border-color: var(--primary);
    color: var(--primary);
    outline: none;
}

.plan-summary-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
}

.longitudinal-treatment-panel {
    margin-bottom: 16px;
    border-color: rgba(11, 122, 134, .28);
}

.longitudinal-treatment-panel > summary {
    list-style: none;
    cursor: pointer;
}

.longitudinal-treatment-panel > summary::-webkit-details-marker,
.longitudinal-realized-disclosure > summary::-webkit-details-marker {
    display: none;
}

.longitudinal-treatment-summary-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.longitudinal-treatment-panel[open] > summary .plan-details-chevron {
    transform: rotate(180deg);
}

.longitudinal-treatment-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.longitudinal-treatment-counts span {
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 800;
}

.longitudinal-treatment-groups {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.longitudinal-treatment-groups h4 {
    margin: 0 0 8px;
}

.longitudinal-treatment-list {
    display: grid;
    gap: 8px;
}

.longitudinal-pending-group {
    min-width: 0;
}

.longitudinal-pending-group .longitudinal-treatment-list {
    grid-auto-flow: column;
    grid-auto-columns: minmax(280px, 360px);
    grid-template-columns: none;
    overflow-x: auto;
    padding-bottom: 5px;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
}

.longitudinal-pending-group .longitudinal-treatment-list article {
    scroll-snap-align: start;
}

.longitudinal-treatment-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px;
    border: 1px solid var(--line);
    border-left: 4px solid #c7831f;
    border-radius: var(--radius-control);
    background: var(--surface);
}

.longitudinal-treatment-list article.is-realized {
    border-left-color: #3c78c2;
}

.longitudinal-treatment-list article.is-linked {
    border-color: #c7831f;
    background: color-mix(in srgb, #c7831f 9%, var(--surface));
    box-shadow: 0 0 0 2px color-mix(in srgb, #c7831f 18%, transparent);
}

.longitudinal-treatment-list article.is-filtered-out {
    display: none;
}

.longitudinal-treatment-list strong,
.longitudinal-treatment-list span {
    display: block;
}

.longitudinal-treatment-list span {
    margin-top: 2px;
    color: var(--muted);
    font-size: 12px;
}

.longitudinal-treatment-list a {
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.longitudinal-realized-disclosure {
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.longitudinal-realized-disclosure > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 42px;
    padding: 8px 10px;
    color: var(--muted);
    cursor: pointer;
    font-size: 12px;
    font-weight: 850;
    list-style: none;
}

.longitudinal-realized-disclosure > summary strong {
    min-width: 26px;
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--primary-dark);
    text-align: center;
}

.longitudinal-realized-disclosure > .longitudinal-treatment-list {
    padding: 0 10px 10px;
}

.advanced-tab-panel[data-advanced-panel="plan"].active {
    display: flex;
    flex-direction: column;
}

.advanced-tab-panel[data-advanced-panel="plan"] > .plan-command-dock { order: 1; }
.advanced-tab-panel[data-advanced-panel="plan"] > .plan-summary-grid { order: 2; }
.advanced-tab-panel[data-advanced-panel="plan"] > .clinical-plan-alerts { order: 3; }
.advanced-tab-panel[data-advanced-panel="plan"] > .plan-odontogram-panel { order: 4; }
.advanced-tab-panel[data-advanced-panel="plan"] > .longitudinal-treatment-panel { order: 5; }
.advanced-tab-panel[data-advanced-panel="plan"] > .treatment-plan-main { order: 6; }
.advanced-tab-panel[data-advanced-panel="plan"] > .treatment-proposals-panel { order: 7; }
.advanced-tab-panel[data-advanced-panel="plan"] > .appointment-suggestions-panel { order: 8; }

.plan-workspace-nav {
    position: sticky;
    top: 10px;
    z-index: 24;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid rgba(11, 122, 134, .25);
    border-radius: var(--radius-panel);
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    box-shadow: 0 8px 24px rgba(21, 33, 43, .09);
    backdrop-filter: blur(10px);
}

.plan-workspace-title {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.plan-workspace-title strong { font-size: 14px; }
.plan-workspace-title span { color: var(--muted); font-size: 11px; }

.plan-workspace-links {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: thin;
}

.plan-workspace-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.plan-workspace-links a:hover,
.plan-workspace-links a:focus-visible {
    outline: 0;
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.plan-workspace-links a strong {
    color: var(--primary-dark);
    font-size: 12px;
}

#plan-items,
#plan-suggestions,
#plan-schedule,
#plan-continuity,
#plan-odontogram {
    scroll-margin-top: 78px;
}

.plan-odontogram-panel {
    margin-bottom: 10px;
}

.plan-odontogram-panel > .panel-header { padding: 9px 12px; }
.plan-odontogram-panel > .panel-body { padding: 8px 12px 10px; }

.plan-view-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.plan-more-filters { position: relative; }
.plan-more-filters > summary {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 5px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
    list-style: none;
}
.plan-more-filters > summary::-webkit-details-marker { display: none; }
.plan-more-filters > div {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 45;
    display: grid;
    gap: 5px;
    min-width: 150px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.plan-more-filters > div button { width: 100%; justify-content: flex-start; }

.plan-view-filters button {
    min-height: 32px;
    padding: 5px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
}

.plan-view-filters button.active,
.plan-view-filters button:hover,
.plan-view-filters button:focus-visible {
    outline: 0;
    border-color: var(--primary);
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.plan-view-filters button[data-plan-filter="pendiente"].active {
    border-color: #B42318;
    background: #FDECEC;
    color: #B42318;
}

.plan-view-filters button[data-plan-filter="aceptado"].active {
    border-color: #006D75;
    background: #E8F7F8;
    color: #006D75;
}

.plan-view-filters button[data-plan-filter="proceso"].active {
    border-color: #B54708;
    background: #FFF4E5;
    color: #B54708;
}

.plan-view-filters button[data-plan-filter="realizado"].active {
    border-color: #175CD3;
    background: #E8F1FC;
    color: #175CD3;
}

.plan-view-filters button[data-plan-filter="seguimiento"].active {
    border-color: #8A4B08;
    background: #FFF4E5;
    color: #8A4B08;
}

.plan-view-filters button[data-plan-filter="continuidad"].active {
    border-color: #5B3DB4;
    background: #F3EEFF;
    color: #5B3DB4;
}

.plan-odontogram {
    --plan-pending: #B42318;
    --plan-pending-bg: #FDECEC;
    --plan-accepted: #006D75;
    --plan-accepted-bg: #E8F7F8;
    --plan-progress: #B54708;
    --plan-progress-bg: #FFF4E5;
    --plan-completed: #175CD3;
    --plan-completed-bg: #E8F1FC;
    --plan-follow-up: #8A4B08;
    --plan-follow-up-bg: #FFF4E5;
    --plan-continuity: #5B3DB4;
    --plan-continuity-bg: #F3EEFF;
    --plan-missing: #475467;
    --plan-missing-bg: #F2F4F7;
}

.plan-odontogram-legend { display: none; }

.plan-odontogram-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}

.plan-odontogram-legend i {
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border: 2px solid currentColor;
    border-radius: 50%;
    background: color-mix(in srgb, currentColor 12%, white);
    font-style: normal;
    font-size: 10px;
}

.plan-odontogram-legend .is-pendiente { color: var(--plan-pending); }
.plan-odontogram-legend .is-aceptado { color: var(--plan-accepted); }
.plan-odontogram-legend .is-proceso { color: var(--plan-progress); }
.plan-odontogram-legend .is-realizado { color: var(--plan-completed); }
.plan-odontogram-legend .is-seguimiento { color: var(--plan-follow-up); }
.plan-odontogram-legend .is-ausente { color: var(--plan-missing); }
.plan-odontogram-legend .is-continuidad { color: var(--plan-continuity); }
.plan-odontogram-legend .is-continuidad i {
    width: 34px;
    border-radius: 6px;
}

.plan-odontogram-scroll {
    display: grid;
    gap: 3px;
    overflow-x: auto;
    padding: 5px 6px 7px;
    border-radius: var(--radius-control);
    background: #FFFEFA;
}

.plan-arch {
    display: grid;
    gap: 2px;
    min-width: 820px;
}

.plan-arch-label {
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .08em;
    text-align: center;
    text-transform: uppercase;
}

.plan-teeth-row {
    display: grid;
    grid-template-columns: repeat(16, minmax(44px, 1fr));
    gap: 3px;
}

.plan-midline {
    min-width: 820px;
    border-top: 1px dashed var(--line-strong);
}

.plan-tooth {
    --tooth-state: #8D9AA2;
    --tooth-state-bg: transparent;
    position: relative;
    display: grid;
    gap: 0;
    place-items: center;
    min-width: 0;
    min-height: 70px;
    padding: 1px;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
    opacity: 1;
}

.plan-tooth:disabled { cursor: default; opacity: 1; }
.plan-tooth.is-pendiente { --tooth-state: var(--plan-pending); --tooth-state-bg: var(--plan-pending-bg); }
.plan-tooth.is-aceptado { --tooth-state: var(--plan-accepted); --tooth-state-bg: var(--plan-accepted-bg); }
.plan-tooth.is-proceso { --tooth-state: var(--plan-progress); --tooth-state-bg: var(--plan-progress-bg); }
.plan-tooth.is-realizado { --tooth-state: var(--plan-completed); --tooth-state-bg: var(--plan-completed-bg); }
.plan-tooth.is-seguimiento { --tooth-state: var(--plan-follow-up); --tooth-state-bg: var(--plan-follow-up-bg); }
.plan-tooth.is-ausente { --tooth-state: var(--plan-missing); --tooth-state-bg: var(--plan-missing-bg); }

.plan-tooth.whole-pending { box-shadow: inset 0 -3px 0 var(--plan-pending); }
.plan-tooth.whole-realized { box-shadow: inset 0 -3px 0 var(--plan-completed); }
.plan-tooth.whole-mixed { box-shadow: inset 20px -3px 0 var(--plan-pending), inset -20px -3px 0 var(--plan-completed); }

.plan-tooth-number {
    color: #263B49;
    font-family: var(--font-data);
    font-size: 10px;
    font-weight: 900;
}

.plan-tooth svg {
    width: 100%;
    max-width: 46px;
    height: 52px;
    overflow: visible;
}

.plan-tooth-face,
.plan-tooth-root {
    fill: #FFFDF7;
    stroke: #587080;
    stroke-width: 1.5;
}

.plan-tooth-face.is-pending-marked,
.plan-tooth-root.is-pending-marked { fill: #FDECEC; stroke: #E5484D; stroke-width: 2.5; }
.plan-tooth-face.is-realized-marked,
.plan-tooth-root.is-realized-marked { fill: #EAF1FB; stroke: #3C78C2; stroke-width: 2.5; }
.plan-tooth-face.is-mixed-marked,
.plan-tooth-root.is-mixed-marked { fill: var(--plan-mixed-fill); stroke: #E5484D; stroke-width: 2.8; }

.plan-tooth.is-ausente .plan-tooth-face,
.plan-tooth.is-ausente .plan-tooth-root {
    fill: #F4F6F6;
    stroke: var(--plan-missing);
    stroke-dasharray: 4 3;
}

.plan-tooth-clinical-marker { stroke: white; stroke-width: 1.5; }
.plan-tooth-clinical-marker.is-pending { fill: #E5484D; }
.plan-tooth-clinical-marker.is-realized { fill: #3C78C2; }
.plan-tooth-clinical-marker-icon { fill: white; font-size: 10px; font-weight: 900; text-anchor: middle; }
.plan-tooth-continuity { fill: var(--plan-continuity); stroke: white; stroke-width: 1.5; }
.plan-tooth-continuity-icon { fill: white; font-size: 7px; font-weight: 900; text-anchor: middle; }
.plan-tooltip-group { padding-top: 5px; border-top: 1px solid var(--line); font-weight: 850; }
.plan-tooltip-group.is-continuity { color: var(--plan-continuity); }

.plan-tooth:hover,
.plan-tooth.is-linked {
    border-color: #587080;
    background: #F7FAFA;
    box-shadow: 0 0 0 2px rgba(88, 112, 128, .2);
}

.plan-tooth:focus-visible {
    outline: 3px solid #172B3A;
    outline-offset: 2px;
}

.plan-tooth-tooltip {
    display: none;
    position: absolute;
    z-index: 40;
    left: 50%;
    bottom: calc(100% + 8px);
    width: 210px;
    transform: translateX(-50%);
    padding: 9px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    color: var(--ink);
    text-align: left;
}

.plan-tooth-tooltip strong,
.plan-tooth-tooltip span,
.plan-tooth-tooltip small { display: block; }
.plan-tooth-tooltip span { margin-top: 3px; font-size: 11px; }
.plan-tooth-tooltip small { margin-top: 5px; color: var(--muted); }
.plan-tooth:hover .plan-tooth-tooltip,
.plan-tooth:focus-visible .plan-tooth-tooltip { display: block; }

.plan-filter-feedback { margin: 5px 0 0; font-size: 11px; }

.plan-tooth-selection {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    margin-top: 6px;
    padding: 6px 9px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #F8FBFB;
    font-size: 11px;
}
.plan-tooth-selection[hidden] { display: none; }
.plan-tooth-selection strong { color: var(--ink); }
.plan-tooth-selection span { color: var(--muted); }
.plan-tooth-selection .btn { margin-left: auto; min-height: 30px; padding: 4px 9px; font-size: 11px; }
.plan-version-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 12px; }
.plan-version-strip a { padding: 5px 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-soft); color: var(--primary-dark); font-size: 11px; font-weight: 750; text-decoration: none; }
.plan-tooth.is-filtered { opacity: .2; filter: grayscale(1); }
.treatment-plan-item.is-filtered-out { display: none; }
.treatment-plan-item.is-linked {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(11, 122, 134, .12);
}

.plan-order-controls { display: inline-flex; align-items: center; gap: 3px; }
.plan-move-button,
.plan-drag-handle {
    width: fit-content;
    min-height: 26px;
    padding: 1px 7px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: var(--surface-soft);
    color: var(--muted);
    cursor: grab;
    font-weight: 900;
    letter-spacing: -2px;
}

.plan-move-button { cursor: pointer; letter-spacing: 0; }
.plan-drag-handle:active { cursor: grabbing; }
.treatment-plan-item.is-dragging { opacity: .55; }
.treatment-plan-item.is-drag-target { box-shadow: inset 0 3px 0 var(--primary); }

.clinical-plan-alerts {
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 1px solid #d99b32;
    border-radius: var(--radius-control);
    background: #fff7e6;
    color: #714b0b;
}

.clinical-plan-alerts p {
    margin: 6px 0 0;
}

.treatment-proposals-panel {
    margin-bottom: 16px;
}

.treatment-plan-main {
    margin-bottom: 16px;
}

.plan-section-count {
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.treatment-proposal-groups,
.treatment-proposal-group {
    display: grid;
    gap: 14px;
}

.treatment-proposal-group + .treatment-proposal-group {
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.treatment-proposal-group {
    grid-template-columns: minmax(210px, .42fr) minmax(0, 1.58fr);
    align-items: start;
}

.treatment-proposal-diagnosis {
    display: flex;
    align-items: center;
    gap: 10px;
}

.treatment-proposal-options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.treatment-proposal-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
}

.treatment-proposal-card.is-recomendado {
    border-color: rgba(11, 122, 134, .5);
}

.treatment-proposal-card.is-selected {
    box-shadow: 0 0 0 3px rgba(21, 148, 111, .12);
    border-color: #15946f;
}

.proposal-card-head,
.proposal-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.proposal-card-main {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.proposal-card-main .proposal-card-head {
    justify-content: flex-start;
}

.proposal-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    color: var(--muted);
    font-size: 12px;
}

.proposal-meta span + span::before {
    content: '·';
    margin-right: 12px;
    color: var(--line-strong);
}

.proposal-decision {
    display: grid;
    justify-items: end;
    gap: 6px;
    min-width: 104px;
}

.proposal-decision form { margin: 0; }
.proposal-decision .btn { min-height: 34px; padding: 6px 12px; }
.proposal-decision .link-button { padding: 3px 6px; font-size: 12px; }

.proposal-price {
    color: var(--ink);
    font-size: 18px;
}

.proposal-clinical-details {
    color: var(--muted);
    font-size: 12px;
}

.proposal-clinical-details > summary {
    width: fit-content;
    cursor: pointer;
    color: var(--primary);
    font-weight: 800;
}

.proposal-clinical-details[open] {
    display: grid;
    gap: 5px;
    padding-top: 3px;
}

.proposal-card-head span {
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}

.treatment-proposal-card p,
.treatment-proposal-card small {
    margin: 0;
    color: var(--muted);
}

.proposal-actions {
    justify-content: flex-start;
    margin-top: 4px;
}

.appointment-suggestions-panel {
    margin-bottom: 16px;
}

.appointment-suggestions-panel > summary {
    cursor: pointer;
    list-style: none;
}

.appointment-suggestions-panel > summary::-webkit-details-marker { display: none; }

.plan-details-chevron {
    color: var(--primary);
    font-size: 22px;
    transition: transform .16s ease;
}

.appointment-suggestions-panel[open] .plan-details-chevron {
    transform: rotate(180deg);
}

.clinical-rule-list {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}

.clinical-rule-list article {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 11px;
    border-left: 3px solid var(--primary);
    background: var(--surface-soft);
}

.clinical-rule-list article > div {
    display: grid;
    gap: 3px;
}

.plan-summary-card {
    display: grid;
    gap: 1px;
    min-height: 52px;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
}

.plan-summary-card span {
    color: var(--muted);
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
}

.plan-summary-card strong {
    font-size: 16px;
}

.plan-summary-balance {
    border-color: rgba(11, 122, 134, .38);
    background: var(--primary-soft);
}

.treatment-plan-list {
    display: grid;
    gap: 14px;
}

.treatment-plan-item {
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
    overflow: hidden;
}

.treatment-plan-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 16px;
}

.treatment-plan-head > div:first-child {
    display: grid;
    gap: 4px;
}

.plan-clinical-rationale {
    margin: 0 16px 12px;
    padding: 8px 10px;
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 12px;
}

.plan-clinical-rationale > summary {
    cursor: pointer;
    color: var(--primary-dark);
    font-weight: 850;
}

.plan-clinical-rationale > div {
    display: grid;
    gap: 5px;
    padding-top: 8px;
}

.plan-tooth-token {
    width: fit-content;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 12px;
    font-weight: 900;
}

.plan-status-stack {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.plan-status {
    height: fit-content;
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}

.status-aprobado, .payment-pagado { background: #E7F7F1; color: #0B7255; }
.status-rechazado { background: #FDECEC; color: #B42318; }
.payment-abono_parcial, .payment-saldo_pendiente { background: #FFF7E6; color: #9B5B00; }

.treatment-plan-money {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft);
}

.treatment-plan-money span {
    display: grid;
    gap: 3px;
    padding: 11px 16px;
    color: var(--muted);
    font-size: 11px;
}

.treatment-plan-money strong { color: var(--ink); font-size: 14px; }

.plan-item-details { padding: 13px 16px 16px; }
.plan-item-details > summary { color: var(--primary); font-weight: 850; }
.plan-item-details[open] > summary { margin-bottom: 16px; }

.plan-quick-actions,
.plan-payment-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 8px;
    margin-top: 14px;
}

.plan-quick-actions form { margin: 0; }

.plan-payment-zone {
    margin: 14px 0;
    padding: 14px;
    border-radius: var(--radius-control);
    background: var(--surface-soft);
}

.plan-payment-form label { min-width: 150px; flex: 1; }
.plan-payment-history { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.plan-payment-history span { padding: 5px 8px; border-radius: 6px; background: var(--surface); font-size: 12px; }
.plan-empty-state { display: grid; gap: 7px; }

@media (max-width: 980px) {
    .app-shell { grid-template-columns: 1fr; }
    .sidebar { position: static; }
    .nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .metric-grid, .grid-2, .grid-3, .grid-4, .settings-shell, .clinic-form, .agenda-layout, .clinical-grid, .odontogram-layout, .advanced-clinic-grid, .voice-grid, .odontogram-voice-console, .procedure-form-grid, .plan-item-form, .diagnosis-relation-form { grid-template-columns: 1fr; }
    .procedure-field-wide, .plan-field-wide { grid-column: auto; }
    .plan-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .topbar, .content { padding-left: 16px; padding-right: 16px; }
    .settings-content { padding: 20px; }
    .block-row { grid-template-columns: 1fr auto 1fr auto; }
    .permission-options { grid-template-columns: 1fr; }
    .inline-edit-form, .category-inline-form, .category-create-form { grid-template-columns: 1fr; }
    .agenda-controls { grid-template-columns: 1fr; }
    .agenda-controls-left, .agenda-controls-right, .agenda-date-title { justify-content: flex-start; flex-wrap: wrap; }
    .wizard-steps { grid-template-columns: 1fr; gap: 8px; }
    .wizard-step::after { display: none; }
    .odontogram-board { overflow-x: auto; justify-content: start; }
    .tooth-panel { position: static; }
    .advanced-odontogram { grid-template-columns: minmax(0, 1fr); }
    .arch-row { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .arch-gap { display: none; }
    .arch-group--deciduous { width: 100%; }
    .tooth-timeline-panel .panel-body { grid-template-columns: 1fr; }
    .tooth-timeline-panel .selected-tooth-card,
    .longitudinal-clinical-summary,
    .tooth-timeline { grid-column: 1; grid-row: auto; }
    .clinical-context-menu { left: 12px !important; right: 12px; top: 12px !important; width: auto; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
    .treatment-proposal-group { grid-template-columns: 1fr; }
    .plan-workspace-nav { align-items: stretch; flex-direction: column; }
    .plan-workspace-links { padding-bottom: 2px; }
}

@media (max-width: 640px) {
    .toolbar { align-items: stretch; flex-direction: column; }
    .toolbar form { width: 100% !important; }
    .nav { grid-template-columns: 1fr; }
    .content { padding-top: 18px; }
    .advanced-tabs {
        position: sticky;
        top: 6px;
        z-index: 25;
        flex-wrap: nowrap;
        overflow-x: auto;
        margin: 12px 0;
        padding: 6px;
        border: 1px solid var(--line);
        border-radius: var(--radius-panel);
        background: color-mix(in srgb, var(--surface) 94%, transparent);
        box-shadow: 0 6px 18px rgba(21, 33, 43, .08);
        scrollbar-width: thin;
    }
    .advanced-tabs button { flex: 0 0 auto; min-height: 40px; white-space: nowrap; }
    .advanced-clinic-page .advanced-clinic-toolbar {
        gap: 9px;
        padding: 10px;
    }
    .advanced-clinic-page .advanced-clinic-toolbar .toolbar-actions {
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
    }
    .advanced-clinic-page .advanced-clinic-toolbar .toolbar-actions .btn {
        flex: 0 0 auto;
    }
    .advanced-clinic-page .advanced-tabs-shell {
        top: 76px;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
        margin: 8px 0;
    }
    .advanced-clinic-page .advanced-tabs {
        position: static;
        top: auto;
        z-index: auto;
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }
    .advanced-clinic-page .advanced-tabs-actions {
        display: grid;
        grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
        width: 100%;
        padding: 5px 0 0;
        border-top: 1px solid var(--line);
        border-left: 0;
    }
    .advanced-clinic-page .advanced-tabs-actions[hidden] { display: none; }
    .advanced-clinic-page .advanced-tabs-actions .btn { width: 100%; }
    .advanced-clinic-page .advanced-panel-title {
        gap: 9px;
    }
    .advanced-clinic-page .odontogram-header-actions {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
    }
    .advanced-clinic-page .advanced-panel-title .odontogram-header-actions .btn {
        width: auto;
        min-height: 40px;
    }
    .advanced-clinic-page .advanced-controls {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }
    .advanced-clinic-page .advanced-controls label {
        min-width: 0;
    }
    .advanced-clinic-page .advanced-controls .btn {
        white-space: normal;
    }
    .advanced-clinic-page .odontogram-tools-disclosure > summary,
    .advanced-clinic-page .odontogram-secondary-disclosure > summary,
    .advanced-clinic-page .timeline-disclosure-summary {
        align-items: flex-start;
    }
    th, td { font-size: 13px; padding: 10px; }
    .patient-wizard { padding: 16px; }
    .wizard-actions { flex-direction: column; }
    .wizard-actions .btn { width: 100%; }
    .agenda-controls-right select, .agenda-controls-right select[multiple], .agenda-date-title input { width: 100%; max-width: none; }
    .agenda-board-wrap { max-height: none; min-height: 480px; overscroll-behavior: contain; }
    .agenda-board {
        min-width: calc(70px + (var(--dentist-count) * 220px));
        grid-template-columns: 64px repeat(var(--dentist-count), minmax(220px, 1fr));
    }
    .appointment-menu.open {
        position: fixed;
        inset: auto 12px 12px;
        z-index: 160;
        min-width: 0;
        padding: 10px;
        border-radius: 14px;
        box-shadow: 0 18px 48px rgba(21, 33, 43, .28);
    }
    .appointment-menu .link-button { min-height: 48px; padding: 11px 12px; font-size: 15px; }
    .appointment-action-button { min-height: 32px; padding-inline: 11px; }
    .clinical-question { grid-template-columns: 1fr; gap: 8px; padding: 14px; }
    .checkbox-grid { grid-template-columns: 1fr; }
    .tooth { width: 48px; }
    .tooth-svg { width: 44px; height: 44px; }
    .face-selector { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .advanced-panel-title { align-items: stretch; flex-direction: column; }
    .advanced-panel-title .btn { width: 100%; }
    .timeline-panel-header { align-items: stretch; flex-direction: column; }
    .xray-controls { grid-template-columns: 1fr; }
    .face-chip-grid,
    .quick-action-grid {
        grid-auto-flow: column;
        grid-auto-columns: minmax(92px, 1fr);
        grid-template-columns: none;
        overflow-x: auto;
        padding-bottom: 3px;
        scrollbar-width: thin;
    }
    .face-chip-grid { grid-auto-columns: minmax(72px, 1fr); }
    .context-meta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .context-primary-fields { grid-template-columns: 1fr; }
    .context-actions .btn { flex: 1 1 0; min-width: 0; }
    .clinical-state-summary { align-items: stretch; flex-direction: column; gap: 6px; }
    .clinical-state-origin { align-self: flex-start; }
    .plan-summary-grid, .treatment-plan-money { grid-template-columns: 1fr 1fr; }
    .advanced-tab-panel[data-advanced-panel="plan"] > .plan-summary-grid {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(128px, 42vw);
        grid-template-columns: none;
        overflow-x: auto;
        padding-bottom: 6px;
        scroll-snap-type: x proximity;
    }
    .plan-summary-card { min-height: 82px; padding: 12px; scroll-snap-align: start; }
    .plan-summary-card strong { font-size: 18px; }
    .plan-workspace-nav { top: 64px; padding: 9px 10px; }
    .plan-workspace-title span { display: none; }
    .plan-workspace-links a { min-height: 40px; }
    .treatment-proposal-card { grid-template-columns: 1fr; align-items: stretch; }
    .proposal-decision { grid-template-columns: 1fr auto auto; align-items: center; justify-items: stretch; min-width: 0; }
    .proposal-decision .btn { min-height: 42px; }
    .proposal-price { font-size: 16px; }
    .treatment-plan-head { align-items: flex-start; flex-direction: column; }
    .plan-status-stack { justify-content: flex-start; }
}

@media (max-width: 640px) {
    .sidebar {
        position: sticky;
        top: 0;
        z-index: 70;
        max-width: 100vw;
        padding: 8px 10px;
        overflow: hidden;
        box-shadow: 0 5px 18px rgba(21, 33, 43, .16);
    }
    .brand {
        display: flex;
        align-items: center;
        gap: 9px;
        margin: 0 0 6px;
        padding: 0 4px 6px;
    }
    .brand-mark { width: 31px; height: 31px; font-size: 11px; }
    .brand-name { font-size: 14px; }
    .brand span { display: none; }
    .nav {
        display: flex;
        gap: 5px;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: none;
    }
    .nav::-webkit-scrollbar,
    .patient-360-metrics::-webkit-scrollbar,
    .patient-plan-numbers::-webkit-scrollbar { display: none; }
    .patient-360-metrics,
    .patient-plan-numbers { scrollbar-width: none; }
    .nav a {
        flex: 0 0 auto;
        min-height: 35px;
        padding: 7px 10px;
        font-size: 12px;
        white-space: nowrap;
    }
    .topbar { min-height: 56px; padding-inline: 15px; }
    .topbar h1 { font-size: 20px; }
    .system-pill { padding-inline: 8px; font-size: 10px; }
}

/* Daily operational control center */
.daily-control { display: grid; gap: 16px; }
.daily-control-eyebrow,.daily-section-heading > div > span { display: block; margin-bottom: 4px; color: var(--primary-dark); font-size: 10px; font-weight: 850; letter-spacing: .09em; }

.daily-section { scroll-margin-top: 90px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-soft); }
.daily-section-heading {
    display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 67px; padding: 13px 17px;
    border-bottom: 1px solid var(--line); background: var(--surface-soft);
}
.daily-section-heading h2 { margin: 0; font-size: 17px; line-height: 1.2; }
.daily-section-heading > a { color: var(--primary-dark); font-size: 11px; font-weight: 800; }
.daily-section-heading > small { color: var(--muted); font-size: 11px; text-align: right; }
.daily-section-heading > b { display: grid; min-width: 31px; min-height: 29px; place-items: center; padding: 4px 8px; border-radius: 999px; background: var(--primary-soft); color: var(--primary-dark); font-size: 12px; }
.daily-section-heading.compact { min-height: 63px; }

.daily-state-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; border-bottom: 1px solid var(--line); background: var(--line); }
.daily-state-strip a { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 10px 12px; background: var(--surface); }
.daily-state-strip strong { font-size: 17px; }
.daily-state-strip span { overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.daily-state-strip a.is-success strong { color: var(--success); }
.daily-state-strip a.is-danger strong { color: var(--danger); }
.daily-state-strip a.is-warning strong { color: var(--warning); }
.daily-state-strip a.is-info strong { color: var(--info); }
.daily-state-strip a.is-primary strong { color: var(--primary); }

.daily-agenda-list > article { display: grid; grid-template-columns: 53px 34px minmax(180px, 1fr) auto minmax(88px, auto); align-items: center; gap: 11px; min-height: 62px; padding: 9px 16px; border-bottom: 1px solid var(--line); }
.daily-agenda-list > article:last-child { border-bottom: 0; }
.daily-agenda-list > article:hover,.daily-compact-list article:hover { background: rgba(230, 246, 247, .38); }
.daily-agenda-list time { color: var(--ink); font-family: var(--font-data); font-size: 12px; font-weight: 800; }
.daily-avatar { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary-dark); font-size: 10px; font-weight: 850; }
.daily-row-copy { display: grid; min-width: 0; }
.daily-row-copy strong,.daily-compact-list article > div strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.daily-row-copy small,.daily-compact-list article > div small { overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.daily-status { padding: 4px 7px; border-radius: 999px; font-size: 9px; font-weight: 850; white-space: nowrap; }
.daily-status.is-success { background: var(--success-soft); color: var(--success); }
.daily-status.is-danger { background: var(--danger-soft); color: var(--danger); }
.daily-status.is-warning { background: var(--warning-soft); color: var(--warning); }
.daily-status.is-info { background: var(--info-soft); color: var(--info); }
.daily-status.is-primary { background: var(--primary-soft); color: var(--primary-dark); }
.daily-status.is-neutral { background: #EEF2F4; color: var(--muted); }
.daily-row-action { justify-self: end; }
.daily-row-action a,.daily-row-action button,.daily-compact-list article > a,.daily-compact-list article > form button {
    min-height: 29px; padding: 5px 9px; border: 1px solid #BFD6D8; border-radius: 6px; background: #FFFFFF;
    color: var(--primary-dark); cursor: pointer; font-size: 10px; font-weight: 800; white-space: nowrap;
}
.daily-row-action button:hover,.daily-compact-list article > form button:hover { background: var(--primary-soft); }

.daily-two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.daily-compact-list article { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 57px; padding: 9px 14px; border-bottom: 1px solid var(--line); }
.daily-compact-list article:last-child { border-bottom: 0; }
.daily-compact-list article > div { display: grid; min-width: 0; }
.daily-compact-list article > a.is-whatsapp { border-color: #A8D8C4; color: var(--success); }
.daily-list-dot { width: 9px; height: 9px; margin-left: 3px; border-radius: 50%; background: var(--subtle); box-shadow: 0 0 0 4px #EEF2F4; }
.daily-list-dot.is-warning { background: var(--warning); box-shadow: 0 0 0 4px var(--warning-soft); }
.daily-list-dot.is-primary { background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.daily-list-dot.is-danger { background: var(--danger); box-shadow: 0 0 0 4px var(--danger-soft); }
.daily-list-dot.is-opportunity { background: var(--accent); box-shadow: 0 0 0 4px #FAEEE8; }
.daily-priority { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 6px; background: #EEF2F4; color: var(--muted); font-size: 9px; font-weight: 900; }
.daily-priority.is-urgente { background: var(--danger-soft); color: var(--danger); }
.daily-priority.is-alta { background: var(--warning-soft); color: var(--warning); }
.daily-priority.is-media { background: var(--primary-soft); color: var(--primary-dark); }

.daily-empty { display: grid; justify-items: start; gap: 3px; padding: 22px; color: var(--muted); }
.daily-empty strong { color: var(--ink); font-size: 13px; }
.daily-empty span { font-size: 11px; }
.daily-empty a { margin-top: 7px; color: var(--primary-dark); font-size: 11px; font-weight: 800; }
.daily-empty.small { min-height: 112px; align-content: center; padding: 18px; }

.daily-loyalty-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 0; }
.daily-loyalty-grid > div { min-width: 0; }
.daily-loyalty-grid > div + div { border-left: 1px solid var(--line); }
.daily-loyalty-grid h3,.daily-cash-detail h3 { display: flex; justify-content: space-between; gap: 10px; margin: 0; padding: 12px 15px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 12px; }
.daily-loyalty-grid h3 span { color: var(--muted); font-size: 9px; font-weight: 650; }
.daily-birthday-date { display: grid; width: 29px; place-items: center; color: var(--accent); font-family: var(--font-data); font-size: 13px; font-weight: 850; line-height: 1; }
.daily-birthday-date small { margin-top: 3px; font-size: 8px; }

.daily-income-total { color: var(--success); font-size: 22px; }
.daily-profit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.daily-profit-grid article { display: grid; gap: 3px; padding: 16px; border-right: 1px solid var(--line); }
.daily-profit-grid article:last-child { border-right: 0; }
.daily-profit-grid span { color: var(--muted); font-size: 10px; font-weight: 700; }
.daily-profit-grid strong { font-size: 21px; }
.daily-profit-grid small { color: var(--muted); font-size: 9px; }
.daily-cash-detail { display: grid; grid-template-columns: .8fr 1.2fr; }
.daily-cash-detail > div + div { border-left: 1px solid var(--line); }
.daily-cash-detail p { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; padding: 10px 15px; border-bottom: 1px solid var(--line); font-size: 11px; }
.daily-cash-detail p small { color: var(--muted); }
.daily-cash-detail ul { display: grid; gap: 8px; margin: 0; padding: 14px 18px 16px 35px; color: var(--muted); font-size: 11px; }
.daily-cash-detail li strong { color: var(--ink); }

@media (max-width: 900px) {
    .daily-two-columns,.daily-loyalty-grid,.daily-cash-detail { grid-template-columns: 1fr; }
    .daily-loyalty-grid > div + div,.daily-cash-detail > div + div { border-top: 1px solid var(--line); border-left: 0; }
    .daily-state-strip { grid-auto-flow: column; grid-auto-columns: minmax(112px, 1fr); grid-template-columns: none; overflow-x: auto; scrollbar-width: none; }
    .daily-state-strip::-webkit-scrollbar { display: none; }
    .daily-profit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .daily-profit-grid article:nth-child(2) { border-right: 0; }
    .daily-profit-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 640px) {
    .daily-section-heading { align-items: flex-start; min-height: 61px; padding: 12px 13px; }
    .daily-section-heading h2 { font-size: 15px; }
    .daily-section-heading > small { max-width: 130px; }
    .daily-agenda-list > article { grid-template-columns: 42px 31px minmax(0, 1fr) auto; gap: 8px; padding: 10px 12px; }
    .daily-agenda-list .daily-status { grid-column: 3; justify-self: start; }
    .daily-agenda-list .daily-row-action { grid-column: 4; grid-row: 1 / span 2; }
    .daily-avatar { width: 31px; height: 31px; }
    .daily-compact-list article { padding-inline: 12px; }
    .daily-profit-grid { grid-template-columns: 1fr; }
    .daily-profit-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
    .daily-profit-grid article:last-child { border-bottom: 0; }
}
@media (max-width: 400px) {
    .daily-agenda-list > article { grid-template-columns: 40px minmax(0, 1fr) auto; }
    .daily-agenda-list .daily-avatar { display: none; }
    .daily-agenda-list .daily-status { grid-column: 2; }
    .daily-agenda-list .daily-row-action { grid-column: 3; }
}

/* Task-focused daily control center */
.daily-control-redesign { gap: 12px; }
.daily-command-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    padding: 3px 1px 2px;
}
.daily-command-date { min-width: 0; }
.daily-command-date h2 { margin: 1px 0 2px; font-size: clamp(21px, 2vw, 28px); line-height: 1.12; }
.daily-command-date p { margin: 0; color: var(--muted); font-size: 11px; }
.daily-command-date p strong { color: var(--primary-dark); }
.daily-command-actions { display: flex; align-items: center; gap: 8px; }
.daily-command-actions .btn { min-height: 38px; padding: 8px 13px; font-size: 11px; }
.daily-more-actions { position: relative; }
.daily-more-actions > summary { display: inline-flex; align-items: center; gap: 7px; list-style: none; cursor: pointer; }
.daily-more-actions > summary::-webkit-details-marker { display: none; }
.daily-more-actions > nav {
    position: absolute; z-index: 20; top: calc(100% + 7px); right: 0; display: grid; min-width: 205px; padding: 6px;
    border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 14px 32px rgba(21, 33, 43, .14);
}
.daily-more-actions > nav a { padding: 9px 10px; border-radius: 6px; color: var(--ink); font-size: 11px; font-weight: 750; }
.daily-more-actions > nav a:hover { color: var(--primary-dark); background: var(--primary-soft); }

.daily-priority-center { overflow: hidden; border: 1px solid #cbdfe1; border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-soft); }
.daily-priority-center > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 14px; border-bottom: 1px solid var(--line); background: #f8fbfb; }
.daily-priority-center > header span { display: block; margin-bottom: 2px; color: var(--primary-dark); font-size: 9px; font-weight: 850; letter-spacing: .09em; }
.daily-priority-center > header h2 { margin: 0; font-size: 16px; }
.daily-priority-center > header > b { padding: 5px 9px; border-radius: 99px; color: #8a5a0a; background: var(--warning-soft); font-size: 10px; }
.daily-priority-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.daily-priority-list > a { position: relative; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 66px; padding: 10px 12px; background: #fff; }
.daily-priority-list > a:hover { background: #f7fbfb; }
.daily-priority-list > a > strong { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; color: var(--primary-dark); background: var(--primary-soft); font-size: 15px; }
.daily-priority-list > a.is-warning > strong { color: #8a5a0a; background: var(--warning-soft); }
.daily-priority-list > a.is-danger > strong { color: var(--danger); background: var(--danger-soft); }
.daily-priority-list > a.is-opportunity > strong { color: #a34c2c; background: #faeee8; }
.daily-priority-list > a > span { display: grid; min-width: 0; }
.daily-priority-list > a > span b { overflow: hidden; color: var(--ink); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.daily-priority-list > a > span small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.daily-priority-list > a > i { color: var(--primary-dark); font-size: 9px; font-style: normal; font-weight: 800; }
.daily-priority-clear { display: flex; align-items: center; gap: 11px; min-height: 66px; padding: 11px 14px; }
.daily-priority-clear > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; color: var(--success); background: var(--success-soft); font-weight: 900; }
.daily-priority-clear > div { display: grid; }
.daily-priority-clear strong { font-size: 12px; }
.daily-priority-clear small { color: var(--muted); font-size: 10px; }
.daily-clear-status { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 7px 14px; border-top: 1px solid var(--line); color: var(--muted); background: #fbfdfd; font-size: 9px; }
.daily-clear-status b { padding: 3px 7px; border-radius: 99px; color: var(--success); background: var(--success-soft); font-size: 9px; }

.daily-snapshot { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); box-shadow: var(--shadow-soft); }
.daily-snapshot > a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 12px; min-height: 64px; padding: 9px 13px; border-right: 1px solid var(--line); }
.daily-snapshot > a:last-child { border-right: 0; }
.daily-snapshot > a:hover { background: #f7fbfb; }
.daily-snapshot span { color: var(--muted); font-size: 10px; font-weight: 750; }
.daily-snapshot strong { grid-row: 1 / span 2; grid-column: 2; color: var(--ink); font-size: 20px; white-space: nowrap; }
.daily-snapshot small { color: var(--muted); font-size: 9px; }

.daily-agenda-primary { border-color: #c4dfe1; }
.daily-agenda-primary .daily-section-heading { min-height: 56px; padding-block: 10px; }
.daily-state-strip.is-compact { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
.daily-agenda-empty { grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; justify-items: stretch; min-height: 78px; padding: 12px 15px; }
.daily-agenda-empty > div { display: grid; gap: 2px; }
.daily-agenda-empty > .btn { justify-self: end; margin: 0; }
.daily-empty-icon { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: var(--success); background: var(--success-soft); font-weight: 900; }

.daily-module-workspace { display: grid; gap: 0; }
.daily-module-tabs { display: flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-bottom: 0; border-radius: 11px 11px 0 0; background: #f3f7f8; }
.daily-module-tabs button { display: inline-flex; min-height: 35px; align-items: center; gap: 7px; padding: 7px 13px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; font-size: 11px; font-weight: 800; }
.daily-module-tabs button:hover { color: var(--primary-dark); background: #fff; }
.daily-module-tabs button[aria-selected="true"] { color: var(--primary-dark); background: #fff; box-shadow: 0 1px 5px rgba(21, 33, 43, .09); }
.daily-module-tabs button span { display: inline-grid; min-width: 20px; height: 20px; place-items: center; padding: 0 5px; border-radius: 99px; color: var(--muted); background: #e6edef; font-size: 9px; }
.daily-module-tabs button[aria-selected="true"] span { color: var(--primary-dark); background: var(--primary-soft); }
.daily-module-panel { display: grid; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 0 0 11px 11px; background: #f7fafb; }
.daily-module-panel[hidden] { display: none !important; }
.daily-module-panel > .daily-section { box-shadow: none; }
.daily-module-panel .daily-two-columns { gap: 12px; }
.daily-module-panel > .daily-section + .daily-section { margin-top: 0; }

.daily-control-redesign button[aria-busy="true"] { cursor: wait; opacity: .68; }

@media (max-width: 1180px) {
    .daily-priority-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .daily-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .daily-snapshot > a:nth-child(2) { border-right: 0; }
    .daily-snapshot > a:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
}
@media (max-width: 640px) {
    .daily-command-bar { align-items: stretch; flex-direction: column; gap: 11px; }
    .daily-command-actions { display: grid; grid-template-columns: 1fr auto; }
    .daily-command-actions > .btn { justify-content: center; }
    .daily-more-actions > summary { justify-content: center; }
    .daily-more-actions > nav { right: 0; left: auto; }
    .daily-priority-list { grid-template-columns: 1fr; }
    .daily-priority-list > a { min-height: 61px; }
    .daily-snapshot { grid-template-columns: 1fr 1fr; }
    .daily-snapshot > a { border-bottom: 1px solid var(--line); }
    .daily-snapshot > a:nth-last-child(-n+2) { border-bottom: 0; }
    .daily-snapshot > a:nth-child(even) { border-right: 0; }
    .daily-agenda-empty { grid-template-columns: 31px minmax(0, 1fr); }
    .daily-agenda-empty > .btn { grid-column: 1 / -1; width: 100%; }
    .daily-module-tabs { overflow-x: auto; }
    .daily-module-tabs button { flex: 1 0 auto; }
    .daily-module-panel { padding: 8px; }
}
@media (max-width: 400px) {
    .daily-command-actions { grid-template-columns: 1fr; }
    .daily-more-actions > summary { width: 100%; }
    .daily-more-actions > nav { right: auto; left: 0; width: 100%; }
    .daily-snapshot { grid-template-columns: 1fr; }
    .daily-snapshot > a,.daily-snapshot > a:nth-child(even) { border-right: 0; border-bottom: 1px solid var(--line); }
    .daily-snapshot > a:last-child { border-bottom: 0; }
}

/* Complete appointment flow */
.appointment-card[draggable="true"] { cursor: grab; }
.appointment-card[draggable="true"]:active { cursor: grabbing; }
.appointment-card.is-dragging { z-index: 60; opacity: .5; transform: rotate(1deg) scale(.98); }
.appointment-card.is-saving { opacity: .58; pointer-events: none; }
.agenda-slot.is-drop-target { background: rgba(11, 122, 134, .15); box-shadow: inset 0 0 0 2px var(--primary); }
.agenda-slot.is-drop-target::after { content: "Mover aquí"; color: var(--primary-dark); font-size: 9px; font-weight: 850; }
.appointment-patient-link { overflow: hidden; color: #20313D; font-size: 13px; font-weight: 800; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.appointment-patient-link:hover { color: var(--primary-dark); text-decoration: underline; }
.appointment-clinical-flags { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 2px; }
.appointment-clinical-flags span { padding: 2px 5px; border-radius: 99px; font-size: 8px; font-weight: 850; }
.appointment-clinical-flags .is-debt { background: var(--danger-soft); color: var(--danger); }
.appointment-clinical-flags .is-consent { background: var(--warning-soft); color: var(--warning); }
.appointment-card.is-short .appointment-clinical-flags { display: none; }
.appointment-card.is-short { grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 5px; }
.appointment-card.is-short .appointment-card-head { grid-column: 1 / -1; }
.appointment-card.is-short > strong,.appointment-card.is-short > .appointment-patient-link { grid-column: 1; grid-row: 2; min-height: 12px; overflow: hidden; font-size: 11px; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap; }
.appointment-card.is-short > .appointment-quick-action { grid-column: 2; grid-row: 2; align-self: center; margin: 0; }
.appointment-timeline[open] { position: relative; z-index: 55; min-width: 240px; padding: 7px; border: 1px solid var(--line); border-radius: 7px; background: #fff; box-shadow: var(--shadow-soft); }
.appointment-timeline div { position: relative; gap: 0; }
.appointment-timeline div::before { content: ""; position: absolute; top: 7px; bottom: 7px; left: 4px; width: 1px; background: var(--line); }
.appointment-timeline div span { position: relative; display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; align-items: start; gap: 5px; padding: 4px 0; }
.appointment-timeline div span i { z-index: 1; width: 9px; height: 9px; margin-top: 2px; border: 2px solid #fff; border-radius: 50%; background: var(--event-color); box-shadow: 0 0 0 1px var(--event-color); }
.appointment-timeline div span b { color: var(--ink); font-size: 9px; font-weight: 700; }

.appointment-pending-panel { min-height: 112px; overflow: hidden; border: 1px solid #BFDDE0; border-radius: 8px; background: #F7FBFB; }
.appointment-pending-panel:has(.appointment-pending-option) { min-height: 279px; }
.appointment-pending-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; border-bottom: 1px solid #D8E8E9; }
.appointment-pending-head > div { display: grid; }
.appointment-pending-head strong { font-size: 13px; }
.appointment-pending-head span { color: var(--muted); font-size: 10px; }
.appointment-pending-head b { display: grid; min-width: 27px; height: 27px; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary-dark); font-size: 11px; }
.appointment-pending-list { display: grid; max-height: 220px; overflow-y: auto; }
.appointment-pending-option { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 9px; margin: 0; padding: 10px 12px; border-bottom: 1px solid #E1ECEC; cursor: pointer; }
.appointment-pending-option:last-child { border-bottom: 0; }
.appointment-pending-option:hover { background: var(--primary-soft); }
.appointment-pending-option > span { display: grid; min-width: 0; }
.appointment-pending-option strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.appointment-pending-option small { color: var(--muted); font-size: 9px; }
.appointment-pending-option em { padding: 3px 6px; border-radius: 99px; background: #fff; color: var(--primary-dark); font-size: 8px; font-style: normal; font-weight: 800; }
.appointment-pending-option.is-scheduled { opacity: .66; }
.appointment-pending-option.is-scheduled em { color: var(--warning); }
.appointment-pending-empty { display: grid; gap: 2px; padding: 17px 13px; color: var(--muted); font-size: 11px; }
.appointment-pending-empty strong { color: var(--success); }
.appointment-pending-empty span { font-size: 10px; }
.appointment-outcome-modal { width: min(470px, calc(100vw - 24px)); }
.appointment-outcome-context { margin-bottom: 14px; padding: 10px 12px; border-radius: 7px; background: var(--surface-tint); color: var(--primary-dark); font-size: 12px; font-weight: 800; }

.settings-page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.settings-page-heading h2 { margin: 2px 0 4px; }
.settings-page-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.settings-eyebrow { color: var(--primary-dark); font-size: 10px; font-weight: 850; letter-spacing: .09em; }
.system-pill.is-muted { background: #EEF2F4; color: var(--muted); }
.whatsapp-settings-form { display: grid; gap: 14px; }
.settings-card { overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: var(--shadow-soft); }
.settings-card-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 17px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.settings-card-head > div { display: flex; align-items: center; gap: 9px; }
.settings-card-head > div > span { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary-dark); font-size: 9px; font-weight: 850; }
.settings-card-head h3 { margin: 0; font-size: 15px; }
.settings-card-head p { margin: 0; color: var(--muted); font-size: 10px; text-align: right; }
.settings-card-body { display: grid; gap: 16px; padding: 18px; }
.settings-toggle-row { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; margin: 0; padding: 13px; border: 1px solid #CBE2E4; border-radius: 8px; background: var(--primary-soft); cursor: pointer; }
.settings-toggle-row > span { display: grid; }
.settings-toggle-row strong { font-size: 12px; }
.settings-toggle-row small,.field-help { color: var(--muted); font-size: 10px; }
.inline-check { display: flex; align-items: center; gap: 8px; margin-top: 7px; font-size: 10px; font-weight: 650; }
.whatsapp-template-stack textarea { min-height: 86px; font-size: 12px; }
.whatsapp-variable-guide { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 11px; border-radius: 7px; background: var(--surface-tint); }
.whatsapp-variable-guide strong { width: 100%; margin-bottom: 3px; font-size: 10px; }
.whatsapp-variable-guide code { padding: 3px 6px; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--primary-dark); font-size: 9px; }
.settings-save-bar { position: sticky; bottom: 12px; z-index: 12; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 15px; border: 1px solid #BFDDE0; border-radius: 9px; background: rgba(255,255,255,.94); box-shadow: 0 12px 34px rgba(21,33,43,.14); backdrop-filter: blur(12px); }
.settings-save-bar > div { display: grid; }
.settings-save-bar strong { font-size: 11px; }
.settings-save-bar span { color: var(--muted); font-size: 9px; }
.daily-compact-list article > form button.is-whatsapp { border-color: #A8D8C4; color: var(--success); }

@media (max-width: 720px) {
    .settings-page-heading,.settings-card-head,.settings-save-bar { align-items: stretch; flex-direction: column; }
    .settings-card-head p { text-align: left; }
    .settings-save-bar .btn { width: 100%; }
    .appointment-card[draggable="true"] { cursor: default; }
}

/* Consent responsive containment */
.consent-workspace { min-width:0; }
.consent-workspace>* { min-width:0; max-width:100%; }
.consent-layout,.consent-signing-column { min-width:0; }
.consent-layout>* { min-width:0; }

@media (max-width:1000px) {
    .consent-layout { grid-template-columns:minmax(0,1fr); }
    .consent-signing-column { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:700px) {
    .consent-workspace-hero>div,.consent-integrity>div,.consent-integrity>div>div { min-width:0; max-width:100%; }
    .consent-workspace-hero p,.consent-integrity small { overflow-wrap:anywhere; }
    .consent-integrity code { width:100%; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
    .consent-layout,.consent-signing-column { grid-template-columns:minmax(0,1fr); }
    .consent-document { min-width:0; overflow:hidden; }
    .consent-document-heading h3,.consent-seal strong { overflow-wrap:anywhere; }
    .consent-parties,.consent-delivery-actions,.consent-portal-signatures { grid-template-columns:minmax(0,1fr); }
    .consent-section { grid-template-columns:34px minmax(0,1fr); }
    .consent-sign-card,.consent-sign-card form,.consent-sign-card label { min-width:0; max-width:100%; }
    .consent-sign-card input,.consent-sign-card select { max-width:100%; }
    .consent-portal-document { overflow:hidden; }
}

/* Privacy, access control and audit */
.privacy-masked { color: #4F626C; font-family: var(--font-data); font-size: 11px; letter-spacing: .02em; }
.security-user-badge { display: flex; align-items: center; gap: 8px; padding-right: 10px; border-right: 1px solid var(--line); }
.security-user-badge > span { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 50%; background: linear-gradient(145deg, var(--primary-dark), var(--primary)); color: #fff; font-size: 12px; font-weight: 850; }
.security-user-badge > div { display: grid; min-width: 0; }
.security-user-badge strong { max-width: 180px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.security-user-badge small { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.topbar-meta form { margin: 0; }
.security-top-action,.security-text-button { border: 0; background: transparent; color: var(--primary-dark); cursor: pointer; font: inherit; font-size: 10px; font-weight: 800; }
.security-top-action { padding: 7px 9px; border: 1px solid #C8DCDD; border-radius: 6px; }
.security-top-action:hover { border-color: var(--primary); background: var(--primary-soft); }
.security-top-action.is-quiet { border-color: transparent; color: var(--muted); }

.security-auth-page { min-height: 100vh; margin: 0; background: radial-gradient(circle at 14% 18%, rgba(31,139,143,.18), transparent 32%), linear-gradient(145deg, #EFF7F6 0%, #F7F9FA 52%, #E9F2F1 100%); color: var(--ink); }
.security-auth-shell { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, 460px); width: min(1080px, calc(100% - 40px)); min-height: 620px; margin: max(28px, 6vh) auto; overflow: hidden; border: 1px solid rgba(19,85,91,.16); border-radius: 22px; background: rgba(255,255,255,.78); box-shadow: 0 30px 80px rgba(19,56,65,.16); backdrop-filter: blur(16px); }
.security-auth-brand { display: flex; flex-direction: column; justify-content: flex-end; min-width: 0; padding: clamp(36px, 7vw, 80px); background: linear-gradient(155deg, rgba(15,75,84,.97), rgba(11,111,116,.91)), radial-gradient(circle, #5ECDC8, transparent); color: #fff; }
.security-auth-mark { display: grid; width: 58px; height: 58px; margin-bottom: auto; place-items: center; border: 1px solid rgba(255,255,255,.45); border-radius: 17px; background: rgba(255,255,255,.12); font-size: 18px; font-weight: 900; }
.security-auth-brand p { margin: 0 0 12px; color: #BDE5E2; font-size: 11px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.security-auth-brand h1 { max-width: 640px; margin: 0 0 16px; color: #fff; font-size: clamp(30px, 4vw, 50px); line-height: 1.03; }
.security-auth-brand > span:last-child { max-width: 540px; color: #D7EEEC; font-size: 14px; line-height: 1.7; }
.security-auth-card { display: flex; flex-direction: column; justify-content: center; gap: 22px; min-width: 0; padding: clamp(32px, 5vw, 62px); background: rgba(255,255,255,.94); }
.security-auth-card h1,.security-auth-card h2 { margin: 6px 0 8px; font-size: 27px; }
.security-auth-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.security-auth-card > small { color: var(--muted); font-size: 9px; line-height: 1.5; }
.security-kicker { color: var(--primary-dark); font-size: 9px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.security-auth-form { display: grid; gap: 15px; }
.security-auth-form label:not(.security-check),.security-policy-form > label:not(.security-check) { display: grid; gap: 6px; color: #42565F; font-size: 10px; font-weight: 800; }
.security-auth-form input { min-height: 44px; }
.security-auth-form .btn { min-height: 43px; margin-top: 4px; }
.security-check { display: flex; align-items: flex-start; gap: 9px; margin: 0; color: var(--muted); cursor: pointer; font-size: 10px; font-weight: 650; line-height: 1.4; }
.security-check input { flex: 0 0 auto; width: 16px; min-height: 16px; margin-top: 0; }
.security-lock-shell { display: grid; min-height: 100vh; place-items: center; padding: 20px; }
.security-lock-card { width: min(430px, 100%); border: 1px solid rgba(19,85,91,.15); border-radius: 18px; box-shadow: 0 24px 70px rgba(19,56,65,.15); text-align: center; }
.security-lock-card .security-auth-form { text-align: left; }
.security-lock-icon { display: grid; width: 54px; height: 54px; margin: 0 auto; place-items: center; border-radius: 50%; background: var(--primary-soft); color: var(--primary-dark); font-size: 25px; }
.security-text-button { margin: 0 auto; color: var(--muted); text-decoration: underline; }

.security-settings-layout { align-items: start; }
.security-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 15px; padding: 22px 24px; overflow: hidden; border: 1px solid #BFDCDD; border-radius: 11px; background: linear-gradient(125deg, #EFF9F8, #FFF); }
.security-hero h2 { margin: 5px 0 7px; font-size: 23px; }
.security-hero p { max-width: 680px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.security-shield { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid #A9D9C5; border-radius: 99px; background: #EAF8F2; color: #08714F; font-size: 9px; font-weight: 850; }
.security-shield i { width: 7px; height: 7px; border-radius: 50%; background: #15A36E; box-shadow: 0 0 0 4px rgba(21,163,110,.13); }
.security-policy-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 14px; margin-bottom: 14px; }
.security-policy-card { min-width: 0; margin: 0; }
.security-policy-card .panel-header > div { display: grid; }
.security-policy-card .panel-header span { color: var(--muted); font-size: 9px; }
.security-policy-form { display: grid; gap: 14px; }
.security-rule-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; padding: 0; background: var(--line); }
.security-rule-list > span { display: grid; grid-template-columns: 27px minmax(0, 1fr); grid-template-rows: auto auto; gap: 1px 9px; padding: 14px; background: #fff; }
.security-rule-list i { grid-row: 1 / span 2; display: grid; width: 25px; height: 25px; place-items: center; border-radius: 7px; background: var(--primary-soft); color: var(--primary-dark); font-size: 9px; font-style: normal; font-weight: 900; }
.security-rule-list b { font-size: 10px; }
.security-rule-list small { color: var(--muted); font-size: 8px; line-height: 1.45; }
.security-audit-panel { overflow: hidden; }
.security-audit-heading > div { display: grid; }
.security-audit-heading span { color: var(--muted); font-size: 9px; }
.security-audit-filters { display: grid; grid-template-columns: 1fr 1fr 1fr .8fr .8fr auto; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--line); background: #F8FAFA; }
.security-audit-filters input,.security-audit-filters select { min-width: 0; font-size: 10px; }
.security-audit-list { display: grid; }
.security-audit-event { border-bottom: 1px solid var(--line); }
.security-audit-event summary { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto auto; align-items: center; gap: 11px; padding: 12px 15px; cursor: pointer; list-style: none; }
.security-audit-event summary::-webkit-details-marker { display: none; }
.security-audit-event summary:hover { background: #F7FBFB; }
.security-audit-event summary > div { display: grid; min-width: 0; }
.security-audit-event summary strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.security-audit-event summary small { color: var(--muted); font-size: 8px; }
.security-audit-dot { width: 8px; height: 8px; border-radius: 50%; background: #71838B; }
.security-audit-dot.is-seguridad { background: #6A5ACD; }.security-audit-dot.is-documental { background: #168B91; }.security-audit-dot.is-clinica { background: #237BC1; }.security-audit-dot.is-financiera { background: #D08A19; }.security-audit-dot.is-administrativa { background: #596A72; }
.security-audit-category { padding: 3px 6px; border-radius: 99px; background: #EDF2F3; color: #52646C; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.security-integrity { color: var(--muted); font-size: 8px; font-weight: 850; }.security-integrity.is-valid { color: var(--success); }.security-integrity.is-invalid { color: var(--danger); }
.security-audit-detail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 14px 35px 16px; border-top: 1px dashed var(--line); background: #FAFCFC; }
.security-audit-detail span { display: grid; min-width: 0; color: var(--muted); font-size: 8px; overflow-wrap: anywhere; }.security-audit-detail b { color: var(--ink); font-size: 8px; text-transform: uppercase; }
.security-audit-detail pre,.security-audit-detail code { grid-column: 1 / -1; max-width: 100%; margin: 0; overflow: auto; color: #52646C; font-size: 8px; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 1050px) {
    .security-audit-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
    .security-settings-layout .settings-nav { display: flex; gap: 6px; padding: 9px; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); scrollbar-width: none; scroll-snap-type: x proximity; }
    .security-settings-layout .settings-nav::-webkit-scrollbar { display: none; }
    .security-settings-layout .settings-nav a { flex: 0 0 auto; min-height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 10px; scroll-snap-align: start; }
    .security-settings-layout .settings-nav a.active { border-color: var(--primary); background: var(--primary-soft); }
    .security-settings-layout .settings-nav-mark { width: 6px; height: 6px; }
}
@media (max-width: 800px) {
    .security-auth-shell { grid-template-columns: 1fr; width: min(560px, calc(100% - 28px)); }
    .security-auth-brand { min-height: 300px; padding: 34px; }
    .security-auth-mark { margin-bottom: 60px; }
    .security-policy-grid { grid-template-columns: 1fr; }
    .security-audit-event summary { grid-template-columns: 9px minmax(0, 1fr) auto; }
    .security-integrity { grid-column: 2; }
    .security-audit-detail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .security-user-badge > div,.security-top-action.is-quiet { display: none; }
    .security-user-badge { padding-right: 4px; border-right: 0; }
    .security-top-action { padding: 6px 7px; font-size: 8px; }
    .security-auth-shell { margin: 14px auto; border-radius: 15px; }
    .security-auth-brand { min-height: 235px; padding: 26px; }
    .security-auth-mark { width: 45px; height: 45px; margin-bottom: 38px; border-radius: 13px; }
    .security-auth-brand h1 { font-size: 29px; }
    .security-auth-card { padding: 30px 25px; }
    .security-hero { align-items: flex-start; flex-direction: column; padding: 18px; }
    .security-rule-list { grid-template-columns: 1fr; }
    .security-audit-filters { grid-template-columns: 1fr 1fr; }
    .security-audit-filters .btn { grid-column: 1 / -1; }
    .security-audit-category { display: none; }
    .security-audit-event summary { padding-inline: 11px; }
    .security-audit-detail { grid-template-columns: 1fr; padding-inline: 29px 12px; }
    .patient-privacy-table,.patient-privacy-table tbody,.patient-privacy-table tr,.patient-privacy-table td { display: block; width: 100%; }
    .patient-privacy-table thead { display: none; }
    .patient-privacy-table tbody { display: grid; gap: 10px; padding: 10px; }
    .patient-privacy-table tr { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 4px 12px rgba(25,47,56,.05); }
    .patient-privacy-table td { display: grid; gap: 2px; min-width: 0; padding: 10px 12px; border: 0; border-bottom: 1px solid #E8EEEE; overflow-wrap: anywhere; }
    .patient-privacy-table td::before { content: attr(data-label); color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
    .patient-privacy-table td:nth-child(2),.patient-privacy-table td:nth-child(5),.patient-privacy-table .patient-privacy-action { grid-column: 1 / -1; }
    .patient-privacy-table .patient-privacy-action { padding: 9px 12px; border-bottom: 0; }
    .patient-privacy-table .patient-privacy-action::before { display: none; }
    .patient-privacy-table .patient-privacy-action .btn { width: 100%; }
}

/* Compact, expandable treatment plan workspace */
.app-shell,
.sidebar {
    transition: grid-template-columns .22s ease, width .22s ease, min-width .22s ease, padding .22s ease, opacity .18s ease;
}

body.plan-focus-layout .app-shell {
    grid-template-columns: 0 minmax(0, 1fr);
}

body.plan-focus-layout .sidebar {
    width: 0;
    min-width: 0;
    padding-inline: 0;
    overflow: hidden;
    border-right: 0;
    opacity: 0;
}

.advanced-tab-panel[data-advanced-panel="plan"] > .plan-command-dock { order: 1; }

.plan-command-dock {
    position: static;
    z-index: 32;
    margin-bottom: 12px;
    overflow: visible;
    border: 1px solid rgba(11, 122, 134, .25);
    border-radius: var(--radius-panel);
    background: color-mix(in srgb, var(--surface) 95%, transparent);
    box-shadow: 0 8px 24px rgba(21, 33, 43, .09);
    backdrop-filter: blur(10px);
}

.plan-command-dock .plan-workspace-nav {
    position: static;
    z-index: auto;
    margin: 0;
    padding: 8px 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

.plan-workspace-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
}

.plan-focus-toggle,
.plan-global-actions > summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface);
    color: var(--primary-dark);
    cursor: pointer;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.plan-focus-toggle:hover,
.plan-focus-toggle:focus-visible,
.plan-global-actions > summary:hover,
.plan-global-actions > summary:focus-visible,
.plan-global-actions[open] > summary {
    outline: 0;
    border-color: var(--primary);
    background: var(--primary-soft);
}

.plan-global-actions { position: relative; }
.plan-global-actions > summary { list-style: none; }
.plan-global-actions > summary::-webkit-details-marker { display: none; }

.plan-global-actions > div {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 60;
    display: grid;
    gap: 7px;
    width: min(330px, calc(100vw - 32px));
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface);
    box-shadow: 0 16px 40px rgba(21, 33, 43, .18);
}

.plan-global-actions > div form {
    display: grid;
    gap: 7px;
    margin: 0;
}

.plan-global-actions > div .btn,
.plan-global-actions > div select { width: 100%; }

.plan-global-actions > div .btn:disabled,
.plan-global-actions > div select:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.plan-action-guidance {
    margin: 0;
    padding: 8px 9px;
    border: 1px solid #f0c7c3;
    border-radius: 8px;
    background: #fff4f2;
    color: #8b2e27;
    font-size: 11px;
    line-height: 1.4;
}

.plan-command-dock .plan-version-strip {
    flex-wrap: nowrap;
    margin: 0;
    padding: 7px 10px;
    overflow-x: auto;
    border-top: 1px solid var(--line);
    scrollbar-width: thin;
}

.plan-command-dock .plan-version-strip > strong,
.plan-command-dock .plan-version-record { flex: 0 0 auto; }

.treatment-plan-main > .panel-body { padding: 10px 12px 12px; }

.plan-items-heading {
    min-height: auto;
    padding: 9px 12px;
}

.plan-items-heading > div { display: grid; gap: 1px; }
.plan-items-heading span { color: var(--muted); font-size: 10px; }

.plan-list-columns,
.treatment-plan-row {
    display: grid;
    grid-template-columns: 30px 64px minmax(250px, 2.2fr) minmax(135px, .95fr) minmax(120px, .9fr) minmax(130px, .85fr) 28px;
    align-items: center;
    gap: 10px;
}

.plan-list-columns-without-prices,
.treatment-plan-row-without-prices {
    grid-template-columns: 30px 64px minmax(250px, 2.2fr) minmax(135px, .95fr) minmax(120px, .9fr) 28px;
}

.plan-list-columns {
    padding: 5px 10px 6px;
    color: var(--muted);
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.text-right { text-align: right; }

.treatment-plan-list {
    display: block;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-panel);
    background: var(--surface);
}

.treatment-plan-item {
    overflow: visible;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: var(--surface);
}

.treatment-plan-item:last-child { border-bottom: 0; }
.treatment-plan-item > summary { list-style: none; }
.treatment-plan-item > summary::-webkit-details-marker { display: none; }

.treatment-plan-row {
    min-height: 56px;
    padding: 7px 10px;
    cursor: pointer;
    transition: background-color .14s ease, box-shadow .14s ease;
}

.treatment-plan-row:hover,
.treatment-plan-row:focus-visible,
.treatment-plan-item[open] > .treatment-plan-row {
    outline: 0;
    background: #F6FBFB;
}

.treatment-plan-item[open] > .treatment-plan-row {
    box-shadow: inset 3px 0 0 var(--primary);
}

.treatment-plan-item.is-linked {
    border-color: var(--line);
    box-shadow: inset 3px 0 0 var(--primary);
}

.plan-drag-handle {
    display: grid;
    width: 28px;
    min-height: 28px;
    padding: 0;
    place-items: center;
    border-color: transparent;
    background: transparent;
    font-size: 15px;
}

.plan-drag-handle:hover,
.plan-drag-handle:focus-visible {
    outline: 0;
    border-color: var(--line);
    background: var(--surface-soft);
}

.treatment-plan-row .plan-tooth-token {
    max-width: 64px;
    overflow: hidden;
    padding: 4px 7px;
    font-size: 11px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-row-procedure,
.plan-row-phase,
.plan-row-finance {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.plan-row-procedure strong,
.plan-row-procedure small,
.plan-row-phase strong,
.plan-row-phase small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.plan-row-procedure strong { font-size: 12px; line-height: 1.3; }
.plan-row-procedure small { color: var(--muted); font-size: 10px; }
.plan-row-phase strong { font-size: 11px; line-height: 1.3; }
.plan-row-phase small { color: var(--muted); font-size: 9px; }

.treatment-plan-row .plan-status-stack {
    justify-content: flex-start;
    gap: 4px;
    min-width: 0;
}

.treatment-plan-row .plan-status {
    padding: 4px 7px;
    font-size: 9px;
}

.plan-row-finance { text-align: right; }
.plan-row-finance strong { font-size: 13px; line-height: 1.2; }
.plan-row-finance small { color: var(--muted); font-size: 9px; }

.plan-row-chevron {
    color: var(--muted);
    font-size: 18px;
    line-height: 1;
    text-align: center;
    transition: transform .16s ease;
}

.treatment-plan-item[open] > .treatment-plan-row .plan-row-chevron { transform: rotate(180deg); }

.plan-item-expanded {
    padding: 10px 12px 12px;
    border-top: 1px solid var(--line);
    background: var(--surface-soft);
}

.plan-row-context {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 16px;
    margin-bottom: 9px;
    color: var(--muted);
    font-size: 10px;
}

.plan-item-expanded .plan-clinical-rationale {
    margin: 0 0 9px;
    border: 1px solid var(--line);
    background: var(--surface);
}

.plan-item-expanded .treatment-plan-money {
    margin: 0 0 9px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
}

.plan-item-expanded .treatment-plan-money span { padding: 7px 10px; }

.plan-item-expanded .plan-item-details {
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface);
}

.plan-item-expanded .plan-item-details > summary {
    padding: 9px 11px;
    cursor: pointer;
    font-size: 11px;
}

.plan-item-expanded .plan-item-details[open] > summary {
    margin: 0;
    border-bottom: 1px solid var(--line);
    background: #F8FBFB;
}

.plan-item-expanded .plan-item-form { padding: 12px; }
.plan-item-expanded .plan-quick-actions { padding: 0 12px; }
.plan-item-expanded .plan-payment-zone { margin: 12px; }
.plan-item-expanded .plan-item-details > form:last-child { margin: 0; padding: 0 12px 12px; }

@media (max-width: 1100px) {
    .plan-list-columns,
    .treatment-plan-row {
        grid-template-columns: 28px 58px minmax(210px, 1.8fr) minmax(120px, .9fr) minmax(110px, .85fr) minmax(115px, .8fr) 26px;
        gap: 8px;
    }

    .plan-list-columns-without-prices,
    .treatment-plan-row-without-prices {
        grid-template-columns: 28px 58px minmax(210px, 1.8fr) minmax(120px, .9fr) minmax(110px, .85fr) 26px;
    }
}

@media (max-width: 900px) {
    .plan-list-columns { display: none; }

    .treatment-plan-row {
        grid-template-columns: 28px 58px minmax(190px, 1fr) minmax(105px, .65fr) minmax(108px, .65fr) 26px;
    }

    .treatment-plan-row-without-prices {
        grid-template-columns: 28px 58px minmax(190px, 1fr) minmax(105px, .65fr) 26px;
    }

    .treatment-plan-row .plan-row-phase { display: none; }
}

@media (max-width: 980px) {
    body.plan-focus-layout .app-shell { grid-template-columns: 1fr; }
    body.plan-focus-layout .sidebar { width: auto; min-width: 0; padding: 22px 16px; border-right: 1px solid rgba(255, 255, 255, .08); opacity: 1; }
    .plan-command-dock .plan-workspace-nav { align-items: stretch; }
    .plan-workspace-tools { justify-content: flex-start; }
}

@media (max-width: 640px) {
    .plan-command-dock { top: 64px; }
    .plan-command-dock .plan-workspace-nav { gap: 7px; padding: 8px; }
    .plan-workspace-tools { width: 100%; }
    .plan-workspace-links { flex: 1 1 auto; }
    .plan-workspace-links a { min-height: 34px; padding-block: 5px; }
    .plan-focus-toggle { display: none; }
    .plan-global-actions { flex: 0 0 auto; }
    .plan-global-actions > summary { min-height: 34px; padding-inline: 9px; }
    .plan-command-dock .plan-version-strip { padding: 6px 8px; }
    .plan-view-filters {
        flex-wrap: nowrap;
        justify-content: flex-start;
        width: 100%;
        overflow-x: auto;
        padding-bottom: 3px;
        scrollbar-width: thin;
    }
    .plan-view-filters button { flex: 0 0 auto; min-height: 40px; }
    .longitudinal-treatment-summary-actions { align-items: flex-start; justify-content: space-between; }
    .longitudinal-treatment-list article { align-items: flex-start; flex-direction: column; }
    .longitudinal-treatment-list a { text-align: left; white-space: normal; }
    .treatment-plan-main > .panel-body { padding: 8px; }
    .plan-items-heading span { display: none; }

    .treatment-plan-row,
    .treatment-plan-row-without-prices {
        grid-template-columns: 24px 52px minmax(0, 1fr) 26px;
        min-height: 58px;
        gap: 7px;
        padding: 7px 8px;
    }

    .treatment-plan-row .plan-row-phase,
    .treatment-plan-row .plan-status-stack,
    .treatment-plan-row .plan-row-finance { display: none; }
    .plan-drag-handle { width: 24px; min-height: 26px; }
    .treatment-plan-row .plan-tooth-token { max-width: 52px; padding-inline: 5px; font-size: 10px; }
    .plan-row-procedure strong { font-size: 11px; }
    .plan-row-procedure small { font-size: 9px; }
    .plan-item-expanded { padding: 9px; }
    .plan-item-expanded .treatment-plan-money { grid-template-columns: 1fr 1fr; }
}

/* Patient demographic editing */
.patient-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.patient-row-actions .btn {
    min-height: 38px;
    padding: 7px 11px;
    white-space: nowrap;
}

.patient-edit-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.patient-edit-heading > div { display: grid; gap: 5px; }
.patient-edit-heading h2 { margin: 3px 0 0; font-size: 25px; }
.patient-edit-heading p { max-width: 720px; margin: 0; color: var(--muted); font-size: 12px; }
.patient-edit-heading .patient-back { width: fit-content; color: var(--primary-dark); font-size: 11px; font-weight: 850; }

.patient-edit-code {
    flex: 0 0 auto;
    padding: 7px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--primary-dark);
    font-family: var(--font-data);
    font-size: 11px;
    font-weight: 850;
}

.patient-import-reference {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #B9DCDD;
    border-radius: var(--radius-control);
    background: #EFF9F8;
}

.patient-import-reference > div { display: grid; gap: 2px; }
.patient-import-reference strong { font-size: 11px; }
.patient-import-reference span { color: var(--muted); font-size: 10px; }
.patient-import-reference code { color: var(--primary-dark); font-size: 11px; font-weight: 850; }

.patient-edit-form {
    display: grid;
    gap: 12px;
    padding-bottom: 76px;
}

.patient-edit-section { margin: 0; }
.patient-edit-section-title { min-height: 54px; }
.patient-edit-section-title > div { display: grid; gap: 2px; }
.patient-edit-section-title span { color: var(--muted); font-size: 10px; }
.patient-edit-section .panel-body { display: grid; gap: 17px; }
.patient-edit-section .grid { margin: 0; }
.patient-edit-section .grid > div { min-width: 0; }
.patient-edit-section label:not(.check-inline):not(.patient-status-toggle) { display: block; margin-bottom: 5px; color: #42565F; font-size: 11px; font-weight: 800; }
.patient-edit-section textarea { min-height: 98px; resize: vertical; }
.patient-edit-check { width: fit-content; margin: 0; }

.patient-edit-section [data-guardian-fields] {
    transition: opacity .16s ease;
}

.patient-edit-section [data-guardian-fields].is-disabled {
    opacity: .48;
}

.patient-status-toggle {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-soft);
    cursor: pointer;
}

.patient-status-toggle > span { display: grid; gap: 2px; }
.patient-status-toggle strong { font-size: 11px; }
.patient-status-toggle small { color: var(--muted); font-size: 9px; }

.patient-edit-actions {
    position: sticky;
    z-index: 26;
    bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    width: fit-content;
    margin-left: auto;
    padding: 8px;
    border: 1px solid rgba(11, 122, 134, .22);
    border-radius: 10px;
    background: color-mix(in srgb, var(--surface) 95%, transparent);
    box-shadow: 0 10px 28px rgba(21, 33, 43, .13);
    backdrop-filter: blur(10px);
}

@media (max-width: 760px) {
    .patient-edit-heading { align-items: flex-start; flex-direction: column; }
    .patient-import-reference { align-items: flex-start; flex-direction: column; }
    .patient-row-actions { align-items: stretch; flex-direction: column; }
    .patient-row-actions .btn { width: 100%; }
    .patient-edit-actions { width: 100%; bottom: 8px; }
    .patient-edit-actions .btn { flex: 1 1 50%; }
}

/* Professional patient directory */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.patient-directory-page { background: #F3F6F7; }
.patient-directory-page .topbar { min-height: 64px; }
.patient-directory-page .topbar-meta {
    gap: 4px;
    padding: 4px;
    border: 1px solid #E2E8EC;
    border-radius: 10px;
    background: rgba(255, 255, 255, .82);
}
.patient-directory-page .security-user-badge { padding: 0 9px 0 2px; }
.patient-directory-page .security-top-action { min-height: 31px; padding: 6px 9px; }
.patient-directory-page .content { max-width: 1580px; padding-top: 24px; }

.patient-directory { display: grid; gap: 14px; }
.patient-directory-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}
.patient-directory-toolbar > div:first-child { display: grid; gap: 3px; }
.patient-directory-eyebrow {
    color: #697986;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}
.patient-directory-count { display: flex; align-items: baseline; gap: 5px; color: #51616E; font-size: 13px; }
.patient-directory-count strong { color: #172A35; font-size: 18px; }
.patient-directory-count span { margin-left: 3px; color: #778590; font-size: 11px; }
.patient-directory-create {
    min-height: 40px;
    padding: 9px 15px;
    border-color: #168267;
    background: #168267;
    color: #fff;
    box-shadow: 0 6px 16px rgba(22, 130, 103, .14);
}
.patient-directory-create:hover { border-color: #106C56; background: #106C56; }
.patient-directory-create > span { font-size: 18px; line-height: 0; }

.patient-directory-search {
    position: relative;
    display: flex;
    align-items: center;
    width: min(680px, 100%);
    min-height: 44px;
}
.patient-directory-search > svg {
    position: absolute;
    left: 14px;
    z-index: 1;
    width: 18px;
    height: 18px;
    color: #71818D;
    pointer-events: none;
}
.patient-directory-search input {
    width: 100%;
    min-height: 44px;
    padding: 10px 105px 10px 43px;
    border: 1px solid #CED9DF;
    border-radius: 9px;
    background: #fff;
    color: #1D303B;
    font-size: 13px;
    box-shadow: 0 1px 2px rgba(22, 42, 53, .025);
}
.patient-directory-search input:focus { border-color: #168997; box-shadow: var(--focus-ring); }
.patient-directory-search input::placeholder { color: #8A97A1; }
.patient-search-clear,
.patient-search-status {
    position: absolute;
    right: 13px;
    color: #647783;
    font-size: 10px;
    font-weight: 750;
}
.patient-search-clear { color: #0A707B; text-decoration: none; }

.patient-directory-panel {
    position: relative;
    border: 1px solid #DCE4E8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(29, 55, 68, .055);
}
.patient-directory-table-wrap { overflow: visible; }
.patient-directory-table { table-layout: fixed; }
.patient-directory-table th,
.patient-directory-table td { box-sizing: border-box; }
.patient-directory-table th {
    padding: 10px 18px;
    border-bottom: 1px solid #DDE5E9;
    background: #F8FAFB;
    color: #687985;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.patient-directory-table th:first-child { width: 36%; }
.patient-directory-table th:nth-child(2) { width: 17%; }
.patient-directory-table th:nth-child(3) { width: 18%; }
.patient-directory-table th:nth-child(4) { width: 23%; }
.patient-directory-table th:last-child { width: 74px; }
.patient-directory-table th > span { margin-left: 3px; color: #168997; }
.patient-directory-table td {
    height: 58px;
    padding: 8px 18px;
    border-bottom: 1px solid #E8EDF0;
    color: #263944;
    font-size: 12px;
}
.patient-directory-table tbody tr:last-child td { border-bottom: 0; }
.patient-directory-row { position: relative; cursor: pointer; transition: background .14s ease, box-shadow .14s ease; }
.patient-directory-row:hover { background: #F6FBFA; }
.patient-directory-row:focus-visible { z-index: 1; outline: 2px solid #168997; outline-offset: -2px; background: #F4FAFA; }
.patient-directory-row:hover .patient-directory-identity strong { color: #08727B; }

.patient-directory-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.patient-directory-avatar {
    display: grid;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 9px;
    background: #E7F5F3;
    color: #126C61;
    font-size: 11px;
    font-weight: 850;
}
.patient-directory-identity > span:last-child { display: grid; min-width: 0; gap: 2px; }
.patient-directory-identity strong { overflow: hidden; color: #172A35; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; transition: color .14s ease; }
.patient-directory-identity small { color: #84919A; font-family: var(--font-data); font-size: 9px; font-weight: 600; }

.patient-directory-private { display: inline-flex; align-items: center; gap: 7px; min-width: 0; color: #4F626C; font-family: var(--font-data); font-size: 10px; white-space: nowrap; }
.patient-directory-private svg { flex: 0 0 15px; width: 15px; height: 15px; color: #8A9AA3; }
.patient-directory-empty-value { color: #A6B0B6; font-size: 15px; }
.patient-directory-actions-heading,
.patient-directory-actions { text-align: right; }
.patient-directory-actions { overflow: visible; }

.patient-directory-menu { position: relative; z-index: 2; display: inline-block; }
.patient-directory-menu[open] { z-index: 30; }
.patient-directory-menu > summary {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 7px;
    color: #60727E;
    cursor: pointer;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1px;
    list-style: none;
}
.patient-directory-menu > summary::-webkit-details-marker { display: none; }
.patient-directory-menu > summary:hover,
.patient-directory-menu[open] > summary { border-color: #CBD9DE; background: #F2F7F7; color: #08727B; }
.patient-directory-menu > div {
    position: absolute;
    top: calc(100% + 5px);
    right: 0;
    display: grid;
    width: 154px;
    overflow: hidden;
    padding: 5px;
    border: 1px solid #D7E1E5;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(24, 51, 63, .17);
}
.patient-directory-menu > div a { padding: 9px 10px; border-radius: 6px; color: #28404B; font-size: 11px; font-weight: 700; text-align: left; text-decoration: none; }
.patient-directory-menu > div a:hover { background: #EEF7F6; color: #086C74; }

.patient-directory-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 52px;
    padding: 9px 14px 9px 18px;
    border-top: 1px solid #DDE5E9;
    border-radius: 0 0 12px 12px;
    background: #FBFCFC;
}
.patient-directory-footer p { margin: 0; color: #71808A; font-size: 10px; }
.patient-directory-footer p strong { color: #374D58; }
.patient-directory-pagination { display: flex; align-items: center; gap: 5px; }
.patient-directory-pagination a,
.patient-directory-pagination span,
.patient-directory-pagination strong { padding: 7px 9px; border-radius: 6px; font-size: 9px; text-decoration: none; }
.patient-directory-pagination a { border: 1px solid #D6E0E4; background: #fff; color: #116F77; font-weight: 800; }
.patient-directory-pagination a:hover { border-color: #168997; background: #F0F8F8; }
.patient-directory-pagination span { color: #A0AAB0; }
.patient-directory-pagination strong { color: #526671; font-weight: 750; }

.patient-directory-empty { display: grid; min-height: 300px; place-items: center; align-content: center; gap: 6px; padding: 34px; text-align: center; }
.patient-directory-empty > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; background: #EDF5F5; color: #347C81; font-size: 24px; }
.patient-directory-empty strong { color: #253944; font-size: 15px; }
.patient-directory-empty p { margin: 0; color: #71808A; font-size: 11px; }
.patient-directory-empty a { margin-top: 5px; color: #08757D; font-size: 11px; font-weight: 800; }

@media (max-width: 900px) {
    .patient-directory-table th:first-child { width: 32%; }
    .patient-directory-table th:nth-child(4),
    .patient-directory-table td:nth-child(4) { display: none; }
}

@media (max-width: 680px) {
    .patient-directory-page .topbar { align-items: flex-start; gap: 8px; flex-direction: column; }
    .patient-directory-page .topbar-meta { width: 100%; justify-content: flex-end; }
    .patient-directory-page .content { padding-top: 18px; }
    .patient-directory-toolbar { align-items: stretch; flex-direction: column; }
    .patient-directory-create { justify-content: center; width: 100%; }
    .patient-directory-search input { padding-right: 75px; }
    .patient-directory-table-wrap { overflow: visible; }
    .patient-directory-table,
    .patient-directory-table tbody,
    .patient-directory-table tr,
    .patient-directory-table td { display: block; width: 100%; }
    .patient-directory-table thead { display: none; }
    .patient-directory-table tbody { display: grid; gap: 8px; padding: 10px; background: #F8FAFA; }
    .patient-directory-table tr { display: grid; grid-template-columns: 1fr 1fr auto; padding: 9px 11px; border: 1px solid #E0E7EA; border-radius: 9px; background: #fff; }
    .patient-directory-table td { height: auto; min-height: 42px; padding: 7px 6px; border: 0; }
    .patient-directory-table td:first-child { grid-column: 1 / -1; padding-bottom: 9px; border-bottom: 1px solid #EDF1F2; }
    .patient-directory-table td:nth-child(4) { display: none; }
    .patient-directory-table td::before { content: attr(data-label); display: block; margin-bottom: 4px; color: #8A979F; font-size: 8px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
    .patient-directory-table td:first-child::before,
    .patient-directory-actions::before { display: none; }
    .patient-directory-actions { display: grid !important; align-items: center; justify-items: end; }
    .patient-directory-footer { align-items: stretch; flex-direction: column; }
    .patient-directory-pagination { justify-content: space-between; }
}

/* Agenda command center and remote patient picker */
.agenda-directory-page { background: #F3F6F7; }
.agenda-directory-page .topbar {
    min-height: 64px;
    align-items: center;
}
.agenda-directory-page .topbar-meta { gap: 6px; }
.agenda-directory-page .security-user-badge {
    padding: 3px 10px 3px 3px;
    border-right: 0;
}
.agenda-directory-page .security-top-action { min-height: 32px; padding: 6px 10px; }
.agenda-directory-page .security-top-action:not(.is-quiet) { border-color: #BFD5D8; background: #F8FBFB; }
.agenda-directory-page .security-top-action.is-quiet { color: #70808A; }
.agenda-directory-page .content { max-width: 1720px; padding-top: 22px; }
.agenda-directory-page .agenda-page { gap: 14px; }

.agenda-directory-page .agenda-toolbar {
    align-items: flex-end;
    min-height: 45px;
    margin: 0;
}
.agenda-directory-page .agenda-toolbar .toolbar-title { display: grid; gap: 2px; }
.agenda-directory-page .agenda-toolbar h2 { color: #172A35; font-size: 21px; }
.agenda-toolbar-caption { color: #70808B; font-size: 11px; font-weight: 500; }

.agenda-directory-page .agenda-controls {
    display: grid;
    grid-template-areas:
        "navigation date spacer"
        "filters filters filters";
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
    gap: 12px 22px;
    min-height: 120px;
    padding: 14px 16px;
    border-color: #DCE5E9;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 7px 24px rgba(25, 54, 68, .045);
}
.agenda-directory-page .agenda-controls-left {
    grid-area: navigation;
    justify-content: flex-start;
    gap: 6px;
}
.agenda-directory-page .agenda-controls-left .btn {
    min-height: 36px;
    padding: 7px 12px;
    border-color: #D4DEE3;
    background: #fff;
    color: #304752;
}
.agenda-directory-page .agenda-controls-left .btn-square { width: 36px; padding-inline: 0; }
.agenda-count-pill {
    min-height: 28px;
    margin-left: 3px;
    border-color: #D7EBE7;
    background: #EAF7F3;
    color: #126A57;
    white-space: nowrap;
}

.agenda-directory-page .agenda-date-title {
    grid-area: date;
    display: grid;
    place-items: center;
    min-width: 260px;
    color: #162B36;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.02em;
    white-space: nowrap;
}
.agenda-directory-page .agenda-controls-right {
    grid-area: filters;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}
.agenda-filter-fields {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    min-width: 0;
}
.agenda-directory-page .agenda-filter-fields input,
.agenda-directory-page .agenda-filter-fields select,
.agenda-directory-page .agenda-filter-fields .btn,
.agenda-directory-page .agenda-new-appointment {
    min-height: 38px;
    height: 38px;
    margin: 0;
    border-radius: 8px;
    font-size: 11px;
    white-space: nowrap;
}
.agenda-directory-page .agenda-date-picker { flex: 0 0 148px; width: 148px; min-width: 148px; font-variant-numeric: tabular-nums; }
.agenda-directory-page .agenda-filter-fields select[name="vista"] { flex: 0 0 82px; width: 82px; min-width: 82px; }
.agenda-directory-page .agenda-filter-fields select[multiple] {
    flex: 0 1 225px;
    width: 225px;
    min-width: 180px;
    max-width: 225px;
    overflow: hidden;
}
.agenda-dentist-submit { flex: 0 0 auto; padding-inline: 11px; }
.agenda-new-appointment { flex: 0 0 auto; padding-inline: 14px; box-shadow: 0 6px 16px rgba(11, 122, 134, .13); }

.agenda-directory-page .agenda-board-wrap {
    max-height: calc(100vh - 315px);
    min-height: 520px;
    overflow: auto;
    border-color: #DCE5E9;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 26px rgba(25, 54, 68, .045);
    scrollbar-gutter: stable;
}
.agenda-directory-page .agenda-board {
    grid-template-rows: 54px repeat(var(--slot-count), 60px);
    background: #fff;
}
.agenda-directory-page .agenda-corner,
.agenda-directory-page .agenda-dentist-head {
    border-color: #DCE5E9;
    background: #F8FAFB;
    box-shadow: 0 2px 6px rgba(25, 54, 68, .04);
}
.agenda-directory-page .agenda-dentist-head {
    align-content: center;
    justify-items: center;
    gap: 3px;
    padding: 7px 12px;
    text-align: center;
}
.agenda-directory-page .agenda-dentist-head span {
    max-width: 100%;
    overflow: hidden;
    color: #203440;
    font-size: 12px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.agenda-directory-page .agenda-dentist-head small { color: #7A8892; font-size: 9px; font-weight: 650; }
.agenda-directory-page .agenda-time-label {
    align-items: center;
    padding-top: 0;
    border-right: 1px solid #E2E9EC;
    border-bottom: 1px solid #E8EDF0;
    background: #FAFBFC;
    color: #71808A;
    font-size: 10px;
}
.agenda-directory-page .agenda-time-label.is-hour { color: #2C424E; font-size: 11px; }
.agenda-directory-page .agenda-slot {
    border-right: 1px solid #E4EAED;
    border-bottom: 1px solid #E8EDF0;
    background: #fff;
}
.agenda-directory-page .agenda-slot:hover,
.agenda-directory-page .agenda-slot:focus-visible { background: #F0F8F7; box-shadow: inset 0 0 0 1px rgba(11, 122, 134, .22); }

.patient-remote-picker { position: relative; }
.patient-remote-input-wrap { position: relative; display: flex; align-items: center; }
.patient-remote-input-wrap > svg {
    position: absolute;
    left: 12px;
    z-index: 2;
    width: 17px;
    height: 17px;
    color: #788994;
    pointer-events: none;
}
.patient-remote-search { width: 100%; padding-left: 39px; padding-right: 66px; }
.patient-remote-search[aria-expanded="true"] { border-color: #178995; box-shadow: var(--focus-ring); }
.patient-remote-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
.patient-remote-clear {
    position: absolute;
    right: 9px;
    z-index: 3;
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #EDF3F4;
    color: #5C707B;
    cursor: pointer;
    font-size: 17px;
    line-height: 1;
}
.patient-remote-clear:hover { background: #E1ECEC; color: #0A7179; }
.patient-remote-spinner {
    position: absolute;
    right: 43px;
    z-index: 3;
    width: 15px;
    height: 15px;
    border: 2px solid #D4E4E5;
    border-top-color: #0B7A86;
    border-radius: 50%;
    animation: patient-remote-spin .7s linear infinite;
}
@keyframes patient-remote-spin { to { transform: rotate(360deg); } }
.patient-remote-guidance { display: block; min-height: 16px; margin-top: 5px; color: #73838D; font-size: 9px; font-weight: 550; }
.patient-remote-results {
    position: absolute;
    z-index: 150;
    top: calc(100% - 14px);
    left: 0;
    width: min(420px, calc(100vw - 44px));
    max-height: 286px;
    overflow-y: auto;
    padding: 5px;
    border: 1px solid #D2DEE3;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(21, 49, 62, .19);
}
.patient-remote-option {
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 8px 9px;
    border: 0;
    border-radius: 7px;
    background: #fff;
    color: #20343F;
    cursor: pointer;
    text-align: left;
}
.patient-remote-option:hover,
.patient-remote-option.is-active { background: #EDF7F6; }
.patient-remote-avatar { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 8px; background: #E5F4F1; color: #126D61; font-size: 10px; font-weight: 850; }
.patient-remote-option > span:last-child { display: grid; min-width: 0; gap: 2px; }
.patient-remote-option strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.patient-remote-option small { overflow: hidden; color: #74838D; font-family: var(--font-data); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.patient-remote-state { padding: 18px 12px; color: #647681; font-size: 10px; text-align: center; }
.patient-remote-state.is-error { color: #A53A32; background: #FFF7F6; }
.patient-remote-state.is-loading { color: #176D73; }
.appointment-pending-empty.is-loading { color: #176D73; }
.appointment-pending-empty.is-error { color: #A53A32; background: #FFF7F6; }

@media (max-width: 1180px) {
    .agenda-directory-page .agenda-controls {
        grid-template-areas:
            "navigation date"
            "filters filters";
        grid-template-columns: auto minmax(260px, 1fr);
    }
    .agenda-directory-page .agenda-date-title { justify-items: end; min-width: 0; }
    .agenda-directory-page .agenda-controls-right { justify-content: flex-start; }
    .agenda-filter-fields { flex: 1 1 auto; justify-content: flex-start; }
}

@media (max-width: 760px) {
    .agenda-directory-page .topbar { align-items: flex-start; gap: 8px; flex-direction: column; }
    .agenda-directory-page .topbar-meta { width: 100%; justify-content: flex-end; }
    .agenda-directory-page .agenda-controls {
        grid-template-areas: "date" "navigation" "filters";
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }
    .agenda-directory-page .agenda-date-title { justify-items: start; font-size: 16px; }
    .agenda-directory-page .agenda-controls-left { flex-wrap: nowrap; }
    .agenda-directory-page .agenda-controls-right,
    .agenda-filter-fields { align-items: stretch; flex-direction: column; width: 100%; }
    .agenda-directory-page .agenda-filter-fields input,
    .agenda-directory-page .agenda-filter-fields select,
    .agenda-directory-page .agenda-filter-fields select[multiple],
    .agenda-directory-page .agenda-filter-fields .btn,
    .agenda-directory-page .agenda-new-appointment {
        flex: 0 0 38px;
        width: 100%;
        min-width: 0;
        max-width: none;
    }
    .agenda-directory-page .agenda-filter-fields select[name="vista"] {
        flex-basis: 38px;
        width: 100%;
        min-width: 0;
    }
    .agenda-directory-page .agenda-new-appointment { justify-content: center; }
    .agenda-directory-page .agenda-board-wrap { max-height: none; }
    .patient-remote-results { position: fixed; inset: 112px 14px auto; max-height: min(340px, 48vh); }
}

/* Progressive appointment flow */
.agenda-directory-page .agenda-modal {
    width: min(780px, calc(100vw - 28px));
    max-height: calc(100vh - 24px);
}
.agenda-directory-page .modal-backdrop { z-index: 200; }
.agenda-directory-page .agenda-modal .modal-header { min-height: 58px; padding: 15px 20px; }
.agenda-directory-page .appointment-flow {
    gap: 14px;
    padding: 15px 20px 0;
    background: #F8FAFB;
    scrollbar-gutter: stable;
}
.agenda-directory-page .agenda-type-selector {
    width: max-content;
    gap: 3px;
    padding: 3px;
    border: 1px solid #DCE5E9;
    border-radius: 10px;
    background: #EEF3F5;
}
.agenda-directory-page .agenda-type-selector label { position: relative; margin: 0; cursor: pointer; }
.agenda-directory-page .agenda-type-selector input { position: absolute; opacity: 0; pointer-events: none; }
.agenda-directory-page .agenda-type-selector span {
    display: block;
    padding: 8px 13px;
    border-radius: 7px;
    color: #647681;
    font-size: 11px;
    font-weight: 750;
}
.agenda-directory-page .agenda-type-selector input:checked + span {
    background: #fff;
    color: #126F77;
    box-shadow: 0 2px 8px rgba(26, 56, 68, .09);
}
.appointment-step {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #E0E7EA;
    border-radius: 11px;
    background: #fff;
}
.appointment-step-heading { display: flex; align-items: center; gap: 9px; }
.appointment-step-heading > span {
    display: grid;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    place-items: center;
    border-radius: 50%;
    background: #E3F3F1;
    color: #126D61;
    font-size: 10px;
    font-weight: 850;
}
.appointment-step-heading > div { display: grid; gap: 1px; }
.appointment-step-heading strong { color: #20343F; font-size: 13px; }
.appointment-step-heading small { color: #7A8992; font-size: 9px; }
.appointment-schedule-grid {
    display: grid;
    grid-template-columns: 1.05fr .65fr .65fr 1.45fr;
    gap: 10px;
    align-items: start;
}
.patient-remote-help-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.patient-quick-link { flex: 0 0 auto; padding: 4px 0; color: #087A84; font-size: 9px; font-weight: 800; }
.patient-selected-card {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 11px;
    border: 1px solid #CBE2DE;
    border-radius: 9px;
    background: #F2FAF8;
}
.patient-selected-card > span:nth-child(2) { display: grid; min-width: 0; margin-right: auto; }
.patient-selected-card strong { overflow: hidden; color: #1F3840; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.patient-selected-card small { color: #73848D; font-family: var(--font-data); font-size: 9px; }
.patient-selected-avatar { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; background: #DCEFEB; color: #126D61; font-size: 11px; font-weight: 850; }
.patient-selected-card em {
    padding: 4px 7px;
    border-radius: 999px;
    background: #DDF3E8;
    color: #1C7257;
    font-size: 8px;
    font-style: normal;
    font-weight: 850;
    white-space: nowrap;
}
.patient-selected-card em.is-warning { background: #FFF2D7; color: #976200; }
.appointment-clinical-flags .is-first-visit { border-color: #BFE2DA; background: #E4F5F0; color: #176D5B; }
.patient-quick-create { display: grid; gap: 11px; padding: 13px; border: 1px solid #BFDDE0; border-radius: 10px; background: #F7FBFB; }
.patient-quick-head, .patient-quick-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.patient-quick-head > div { display: grid; }
.patient-quick-head strong { font-size: 12px; }
.patient-quick-head small { color: #75858E; font-size: 9px; }
.patient-quick-actions { justify-content: flex-end; }
.patient-quick-feedback { padding: 8px 10px; border-radius: 7px; background: #EAF5F4; color: #176D73; font-size: 9px; }
.patient-quick-feedback.is-error { background: #FFF0EF; color: #A53A32; }
.patient-quick-feedback.is-warning { background: #FFF7E7; color: #895D08; }
.patient-quick-feedback .link-button { margin-left: 4px; color: inherit; font-weight: 850; text-decoration: underline; }
.patient-remote-state.is-empty { display: grid; justify-items: center; gap: 9px; }
.patient-remote-state.is-empty .btn { min-height: 30px; padding: 5px 10px; font-size: 9px; }
.appointment-reason-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.appointment-reason-chips label { position: relative; margin: 0; cursor: pointer; }
.appointment-reason-chips input { position: absolute; opacity: 0; }
.appointment-reason-chips span { display: block; padding: 7px 10px; border: 1px solid #D8E2E6; border-radius: 999px; background: #fff; color: #586B76; font-size: 9px; font-weight: 700; }
.appointment-reason-chips input:checked + span { border-color: #62B8AD; background: #E5F5F1; color: #126D61; box-shadow: inset 0 0 0 1px #62B8AD; }
.agenda-directory-page .appointment-pending-panel { min-height: 0; }
.agenda-directory-page .appointment-pending-panel:has(.appointment-pending-option) { min-height: 0; }
.agenda-directory-page .appointment-pending-list { max-height: 168px; }
.agenda-directory-page .appointment-pending-empty { padding: 11px 13px; }
.appointment-catalog-disclosure, .appointment-more-options { overflow: hidden; border: 1px solid #DCE5E9; border-radius: 9px; background: #FBFCFC; }
.appointment-catalog-disclosure > summary, .appointment-more-options > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    color: #176F77;
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}
.appointment-catalog-disclosure > summary::-webkit-details-marker, .appointment-more-options > summary::-webkit-details-marker { display: none; }
.appointment-catalog-disclosure > summary b { color: #7A8992; font-size: 8px; }
.appointment-catalog-body { display: grid; gap: 8px; padding: 0 10px 10px; }
.appointment-catalog-options { display: grid; max-height: 190px; overflow-y: auto; border: 1px solid #E0E7EA; border-radius: 8px; background: #fff; }
.appointment-catalog-options label { display: grid; grid-template-columns: 17px minmax(0, 1fr); align-items: center; gap: 8px; margin: 0; padding: 8px 10px; border-bottom: 1px solid #EEF2F3; cursor: pointer; }
.appointment-catalog-options label:hover { background: #F1F8F7; }
.appointment-catalog-options label:last-child { border-bottom: 0; }
.appointment-catalog-options label > span { display: grid; min-width: 0; }
.appointment-catalog-options strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.appointment-catalog-options small { color: #7B8992; font-size: 8px; }
.appointment-motive-step { padding-top: 11px; padding-bottom: 11px; }
.appointment-motive-step textarea { min-height: 62px; }
.appointment-more-options > .grid { padding: 0 12px 12px; }
.appointment-more-options textarea { min-height: 68px; }
.agenda-directory-page .agenda-modal .appointment-flow-footer {
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 68px;
    margin: 0 -20px;
    padding: 10px 20px 12px;
    border-top: 1px solid #DFE7EA;
    background: rgba(255, 255, 255, .97);
    backdrop-filter: blur(8px);
}
.appointment-summary { display: grid; min-width: 0; gap: 2px; }
.appointment-summary strong { overflow: hidden; color: #233943; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.appointment-summary span { overflow: hidden; color: #788891; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.appointment-footer-buttons { display: flex; flex: 0 0 auto; gap: 8px; }

@media (max-width: 760px) {
    .agenda-directory-page .agenda-modal { width: min(100vw - 16px, 780px); max-height: calc(100vh - 12px); }
    .agenda-directory-page .appointment-flow { padding-inline: 12px; }
    .appointment-schedule-grid { grid-template-columns: 1fr 1fr; }
    .appointment-schedule-grid > div:first-child, .appointment-schedule-grid > div:last-child { grid-column: 1 / -1; }
    .patient-remote-help-row { align-items: flex-start; flex-direction: column; gap: 2px; }
    .patient-selected-card { align-items: flex-start; flex-wrap: wrap; }
    .patient-selected-card > span:nth-child(2) { flex: 1 1 calc(100% - 42px); }
    .patient-quick-create .grid, .appointment-more-options > .grid { grid-template-columns: 1fr; }
    .appointment-reason-chips { gap: 5px; }
    .agenda-directory-page .agenda-modal .appointment-flow-footer { align-items: stretch; flex-direction: column; gap: 7px; min-height: 108px; margin-inline: -12px; padding-inline: 12px; }
    .appointment-footer-buttons, .appointment-footer-buttons .btn { width: 100%; }
    .appointment-footer-buttons .btn { justify-content: center; }
}

/* Cierre clínico enfocado: confirmación y cobro dentro de una sola pantalla. */
.attention-closeout-focus-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 64px;
    padding: 10px 16px;
}
.attention-closeout-focus-header > div { display: grid; min-width: 0; gap: 1px; }
.attention-closeout-focus-header strong { font-size: 18px; line-height: 1.2; }
.attention-closeout-focus-header small { overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.attention-closeout-exit {
    display: grid;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid var(--line);
    border-radius: 9px;
    color: #52636e;
    background: #fff;
    font-size: 24px;
    line-height: 1;
}
.attention-closeout-exit:hover { border-color: #8ebdb9; color: var(--primary-dark); background: #f2faf8; }

.checkout-focus-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
    gap: 12px;
    min-height: 0;
    height: 100%;
}
.checkout-plan-focus-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr);
    gap: 12px;
    min-height: 0;
    height: 100%;
}
.checkout-plan-procedures { display: flex; min-width: 0; min-height: 0; flex-direction: column; gap: 9px; overflow-y: auto; overscroll-behavior: contain; padding-right: 2px; }
.checkout-confirmation,
.checkout-settlement {
    display: flex;
    min-width: 0;
    min-height: 0;
    flex-direction: column;
    gap: 10px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
}
.checkout-settlement { background: #f8fbfb; }
.checkout-section-heading { display: flex; align-items: center; gap: 10px; min-height: 40px; }
.checkout-section-heading > div { display: grid; min-width: 0; gap: 1px; }
.checkout-section-heading strong { font-size: 14px; }
.checkout-section-heading small { color: var(--muted); font-size: 10px; }
.checkout-step-number {
    display: grid;
    flex: 0 0 auto;
    width: 27px;
    height: 27px;
    place-items: center;
    border-radius: 50%;
    color: #075d52;
    background: #dff4ee;
    font-size: 12px;
    font-weight: 850;
}
.checkout-origin-badge { margin-left: auto; padding: 5px 8px; border-radius: 999px; color: #096e75; background: #e7f6f5; font-size: 9px; font-weight: 850; text-transform: uppercase; white-space: nowrap; }
.checkout-detected-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; min-height: 0; gap: 7px; overflow-y: auto; overscroll-behavior: contain; padding: 1px; }
.checkout-detected-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 64px;
    padding: 8px 10px;
    border: 1px solid #b9ddd8;
    border-radius: 10px;
    background: #f1faf8;
    cursor: pointer;
}
.checkout-detected-item.is-selected { border-color: #369d8e; background: #e8f8f3; box-shadow: inset 3px 0 #278c7e; }
.checkout-detected-item.is-unpriced { border-color: #e6c77c; background: #fff9ea; cursor: default; }
.checkout-detected-main { display: grid; min-width: 0; gap: 2px; }
.checkout-detected-main strong { display: -webkit-box; overflow: hidden; font-size: 12px; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.checkout-detected-main small { color: var(--muted); font-size: 10px; }
.checkout-detected-value { display: grid; justify-items: end; gap: 1px; }
.checkout-detected-value b { color: #087058; font-size: 12px; white-space: nowrap; }
.checkout-detected-value small { color: #458073; font-size: 9px; font-weight: 750; }
.checkout-detected-item.is-unpriced .checkout-detected-value b,
.checkout-detected-item.is-unpriced .checkout-detected-value small { color: #8a5913; }
.checkout-detected-warning { display: grid; width: 20px; height: 20px; place-items: center; border-radius: 50%; color: #fff; background: #c48620; font-size: 12px; font-weight: 900; }
.checkout-valuation-state { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 12px; border: 1px solid #b9ddd8; border-radius: 10px; background: #f1faf8; }
.checkout-valuation-state > span { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #fff; background: #278c7e; }
.checkout-valuation-state > div { display: grid; gap: 1px; }
.checkout-valuation-state small { color: var(--muted); font-size: 10px; }
.checkout-valuation-state > b { color: #087058; font-size: 15px; }
.checkout-blocker { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px; border: 1px solid #e4c06b; border-radius: 9px; color: #714b12; background: #fff6dc; }
.checkout-blocker > div { display: grid; gap: 1px; }
.checkout-blocker strong { font-size: 11px; }
.checkout-blocker span { font-size: 10px; }
.checkout-blocker .btn { flex: 0 0 auto; min-height: 31px; padding: 5px 8px; font-size: 9px; }
.checkout-confirmation-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 9px; border-top: 1px solid var(--line); }
.checkout-confirmation-footer > span { color: #47616a; font-size: 10px; font-weight: 750; }
.checkout-confirmation-footer .btn { min-height: 32px; padding: 5px 9px; font-size: 10px; }
.checkout-settlement .checkout-live-summary { min-height: 58px; }
.checkout-settlement .checkout-payment { flex: 0 0 auto; }
.checkout-settlement .checkout-payment-grid { grid-template-columns: minmax(100px, .8fr) minmax(125px, 1fr); }
.checkout-settlement .checkout-payment-grid > label:last-child { grid-column: 1 / -1; }
.checkout-integrity-note { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 9px; color: #31545b; background: #eaf6f4; }
.checkout-integrity-note > span { display: grid; width: 21px; height: 21px; place-items: center; border-radius: 50%; color: #fff; background: #278c7e; font-size: 11px; }
.checkout-integrity-note p { display: grid; gap: 1px; margin: 0; }
.checkout-integrity-note strong { font-size: 10px; }
.checkout-integrity-note small { color: #577176; font-size: 9px; }
.checkout-settlement .attention-closeout-submit { align-items: stretch; flex-direction: column; margin-top: auto; gap: 8px; }
.checkout-settlement .attention-closeout-submit .btn { width: 100%; justify-content: center; }
.checkout-settlement .attention-closeout-submit .btn:disabled { border-color: #dfbd71; color: #74551d; background: #f7e8bd; cursor: not-allowed; opacity: 1; }

.checkout-procedure-dialog { width: min(760px, calc(100vw - 32px)); max-height: min(720px, calc(100vh - 32px)); padding: 0; border: 0; border-radius: 14px; color: var(--ink); background: #fff; box-shadow: 0 24px 80px rgba(13,42,54,.28); }
.checkout-procedure-dialog::backdrop { background: rgba(11,34,45,.52); backdrop-filter: blur(2px); }
.checkout-procedure-dialog[open] { display: grid; grid-template-rows: auto auto minmax(0,1fr) auto; gap: 10px; padding: 14px; }
.checkout-procedure-dialog > header,
.checkout-procedure-dialog > footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.checkout-procedure-dialog > header > div { display: grid; gap: 1px; }
.checkout-procedure-dialog > header strong { font-size: 16px; }
.checkout-procedure-dialog > header small,
.checkout-procedure-dialog > footer span { color: var(--muted); font-size: 10px; }
.checkout-procedure-dialog > header button { border: 0; color: #667680; background: none; font-size: 24px; cursor: pointer; }
.checkout-procedure-dialog .checkout-procedure-list { max-height: none; min-height: 0; }

body.checkout-focus-layout { overflow: hidden; }
body.checkout-focus-layout .app-shell { grid-template-columns: 264px minmax(0, 1fr); }
body.checkout-focus-layout .sidebar { width: auto; min-width: 0; padding: 22px 16px; overflow: visible; border-right: 1px solid rgba(255, 255, 255, .08); opacity: 1; }
body.checkout-focus-layout.attention-clinical-page { min-height: 0; }
body.checkout-focus-layout .content { width: 100%; max-width: none; height: calc(100vh - 72px); padding: 12px 16px 16px; overflow: hidden; }
body.checkout-focus-layout .attention-clinical-workspace { height: 100%; min-height: 0; }
body.checkout-focus-layout .attention-clinical-hero,
body.checkout-focus-layout .attention-flow-panel,
body.checkout-focus-layout .attention-secondary-disclosure { display: none; }
body.checkout-focus-layout .attention-closeout { display: flex; min-height: 0; height: 100%; flex-direction: column; }
body.checkout-focus-layout .attention-closeout > .panel-body { min-height: 0; flex: 1; overflow: hidden; }
body.checkout-focus-layout .attention-closeout-form { min-height: 0; height: 100%; }
body.checkout-focus-layout .attention-closeout-errors { position: fixed; z-index: 80; top: 82px; right: 22px; width: min(440px, calc(100vw - 44px)); box-shadow: 0 14px 38px rgba(76, 22, 20, .18); }
body.checkout-focus-layout .attention-plan-closeout-form { overflow: hidden; }

@media (max-width: 980px) {
    body.checkout-focus-layout .app-shell { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
    body.checkout-focus-layout { overflow: auto; }
    body.checkout-focus-layout .content { height: auto; min-height: calc(100vh - 56px); overflow: visible; }
    body.checkout-focus-layout .attention-clinical-workspace,
    body.checkout-focus-layout .attention-closeout,
    body.checkout-focus-layout .attention-closeout-form { height: auto; }
    body.checkout-focus-layout .attention-plan-closeout-form { overflow: visible; }
    body.checkout-focus-layout .attention-closeout > .panel-body { overflow: visible; }
    .checkout-focus-grid,
    .checkout-plan-focus-grid { grid-template-columns: 1fr; height: auto; }
    .checkout-detected-list { max-height: 300px; }
}

@media (max-width: 560px) {
    .attention-closeout-focus-header strong { font-size: 15px; }
    .checkout-origin-badge { display: none; }
    .checkout-detected-list { grid-template-columns: 1fr; }
    .checkout-detected-item { grid-template-columns: auto minmax(0, 1fr); }
    .checkout-detected-value { grid-column: 2; justify-items: start; }
    .checkout-blocker { align-items: stretch; flex-direction: column; }
    .checkout-procedure-dialog .checkout-procedure-list { grid-template-columns: 1fr; }
}

/* Formularios compactos para crear y editar usuarios. */
body.user-overlay-open { overflow: hidden; }
#user-modal.open { align-items: center; padding: 16px; }
.user-create-modal {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    width: min(820px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
}
.user-edit-drawer { width: min(880px, calc(100vw - 40px)); }
.user-inline-editor-row > td { padding: 0; border-top: 0; background: #f5faf9; }
.user-inline-editor-row[hidden] { display: none; }
tr[data-user-summary-row].is-editing > td { border-top-color: #72bdb4; background: #f2faf8; }
.user-inline-editor {
    display: grid;
    grid-template-rows: auto auto auto;
    margin: 0 8px 10px;
    overflow: hidden;
    border: 1px solid #9bcfc9;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(20, 60, 68, .08);
}
.user-inline-editor-header { border-bottom: 1px solid var(--line); background: linear-gradient(90deg, #f1fbf9, #fff); }
.user-inline-header-actions { display: flex; align-items: center; gap: 8px; }
.user-unsaved-indicator { padding: 4px 8px; border-radius: 999px; color: #8a5907; background: #fff3d7; font-size: 9px; font-weight: 850; }
.user-inline-editor .user-editor-body { display: grid; gap: 9px; overflow: visible; }
.user-account-section > header { padding-bottom: 2px; }
.user-account-section > header > div { display: grid; gap: 1px; }
.user-editor-options { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 8px; }
.user-inline-editor-footer { border-top: 1px solid var(--line); background: #fbfcfc; }
.user-inline-editor-footer > .section-note { margin-right: auto; }
.user-form-header { min-height: 64px; justify-content: space-between; gap: 16px; padding: 11px 16px; }
.user-form-header > div { display: grid; min-width: 0; gap: 1px; }
.user-form-header > div > strong { margin: 0; color: var(--ink); font-size: 18px; line-height: 1.2; }
.user-form-header > div > small { overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.user-form-header .drawer-close { display: grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: #64747e; background: #fff; font-size: 22px; }
.user-form-body,
.user-editor-body { gap: 10px; padding: 12px 14px; }
.user-form-body { overflow: auto; }
.user-editor-body { align-content: start; overflow: auto; }
.user-form-section { display: grid; gap: 9px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: #fbfcfc; }
.user-form-section > header { display: flex; align-items: center; gap: 9px; }
.user-form-section > header > span { display: grid; flex: 0 0 auto; width: 24px; height: 24px; place-items: center; border-radius: 50%; color: #075d52; background: #dff4ee; font-size: 10px; font-weight: 850; }
.user-form-section > header > div { display: grid; gap: 0; }
.user-form-section > header strong { font-size: 12px; }
.user-form-section > header small { color: var(--muted); font-size: 9px; }
.user-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; }
.user-form-grid .span-full { grid-column: 1 / -1; }
.user-edit-profile-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.user-edit-profile-grid .span-2 { grid-column: span 2; }
.user-edit-profile-grid .span-3 { grid-column: span 3; }
.user-field { display: grid; align-content: start; min-width: 0; gap: 4px; }
.user-field label { color: #3d4e59; font-size: 10px; font-weight: 800; }
.user-field input,
.user-field select { width: 100%; min-width: 0; min-height: 39px; padding: 8px 10px; }
.user-field .field-help { min-height: 12px; margin: 0; color: var(--muted); font-size: 8px; line-height: 1.35; }
.user-field .field-error { margin: 0; font-size: 9px; }
.user-color-select { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: center; min-height: 39px; padding-left: 8px; border: 1px solid #c7d5d9; border-radius: 8px; background: #fff; }
.user-color-select:focus-within { border-color: #168b93; box-shadow: 0 0 0 2px rgba(22, 139, 147, .13); }
.user-color-preview { width: 15px; height: 15px; border: 2px solid #fff; border-radius: 50%; background: #2f8fc7; box-shadow: 0 0 0 1px #9fafb5; }
.user-color-select select { min-height: 37px; padding-left: 4px; border: 0; outline: 0; background: transparent; color: #263640; font-weight: 750; }
.user-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-height: 58px; padding: 9px 14px; }
.user-form-actions .btn,
.drawer-footer.user-form-actions .btn { width: auto; min-width: 120px; margin: 0; }
.user-form-actions .btn-primary { min-width: 170px; }

.user-editor-disclosure { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.user-editor-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 48px; padding: 8px 11px; cursor: pointer; list-style: none; }
.user-editor-disclosure > summary::-webkit-details-marker { display: none; }
.user-editor-disclosure > summary > div { display: grid; gap: 1px; }
.user-editor-disclosure > summary strong { font-size: 11px; }
.user-editor-disclosure > summary small { color: var(--muted); font-size: 9px; }
.user-editor-disclosure > summary > span { padding: 4px 7px; border-radius: 999px; color: #526873; background: #eef3f4; font-size: 8px; font-weight: 850; text-transform: uppercase; white-space: nowrap; }
.user-editor-disclosure[open] > summary { border-bottom: 1px solid var(--line); background: #f7fafb; }
.user-disclosure-fields { padding: 10px 11px; }
.user-schedule-content { display: grid; gap: 8px; padding: 10px; }
.user-edit-drawer .user-day-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; max-height: none; overflow: visible; padding: 0; border: 0; background: transparent; }
.user-edit-drawer .user-day-row { min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 9px; background: #fbfcfc; }
.user-edit-drawer .user-day-row:first-child,
.user-edit-drawer .user-day-row:last-child { padding: 8px; border: 1px solid var(--line); }
.user-edit-drawer .day-head { gap: 7px; margin-bottom: 6px; }
.user-edit-drawer .day-head strong { font-size: 10px; }
.user-edit-drawer .day-head .btn { min-height: 27px; padding: 3px 6px; font-size: 8px; }
.user-edit-drawer .blocks { gap: 5px; }
.user-edit-drawer .user-block-row { grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr) auto; gap: 5px; }
.user-edit-drawer .user-block-row input { min-width: 0; min-height: 31px; padding: 4px 5px; font-size: 9px; }
.user-edit-drawer .user-block-row > span { font-size: 8px; }
.user-edit-drawer .user-block-row .icon-button { width: 27px; min-height: 27px; font-size: 10px; }
.user-inline-editor .user-day-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 7px; max-height: none; overflow: visible; padding: 0; border: 0; background: transparent; }
.user-inline-editor .user-day-row { min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 9px; background: #fbfcfc; }
.user-inline-editor .day-head { gap: 7px; margin-bottom: 6px; }
.user-inline-editor .day-head strong { font-size: 10px; }
.user-inline-editor .day-head .btn { min-height: 27px; padding: 3px 6px; font-size: 8px; }
.user-inline-editor .blocks { gap: 5px; }
.user-inline-editor .user-block-row { grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr) auto; gap: 5px; }
.user-inline-editor .user-block-row input { min-width: 0; min-height: 31px; padding: 4px 5px; font-size: 9px; }
.user-inline-editor .user-block-row > span { font-size: 8px; }
.user-inline-editor .user-block-row .icon-button { width: 27px; min-height: 27px; font-size: 10px; }

@media (max-width: 760px) {
    #user-modal.open { align-items: flex-start; padding: 8px; }
    .user-create-modal,
    .user-edit-drawer { width: calc(100vw - 16px); max-height: calc(100vh - 16px); }
    .user-form-grid,
    .user-edit-profile-grid { grid-template-columns: 1fr; }
    .user-edit-profile-grid .span-2,
    .user-edit-profile-grid .span-3 { grid-column: auto; }
    .user-edit-drawer .user-day-list { grid-template-columns: 1fr; }
    .user-inline-editor { margin: 0 2px 8px; }
    .user-editor-options,
    .user-inline-editor .user-day-list { grid-template-columns: 1fr; }
    .user-inline-editor-footer > .section-note { display: none; }
    .user-form-actions .btn,
    .drawer-footer.user-form-actions .btn { flex: 1 1 0; min-width: 0; }
}
/* CRM de seguimiento */
.crm-page .content { max-width: 1380px; }
.crm-hero { display:flex; justify-content:space-between; align-items:center; gap:24px; margin-bottom:16px; padding:24px 28px; overflow:hidden; border:1px solid #d8e8e7; border-radius:18px; background:linear-gradient(125deg,#f8fdfc 0%,#e8f6f3 68%,#d8efeb 100%); }
.crm-eyebrow { display:block; margin-bottom:5px; color:#168278; font-size:10px; font-weight:850; letter-spacing:.12em; }
.crm-hero h1,.crm-patient-header h1 { margin:0; color:#17343c; font-size:26px; line-height:1.15; }
.crm-hero p { margin:7px 0 0; color:#61777d; }
.crm-hero-date { display:grid; min-width:82px; padding:12px 15px; border-radius:13px; color:#fff; background:#197c76; text-align:center; box-shadow:0 9px 22px rgba(25,124,118,.18); }
.crm-hero-date span { font-size:10px; text-transform:uppercase; }.crm-hero-date strong { font-size:20px; }
.crm-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.crm-kpi { position:relative; display:grid; min-height:106px; padding:16px 18px; overflow:hidden; border:1px solid #e0e9eb; border-radius:14px; background:#fff; box-shadow:0 3px 12px rgba(28,55,65,.04); }
.crm-kpi::before { position:absolute; top:0; bottom:0; left:0; width:4px; content:""; background:#70aea9; }.crm-kpi.is-overdue::before,.crm-kpi.is-review::before { background:#e29b42; }.crm-kpi.is-completed::before { background:#54a776; }
.crm-kpi span { color:#63747b; font-size:11px; font-weight:750; }.crm-kpi strong { align-self:center; color:#213b43; font-size:29px; }.crm-kpi small { color:#8a989d; font-size:10px; }
.crm-workspace,.crm-panel { border:1px solid #e0e9eb; border-radius:16px; background:#fff; box-shadow:0 4px 16px rgba(24,54,63,.045); }
.crm-filter { display:grid; grid-template-columns:minmax(210px,1fr) repeat(3,minmax(145px,190px)) auto; align-items:end; gap:10px; padding:15px 17px; border-bottom:1px solid #e8eef0; }
.crm-filter-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-right:12px; }.crm-filter-heading>div { display:grid; }.crm-filter-heading strong { color:#263f47; }.crm-filter-heading span,.crm-filter-heading a { color:#7a8a90; font-size:10px; }.crm-filter-heading a { color:#197c76; font-weight:750; }
.crm-filter label { display:grid; gap:5px; margin:0; }.crm-filter label>span { color:#6c7d83; font-size:9px; font-weight:800; text-transform:uppercase; }
.crm-task-list { display:grid; }.crm-task-card { display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:14px; padding:14px 18px; border-bottom:1px solid #edf1f2; color:inherit; text-decoration:none; transition:background .15s,transform .15s; }.crm-task-card:last-child { border-bottom:0; }.crm-task-card:hover { z-index:1; background:#f7fbfa; transform:translateX(2px); }
.crm-patient-avatar { display:grid; width:42px; height:42px; place-items:center; border-radius:13px; color:#17766f; background:#e5f3f1; font-size:12px; font-weight:850; }.crm-patient-avatar.is-large { width:58px; height:58px; border-radius:17px; font-size:16px; }
.crm-task-main { min-width:0; }.crm-task-title,.crm-inline-tags,.crm-action-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }.crm-task-title strong { overflow:hidden; color:#243d45; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.crm-task-main p { margin:4px 0 2px; color:#536a71; font-size:11px; }.crm-task-main small { color:#89969b; font-size:9px; }
.crm-status,.crm-priority,.crm-channel { display:inline-flex; width:max-content; padding:4px 8px; border-radius:999px; font-size:8px; font-weight:850; letter-spacing:.03em; text-transform:uppercase; }
.crm-status { color:#4d6268; background:#edf2f3; }.crm-status.status-in_progress { color:#176f72; background:#e2f2f1; }.crm-status.status-waiting_response { color:#736020; background:#f7f0d8; }.crm-status.status-requires_clinical_review { color:#9b5921; background:#fff0dc; }.crm-status.status-completed { color:#28704b; background:#e4f3e9; }.crm-status.status-cancelled { color:#7a6d70; background:#f0ecee; }
.crm-priority { color:#53666c; background:#edf1f2; }.crm-priority.priority-high { color:#9a5c20; background:#fff0d9; }.crm-priority.priority-urgent { color:#a33e3b; background:#fde7e5; }.crm-priority.priority-low { color:#477276; background:#e8f1f1; }
.crm-task-meta { display:grid; justify-items:end; min-width:130px; }.crm-task-meta strong { margin-top:5px; color:#53666c; font-size:10px; }.crm-task-meta strong.is-overdue { color:#b74b42; }.crm-task-meta small { color:#8b979b; font-size:8px; }.crm-open-arrow { color:#83a09f; font-size:25px; }
.crm-empty { display:grid; justify-items:center; padding:42px 20px; text-align:center; }.crm-empty>span { display:grid; width:45px; height:45px; place-items:center; border-radius:50%; color:#1d8176; background:#e3f4ef; font-size:20px; }.crm-empty h2 { margin:12px 0 3px; }.crm-empty p { margin:0 0 12px; color:#75858a; }.crm-empty.is-compact { padding:22px; }
.crm-birthday-panel { margin-bottom:16px; overflow:hidden; border:1px solid #e4ddf0; border-radius:16px; background:#fff; box-shadow:0 4px 16px rgba(54,38,75,.045); }.crm-birthday-panel>header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; background:linear-gradient(120deg,#fff 0%,#faf7ff 100%); border-bottom:1px solid #eee8f5; }.crm-birthday-panel h2 { margin:2px 0 0; color:#3d3450; font-size:18px; }.crm-birthday-panel header p { margin:5px 0 0; color:#7c7488; font-size:10px; }.crm-birthday-panel>header>strong { padding:8px 12px; border-radius:999px; color:#725493; background:#f0e7fa; font-size:10px; white-space:nowrap; }
.crm-birthday-list { display:grid; }.crm-birthday-card { display:grid; grid-template-columns:auto minmax(150px,.55fr) minmax(280px,1.3fr) auto; align-items:center; gap:14px; padding:15px 18px; border-bottom:1px solid #f0edf3; }.crm-birthday-card:last-child { border-bottom:0; }.crm-birthday-date { display:grid; width:47px; height:50px; place-items:center; align-content:center; border-radius:13px; color:#765595; background:#f2eafb; }.crm-birthday-date strong { font-size:18px; line-height:1; }.crm-birthday-date span { margin-top:3px; font-size:7px; font-weight:850; letter-spacing:.08em; }.crm-birthday-patient { display:grid; min-width:0; }.crm-birthday-patient strong { overflow:hidden; color:#35424a; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.crm-birthday-patient span { margin-top:3px; color:#765595; font-size:10px; font-weight:750; }.crm-birthday-patient small { margin-top:2px; color:#8a969a; font-size:8px; }.crm-birthday-message { padding:11px 13px; border-left:3px solid #a988c4; border-radius:8px; color:#53636a; background:#faf8fc; font-size:10px; line-height:1.45; }.crm-birthday-actions { display:grid; gap:6px; min-width:126px; }.crm-birthday-actions .btn { justify-content:center; min-height:32px; padding:7px 10px; font-size:9px; }.crm-birthday-actions .is-copied { color:#28704b; border-color:#a9d4b8; background:#e8f5ec; }.crm-patient-link { color:#62777d; font-size:8px; font-weight:750; text-align:center; }
.crm-pagination { padding:12px 17px; border-top:1px solid #e8eef0; }
.crm-detail-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }.crm-detail-nav>a:first-child { color:#417075; font-size:11px; font-weight:750; text-decoration:none; }
.crm-patient-header { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:15px; margin-bottom:14px; padding:19px 22px; border:1px solid #dce9e9; border-left:5px solid #6fa9a5; border-radius:16px; background:linear-gradient(120deg,#fff,#f4faf9); }.crm-patient-header.priority-high { border-left-color:#dfa050; }.crm-patient-header.priority-urgent { border-left-color:#d05b55; }.crm-inline-tags { margin-top:8px; }.crm-due { display:grid; justify-items:end; padding-left:20px; border-left:1px solid #dce7e8; }.crm-due span,.crm-due small { color:#79898e; font-size:9px; }.crm-due strong { color:#28434a; font-size:16px; }
.crm-detail-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(250px,.7fr); align-items:start; gap:14px; }.crm-detail-main,.crm-detail-side { display:grid; gap:14px; }
.crm-panel { padding:18px; }.crm-panel>header { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:14px; }.crm-panel header span,.crm-channel { color:#71858a; font-size:8px; font-weight:850; letter-spacing:.1em; }.crm-panel h2 { margin:2px 0 0; color:#29434a; font-size:15px; }.crm-channel { color:#19786f!important; background:#e5f4f1; }
.crm-message-preview { padding:15px 17px; border-left:3px solid #60aaa3; border-radius:8px; color:#425d64; background:#f5faf9; font-size:12px; line-height:1.6; white-space:pre-wrap; }.crm-action-row { margin-top:13px; }.crm-action-row form { margin:0; }
.crm-response-form,.crm-detail-side form { display:grid; gap:11px; }.crm-response-form label { display:grid; gap:6px; }.crm-response-form label>span,.crm-response-form legend { color:#607279; font-size:10px; font-weight:750; }.crm-response-form fieldset { margin:0; padding:0; border:0; }.crm-classification { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:7px; }.crm-classification label { cursor:pointer; }.crm-classification input { position:absolute; opacity:0; }.crm-classification label>span { display:grid; padding:10px; border:1px solid #dce5e7; border-radius:10px; background:#fff; }.crm-classification small { margin-top:2px; color:#75868b; font-size:8px; }.crm-classification label:has(input:checked)>span { box-shadow:inset 0 0 0 2px currentColor; }.crm-classification .is-green { color:#3b8a61; }.crm-classification .is-yellow { color:#c08429; }.crm-classification .is-red { color:#bb4f49; }.crm-safety-note { margin:0; color:#7e8d91; font-size:9px; }
.crm-clinical-alert { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:16px 18px; border:1px solid #f0ca92; border-radius:14px; background:#fff8ec; }.crm-clinical-alert strong { color:#8f571e; }.crm-clinical-alert p { margin:3px 0 0; color:#816c56; font-size:10px; }
.crm-timeline article { position:relative; display:grid; grid-template-columns:12px 1fr; gap:10px; padding-bottom:17px; }.crm-timeline article>span { width:9px; height:9px; margin-top:3px; border:2px solid #fff; border-radius:50%; background:#54a69e; box-shadow:0 0 0 2px #cce6e2; }.crm-timeline article:not(:last-child)::before { position:absolute; top:12px; bottom:2px; left:4px; width:1px; content:""; background:#dce8e8; }.crm-timeline article div { display:grid; }.crm-timeline article small { color:#8b989c; font-size:8px; }.crm-timeline article p { margin:5px 0 0; color:#526a70; font-size:11px; }
.crm-contact-card dl { display:grid; gap:10px; margin-bottom:0; }.crm-contact-card dl>div { display:grid; gap:2px; padding-bottom:9px; border-bottom:1px solid #edf1f2; }.crm-contact-card dt { color:#849297; font-size:8px; font-weight:800; text-transform:uppercase; }.crm-contact-card dd { margin:0; overflow-wrap:anywhere; color:#3e585f; font-size:11px; }
@media(max-width:1000px){.crm-filter{grid-template-columns:repeat(3,1fr)}.crm-filter-heading{grid-column:1/-1}.crm-detail-grid{grid-template-columns:1fr}.crm-detail-side{grid-template-columns:repeat(2,1fr)}.crm-birthday-card{grid-template-columns:auto 1fr auto}.crm-birthday-message{grid-column:2/-1}}
@media(max-width:700px){.crm-hero{align-items:flex-start;padding:19px}.crm-hero h1{font-size:21px}.crm-kpis{grid-template-columns:repeat(2,1fr)}.crm-filter{grid-template-columns:1fr}.crm-filter-heading{grid-column:auto}.crm-task-card{grid-template-columns:auto 1fr auto}.crm-task-meta{grid-column:2;justify-items:start}.crm-open-arrow{grid-column:3;grid-row:1/3}.crm-patient-header{grid-template-columns:auto 1fr}.crm-due{grid-column:1/-1;justify-items:start;padding:9px 0 0;border-top:1px solid #dce7e8;border-left:0}.crm-detail-side{grid-template-columns:1fr}.crm-classification{grid-template-columns:1fr}.crm-clinical-alert{align-items:flex-start;flex-direction:column}.crm-birthday-panel>header{align-items:flex-start}.crm-birthday-card{grid-template-columns:auto 1fr}.crm-birthday-message,.crm-birthday-actions{grid-column:1/-1}.crm-birthday-actions{grid-template-columns:1fr 1fr}.crm-patient-link{grid-column:1/-1}}