/* A ficha do cliente da demo. Usa os tokens do Quasar (quasar.css). */
.fd{position:fixed;inset:0;z-index:160;display:none;align-items:center;justify-content:center;padding:22px;background:rgba(14,15,18,.38);backdrop-filter:blur(3px)}
.fd.open{display:flex}
.fd-card{width:1240px;max-width:97vw;height:800px;max-height:94vh;background:var(--card);border:1px solid var(--linha);border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.35);display:flex;flex-direction:column;overflow:hidden;color:var(--txt);font-family:var(--f)}
.fd-top{display:flex;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid var(--linha)}
.fd-top .nome{font-family:var(--fd);font-size:18px;font-weight:700}
.fd-top .sub{font-size:12px;color:var(--txt3);margin-top:2px}
.fd-top .sp{margin-left:auto;display:flex;gap:8px;align-items:center}
.fd-ib{width:38px;height:38px;border-radius:10px;border:1px solid var(--linha);background:var(--card);color:var(--txt2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.fd-ib:hover{background:var(--sup)}
.fd-body{display:flex;flex:1;min-height:0}
.fd-nav{width:232px;min-width:232px;border-right:1px solid var(--linha);padding:14px 12px;display:flex;flex-direction:column;gap:2px}
.fd-nav .step::before{display:none}
.fd-nav .step .n{margin-left:auto;font-size:11px;font-weight:600;color:var(--txt3);background:var(--sup);border-radius:10px;padding:1px 7px}
.fd-nav .step.on .n{background:var(--azul);color:#fff}
.fd-main{flex:1;min-width:0;display:flex;flex-direction:column;padding:20px 24px;overflow:hidden}
.fd-main h3{font-family:var(--fd);font-size:16px;margin:0 0 14px;display:flex;align-items:center;gap:10px}
.fd-main h3 .mini-actbtn{margin-left:auto}
.fd-scroll{overflow:auto;min-height:0;flex:1;padding-right:4px}
.fd-split{display:grid;grid-template-columns:440px 1fr;gap:20px;flex:1;min-height:0}
.fd-split.wide{grid-template-columns:1fr 360px}
.fd-split>div{min-height:0;overflow:auto}
.fd-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;background:var(--sup);color:var(--txt2);white-space:nowrap}
.fd-pill.ok{background:rgba(20,194,91,.14);color:#0E9E4A}.fd-pill.warn{background:rgba(255,196,0,.22);color:#8a6d00}
.fd-pill.bad{background:rgba(239,43,43,.12);color:#C81E1E}.fd-pill.info{background:var(--azulsoft);color:var(--azul)}
body.dark .fd-pill.ok{color:#4BD98C}body.dark .fd-pill.bad{color:#FF8080}body.dark .fd-pill.warn{color:#FFD24A}
.fd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.fd-box{background:var(--sup);border:1px solid var(--linha);border-radius:12px;padding:14px 16px}
.fd-box .lb{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--txt3);font-family:var(--fd)}
.fd-box .v{font-size:15px;font-weight:600;margin-top:4px;word-break:break-word}
.fd-box .v.big{font-size:22px;font-family:var(--fd)}
.fd-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px 14px}
.fd-f input,.fd-f select{min-width:0;width:100%}
.fd-f{display:flex;flex-direction:column;gap:5px}
.fd-f label{font-size:11px;color:var(--txt3);font-weight:600}
.fd-f input,.fd-f select,.fd-f textarea{height:40px;border:1px solid var(--linha2);border-radius:10px;background:var(--card);color:var(--txt);padding:0 12px;font:13.5px var(--f)}
.fd-f textarea{height:auto;min-height:70px;padding:10px 12px;resize:vertical}
.fd-f input:focus,.fd-f select:focus,.fd-f textarea:focus{outline:none;border-color:var(--azul)}
.fd-f.ocr input{border-color:var(--verde);background:rgba(20,194,91,.06)}
.fd-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.fd-cards{display:flex;flex-direction:column;gap:10px}
.fd-c{border:1px solid var(--linha);border-radius:12px;padding:14px 16px;background:var(--card);display:flex;gap:14px;align-items:center;transition:box-shadow .25s,border-color .25s}
.fd-c.on{border-color:var(--azul);box-shadow:0 0 0 3px var(--azulsoft)}
.fd-c .ico{width:40px;height:40px;border-radius:10px;background:var(--sup);display:flex;align-items:center;justify-content:center;color:var(--txt2);flex-shrink:0}
.fd-c .ico .svgic{width:18px;height:18px}
.fd-c .t{font-weight:600;font-size:14px}.fd-c .s{font-size:12px;color:var(--txt3);margin-top:2px}
.fd-c .r{margin-left:auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.fd-c .r .mini-actbtn{white-space:nowrap}
.fd-c .r .valor{font-family:var(--fd);font-weight:700;font-size:16px}
.fd-c.assinou{animation:fdPulse 1.2s ease-out 2}
@keyframes fdPulse{0%{box-shadow:0 0 0 0 rgba(20,194,91,.55)}70%{box-shadow:0 0 0 14px rgba(20,194,91,0)}100%{box-shadow:0 0 0 0 rgba(20,194,91,0)}}
.fd-check{width:44px;height:44px;flex-shrink:0;border-radius:50%;background:var(--verde);color:#fff;display:inline-flex;align-items:center;justify-content:center;animation:fdPop .5s cubic-bezier(.2,1.4,.5,1)}
@keyframes fdPop{from{transform:scale(0)}to{transform:scale(1)}}
.fd-visor{border:1px solid var(--linha);border-radius:12px;background:var(--sup);height:100%;min-height:420px;display:flex;flex-direction:column;overflow:hidden}
.fd-visor .bar{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--linha);font-size:12px;color:var(--txt2)}
.fd-visor .bar .sp{margin-left:auto;display:flex;gap:6px}
.fd-visor .pags{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:14px;align-items:center;cursor:zoom-in}
.fd-visor .pags img{width:100%;max-width:720px;box-shadow:0 4px 18px rgba(0,0,0,.18);border-radius:4px;background:#fff}
.fd-card.cheia .fd-visor .pags{cursor:zoom-out}.fd-card.cheia .fd-visor .pags img{max-width:900px}
.fd-visor .vazio{flex:1;display:flex;align-items:center;justify-content:center;color:var(--txt3);font-size:13px;text-align:center;padding:20px}
.fd-card.cheia .fd-nav,.fd-card.cheia .fd-split>div:first-child{display:none}
.fd-card.cheia .fd-split{grid-template-columns:1fr}
.fd-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:13px}
.fd-dl dt{color:var(--txt3)}.fd-dl dd{margin:0;font-weight:500}
.fd-dl dd.falta{color:var(--vermelho);font-weight:600}
.fd-tl{position:relative;padding-left:26px}
.fd-tl::before{content:"";position:absolute;left:8px;top:6px;bottom:6px;width:2px;background:var(--linha)}
.fd-tl .it{position:relative;padding:6px 0 14px}
.fd-tl .it::before{content:"";position:absolute;left:-23px;top:11px;width:12px;height:12px;border-radius:50%;background:var(--card);border:2px solid var(--linha2)}
.fd-tl .it.fase::before{border-color:var(--azul)}.fd-tl .it.nota::before{border-color:var(--amarelo)}.fd-tl .it.pagamento::before{border-color:var(--verde)}
.fd-tl .it.assinatura::before{border-color:#8b5cf6}.fd-tl .it.contato::before{border-color:var(--laranja)}
.fd-tl .q{font-size:11px;color:var(--txt3)}.fd-tl .x{font-size:13.5px;margin-top:2px}.fd-tl .x b{font-weight:600}
.fd-sec{font-family:var(--fd);font-size:10.5px;letter-spacing:1.4px;text-transform:uppercase;color:var(--txt3);margin:18px 0 10px;display:flex;align-items:center;gap:10px}
.fd-sec:first-child{margin-top:0}
.fd-sec .n{background:var(--sup);border-radius:10px;padding:1px 7px;font-size:11px;letter-spacing:0}
.fd-ocr{border:1.5px dashed var(--linha2);border-radius:12px;padding:18px;text-align:center;color:var(--txt2);cursor:pointer;transition:border-color .2s,background .2s}
.fd-ocr:hover,.fd-ocr.drag{border-color:var(--azul);background:var(--azulsoft)}
.fd-ocr .svgic{width:26px;height:26px;color:var(--azul)}
.fd-prog{height:6px;border-radius:4px;background:var(--linha);overflow:hidden;margin-top:12px}
.fd-prog i{display:block;height:100%;width:0;background:var(--azul);transition:width .4s}
.fd-conf{font-size:11px;color:var(--txt3)}
.fd-code{background:#0E0F12;color:#D7E0EA;font:12px/1.5 ui-monospace,Menlo,monospace;border-radius:10px;padding:14px;white-space:pre;overflow:auto;max-height:360px}
.fd-lk{display:flex;align-items:center;gap:8px;background:var(--sup);border:1px solid var(--linha);border-radius:10px;padding:10px 12px;font:12.5px ui-monospace,monospace;word-break:break-all}
.fd-qa{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.fd-qa .fd-box{cursor:pointer;transition:border-color .2s}.fd-qa .fd-box:hover{border-color:var(--azul)}
.fd-qa .fd-box .svgic{width:20px;height:20px;color:var(--azul);margin-bottom:8px}
.fd-mini{font-size:12px;color:var(--txt3)}
.fd-empty{color:var(--txt3);font-size:13px;padding:22px;text-align:center;border:1px dashed var(--linha2);border-radius:12px}
.mini-actbtn.sm{height:34px;padding:0 12px;font-size:12px}
.mini-actbtn:disabled{opacity:.45;cursor:not-allowed}
.fd-modal{position:fixed;inset:0;z-index:170;display:flex;align-items:center;justify-content:center;background:rgba(14,15,18,.4)}
.fd-modal .in{background:var(--card);border:1px solid var(--linha);border-radius:16px;padding:22px;width:720px;max-width:94vw;max-height:88vh;overflow:auto;color:var(--txt)}
.fd-modal h4{margin:0 0 12px;font-family:var(--fd);font-size:15px}