/* Simulação de Fatura — estilos próprios (usados no painel da MVU e no Portal do
   Parceiro). Cores com valor de reserva para funcionar nos dois sites. */
.sim-app{--sim-ink:var(--ink,#12203b);--sim-muted:var(--muted,#5c6883);--sim-line:var(--line,#dce4f0);--sim-blue:var(--blue,#1c4bd7);--sim-orange:var(--orange,#ff8918);--sim-green:var(--green,#137a53);--sim-shadow:var(--shadow,0 12px 34px rgba(25,49,105,.08))}
.sim-app svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Dados à esquerda, antes/depois à direita (empilha em telas menores). */
.sim-layout{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:16px;align-items:start;margin:6px 0 18px}
.sim-card{background:#fff;border:1px solid var(--sim-line);border-top:4px solid var(--sim-blue);border-radius:14px;box-shadow:var(--sim-shadow);padding:14px 18px}
.sim-card-head{display:flex;align-items:center;gap:10px;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid var(--sim-line)}
.sim-card-head>svg{width:20px;height:20px;color:var(--sim-blue);flex:none}
.sim-card-head h4{margin:0;font-size:15px;font-weight:800;color:var(--sim-ink)}.sim-card-head small{display:block;font-size:11px;color:var(--sim-muted);margin-top:1px}
.sim-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.sim-field{display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-width:0}.sim-field.wide{grid-column:1/-1}
.sim-field>span{font-size:10px;font-weight:700;color:var(--sim-muted);text-transform:uppercase;letter-spacing:.02em}
.sim-field input{border:1px solid var(--sim-line);border-radius:9px;padding:9px 11px;font:inherit;font-size:14px;background:#fff;color:var(--sim-ink);width:100%;box-sizing:border-box}
.sim-field input:focus{outline:2px solid var(--sim-blue);outline-offset:-1px;border-color:var(--sim-blue)}
.sim-geracao input{font-size:20px;font-weight:800;padding:12px 14px}
.sim-acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.sim-btn{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 14px;border:1px solid var(--sim-line);border-radius:10px;background:#fff;color:var(--sim-ink);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.sim-btn:hover{border-color:var(--sim-blue);color:var(--sim-blue)}.sim-btn svg{width:15px;height:15px}
.sim-lado{display:grid;gap:14px;min-width:0}
.sim-resultado{display:grid;gap:14px}
/* Enviar ao cliente (imagem) */
.sim-share[hidden],.sim-share [hidden]{display:none}
.sim-share-botoes{display:flex;flex-wrap:wrap;gap:8px}
.sim-btn-forte{background:var(--sim-blue);border-color:var(--sim-blue);color:#fff}.sim-btn-forte:hover{color:#fff;filter:brightness(1.08)}
.sim-share-msg{margin:10px 0 0;font-size:12px;font-weight:600;color:var(--sim-green)}.sim-share-msg:empty{display:none}
.sim-vazio{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;min-height:260px;padding:26px;border:2px dashed var(--sim-line);border-radius:14px;background:#fbfcff;color:var(--sim-muted)}
.sim-vazio>svg{width:34px;height:34px;color:var(--sim-orange)}.sim-vazio p{margin:0;max-width:360px;font-size:14px}
.sim-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sim-conta{--sim-cor:#b91c1c;background:#fff;border:1px solid var(--sim-line);border-top:4px solid var(--sim-cor);border-radius:14px;box-shadow:var(--sim-shadow);padding:16px 18px;display:flex;flex-direction:column}
.sim-conta.sim-com{--sim-cor:var(--sim-green)}
.sim-conta header{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:var(--sim-cor);text-transform:uppercase;letter-spacing:.03em}
.sim-conta header svg{width:18px;height:18px}
.sim-conta>strong{font-size:30px;font-weight:800;color:var(--sim-ink);margin-top:10px;line-height:1.1}
.sim-conta>small{font-size:12px;color:var(--sim-muted)}
.sim-bar{height:10px;border-radius:99px;background:#eef1f7;margin:12px 0 10px;overflow:hidden}.sim-bar i{display:block;width:0;height:100%;border-radius:99px;background:var(--sim-cor);transition:width .3s}
.sim-conta ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.sim-conta li{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--sim-muted);border-top:1px solid #edf1f7;padding-top:6px}
.sim-conta li b{color:var(--sim-ink);white-space:nowrap}.sim-conta li.sim-ip-off b{color:var(--sim-muted);font-weight:600;font-style:italic}
.sim-economia{display:grid;gap:2px;justify-items:center;text-align:center;padding:18px;border-radius:14px;background:linear-gradient(135deg,#137a53,#1b9a6a);color:#fff;box-shadow:var(--sim-shadow)}
.sim-economia.sem-ganho{background:linear-gradient(135deg,#8a1c1c,#b91c1c)}
.sim-economia span{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;opacity:.9}
.sim-economia strong{font-size:34px;font-weight:800;line-height:1.15}.sim-economia strong small{font-size:14px;font-weight:600;opacity:.85}
.sim-economia em{font-style:normal;font-size:18px;font-weight:800;background:rgba(255,255,255,.18);border-radius:99px;padding:3px 14px;margin-top:4px}
.sim-economia p{margin:6px 0 0;font-size:13px;opacity:.9}
.sim-obs{margin:0;padding:12px 14px 12px 30px;border-radius:12px;background:#fff8ec;border:1px solid #f5dfb8;color:#6b4b00;font-size:12px;line-height:1.55}
/* Consumo instantâneo: campo de % + atalhos */
.sim-inst>label{font-size:10px;font-weight:700;color:var(--sim-muted);text-transform:uppercase;letter-spacing:.02em}
.sim-inst>small{font-size:11px;color:var(--sim-muted);line-height:1.4}
.sim-inst-linha{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sim-pct{position:relative;width:96px;flex:none}.sim-pct input{padding-right:28px;font-weight:700}
.sim-pct em{position:absolute;right:11px;top:50%;transform:translateY(-50%);font-style:normal;font-weight:700;color:var(--sim-muted);pointer-events:none}
.sim-chips{display:flex;flex-wrap:wrap;gap:6px}
.sim-chips button{min-height:36px;padding:0 12px;border:1px solid var(--sim-line);border-radius:99px;background:#fff;color:var(--sim-ink);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.sim-chips button:hover{border-color:var(--sim-blue);color:var(--sim-blue)}
.sim-chips button.ativo{background:var(--sim-blue);border-color:var(--sim-blue);color:#fff}
.sim-conta li.sim-inst-off b{color:var(--sim-green);font-weight:700;font-style:italic}
@media(max-width:1100px){.sim-layout{grid-template-columns:1fr}}
@media(max-width:560px){.sim-compare,.sim-grid{grid-template-columns:1fr}.sim-conta>strong{font-size:26px}.sim-economia strong{font-size:28px}.sim-btn{flex:1;justify-content:center}.sim-share-botoes .sim-btn{flex:1 1 100%;min-height:44px}}
