:root{
  color-scheme:dark;
  --brand:#06e8e1;
  --brand-dark:#16c5c4;
  --brand-deep:#0a0f0d;
  --brand-light:rgba(6,232,225,0.10);
  --brand-mid:rgba(22,197,196,0.22);
  --amber:#ffbe52;
  --amber-dark:#ffb400;
  --bg-page:#131820;
  --bg-card:#1e2228;
  --bg-surface:#242830;
  --ink:#e4eef4;
  --ink-soft:#9db3bf;
  --ink-faint:#6b8a9a;
  --line:rgba(22,197,196,0.12);
  --line-mid:rgba(6,232,225,0.22);
  --hover-bg:rgba(6,232,225,0.10);
  --hover-bg-strong:rgba(6,232,225,0.16);
  --hover-border:rgba(6,232,225,0.42);
  --hover-ink:#06e8e1;
  --hover-shadow:0 10px 24px rgba(6,232,225,0.12);
  --shadow: 0 24px 64px -30px rgba(6,232,225,0.35);
  --shadow-soft: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --radius:6px;
  --admin-header-height:73px;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --danger:#ef4444;
  --danger-light:#fef2f2;
  --success:#06e8e1;
  --success-light:rgba(6,232,225,0.12);
  --success-dark:#16c5c4;
  --select-menu-bg:#1e2228;
  --select-menu-ink:#f9fafb;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    color-scheme:dark;
    --bg-page:#0f1117;
    --bg-card:#1a1d23;
    --bg-surface:#23272f;
    --ink:#f9fafb;
    --ink-soft:#9ca3af;
    --ink-faint:#6b7280;
    --line:rgba(255,255,255,0.08);
    --line-mid:rgba(255,255,255,0.14);
    --hover-bg:rgba(6,232,225,0.11);
    --hover-bg-strong:rgba(6,232,225,0.16);
    --hover-border:rgba(6,232,225,0.42);
    --hover-ink:#06e8e1;
    --hover-shadow:0 10px 24px rgba(6,232,225,0.12);
    --shadow-soft: 0 1px 3px rgba(0,0,0,0.3);
    --danger-light:#2d1515;
    --select-menu-bg:#1a1d23;
    --select-menu-ink:#f9fafb;
  }
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg-page:#0f1117;
  --bg-card:#1a1d23;
  --bg-surface:#23272f;
  --ink:#f9fafb;
  --ink-soft:#9ca3af;
  --ink-faint:#6b7280;
  --line:rgba(255,255,255,0.08);
  --line-mid:rgba(255,255,255,0.14);
  --hover-bg:rgba(6,232,225,0.11);
  --hover-bg-strong:rgba(6,232,225,0.16);
  --hover-border:rgba(6,232,225,0.42);
  --hover-ink:#06e8e1;
  --hover-shadow:0 10px 24px rgba(6,232,225,0.12);
  --shadow-soft: 0 1px 3px rgba(0,0,0,0.3);
  --danger-light:#2d1515;
  --select-menu-bg:#1a1d23;
  --select-menu-ink:#f9fafb;
}
html[data-theme="light"]{
  color-scheme:light;
  --bg-page:#f7fafb;
  --bg-card:#FFFFFF;
  --bg-surface:#eef7f8;
  --ink:#131820;
  --ink-soft:#516977;
  --ink-faint:#6b8a9a;
  --line:rgba(22,197,196,0.18);
  --line-mid:rgba(22,197,196,0.28);
  --hover-bg:rgba(6,232,225,0.08);
  --hover-bg-strong:rgba(6,232,225,0.14);
  --hover-border:rgba(22,197,196,0.48);
  --hover-ink:#0b7f85;
  --hover-shadow:0 10px 22px rgba(22,197,196,0.14);
  --shadow-soft: 0 1px 3px rgba(19,24,32,0.08), 0 1px 2px rgba(19,24,32,0.04);
  --danger-light:#fef2f2;
  --select-menu-bg:#ffffff;
  --select-menu-ink:#131820;
}
html.theme-switching *,
html.theme-switching *::before,
html.theme-switching *::after{
  transition: background-color .25s ease, color .2s ease, border-color .25s ease, box-shadow .25s ease !important;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg-page);
  color:var(--ink);
  font-family:'DM Sans', -apple-system, Segoe UI, Roboto, sans-serif;
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:'Sora', 'DM Sans', sans-serif; font-weight:700; color:var(--ink); margin:0; line-height:1.25; }
p{margin:0;}
a{color:inherit;}
img{display:block; max-width:100%;}
:focus-visible{outline:3px solid var(--brand); outline-offset:2px;}

select{
  font-family:inherit;
  color:var(--ink);
  background-color:var(--bg-surface);
  border:1px solid var(--line-mid);
  border-radius:var(--radius);
  padding:8px 10px;
}
select option,
select optgroup{
  color:var(--select-menu-ink);
  background-color:var(--select-menu-bg);
}
select:not(:disabled):hover{border-color:var(--hover-border);}
select:disabled{color:var(--ink-faint); cursor:not-allowed; opacity:.72;}

/* ══════════════════════════════════════════════
   PAINEL ADMINISTRATIVO (sidebar + topbar fixos)
   ══════════════════════════════════════════════ */
.admin-layout{display:flex; height:100vh; min-height:100vh; overflow:hidden; background:var(--bg-page);}

.admin-sidebar{
  width:220px; flex-shrink:0; background:var(--bg-card); color:var(--ink);
  border-right:0.5px solid var(--line);
  display:flex; flex-direction:column;
  transition:width 0.25s var(--ease);
  overflow:hidden;
  height:100vh;
}
.admin-sidebar-brand{
  display:flex; align-items:center; justify-content:center;
  height:var(--admin-header-height); box-sizing:border-box; padding:0 14px; flex-shrink:0;
  border-bottom:0.5px solid var(--line);
}
.admin-sidebar-brand-link{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  text-decoration:none;
  color:var(--ink);
  font-weight:700;
  font-size:17px;
}
.admin-sidebar-brand-icon{
  width:36px; height:36px; border-radius:8px; flex-shrink:0;
  object-fit:contain;
  object-position:center;
}
.admin-layout.sidebar-collapsed .admin-sidebar-brand-text{display:none;}

.admin-sidebar-brand-logo{
  display:none;
  width:178px;
  height:54px;
  object-fit:contain;
  object-position:center;
}
html[data-theme="light"] .admin-sidebar-brand-logo.logo-light.configured{display:block;}
html[data-theme="dark"] .admin-sidebar-brand-logo.logo-dark.configured{display:block;}
.admin-layout.sidebar-collapsed .admin-sidebar-brand-logo{display:none !important;}
.admin-sidebar-brand-subtitle{
  display:block;
  margin-top:1px;
  color:var(--ink-soft);
  font-size:10px;
  font-weight:500;
  line-height:1.2;
  white-space:nowrap;
}
.admin-layout.sidebar-collapsed .admin-sidebar-brand-subtitle{display:none;}

/* quando uma logo esta configurada, o icone some no modo expandido (a logo
   ocupa o lugar), mas volta a aparecer no modo recolhido, ja que a logo
   completa nao cabe nos 56px da sidebar recolhida */
.admin-sidebar-brand-link.has-logo .admin-sidebar-brand-icon{display:none;}
.admin-layout.sidebar-collapsed .admin-sidebar-brand-link.has-logo .admin-sidebar-brand-icon{display:block;}
.admin-sidebar-brand-link.has-logo .admin-sidebar-brand-text{display:none;}

.admin-nav{flex:1; min-height:0; padding:24px 0 8px; display:flex; flex-direction:column; gap:6px; overflow:hidden;}
button.admin-nav-item{background:none; border:none; width:100%; text-align:left; font-family:inherit;}
.admin-nav-item .notif-badge{position:static; margin-left:auto; flex-shrink:0;}
.admin-nav-item{
  display:flex; align-items:center; gap:9px;
  padding:8px 16px; font-weight:500; font-size:13.5px;
  color:var(--ink-soft); text-decoration:none; cursor:pointer;
  border-left:2.5px solid transparent;
  transition:color 0.12s var(--ease), background 0.12s var(--ease), border-color 0.12s var(--ease);
}
.admin-nav-item svg{width:16px; height:16px; fill:currentColor; flex-shrink:0;}
.admin-nav-item svg.nav-icon-outline{
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.admin-nav-item:hover{
  color:var(--hover-ink);
  background:var(--hover-bg);
  border-left-color:var(--hover-border);
}
.admin-nav-item.active{color:var(--ink); border-left-color:var(--brand); background:var(--brand-light); font-weight:600;}
html[data-theme="dark"] .admin-nav-item.active{background:rgba(6,232,225,0.10); border-left-color:var(--brand);}

.admin-layout.sidebar-collapsed .admin-sidebar{width:56px; overflow:visible; position:relative; z-index:60;}
.admin-layout.sidebar-collapsed .admin-nav{overflow:visible;}
.admin-layout.sidebar-collapsed .admin-sidebar-brand{padding:0;}
.admin-layout.sidebar-collapsed .admin-nav-item{justify-content:center; padding:11px 0; gap:0;}
.admin-layout.sidebar-collapsed .nav-label{display:none;}
.admin-layout.sidebar-collapsed .admin-nav-item{position:relative;}
.admin-layout.sidebar-collapsed .admin-nav-item::after{
  content:attr(data-tip);
  position:absolute; left:calc(100% + 10px); top:50%;
  transform:translateY(-50%) translateX(-4px);
  background:#1a2535; color:#fff; padding:5px 11px; border-radius:var(--radius);
  font-size:12px; font-weight:500; white-space:nowrap;
  border:1px solid rgba(6,232,225,0.25);
  pointer-events:none; opacity:0;
  transition:opacity 0.15s var(--ease), transform 0.15s var(--ease);
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  z-index:200;
}
.admin-layout.sidebar-collapsed .admin-nav-item:hover::after,
.admin-layout.sidebar-collapsed .admin-nav-item:focus-visible::after{opacity:1; transform:translateY(-50%) translateX(0);}

.admin-main{flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; padding:0; overflow:hidden;}
.admin-topbar{
  height:var(--admin-header-height); flex-shrink:0; background:var(--bg-card); border-bottom:0.5px solid var(--line);
  display:flex; align-items:center; gap:14px; padding:0 24px;
}
.admin-topbar-right{margin-left:auto; display:flex; align-items:center; gap:10px;}
.admin-topbar-profile{display:flex; align-items:center;}
.admin-topbar-profile-btn{
  display:flex; align-items:center; gap:9px; padding:5px 5px 5px 10px; border-radius:999px;
  background:none; border:none; cursor:pointer; color:var(--ink); font-family:inherit;
  transition:background 0.15s var(--ease), box-shadow 0.15s var(--ease);
}
.admin-topbar-profile-btn:hover, .admin-topbar-profile.is-open .admin-topbar-profile-btn{
  background:var(--hover-bg);
  box-shadow:var(--hover-shadow);
}
.admin-profile-av{
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg, var(--brand), var(--brand-dark));
  color:var(--brand-deep); display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; text-transform:uppercase;
  background-size:cover; background-position:center;
  border:1px solid transparent;
}
.admin-profile-av.has-photo{color:transparent; border-color:var(--hover-border);}
.admin-profile-name{font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; max-width:140px; overflow:hidden; text-overflow:ellipsis;}
.sidebar-toggle, .notif-bell-btn{
  background:none; border:none; cursor:pointer; color:var(--ink-soft); padding:7px;
  border-radius:var(--radius); display:flex; align-items:center; justify-content:center;
  transition:background 0.12s var(--ease), color 0.12s var(--ease), box-shadow 0.12s var(--ease);
  flex-shrink:0; position:relative;
}
.sidebar-toggle:hover, .notif-bell-btn:hover{
  background:var(--hover-bg);
  color:var(--hover-ink);
  box-shadow:var(--hover-shadow);
}
.notif-bell-btn.is-open{
  color:var(--hover-ink);
  background:var(--hover-bg-strong);
}

.admin-content{flex:1; min-height:0; overflow-y:auto; padding:32px 24px 24px;}

.admin-page-footer{
  padding:12.8px 24px; border-top:0.5px solid var(--line); flex-shrink:0;
  text-align:center; font-size:12px; color:var(--ink-faint); background:var(--bg-page);
}

/* ---------- grid de métricas (dashboard) ---------- */
.admin-stats-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:14px; margin-bottom:24px;}
.admin-stat{background:var(--bg-card); border:0.5px solid var(--line); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow-soft);}
.admin-stat-val{font-size:28px; font-weight:700; color:var(--ink); margin-bottom:4px;}
.admin-stat-val.warn{color:var(--amber-dark);}
.admin-stat-lbl{font-size:12px; color:var(--ink-soft);}
@media (max-width:520px){ .admin-stats-grid{grid-template-columns:1fr;} }

/* ---------- barra de ações + busca ---------- */
.admin-section-header{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; flex-wrap:wrap;}
.admin-section-header-actions{display:flex; gap:8px; flex-wrap:wrap;}
.admin-search{
  flex:1; min-width:220px; max-width:360px;
  font-family:inherit; font-size:14px; color:var(--ink);
  background:var(--bg-surface); border:1px solid var(--line-mid); border-radius:var(--radius);
  padding:10px 13px; outline:none;
  transition:border-color 0.15s var(--ease), background 0.15s var(--ease), box-shadow 0.15s var(--ease);
}
.admin-search::placeholder{color:var(--ink-faint);}
.admin-search:focus{border-color:var(--brand); background:rgba(6,232,225,0.06); box-shadow:0 0 0 3px rgba(6,232,225,0.16);}

.filters{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; align-items:center;}
.dashboard-filters{
  gap:12px;
  margin:0;
  align-items:center;
}
.dashboard-head-actions{display:flex; align-items:center; justify-content:flex-end; gap:14px; flex-wrap:wrap;}
.advanced-filters-btn{min-height:40px; padding:9px 14px; font-size:11.5px;}
.advanced-filters-btn svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
}
.advanced-filter-count{
  display:grid;
  place-items:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:10px;
  background:var(--brand);
  color:var(--brand-deep);
  font-size:10.5px;
  font-weight:800;
}
.advanced-filter-count[hidden]{display:none;}
.dashboard-filter-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  margin-top:20px;
}
.dashboard-filter-grid .field{margin:0;}
.dashboard-filters .filter-control{
  width:100%;
  min-height:48px;
  min-width:160px;
  border:1px solid var(--line-mid);
  border-radius:8px;
  background:var(--bg-card);
  color:var(--ink);
  font-family:'DM Sans', -apple-system, Segoe UI, Roboto, sans-serif;
  font-size:14px;
  font-weight:600;
  padding:0 14px;
  box-shadow:var(--shadow-soft);
  outline:none;
  transition:border-color 0.15s var(--ease), box-shadow 0.15s var(--ease), background 0.15s var(--ease);
}
.dashboard-filters .filter-control:hover{
  border-color:var(--hover-border);
  box-shadow:var(--hover-shadow);
}
.dashboard-filters .filter-control:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(6,232,225,0.14), var(--shadow-soft);
}
.dashboard-filters select.filter-control{
  min-width:184px;
  padding-right:38px;
  appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ink-soft) 50%),
    linear-gradient(135deg, var(--ink-soft) 50%, transparent 50%);
  background-position:
    calc(100% - 19px) 21px,
    calc(100% - 13px) 21px;
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
}
.dashboard-filters input[type="date"].filter-control{
  min-width:150px;
  text-transform:uppercase;
}
.dashboard-filters input[type="date"].filter-control::-webkit-calendar-picker-indicator{
  cursor:pointer;
  opacity:.75;
  filter:invert(70%) sepia(20%) saturate(620%) hue-rotate(130deg);
}
.dashboard-filters .filter-submit{
  min-height:48px;
  padding:0 26px;
  border-radius:8px;
  font-size:14px;
  box-shadow:0 10px 24px rgba(6,232,225,0.16);
}
.dashboard-filter-actions{align-items:center;}
.dashboard-filter-actions-spacer{flex:1;}
html[data-theme="light"] .dashboard-filters .filter-control{
  background:#ffffff;
  color:#131820;
}
@media (max-width:760px){
  .dashboard-head-actions{width:100%; justify-content:space-between;}
  .dashboard-filter-grid{grid-template-columns:1fr;}
  .dashboard-filter-actions{align-items:stretch; flex-direction:column;}
  .dashboard-filter-actions-spacer{display:none;}
  .dashboard-filter-actions .btn{width:100%;}
  .dashboard-filters .filter-control,
  .dashboard-filters .filter-submit{
    width:100%;
    min-width:0;
  }
}

/* ---------- cards de listagem ---------- */
.users-card{background:var(--bg-card); border:0.5px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-soft); padding:24px; margin-bottom:20px;}
.users-card-title{font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-faint); margin-bottom:14px;}
.users-card:last-child{margin-bottom:0;}

.card{
  background:var(--bg-card); border:0.5px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-soft); padding:28px;
}
.card + .card{margin-top:24px;}

/* ---------- tela de login/troca de senha ---------- */
.auth-shell{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(ellipse 44% 52% at 50% 50%, rgba(6,232,225,0.34) 0%, rgba(10,144,140,0.34) 34%, rgba(0,46,58,0.58) 68%, rgba(0,11,18,0.98) 100%),
    #000a11;
  padding:24px;
}
.auth-card{
  background:rgba(2,34,42,0.92);
  border:1px solid rgba(6,232,225,0.14);
  border-radius:18px;
  box-shadow:0 24px 70px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.035);
  padding:42px 42px 40px;
  width:100%;
  max-width:408px;
  min-height:auto;
  backdrop-filter:blur(10px);
}
.auth-brand{ text-align:center; margin-bottom:8px; }
.auth-brand-logo{
  height:86px;
  width:auto;
  max-width:190px;
  object-fit:contain;
  margin:0 auto 10px;
  filter:drop-shadow(0 0 12px rgba(6,232,225,0.16));
}
.auth-brand-icon{
  width:56px; height:56px; border-radius:14px; margin:0 auto 16px;
  background:linear-gradient(135deg, var(--brand), var(--brand-dark));
  color:var(--brand-deep); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:22px;
}
.auth-brand h1{font-size:19px; text-align:center; color:#ffffff;}
.auth-subtitle{
  text-align:center;
  color:#8faab2;
  font-size:15px;
  font-weight:500;
  margin-bottom:34px;
  margin-top:0;
}

/* ---------- formulários ---------- */
.field{margin-bottom:18px;}
.field label{
  display:block; font-weight:600; font-size:12px;
  letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:7px;
}
.field input, .field select, .field textarea{
  width:100%; font-family:inherit; font-size:14px; color:var(--ink);
  background:var(--bg-surface); border:1px solid var(--line-mid); border-radius:var(--radius); padding:10px 13px;
  transition:border-color 0.15s var(--ease), background 0.15s var(--ease), box-shadow 0.15s var(--ease);
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color:var(--brand); background:rgba(6,232,225,0.06); box-shadow:0 0 0 3px rgba(6,232,225,0.16);
}
.field-hint{font-size:12px; color:var(--ink-faint); margin-top:6px;}
.field-row{display:flex; gap:12px; flex-wrap:wrap;}
.field-row .field{flex:1; min-width:160px;}

/* ---------- cadastro empresarial ---------- */
.client-form-section{
  padding:20px 0;
  border-top:1px solid var(--line);
}
.client-form-section:first-of-type{padding-top:0; border-top:0;}
.client-form-section-title{
  margin-bottom:14px;
  color:var(--ink-faint);
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.client-form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}
.client-form-grid .field{margin-bottom:0;}
.client-form-grid .field.full{grid-column:1 / -1;}
.client-address-grid{grid-template-columns:repeat(4, minmax(0, 1fr));}
.client-address-grid .span-2{grid-column:span 2;}
.cnpj-lookup-status{min-height:19px; margin-top:6px; color:var(--ink-faint); font-size:12px;}
.cnpj-lookup-status.is-loading{color:var(--ink-soft);}
.cnpj-lookup-status.is-success{color:var(--success-dark);}
.cnpj-lookup-status.is-error{color:var(--danger);}
.client-form-actions{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:4px;}
.client-view[hidden],
.client-page-action[hidden]{display:none;}
.client-page-actions{display:flex; align-items:center; gap:10px;}
.client-page-action svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.client-form-card{margin-bottom:20px;}
.client-usage-cell{min-width:190px;}
.client-usage-summary{display:flex; align-items:center; gap:4px; font-size:12px; color:var(--ink-soft);}
.client-usage-summary strong{font-size:14px; color:var(--ink);}
.client-usage-summary span{margin-left:auto; color:var(--ink-faint);}
.client-usage-progress{
  height:6px;
  margin:6px 0;
  overflow:hidden;
  border-radius:999px;
  background:var(--bg-surface);
  border:1px solid var(--line);
}
.client-usage-progress span{display:block; height:100%; border-radius:inherit; background:var(--brand-dark);}
.client-usage-progress.is-warning span{background:var(--amber);}
.client-usage-progress.is-critical span{background:var(--danger);}
.client-usage-meta{font-size:11px; color:var(--ink-faint);}
.usage-percent-input{position:relative;}
.usage-percent-input input{padding-right:34px;}
.usage-percent-input span{position:absolute; top:50%; right:13px; transform:translateY(-50%); color:var(--ink-faint);}
.usage-limit-preview{
  align-self:end;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:66px;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--bg-surface);
}
.usage-limit-preview strong{font-size:12px; color:var(--ink);}
.usage-limit-preview span{font-size:12px; color:var(--ink-faint);}
.consumption-stats-grid{grid-template-columns:repeat(5, minmax(150px, 1fr));}
.consumption-card{min-width:0;}
.consumption-card .users-card-head{margin-bottom:14px;}
.consumption-card .users-card-title{margin-bottom:4px;}
.consumption-card p{font-size:13px;}
.consumption-table{min-width:1080px;}
.consumption-table .client-usage-cell{min-width:220px;}
.consumption-configure-btn{min-width:92px; padding:8px 12px;}
@media (max-width:900px){
  .client-address-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .consumption-stats-grid{grid-template-columns:repeat(2, minmax(150px, 1fr));}
}
@media (max-width:620px){
  .client-form-grid,
  .client-address-grid{grid-template-columns:1fr;}
  .client-form-grid .field.full,
  .client-address-grid .span-2{grid-column:auto;}
  .client-page-actions,
  .client-page-action{width:100%;}
  .consumption-stats-grid{grid-template-columns:1fr;}
}

/* ---------- upload de logos nas configuracoes ---------- */
.settings-logo-section{
  margin:24px 0;
  padding:24px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.settings-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.settings-section-head h2,
.settings-section-head h3{
  font-size:16px;
  margin:0 0 4px;
}
.settings-section-head p{color:var(--ink-soft); font-size:13px;}
.settings-logo-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}
.logo-upload-panel{
  min-width:0;
  padding:18px;
  border:1px solid var(--line-mid);
  border-radius:var(--radius);
  background:var(--bg-surface);
}
.logo-upload-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.logo-upload-panel-head strong{font-size:13px; color:var(--ink);}
.logo-upload-panel-head span{font-size:12px; color:var(--ink-faint);}
.logo-upload-preview{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:126px;
  padding:18px;
  overflow:hidden;
  border:1px dashed rgba(19,24,32,.2);
  border-radius:var(--radius);
  background:#f7fafb;
  color:#516977;
}
.logo-upload-preview-dark{
  border-color:rgba(255,255,255,.14);
  background:#10151c;
  color:#9ca3af;
}
.logo-upload-preview img{
  display:none;
  width:min(100%, 240px);
  height:84px;
  object-fit:contain;
}
.logo-upload-preview img.has-image{display:block;}
.logo-upload-preview span{font-size:12px; text-align:center;}
.logo-upload-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
  flex-wrap:wrap;
}
.logo-upload-actions .btn{flex:1; min-width:132px;}
.logo-upload-picker.is-disabled{opacity:.55; pointer-events:none; cursor:not-allowed;}
.logo-upload-file-name{
  margin-top:9px;
  color:var(--ink-faint);
  font-size:12px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#logo-upload-alert .alert{margin:16px 0 0;}
.logo-upload-log{margin-top:28px;}
.logo-upload-log .table-wrap{overflow-x:auto;}
.logo-upload-log table{min-width:680px;}
.logo-upload-log td{overflow-wrap:anywhere;}
@media (max-width:760px){
  .settings-logo-grid{grid-template-columns:1fr;}
}

.auth-card .field{margin-bottom:24px;}
.auth-card .field label{
  color:#b2c4c9;
  font-family:'Sora', 'DM Sans', sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:0.08em;
  margin-bottom:9px;
}
.auth-card .field input{
  min-height:50px;
  background:#fffbd1;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:9px;
  color:#050505;
  font-size:15.5px;
  padding:12px 16px;
}
.auth-card .field input::placeholder{ color:rgba(0,0,0,0.46); }
.auth-card .field input:focus{ border-color:#fff9c7; background:#fff9c7; box-shadow:0 0 0 3px rgba(6,232,225,0.14), 0 0 22px rgba(255,249,199,0.10); }
.auth-card .btn{width:100%;}
.auth-card .btn-primary{
  min-height:52px;
  margin-top:28px;
  border-radius:9px;
  background:linear-gradient(90deg, #15919a 0%, #16c5c4 52%, #158894 100%);
  color:#ffffff;
  font-family:'Sora', 'DM Sans', sans-serif;
  font-size:15px;
  font-weight:700;
  box-shadow:0 12px 26px rgba(0,0,0,0.18);
}
.auth-card .btn-primary:hover:not(:disabled){
  opacity:1;
  box-shadow:0 16px 32px rgba(0,0,0,0.22), 0 0 22px rgba(6,232,225,0.16);
}
.password-field{position:relative;}
.password-field input{padding-right:48px;}
.password-toggle{
  position:absolute;
  right:13px;
  top:50%;
  transform:translateY(-50%);
  width:30px;
  height:30px;
  border:0;
  background:transparent;
  color:rgba(255,255,255,0.92);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}
.password-toggle svg{width:20px; height:20px; fill:currentColor;}
@media (max-width:560px){
  .auth-shell{padding:18px;}
  .auth-card{
    max-width:100%;
    min-height:auto;
    padding:42px 28px 38px;
  }
  .auth-brand-logo{height:92px;}
  .auth-subtitle{font-size:15px; margin-bottom:34px;}
  .auth-card .btn-primary{margin-top:30px;}
}

.btn{
  font-weight:600; font-size:13px; letter-spacing:0.03em;
  text-decoration:none; padding:11px 20px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid var(--line-mid); border-radius:var(--radius); cursor:pointer; background:transparent; color:var(--ink);
  transition:background 0.15s var(--ease), border-color 0.15s var(--ease), color 0.15s var(--ease), opacity 0.15s var(--ease), box-shadow 0.15s var(--ease);
  font-family:inherit;
}
.btn:disabled{opacity:0.5; cursor:not-allowed;}
.btn:hover:not(:disabled){
  background:var(--hover-bg);
  border-color:var(--hover-border);
  color:var(--hover-ink);
  box-shadow:var(--hover-shadow);
}
.btn-primary{
  background:var(--brand);
  color:var(--brand-deep); border:none; box-shadow:0 8px 24px rgba(6,232,225,0.18);
}
.btn-primary:hover:not(:disabled){
  opacity:1;
  background:linear-gradient(90deg, var(--brand-dark), var(--brand));
  color:var(--brand-deep);
  box-shadow:0 12px 32px rgba(6,232,225,0.24);
  border-color:transparent;
  transform:translateY(-1px);
}
.btn-ghost{background:transparent; color:var(--ink);}
.btn-ghost:hover:not(:disabled){
  background:var(--hover-bg);
  color:var(--hover-ink);
}
.btn-danger{background:transparent; color:var(--danger); border-color:var(--danger); font-size:12px; padding:7px 13px;}
.btn-danger:hover:not(:disabled){
  background:var(--danger-light);
  color:var(--danger);
  border-color:var(--danger);
  box-shadow:0 10px 22px rgba(239,68,68,0.14);
}
/* aliases usados no JS existente */
.btn.secondary{background:transparent; color:var(--ink);}
.btn.secondary:hover:not(:disabled){
  background:var(--hover-bg);
  color:var(--hover-ink);
}
.btn.danger{background:transparent; color:var(--danger); border-color:var(--danger); font-size:12px; padding:7px 13px;}
.btn.danger:hover:not(:disabled){
  background:var(--danger-light);
  color:var(--danger);
  border-color:var(--danger);
  box-shadow:0 10px 22px rgba(239,68,68,0.14);
}

.alert{ padding:13px 16px; border-radius:var(--radius); font-size:13.5px; margin-bottom:20px; border:0.5px solid transparent; }
.alert-erro, .error-msg{background:var(--danger-light); color:var(--danger); border-color:rgba(239,68,68,0.3);}
.alert-sucesso{background:var(--success-light); color:var(--success-dark); border-color:rgba(6,232,225,0.3);}
.error-msg{ margin-top:8px; font-size:13px; }
.error-msg:empty{display:none;}

/* ---------- notificacao flutuante ---------- */
.app-toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:500;
  display:grid;
  grid-template-columns:38px minmax(0, 1fr) 32px;
  align-items:center;
  gap:12px;
  width:min(390px, calc(100vw - 32px));
  padding:15px 14px 15px 16px;
  border:1px solid var(--line-mid);
  border-left:3px solid var(--brand-dark);
  border-radius:8px;
  background:var(--bg-card);
  color:var(--ink);
  box-shadow:0 18px 48px rgba(0,0,0,.28), var(--hover-shadow);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(14px);
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s var(--ease);
}
.app-toast.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.app-toast.is-error{border-left-color:var(--danger);}
.app-toast-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--success-light);
  color:var(--success-dark);
}
.app-toast.is-error .app-toast-icon{background:var(--danger-light); color:var(--danger);}
.app-toast-icon svg,
.app-toast-close svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.app-toast-icon-error{display:none;}
.app-toast.is-error .app-toast-icon-success{display:none;}
.app-toast.is-error .app-toast-icon-error{display:block;}
.app-toast-content{min-width:0;}
.app-toast-content strong{display:block; font-size:13.5px; color:var(--ink);}
.app-toast-content p{margin-top:2px; color:var(--ink-soft); font-size:12.5px; line-height:1.4;}
.app-toast-close{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--ink-faint);
  cursor:pointer;
}
.app-toast-close:hover{background:var(--hover-bg); color:var(--hover-ink);}
@media (max-width:560px){
  .app-toast{right:16px; bottom:16px;}
}

/* ---------- cabeçalho de página ---------- */
.page-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:28px; flex-wrap:wrap;}
.page-head h1{font-size:22px;}
.page-head p{color:var(--ink-soft); font-size:13.5px; margin-top:6px;}
.live-status{display:flex; align-items:center; gap:5px; color:var(--ink-faint); font-size:12px;}
.live-status > span{width:8px; height:8px; border-radius:50%; background:var(--success-dark); box-shadow:0 0 0 4px var(--success-light);}
.live-status strong{color:var(--ink-soft); font-weight:600;}
.usage-status{display:inline-flex; font-size:12px; font-weight:600; color:var(--success-dark);}
.usage-status.is-warning{color:var(--amber-dark);}
.usage-status.is-critical{color:var(--danger);}

.empty-state{text-align:center; padding:48px 24px; color:var(--ink-faint);}
.empty-state strong{display:block; color:var(--ink); font-size:15px; font-weight:600; margin-bottom:6px;}

table.data-table, table{width:100%; border-collapse:collapse; font-size:14px;}
.table-wrap{width:100%; overflow-x:auto;}
.messages-table{min-width:1780px;}
.message-cell-stack{display:flex; min-width:130px; flex-direction:column; gap:3px;}
.message-cell-stack strong{color:var(--ink); font-size:13px; font-weight:600;}
.message-cell-detail{color:var(--ink-faint); font-size:11.5px; white-space:nowrap;}
table.data-table th, table th{
  text-align:left; font-weight:600; font-size:11px; letter-spacing:0.04em;
  text-transform:uppercase; color:var(--ink-faint); padding:0 12px 12px; border-bottom:0.5px solid var(--line);
}
table.data-table td, table td{padding:14px 12px; border-bottom:0.5px solid var(--line); vertical-align:middle;}
table.data-table tr:last-child td, table tr:last-child td{border-bottom:none;}
table a.row-link{color:var(--ink); font-weight:600; text-decoration:none;}
table a.row-link:hover{text-decoration:underline;}
.table-actions-heading{text-align:right !important;}
.rate-table-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  min-width:190px;
}
.rate-table-actions .btn{padding:7px 12px; font-size:12px;}
.client-table-actions{min-width:92px;}
.rate-table-actions svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.rate-status{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  font-weight:600;
}
.rate-status::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--ink-faint);
}
.rate-status.is-active{color:var(--success-dark);}
.rate-status.is-active::before{background:var(--success);}
.rate-status.is-inactive{color:var(--ink-faint);}

.back-link{
  display:inline-flex; align-items:center; gap:6px; margin-bottom:20px;
  font-weight:500; font-size:13px; color:var(--brand-dark); text-decoration:none;
}
.back-link:hover{text-decoration:underline;}

/* ---------- dropdown de ações por linha ---------- */
.row-actions{position:relative; display:inline-block;}
.row-actions-btn{
  background:none; border:none; cursor:pointer; padding:6px; border-radius:6px;
  color:var(--ink-soft); display:flex; align-items:center; justify-content:center;
  transition:background 0.15s var(--ease), color 0.15s var(--ease);
}
.row-actions-btn:hover, .row-actions.is-open .row-actions-btn{
  background:var(--hover-bg);
  color:var(--hover-ink);
}
.row-actions-btn svg{width:18px; height:18px;}
.row-actions-menu{
  position:absolute; right:0; top:calc(100% + 4px); min-width:170px;
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:6px; z-index:50; display:none;
}
.row-actions.is-open .row-actions-menu{display:block;}
.row-actions-menu.is-floating{
  position:fixed;
  right:auto;
  display:block;
  z-index:400;
}
.row-actions-menu a, .row-actions-menu button{
  display:block; width:100%; padding:8px 12px; border-radius:6px; text-decoration:none; color:var(--ink);
  font-size:13.5px; font-weight:500; transition:background 0.15s var(--ease);
  background:none; border:none; text-align:left; cursor:pointer; font-family:inherit;
}
.row-actions-menu a:hover, .row-actions-menu button:hover{
  background:var(--hover-bg);
  color:var(--hover-ink);
}
.row-actions-menu a.is-danger, .row-actions-menu button.is-danger{color:var(--danger);}
.row-actions-menu a.is-danger:hover, .row-actions-menu button.is-danger:hover{background:var(--danger-light);}

.admin-topbar-profile .row-actions-menu{
  min-width:190px;
  top:calc(100% + 10px);
}
.profile-menu-role{
  display:block;
  padding:8px 12px 10px;
  color:var(--ink-faint);
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-bottom:1px solid var(--line);
  margin-bottom:6px;
}

/* ---------- perfil do operador ---------- */
.profile-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:20px;
  align-items:start;
}
.profile-photo-card{
  display:grid;
  grid-template-columns:132px minmax(220px, auto) minmax(280px, 1fr);
  grid-template-areas:
    "photo actions completeness"
    "photo actions meta";
  align-items:center;
  column-gap:24px;
  row-gap:12px;
  text-align:left;
}
.profile-photo-preview{
  grid-area:photo;
  width:132px;
  height:132px;
  border-radius:50%;
  margin:0;
  background:linear-gradient(135deg, var(--brand), var(--brand-dark));
  color:var(--brand-deep);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Sora', 'DM Sans', sans-serif;
  font-size:44px;
  font-weight:800;
  background-size:cover;
  background-position:center;
  border:3px solid var(--hover-border);
  box-shadow:var(--hover-shadow);
}
.profile-photo-preview.has-photo{color:transparent;}
.profile-photo-actions{
  grid-area:actions;
  display:flex;
  gap:10px;
  justify-content:flex-start;
  flex-wrap:wrap;
}
.profile-completeness{
  grid-area:completeness;
  margin-top:0;
  text-align:left;
}
.profile-completeness-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--ink-soft);
  font-size:12px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:9px;
}
.profile-progress{
  height:8px;
  border-radius:999px;
  background:var(--bg-surface);
  border:1px solid var(--line);
  overflow:hidden;
}
.profile-progress-bar{
  height:100%;
  width:0%;
  border-radius:999px;
  background:linear-gradient(90deg, var(--brand-dark), var(--brand));
  transition:width .2s var(--ease);
}
.profile-meta-list{
  grid-area:meta;
  display:grid;
  gap:8px;
  margin-top:0;
  color:var(--ink-soft);
  font-size:13px;
}
.profile-meta-list strong{color:var(--ink);}
.profile-form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}
.profile-form-grid .field{margin-bottom:0;}
.profile-form-grid .field.full{grid-column:1 / -1;}
.profile-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:20px;
}
.profile-password-card{margin-top:20px;}
@media (max-width:860px){
  .profile-photo-card{
    grid-template-columns:1fr;
    grid-template-areas:
      "photo"
      "actions"
      "completeness"
      "meta";
    justify-items:center;
    text-align:center;
  }
  .profile-photo-actions{justify-content:center;}
  .profile-completeness{width:100%;}
  .profile-meta-list{width:100%;}
  .profile-form-grid{grid-template-columns:1fr;}
}

/* ---------- modais ---------- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(15,10,35,0.55); backdrop-filter:blur(2px);
  display:none; align-items:center; justify-content:center; padding:20px; z-index:200;
}
.modal-overlay.is-open{display:flex;}
.modal-box{
  background:var(--bg-card); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); max-width:440px; width:100%; padding:26px;
}
.modal-box.modal-box-wide{max-width:680px;}
.modal-box h3{font-size:17px; font-weight:600; color:var(--ink); margin:0 0 10px;}
.modal-box p{font-size:14px; color:var(--ink-soft); line-height:1.5; margin:0 0 16px;}
.modal-box p strong{color:var(--danger);}
.modal-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:20px;}
.copy-field{display:flex; gap:8px;}
.copy-field input{flex:1;}
.rate-edit-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:0 16px;
}
.rate-active-control{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  color:var(--ink);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}
.rate-active-control input{width:17px; height:17px; accent-color:var(--brand-dark);}
@media (max-width:620px){
  .rate-edit-grid{grid-template-columns:1fr;}
}

/* ---------- notificações (painel lateral) ---------- */
.notif-badge{
  position:absolute; top:2px; right:2px; min-width:15px; height:15px; padding:0 3px;
  background:var(--danger); color:#fff; border-radius:999px;
  font-size:9.5px; font-weight:700; line-height:15px; text-align:center;
}
.notif-empty{padding:40px 20px; text-align:center; font-size:13px; color:var(--ink-faint);}
.notif-item{
  display:flex; gap:12px; align-items:flex-start; padding:16px 20px; border-bottom:0.5px solid var(--line);
  text-decoration:none; color:inherit; cursor:pointer; transition:background 0.12s var(--ease);
}
.notif-item:last-child{border-bottom:none;}
.notif-item:hover{background:var(--hover-bg);}
.notif-item.is-unread{background:var(--brand-light);}
html[data-theme="dark"] .notif-item.is-unread{background:rgba(6,232,225,0.1);}
.notif-icon{
  flex:none; width:36px; height:36px; border-radius:50%; margin-top:1px;
  background:var(--bg-surface); color:var(--brand-dark);
  display:flex; align-items:center; justify-content:center;
}
.notif-icon svg{width:16px; height:16px;}
.notif-item.is-unread .notif-icon{background:var(--brand); color:#fff;}
.notif-item.is-unread.severity-critical .notif-icon{background:var(--danger);}
.notif-content{flex:1; min-width:0;}
.notif-content p{margin:0 0 4px; font-size:13px; color:var(--ink); line-height:1.45; word-break:break-word;}
.notif-title{font-weight:700 !important;}
.notif-item.is-unread p{font-weight:600;}
.notif-date{font-size:11.5px; color:var(--ink-faint);}

.notif-panel-overlay{
  position:fixed; inset:0; background:rgba(15,10,35,0.45); backdrop-filter:blur(1px);
  opacity:0; visibility:hidden; transition:opacity 0.2s var(--ease), visibility 0.2s var(--ease);
  z-index:300;
}
.notif-panel-overlay.is-open{opacity:1; visibility:visible;}
.notif-panel{
  position:fixed; top:0; right:0; height:100vh; width:360px; max-width:88vw;
  background:var(--bg-card); border-left:0.5px solid var(--line); box-shadow:var(--shadow);
  z-index:301; display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform 0.25s var(--ease);
}
.notif-panel.is-open{transform:translateX(0);}
.notif-panel-header{
  display:flex; align-items:center; justify-content:space-between; flex-shrink:0;
  padding:20px 20px 16px; border-bottom:0.5px solid var(--line);
}
.notif-panel-header h3{font-size:15.5px; font-weight:700; color:var(--ink); margin:0;}
.notif-panel-header a{font-size:12px; color:var(--brand-dark); text-decoration:none; font-weight:600;}
.notif-panel-close{
  background:none; border:none; cursor:pointer; padding:6px; border-radius:6px; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center; transition:background 0.15s var(--ease), color 0.15s var(--ease);
}
.notif-panel-close:hover{
  background:var(--hover-bg);
  color:var(--hover-ink);
}
.notif-panel-body{flex:1; overflow-y:auto; padding:0;}

/* ---------- badges de categoria ---------- */
.badge{ display:inline-block; padding:2px 9px; border-radius:999px; font-size:11.5px; font-weight:600; }
.badge.utility { background:var(--brand-light); color:var(--brand-dark); }
.badge.marketing { background:rgba(255,190,82,0.18); color:var(--amber-dark); }
.badge.authentication { background:var(--success-light); color:var(--success-dark); }
.badge.service { background:var(--brand-mid); color:var(--brand-deep); }
.badge.unknown { background:var(--bg-surface); color:var(--ink-faint); }

/* ---------- stepper (onboarding) ---------- */
.stepper { display: flex; gap: 8px; margin-bottom: 24px; }
.step {
  flex: 1; text-align: center; padding: 9px; border-radius: var(--radius);
  background: var(--bg-surface); color: var(--ink-faint); font-size: 12.5px; font-weight: 600;
  border: 1px solid var(--line);
}
.step.active { background: var(--brand); color: white; border-color: var(--brand); }
.step.done { background: var(--success); color: white; border-color: var(--success); }
.step-panel { display: none; }
.step-panel.active { display: block; }
.onboarding-integration-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:1px;
  padding:1px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--line);
}
.onboarding-integration-summary[hidden]{display:none;}
.onboarding-integration-summary > div{padding:12px 14px; background:var(--bg-surface);}
.onboarding-summary-label{display:block; margin-bottom:4px; color:var(--ink-faint); font-size:11px; font-weight:700; text-transform:uppercase;}
.onboarding-integration-summary strong{display:block; overflow:hidden; color:var(--ink); font-size:13px; text-overflow:ellipsis; white-space:nowrap;}
.onboarding-integration-summary strong.is-configured{color:var(--success-dark);}
.onboarding-integration-summary strong.is-pending{color:var(--amber-dark);}
.onboarding-connections{
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--bg-surface);
}
.onboarding-connection-option{
  position:relative;
  display:grid;
  grid-template-columns:22px minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  min-height:64px;
  padding:11px 14px;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  cursor:pointer;
  transition:background .15s var(--ease), color .15s var(--ease);
}
.onboarding-connection-option:last-child{border-bottom:0;}
.onboarding-connection-option:hover{background:var(--hover-bg);}
.onboarding-connection-option:focus-within{outline:2px solid var(--brand); outline-offset:-2px;}
.onboarding-connection-option:has(input:checked){background:var(--brand-light);}
.onboarding-connection-option input{position:absolute; width:1px; height:1px; opacity:0; pointer-events:none;}
.onboarding-connection-check{
  display:grid;
  place-items:center;
  width:20px;
  height:20px;
  border:1px solid var(--line-mid);
  border-radius:4px;
  background:var(--bg-card);
  color:transparent;
}
.onboarding-connection-check svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.onboarding-connection-option input:checked + .onboarding-connection-check{
  border-color:var(--brand);
  background:var(--brand);
  color:var(--brand-ink);
}
.onboarding-connection-content{display:flex; min-width:0; flex-direction:column; gap:3px;}
.onboarding-connection-content strong{overflow:hidden; font-size:13.5px; text-overflow:ellipsis; white-space:nowrap;}
.onboarding-connection-content span{color:var(--ink-faint); font-size:12px;}
.onboarding-connection-id{color:var(--ink-faint); font-size:11.5px; font-variant-numeric:tabular-nums;}
.onboarding-connections-empty{padding:34px 20px;}
.onboarding-step-actions{display:flex; justify-content:flex-end; gap:10px; margin-top:18px; flex-wrap:wrap;}

/* ---------- seletor de clientes (onboarding) ---------- */
.client-combobox{position:relative; width:100%;}
.client-combobox-trigger{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 20px;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:46px;
  padding:10px 13px;
  border:1px solid var(--line-mid);
  border-radius:var(--radius);
  background:var(--bg-surface);
  color:var(--ink);
  font:inherit;
  text-align:left;
  cursor:pointer;
  transition:border-color .15s var(--ease), background .15s var(--ease), box-shadow .15s var(--ease);
}
.client-combobox-trigger:hover:not(:disabled){border-color:var(--hover-border); background:var(--hover-bg);}
.client-combobox-trigger:focus-visible,
.client-combobox.is-open .client-combobox-trigger{
  outline:none;
  border-color:var(--brand);
  background:rgba(6,232,225,.06);
  box-shadow:0 0 0 3px rgba(6,232,225,.16);
}
.client-combobox-trigger:disabled{cursor:not-allowed; color:var(--ink-faint); opacity:.72;}
.client-combobox-trigger svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .15s var(--ease);
}
.client-combobox.is-open .client-combobox-trigger svg{transform:rotate(180deg);}
.client-combobox-value,
.client-combobox-option{min-width:0;}
.client-combobox-value:not(.is-placeholder){display:flex; align-items:center; justify-content:space-between; gap:16px;}
.client-combobox-value.is-placeholder{color:var(--ink-faint);}
.client-combobox-name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.client-combobox-cnpj{
  flex:0 0 auto;
  color:var(--ink-faint);
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.client-combobox-menu{
  position:absolute;
  z-index:80;
  top:calc(100% + 6px);
  left:0;
  width:100%;
  max-height:264px;
  overflow-y:auto;
  padding:6px;
  border:1px solid var(--line-mid);
  border-radius:var(--radius);
  background:var(--bg-card);
  box-shadow:0 18px 44px rgba(0,0,0,.28);
}
.client-combobox-menu[hidden]{display:none;}
.client-combobox-option{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  min-height:42px;
  padding:9px 11px;
  border:0;
  border-radius:4px;
  background:transparent;
  color:var(--ink);
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.client-combobox-option:hover,
.client-combobox-option:focus-visible{outline:none; background:var(--hover-bg); color:var(--hover-ink);}
.client-combobox-option[aria-selected="true"]{background:var(--brand-light); color:var(--brand-dark);}
.client-combobox-option[aria-selected="true"] .client-combobox-cnpj{color:currentColor; opacity:.72;}

@media (max-width:620px){
  .stepper{overflow-x:auto; padding-bottom:4px;}
  .step{min-width:108px;}
  .onboarding-integration-summary{grid-template-columns:1fr;}
  .onboarding-connection-option{grid-template-columns:22px minmax(0, 1fr);}
  .onboarding-connection-id{grid-column:2;}
  .onboarding-step-actions .btn{flex:1 1 180px;}
  .client-combobox-value:not(.is-placeholder),
  .client-combobox-option{align-items:flex-start; flex-direction:column; gap:2px;}
}

.muted { color: var(--ink-faint); font-size: 13px; }
.kpi-label{ font-size:12px; color:var(--ink-soft); margin-bottom:6px; }
.kpi-value{ font-size:28px; font-weight:700; color:var(--ink); }
.kpi-value.warn{ color:var(--amber-dark); }

@media (max-width:820px){
  .admin-layout{height:auto; min-height:100vh; overflow:visible; flex-direction:column;}
  .admin-layout.sidebar-collapsed .admin-sidebar{width:100%;}
  .admin-sidebar{
    width:100%; flex-direction:row; align-items:center; flex-wrap:wrap;
    padding:10px 16px; gap:8px 16px; border-right:none; border-bottom:0.5px solid var(--line);
    height:auto; overflow:visible;
  }
  .admin-sidebar-brand{height:auto; padding:0; border-bottom:none;}
  .admin-sidebar-brand-logo{width:142px; height:44px;}
  .admin-nav{display:flex; flex:1; padding:0; gap:2px; flex-wrap:wrap; overflow:visible;}
  .admin-profile-name{display:none;}
}