/* ============================================================
   PAINEL ADM v3 — style.css COMPLETO (substitui o anterior)
   Fontes: Fraunces (display/títulos) + Plus Jakarta Sans (corpo)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,600;0,9..144,700;0,9..144,900;1,9..144,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

/* ---- VARIÁVEIS ---- */
:root {
  --accent:        #e85d04;
  --accent-l:      #f5813a;
  --accent-d:      #b54200;
  --green:         #22c55e;
  --red:           #ef4444;
  --blue:          #3b82f6;
  --yellow:        #f59e0b;

  /* dark */
  --bg-d:          #0a0c12;
  --bg2-d:         #12151f;
  --bg3-d:         #1a1e2e;
  --border-d:      #252a3d;
  --t1-d:          #eef0f8;
  --t2-d:          #7c85a2;
  --sidebar-d:     #0d1017;

  /* light */
  --bg-l:          #f2f4fb;
  --bg2-l:         #ffffff;
  --bg3-l:         #e8ecf6;
  --border-l:      #d0d8f0;
  --t1-l:          #111827;
  --t2-l:          #6b7280;
  --sidebar-l:     #111827;

  --sw:            252px;
  --sw-c:          64px;
  --th:            60px;
  --r:             14px;
  --r-sm:          9px;
  --shadow:        0 4px 28px rgba(0,0,0,.16);
  --tr:            .2s cubic-bezier(.4,0,.2,1);
}

/* ---- RESET ---- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { font-size:14.5px; scroll-behavior:smooth }
body { font-family:'Plus Jakarta Sans',sans-serif; min-height:100vh; transition:background var(--tr),color var(--tr) }
a { text-decoration:none; color:inherit }
button { cursor:pointer; border:none; background:none; font-family:inherit }
img { max-width:100% }
ul { list-style:none }
input,select,textarea { font-family:inherit }

/* ---- TEMAS ---- */
body.tema-dark {
  background:var(--bg-d); color:var(--t1-d);
  --bg:var(--bg-d); --bg2:var(--bg2-d); --bg3:var(--bg3-d);
  --border:var(--border-d); --t1:var(--t1-d); --t2:var(--t2-d);
  --sbg:var(--sidebar-d);
}
body.tema-light {
  background:var(--bg-l); color:var(--t1-l);
  --bg:var(--bg-l); --bg2:var(--bg2-l); --bg3:var(--bg3-l);
  --border:var(--border-l); --t1:var(--t1-l); --t2:var(--t2-l);
  --sbg:var(--sidebar-l);
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar {
  position:fixed; top:0; left:0; width:var(--sw); height:100vh;
  background:var(--sbg); display:flex; flex-direction:column;
  transition:width var(--tr); z-index:1000; overflow:hidden;
  border-right:1px solid rgba(255,255,255,.05);
}
.sidebar.collapsed { width:var(--sw-c) }

/* header */
.sb-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 14px; min-height:66px;
  border-bottom:1px solid rgba(255,255,255,.06);
  gap:10px;
}
.sb-logo { display:flex; align-items:center; gap:10px; overflow:hidden; min-width:0 }
.sb-logo-img {
  width:34px; height:34px; border-radius:9px; object-fit:cover;
  flex-shrink:0; background:var(--accent);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:'Fraunces',serif; font-weight:900; font-size:1rem;
}
.sb-logo-img img { width:34px; height:34px; border-radius:9px; object-fit:cover }
.sb-name {
  font-family:'Fraunces',serif; font-weight:700; font-size:.95rem;
  color:#fff; white-space:nowrap; opacity:1; transition:opacity var(--tr);
  overflow:hidden;
}
.sidebar.collapsed .sb-name { opacity:0; width:0 }

.sb-toggle {
  width:28px; height:28px; border-radius:7px; flex-shrink:0;
  color:rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center;
  transition:background var(--tr), color var(--tr); font-size:.9rem;
}
.sb-toggle:hover { background:rgba(255,255,255,.08); color:#fff }
.sidebar.collapsed .sb-toggle { margin:0 auto }

/* nav */
.sb-nav { flex:1; overflow-y:auto; overflow-x:hidden; padding:8px 0 }
.sb-nav::-webkit-scrollbar { width:3px }
.sb-nav::-webkit-scrollbar-thumb { background:rgba(255,255,255,.1); border-radius:3px }

.nav-section-label {
  font-size:.62rem; text-transform:uppercase; letter-spacing:.1em;
  color:rgba(255,255,255,.25); padding:14px 16px 5px;
  white-space:nowrap; overflow:hidden;
  transition:opacity var(--tr);
}
.sidebar.collapsed .nav-section-label { opacity:0 }

.nav-link {
  display:flex; align-items:center; gap:10px;
  padding:0 10px; margin:1px 8px;
  color:rgba(255,255,255,.55); border-radius:var(--r-sm);
  font-size:.84rem; font-weight:500;
  transition:background var(--tr), color var(--tr);
  white-space:nowrap; overflow:hidden;
  height:40px;
  position:relative;
}
/* icon slot — fixed width so icon stays centered when collapsed */
.nav-link .ni {
  width:36px; height:36px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:.95rem; border-radius:8px; transition:background var(--tr);
}
.nav-link .nl { flex:1; overflow:hidden; text-overflow:ellipsis; transition:opacity var(--tr), max-width var(--tr); max-width:200px }
.nav-link .na { font-size:.65rem; color:rgba(255,255,255,.3); margin-left:auto; transition:transform var(--tr); flex-shrink:0 }

.nav-link:hover { background:rgba(255,255,255,.06); color:rgba(255,255,255,.9) }
.nav-link:hover .ni { background:rgba(232,93,4,.18) }
.nav-link.active { background:rgba(232,93,4,.15); color:#fff }
.nav-link.active .ni { background:rgba(232,93,4,.25); color:var(--accent-l) }
.nav-link.active::before {
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:3px; height:60%; background:var(--accent); border-radius:0 3px 3px 0;
}

/* collapsed: hide text */
.sidebar.collapsed .nav-link { padding:0; margin:1px 8px; justify-content:center }
.sidebar.collapsed .nav-link .nl,
.sidebar.collapsed .nav-link .na { opacity:0; max-width:0; overflow:hidden }
.sidebar.collapsed .nav-link .ni { width:42px; height:42px }
.sidebar.collapsed .nav-link.active::before { display:none }

/* tooltip on collapsed */
.sidebar.collapsed .nav-link { position:relative }
.sidebar.collapsed .nav-link:hover::after {
  content:attr(data-tooltip);
  position:absolute; left:calc(var(--sw-c) + 6px); top:50%; transform:translateY(-50%);
  background:#1a1f2e; color:#fff; font-size:.78rem; font-weight:500;
  padding:5px 12px; border-radius:8px; white-space:nowrap;
  box-shadow:0 4px 16px rgba(0,0,0,.3); z-index:2000;
  pointer-events:none;
}

/* submenu */
.nav-sub { overflow:hidden; max-height:0; transition:max-height .32s cubic-bezier(.4,0,.2,1) }
.nav-sub.open { max-height:600px }
.sidebar.collapsed .nav-sub { display:none !important }
.nav-sub .nav-link { margin-left:18px; margin-right:8px; font-size:.81rem; height:36px }
.nav-sub .nav-link .ni { width:28px; height:28px; font-size:.8rem }
.nav-toggle.open .na { transform:rotate(180deg) }

/* sidebar footer — apenas avatar (ícone) + botão Sair */
.sb-footer {
  padding:10px 12px; border-top:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; gap:8px;
}
.sb-user { display:flex; align-items:center; gap:8px; flex:0 0 auto }
.sb-avatar {
  width:32px; height:32px; border-radius:50%; background:var(--accent);
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-weight:700; font-size:.78rem; flex-shrink:0;
  overflow:hidden;
}
.sb-avatar img { width:100%; height:100%; object-fit:cover }
/* esconder info de texto — já está no topbar */
.sb-user-info { display:none }
.sidebar.collapsed .sb-footer { justify-content:center }

/* logout btn — destaque maior */
.sb-logout {
  flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
  height:34px; border-radius:9px;
  color:rgba(255,255,255,.55); font-size:.82rem; font-weight:500;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  transition:all var(--tr); padding:0 10px;
}
.sb-logout:hover { background:rgba(239,68,68,.18); color:#ef4444; border-color:rgba(239,68,68,.35) }
.sidebar.collapsed .sb-logout { flex:0; width:36px; padding:0; font-size:.9rem }
.sidebar.collapsed .sb-logout .sb-logout-text { display:none }

/* ============================================================
   MAIN WRAPPER + TOPBAR
   ============================================================ */
.main-wrapper { margin-left:var(--sw); min-height:100vh; display:flex; flex-direction:column; transition:margin-left var(--tr) }
.main-wrapper.expanded { margin-left:var(--sw-c) }

.topbar {
  position:sticky; top:0; z-index:900; height:var(--th);
  background:var(--bg2); border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 22px; gap:14px;
}
.topbar-left { display:flex; align-items:center; gap:12px }
.topbar-toggle {
  width:34px; height:34px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  color:var(--t2); font-size:1rem; transition:all var(--tr);
}
.topbar-toggle:hover { background:var(--bg3); color:var(--accent) }
.breadcrumb { font-size:.78rem; color:var(--t2); display:flex; align-items:center; gap:5px }
.breadcrumb i { color:var(--accent); font-size:.75rem }

.topbar-right { display:flex; align-items:center; gap:8px }
.btn-tema {
  width:34px; height:34px; border-radius:50%;
  background:var(--bg3); color:var(--t1); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; font-size:.9rem;
  transition:all var(--tr);
}
.btn-tema:hover { background:var(--accent); color:#fff; border-color:var(--accent) }
.topbar-clock { font-size:.75rem; color:var(--t2); font-weight:500; font-variant-numeric:tabular-nums }

/* Profile button */
.profile-btn {
  display:flex; align-items:center; gap:8px;
  padding:5px 10px 5px 5px; border-radius:40px;
  background:var(--bg3); border:1px solid var(--border);
  cursor:pointer; transition:all var(--tr);
}
.profile-btn:hover { border-color:var(--accent) }
.pb-avatar {
  width:30px; height:30px; border-radius:50%;
  background:var(--accent); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.8rem; overflow:hidden; flex-shrink:0;
}
.pb-avatar img { width:100%; height:100%; object-fit:cover }
.pb-info { line-height:1.2 }
.pb-name { font-size:.8rem; font-weight:600; color:var(--t1) }
.pb-role { font-size:.67rem; color:var(--t2) }
.pb-chevron { font-size:.65rem; color:var(--t2); transition:transform var(--tr) }
.profile-btn.open .pb-chevron { transform:rotate(180deg) }

/* Profile dropdown */
.profile-dropdown {
  position:absolute; top:calc(100% + 8px); right:22px;
  width:270px; background:var(--bg2); border:1px solid var(--border);
  border-radius:16px; box-shadow:0 16px 48px rgba(0,0,0,.25);
  z-index:9999; overflow:hidden;
  opacity:0; pointer-events:none; transform:translateY(-6px) scale(.97);
  transition:all .2s cubic-bezier(.4,0,.2,1);
}
.profile-dropdown.open { opacity:1; pointer-events:all; transform:translateY(0) scale(1) }
.pd-head {
  padding:18px 18px 14px; text-align:center;
  background:linear-gradient(135deg,var(--bg3),var(--bg2));
  border-bottom:1px solid var(--border);
}
.pd-big-avatar {
  width:60px; height:60px; border-radius:50%;
  background:var(--accent); margin:0 auto 10px;
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-size:1.5rem; font-weight:700; color:#fff;
  border:3px solid rgba(232,93,4,.3); overflow:hidden;
}
.pd-big-avatar img { width:100%; height:100%; object-fit:cover }
.pd-uname { font-weight:700; font-size:.9rem }
.pd-uemail { font-size:.73rem; color:var(--t2); margin-top:2px }
.pd-menu { padding:6px }
.pd-item {
  display:flex; align-items:center; gap:10px;
  padding:9px 11px; border-radius:9px;
  font-size:.83rem; color:var(--t1); cursor:pointer;
  transition:all var(--tr);
}
.pd-item i { width:16px; text-align:center; color:var(--t2); font-size:.85rem }
.pd-item:hover { background:var(--bg3); color:var(--accent) }
.pd-item:hover i { color:var(--accent) }
.pd-item.danger { color:var(--red) }
.pd-item.danger i { color:var(--red) }
.pd-item.danger:hover { background:rgba(239,68,68,.08) }
.pd-sep { height:1px; background:var(--border); margin:4px 8px }

/* ============================================================
   PAGE LAYOUT
   ============================================================ */
.page-content { flex:1; padding:26px }
.page-title {
  font-family:'Fraunces',serif; font-size:1.55rem; font-weight:700;
  display:flex; align-items:center; gap:10px; margin-bottom:4px;
  letter-spacing:-.02em;
}
.page-title i { color:var(--accent); font-size:1.2rem }
.page-subtitle { color:var(--t2); font-size:.83rem; margin-bottom:22px }
.page-footer {
  padding:14px 26px; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; font-size:.75rem; color:var(--t2);
}

/* ============================================================
   CARDS
   ============================================================ */
.card {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--r); padding:22px; margin-bottom:18px;
  box-shadow:var(--shadow);
}
.card-title {
  font-family:'Fraunces',serif; font-weight:700; font-size:.95rem;
  margin-bottom:16px; display:flex; align-items:center; gap:8px;
}
.card-title i { color:var(--accent) }

/* ---- DASHBOARD STATS 3×3 ---- */
.stats-33 {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px; margin-bottom:20px;
}
.sc {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--r); padding:16px 18px;
  position:relative; overflow:hidden;
  transition:transform .2s, box-shadow .2s;
  cursor:default;
}
.sc:hover { transform:translateY(-3px); box-shadow:0 10px 32px rgba(0,0,0,.2) }
.sc::after {
  content:''; position:absolute; right:-20px; top:-20px;
  width:80px; height:80px; border-radius:50%; opacity:.12;
}
.sc.c-orange::after { background:var(--accent) }
.sc.c-green::after  { background:var(--green) }
.sc.c-red::after    { background:var(--red) }
.sc.c-blue::after   { background:var(--blue) }
.sc.c-yellow::after { background:var(--yellow) }
.sc.c-purple::after { background:#a855f7 }

.sc-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px }
.sc-icon {
  width:38px; height:38px; border-radius:10px;
  display:flex; align-items:center; justify-content:center; font-size:1rem;
}
.sc.c-orange .sc-icon { background:rgba(232,93,4,.15); color:var(--accent) }
.sc.c-green  .sc-icon { background:rgba(34,197,94,.15); color:var(--green) }
.sc.c-red    .sc-icon { background:rgba(239,68,68,.15); color:var(--red) }
.sc.c-blue   .sc-icon { background:rgba(59,130,246,.15); color:var(--blue) }
.sc.c-yellow .sc-icon { background:rgba(245,158,11,.15); color:var(--yellow) }
.sc.c-purple .sc-icon { background:rgba(168,85,247,.15); color:#a855f7 }

.sc-badge { font-size:.68rem; font-weight:700; padding:2px 8px; border-radius:20px }
.sc.c-green  .sc-badge { background:rgba(34,197,94,.12); color:var(--green) }
.sc.c-red    .sc-badge { background:rgba(239,68,68,.12); color:var(--red) }
.sc.c-yellow .sc-badge { background:rgba(245,158,11,.12); color:var(--yellow) }
.sc.c-orange .sc-badge { background:rgba(232,93,4,.12); color:var(--accent) }

.sc-val { font-family:'Fraunces',serif; font-size:1.75rem; font-weight:700; line-height:1; letter-spacing:-.03em }
.sc-lbl { font-size:.76rem; color:var(--t2); margin-top:3px }
.sc-foot { font-size:.71rem; color:var(--t2); margin-top:10px; padding-top:10px; border-top:1px solid var(--border) }

/* mini bars */
.mini-bars { display:flex; align-items:flex-end; gap:3px; height:28px; margin-top:10px }
.mini-bar { flex:1; background:rgba(232,93,4,.2); border-radius:3px; min-height:3px; transition:background .2s }
.mini-bar.hi { background:var(--accent) }

/* ============================================================
   FORMS
   ============================================================ */
.form-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px }
.form-group { display:flex; flex-direction:column; gap:5px }
.form-group.full { grid-column:1/-1 }
.form-label { font-size:.78rem; font-weight:600; color:var(--t2); display:flex; align-items:center; gap:3px }
.req { color:var(--accent) }
.form-control {
  background:var(--bg3); border:1.5px solid var(--border); border-radius:var(--r-sm);
  color:var(--t1); padding:9px 12px; font-size:.86rem; font-family:inherit; width:100%;
  transition:border-color var(--tr), box-shadow var(--tr);
}
.form-control:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(232,93,4,.12) }
.form-control::placeholder { color:var(--t2); opacity:.5 }
textarea.form-control { resize:vertical; min-height:76px }
.char-count { font-size:.71rem; color:var(--t2); text-align:right }

/* Upload area */
.upload-area {
  border:2px dashed var(--border); border-radius:var(--r-sm);
  padding:18px; text-align:center; cursor:pointer; position:relative;
  transition:all var(--tr);
}
.upload-area:hover { border-color:var(--accent); background:rgba(232,93,4,.04) }
.upload-area input { position:absolute; inset:0; opacity:0; cursor:pointer }
.upload-area i { font-size:1.8rem; color:var(--t2); margin-bottom:6px; display:block }
.upload-area p { font-size:.78rem; color:var(--t2) }
.upload-preview { max-height:70px; border-radius:6px; margin-top:8px }

/* Checkboxes */
.checkbox-group { display:flex; flex-wrap:wrap; gap:12px; padding:4px 0 }
.checkbox-item { display:flex; align-items:center; gap:6px; cursor:pointer; font-size:.84rem }
.checkbox-item input { accent-color:var(--accent); width:15px; height:15px }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 18px; border-radius:var(--r-sm);
  font-family:inherit; font-size:.84rem; font-weight:600;
  cursor:pointer; transition:all var(--tr); border:none;
}
.btn-primary { background:var(--accent); color:#fff }
.btn-primary:hover { background:var(--accent-d); box-shadow:0 4px 16px rgba(232,93,4,.35); transform:translateY(-1px) }
.btn-secondary { background:var(--bg3); color:var(--t1); border:1.5px solid var(--border) }
.btn-secondary:hover { border-color:var(--accent); color:var(--accent) }
.btn-danger { background:rgba(239,68,68,.1); color:var(--red); border:1.5px solid rgba(239,68,68,.2) }
.btn-danger:hover { background:var(--red); color:#fff }
.btn-sm { padding:5px 12px; font-size:.78rem }
.btn-icon { padding:6px 8px }
.form-actions { display:flex; gap:8px; justify-content:flex-end; padding-top:6px }

/* ============================================================
   TABLE
   ============================================================ */
.table-wrapper { overflow-x:auto; border-radius:var(--r) }
table { width:100%; border-collapse:collapse; font-size:.84rem }
th {
  background:var(--bg3); color:var(--t2); text-align:left;
  padding:10px 13px; font-size:.72rem; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase;
  border-bottom:2px solid var(--border);
}
td { padding:10px 13px; border-bottom:1px solid var(--border); vertical-align:middle }
tr:last-child td { border-bottom:none }
tr:hover td { background:rgba(232,93,4,.03) }

/* Badges */
.badge {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 9px; border-radius:20px; font-size:.72rem; font-weight:600;
}
.badge-ok       { background:rgba(34,197,94,.12); color:var(--green) }
.badge-warn     { background:rgba(245,158,11,.12); color:var(--yellow) }
.badge-danger   { background:rgba(239,68,68,.12); color:var(--red) }
.badge-entrada  { background:rgba(34,197,94,.12); color:var(--green) }
.badge-saida    { background:rgba(239,68,68,.12); color:var(--red) }
.badge-pago     { background:rgba(34,197,94,.12); color:var(--green) }
.badge-pendente { background:rgba(245,158,11,.12); color:var(--yellow) }
.badge-cancelado{ background:rgba(107,114,128,.12); color:#6b7280 }

/* Search bar */
.search-bar { display:flex; gap:9px; flex-wrap:wrap; margin-bottom:16px }
.search-bar .form-control { max-width:230px }

/* ============================================================
   MODAL
   ============================================================ */
.modal-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(5px);
  z-index:1100; opacity:0; pointer-events:none; transition:opacity var(--tr);
}
.modal-overlay.active { opacity:1; pointer-events:all }

.modal {
  position:fixed; top:50%; left:50%;
  transform:translate(-50%,-54%) scale(.96);
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--r); padding:26px;
  width:min(96vw,820px); max-height:90vh; overflow-y:auto;
  z-index:1200; opacity:0; pointer-events:none;
  transition:all .26s cubic-bezier(.4,0,.2,1);
  box-shadow:0 24px 64px rgba(0,0,0,.4);
}
.modal.active { opacity:1; pointer-events:all; transform:translate(-50%,-50%) scale(1) }
.modal-header {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:18px; padding-bottom:14px; border-bottom:1px solid var(--border);
}
.modal-title { font-family:'Fraunces',serif; font-weight:700; font-size:1.05rem; display:flex; align-items:center; gap:8px }
.modal-close { color:var(--t2); padding:6px 8px; border-radius:7px; transition:all var(--tr) }
.modal-close:hover { color:var(--red); background:rgba(239,68,68,.08) }

/* ============================================================
   LOGIN
   ============================================================ */
.login-page {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--bg); position:relative; overflow:hidden;
}
.login-page::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 60% at 65% 40%, rgba(232,93,4,.15) 0%, transparent 70%);
}
.login-page::after {
  content:''; position:absolute; bottom:-100px; left:-100px;
  width:400px; height:400px; border-radius:50%;
  background:radial-gradient(circle, rgba(232,93,4,.05) 0%, transparent 70%);
}
.login-box {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:20px; padding:38px 42px;
  width:min(410px,94vw); position:relative; z-index:1;
  box-shadow:0 20px 60px rgba(0,0,0,.22);
  animation:slideUp .45s ease;
}
@keyframes slideUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }
.login-logo { text-align:center; margin-bottom:26px }
.login-logo img { width:76px; height:76px; border-radius:16px; object-fit:cover; box-shadow:0 6px 20px rgba(232,93,4,.3) }
.login-logo h1 { font-family:'Fraunces',serif; font-size:1.25rem; font-weight:700; margin-top:10px; letter-spacing:-.02em }
.login-logo p { font-size:.79rem; color:var(--t2) }
.login-theme-btn {
  position:absolute; top:14px; right:14px; width:34px; height:34px;
  border-radius:50%; background:var(--bg3); color:var(--t1);
  display:flex; align-items:center; justify-content:center; transition:all var(--tr);
}
.login-theme-btn:hover { background:var(--accent); color:#fff }
.login-error {
  background:rgba(239,68,68,.1); border:1px solid rgba(239,68,68,.25);
  color:var(--red); border-radius:9px; padding:9px 13px;
  font-size:.82rem; margin-bottom:12px; display:none;
}
.manual-link {
  display:flex; align-items:center; justify-content:center; gap:6px;
  margin-top:14px; color:var(--t2); font-size:.79rem; cursor:pointer;
  transition:color var(--tr);
}
.manual-link:hover { color:var(--accent) }
.manual-body h3 { font-family:'Fraunces',serif; font-weight:700; margin:12px 0 5px }
.manual-body ul { padding-left:16px; font-size:.86rem; line-height:1.8; color:var(--t2) }
.manual-audio-btns { display:flex; gap:9px; margin-top:18px; padding-top:14px; border-top:1px solid var(--border) }

/* ============================================================
   FINANCEIRO
   ============================================================ */
.fin-resumo { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px }
.fin-card {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--r); padding:18px 20px;
  display:flex; align-items:center; gap:15px;
  position:relative; overflow:hidden;
  transition:transform .15s, box-shadow .15s;
}
.fin-card:hover { transform:translateY(-1px); box-shadow:0 6px 24px rgba(0,0,0,.15) }
.fin-card::before {
  content:''; position:absolute; left:0; top:0; bottom:0; width:4px; border-radius:var(--r) 0 0 var(--r);
}
.fin-card.entrada::before { background:var(--green) }
.fin-card.saida::before   { background:var(--red) }
.fin-card.saldo::before   { background:var(--accent) }
.fin-card-icon {
  width:46px; height:46px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; flex-shrink:0;
}
.fin-card.entrada .fin-card-icon { background:rgba(34,197,94,.15); color:var(--green) }
.fin-card.saida   .fin-card-icon { background:rgba(239,68,68,.15); color:var(--red) }
.fin-card.saldo   .fin-card-icon { background:rgba(232,93,4,.15); color:var(--accent) }
.fin-card-val { font-family:'Fraunces',serif; font-size:1.45rem; font-weight:700; line-height:1.1 }
.fin-card.entrada .fin-card-val { color:var(--green) }
.fin-card.saida   .fin-card-val { color:var(--red) }
.fin-card.saldo   .fin-card-val { color:var(--accent) }
.fin-card-lbl { font-size:.75rem; color:var(--t2); margin-top:3px }

.lancamento-tipo { display:flex; gap:9px; margin-bottom:13px }
.tipo-btn { flex:1; padding:11px; border-radius:10px; text-align:center; font-weight:700; font-size:.86rem; cursor:pointer; border:2px solid var(--border); color:var(--t2); transition:all .2s }
.tipo-btn.entrada.active { border-color:var(--green); background:rgba(34,197,94,.08); color:var(--green) }
.tipo-btn.saida.active   { border-color:var(--red); background:rgba(239,68,68,.08); color:var(--red) }

/* ============================================================
   BANK CARDS
   ============================================================ */
.bank-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(275px,1fr)); gap:14px; margin-bottom:18px }
.bank-card {
  background:linear-gradient(135deg,#1a2236 0%,#0d1520 100%);
  border:1px solid rgba(255,255,255,.07); border-radius:18px; padding:20px;
  position:relative; overflow:hidden; color:#fff;
  transition:transform .2s, box-shadow .2s;
}
.bank-card:hover { transform:translateY(-3px); box-shadow:0 12px 36px rgba(0,0,0,.3) }
.bank-card::after { content:''; position:absolute; bottom:-25px; right:-15px; width:110px; height:110px; border-radius:50%; background:rgba(232,93,4,.12) }
.bc-top { display:flex; justify-content:space-between; margin-bottom:24px }
.bc-banco { font-family:'Fraunces',serif; font-weight:700; font-size:.95rem }
.bc-tipo { font-size:.68rem; background:rgba(255,255,255,.1); padding:3px 9px; border-radius:20px; color:rgba(255,255,255,.6) }
.bc-conta { font-size:.78rem; color:rgba(255,255,255,.45); margin-bottom:3px }
.bc-titular { font-weight:600; font-size:.9rem; margin-bottom:13px }
.bc-pix { display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.07); border-radius:8px; padding:7px 11px; font-size:.77rem; color:rgba(255,255,255,.65); position:relative; z-index:1 }
.bc-pix i { color:var(--accent-l) }
.bc-pix span { font-weight:600; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:150px }
.bc-actions { display:flex; gap:5px; margin-top:11px; position:relative; z-index:1 }
.bc-btn { padding:5px 10px; border-radius:7px; font-size:.72rem; background:rgba(255,255,255,.09); color:rgba(255,255,255,.75); cursor:pointer; border:1px solid rgba(255,255,255,.12); transition:all .18s }
.bc-btn:hover { background:rgba(232,93,4,.3); color:#fff }

/* QR */
.qrcode-container { text-align:center; padding:18px }
.qr-pix-data { background:var(--bg3); border:1px solid var(--border); border-radius:9px; padding:10px 14px; font-size:.79rem; font-family:monospace; word-break:break-all; margin-top:12px; color:var(--t2) }

/* ============================================================
   COBRANÇAS
   ============================================================ */
.cobranca-card { background:var(--bg2); border:1px solid var(--border); border-radius:13px; padding:14px 18px; display:flex; align-items:center; gap:13px; margin-bottom:9px; transition:all .2s }
.cobranca-card:hover { border-color:var(--accent) }
.cc-info { flex:1 }
.cc-nome { font-weight:700; font-size:.88rem }
.cc-meta { font-size:.74rem; color:var(--t2); margin-top:2px }
.cc-actions { display:flex; gap:5px }

/* ============================================================
   PLANOS
   ============================================================ */
.plano-valor-card { background:var(--bg3); border:1.5px solid var(--border); border-radius:12px; padding:16px 18px; display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px }
.pv-info { flex:1 }
.pv-nome { font-weight:700; font-size:.9rem }
.pv-desc { font-size:.76rem; color:var(--t2); margin-top:2px }
.pv-valor { font-family:'Fraunces',serif; font-size:1.3rem; font-weight:700; color:var(--green); white-space:nowrap }
.pv-actions { display:flex; gap:6px; flex-shrink:0 }

/* ============================================================
   CONFIGURAÇÕES
   ============================================================ */
.config-tabs { display:flex; gap:0; border-bottom:2px solid var(--border); margin-bottom:22px; overflow-x:auto }
.config-tab { padding:9px 18px; font-size:.84rem; font-weight:600; color:var(--t2); cursor:pointer; white-space:nowrap; border-bottom:2px solid transparent; margin-bottom:-2px; transition:all .2s }
.config-tab.active { color:var(--accent); border-bottom-color:var(--accent) }
.config-tab-pane { display:none }
.config-tab-pane.active { display:block }
.logo-upload-circle { width:90px; height:90px; border-radius:50%; border:3px dashed var(--border); cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; color:var(--t2); font-size:.7rem; transition:all .2s; position:relative; overflow:hidden; margin:0 auto 14px }
.logo-upload-circle:hover { border-color:var(--accent); color:var(--accent) }
.logo-upload-circle img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit }
.logo-upload-circle input { position:absolute; inset:0; opacity:0; cursor:pointer }

/* Relatórios */
.relatorio-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px }
.rel-card {
  border-left:4px solid var(--accent) !important;
  transition:transform .15s, box-shadow .15s !important;
}
.rel-card:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.18) !important }
.rel-icon {
  width:52px; height:52px; border-radius:14px;
  background:rgba(232,93,4,.12); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; flex-shrink:0;
}
.rel-btn-group { display:flex; gap:8px; margin-top:14px }
.rel-btn {
  flex:1; display:flex; align-items:center; justify-content:center; gap:6px;
  padding:8px 12px; border-radius:8px; font-size:.8rem; font-weight:600;
  cursor:pointer; border:none; transition:all .2s;
}
.rel-btn.excel { background:rgba(52,211,153,.12); color:#34d399 }
.rel-btn.excel:hover { background:rgba(52,211,153,.22) }
.rel-btn.pdf { background:rgba(232,93,4,.12); color:var(--accent) }
.rel-btn.pdf:hover { background:rgba(232,93,4,.22) }
/* Modal de relatório */
.modal-relatorio { display:none; position:fixed; inset:0; z-index:3000; background:rgba(0,0,0,.65); align-items:center; justify-content:center; padding:20px }
.modal-relatorio.open { display:flex }
.modal-rel-box { background:#fff; border-radius:16px; width:100%; max-width:900px; max-height:90vh; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 24px 64px rgba(0,0,0,.4) }
.modal-rel-toolbar { display:flex; align-items:center; justify-content:space-between; padding:14px 20px; background:#f0f4f8; border-bottom:1px solid #e2e8f0 }
.modal-rel-toolbar h3 { font-size:1rem; font-weight:700; color:#1a1f2e }
.modal-rel-body { flex:1; overflow:auto; padding:0 }
.modal-rel-body iframe { width:100%; height:100%; min-height:60vh; border:none }
.rel-title { font-family:'Fraunces',serif; font-weight:700; font-size:.92rem; margin-bottom:5px }
.rel-desc { font-size:.77rem; color:var(--t2); line-height:1.5 }
.rel-btns { display:flex; gap:7px; margin-top:13px }

/* ============================================================
   PLAYER MODAL
   ============================================================ */
.player-modal-inner { text-align:center; padding:8px 0 }
.player-radio-logo { width:80px; height:80px; border-radius:18px; object-fit:cover; margin:0 auto 12px; display:block; box-shadow:0 6px 20px rgba(0,0,0,.2) }
.player-radio-name { font-family:'Fraunces',serif; font-size:1.2rem; font-weight:700; margin-bottom:4px }
.player-radio-plan { font-size:.78rem; color:var(--t2); margin-bottom:18px }
.audio-player-wrap { background:var(--bg3); border-radius:12px; padding:16px; margin-bottom:14px }
.audio-player-wrap audio { width:100%; border-radius:8px }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:960px) {
  .stats-33 { grid-template-columns:repeat(2,1fr) }
  .fin-resumo { grid-template-columns:repeat(2,1fr) }
}
@media (max-width:680px) {
  :root { --sw:260px }
  .sidebar {
    transform:translateX(-100%);
    transition:transform var(--tr), width var(--tr);
    width:var(--sw) !important;
    box-shadow:none;
  }
  .sidebar.mobile-open {
    transform:translateX(0);
    box-shadow:6px 0 30px rgba(0,0,0,.4);
  }
  .main-wrapper { margin-left:0 !important }
  .stats-33 { grid-template-columns:1fr 1fr }
  .fin-resumo { grid-template-columns:1fr }
  .bank-cards { grid-template-columns:1fr }
  .form-grid { grid-template-columns:1fr }
  .page-content { padding:14px }
  .pb-info { display:none }
  .topbar-clock { display:none }
  .page-footer { flex-direction:column; gap:3px; text-align:center }
  .profile-dropdown { right:10px; width:250px }
}
@media (max-width:420px) {
  .stats-33 { grid-template-columns:1fr }
  .login-box { padding:26px 18px }
}
/* ============================================================
   PAINEL ADM v2 — Adições ao style.css
   Cole este conteúdo ao FINAL do arquivo assets/css/style.css
   ============================================================ */

/* ---- DASHBOARD v2 — Cards aprimorados ---- */
.stats-grid-v2 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 18px;
    margin-bottom: 28px;
}
.stat-card-v2 {
    background: var(--bg2);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 22px 20px;
    position: relative;
    overflow: hidden;
    transition: transform .22s, box-shadow .22s;
}
.stat-card-v2:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(0,0,0,.22); }
.stat-card-v2::before {
    content: '';
    position: absolute; top: 0; right: 0;
    width: 100px; height: 100px;
    border-radius: 50%;
    transform: translate(30px, -30px);
    opacity: .12;
}
.stat-card-v2.orange::before { background: var(--accent); }
.stat-card-v2.green::before  { background: #34d399; }
.stat-card-v2.red::before    { background: #ff6b6b; }
.stat-card-v2.blue::before   { background: #60a5fa; }
.stat-card-v2.yellow::before { background: #fbbf24; }

.sc2-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.sc2-icon {
    width: 46px; height: 46px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.2rem;
}
.sc2-icon.orange { background: rgba(232,93,4,.18); color: var(--accent); }
.sc2-icon.green  { background: rgba(52,211,153,.18); color: #34d399; }
.sc2-icon.red    { background: rgba(255,107,107,.18); color: #ff6b6b; }
.sc2-icon.blue   { background: rgba(96,165,250,.18); color: #60a5fa; }
.sc2-icon.yellow { background: rgba(251,191,36,.18); color: #fbbf24; }

.sc2-trend {
    font-size: .72rem; font-weight: 600; padding: 3px 8px; border-radius: 20px;
}
.sc2-trend.up   { background: rgba(52,211,153,.15); color: #34d399; }
.sc2-trend.down { background: rgba(255,107,107,.15); color: #ff6b6b; }

.sc2-val {
    font-family: 'Syne', sans-serif;
    font-size: 2rem; font-weight: 800; line-height: 1;
    margin-bottom: 4px;
}
.sc2-lbl { font-size: .8rem; color: var(--text2); font-weight: 400; }
.sc2-sub { font-size: .75rem; color: var(--text2); margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }

/* Mini chart bar */
.mini-bars { display: flex; align-items: flex-end; gap: 3px; height: 32px; margin-top: 10px; }
.mini-bar {
    flex: 1; background: rgba(232,93,4,.25); border-radius: 3px;
    transition: background .2s;
    min-height: 4px;
}
.mini-bar.active { background: var(--accent); }

/* ---- TOPBAR PROFILE BUTTON ---- */
.profile-btn {
    display: flex; align-items: center; gap: 9px;
    padding: 6px 12px 6px 6px;
    background: var(--bg3); border: 1px solid var(--border);
    border-radius: 40px; cursor: pointer;
    transition: all .22s;
}
.profile-btn:hover { border-color: var(--accent); }
.profile-avatar {
    width: 30px; height: 30px; border-radius: 50%;
    background: var(--accent);
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: .85rem; font-weight: 700;
    overflow: hidden;
}
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-name { font-size: .82rem; font-weight: 600; color: var(--text1); }
.profile-role { font-size: .7rem; color: var(--text2); }
.profile-chevron { color: var(--text2); font-size: .7rem; margin-left: 2px; }

/* Profile Dropdown */
.profile-dropdown {
    position: absolute; top: calc(100% + 10px); right: 24px;
    width: 280px;
    background: var(--bg2); border: 1px solid var(--border);
    border-radius: 16px; box-shadow: 0 16px 48px rgba(0,0,0,.3);
    z-index: 9999; padding: 0;
    opacity: 0; pointer-events: none; transform: translateY(-8px);
    transition: all .22s;
}
.profile-dropdown.open { opacity: 1; pointer-events: all; transform: translateY(0); }

.pd-header {
    padding: 20px; text-align: center;
    border-bottom: 1px solid var(--border);
}
.pd-avatar {
    width: 64px; height: 64px; border-radius: 50%;
    background: var(--accent); margin: 0 auto 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; color: #fff; font-weight: 800;
    border: 3px solid rgba(232,93,4,.3);
    overflow: hidden;
}
.pd-avatar img { width: 100%; height: 100%; object-fit: cover; }
.pd-name { font-weight: 700; font-size: .95rem; color: var(--text1); }
.pd-email { font-size: .78rem; color: var(--text2); margin-top: 2px; }

.pd-menu { padding: 8px; }
.pd-item {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: 10px;
    color: var(--text1); font-size: .87rem;
    transition: all .18s; cursor: pointer;
}
.pd-item:hover { background: var(--bg3); color: var(--accent); }
.pd-item i { width: 18px; text-align: center; color: var(--text2); }
.pd-item:hover i { color: var(--accent); }
.pd-item.danger { color: #ff6b6b; }
.pd-item.danger i { color: #ff6b6b; }
.pd-item.danger:hover { background: rgba(255,107,107,.08); }
.pd-divider { height: 1px; background: var(--border); margin: 4px 8px; }

/* ---- FINANCEIRO ---- */
.fin-tabs {
    display: flex; gap: 4px;
    background: var(--bg3); padding: 4px; border-radius: 10px;
    margin-bottom: 20px; width: fit-content;
}
.fin-tab {
    padding: 8px 20px; border-radius: 8px;
    font-size: .86rem; font-weight: 600; cursor: pointer;
    transition: all .2s; color: var(--text2);
}
.fin-tab.active { background: var(--bg2); color: var(--text1); box-shadow: 0 2px 8px rgba(0,0,0,.12); }

.fin-resumo {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
    margin-bottom: 20px;
}
.fin-card {
    background: var(--bg2); border: 1px solid var(--border);
    border-radius: 14px; padding: 18px;
    display: flex; align-items: center; gap: 14px;
}
.fin-card-icon {
    width: 44px; height: 44px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
}
.fin-card.entrada .fin-card-icon { background: rgba(52,211,153,.15); color: #34d399; }
.fin-card.saida   .fin-card-icon { background: rgba(255,107,107,.15); color: #ff6b6b; }
.fin-card.saldo   .fin-card-icon { background: rgba(232,93,4,.15); color: var(--accent); }
.fin-card-val { font-family: 'Syne', sans-serif; font-size: 1.4rem; font-weight: 800; }
.fin-card.entrada .fin-card-val { color: #34d399; }
.fin-card.saida   .fin-card-val { color: #ff6b6b; }
.fin-card-lbl { font-size: .75rem; color: var(--text2); }

/* Lancamento form inline */
.lancamento-tipo {
    display: flex; gap: 10px; margin-bottom: 14px;
}
.tipo-btn {
    flex: 1; padding: 12px; border-radius: 10px; text-align: center;
    font-weight: 700; font-size: .9rem; cursor: pointer;
    border: 2px solid var(--border); color: var(--text2);
    transition: all .2s;
}
.tipo-btn.entrada.active { border-color: #34d399; background: rgba(52,211,153,.1); color: #34d399; }
.tipo-btn.saida.active   { border-color: #ff6b6b; background: rgba(255,107,107,.1); color: #ff6b6b; }

/* Status badge extras */
.badge-pago      { background: rgba(52,211,153,.15); color: #34d399; }
.badge-pendente  { background: rgba(251,191,36,.15); color: #fbbf24; }
.badge-cancelado { background: rgba(156,163,175,.15); color: #9ca3af; }
.badge-entrada   { background: rgba(52,211,153,.12); color: #34d399; }
.badge-saida     { background: rgba(255,107,107,.12); color: #ff6b6b; }

/* ---- CONTAS BANCÁRIAS ---- */
.bank-cards {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px; margin-bottom: 20px;
}
.bank-card {
    background: linear-gradient(135deg, #1a2236 0%, #0d1520 100%);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px; padding: 22px;
    position: relative; overflow: hidden;
    color: #fff;
    transition: transform .22s, box-shadow .22s;
}
body.tema-light .bank-card {
    background: linear-gradient(135deg, #1e2a42 0%, #111827 100%);
}
.bank-card:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(0,0,0,.35); }
.bank-card::after {
    content: '';
    position: absolute; bottom: -30px; right: -20px;
    width: 120px; height: 120px; border-radius: 50%;
    background: rgba(232,93,4,.15);
}
.bc-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 28px; }
.bc-banco { font-family: 'Syne', sans-serif; font-weight: 700; font-size: 1rem; }
.bc-tipo {
    font-size: .7rem; background: rgba(255,255,255,.12);
    padding: 3px 9px; border-radius: 20px; color: rgba(255,255,255,.7);
}
.bc-conta { font-size: .82rem; color: rgba(255,255,255,.5); margin-bottom: 4px; }
.bc-titular { font-weight: 600; font-size: .95rem; margin-bottom: 14px; }
.bc-pix {
    display: flex; align-items: center; gap: 6px;
    background: rgba(255,255,255,.08); border-radius: 8px;
    padding: 8px 12px; font-size: .8rem; color: rgba(255,255,255,.7);
    position: relative; z-index: 1;
}
.bc-pix i { color: var(--accent-light); }
.bc-pix span { font-weight: 600; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
.bc-actions {
    display: flex; gap: 6px; margin-top: 12px; position: relative; z-index: 1;
}
.bc-btn {
    padding: 5px 10px; border-radius: 7px; font-size: .75rem;
    background: rgba(255,255,255,.1); color: rgba(255,255,255,.8);
    cursor: pointer; border: 1px solid rgba(255,255,255,.15);
    transition: all .18s;
}
.bc-btn:hover { background: rgba(232,93,4,.35); color: #fff; }

/* QR Code container */
.qrcode-container {
    text-align: center; padding: 20px;
}
.qrcode-container canvas, .qrcode-container img {
    border-radius: 12px;
    border: 8px solid #fff;
    box-shadow: 0 4px 20px rgba(0,0,0,.2);
}
.qr-pix-data {
    background: var(--bg3); border: 1px solid var(--border);
    border-radius: 10px; padding: 12px 16px;
    font-size: .82rem; font-family: monospace;
    word-break: break-all; margin-top: 14px;
    color: var(--text2);
}

/* ---- COBRANÇA PDF ---- */
.cobranca-card {
    background: var(--bg2); border: 1px solid var(--border);
    border-radius: 14px; padding: 16px 20px;
    display: flex; align-items: center; gap: 14px;
    margin-bottom: 10px; transition: all .2s;
}
.cobranca-card:hover { border-color: var(--accent); }
.cc-info { flex: 1; }
.cc-nome { font-weight: 700; font-size: .92rem; }
.cc-meta { font-size: .78rem; color: var(--text2); margin-top: 2px; }
.cc-actions { display: flex; gap: 6px; }

/* ---- CONFIGURAÇÕES ---- */
.config-tabs {
    display: flex; gap: 0; border-bottom: 2px solid var(--border);
    margin-bottom: 24px; overflow-x: auto;
}
.config-tab {
    padding: 10px 20px; font-size: .88rem; font-weight: 600;
    color: var(--text2); cursor: pointer; white-space: nowrap;
    border-bottom: 2px solid transparent; margin-bottom: -2px;
    transition: all .2s;
}
.config-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.config-tab-pane { display: none; }
.config-tab-pane.active { display: block; }

/* Logo upload circular */
.logo-upload-circle {
    width: 100px; height: 100px; border-radius: 50%;
    border: 3px dashed var(--border); cursor: pointer;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 4px; color: var(--text2); font-size: .75rem;
    transition: all .2s; position: relative; overflow: hidden;
    margin: 0 auto 16px;
}
.logo-upload-circle:hover { border-color: var(--accent); color: var(--accent); }
.logo-upload-circle img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.logo-upload-circle input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* ---- RELATÓRIOS ---- */
.relatorio-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px;
}
.rel-card {
    background: var(--bg2); border: 1px solid var(--border);
    border-radius: 14px; padding: 22px;
    text-align: center; cursor: pointer;
    transition: all .22s;
}
.rel-card:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: 0 8px 28px rgba(0,0,0,.15); }
.rel-icon {
    width: 56px; height: 56px; border-radius: 14px;
    background: rgba(232,93,4,.12); color: var(--accent);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem; margin: 0 auto 14px;
}
.rel-title { font-family: 'Syne', sans-serif; font-weight: 700; font-size: .95rem; margin-bottom: 6px; }
.rel-desc { font-size: .8rem; color: var(--text2); line-height: 1.5; }
.rel-btns { display: flex; gap: 8px; margin-top: 14px; justify-content: center; }

/* ---- RESPONSIVE additions ---- */
@media (max-width: 680px) {
    .fin-resumo { grid-template-columns: 1fr; }
    .bank-cards { grid-template-columns: 1fr; }
    .relatorio-grid { grid-template-columns: 1fr; }
    .profile-name, .profile-role { display: none; }
}