/* ==========================================================
   partners-map.css — scoped component for .mb-partners-map
   All selectors are scoped under .mb-partners-map.
   No global body styles are modified.
   ========================================================== */

/* ---- component root ---- */
.mb-partners-map{
  --mb-blue:var(--brand-600,#237023);
  --mb-blue-2:var(--brand-500,#2e8e2e);
  --mb-blue-border:var(--brand-200,#b8e0b8);
  --mb-accent-green:var(--brand-500,#2e8e2e);
  --mb-accent-green-dark:var(--brand-700,#1c5a1c);
  --mb-accent-teal:var(--brand-600,#237023);
  --mb-province:#2575BC;
  --mb-province-2:#1f63a3;
  --mb-province-stroke:#FFFFFF;
  --mb-bg:var(--surface,#f8f7f4);
  --mb-card:#ffffff;
  --mb-text:var(--text,#231f18);
  --mb-muted:var(--text-muted,#7e7265);
  --mb-line:var(--border,#e2ddd3);
  --mb-hover:#F37A20;
  --mb-hover-2:#F37A20;
  --mb-active:#F37A20;
  --mb-active-2:#d9640f;
  --mb-secondary:#6CA8DC;
  --mb-secondary-2:#4a8fd0;
  --mb-active-bg:#fff4ec;
  --mb-active-border:#ffd9bd;
  --mb-shadow:0 8px 30px rgba(35,31,24,0.08), 0 1px 4px rgba(35,31,24,0.06);
  --mb-radius:18px;
  --mb-radius-sm:12px;
  max-width:1180px;
  margin:32px auto;
  padding:28px 28px 22px;
  background:var(--mb-bg);
  border-radius:22px;
  color:var(--mb-text);
  font-family:"IRANSansX", system-ui, -apple-system, Tahoma, sans-serif;
  line-height:1.75;
  box-sizing:border-box;
}
.mb-partners-map *{ box-sizing:border-box; }

/* ---- header ---- */
.mb-partners-map__header{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:22px;
}
.mb-partners-map__header-icon{
  width:44px; height:44px;
  border-radius:999px;
  border:1.6px solid var(--mb-blue-border);
  background:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--mb-blue);
  flex-shrink:0;
}
.mb-partners-map__title{
  margin:0;
  font-size:19px;
  font-weight:800;
  color:var(--mb-blue);
  letter-spacing:0;
  line-height:1.4;
}
.mb-partners-map__subtitle{
  margin:3px 0 0;
  font-size:12.5px;
  color:var(--mb-muted);
}

/* ---- main grid  42% map / 58% info on desktop ---- */
.mb-partners-map__main{
  display:grid;
  grid-template-columns: 42% 58%;
  gap:22px;
  align-items:start;
}

/* ---- map wrap ---- */
.mb-partners-map__map-wrap{
  position:relative;
  background:var(--mb-card);
  border:1px solid var(--mb-line);
  border-radius:var(--mb-radius);
  box-shadow:var(--mb-shadow);
  padding:18px 14px 14px;
  overflow:visible;
  min-height:420px;
  display:flex; align-items:center; justify-content:center;
}
.mb-partners-map__svg{
  width:100%;
  height:auto;
  display:block;
  max-width:620px;
}

/* provinces */
.mb-partners-map .mb-province{
  fill:var(--mb-province);
  stroke:var(--mb-province-stroke);
  stroke-width:1;
  vector-effect:non-scaling-stroke;
  cursor:pointer;
  transition: fill .25s ease-in-out, stroke .25s ease-in-out, filter .25s ease-in-out;
  outline:none;
}
.mb-partners-map .mb-province:hover,
.mb-partners-map .mb-province.is-hover{
  fill:var(--mb-hover);
  stroke:#FFFFFF;
}
.mb-partners-map .mb-province:focus-visible{
  stroke:#FFFFFF;
  stroke-width:2.2;
  filter: drop-shadow(0 0 6px rgba(243,122,32,0.55));
}
.mb-partners-map .mb-province.is-active{
  fill:var(--mb-active);
  stroke:#FFFFFF;
  filter: drop-shadow(0 4px 12px rgba(243,122,32,0.34));
}
.mb-partners-map .mb-province.is-active.is-hover{
  fill:var(--mb-active);
}
/* secondary selected — the chosen province while another is hovered */
.mb-partners-map .mb-province.is-active.is-secondary{
  fill:var(--mb-secondary);
  filter: drop-shadow(0 4px 12px rgba(108,168,220,0.40));
}

/* ---- tooltip (single reusable) ---- */
.mb-partners-map__tooltip{
  position:absolute;
  z-index:5;
  left:50%; top:22%;
  transform:translateX(-50%);
  pointer-events:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  direction:rtl;
}
.mb-partners-map__tooltip[hidden]{ display:none !important; }
.mb-partners-map__tooltip-inner{
  background:#FFFFFF;
  border:0;
  border-radius:8px;
  padding:8px 12px;
  min-width:132px;
  text-align:center;
  box-shadow:0 4px 14px rgba(0,0,0,0.12);
}
.mb-partners-map__tooltip-province{
  font-size:12.5px; font-weight:800; color:#263238; margin-bottom:2px;
}
.mb-partners-map__tooltip-line{
  font-size:11.5px; color:#6b7b8c; font-weight:500;
}
.mb-partners-map__tooltip-line--muted{ color:#8a97a6; font-weight:500; }
.mb-partners-map__tooltip-arrow{
  display:block;
  width:12px; height:12px;
  background:#FFFFFF;
  transform: rotate(45deg);
  margin:-6px auto 0;
  border-radius:0 0 2px 0;
}
/* flipped below the province: arrow moves to the top and points up */
.mb-partners-map__tooltip.is-below{ flex-direction:column-reverse; }
.mb-partners-map__tooltip.is-below .mb-partners-map__tooltip-arrow{
  margin:0 auto -6px;
  border-radius:2px 0 0 0;
}

/* ---- right info panel ---- */
.mb-partners-map__info{
  display:flex; flex-direction:column;
  background:var(--mb-card);
  border:1px solid var(--mb-line);
  border-radius:var(--mb-radius);
  box-shadow:var(--mb-shadow);
  padding:22px 22px 18px;
}
.mb-partners-map__info-title{
  margin:0 0 6px;
  font-size:16px; font-weight:800; color:var(--mb-blue);
}
.mb-partners-map__info-desc{
  margin:0 0 16px;
  font-size:12.5px; color:var(--mb-muted); line-height:1.9;
}
.mb-partners-map__info-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:10px;
}
.mb-partners-map__info-row{
  display:grid;
  grid-template-columns: 28px 1fr auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  background:var(--mb-bg);
  border:1px solid var(--mb-line);
  border-radius:12px;
}
.mb-partners-map__info-icon{
  width:28px; height:28px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--mb-line);
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--mb-blue);
}
.mb-partners-map__info-label{
  font-size:12.5px; font-weight:700; color:var(--mb-text);
}
.mb-partners-map__info-value{
  font-size:12px; color:var(--mb-muted); font-weight:500;
  text-align:left;
  white-space:nowrap;
}

/* social row */
.mb-partners-map__social-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--mb-line);
  flex-wrap:wrap;
}
.mb-partners-map__social-links{
  display:flex; gap:8px; align-items:center;
}
.mb-partners-map__social-link{
  width:32px; height:32px;
  border-radius:999px;
  background:var(--mb-bg);
  border:1px solid var(--mb-line);
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--mb-blue);
  text-decoration:none;
  transition: background 140ms ease, transform 140ms ease;
}
.mb-partners-map__social-link:hover{ background:var(--mb-blue-border); transform: translateY(-1px); }
.mb-partners-map__social-link:focus-visible{ outline:2px solid var(--mb-blue); outline-offset:2px; }

.mb-partners-map__cta{
  appearance:none;
  border:1px solid var(--mb-blue);
  background:#fff;
  color:var(--mb-blue);
  border-radius:999px;
  padding:8px 16px;
  font:inherit;
  font-size:12.5px; font-weight:700;
  cursor:pointer;
  transition: background 140ms ease, color 140ms ease;
  white-space:nowrap;
}
.mb-partners-map__cta:hover{ background:var(--mb-blue); color:#fff; }
.mb-partners-map__cta:focus-visible{ outline:2px solid var(--mb-blue); outline-offset:2px; }

/* selected province summary */
.mb-partners-map__selected{
  margin:0 0 14px;
  background:linear-gradient(135deg,var(--mb-active-bg) 0%, #ffffff 65%);
  border:1.8px solid var(--mb-active-border);
  border-radius:16px;
  padding:16px 16px 14px;
  box-shadow:0 6px 22px rgba(245,162,0,0.14);
  order:-1;
}
.mb-partners-map__selected-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-bottom:12px;
}
.mb-partners-map__selected-province{
  font-size:17px; font-weight:900; color:var(--mb-text);
  letter-spacing:-0.02em;
}
.mb-partners-map__selected-badge{
  font-size:11px; font-weight:700;
  background:var(--mb-active-bg); color:var(--mb-active-2);
  border:1px solid var(--mb-active-border);
  border-radius:999px;
  padding:2px 9px;
}
.mb-partners-map__selected-stats{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:8px;
  margin-bottom:12px;
}
.mb-partners-map__stat{
  background:#fff;
  border:1px solid var(--mb-line);
  border-radius:12px;
  padding:10px 6px;
  text-align:center;
}
.mb-partners-map__stat-num{ display:block; font-size:18px; font-weight:900; color:var(--mb-blue); line-height:1.2; }
.mb-partners-map__stat-label{ display:block; margin-top:3px; font-size:11.5px; color:var(--mb-muted); font-weight:600; }
.mb-partners-map__selected-btn{
  width:100%;
  appearance:none;
  border:none;
  background:var(--mb-blue);
  color:#fff;
  border-radius:999px;
  padding:10px 14px;
  font:inherit; font-size:12.5px; font-weight:700;
  cursor:pointer;
  transition: filter 140ms ease, transform 140ms ease;
}
.mb-partners-map__selected-btn:hover{ filter:brightness(1.06); }
.mb-partners-map__selected-btn:active{ transform: scale(0.99); }
.mb-partners-map__selected-btn:focus-visible{ outline:2px solid var(--mb-active); outline-offset:2px; }


/* — polish: two CTAs in selected panel + demo note — */
.mb-partners-map__selected-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:2px;
}
.mb-partners-map__selected-actions .mb-partners-map__selected-btn{flex:1 1 140px;}
.mb-partners-map__selected-btn--outline{
  background:#fff;
  color:var(--mb-blue);
  border:1.8px solid var(--mb-blue);
}
.mb-partners-map__selected-btn--outline:hover{background:var(--mb-blue);color:#fff;}
.mb-partners-map__demo-note{
  margin-top:8px;
  font-size:11px;
  color:var(--mb-muted);
  line-height:1.7;
}

/* ---- bottom coverage card ---- */
.mb-partners-map__coverage{
  margin-top:18px;
  background:var(--mb-card);
  border:1px solid var(--mb-line);
  border-radius:var(--mb-radius);
  box-shadow:var(--mb-shadow);
  padding:16px 16px 14px;
}
.mb-partners-map__coverage-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
  flex-wrap:wrap;
}
.mb-partners-map__coverage-title{
  margin:0;
  font-size:13.5px; font-weight:800; color:var(--mb-blue);
}
.mb-partners-map__search{
  position:relative;
  display:flex; align-items:center;
  background:var(--mb-bg);
  border:1px solid var(--mb-line);
  border-radius:999px;
  padding:0 10px 0 6px;
  min-width:240px;
  max-width:340px;
  flex:1;
}
.mb-partners-map__search-icon{ color:var(--mb-muted); display:inline-flex; margin-left:6px; }
.mb-partners-map__search-input{
  flex:1;
  border:none; background:transparent;
  font:inherit; font-size:12.5px;
  padding:9px 0;
  outline:none;
  color:var(--mb-text);
  min-width:0;
}
.mb-partners-map__search-input::placeholder{ color:var(--mb-muted); }
.mb-partners-map__search-clear{
  width:22px; height:22px;
  border-radius:999px;
  border:none;
  background:var(--mb-bg);
  color:var(--mb-muted);
  cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; line-height:1;
}
.mb-partners-map__coverage-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:10px;
}
.mb-partners-map__city{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:var(--mb-bg);
  border:1px solid var(--mb-line);
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
  transition: border-color 140ms ease, transform 140ms ease, background 140ms ease;
  text-align:right;
}
.mb-partners-map__city:hover{ border-color:var(--mb-active-border); background:var(--mb-active-bg); transform: translateY(-1px); }
.mb-partners-map__city:focus-visible{ outline:2px solid var(--mb-blue); outline-offset:2px; }
.mb-partners-map__city.is-active{ border-color:var(--mb-active); background:var(--mb-active-bg); }
.mb-partners-map__city-name{ font-size:12.5px; font-weight:700; color:var(--mb-text); }
.mb-partners-map__city-meta{ font-size:11px; color:var(--mb-muted); margin-top:2px; }
.mb-partners-map__city-badge{
  background:linear-gradient(180deg,var(--mb-blue),var(--mb-accent-green-dark));
  color:#fff;
  border-radius:999px;
  font-size:11.5px; font-weight:800;
  padding:4px 10px;
  white-space:nowrap;
  flex-shrink:0;
  min-width:60px;
  text-align:center;
}
.mb-partners-map__city[hidden]{ display:none !important; }
.mb-partners-map__empty{
  margin:14px 0 4px;
  text-align:center;
  font-size:12.5px; color:var(--mb-muted);
  background:var(--mb-bg);
  border:1px dashed var(--mb-line);
  border-radius:12px;
  padding:14px;
}
.mb-partners-map__empty[hidden]{ display:none !important; }

/* toast */
.mb-partners-map__toast{
  position:fixed;
  left:50%; bottom:22px;
  transform:translateX(-50%);
  background:#231f18;
  color:#fff;
  border-radius:999px;
  padding:10px 18px;
  font-size:12.5px; font-weight:600;
  box-shadow:0 12px 30px rgba(0,0,0,0.18);
  z-index:30;
  max-width:min(92vw, 560px);
  text-align:center;
}
.mb-partners-map__toast[hidden]{ display:none !important; }

/* bottom action bar (steel-blue) — full width inside component */
.mb-partners-map::after{
  content:"";
  display:block;
  height:0;
}

/* ---- responsive ---- */
@media (max-width: 1023px){
  .mb-partners-map{ padding:18px 14px 14px; margin:14px auto; border-radius:18px; }
  .mb-partners-map__main{ grid-template-columns:1fr; }
  .mb-partners-map__map-wrap{ min-height:360px; padding:12px 8px; }
  .mb-partners-map__selected-stats{ grid-template-columns: repeat(2, 1fr); }
  .mb-partners-map__coverage-grid{ grid-template-columns: repeat(2, 1fr); }
  .mb-partners-map__search{ min-width:0; max-width:none; width:100%; }
  .mb-partners-map__coverage-head{ flex-direction:column; align-items:stretch; }
}
@media (max-width: 560px){
  .mb-partners-map__title{ font-size:17px; }
  .mb-partners-map__coverage-grid{ grid-template-columns: 1fr; }
  .mb-partners-map__info-row{ grid-template-columns:28px 1fr; }
  .mb-partners-map__info-value{ grid-column:2; text-align:right; font-size:11.5px; }
  .mb-partners-map__social-row{ flex-direction:column; align-items:stretch; }
  .mb-partners-map__cta{ width:100%; text-align:center; }
}
@media (prefers-reduced-motion: reduce){
  .mb-partners-map .mb-province{ transition:none; }
}