@import url("https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css");

:root{
  --ui-font-family:"Vazirmatn",Tahoma,Arial,sans-serif;

  --ui-primary:#0d6efd;
  --ui-primary-700:#0956c7;
  --ui-secondary:#16a3b6;
  --ui-success:#159968;
  --ui-warning:#d88900;
  --ui-danger:#cf3440;
  --ui-info:#2d7fc1;

  --ui-bg:#f3f7fb;
  --ui-surface:#ffffff;
  --ui-surface-soft:#f8fbfe;
  --ui-border:#dce7f1;
  --ui-text-primary:#10263f;
  --ui-text-secondary:#52677f;
  --ui-text-muted:#75879b;

  --ui-space-1:4px;
  --ui-space-2:8px;
  --ui-space-3:12px;
  --ui-space-4:16px;
  --ui-space-5:24px;
  --ui-space-6:32px;
  --ui-space-7:48px;
  --ui-space-8:64px;

  --ui-radius-sm:8px;
  --ui-radius-md:12px;
  --ui-radius-lg:16px;
  --ui-radius-xl:22px;
  --ui-radius-pill:999px;

  --ui-shadow-sm:0 4px 14px rgba(16,38,63,.05);
  --ui-shadow-md:0 12px 28px rgba(16,38,63,.08);
  --ui-shadow-lg:0 22px 55px rgba(16,38,63,.14);

  --ui-header-height:68px;
  --ui-stat-height:84px;
  --ui-motion:160ms ease;
}

*{box-sizing:border-box}
html{font-family:var(--ui-font-family);background:var(--ui-bg);color:var(--ui-text-primary)}
body{margin:0;min-height:100vh;background:var(--ui-bg);font-family:var(--ui-font-family);color:var(--ui-text-primary)}
button,input,select,textarea{font:inherit}
a{text-decoration:none;color:inherit}
img{max-width:100%}

.ui-container{width:min(1180px,calc(100% - 30px));margin-inline:auto}
.ui-stack{display:flex;flex-direction:column;gap:var(--ui-space-4)}
.ui-row{display:flex;align-items:center;gap:var(--ui-space-3)}
.ui-grid{display:grid;gap:var(--ui-space-4)}
.ui-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ui-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.ui-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.ui-page-title{font-size:1.5rem;font-weight:800;line-height:1.5;color:var(--ui-text-primary);margin:0}
.ui-section-title{font-size:1.125rem;font-weight:750;line-height:1.6;color:var(--ui-text-primary);margin:0}
.ui-card-title{font-size:.95rem;font-weight:700;line-height:1.6;color:var(--ui-text-primary);margin:0}
.ui-body{font-size:.875rem;font-weight:400;line-height:1.9;color:var(--ui-text-secondary)}
.ui-caption{font-size:.75rem;font-weight:400;line-height:1.7;color:var(--ui-text-muted)}

.ui-header{height:var(--ui-header-height);background:var(--ui-surface);border-bottom:1px solid var(--ui-border);position:sticky;top:0;z-index:20}
.ui-header__inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--ui-space-4)}
.ui-brand{display:flex;align-items:center;gap:var(--ui-space-3)}
.ui-brand__mark{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--ui-secondary),var(--ui-success));color:#fff;font-size:22px}
.ui-nav{display:flex;align-items:center;gap:var(--ui-space-5);font-size:.84rem;color:var(--ui-text-secondary)}

.ui-page{padding-block:var(--ui-space-6)}
.ui-page-head{display:flex;align-items:center;justify-content:space-between;gap:var(--ui-space-4);margin-bottom:var(--ui-space-5)}
.ui-page-head__text{display:flex;flex-direction:column;gap:var(--ui-space-1)}

.ui-card{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);padding:var(--ui-space-4);box-shadow:var(--ui-shadow-sm)}
.ui-card--flat{box-shadow:none}
.ui-card--soft{background:var(--ui-surface-soft)}
.ui-stat-card{height:var(--ui-stat-height);min-height:var(--ui-stat-height);display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--ui-space-3)}
.ui-stat-card__value{font-size:1.45rem;font-weight:850;line-height:1.2;color:var(--ui-text-primary)}
.ui-stat-card__label{font-size:.75rem;color:var(--ui-text-muted);margin-top:4px}

.ui-btn{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 15px;border-radius:var(--ui-radius-md);border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text-primary);font-weight:700;cursor:pointer;transition:all var(--ui-motion)}
.ui-btn:hover{transform:translateY(-1px);box-shadow:var(--ui-shadow-sm)}
.ui-btn--primary{background:var(--ui-primary);border-color:var(--ui-primary);color:#fff}
.ui-btn--success{background:var(--ui-success);border-color:var(--ui-success);color:#fff}
.ui-btn--danger{background:var(--ui-danger);border-color:var(--ui-danger);color:#fff}
.ui-btn--sm{min-height:34px;padding:6px 11px;font-size:.78rem}

.ui-badge{display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:4px 10px;border-radius:var(--ui-radius-pill);font-size:.72rem;font-weight:700}
.ui-badge--success{background:#e7f8f2;color:#08704c}
.ui-badge--warning{background:#fff3d9;color:#8a5a00}
.ui-badge--info{background:#eaf4ff;color:#155b95}

.ui-input,.ui-select,.ui-textarea{width:100%;border:1px solid var(--ui-border);border-radius:var(--ui-radius-md);background:var(--ui-surface);color:var(--ui-text-primary);padding:10px 12px;outline:none;transition:border-color var(--ui-motion),box-shadow var(--ui-motion)}
.ui-input:focus,.ui-select:focus,.ui-textarea:focus{border-color:var(--ui-primary);box-shadow:0 0 0 3px rgba(13,110,253,.12)}

.ui-table-wrap{overflow:auto;border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);background:var(--ui-surface)}
.ui-table{width:100%;border-collapse:collapse;min-width:680px}
.ui-table th,.ui-table td{padding:13px 14px;border-bottom:1px solid var(--ui-border);text-align:right;font-size:.82rem}
.ui-table th{background:var(--ui-surface-soft);font-weight:750;color:var(--ui-text-primary)}
.ui-table td{color:var(--ui-text-secondary)}
.ui-table tr:last-child td{border-bottom:0}

.ui-hero{background:linear-gradient(145deg,#10263f,#174f80);color:#fff;border-radius:var(--ui-radius-xl);padding:var(--ui-space-6);box-shadow:var(--ui-shadow-lg)}
.ui-hero .ui-page-title,.ui-hero .ui-section-title{color:#fff}
.ui-hero .ui-body,.ui-hero .ui-caption{color:#d6e4f0}

@media(max-width:900px){
 .ui-grid-4,.ui-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ui-nav{display:none}
}
@media(max-width:640px){
 .ui-grid-4,.ui-grid-3,.ui-grid-2{grid-template-columns:1fr}
 .ui-page-head{align-items:flex-start;flex-direction:column}
 .ui-container{width:min(100% - 22px,1180px)}
}