/* انتخاب استان/شهر (js/geo-picker.js) — سه تم: light (سبد/پروفایل)، auth (مودال حساب)، calc (کارت ماشین‌حساب).
   لیست باز «داخل جریان صفحه» است؛ پس در کشو/مودال بریده نمی‌شود. */

.geo-picker {
  --geo-bg: #fff;
  --geo-text: var(--ink, #1c2b3e);
  --geo-muted: var(--muted, #6c6759);
  --geo-border: var(--gold-cream-soft, #e8d5bd);
  --geo-accent: var(--mustard, #c9a15a);
  --geo-hover: rgba(201, 161, 90, 0.16);
  --geo-selected: rgba(201, 161, 90, 0.28);
  --geo-danger: #c9536a;
  --geo-label: var(--navy, #0d283d);
  --geo-shadow: inset 0 2px 5px rgba(13, 40, 61, 0.08);
  display: block;
  width: 100%;
  margin-bottom: 10px;
  text-align: right;
}

.geo-picker--auth {
  --geo-bg: var(--auth-navy, #14243a);
  --geo-text: var(--auth-cream, #f3ead9);
  --geo-muted: var(--auth-muted, #8394ab);
  --geo-border: transparent;
  --geo-accent: var(--auth-gold, #c9a15a);
  --geo-hover: rgba(201, 161, 90, 0.14);
  --geo-selected: rgba(201, 161, 90, 0.26);
  --geo-danger: var(--auth-danger, #e08a95);
  --geo-label: var(--auth-muted, #8394ab);
  --geo-shadow: inset 2px 2px 6px rgba(0, 0, 0, 0.45), inset -2px -2px 6px rgba(255, 255, 255, 0.02);
  margin-bottom: 8px;
}

.geo-picker--calc {
  --geo-bg: var(--navy-soft, #1b3b57);
  --geo-text: #fff;
  --geo-muted: rgba(255, 255, 255, 0.55);
  --geo-border: rgba(224, 177, 131, 0.25);
  --geo-accent: var(--mustard, #c9a15a);
  --geo-hover: rgba(224, 177, 131, 0.14);
  --geo-selected: rgba(224, 177, 131, 0.28);
  --geo-danger: #ff9aa8;
  --geo-label: var(--gold-cream-soft, #e8d5bd);
  --geo-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.35);
  margin-bottom: 22px;
}

.geo-picker .geo-field { margin-bottom: 8px; }
.geo-picker .geo-field:last-child { margin-bottom: 0; }

.geo-picker .geo-label {
  display: block;
  margin: 0 0 6px;
  font-size: 0.83rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--geo-label);
  text-align: right;
}

.geo-picker .geo-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid var(--geo-border);
  border-radius: var(--radius, 12px);
  background: var(--geo-bg);
  color: var(--geo-text);
  font: inherit;
  font-size: 16px; /* زیر ۱۶px مرورگر iOS هنگام فوکوس زوم می‌کند */
  text-align: right;
  cursor: pointer;
  box-shadow: var(--geo-shadow);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.geo-picker .geo-trigger:focus-visible,
.geo-picker .geo-field.is-open .geo-trigger {
  outline: none;
  border-color: var(--geo-accent);
  box-shadow: var(--geo-shadow), 0 0 0 3px rgba(224, 177, 131, 0.22);
}
.geo-picker .geo-trigger:disabled { cursor: not-allowed; opacity: 0.6; }
.geo-picker .geo-trigger-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.geo-picker .geo-trigger-text.is-placeholder { color: var(--geo-muted); }
.geo-picker .geo-chevron {
  flex: none;
  width: 18px;
  height: 18px;
  color: var(--geo-muted);
  transition: transform 0.15s ease;
}
.geo-picker .geo-field.is-open .geo-chevron { transform: rotate(180deg); }

.geo-picker .geo-field.is-invalid .geo-trigger {
  border-color: var(--geo-danger);
  box-shadow: var(--geo-shadow), 0 0 0 2px color-mix(in srgb, var(--geo-danger) 35%, transparent);
}

.geo-picker .geo-panel {
  margin-top: 6px;
  border: 1px solid var(--geo-border);
  border-radius: var(--radius, 12px);
  background: var(--geo-bg);
  overflow: hidden;
}
.geo-picker .geo-panel[hidden] { display: none; }
.geo-picker--auth .geo-panel { border-color: rgba(201, 161, 90, 0.3); }

.geo-picker .geo-search {
  display: block;
  width: 100%;
  margin: 0;
  padding: 11px 14px;
  border: 0;
  border-bottom: 1px solid rgba(131, 148, 171, 0.25);
  border-radius: 0;
  background: transparent;
  color: var(--geo-text);
  font: inherit;
  font-size: 16px;
  box-shadow: none;
}
.geo-picker .geo-search:focus { outline: none; box-shadow: none; border-color: var(--geo-accent); }
.geo-picker .geo-search::placeholder { color: var(--geo-muted); }

.geo-picker .geo-list {
  max-height: 216px;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.geo-picker .geo-option {
  padding: 11px 14px;
  color: var(--geo-text);
  font-size: 0.95rem;
  line-height: 1.5;
  cursor: pointer;
}
.geo-picker .geo-option.is-active { background: var(--geo-hover); }
.geo-picker .geo-option.is-selected { background: var(--geo-selected); font-weight: 700; }
.geo-picker .geo-empty {
  margin: 0;
  padding: 14px;
  color: var(--geo-muted);
  font-size: 0.88rem;
  text-align: center;
}
.geo-picker .geo-empty[hidden] { display: none; }

.geo-legacy-note {
  margin: 0 0 8px;
  font-size: 0.78rem;
  line-height: 1.7;
  color: var(--muted, #6c6759);
}