/* PV_CHARGE · área interna com a identidade da capa (carvão, areia e champanhe; tipografia leve; pílulas e divisores finos).
   Carrega DEPOIS de charge-identity.css e só acrescenta regras: remove o azul-marinho/verde-água que sobrava do tema V9.
   Cores de estado (online, carregando, falha) continuam semânticas, em tons mais quentes. */
:root,#appShell{
  --pvi-bg:#151614;--pvi-surface:#1c1d19;--pvi-surface2:#22231e;--pvi-raise:#2a2a23;--pvi-field:#181915;
  --pvi-line:#34322a;--pvi-line2:#4d4739;--pvi-text:#f3ede1;--pvi-soft:#cfc5b3;--pvi-mute:#a39a8a;--pvi-dim:#7f776a;
  --pvi-acc:#d9bf97;--pvi-acc2:#eadbc3;--pvi-acc-deep:#a98b62;--pvi-ink:#241f18;
  --pvi-ok:#8fd4a4;--pvi-warn:#e6b766;--pvi-bad:#e8877a;
  /* Variáveis antigas do tema V9 (charge-compact/client), para os componentes que ainda as usam. */
  --bg:#151614;--bg2:#1c1d19;--bg3:#22231e;--card:#22231e;--card2:#2a2a23;--border:#34322a;--border2:#4d4739;
  --text:#f3ede1;--muted:#a39a8a;--teal:#d9bf97;--teal2:#c4a67a;--gold:#d9bf97;--shadow:0 18px 44px rgba(0,0,0,.34);
}

/* ---------- Tipografia: leve e com letras próximas, como a capa ---------- */
#appShell{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
#appShell h1,#appShell h2,#appShell h3,#appShell h4{color:var(--pvi-text);font-weight:600;letter-spacing:-.02em}
#appShell .page h2,#appShell .section-head h2,#appShell .page-head h2{font-size:clamp(26px,2.4vw,34px);font-weight:560;letter-spacing:-.035em;line-height:1.08}
#appShell .hero h2,#appShell .hero h1{font-weight:560;letter-spacing:-.04em;line-height:1.05}
#appShell .topbar h1,#appShell .topbar h2,#appShell #pageTitle{font-weight:600;letter-spacing:-.02em}
#appShell .eyebrow,#appShell .kicker,#appShell .card-label,#appShell .panel-kicker{color:var(--pvi-acc)!important;font-weight:650;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
#appShell p,#appShell label,#appShell small,#appShell .muted,#appShell .kpi-foot,#appShell .side-foot,#appShell .meter-help,#appShell .cv9-password-note,#appShell .cv9-empty,
#appShell #projectContextLabel,#appShell #date,#appShell #topUserRole,#appShell #powerLabel,#appShell #simulatorEnergy{color:var(--pvi-mute)}
#appShell label{color:var(--pvi-soft);letter-spacing:.06em}
#appShell b,#appShell strong{color:inherit}
#appShell .kpi b,#appShell .kpi strong,#appShell .card .value,#appShell .kpi .value{color:var(--pvi-text);font-weight:600;letter-spacing:-.03em}

/* ---------- Superfícies: cartões carvão com borda quente fina (sem azul-marinho) ---------- */
#appShell .card,#appShell .kpi,#appShell .panel,#appShell .gauge-card,#appShell .finance-mini,#appShell .simulator-card,#appShell .queue-admin-panel,#appShell .meter-rule-panel,
#appShell .cv9-kpi,#appShell .cv9-point,#appShell .charger-card,#appShell .metric,#appShell .cv9-card,#appShell .cv9-panel{
  background:linear-gradient(180deg,var(--pvi-surface2),var(--pvi-surface))!important;border:1px solid var(--pvi-line)!important;border-radius:20px;
  box-shadow:0 18px 44px rgba(0,0,0,.28)!important;color:var(--pvi-text)}
#appShell .card:hover,#appShell .kpi:hover{border-color:var(--pvi-line2)!important}
#appShell .hero{background:radial-gradient(120% 140% at 88% 10%,rgba(217,191,151,.16),transparent 55%),linear-gradient(135deg,#25241e,#181915 70%)!important;
  border:1px solid var(--pvi-line2)!important;border-radius:24px;box-shadow:0 24px 60px rgba(0,0,0,.35)!important}
#appShell .hero:before,#appShell .hero:after{background:radial-gradient(circle,rgba(217,191,151,.10),transparent 65%)!important;border-color:transparent!important}
#appShell .hero-brand{background:rgba(217,191,151,.08)!important;border:1px solid var(--pvi-line2)!important;color:var(--pvi-acc2)!important;border-radius:999px}
#appShell .hero-brand *{color:inherit!important}
#appShell .kpi-ico{background:var(--pvi-raise)!important;color:var(--pvi-acc)!important;border:1px solid var(--pvi-line2)!important;border-radius:12px}
#appShell .policy-note,#appShell .notice,#appShell .info-note{background:rgba(217,191,151,.08)!important;border:1px solid var(--pvi-line2)!important;color:var(--pvi-soft)!important;border-radius:14px}
#appShell .policy-note b{color:var(--pvi-acc2)!important}
#appShell .logic-box,#appShell .ocpp-url,#appShell .simulator-screen,#appShell .resident-account-actions,#appShell .cv9-map{background:var(--pvi-field)!important;border:1px solid var(--pvi-line2)!important;color:var(--pvi-soft)!important;border-radius:14px}
#appShell .ocpp-url{color:var(--pvi-acc2)!important;font-family:ui-monospace,Consolas,monospace}
#appShell hr,#appShell .divider{border-color:var(--pvi-line)!important;background:var(--pvi-line)!important}

/* ---------- Campos ---------- */
#appShell input,#appShell select,#appShell textarea,#projectSelector,.cflow input,.cflow select,.cflow textarea{
  background:var(--pvi-field)!important;color:var(--pvi-text)!important;border:1px solid var(--pvi-line2)!important;border-radius:12px}
#appShell input::placeholder,#appShell textarea::placeholder{color:var(--pvi-dim)!important}
#appShell input:focus,#appShell select:focus,#appShell textarea:focus,#projectSelector:focus{outline:none;border-color:var(--pvi-acc)!important;box-shadow:0 0 0 3px rgba(217,191,151,.18)!important}
#appShell select option{background:#1c1d19;color:var(--pvi-text)}
#appShell input[type=checkbox],#appShell input[type=radio],#appShell input[type=range]{accent-color:var(--pvi-acc)}
#appShell input[type=range]{background:transparent!important;border:0!important}

/* ---------- Botões em pílula, como na capa ---------- */
#appShell .primary,#appShell .btn.primary,#appShell button.primary,.cflow .cf-btn:not(.sec):not(.secondary){background:var(--pvi-acc2)!important;border:1px solid var(--pvi-acc2)!important;color:var(--pvi-ink)!important;border-radius:999px;font-weight:600;letter-spacing:0}
#appShell .primary:hover,#appShell .btn.primary:hover{background:#f3e6d2!important}
#appShell .secondary,#appShell .ghost,#appShell .tiny-btn:not(.primary),#appShell .btn:not(.primary){border-radius:999px}
#appShell .secondary,#appShell .ghost{background:transparent!important;border:1px solid #7c7060!important;color:var(--pvi-acc2)!important}
#appShell .secondary:hover,#appShell .ghost:hover{border-color:var(--pvi-acc)!important;background:rgba(217,191,151,.08)!important}
#appShell .logout-theme-btn{color:var(--pvi-soft)!important;border-color:var(--pvi-line2)!important;background:transparent!important;border-radius:999px}
#appShell .user-theme-chip,#appShell .top-user,#appShell .user-card{border-radius:999px}

/* ---------- Chips, estados e barras ---------- */
#appShell .project-chip,#appShell .pill:not(.available):not(.busy):not(.offline):not(.faulted){background:rgba(217,191,151,.10)!important;color:var(--pvi-acc2)!important;border:1px solid var(--pvi-line2)!important;border-radius:999px}
#appShell .pill.available,#appShell .user-status.active,#appShell .status.available{background:rgba(143,212,164,.12)!important;color:var(--pvi-ok)!important;border:1px solid rgba(143,212,164,.32)!important}
#appShell .mode.live,#appShell span.live{background:rgba(143,212,164,.08)!important;color:var(--pvi-ok)!important;border-color:rgba(143,212,164,.28)!important}
#appShell i.led{background:var(--pvi-ok)!important;box-shadow:0 0 0 4px rgba(143,212,164,.16)!important}
#appShell .progress{background:var(--pvi-raise)!important;border:1px solid var(--pvi-line)!important}
#appShell .progress>*{background:linear-gradient(90deg,var(--pvi-acc-deep),var(--pvi-acc2))!important;box-shadow:none!important}
#appShell .bar,#appShell .chart-bar{background:linear-gradient(180deg,var(--pvi-acc2),var(--pvi-acc-deep) 78%,#6f5c42)!important;box-shadow:none!important}
#appShell .ring,#appShell #ring{border-color:var(--pvi-line2)!important}
#appShell table th{background:var(--pvi-raise)!important;color:var(--pvi-soft)!important;letter-spacing:.08em;font-weight:600}
#appShell table td{border-color:var(--pvi-line)!important}
#appShell tr:hover td{background:rgba(217,191,151,.04)}

/* ---------- Recarregar (fluxo) e portal do cliente ---------- */
.cf-skel{background:linear-gradient(90deg,#1e1f1a,#2a2a23,#1e1f1a)!important;background-size:200% 100%!important}
#appShell #cflowRoot{--cf-bg:#151614;--cf-panel:#22231e;--cf-panel2:#2a2a23;--cf-line:#4d4739;--cf-text:#f3ede1;--cf-mute:#a39a8a;--cf-acc:#d9bf97;--cf-acc2:#eadbc3}
#appShell #cflowRoot .cf-tab,#appShell #cflowRoot .cf-chip{border-radius:999px}
#appShell .pv-bottom-nav button.active,#appShell .pv-bottom-nav button[aria-current="page"]{background:rgba(217,191,151,.12)!important;color:var(--pvi-acc2)!important}
#appShell .pv-bottom-nav button{background:transparent}
#appShell .pv-bottom-nav{border-top:1px solid var(--pvi-line)!important}

/* ---------- Menu lateral: divisores finos e ativo em champanhe ---------- */
#appShell .sidebar{border-right:1px solid var(--pvi-line)!important}
#appShell .nav button{border-radius:14px;letter-spacing:-.005em}
#appShell .nav button.active{background:rgba(217,191,151,.12)!important;color:var(--pvi-acc2)!important}
#appShell .side-foot{border-color:var(--pvi-line)!important}

/* ---------- Ajustes finos (textos de apoio com seletores mais específicos no V9) ---------- */
#appShell .section-head p,#appShell .card-head p,#appShell .kpi-top small,#appShell .progress-label,#appShell .progress-label span,#appShell p.muted,#appShell small.muted,#appShell .meter-help,#appShell .cv9-password-note{color:var(--pvi-mute)!important}
#appShell .meter-rule-summary>div{background:var(--pvi-field)!important;border-color:var(--pvi-line2)!important}
#appShell .credential-box code,#appShell code{background:var(--pvi-field)!important;color:var(--pvi-acc2)!important;border:1px solid var(--pvi-line2)!important;border-radius:8px}
#appShell .primary,#appShell .btn.primary,#appShell button.primary{box-shadow:0 10px 26px rgba(0,0,0,.28)!important}

/* ---------- Pesos e tamanhos como na capa (600–650; nada abaixo de 10 px) ---------- */
#appShell .field>label,#appShell .project-selector>label{font-weight:650!important;font-size:10.5px!important;letter-spacing:.12em!important;color:var(--pvi-soft)!important}
#appShell button,#appShell .btn,#appShell .tiny-btn{font-weight:600!important;letter-spacing:0}
#appShell .tiny-btn{font-size:11px!important}
#appShell .mode,#appShell span.live,#appShell .pill,#appShell .project-chip,#appShell .user-status{font-weight:650!important;font-size:10px!important;letter-spacing:.1em}
#appShell .hero-brand,#appShell .hero-brand span{font-weight:650!important;letter-spacing:.08em}
#appShell .avatar{font-weight:650!important}
#appShell .card>p,#appShell .card .cv9-empty,#appShell .resident-account-actions p{color:var(--pvi-mute)!important}

/* ---------- Gráficos restantes (anel de energia, demanda por hora, resumo de usuários) ---------- */
#appShell .ring{background:conic-gradient(var(--pvi-acc) 0 var(--p,0%),var(--pvi-raise) var(--p,0%) 360deg)!important}
#appShell .ring-inner,#appShell .ring:after{background:var(--pvi-surface)!important;color:var(--pvi-text)!important}
#appShell .cv9-hour{background:linear-gradient(var(--pvi-acc2),var(--pvi-acc-deep))!important}
#appShell .cv9-hour span{color:var(--pvi-dim)!important}
#appShell .user-summary div{background:var(--pvi-field)!important;border:1px solid var(--pvi-line2)!important;border-radius:14px}
#appShell .topbar p,#appShell .time small,#appShell .user-theme-chip small,#appShell .barwrap span,#appShell .month-col span{color:var(--pvi-mute)!important}
#appShell .server,#appShell #serverText,#appShell .side-foot b{color:var(--pvi-soft)!important}
#appShell [style*="#eefafa"],#appShell [style*="#EEFAFA"]{background:rgba(217,191,151,.08)!important;border-color:var(--pvi-line2)!important;color:var(--pvi-soft)!important;font-size:11px!important}
#appShell .month-col i,#appShell .energybar i{background:linear-gradient(180deg,var(--pvi-acc2),var(--pvi-acc-deep) 78%,#6f5c42)!important;box-shadow:none!important}
#appShell .energybar{background:var(--pvi-raise)!important}