@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--brand:#5D87FF;--brand-dark:#4570EA;--brand-light:#ECF2FF;--brand-mid:#b3c8ff;--green:#13DEB9;--green-dark:#02b3a4;--green-light:#E6FFFA;--orange:#FFAE1F;--orange-light:#FEF5E5;--red:#FA896B;--red-light:#FDEDE8;--purple:#763EBD;--purple-light:#F2ECF9;--bg:#F2F6FA;--surface:#FFFFFF;--border:#e5eaef;--border-soft:#f0f4f8;--text-primary:#2A3547;--text-secondary:#5A6A85;--text-tertiary:#8494a7;--sidebar-w:270px;--header-h:64px;--r-sm:7px;--r-md:12px;--r-lg:16px;--r-xl:24px;--shadow-xs:0 2px 6px rgba(42,53,71,.06);--shadow-sm:0 2px 12px rgba(42,53,71,.08);--shadow-md:0 6px 24px rgba(42,53,71,.10);--shadow-lg:0 12px 40px rgba(42,53,71,.12);--font-ui:'Plus Jakarta Sans',sans-serif}
html,body{height:100%;font-family:var(--font-ui);background:var(--bg);color:var(--text-primary);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:var(--font-ui);cursor:pointer;border:none}
input,select,textarea{font-family:var(--font-ui)}
.lp-shell{display:flex;height:100vh;overflow:hidden}
.lp-sidebar{width:var(--sidebar-w);flex-shrink:0;background:#fff;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;z-index:10}
.lp-sidebar-logo{display:flex;align-items:center;gap:10px;padding:24px 24px 20px}
.lp-logo-icon{width:38px;height:38px;background:var(--brand);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(93,135,255,.4)}
.lp-logo-icon svg{width:20px;height:20px;color:#fff}
.lp-logo-text{font-size:20px;font-weight:700;color:var(--text-primary);letter-spacing:-.4px}
.lp-nav{padding:0 16px;flex:1}
.lp-nav-section{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--text-tertiary);padding:16px 8px 8px}
.lp-nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r-md);color:var(--text-secondary);font-size:14px;font-weight:500;transition:all .18s;margin-bottom:3px;cursor:pointer;position:relative}
.lp-nav-item i{font-size:18px;flex-shrink:0;transition:color .18s}
.lp-nav-item:hover{background:var(--brand-light);color:var(--brand)}
.lp-nav-item:hover i{color:var(--brand)}
.lp-nav-item.active{background:var(--brand-light);color:var(--brand);font-weight:600}
.lp-nav-item.active i{color:var(--brand)}
.lp-nav-item.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:20px;background:var(--brand);border-radius:0 3px 3px 0}
.lp-nav-badge{margin-left:auto;background:var(--red);color:#fff;font-size:11px;font-weight:700;padding:2px 7px;border-radius:99px}
.lp-sidebar-bottom{padding:16px;border-top:1px solid var(--border-soft);margin-top:8px}
.lp-plan-card{background:linear-gradient(135deg,var(--brand) 0%,var(--brand-dark) 100%);border-radius:var(--r-lg);padding:16px;margin-bottom:14px;box-shadow:0 4px 16px rgba(93,135,255,.35)}
.lp-plan-card-title{font-size:13px;font-weight:700;color:#fff;margin-bottom:2px}
.lp-plan-card-sub{font-size:11px;color:rgba(255,255,255,.75);margin-bottom:10px}
.lp-plan-bar-wrap{background:rgba(255,255,255,.25);border-radius:99px;height:5px;margin-bottom:6px}
.lp-plan-bar{background:#fff;height:5px;border-radius:99px;transition:width .5s}
.lp-plan-bar-label{font-size:11px;color:rgba(255,255,255,.8)}
.lp-tenant-row{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:var(--r-md);cursor:pointer;transition:background .15s}
.lp-tenant-row:hover{background:var(--bg)}
.lp-tenant-avatar{width:36px;height:36px;background:var(--brand);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0}
.lp-tenant-name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.lp-tenant-role{font-size:11px;color:var(--text-tertiary)}
.lp-main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.lp-header{height:var(--header-h);background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 28px;gap:12px;flex-shrink:0;box-shadow:var(--shadow-xs)}
.lp-header-title{font-size:16px;font-weight:600;color:var(--text-primary);flex:1}
.lp-header-actions{display:flex;align-items:center;gap:8px}
.lp-content{flex:1;overflow-y:auto;padding:28px}
.lp-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:var(--r-md);font-size:13.5px;font-weight:600;transition:all .18s;border:1px solid transparent;white-space:nowrap}
.lp-btn i{font-size:16px}
.lp-btn-primary{background:var(--brand);color:#fff;box-shadow:0 4px 12px rgba(93,135,255,.35)}
.lp-btn-primary:hover{background:var(--brand-dark);transform:translateY(-1px)}
.lp-btn-secondary{background:#fff;color:var(--text-secondary);border-color:var(--border)}
.lp-btn-secondary:hover{background:var(--bg);color:var(--text-primary)}
.lp-btn-ghost{background:transparent;color:var(--text-secondary);padding:8px 10px}
.lp-btn-ghost:hover{background:var(--bg);color:var(--text-primary)}
.lp-icon-btn{width:38px;height:38px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;transition:all .15s;position:relative}
.lp-icon-btn:hover{background:var(--bg)}
.lp-icon-btn i{font-size:17px}
.lp-notif-dot{position:absolute;top:8px;right:8px;width:7px;height:7px;background:var(--red);border-radius:50%;border:1.5px solid #fff}
.lp-page-header{margin-bottom:24px}
.lp-page-greeting{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:3px;letter-spacing:-.3px}
.lp-page-sub{font-size:14px;color:var(--text-secondary)}
.lp-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}
.lp-metric-card{background:#fff;border-radius:var(--r-lg);padding:22px 24px;box-shadow:var(--shadow-sm);border:1px solid var(--border);transition:box-shadow .2s,transform .2s;overflow:hidden;position:relative}
.lp-metric-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.lp-metric-card::after{content:'';position:absolute;top:0;right:0;width:80px;height:80px;border-radius:50%;opacity:.06;transform:translate(20px,-20px)}
.lp-metric-card.blue::after{background:var(--brand)}
.lp-metric-card.green::after{background:var(--green)}
.lp-metric-card.orange::after{background:var(--orange)}
.lp-metric-card.purple::after{background:var(--purple)}
.lp-metric-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px}
.lp-metric-label{font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:4px}
.lp-metric-icon{width:48px;height:48px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.lp-metric-icon i{font-size:22px}
.lp-metric-icon.blue{background:var(--brand-light);color:var(--brand)}
.lp-metric-icon.green{background:var(--green-light);color:var(--green-dark)}
.lp-metric-icon.orange{background:var(--orange-light);color:var(--orange)}
.lp-metric-icon.purple{background:var(--purple-light);color:var(--purple)}
.lp-metric-value{font-size:28px;font-weight:700;color:var(--text-primary);letter-spacing:-.5px;margin-bottom:8px;line-height:1}
.lp-metric-delta{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;padding:3px 8px;border-radius:99px}
.lp-metric-delta i{font-size:13px}
.lp-metric-delta.up{background:var(--green-light);color:var(--green-dark)}
.lp-metric-delta.down{background:var(--red-light);color:var(--red)}
.lp-grid-2{display:grid;grid-template-columns:1fr 360px;gap:20px;margin-bottom:24px}
.lp-card{background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border);overflow:hidden}
.lp-card-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border-soft)}
.lp-card-title{font-size:15px;font-weight:700;color:var(--text-primary)}
.lp-card-sub{font-size:12.5px;color:var(--text-tertiary);margin-top:2px}
.lp-card-body{padding:22px}
.lp-chart-wrap{position:relative;height:230px}
.lp-table{width:100%;border-collapse:collapse}
.lp-table th{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--text-tertiary);padding:0 22px 14px;text-align:left;border-bottom:1px solid var(--border)}
.lp-table td{padding:14px 22px;border-bottom:1px solid var(--border-soft);font-size:14px;color:var(--text-primary);vertical-align:middle}
.lp-table tbody tr:last-child td{border-bottom:none}
.lp-table tbody tr:hover td{background:#f8fafc}
.lp-table .student-cell{display:flex;align-items:center;gap:12px}
.lp-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0;color:#fff}
.lp-avatar.blue{background:var(--brand)}
.lp-avatar.green{background:var(--green-dark)}
.lp-avatar.orange{background:var(--orange)}
.lp-avatar.red{background:var(--red)}
.lp-avatar.purple{background:var(--purple)}
.lp-student-name{font-weight:600;font-size:14px}
.lp-student-phone{font-size:12px;color:var(--text-tertiary)}
.lp-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap}
.lp-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.lp-badge.pago{background:var(--green-light);color:var(--green-dark)}
.lp-badge.pendente{background:var(--orange-light);color:var(--orange)}
.lp-badge.atrasado{background:var(--red-light);color:var(--red)}
.lp-badge.active{background:var(--green-light);color:var(--green-dark)}
.lp-badge.pending{background:var(--orange-light);color:var(--orange)}
.lp-badge.inactive{background:var(--bg);color:var(--text-tertiary)}
.lp-charge-list{padding:0}
.lp-charge-item{display:flex;align-items:center;gap:12px;padding:14px 22px;border-bottom:1px solid var(--border-soft);transition:background .15s;cursor:pointer}
.lp-charge-item:last-child{border-bottom:none}
.lp-charge-item:hover{background:#f8fafc}
.lp-charge-info{flex:1;min-width:0}
.lp-charge-name{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-charge-meta{font-size:12px;color:var(--text-tertiary);margin-top:2px}
.lp-charge-amount{font-size:14px;font-weight:700;white-space:nowrap}
.lp-charge-action{width:32px;height:32px;border-radius:var(--r-sm);background:var(--green-light);color:var(--green-dark);display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}
.lp-charge-action:hover{background:#b2f5ea}
.lp-charge-action i{font-size:16px}
.lp-quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.lp-qa-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);padding:18px 20px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .18s;box-shadow:var(--shadow-xs)}
.lp-qa-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.lp-qa-icon{width:44px;height:44px;border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.lp-qa-icon i{font-size:20px}
.lp-qa-icon.blue{background:var(--brand-light);color:var(--brand)}
.lp-qa-icon.green{background:var(--green-light);color:var(--green-dark)}
.lp-qa-icon.orange{background:var(--orange-light);color:var(--orange)}
.lp-qa-icon.purple{background:var(--purple-light);color:var(--purple)}
.lp-qa-label{font-size:13.5px;font-weight:600;color:var(--text-primary)}
.lp-qa-sub{font-size:12px;color:var(--text-tertiary);margin-top:2px}
.lp-input{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r-md);font-size:14px;font-family:var(--font-ui);color:var(--text-primary);background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}
.lp-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(93,135,255,.12)}
.lp-input::placeholder{color:var(--text-tertiary)}
.lp-label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:6px}
.lp-alert-error{background:var(--red-light);border:1px solid #fac9b8;color:#c0392b;padding:11px 16px;border-radius:var(--r-md);font-size:13px;margin-bottom:16px}
.lp-alert-success{background:var(--green-light);border:1px solid #b2f5ea;color:var(--green-dark);padding:11px 16px;border-radius:var(--r-md);font-size:13px;margin-bottom:20px}
.lp-login-wrap{min-height:100vh;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:20px}
.lp-login-card{background:#fff;border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-lg);padding:44px 40px;width:100%;max-width:420px}
.lp-login-logo{display:flex;align-items:center;gap:12px;margin-bottom:28px}
.lp-login-title{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:6px;letter-spacing:-.3px}
.lp-login-sub{font-size:14px;color:var(--text-secondary);margin-bottom:28px}
.lp-form-group{margin-bottom:18px}
.lp-divider{border:none;border-top:1px solid var(--border);margin:22px 0}
.lp-link{color:var(--brand);font-weight:600}
.lp-link:hover{color:var(--brand-dark)}
.lp-empty{text-align:center;padding:40px 20px;color:var(--text-tertiary)}
.lp-empty i{font-size:40px;display:block;margin:0 auto 10px;opacity:.35}
.lp-empty p{font-size:13px}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}
.ml-auto{margin-left:auto}.flex{display:flex}.items-center{align-items:center}.gap-8{gap:8px}.text-muted{color:var(--text-secondary)}.fw-600{font-weight:600}.mt-8{margin-top:8px}.mt-16{margin-top:16px}

/* ─── Mobile Responsive ─────────────────────────────────────────── */
.lp-menu-btn {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  border-radius: var(--r-md);
  color: var(--text-secondary);
  font-size: 22px;
  line-height: 1;
  transition: background .15s;
}
.lp-menu-btn:hover { background: var(--bg); }

.lp-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 99;
  opacity: 0;
  transition: opacity .25s;
}
.lp-overlay.open { opacity: 1; }

@media (max-width: 768px) {
  /* Mostrar botão hamburguer */
  .lp-menu-btn { display: flex; align-items: center; justify-content: center; }

  /* Sidebar oculto por padrão */
  .lp-sidebar {
    position: fixed !important;
    top: 0; left: 0; bottom: 0;
    z-index: 100;
    transform: translateX(-100%);
    transition: transform .28s cubic-bezier(.4,0,.2,1);
    box-shadow: none;
  }
  .lp-sidebar.open {
    transform: translateX(0);
    box-shadow: 4px 0 24px rgba(0,0,0,.18);
  }
  .lp-overlay { display: block; }

  /* Main ocupa tela toda */
  .lp-main { margin-left: 0 !important; width: 100% !important; }
  .lp-shell { flex-direction: column; }

  /* Header ajustes */
  .lp-header {
    padding: 12px 16px;
    gap: 10px;
  }
  .lp-header-title { font-size: 15px; }
  .lp-header-actions { gap: 6px; }
  .lp-header-actions .lp-btn span { display: none; }

  /* Content padding reduzido */
  .lp-content { padding: 16px; }

  /* Grids viram coluna única */
  .lp-metrics {
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .lp-metric-value { font-size: 22px !important; }

  /* Tabelas scroll horizontal */
  .lp-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .lp-table { min-width: 500px; }
  table.lp-table { min-width: 500px; }

  /* Cards em coluna */
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns:1fr 360px"],
  [style*="grid-template-columns: 1fr 360px"],
  [style*="grid-template-columns:1fr 380px"],
  [style*="grid-template-columns: 1fr 380px"],
  [style*="grid-template-columns:320px 1fr"],
  [style*="grid-template-columns: 320px 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Sticky vira normal no mobile */
  [style*="position:sticky"],
  [style*="position: sticky"] {
    position: relative !important;
    top: auto !important;
  }

  /* Página de registro */
  .reg-body { padding: 20px !important; }
  .reg-header { padding: 20px !important; }
  .reg-footer { padding: 12px 20px !important; }
}

@media (max-width: 480px) {
  .lp-metrics { grid-template-columns: 1fr !important; }
  .lp-content { padding: 12px; }
}

/* Wrap automático em tabelas mobile */
@media (max-width: 768px) {
  .lp-card { overflow-x: auto; }
  .lp-page-header { margin-bottom: 16px; }
  .lp-page-greeting { font-size: 20px; }
}
