*{box-sizing:border-box}
body{margin:0;font-family:"B Titr",Tahoma,Arial,sans-serif;font-size:12px;background:#f4f7fb;color:#172033}.app{min-height:100vh}.sidebar{position:fixed;right:0;top:0;bottom:0;width:245px;background:#172554;color:#fff;padding:24px 16px}.brand{text-align:center;font-size:12px;font-weight:bold;margin-bottom:28px}.sidebar button{width:100%;border:0;background:transparent;color:#dbeafe;padding:14px;border-radius:10px;text-align:right;cursor:pointer;margin-bottom:7px;font:inherit}.sidebar button.active,.sidebar button:hover{background:#2563eb;color:#fff}.main{margin-right:245px;padding:28px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:20px}h1{margin:0;font-size:12px}header p{color:#64748b;font-size:12px}.primary{border:0;background:#2563eb;color:#fff;padding:11px 18px;border-radius:9px;cursor:pointer;font:inherit}.card{background:#fff;border-radius:15px;box-shadow:0 5px 20px #17255412;overflow:hidden}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:1250px}th,td{padding:13px;border-bottom:1px solid #e8edf4;text-align:right;font-size:12px}th{background:#f8fafc;color:#475569;white-space:nowrap}.badge{padding:5px 9px;border-radius:20px;background:#eff6ff;color:#1d4ed8;font-weight:bold}.actions{display:flex;gap:6px}.btn{border:0;border-radius:7px;padding:7px 10px;cursor:pointer;font:inherit}.edit{background:#e0f2fe;color:#0369a1}.del{background:#fee2e2;color:#b91c1c}.empty{text-align:center;color:#94a3b8;padding:50px}.overlay{display:none;position:fixed;inset:0;background:#0f172a99;align-items:center;justify-content:center;padding:20px;z-index:100}.modal{background:#fff;width:min(650px,100%);padding:24px;border-radius:16px;max-height:90vh;overflow:auto}.modal h2{margin-top:0;font-size:12px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:6px}.full{grid-column:1/-1}label{font-size:12px;font-weight:bold;color:#475569}input,select{padding:10px;border:1px solid #d7dee9;border-radius:8px;font:inherit}.modal-actions{display:flex;gap:8px;margin-top:20px}.secondary{border:0;border-radius:8px;padding:10px 18px;cursor:pointer;font:inherit}.note{background:#eff6ff;color:#1e40af;padding:10px;border-radius:8px;font-size:12px;margin-bottom:15px}#toast{display:none;position:fixed;left:25px;bottom:25px;background:#0f172a;color:#fff;padding:12px 17px;border-radius:9px;z-index:200;font-size:12px}.remaining-days{font-weight:bold;white-space:nowrap}tr.remaining-danger td{background:#ffe1e1!important;color:#b00020!important}tr.remaining-danger .remaining-days{color:#b00020;font-weight:bold}@media(max-width:700px){.sidebar{position:static;width:100%;height:auto}.main{margin:0;padding:16px}.grid{grid-template-columns:1fr}.full{grid-column:auto}header{flex-direction:column;align-items:stretch}.sidebar nav{display:flex;gap:5px}.sidebar button{text-align:center;margin:0}.brand{margin-bottom:12px}}
.project-section{margin-bottom:26px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 2px 10px}.section-title h2{margin:0;font-size:14px;color:#172033}.section-title p{margin:5px 0 0;color:#64748b;font-size:11px}.section-count{min-width:34px;height:34px;padding:0 9px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#dbeafe;color:#1d4ed8;font-weight:bold}.section-count.warning{background:#fee2e2;color:#b91c1c}.section-count.success{background:#dcfce7;color:#15803d}.expiry-section .card{border:1px solid #fecaca}.installed-section .card{border:1px solid #bbf7d0}.finish{background:#dcfce7;color:#166534}.status-installed{display:inline-flex;padding:5px 9px;border-radius:20px;background:#dcfce7;color:#166534;font-weight:bold;white-space:nowrap}.expiry-section tr.remaining-danger td{background:#ffe1e1!important}.empty{min-height:70px}@media(max-width:700px){.section-title{align-items:flex-start}.section-title h2{font-size:13px}}

.start{background:#dbeafe;color:#1d4ed8}.progress-cell{display:inline-flex;min-width:56px;min-height:30px;align-items:center;justify-content:center;padding:5px 10px;border-radius:8px;font-weight:bold}.progress-empty{background:transparent;color:transparent;min-width:20px}.progress-start{background:#fde68a;color:#92400e}.progress-10,.progress-20,.progress-30{background:#fee2e2;color:#b91c1c}.progress-40,.progress-50,.progress-60{background:#fef3c7;color:#92400e}.progress-70,.progress-80,.progress-90{background:#dcfce7;color:#166534}.progress-100{background:#22c55e;color:#fff}

/* فاصله و رنگ‌بندی عنوان سه جدول */
.project-section{margin-bottom:48px}
.project-section:last-child{margin-bottom:10px}
.section-title{padding:14px 18px;margin:0 0 16px;border-radius:13px;box-shadow:0 3px 10px rgba(15,23,42,.05)}
.section-title h2{font-size:15px}
.section-title p{font-size:11px}
.project-section:not(.expiry-section):not(.installed-section) .section-title{background:#e0efff;border:1px solid #bfdbfe}
.project-section:not(.expiry-section):not(.installed-section) .section-title h2{color:#1d4ed8}
.project-section:not(.expiry-section):not(.installed-section) .section-title p{color:#3b82f6}
.expiry-section .section-title{background:#fff4cc;border:1px solid #fde68a}
.expiry-section .section-title h2{color:#a16207}
.expiry-section .section-title p{color:#b7791f}
.installed-section .section-title{background:#dcfce7;border:1px solid #bbf7d0}
.installed-section .section-title h2{color:#15803d}
.installed-section .section-title p{color:#16a34a}

/* صفحه ورود */
.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at top right,#dbeafe 0,#f4f7fb 38%,#eef2ff 100%)}
.login-card{width:min(430px,100%);background:#fff;border:1px solid #e2e8f0;border-radius:24px;padding:32px;box-shadow:0 20px 60px rgba(15,23,42,.12);text-align:right}
.login-logo{width:64px;height:64px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;border-radius:18px;background:#dbeafe;font-size:30px}
.login-card h1{text-align:center;font-size:19px;color:#172033;margin:0 0 9px}
.login-card>p{text-align:center;color:#64748b;font-size:12px;line-height:2;margin:0 0 25px}
.login-step>label{display:block;margin-bottom:9px;font-weight:bold;color:#334155}
.role-choice{width:100%;display:flex;align-items:center;gap:13px;border:1px solid #dbeafe;background:#f8fbff;border-radius:14px;padding:15px;margin:10px 0;cursor:pointer;text-align:right;font:inherit;transition:.2s}
.role-choice:hover{border-color:#60a5fa;background:#eff6ff;transform:translateY(-1px)}
.role-choice>span{width:42px;height:42px;border-radius:12px;background:#dbeafe;display:flex;align-items:center;justify-content:center;font-size:21px}
.role-choice b{display:block;color:#1e3a8a;font-size:13px;margin-bottom:4px}
.role-choice small{color:#64748b;font-size:10px}
.back-role{border:0;background:none;color:#2563eb;cursor:pointer;padding:0;margin-bottom:16px;font:inherit}
.selected-role{background:#eff6ff;color:#1d4ed8;border-radius:10px;padding:10px 12px;margin-bottom:18px;font-weight:bold;text-align:center}
#loginPassword{width:100%;height:44px;margin-bottom:12px}
.login-button{width:100%;border:0;border-radius:10px;background:#2563eb;color:#fff;padding:12px;cursor:pointer;font:inherit;font-weight:bold}
.login-button:disabled{opacity:.7;cursor:wait}
.login-error{min-height:24px;color:#dc2626;text-align:center;font-size:11px;padding-top:9px}
.header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.role-pill{display:inline-flex;align-items:center;padding:9px 13px;border-radius:20px;background:#eff6ff;color:#1d4ed8;font-size:11px;font-weight:bold}
.logout-btn{background:#f1f5f9;color:#475569;padding:9px 13px}
@media(max-width:700px){.login-card{padding:24px}.header-actions{width:100%}.role-pill{flex:1;justify-content:center}}