/* فاکتور زرین - استایل اصلی */
:root{
  --gold:#d4af37;
  --gold-dark:#b8942c;
  --navy:#0f1b2b;
  --navy-light:#16243a;
  --navy-lighter:#1e2f47;
  --text:#e8ecf1;
  --muted:#93a2b8;
  --danger:#e5534b;
  --success:#3fb950;
  --warning:#e3b341;
  --border:#28344a;
  --radius:10px;
}
*{box-sizing:border-box}
body{
  font-family:'Vazirmatn','Tahoma',Arial,sans-serif;
  background:var(--navy);
  color:var(--text);
  margin:0;
  direction:rtl;
  text-align:right;
}
a{color:var(--gold);text-decoration:none}
.app-layout{display:flex;min-height:100vh}

/* --- ورود --- */
.login-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.login-box{background:var(--navy-light);padding:40px;border-radius:var(--radius);width:100%;max-width:380px;box-shadow:0 10px 40px rgba(0,0,0,.5);border:1px solid var(--border)}
.login-box h1{color:var(--gold);text-align:center;margin-bottom:6px;font-size:26px}
.login-box p.sub{text-align:center;color:var(--muted);margin-bottom:24px;font-size:13px}

/* --- سایدبار --- */
.sidebar{width:230px;background:var(--navy-light);border-left:1px solid var(--border);min-height:100vh;padding:20px 0;flex-shrink:0}
.sidebar .brand{padding:0 20px 20px;border-bottom:1px solid var(--border);margin-bottom:15px}
.sidebar .brand h2{color:var(--gold);font-size:19px;margin:0}
.sidebar .brand span{color:var(--muted);font-size:12px}
.sidebar nav a{display:flex;align-items:center;gap:10px;padding:12px 20px;color:var(--text);font-size:14px;border-right:3px solid transparent}
.sidebar nav a:hover,.sidebar nav a.active{background:var(--navy-lighter);border-right-color:var(--gold);color:var(--gold)}
.sidebar .logout{margin-top:20px;padding-top:15px;border-top:1px solid var(--border)}

/* --- محتوای اصلی --- */
.main-content{flex:1;padding:24px;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:10px}
.topbar h1{font-size:22px;margin:0}
.topbar .user-chip{background:var(--navy-light);padding:8px 16px;border-radius:20px;font-size:13px;border:1px solid var(--border)}

/* --- کارت‌ها --- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}
.card{background:var(--navy-light);border:1px solid var(--border);border-radius:var(--radius);padding:20px}
.card .label{color:var(--muted);font-size:13px;margin-bottom:8px}
.card .value{font-size:24px;font-weight:bold;color:var(--gold)}

/* --- فرم‌ها --- */
.form-group{margin-bottom:16px}
label{display:block;margin-bottom:6px;font-size:13px;color:var(--muted)}
input[type=text],input[type=password],input[type=number],input[type=tel],input[type=search],
select,textarea{
  width:100%;padding:11px 14px;background:var(--navy);border:1px solid var(--border);
  border-radius:8px;color:var(--text);font-family:inherit;font-size:14px;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)}
.form-row{display:flex;gap:14px;flex-wrap:wrap}
.form-row .form-group{flex:1;min-width:180px}

/* --- دکمه‌ها --- */
.btn{display:inline-block;padding:10px 22px;border-radius:8px;border:none;cursor:pointer;font-size:14px;font-family:inherit;font-weight:600;text-align:center}
.btn-primary{background:var(--gold);color:#1a1a1a}
.btn-primary:hover{background:var(--gold-dark)}
.btn-secondary{background:var(--navy-lighter);color:var(--text);border:1px solid var(--border)}
.btn-danger{background:var(--danger);color:#fff}
.btn-success{background:var(--success);color:#08260f}
.btn-sm{padding:6px 12px;font-size:12px}
.btn-block{width:100%}

/* --- جدول‌ها --- */
.table-wrap{background:var(--navy-light);border-radius:var(--radius);overflow:auto;border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;min-width:600px}
th,td{padding:12px 14px;text-align:right;border-bottom:1px solid var(--border);font-size:13px}
th{color:var(--muted);font-weight:600;background:var(--navy-lighter)}
tr:last-child td{border-bottom:none}
tr:hover td{background:rgba(212,175,55,.04)}

/* --- بج وضعیت --- */
.badge{display:inline-block;padding:4px 10px;border-radius:14px;font-size:11px;font-weight:600}
.badge-success{background:rgba(63,185,80,.15);color:var(--success)}
.badge-warning{background:rgba(227,179,65,.15);color:var(--warning)}
.badge-danger{background:rgba(229,83,75,.15);color:var(--danger)}
.badge-secondary{background:rgba(147,162,184,.15);color:var(--muted)}

/* --- جعبه پیام --- */
.alert{padding:13px 18px;border-radius:8px;margin-bottom:18px;font-size:13px}
.alert-success{background:rgba(63,185,80,.12);color:var(--success);border:1px solid rgba(63,185,80,.3)}
.alert-error{background:rgba(229,83,75,.12);color:var(--danger);border:1px solid rgba(229,83,75,.3)}
.alert-warning{background:rgba(227,179,65,.12);color:var(--warning);border:1px solid rgba(227,179,65,.3)}

/* --- ابزار جستجو / فیلتر --- */
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.search-box{max-width:280px}

/* --- آیتم فاکتور --- */
.invoice-items-table input{padding:8px}
.remove-item{color:var(--danger);cursor:pointer;font-weight:bold}
.totals-box{max-width:360px;margin-right:auto;background:var(--navy-lighter);padding:18px;border-radius:8px;margin-top:14px}
.totals-box .row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px}
.totals-box .row.grand{border-top:1px solid var(--border);margin-top:6px;padding-top:12px;font-size:18px;color:var(--gold);font-weight:bold}

/* --- چاپ فاکتور --- */
.print-page{background:#fff;color:#111;max-width:800px;margin:20px auto;padding:40px;border-radius:8px}
.print-page table th{background:#f4f4f4;color:#111}
.print-page table td,.print-page table th{border-color:#ddd}
@media print{
  body{background:#fff}
  .no-print{display:none !important}
  .print-page{margin:0;box-shadow:none;max-width:100%}
}

/* --- ریسپانسیو --- */
@media (max-width:768px){
  .app-layout{flex-direction:column}
  .sidebar{width:100%;min-height:auto}
  .sidebar nav{display:flex;overflow-x:auto}
  .sidebar nav a{white-space:nowrap;border-right:none;border-bottom:3px solid transparent}
  .sidebar nav a:hover,.sidebar nav a.active{border-bottom-color:var(--gold);border-right-color:transparent}
  .sidebar .brand,.sidebar .logout{display:none}
  .main-content{padding:14px}
}