/* Console da Alvorada · Comanda (3.17)
   Mesmo desenho do sistema do restaurante e do Console do Prontuário: barra
   lateral de ícones, topo com quem está usando, cartões de indicador, blocos
   e tabelas. As cores e medidas vêm das variáveis do index.html. */

/* .field e .cform usam display:grid, que venceria o atributo hidden */
#console [hidden],#modal [hidden]{display:none!important}
#console.on{display:grid;grid-template-columns:var(--railw) 1fr;height:100%;padding:0;overflow:hidden}
#console main{min-height:0}
#console .view{padding:20px 22px 48px}
@media (min-width:621px){
  #cnav{justify-content:flex-start;gap:6px;padding:16px 0;scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.14) transparent}
  #cnav .mark{width:46px;height:46px;margin-bottom:10px}
}
@media (min-width:621px) and (max-height:820px){
  #cnav{gap:4px;padding:12px 0}
  #cnav .mark{width:42px;height:42px;margin-bottom:8px}
}
@media (max-width:620px){
  #console.on{grid-template-columns:1fr;grid-template-rows:1fr auto}
  #console .view{padding:14px 12px 32px}
  #console header .who span span{display:none}
  #console #catu{display:none}
}

/* cabeçalho da página */
.chead2{justify-content:space-between}
.chead2>div:first-child{min-width:0}
.chead2 p{max-width:80ch}
.chead2 .acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.chead2 p .pill{vertical-align:1px}

/* indicadores */
#console .kpis{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.kpi.dest{background:var(--rail);border-color:var(--rail);color:#fff}
.kpi.dest span,.kpi.dest em{color:#9DB1C8}
.kpi.dest b{color:var(--accent)}
.kpi b.cneg{color:var(--bad)}
.kbtn{text-align:left;font:inherit;color:inherit;cursor:pointer;transition:border-color .15s}
.kbtn:hover{border-color:var(--brand)}

/* blocos */
.cbox{margin-bottom:14px}
.box.cbox+.box.cbox{margin-top:0}
.cbox>h3{gap:10px;flex-wrap:wrap}
.cbox>h3>span:first-child{font-size:14.5px}
.cb{padding:16px;display:grid;gap:12px}
.cpad{padding:12px 16px}
.cgrade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));gap:14px;align-items:start}
.ccol{display:grid;gap:14px;min-width:0}
.ccol>.cbox{margin-bottom:0}
.cgrade+.cbox{margin-top:14px}
.cplanos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin-bottom:14px}
.cplanos>.cbox{margin-bottom:0}
#console .gcols{margin-bottom:14px}
#console .gcols>.cbox{margin-bottom:0}

/* textos de apoio */
.csub{display:block;font-size:12px;color:var(--text-2);font-weight:400;margin-top:2px}
.csub2{font-size:12.5px;color:var(--text-2);font-weight:400}
.cbad{color:var(--bad)!important;font-weight:600}
.cajuda{margin:0;font-size:13px;color:var(--text-2);line-height:1.5}
.caviso{background:var(--warn-soft);color:var(--warn);border:1px solid color-mix(in srgb,var(--warn) 25%,transparent);
  border-radius:12px;padding:12px 14px;font-size:13.5px;font-weight:600;margin-bottom:14px;display:flex;
  gap:10px 14px;align-items:center;flex-wrap:wrap;line-height:1.5}
.caviso .btn{margin-left:auto}
.caviso.ok{background:var(--ok-soft);color:var(--ok);border-color:transparent;margin:0}
.ch4{margin:6px 0 0;font-size:13.5px;font-weight:700}
.nw{white-space:nowrap}

/* links que são botões */
.clink{background:none;border:0;padding:0;color:var(--brand);font-weight:600;text-align:left;cursor:pointer}
.clink:hover{text-decoration:underline}
.clink.forte{font-weight:700;color:var(--text);font-size:14px}
.clink.forte:hover{color:var(--brand)}

/* barra de filtro e busca */
.cbarra{display:flex;align-items:center;gap:12px;padding:12px 14px 0;flex-wrap:wrap;border-bottom:1px solid var(--line-soft)}
.cbarra .chips{flex:1;min-width:0;padding-bottom:12px}
.chip .cn{font-style:normal;font-size:11.5px;font-weight:700;opacity:.7;margin-left:2px}
.cbusca{flex:0 1 300px;min-width:200px;padding:9px 12px;border-radius:10px;border:1.5px solid var(--line);
  background:var(--surface-2);margin-bottom:12px}
.cper{margin-bottom:6px}

/* tabelas */
.ctab td{vertical-align:top}
.ctab td.num .btn{white-space:nowrap}
.ctab.mini th,.ctab.mini td{padding:8px 12px}
.ctab.cdados td:first-child{color:var(--text-2);width:34%;white-space:nowrap}
.ctab.cdados td:last-child{overflow-wrap:anywhere}
.ctab tr.cestorno td{color:var(--text-3)}
.ctab tr.cestorno td b{text-decoration:line-through}
.ctab tr.ctotal td{font-weight:800;border-top:2px solid var(--line);background:var(--surface-2)}
.cbox .tw{max-width:100%}

/* formulários */
.cform{display:grid;gap:12px}
.cform.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cform.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){ .cform.c3{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:480px){ .cform.c2,.cform.c3{grid-template-columns:1fr} .cform .field[style*="grid-column"]{grid-column:auto!important} }
.cform .field input[type=date],.cform .field input[type=number],.cform .field input[type=text],
.cform .field input[type=email],.cform .field select{width:100%;padding:10px 12px;border-radius:10px;
  border:1.5px solid var(--line);background:var(--surface-2);min-width:0}
.cb .field textarea,.ctexto{width:100%;padding:10px 12px;border-radius:10px;border:1.5px solid var(--line);
  background:var(--surface-2);font:inherit;font-size:13.5px;line-height:1.5;resize:vertical}
.ctexto.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px}
.cinput{width:100%;padding:10px 12px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface-2)}
.cnum{width:110px;padding:7px 9px;border-radius:9px;border:1.5px solid var(--line);background:var(--surface-2);text-align:right}
.csmall{font-size:13.5px}
.tg.csmall{align-items:flex-start;line-height:1.45}
.tg.csmall input{margin-top:1px;flex:none}
.cacoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cacoes .csub2{flex:1 1 200px}
.clinha{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px}
.cvalor{padding:10px 0 0;font-size:14px;line-height:1.4}
.cvalor b{font-size:17px}
.cmods{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.cmods .mod{padding:9px 10px}
.cmodl{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:8px 14px}
.ccupom{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:800;letter-spacing:.06em;
  background:var(--brand-soft);color:var(--brand);padding:3px 9px;border-radius:8px;font-size:13px}
#console a.btn,#modal a.btn{text-decoration:none;display:inline-flex;align-items:center}
.czap{background:#16A34A}
.czap:hover{filter:brightness(1.07)}
.cmais{border-top:1px solid var(--line-soft)}
.cmais>summary{cursor:pointer;padding:12px 16px;font-size:13.5px;font-weight:600;color:var(--text-2)}
.cmais>summary:hover{color:var(--text)}
.cmais .cpad{padding-top:0}
.ccopiar{display:flex;gap:8px}
.ccopiar input{flex:1;min-width:0;padding:10px 12px;border-radius:10px;border:1.5px solid var(--line);
  background:var(--surface-2);font:12.5px ui-monospace,monospace}
.pill.neutra{background:var(--sunken);color:var(--text-2)}
.quicks button.sel{border-color:var(--brand);color:var(--brand);background:var(--brand-soft)}

/* contrato no modal */
.sheet.larga{width:min(820px,100%)}
.ccontrato{border:1px solid var(--line);border-radius:12px;padding:14px 18px;max-height:46vh;overflow:auto;
  background:var(--surface-2);font-size:13.5px;line-height:1.6}
.ccontrato h4{margin:14px 0 6px;font-size:14px}
.ccontrato h4:first-child{margin-top:0}
.ccontrato p{margin:0 0 8px}
.ccontrato ul{margin:0 0 8px;padding-left:20px}
code{font:12px ui-monospace,monospace;background:var(--sunken);padding:1px 5px;border-radius:5px}
