/* Magnet IB v2 — پورتال شرکای معرف */

.mib{
  --mib-ink:#1B2233;
  --mib-soft:#4A5468;
  --mib-muted:#8792A6;
  --mib-line:#E6E9F0;
  --mib-bg:#F7F8FC;
  --mib-primary:#6C5CE7;
  --mib-primary-soft:#EFECFE;
  --mib-green:#12A87B;
  --mib-green-soft:#E6F7F1;
  --mib-amber:#E9922B;
  --mib-amber-soft:#FDF3E6;
  --mib-red:#E5484D;
  --mib-red-soft:#FDECED;

  direction:rtl;
  font-family:"Vazirmatn","IRANSansX","IRANSans",Tahoma,sans-serif;
  color:var(--mib-ink);
  line-height:2;
  max-width:1100px;
  margin-inline:auto;
  padding:34px 18px 70px;
}
.mib *,.mib *::before,.mib *::after{box-sizing:border-box}
.mib h1,.mib h2,.mib h3{margin:0;line-height:1.6;color:var(--mib-ink)}
.mib p{margin:0}
.mib .mib-muted{color:var(--mib-muted)}
.mib .mib-small{font-size:12.5px}
.mib a{color:inherit}
.mib :focus-visible{outline:2.5px solid var(--mib-primary);outline-offset:3px;border-radius:6px}

/* سربرگ */
.mib .mib-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:22px}
.mib .mib-eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--mib-primary);display:inline-flex;align-items:center;gap:9px}
.mib .mib-eyebrow::before{content:"";width:24px;height:3px;background:var(--mib-red);border-radius:2px}
.mib .mib-head h1{font-size:28px;font-weight:700;margin-top:8px}
.mib .mib-logout{font-size:13px;color:var(--mib-muted);text-decoration:none;border:1px solid var(--mib-line);border-radius:999px;padding:6px 18px;background:#fff}
.mib .mib-logout:hover{border-color:var(--mib-soft);color:var(--mib-ink)}

/* تب‌ها */
.mib .mib-tabs{display:flex;gap:10px;justify-content:center;margin-bottom:24px;flex-wrap:wrap}
.mib .mib-tab{
  text-decoration:none;font-size:14.5px;font-weight:500;padding:10px 26px;border-radius:10px;
  background:#fff;border:1px solid var(--mib-line);color:var(--mib-soft);transition:all .18s;
}
.mib .mib-tab:hover{border-color:var(--mib-primary);color:var(--mib-primary)}
.mib .mib-tab.is-on{background:var(--mib-primary);border-color:var(--mib-primary);color:#fff}

/* پیام‌ها */
.mib .mib-notice{border-radius:10px;padding:12px 18px;font-size:14px;margin-bottom:18px}
.mib .mib-notice--ok{background:var(--mib-green-soft);border-inline-start:3px solid var(--mib-green);color:#0A6E51}
.mib .mib-notice--err{background:var(--mib-red-soft);border-inline-start:3px solid var(--mib-red);color:#9B2226}
.mib .mib-notice--warn{background:var(--mib-amber-soft);border-inline-start:3px solid var(--mib-amber);color:#8A5A12}

/* جمع‌ها */
.mib .mib-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}
.mib .mib-total{background:#fff;border:1px solid var(--mib-line);border-radius:14px;padding:18px 22px}
.mib .mib-total--due{background:var(--mib-ink);border-color:var(--mib-ink)}
.mib .mib-total__k{display:block;font-size:12.5px;color:var(--mib-muted)}
.mib .mib-total--due .mib-total__k{color:#A7B0C2}
.mib .mib-total__v{display:block;font-size:21px;font-weight:700;margin-top:2px}
.mib .mib-total__v small{font-size:12px;font-weight:400;color:var(--mib-muted)}
.mib .mib-total--due .mib-total__v,.mib .mib-total--due .mib-total__v small{color:#fff}

/* نوار ابزار */
.mib .mib-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:6px;padding:0 4px}
.mib .mib-count{font-size:14px;font-weight:500}
.mib .mib-filters{display:flex;gap:10px}
.mib .mib-filters select{
  font-family:inherit;font-size:13.5px;color:var(--mib-soft);background:#fff;
  border:1px solid var(--mib-line);border-radius:10px;padding:8px 14px;cursor:pointer;
}

/* کارت پروژه */
.mib .mib-project{background:#fff;border:1px solid var(--mib-line);border-radius:16px;padding:22px 24px 20px;margin-top:16px}
.mib .mib-project.is-cancelled{background:#FCFCFD}
.mib .mib-project__head{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.mib .mib-project__id{display:flex;flex-direction:column;min-width:120px}
.mib .mib-code{font-size:13px;font-weight:700;color:var(--mib-soft);direction:ltr;text-align:right}
.mib .mib-project__title{flex:1;text-align:left}
.mib .mib-project__title h3{font-size:18px;font-weight:700}
.mib .mib-badge{font-size:12px;font-weight:600;padding:5px 14px;border-radius:8px;white-space:nowrap}
.mib .mib-badge--live{color:var(--mib-primary);background:var(--mib-primary-soft)}
.mib .mib-badge--warn{color:#8A5A12;background:var(--mib-amber-soft)}
.mib .mib-badge--done{color:#0A6E51;background:var(--mib-green-soft)}
.mib .mib-badge--cancel{color:#9B2226;background:var(--mib-red-soft)}

/* استپر */
.mib .mib-stepper{display:flex;list-style:none;margin:26px 0 18px;padding:0;justify-content:space-between}
.mib .mib-step{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:9px;font-size:12px;color:var(--mib-muted)}
.mib .mib-step::before{content:"";position:absolute;top:15px;right:50%;left:-50%;height:2px;background:var(--mib-line);z-index:0}
.mib .mib-step:first-child::before{display:none}
.mib .mib-step.is-done::before,.mib .mib-step.is-now::before{background:var(--mib-primary)}
.mib .mib-step__dot{
  position:relative;z-index:1;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;background:#fff;border:2px solid var(--mib-line);
}
.mib .mib-step.is-done .mib-step__dot{background:var(--mib-primary);border-color:var(--mib-primary)}
.mib .mib-step.is-done .mib-step__dot::after{content:"";width:9px;height:9px;border-radius:50%;background:#fff}
.mib .mib-step.is-now .mib-step__dot{border-color:var(--mib-primary);box-shadow:0 0 0 4px var(--mib-primary-soft)}
.mib .mib-step.is-now .mib-step__dot::after{content:"";width:11px;height:11px;border-radius:50%;background:var(--mib-primary)}
.mib .mib-step.is-done .mib-step__label,.mib .mib-step.is-now .mib-step__label{color:var(--mib-primary);font-weight:600}
.mib .mib-step--cancel::before{border-top:2px dashed var(--mib-line);background:none!important;height:0}
.mib .mib-step--cancel .mib-step__dot{border-style:dashed;border-color:#F3B4B6;color:#F3B4B6;font-size:15px;line-height:1}
.mib .mib-step--cancel.is-active .mib-step__dot{background:var(--mib-red);border-color:var(--mib-red);border-style:solid;color:#fff}
.mib .mib-step--cancel.is-active .mib-step__label{color:var(--mib-red);font-weight:600}
.mib .mib-stepper.is-cancelled .mib-step:not(.mib-step--cancel) .mib-step__dot{opacity:.45}

/* نوار پیشرفت — جایگزین استپر روی موبایل */
.mib .mib-progress{display:none;margin:18px 0 14px}
.mib .mib-progress__label{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;font-weight:600;color:var(--mib-primary);margin-bottom:7px}
.mib .mib-progress__label .mib-muted{font-weight:400}
.mib .mib-progress__track{height:6px;background:var(--mib-line);border-radius:4px;overflow:hidden}
.mib .mib-progress__track span{display:block;height:100%;border-radius:4px;background:var(--mib-primary)}
.mib .mib-progress.is-cancelled .mib-progress__label{color:var(--mib-red)}
.mib .mib-progress.is-cancelled .mib-progress__track span{background:var(--mib-red)}

/* متادیتا */
.mib .mib-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.mib .mib-meta__box{background:var(--mib-bg);border-radius:10px;padding:10px 16px;font-size:13.5px;display:flex;gap:8px;align-items:center;justify-content:center}

/* ارقام مالی */
.mib .mib-figures{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.mib .mib-fig{background:var(--mib-bg);border:1px solid var(--mib-line);border-radius:12px;padding:14px 16px;text-align:center}
.mib .mib-fig__k{display:block;font-size:12px;color:var(--mib-muted)}
.mib .mib-fig__v{display:block;font-size:17px;font-weight:700;margin-top:4px;direction:ltr}
.mib .mib-fig__u{display:block;font-size:11.5px;color:var(--mib-muted)}
.mib .mib-fig--green{background:var(--mib-green-soft);border-color:transparent}
.mib .mib-fig--amber{background:var(--mib-amber-soft);border-color:transparent}
.mib .mib-fig--primary{background:var(--mib-primary-soft);border-color:transparent}
.mib .mib-fig--primary .mib-fig__v{color:var(--mib-primary)}
.mib .mib-fig--receipt{display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.mib .mib-receipt{
  display:block;font-size:12.5px;font-weight:500;text-decoration:none;text-align:center;
  border:1px solid var(--mib-line);border-radius:8px;padding:7px 10px;background:#fff;color:var(--mib-primary);
}
.mib .mib-receipt:hover{border-color:var(--mib-primary)}
.mib .mib-receipt.is-off{color:var(--mib-muted);background:#F1F2F6;border-color:transparent}

/* اقدام */
.mib .mib-action{margin-top:14px}
.mib .mib-state{font-size:13.5px;border-radius:10px;padding:11px 18px;text-align:center}
.mib .mib-state--off{background:var(--mib-bg);color:var(--mib-muted)}
.mib .mib-state--wait{background:var(--mib-amber-soft);color:#8A5A12}
.mib .mib-state--done{background:var(--mib-green-soft);color:#0A6E51;font-weight:600}
.mib .mib-state--cancel{background:var(--mib-red-soft);color:#9B2226}
.mib .mib-btn{
  background:var(--mib-primary);color:#fff;border:0;border-radius:10px;
  font-family:inherit;font-size:14.5px;font-weight:600;padding:12px 32px;cursor:pointer;
  transition:filter .18s,transform .18s;
}
.mib .mib-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.mib .mib-btn--settle{width:100%;background:var(--mib-green)}

/* صفحه‌بندی */
.mib .mib-pager{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:22px;flex-wrap:wrap}
.mib .mib-pager > div{display:flex;gap:6px}
.mib .mib-page{
  min-width:34px;height:34px;display:grid;place-items:center;text-decoration:none;font-size:13.5px;
  border:1px solid var(--mib-line);border-radius:9px;background:#fff;color:var(--mib-soft);padding:0 8px;
}
.mib .mib-page.is-on{background:var(--mib-primary);border-color:var(--mib-primary);color:#fff;font-weight:600}

/* کارت‌ها و فرم */
.mib .mib-card{background:#fff;border:1px solid var(--mib-line);border-radius:16px;padding:26px 26px 30px;margin-bottom:18px}
.mib .mib-card h2{font-size:18px;font-weight:700;margin-bottom:14px}
.mib .mib-form label{display:block;font-size:13.5px;color:var(--mib-soft);margin-bottom:14px}
.mib .mib-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.mib .mib-form input[type=text],.mib .mib-form input[type=email],.mib .mib-form textarea{
  width:100%;margin-top:6px;padding:11px 14px;font-family:inherit;font-size:15px;color:var(--mib-ink);
  background:#FBFCFE;border:1px solid var(--mib-line);border-radius:10px;line-height:1.9;
}
.mib .mib-form input:focus,.mib .mib-form textarea:focus{border-color:var(--mib-primary);background:#fff;outline:none}
.mib .mib-form input:disabled{background:#F1F2F6;color:var(--mib-soft)}
.mib .mib-req{color:var(--mib-red)}
.mib .mib-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* دروازه ورود */
.mib--gate{max-width:430px}
.mib--gate h2{font-size:21px;margin-bottom:8px}
.mib--gate p{margin-bottom:18px;font-size:14px}
.mib--gate label{display:block;font-size:13.5px;color:var(--mib-soft);margin-bottom:14px}
.mib--gate input[type=text],.mib--gate input[type=password]{
  width:100%;margin-top:6px;padding:11px 14px;font-family:inherit;font-size:15px;
  background:#FBFCFE;border:1px solid var(--mib-line);border-radius:10px;
}
.mib--gate input[type=submit]{
  background:var(--mib-primary);color:#fff;border:0;border-radius:10px;
  font-family:inherit;font-size:15px;font-weight:600;padding:12px 32px;cursor:pointer;
}

/* واکنش‌گرا */
@media (max-width:1000px){
  .mib .mib-figures{grid-template-columns:repeat(3,1fr)}
  .mib .mib-fig--receipt{grid-column:span 3}
  .mib .mib-fig--receipt{flex-direction:row;align-items:center;justify-content:space-between;text-align:right}
  .mib .mib-receipt{padding:7px 22px}
}

@media (max-width:760px){
  .mib{padding:22px 0 46px;max-width:100%;overflow-x:hidden}
  .mib > *{padding-inline:14px}
  .mib .mib-head{align-items:flex-start;gap:12px}
  .mib .mib-head h1{font-size:22px}
  .mib .mib-totals{grid-template-columns:1fr;gap:10px}
  .mib .mib-total{padding:14px 18px;display:flex;align-items:baseline;justify-content:space-between}
  .mib .mib-total__v{font-size:18px;margin-top:0}

  .mib .mib-tabs{gap:6px}
  .mib .mib-tab{flex:1;text-align:center;padding:10px 8px;font-size:13px}

  .mib .mib-toolbar{flex-direction:column;align-items:stretch;gap:10px}
  .mib .mib-filters{gap:8px}
  .mib .mib-filters select{flex:1;min-width:0;font-size:13px;padding:8px 10px}

  /* کارت پروژه */
  .mib .mib-project{border-radius:14px;padding:18px 16px;margin-top:12px}
  .mib .mib-project__head{flex-direction:column;gap:8px;position:relative;padding-inline-end:96px}
  .mib .mib-project__id{flex-direction:row;gap:10px;align-items:baseline;min-width:0}
  .mib .mib-project__title{text-align:right;width:100%}
  .mib .mib-project__title h3{font-size:16px;line-height:1.7}
  .mib .mib-badge{position:absolute;top:0;inset-inline-start:0}

  /* استپر افقی جای خود را به نوار پیشرفت می‌دهد */
  .mib .mib-stepper{display:none}
  .mib .mib-progress{display:block}

  .mib .mib-meta{grid-template-columns:1fr;gap:8px}
  .mib .mib-meta__box{justify-content:space-between;padding:9px 14px;font-size:13px}

  .mib .mib-figures{grid-template-columns:1fr 1fr;gap:8px}
  .mib .mib-fig{padding:11px 12px;text-align:right}
  .mib .mib-fig__k{font-size:11.5px;line-height:1.9}
  .mib .mib-fig__v{font-size:15.5px;text-align:right}
  .mib .mib-fig--receipt{grid-column:span 2}

  .mib .mib-card{padding:20px 16px 24px;border-radius:14px}
  .mib .mib-grid{grid-template-columns:1fr}
  .mib .mib-btn{width:100%;padding:13px 20px}

  .mib .mib-pager{flex-direction:column;gap:10px}
  .mib .mib-pager > div{flex-wrap:wrap;justify-content:center}

  .mib--gate{max-width:100%}
}

@media (max-width:380px){
  .mib .mib-figures{grid-template-columns:1fr}
  .mib .mib-fig--receipt{grid-column:span 1}
}