@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap');
*{font-family:'Cairo',sans-serif;box-sizing:border-box}
html{min-width:320px;overflow-x:hidden}
body{direction:rtl;background:#f5f7fb;margin:0;color:#1a233a;overflow-x:hidden}
.sidebar{position:fixed;right:0;top:0;bottom:0;width:260px;background:#0A1931;color:#fff;padding:20px 0;z-index:100;overflow-y:auto;transition:transform .25s ease}
.sidebar .logo{padding:0 20px 20px;border-bottom:1px solid rgba(255,255,255,.1);text-align:center}
.sidebar .logo h2{margin:0;color:#FFD500;font-weight:800}
.sidebar .logo small{color:#fff;opacity:.7}
.sidebar a{display:flex;align-items:center;gap:10px;padding:12px 20px;color:#fff;text-decoration:none;opacity:.8;transition:.2s;border-right:3px solid transparent}
.sidebar a:hover,.sidebar a.active{background:rgba(255,213,0,.1);opacity:1;border-right-color:#FFD500;color:#FFD500}
.main{margin-right:260px;padding:20px;min-width:0}
.page-export-control{position:fixed;top:14px;right:280px;z-index:90}
.page-export-control .btn{box-shadow:0 3px 12px rgba(10,25,49,.18)}
.card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,.05);margin-bottom:20px;min-width:0}
.btn{padding:10px 18px;border-radius:10px;border:none;cursor:pointer;font-weight:700;transition:.2s;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-decoration:none}
.btn-primary{background:#0A1931;color:#FFD500}.btn-primary:hover{background:#142a5a}
.btn-warning{background:#FFD500;color:#0A1931}.btn-danger{background:#ef4444;color:#fff}.btn-success{background:#10b981;color:#fff}
.pagination{display:flex;justify-content:center;align-items:center;gap:16px;padding:16px 0;flex-wrap:wrap}
.pagination a{color:#0A1931;font-weight:700;text-decoration:none}
.badge{padding:4px 10px;border-radius:20px;font-size:12px;font-weight:700}
.badge-success{background:#dcfce7;color:#166534}.badge-danger{background:#fee2e2;color:#991b1b}.badge-warning{background:#fef3c7;color:#92400e}.badge-info{background:#dbeafe;color:#1e40af}
table{width:100%;border-collapse:collapse}
th,td{padding:12px;text-align:right;border-bottom:1px solid #eee;vertical-align:middle}
th{background:#f8fafc;font-weight:700;white-space:nowrap}
tfoot th{background:#eaf0f8;color:#0A1931;font-weight:800}
input,select,textarea{width:100%;max-width:100%;padding:10px 14px;border:1px solid #e2e8f0;border-radius:10px;outline:none;transition:.2s;font-size:16px}
input:focus,select:focus,textarea:focus{border-color:#0A1931;box-shadow:0 0 0 3px rgba(10,25,49,.1)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:16px;min-width:0}
.form-grid>div{min-width:0}
.password-field{display:flex;flex-direction:column;gap:6px}.password-input-wrap{display:flex;align-items:center;gap:8px}.password-input-wrap input{flex:1;min-width:0}.password-toggle{flex:0 0 auto;min-width:44px;padding:9px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc;color:#0A1931;cursor:pointer;font-size:18px}.password-toggle:hover{background:#eaf0f8}.password-card{max-width:760px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:16px;margin-bottom:20px}
.stat{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 10px rgba(0,0,0,.05);border-right:4px solid #FFD500;min-width:0}.stat h3{margin:0;font-size:28px;color:#0A1931;overflow-wrap:anywhere}.stat p{margin:5px 0 0;color:#64748b;font-size:14px}
.alert{padding:12px 16px;border-radius:10px;margin-bottom:16px}.alert-success{background:#dcfce7;color:#166534;border:1px solid #bbf7d0}.alert-danger{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#0A1931 0%,#1a3a7a 100%)}
.login-card{background:#fff;border-radius:20px;padding:40px;width:100%;max-width:400px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.installment-filters{align-items:end}.installment-filter-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.installment-filter-actions .btn{justify-content:center;text-decoration:none}
.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.table-wrap table{min-width:680px}
.installment-overdue td{background:#fff1f2;color:#881337}.installment-overdue td:first-child{border-right:3px solid #ef4444}.installment-note{margin:14px 0 0;color:#64748b;font-size:13px}
.mobile-menu-toggle,.sidebar-backdrop{display:none}
@media(max-width:768px){
  .sidebar{transform:translateX(110%);width:min(86vw,340px);box-shadow:-8px 0 30px rgba(0,0,0,.2);padding-top:68px}
  .sidebar.open{transform:translateX(0)}
  .sidebar-backdrop:not([hidden]){display:block;position:fixed;inset:0;background:rgba(10,25,49,.48);z-index:95}
  .mobile-menu-toggle{display:flex;position:fixed;top:10px;right:10px;z-index:110;align-items:center;gap:8px;padding:10px 14px;border:0;border-radius:12px;background:#0A1931;color:#FFD500;font-size:16px;font-weight:700;box-shadow:0 3px 12px rgba(10,25,49,.22)}
  .main{margin-right:0;padding:68px 12px 16px;width:100%}
  .main h1{font-size:24px;line-height:1.35;margin:8px 0 16px}
  .card{padding:14px;border-radius:13px;margin-bottom:14px}
  .form-grid{grid-template-columns:minmax(0,1fr);gap:12px}
  .form-grid [style*="grid-column"]{grid-column:1/-1!important}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{padding:14px}.stat h3{font-size:22px}
  table{display:block;width:100%;max-width:100%;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  th,td{padding:10px;font-size:14px}
  .page-export-control{position:static;margin:0 0 12px;padding-right:0}
  .page-export-control .btn{font-size:13px;padding:9px 12px;max-width:100%}
  .login-card{padding:26px 20px;margin:16px;width:calc(100% - 32px)}
  .login-body{padding:12px}
  .btn{max-width:100%}
}
@media(max-width:380px){.stats{grid-template-columns:1fr}.main{padding-right:10px;padding-left:10px}.card{padding:12px}}
