/* Curaixa UI layer: dental theme, icons, dashboard charts, calendar. Colour tokens live in base.html (light and dark).
   Chart colours --viz-1..3 were run through the data-viz validator on each mode's card colour:
   light #ffffff: #1f6fae #139c93 #d97b1c (CVD dE >= 13.6, normal-vision dE >= 15.2, contrast >= 3:1)
   dark  #122128: #3d7fd1 #1aa38f #cf7a22 (CVD dE >= 13.0, normal-vision dE >= 16.6, contrast >= 3:1) */

/* --- icons ------------------------------------------------------------------------------------------------- */
.ico{width:1.15em;height:1.15em;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em}
.ico-sun{display:none}
:root[data-theme="dark"] .ico-sun{display:inline}
:root[data-theme="dark"] .ico-moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ico-sun{display:inline}:root:not([data-theme="light"]) .ico-moon{display:none}}

/* --- header ------------------------------------------------------------------------------------------------ */
header{border-bottom:2px solid var(--tq-soft);gap:.75rem 1rem}
nav a{display:inline-flex;align-items:center;gap:.4rem;border-radius:8px;color:var(--mut)}
nav a:hover{color:var(--fg);background:var(--tq-soft)}
nav a.on{background:var(--tq-soft);color:var(--acc);box-shadow:inset 0 -2px 0 var(--tq)}
button{border-radius:8px}
.icon-btn{display:inline-grid;place-items:center;padding:.45rem;background:transparent;color:var(--fg);border:1px solid var(--line)}
.icon-btn:hover{background:var(--tq-soft);color:var(--acc)}
.card{border-radius:12px;box-shadow:0 1px 2px rgba(18,48,58,.05)}
h1,h2,h3{font-weight:600;letter-spacing:-.005em}
h1 .ico,h2 .ico{color:var(--tq);margin-right:.3rem}
main.wide{max-width:74rem}
.err{color:var(--bad)}

/* header: Curaixa's own mark and name on the left with the clinic's name small under it; the tools (theme, language menu,
   Log out) on the right; below 1500px the tabs get their own row. */
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;margin-right:auto;color:var(--fg);text-decoration:none;line-height:1.15}
/* the logo kit's lockup as an image (cropped copies in static/brand: Curaixa_Header_Logo.svg for the light theme, the _Dark one, with no
   background box and no tagline, for the dark theme); the clinic's name is small under it, on the lockup's left edge. On a narrow phone
   the lockup is replaced by the chip icon with its pins. */
.lockup{display:block;line-height:0}
.lockup img{display:block;height:2.75rem;width:auto}
.lockup .logo-dark,.lockup .logo-chip{display:none}
:root[data-theme="dark"] .lockup .logo-light{display:none}
:root[data-theme="dark"] .lockup .logo-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lockup .logo-light{display:none}:root:not([data-theme="light"]) .lockup .logo-dark{display:block}}
@media (max-width:359px){.lockup .logo-light,.lockup .logo-dark{display:none!important}.lockup .logo-chip{display:block!important}}
.brand-clinic{font-size:.8rem;color:var(--mut)}
header.bare{border-bottom:0;background:transparent;justify-content:space-between}
.hdr-tools{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
@media (max-width:1499px){header nav{order:3;flex:1 0 100%}}
.logout{margin:0}
/* full logo (login pages): the primary logo with its tagline in the light theme, the dark-mode logo in the dark theme; follows
   the header's theme button and the OS setting exactly as the colour tokens do. */
.full-logo{margin:2rem auto 0;max-width:24rem;text-align:center}
.full-logo img{display:block;width:100%;height:auto}
.full-logo .logo-dark{display:none;border-radius:14px}
:root[data-theme="dark"] .full-logo .logo-light{display:none}
:root[data-theme="dark"] .full-logo .logo-dark{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .full-logo .logo-light{display:none}:root:not([data-theme="light"]) .full-logo .logo-dark{display:block}}
.full-logo + .card{margin-top:1rem!important}
.langmenu-form{margin:0}
.langmenu{position:relative}
.langmenu summary{list-style:none;display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;min-height:2.5rem;padding:.3rem .55rem}
.langmenu summary::-webkit-details-marker{display:none}
.langmenu .caret{width:.9rem;height:.9rem;color:var(--mut);transition:transform .15s}
.langmenu[open] .caret{transform:rotate(180deg)}
.langmenu-list{position:absolute;z-index:20;right:0;top:calc(100% + .3rem);margin:0;padding:.3rem;list-style:none;min-width:11rem;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.langmenu-list button{display:flex;align-items:center;gap:.6rem;width:100%;justify-content:flex-start;background:transparent;color:var(--fg);border:0;box-shadow:none;border-radius:8px;padding:.45rem .6rem;font-weight:400}
.langmenu-list button:hover,.langmenu-list button:focus-visible{background:var(--tq-soft)}
.langmenu-list button[aria-checked="true"]{font-weight:600;color:var(--acc)}
.flagsvg{width:1.9rem;height:1.27rem;border-radius:3px;box-shadow:0 0 0 1px var(--line);flex:none}

/* footer on every page */
.site-footer{margin-top:2rem;border-top:1px solid var(--line);background:var(--card);color:var(--mut);font-size:.9rem}
.footer-in{max-width:74rem;margin:0 auto;padding:1.1rem 1rem;display:flex;flex-wrap:wrap;gap:.75rem 3rem;justify-content:space-between;align-items:flex-start}
.footer-contact h2{margin:0 0 .3rem;font-size:1rem;color:var(--fg)}
.site-footer .facts{gap:.15rem 1rem}
.copyright{margin:0;align-self:flex-end}

/* --- dashboard --------------------------------------------------------------------------------------------- */
.filters{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin:0 0 1rem}
.filters .seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card)}
.filters .seg a{padding:.35rem .8rem;color:var(--mut);text-decoration:none;border-right:1px solid var(--line)}
.filters .seg a:last-child{border-right:0}
.filters .seg a[aria-current="true"]{background:var(--tq-soft);color:var(--acc);font-weight:600}
.dash{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,24rem),1fr));align-items:start}
.dash .span2{grid-column:1/-1}
.dash h2{margin:0 0 .15rem;font-size:1.05rem}
.dash .sub{margin:0 0 .6rem;color:var(--mut);font-size:.85rem}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr));gap:.75rem;margin:.5rem 0 1rem}
.kpi{border:1px solid var(--line);border-radius:10px;padding:.6rem .8rem}
.kpi .lbl{color:var(--mut);font-size:.85rem}
.kpi .num{font-size:1.8rem;font-weight:600;line-height:1.2}
.kpi.neg .num{color:var(--bad)}
.empty{color:var(--mut);margin:.5rem 0}

/* --- charts (SVG drawn by /static/js/charts.js from the figure's JSON; the same numbers are in the table view) --- */
.chart{margin:0;position:relative}
.chart svg{display:block;width:100%;overflow:visible}
.chart .gridline{stroke:var(--viz-grid);stroke-width:1}
.chart .baseline{stroke:var(--line);stroke-width:1}
.chart .tick{fill:var(--mut);font-size:11px}
.chart .lbl{fill:var(--fg);font-size:12px}
.chart .val{fill:var(--fg);font-size:12px;font-weight:600}
.chart .m1{fill:var(--viz-1)}.chart .m2{fill:var(--viz-2)}.chart .m3{fill:var(--viz-3)}.chart .m0{fill:var(--viz-muted)}
.chart .limit{stroke:var(--fg);stroke-width:2;stroke-linecap:round}
.chart .hit{fill:transparent}
.chart .mark{cursor:default;outline:none}
.chart .mark[data-href]{cursor:pointer}
.chart .mark:hover .hit,.chart .mark:focus-visible .hit{fill:var(--tq-soft);opacity:.7}
.chart .mark:focus-visible .hit{stroke:var(--acc);stroke-width:2}
.chart .mark:hover .bar,.chart .mark:focus-visible .bar{filter:brightness(1.12)}
.legend{display:flex;gap:1rem;flex-wrap:wrap;margin:.2rem 0 .4rem;font-size:.85rem;color:var(--mut)}
.legend .sw{display:inline-block;width:.7rem;height:.7rem;border-radius:3px;margin-right:.35rem;vertical-align:-.05rem}
.sw.m1{background:var(--viz-1)}.sw.m2{background:var(--viz-2)}.sw.m3{background:var(--viz-3)}.sw.m0{background:var(--viz-muted)}
.tip{position:fixed;z-index:50;pointer-events:none;background:var(--card);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:.4rem .65rem;font-size:.85rem;box-shadow:0 6px 18px rgba(0,0,0,.16);max-width:16rem}
.tip .t{font-weight:600}.tip .row2{display:flex;align-items:center;gap:.4rem}.tip .v{font-weight:600}.tip .k{color:var(--mut)}
.tip .key{display:inline-block;width:.9rem;height:2px;border-radius:2px}
.key.m1{background:var(--viz-1)}.key.m2{background:var(--viz-2)}.key.m3{background:var(--viz-3)}.key.m0{background:var(--viz-muted)}
.tableview{margin-top:.5rem;font-size:.85rem}
.tableview summary{color:var(--mut)}
.tableview table{margin-top:.4rem}
.chart.loading svg{opacity:.5}

/* --- profit toggle ------------------------------------------------------------------------------------------ */
.profit-off{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.profit-off p{margin:0}
.notice{border-left:3px solid var(--tq);background:var(--tq-soft);border-radius:0 8px 8px 0;padding:.5rem .75rem;margin:.5rem 0;font-size:.9rem}

/* --- calendar ----------------------------------------------------------------------------------------------- */
.cal-bar{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-bottom:1rem}
.cal-bar h1{margin:0 auto 0 .5rem;font-size:1.25rem}
.cal-bar a.btn{display:inline-flex;align-items:center;gap:.25rem;padding:.4rem .75rem;border:1px solid var(--line);border-radius:8px;color:var(--fg);text-decoration:none;background:var(--card)}
.cal-bar a.btn:hover{background:var(--tq-soft)}
.cal-bar .seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card)}
.cal-bar .seg a{padding:.4rem .9rem;color:var(--mut);text-decoration:none;border-right:1px solid var(--line)}
.cal-bar .seg a:last-child{border-right:0}
.cal-bar .seg a[aria-current="true"]{background:var(--tq-soft);color:var(--acc);font-weight:600}
.cal-scroll{overflow-x:auto}
.cal-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;min-width:42rem}
.cal-month .dow,.cal-grid .dow{background:var(--tq-soft);color:var(--mut);font-size:.8rem;text-align:center;padding:.35rem 0}
.cal-month .day{background:var(--card);min-height:6.4rem;padding:.25rem .3rem;display:flex;flex-direction:column;gap:.15rem}
.cal-month .day.other{background:var(--bg);color:var(--mut)}
.cal-month .day .n{font-size:.8rem;color:var(--mut);text-decoration:none;align-self:flex-end;padding:0 .3rem;border-radius:99px}
.cal-month .day.today .n{background:var(--tq);color:var(--on);font-weight:600}
.cal-month .more{font-size:.75rem;color:var(--acc)}
.cal-grid{display:grid;grid-template-columns:3.4rem repeat(var(--cols),minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;min-width:calc(3.4rem + var(--cols) * 8.5rem)}
.cal-grid .hour{background:var(--card);color:var(--mut);font-size:.75rem;padding:.3rem .35rem;text-align:right}
.cal-grid .cell{background:var(--card);min-height:3rem;padding:.2rem .25rem;display:flex;flex-direction:column;gap:.15rem}
.cal-grid .cell.today{background:var(--tq-soft)}
.cal-grid a.dow{text-decoration:none}
.cal-grid .dow.today{background:var(--tq);color:var(--on);font-weight:600}
.appt{display:block;font-size:.8rem;line-height:1.25;padding:.15rem .4rem;border-radius:6px;border-left:3px solid var(--viz-1);background:var(--tq-soft);color:var(--fg);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appt:hover,.appt:focus-visible{outline:2px solid var(--acc);outline-offset:-1px}
.appt.attended{border-left-color:var(--ok)}
.appt.missed{border-left-color:var(--warn)}
.appt.cancelled{border-left-color:var(--mut);color:var(--mut);text-decoration:line-through}
.appt.sel{outline:2px solid var(--acc)}
.appt .st{font-size:.7rem;color:var(--mut)}
/* A chair's (or dentist's) name with its colour as a left bar: shown only when a clinic has more than one chair. */
.chair-tag{display:inline-block;font-size:.7rem;line-height:1.2;padding:0 .3rem;border-radius:4px;border-left:4px solid var(--mut);background:var(--tq-soft);color:var(--fg)}
.chair-tag.c-blue{border-left-color:#3b82f6}.chair-tag.c-green{border-left-color:#16a34a}.chair-tag.c-teal{border-left-color:#0d9488}
.chair-tag.c-purple{border-left-color:#8b5cf6}.chair-tag.c-pink{border-left-color:#db2777}.chair-tag.c-red{border-left-color:#dc2626}
.chair-tag.c-orange{border-left-color:#ea580c}.chair-tag.c-grey{border-left-color:#78716c}
details.resource{margin:.4rem 0}details.resource>summary{cursor:pointer}
.legend-status{display:flex;gap:1rem;flex-wrap:wrap;margin:.75rem 0 0;font-size:.85rem;color:var(--mut)}
.legend-status .dot{display:inline-block;width:1rem;height:.75rem;border-radius:3px;margin-right:.35rem;border-left:3px solid;background:var(--tq-soft)}
.legend-status .scheduled{border-color:var(--viz-1)}.legend-status .attended{border-color:var(--ok)}.legend-status .missed{border-color:var(--warn)}.legend-status .cancelled{border-color:var(--mut)}

/* --- inbox -------------------------------------------------------------------------------------------------- */
.status-row{display:flex;gap:.5rem;flex-wrap:wrap;margin:.75rem 0}
.status-chip{display:inline-flex;align-items:baseline;gap:.5rem;padding:.35rem .75rem;border:1px solid var(--line);border-radius:10px;color:var(--fg);text-decoration:none;background:var(--card)}
.status-chip:hover{background:var(--tq-soft)}
.status-chip[aria-current="true"]{border-color:var(--tq);background:var(--tq-soft)}
.status-chip .n{font-size:1.3rem;font-weight:600;line-height:1}
.status-chip .s{color:var(--mut);font-size:.85rem}
.by{display:inline-block;padding:.05rem .55rem;border-radius:99px;font-size:.8rem;border:1px solid currentColor;white-space:nowrap}
.by.ai{color:var(--acc)}.by.human{color:var(--tq)}.by.none{color:var(--mut);border-style:dashed}
td.reply{max-width:16rem;color:var(--mut);font-size:.85rem}
td.reply span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* --- inventory ---------------------------------------------------------------------------------------------- */
.adjust{display:flex;flex-wrap:nowrap;align-items:center;gap:.25rem}
.adjust input{flex:0 0 3.6rem;width:3.6rem;padding:.4rem .4rem;text-align:center}
.adjust button{flex:none;min-width:2.1rem;padding:.4rem .55rem;line-height:1.1}
td.qtycell{white-space:nowrap}
/* the item list: one fixed layout so every column lines up and no row ever wraps to a second line; narrow screens scroll the
   table sideways instead. Extra batches open as a floating list so the row keeps its height. */
main.xwide{max-width:96rem}
table.stock{table-layout:fixed;min-width:72rem}
table.stock th,table.stock td{padding:.45rem .4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:3.1rem}
table.stock col.c-cat{width:8rem}table.stock col.c-code{width:7.6rem}table.stock col.c-qty{width:5.6rem}table.stock col.c-adj{width:9.8rem}
table.stock col.c-min{width:6rem}table.stock col.c-exp{width:12rem}table.stock col.c-status{width:14.5rem}
table.stock td.statuscell{display:table-cell}
table.stock td.statuscell .badge{margin-right:.3rem}
table.stock td.expcell{overflow:visible}
table.stock td.adjcell,table.stock td:has(> form.adjust){overflow:visible}
.mono-s{font-family:ui-monospace,Consolas,monospace;font-size:.8rem}
.itemcell{display:table-cell}
.itemico{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:.5rem;vertical-align:middle;border-radius:6px;background:var(--tq-soft);color:var(--tq)}
.itemico .thumb{width:28px;height:28px;display:block}
.itemico .ico{width:1.1rem;height:1.1rem;vertical-align:0}
.itemname{vertical-align:middle}
.batchmenu{display:inline-block;position:relative;margin-left:.4rem;vertical-align:middle}
.batchmenu summary{display:inline;font-size:.85rem;white-space:nowrap}
.batchmenu[open] .batches{position:absolute;z-index:6;right:0;top:1.6rem;margin:0;padding:.5rem .75rem .5rem 1.6rem;white-space:nowrap;background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.16)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* --- AI Agent tab and the agent-first Inbox ---------------------------------------------------------------- */
.agent-state{display:flex;align-items:center;gap:.6rem;font-size:1.25rem;flex-wrap:wrap}
.agent-dot{width:1rem;height:1rem;border-radius:50%;border:2px solid var(--mut);flex:none}
.agent-dot.on{background:var(--ok);border-color:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 25%,transparent)}
.agent-dot.warn{background:var(--warn);border-color:var(--warn)}
.agent-status.on{color:var(--ok)}.agent-status.warn{color:var(--warn)}.agent-status.off{color:var(--mut)}
.agent-facts{margin-top:.6rem}
.agent-note{margin:.6rem 0 0;padding:.5rem .75rem;border-left:3px solid var(--line);background:var(--bg);border-radius:4px}
.agent-note.simulated{border-left-color:var(--warn)}
.agent-who.fixed{color:var(--mut)}
.agent-table td{vertical-align:top}.agent-table select{max-width:100%}
.agent-topic{padding:.35rem 0}
.badge.state-answered_agent{color:var(--acc)}.badge.state-answered_human{color:var(--tq)}
.badge.state-needs_human{color:var(--bad);font-weight:600}.badge.state-waiting{color:var(--warn);border-style:dashed}
.badge.state-discarded{color:var(--mut)}
.status-chip.state-needs_human .n{color:var(--bad)}.status-chip.state-answered_agent .n{color:var(--acc)}.status-chip.state-answered_human .n{color:var(--tq)}
.needs-human{border-left:4px solid var(--bad)}.needs-human.clear{border-left-color:var(--ok)}
.needs-human h2{display:flex;align-items:center;gap:.5rem;margin:0 0 .25rem}
.reason{display:block;color:var(--mut);font-size:.85rem;margin-top:.15rem}
.legend{margin:.5rem 0 0}.legend summary{cursor:pointer;color:var(--acc)}
.legend dl{display:grid;grid-template-columns:max-content 1fr;gap:.4rem 1rem;margin:.6rem 0 0}.legend dd{margin:0;color:var(--mut)}
@media (max-width:40rem){.legend dl{grid-template-columns:1fr}}
.agent-facts dd{min-width:0;overflow-wrap:anywhere}
@media (max-width:40rem){.agent-facts{grid-template-columns:1fr}.agent-facts dd{margin-bottom:.4rem}}

/* --- chart shape switch (bars / donut) and the donut ---------------------------------------------------------- */
.shape-switch{display:flex;justify-content:flex-end;gap:.25rem;margin:0 0 .25rem}
.shape-switch button{width:auto;flex:none;display:inline-grid;place-items:center;padding:.25rem .4rem;background:transparent;color:var(--mut);border:1px solid var(--line);border-radius:8px;line-height:1}
.shape-switch button:hover{color:var(--acc);background:var(--tq-soft)}
.shape-switch button[aria-pressed="true"]{color:var(--acc);background:var(--tq-soft);border-color:var(--tq)}
.shape-switch button.off{opacity:.45;cursor:not-allowed}.shape-switch button.off:hover{color:var(--mut);background:transparent}
.donut{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem;justify-content:center}
.donut-svg{width:auto!important;flex:none}
.donut-total{fill:var(--fg);font-size:20px;font-weight:600}
.chart .slice{stroke:var(--card);stroke-width:2}
.donut-legend{list-style:none;margin:0;padding:0;display:grid;gap:.35rem;font-size:.9rem}
.donut-legend li{display:flex;align-items:center;gap:.5rem}.donut-legend strong{margin-left:auto;padding-left:1rem}
.donut-legend .sw{display:inline-block;width:.7rem;height:.7rem;border-radius:3px;flex:none}
.chart .shape-switch svg{width:1.15em;height:1.15em;display:inline-block;overflow:hidden}
.legend[hidden]{display:none}

/* the clinic's own topics (AI Agent tab) */
.agent-table input{width:100%;min-width:8rem}
.topic-actions{white-space:nowrap}.topic-actions button{padding:.4rem .7rem}
button.danger{color:var(--bad);border-color:var(--bad)}
tr.removed td{color:var(--mut);text-decoration:line-through}
.badge.own{color:var(--acc);margin-left:.25rem}
.providers{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.providers li{display:flex;align-items:center;gap:.5rem}
a.button,.button.off{display:inline-block}
.button.off{padding:.6rem 1rem;border-radius:8px;border:1px dashed var(--line);color:var(--mut)}

/* calendar: changes the agent proposed, waiting for a person */
.appt.proposed{border-left-style:dashed;background:transparent;outline:1px dashed var(--acc);outline-offset:-1px;color:var(--fg)}
.appt.proposed .st{font-weight:600;color:var(--acc);font-size:.7rem}
.appt.pend-reschedule{outline:1px dashed var(--warn);outline-offset:-1px}
.appt.pend-cancel{background:repeating-linear-gradient(135deg,var(--tq-soft),var(--tq-soft) 6px,transparent 6px,transparent 12px);outline:1px dashed var(--bad);outline-offset:-1px}
.legend-status .dot.proposed{border-left-style:dashed;border-color:var(--acc);background:transparent;outline:1px dashed var(--acc);outline-offset:-1px}
form.proposal{border-top:1px solid var(--line);padding:.6rem 0}
.proposal-head{margin:0}
.badge.proposal-new{color:var(--acc)}.badge.proposal-reschedule{color:var(--warn)}.badge.proposal-cancel{color:var(--bad)}
.notice-text{white-space:pre-wrap;font-size:.85rem;margin:.3rem 0;padding:.4rem .6rem;border-left:3px solid var(--line);color:var(--fg)}
div.patient-notice{border-top:1px solid var(--line);padding:.6rem 0}div.patient-notice form{display:inline}
.add-appt summary{cursor:pointer;color:var(--acc)}
.cal-waiting{list-style:none;margin:.4rem 0 0;padding:0}.cal-waiting li{padding:.25rem 0;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}

/* === one form and button system, site-wide ================================================================================
   Loaded after the page's own base styles, so it is the single place that sets how a field, a label and a button look.
   Radius and control height are tokens; a field is at least 2.5rem high (a comfortable click and touch target); the primary
   button is a soft, tinted one (accent text on a pale accent, 1px accent-tinted border, no heavy fill or shadow) that keeps
   its contrast (accent on its tint is at least 4.5:1 in light and dark); .secondary is the outline version; .small and the
   +/- adjust buttons are the same buttons, smaller. */
:root{--radius:10px;--ctl-h:2.5rem;--btn-bg:color-mix(in srgb,var(--acc) 12%,var(--card));--btn-bd:color-mix(in srgb,var(--acc) 38%,var(--line))}
label{font-size:.9rem;font-weight:500;line-height:1.3;color:var(--fg)}
input,select,textarea{border:1px solid var(--line);border-radius:var(--radius);min-height:var(--ctl-h);padding:.4rem .75rem;font:inherit;line-height:1.3}
textarea{min-height:6rem}
input[type=checkbox],input[type=radio],input[type=file]{min-height:0}
select{padding-right:.5rem}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
button,a.button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:var(--ctl-h);padding:.4rem 1rem;border-radius:var(--radius);border:1px solid var(--btn-bd);background:var(--btn-bg);color:var(--acc);font:inherit;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:none;transition:background .12s,border-color .12s}
button:hover,a.button:hover{background:color-mix(in srgb,var(--acc) 20%,var(--card));border-color:var(--acc)}
button:active,a.button:active{background:color-mix(in srgb,var(--acc) 28%,var(--card))}
button.secondary,a.button.secondary{background:transparent;border-color:var(--line);color:var(--acc)}
button.secondary:hover,a.button.secondary:hover{background:var(--tq-soft);border-color:var(--btn-bd)}
button.danger,a.button.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--line))}
button.danger:hover{background:color-mix(in srgb,var(--bad) 10%,var(--card));border-color:var(--bad)}
button.small,a.button.small{min-height:2rem;padding:.2rem .7rem;font-size:.9rem;font-weight:500}
button[disabled],button:disabled{opacity:.5;cursor:not-allowed}
.icon-btn{min-width:var(--ctl-h);min-height:var(--ctl-h);border-radius:var(--radius);padding:.3rem}
nav a{border-radius:var(--radius)}
.adjust{gap:.3rem}
.adjust input{flex:0 0 3.6rem;width:3.6rem;min-height:var(--ctl-h);padding:.3rem .3rem;text-align:center}
.adjust button{min-width:var(--ctl-h);padding:.3rem .5rem;font-size:1.15rem;font-weight:500;background:var(--tq-soft);border-color:var(--line)}
.adjust button:hover{border-color:var(--acc);background:color-mix(in srgb,var(--acc) 14%,var(--card))}
.langmenu-list button{border:0;background:transparent;font-weight:400;min-height:2.25rem}
.langmenu-list button:hover{background:var(--tq-soft);border:0}
.cam-torch,.shape-switch button{box-shadow:none}
.btn,.cal-bar a.btn{border-radius:var(--radius)}

/* fields in a form grid line up: the label, the input and the hint of every field sit on shared rows, so a label that
   wraps to two lines (or a hint under one field) does not push its neighbour's input out of line */
.grid{gap:.75rem 1rem;align-items:start;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.grid > div > label:not(.check){margin:0 0 .25rem}
.grid > div > small,.field > small{display:block;margin-top:.3rem;font-size:.82rem;line-height:1.35}
@supports (grid-template-rows:subgrid){
  .grid > div:has(> label:not(.check)){display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:0;align-content:start}
  .grid > div:has(> label:not(.check)) > label{align-self:end}
}
.grid > div:has(> button:only-child){align-self:end}
.field.actions{align-self:end}
h2{margin-top:1.4rem}
.card > h2:first-child,.card > .row > h2:first-child{margin-top:0}
form.row{align-items:flex-end}
.row{gap:.5rem .75rem}
table th{font-size:.85rem;font-weight:600;color:var(--mut)}
.appt-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.4rem}
.appt-head h2{margin:0}
.appt-edit.grid{margin-top:.6rem}
.grid.wide{grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr))}
[hidden]{display:none!important}
.appt-edit .actions{grid-column:1/-1}
button,a.button{text-align:center}
button.danger,a.button.danger{background:color-mix(in srgb,var(--bad) 8%,var(--card))}
/* AI Agent tab: pilot mode card (the confirmation box sits next to its sentence, not stretched like a text field) */
.agent-pilot form{align-items:center;gap:.6rem}
.agent-pilot label{display:flex;gap:.5rem;align-items:center;margin:0;max-width:34rem}
.agent-pilot input[type=checkbox]{width:auto;flex:none;margin:0}

/* Inline styles of the templates, as classes: every style="..." was moved out of the HTML so that the Content-Security-Policy can
   refuse inline styles (core/headers.py). One class per distinct declaration; the class name spells it. */
.s-overflow-x-auto.s-overflow-x-auto.s-overflow-x-auto{overflow-x:auto}
.s-margin-top-0.s-margin-top-0.s-margin-top-0{margin-top:0}
.s-margin-0-0-p75rem.s-margin-0-0-p75rem.s-margin-0-0-p75rem{margin:0 0 .75rem}
.s-position-absolute.s-position-absolute.s-position-absolute{position:absolute}
.s-margin-top-1rem.s-margin-top-1rem.s-margin-top-1rem{margin-top:1rem}
.s-grid-column-1-1.s-grid-column-1-1.s-grid-column-1-1{grid-column:1/-1}
.s-flex-wrap-nowrap.s-flex-wrap-nowrap.s-flex-wrap-nowrap{flex-wrap:nowrap}
.s-margin-bottom-1rem.s-margin-bottom-1rem.s-margin-bottom-1rem{margin-bottom:1rem}
.s-width-5rem.s-width-5rem.s-width-5rem{width:5rem}
.s-flex-0-1-8rem.s-flex-0-1-8rem.s-flex-0-1-8rem{flex:0 1 8rem}
.s-flex-0-1-10rem.s-flex-0-1-10rem.s-flex-0-1-10rem{flex:0 1 10rem}
.s-font-size-p85rem-margin-bottom-0.s-font-size-p85rem-margin-bottom-0.s-font-size-p85rem-margin-bottom-0{font-size:.85rem;margin-bottom:0}
.s-margin-0-0-p5rem.s-margin-0-0-p5rem.s-margin-0-0-p5rem{margin:0 0 .5rem}
.s-font-size-p85rem.s-font-size-p85rem.s-font-size-p85rem{font-size:.85rem}
.s-margin-top-p75rem.s-margin-top-p75rem.s-margin-top-p75rem{margin-top:.75rem}
.s-margin-left-auto.s-margin-left-auto.s-margin-left-auto{margin-left:auto}
.s-display-flex-gap-p4rem-align-items-center.s-display-flex-gap-p4rem-align-items-center.s-display-flex-gap-p4rem-align-items-center{display:flex;gap:.4rem;align-items:center}
.s-margin-p4rem-0-0.s-margin-p4rem-0-0.s-margin-p4rem-0-0{margin:.4rem 0 0}
.s-margin-p75rem-0-0.s-margin-p75rem-0-0.s-margin-p75rem-0-0{margin:.75rem 0 0}
.s-margin-bottom-0.s-margin-bottom-0.s-margin-bottom-0{margin-bottom:0}
.s-margin-p2rem-0.s-margin-p2rem-0.s-margin-p2rem-0{margin:.2rem 0}
.s-font-size-p9rem.s-font-size-p9rem.s-font-size-p9rem{font-size:.9rem}
.s-font-size-p8rem.s-font-size-p8rem.s-font-size-p8rem{font-size:.8rem}
.s-grid-column-span-2.s-grid-column-span-2.s-grid-column-span-2{grid-column:span 2}
.s-font-size-1rem.s-font-size-1rem.s-font-size-1rem{font-size:1rem}
.s-display-block.s-display-block.s-display-block{display:block}
.s-margin-bottom-p5rem.s-margin-bottom-p5rem.s-margin-bottom-p5rem{margin-bottom:.5rem}
.s-margin-0.s-margin-0.s-margin-0{margin:0}
.s-justify-content-space-between.s-justify-content-space-between.s-justify-content-space-between{justify-content:space-between}
.s-margin-1rem.s-margin-1rem.s-margin-1rem{margin:1rem}
.s-margin-top-p4rem.s-margin-top-p4rem.s-margin-top-p4rem{margin-top:.4rem}
.s-font-size-p85rem-margin-p2rem-0.s-font-size-p85rem-margin-p2rem-0.s-font-size-p85rem-margin-p2rem-0{font-size:.85rem;margin:.2rem 0}
.s-margin-p5rem-0-0.s-margin-p5rem-0-0.s-margin-p5rem-0-0{margin:.5rem 0 0}
.s-margin-top-p5rem.s-margin-top-p5rem.s-margin-top-p5rem{margin-top:.5rem}
.s-max-width-32rem-margin-3rem-auto.s-max-width-32rem-margin-3rem-auto.s-max-width-32rem-margin-3rem-auto{max-width:32rem;margin:3rem auto}
.s-margin-1p5rem-0-p5rem.s-margin-1p5rem-0-p5rem.s-margin-1p5rem-0-p5rem{margin:1.5rem 0 .5rem}
.s-margin-1rem-0-p2rem.s-margin-1rem-0-p2rem.s-margin-1rem-0-p2rem{margin:1rem 0 .2rem}
.s-max-width-30rem-margin-p5rem-0-1rem.s-max-width-30rem-margin-p5rem-0-1rem.s-max-width-30rem-margin-p5rem-0-1rem{max-width:30rem;margin:.5rem 0 1rem}
.s-margin-p2rem-0-font-size-p95rem.s-margin-p2rem-0-font-size-p95rem.s-margin-p2rem-0-font-size-p95rem{margin:.2rem 0;font-size:.95rem}
.s-margin-top-1rem-border-1px-solid-var-line-border-radius-6px.s-margin-top-1rem-border-1px-solid-var-line-border-radius-6px.s-margin-top-1rem-border-1px-solid-var-line-border-radius-6px{margin-top:1rem;border:1px solid var(--line);border-radius:6px}
.s-padding-1rem.s-padding-1rem.s-padding-1rem{padding:1rem}
.s-max-width-24rem-margin-3rem-auto.s-max-width-24rem-margin-3rem-auto.s-max-width-24rem-margin-3rem-auto{max-width:24rem;margin:3rem auto}
.s-max-width-26rem-margin-3rem-auto.s-max-width-26rem-margin-3rem-auto.s-max-width-26rem-margin-3rem-auto{max-width:26rem;margin:3rem auto}
.s-max-width-34rem-margin-3rem-auto.s-max-width-34rem-margin-3rem-auto.s-max-width-34rem-margin-3rem-auto{max-width:34rem;margin:3rem auto}
.s-margin-p75rem-0-background-fff-display-inline-block-padding-p5rem-border-radius-p25rem.s-margin-p75rem-0-background-fff-display-inline-block-padding-p5rem-border-radius-p25rem.s-margin-p75rem-0-background-fff-display-inline-block-padding-p5rem-border-radius-p25rem{margin:.75rem 0;background:#fff;display:inline-block;padding:.5rem;border-radius:.25rem}
.s-font-size-p85rem-margin-top-0.s-font-size-p85rem-margin-top-0.s-font-size-p85rem-margin-top-0{font-size:.85rem;margin-top:0}
.s-max-width-28rem-margin-2rem-auto.s-max-width-28rem-margin-2rem-auto.s-max-width-28rem-margin-2rem-auto{max-width:28rem;margin:2rem auto}
.s-margin-p3rem-0.s-margin-p3rem-0.s-margin-p3rem-0{margin:.3rem 0}
.s-margin-top-p75rem-align-items-flex-end.s-margin-top-p75rem-align-items-flex-end.s-margin-top-p75rem-align-items-flex-end{margin-top:.75rem;align-items:flex-end}
.s-flex-0-0-12rem.s-flex-0-0-12rem.s-flex-0-0-12rem{flex:0 0 12rem}
.s-font-size-p85rem-margin-p4rem-0-0.s-font-size-p85rem-margin-p4rem-0-0.s-font-size-p85rem-margin-p4rem-0-0{font-size:.85rem;margin:.4rem 0 0}
.s-width-6rem-flex-0-0-6rem.s-width-6rem-flex-0-0-6rem.s-width-6rem-flex-0-0-6rem{width:6rem;flex:0 0 6rem}
.s-width-8rem.s-width-8rem.s-width-8rem{width:8rem}
.s-font-size-1p1rem-line-height-1p8.s-font-size-1p1rem-line-height-1p8.s-font-size-1p1rem-line-height-1p8{font-size:1.1rem;line-height:1.8}
.s-margin-p3rem-0-0-font-size-p9rem.s-margin-p3rem-0-0-font-size-p9rem.s-margin-p3rem-0-0-font-size-p9rem{margin:.3rem 0 0;font-size:.9rem}
.s-margin-p75rem-0.s-margin-p75rem-0.s-margin-p75rem-0{margin:.75rem 0}
.s-width-6rem.s-width-6rem.s-width-6rem{width:6rem}
.s-display-inline.s-display-inline.s-display-inline{display:inline}
.s-overflow-x-auto-margin-top-1rem.s-overflow-x-auto-margin-top-1rem.s-overflow-x-auto-margin-top-1rem{overflow-x:auto;margin-top:1rem}
.s-margin-0-0-1rem-1p8rem.s-margin-0-0-1rem-1p8rem.s-margin-0-0-1rem-1p8rem{margin:0 0 1rem 1.8rem}
/* the few that depended on a value: progress bar widths in whole percent, and the Calendar's number of day columns */
div.pct-0.pct-0.pct-0{width:0%}div.pct-1.pct-1.pct-1{width:1%}div.pct-2.pct-2.pct-2{width:2%}div.pct-3.pct-3.pct-3{width:3%}div.pct-4.pct-4.pct-4{width:4%}div.pct-5.pct-5.pct-5{width:5%}div.pct-6.pct-6.pct-6{width:6%}div.pct-7.pct-7.pct-7{width:7%}div.pct-8.pct-8.pct-8{width:8%}div.pct-9.pct-9.pct-9{width:9%}
div.pct-10.pct-10.pct-10{width:10%}div.pct-11.pct-11.pct-11{width:11%}div.pct-12.pct-12.pct-12{width:12%}div.pct-13.pct-13.pct-13{width:13%}div.pct-14.pct-14.pct-14{width:14%}div.pct-15.pct-15.pct-15{width:15%}div.pct-16.pct-16.pct-16{width:16%}div.pct-17.pct-17.pct-17{width:17%}div.pct-18.pct-18.pct-18{width:18%}div.pct-19.pct-19.pct-19{width:19%}
div.pct-20.pct-20.pct-20{width:20%}div.pct-21.pct-21.pct-21{width:21%}div.pct-22.pct-22.pct-22{width:22%}div.pct-23.pct-23.pct-23{width:23%}div.pct-24.pct-24.pct-24{width:24%}div.pct-25.pct-25.pct-25{width:25%}div.pct-26.pct-26.pct-26{width:26%}div.pct-27.pct-27.pct-27{width:27%}div.pct-28.pct-28.pct-28{width:28%}div.pct-29.pct-29.pct-29{width:29%}
div.pct-30.pct-30.pct-30{width:30%}div.pct-31.pct-31.pct-31{width:31%}div.pct-32.pct-32.pct-32{width:32%}div.pct-33.pct-33.pct-33{width:33%}div.pct-34.pct-34.pct-34{width:34%}div.pct-35.pct-35.pct-35{width:35%}div.pct-36.pct-36.pct-36{width:36%}div.pct-37.pct-37.pct-37{width:37%}div.pct-38.pct-38.pct-38{width:38%}div.pct-39.pct-39.pct-39{width:39%}
div.pct-40.pct-40.pct-40{width:40%}div.pct-41.pct-41.pct-41{width:41%}div.pct-42.pct-42.pct-42{width:42%}div.pct-43.pct-43.pct-43{width:43%}div.pct-44.pct-44.pct-44{width:44%}div.pct-45.pct-45.pct-45{width:45%}div.pct-46.pct-46.pct-46{width:46%}div.pct-47.pct-47.pct-47{width:47%}div.pct-48.pct-48.pct-48{width:48%}div.pct-49.pct-49.pct-49{width:49%}
div.pct-50.pct-50.pct-50{width:50%}div.pct-51.pct-51.pct-51{width:51%}div.pct-52.pct-52.pct-52{width:52%}div.pct-53.pct-53.pct-53{width:53%}div.pct-54.pct-54.pct-54{width:54%}div.pct-55.pct-55.pct-55{width:55%}div.pct-56.pct-56.pct-56{width:56%}div.pct-57.pct-57.pct-57{width:57%}div.pct-58.pct-58.pct-58{width:58%}div.pct-59.pct-59.pct-59{width:59%}
div.pct-60.pct-60.pct-60{width:60%}div.pct-61.pct-61.pct-61{width:61%}div.pct-62.pct-62.pct-62{width:62%}div.pct-63.pct-63.pct-63{width:63%}div.pct-64.pct-64.pct-64{width:64%}div.pct-65.pct-65.pct-65{width:65%}div.pct-66.pct-66.pct-66{width:66%}div.pct-67.pct-67.pct-67{width:67%}div.pct-68.pct-68.pct-68{width:68%}div.pct-69.pct-69.pct-69{width:69%}
div.pct-70.pct-70.pct-70{width:70%}div.pct-71.pct-71.pct-71{width:71%}div.pct-72.pct-72.pct-72{width:72%}div.pct-73.pct-73.pct-73{width:73%}div.pct-74.pct-74.pct-74{width:74%}div.pct-75.pct-75.pct-75{width:75%}div.pct-76.pct-76.pct-76{width:76%}div.pct-77.pct-77.pct-77{width:77%}div.pct-78.pct-78.pct-78{width:78%}div.pct-79.pct-79.pct-79{width:79%}
div.pct-80.pct-80.pct-80{width:80%}div.pct-81.pct-81.pct-81{width:81%}div.pct-82.pct-82.pct-82{width:82%}div.pct-83.pct-83.pct-83{width:83%}div.pct-84.pct-84.pct-84{width:84%}div.pct-85.pct-85.pct-85{width:85%}div.pct-86.pct-86.pct-86{width:86%}div.pct-87.pct-87.pct-87{width:87%}div.pct-88.pct-88.pct-88{width:88%}div.pct-89.pct-89.pct-89{width:89%}
div.pct-90.pct-90.pct-90{width:90%}div.pct-91.pct-91.pct-91{width:91%}div.pct-92.pct-92.pct-92{width:92%}div.pct-93.pct-93.pct-93{width:93%}div.pct-94.pct-94.pct-94{width:94%}div.pct-95.pct-95.pct-95{width:95%}div.pct-96.pct-96.pct-96{width:96%}div.pct-97.pct-97.pct-97{width:97%}div.pct-98.pct-98.pct-98{width:98%}div.pct-99.pct-99.pct-99{width:99%}
div.pct-100.pct-100.pct-100{width:100%}
.cols-1{--cols:1}.cols-2{--cols:2}.cols-3{--cols:3}.cols-4{--cols:4}.cols-5{--cols:5}.cols-6{--cols:6}.cols-7{--cols:7}.cols-8{--cols:8}.cols-9{--cols:9}.cols-10{--cols:10}.cols-11{--cols:11}.cols-12{--cols:12}.cols-13{--cols:13}.cols-14{--cols:14}.cols-15{--cols:15}.cols-16{--cols:16}.cols-17{--cols:17}.cols-18{--cols:18}.cols-19{--cols:19}.cols-20{--cols:20}.cols-21{--cols:21}.cols-22{--cols:22}.cols-23{--cols:23}.cols-24{--cols:24}.cols-25{--cols:25}.cols-26{--cols:26}.cols-27{--cols:27}.cols-28{--cols:28}.cols-29{--cols:29}.cols-30{--cols:30}.cols-31{--cols:31}
