/* راه پلاس — افزوده‌های اختصاصی روی پوستهٔ ui-kit (فقط از توکن‌های پوسته استفاده می‌شود) */

/* بخش‌های عمومی */
.page { padding-top: 28px; padding-bottom: 20px; }
.page-narrow { max-width: 560px; margin-inline: auto; }
.page-mid { max-width: 860px; margin-inline: auto; }
.hero-search { margin-top: 22px; padding: 14px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: end; }
.hero-search .field { margin: 0; }
.search-bar { padding: 14px; display: grid; grid-template-columns: 1fr 1fr 170px auto; gap: 10px; align-items: end; margin-bottom: 18px; }
.empty { padding: 26px 18px; text-align: center; color: var(--muted); }
.empty b { color: var(--ink); display: block; margin-bottom: .3rem; }
.board-empty { padding: 22px 10px; text-align: center; color: #8fa3b8; font-size: .9rem; }
.board-empty a { color: var(--primary); font-weight: 700; }
.board-foot { display: flex; justify-content: space-between; padding: 10px 6px 0; font-size: .8rem; color: #8fa3b8; }
.board-foot a { color: var(--primary); font-weight: 700; }
.c-route { font-weight: 700; }
.fare-note { color: var(--muted); font-size: .85rem; margin-top: 8px; }
.price .p-val small { font-family: var(--font); font-size: .8rem; color: var(--muted); }
.price:hover { border-color: var(--primary); }
.hubs { display: flex; flex-wrap: wrap; gap: 8px; }

/* کارت سفر / بار */
.card { padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.card + .card { margin-top: 12px; }
.card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.route { display: inline-flex; align-items: center; gap: .45rem; font-weight: 800; font-size: 1.05rem; flex-wrap: wrap; }
.route .bi-arrow-left { color: var(--primary); }
.meta { display: flex; flex-wrap: wrap; gap: 2px 14px; color: var(--muted); font-size: .85rem; }
.meta i { margin-inline-end: .25rem; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip-on { background: var(--primary-soft); color: color-mix(in srgb, var(--primary) 70%, #000); }
.chip-warn { background: var(--warn-soft); color: var(--warn); }
.chip-ok { background: var(--ok-soft); color: var(--ok); }
.fare { font-family: var(--font-display); font-weight: 400; font-size: 1.6rem; line-height: 1.2; }
.fare small { font-family: var(--font); font-size: .8rem; color: var(--muted); }
.card-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: space-between; border-top: 1px dashed var(--line); padding-top: 10px; }
.inline-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.inline-form input, .inline-form select { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .45rem .7rem; background: var(--surface); width: 9.5rem; }
.code-box { display: block; margin-top: 4px; font-family: var(--font-display); font-size: 1.8rem; letter-spacing: .3rem; direction: ltr; display: inline-block; }
.contact { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; font-size: .88rem; }
.contact > div { background: var(--surface-2); border-radius: var(--radius-sm); padding: 10px 12px; }
.contact b { display: block; }
.ltr-num { direction: ltr; unicode-bidi: embed; }

/* توقف‌های مسیر و پرشدگی */
.stops { position: relative; padding: 14px 18px; }
.stops li { position: relative; padding: 4px 0; padding-inline-start: 26px; font-size: .9rem; }
.stops li::before { content: ""; position: absolute; inset-inline-start: 7px; top: 0; bottom: 0; border-inline-start: 3px dotted var(--line); }
.stops li::after { content: ""; position: absolute; inset-inline-start: 2px; top: 11px; width: 13px; height: 13px; border-radius: 3px; background: var(--surface); border: 3px solid var(--muted); }
.stops li:first-child::before { top: 14px; }
.stops li:last-child::before { bottom: calc(100% - 14px); }
.stops li.end::after { background: var(--ink); border-color: var(--ink); }
.stops li.hit::after { background: var(--primary); border-color: var(--primary); }
.stops small { color: var(--muted); }
.loads { padding: 0 18px 16px; display: flex; flex-direction: column; gap: 8px; }
.load-row { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; font-size: .82rem; }
.load-bar { grid-column: 1 / -1; height: 8px; background: var(--surface-2); border-radius: 2px; overflow: hidden; }
.load-bar i { display: block; height: 100%; width: var(--w); background: var(--primary); }
.load-bar.full i { background: var(--danger); }

/* رهگیری */
.timeline { padding: 16px 18px; }

/* فرم */
.form-sec + .form-sec { margin-top: 18px; }
.form-sec > h2 { font-family: var(--font-display); font-weight: 400; font-size: 1.25rem; margin-bottom: 12px; }
.fields-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 16px; }
.presets { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 14px; font-size: .85rem; }
.checks { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .88rem; }
.checks label { display: inline-flex; gap: .35rem; align-items: center; font-weight: 500; }
.estimate { background: var(--board, var(--ink)); color: #e7eef5; border-radius: var(--radius); padding: 16px 18px; margin-bottom: 14px; }
.estimate .fare { color: #fff; }
.estimate small, .estimate .muted { color: #8fa3b8; }
.otp { text-align: center; letter-spacing: .5rem; font-size: 1.6rem; font-weight: 800; direction: ltr; }
.big-input { text-align: center; direction: ltr; font-size: 1.15rem; }
.field input[type="file"] { padding: .45rem; }
.switch { margin-top: 4px; }

/* Tom Select هماهنگ با فیلدهای پوسته */
.field .ts-wrapper { width: 100%; }
.ts-control { border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; padding: .55rem .8rem !important; background: var(--surface) !important; box-shadow: none !important; font-size: .95rem; min-height: 44px; }
.ts-wrapper.focus .ts-control { border-color: var(--primary) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent) !important; }
.ts-dropdown { border-radius: var(--radius-sm); border-color: var(--line); font-size: .92rem; }
.ts-dropdown .active { background: var(--primary-soft); color: var(--ink); }
.ts-dropdown .option small { color: var(--muted); }
.ts-wrapper.multi .ts-control > div { background: var(--primary-soft); color: var(--ink); border-radius: 3px; }

.foot-links { display: flex; gap: 16px; flex-wrap: wrap; font-size: .88rem; margin-top: 10px; }
.foot-links a:hover { color: #fff; }

@media (max-width: 900px) {
  .hero-search, .search-bar { grid-template-columns: 1fr 1fr; }
  .hero-search .btn, .search-bar .btn { grid-column: 1 / -1; }
  .fields-3 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .hero-search, .search-bar, .contact, .fields-3 { grid-template-columns: 1fr; }
  .inline-form input { width: 100%; flex: 1; }
}

/* تابلوی حرکت: ستون مسیر پهن‌تر */
.rp .flap-row { grid-template-columns: 2.1fr 1.15fr .95fr 1fr .9fr; }
@media (max-width: 760px) { .rp .flap-row { grid-template-columns: 2fr 1fr 1fr; } }
@media (max-width: 520px) { .rp .flap-row { grid-template-columns: 1.7fr 1fr; } }

/* شهرهای کوچک سر راه: پیش‌فرض جمع */
.stops.compact li.minor { display: none; }
.stops li.minor b { font-weight: 500; }

/* پلاک ایران (نمایش و ورود) */
.plate { display: inline-flex; align-items: stretch; border: 2px solid #111; border-radius: 6px; background: #fff; color: #111; font-weight: 800; overflow: hidden; line-height: 1; vertical-align: middle; direction: ltr; }
.plate-flag { background: #1f4ea8; color: #fff; font-size: .5rem; font-weight: 700; padding: 4px 4px; display: flex; align-items: flex-end; text-align: center; font-family: system-ui, sans-serif; }
.plate-main { display: inline-flex; align-items: center; gap: .35rem; padding: 4px 8px; font-size: 1.05rem; }
.plate-main b { font-weight: 800; }
.plate-region { border-inline-start: 2px solid #111; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2px 7px; font-size: 1rem; }
.plate-region small { font-size: .55rem; font-weight: 600; }
.plate-input { width: 100%; max-width: 400px; }
.plate-input .plate-main { flex: 1; min-width: 0; gap: 5px; padding: 6px; }
.field .plate-input input, .field .plate-input select { border: 1px solid var(--line); border-radius: 4px; padding: .45rem .2rem; text-align: center; font-weight: 800; font-size: 1.05rem; background: #fff; min-width: 0; }
.field .plate-input .plate-main input { flex: 2 1 0; width: 0; }
.field .plate-input .plate-main input + select + input { flex: 3 1 0; }
.field .plate-input .plate-main select { flex: 2.6 1 0; width: 0; text-align-last: center; }
.field .plate-input .plate-region { padding: 2px 5px; }
.field .plate-input .plate-region input { width: 3rem; margin-top: 2px; }