/* ==========================================================================
   targmnadamowmebit.ge - Document Route Checker (/dokumentis-marshruti/)
   Loaded after style.css and subpage.css; reuses their tokens, .field,
   .check, .btn and .glass.
   ========================================================================== */

.route #route-app { display: grid; gap: var(--s-4); margin-top: var(--s-4); }
.route #route-app:empty { min-height: 480px; }

.route__form { display: grid; gap: var(--s-3); padding: var(--s-4); border-radius: var(--radius-lg); }

.route__dir { display: grid; gap: .5rem; margin: 0; padding: 0; border: 0; }
.route__dir legend { padding: 0; margin-bottom: .5rem; }
.route__dir-option {
  display: flex; align-items: center; gap: .65rem; padding: .7rem .9rem;
  border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer;
}
.route__dir-option:has(input:checked) { border-color: var(--blue); background: rgba(61,123,255,.1); }
.route__dir-option input { accent-color: var(--blue); flex: none; }

.route__prompt { color: var(--text-dim); }

.route__card { display: grid; gap: var(--s-3); padding: var(--s-4); border-radius: var(--radius-lg); }
.route__badge {
  justify-self: start; padding: .3rem .8rem; border-radius: 999px;
  font-size: var(--t-sm); font-weight: 600; background: rgba(61,123,255,.18); color: var(--text);
}
.route__badge--legalization, .route__badge--check { background: rgba(255,163,130,.2); }
.route__title { font-size: var(--t-lg); }

.route__steps { display: grid; gap: var(--s-2); counter-reset: route; }
.route__step {
  counter-increment: route; position: relative; display: grid; gap: .3rem;
  padding: .9rem 1rem .9rem 3.1rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: rgba(245,243,239,.03);
}
.route__step::before {
  content: counter(route); position: absolute; left: .9rem; top: .9rem;
  width: 1.6rem; height: 1.6rem; display: grid; place-items: center; border-radius: 50%;
  background: var(--ink-600); color: var(--text); font-size: var(--t-xs); font-weight: 600;
}
.route__step--us::before { background: var(--blue); }
.route__step-title { font-size: var(--t-base); }
.route__step p { color: var(--text-dim); font-size: var(--t-sm); }
.route__meta { display: flex; flex-wrap: wrap; gap: .25rem .9rem; font-size: var(--t-xs) !important; color: var(--muted) !important; }
.route__who { color: var(--peach); font-weight: 600; }

.route__total { font-size: var(--t-base); }
.route__notes { display: grid; gap: .5rem; }
.route__note {
  padding: .6rem .9rem; border-left: 3px solid var(--line);
  color: var(--text-dim); font-size: var(--t-sm);
}
.route__note--warn { border-left-color: var(--peach); color: var(--text); background: rgba(255,163,130,.08); }
.route__cta-lead { font-weight: 500; }
.route__cta { display: flex; flex-wrap: wrap; gap: .6rem; }
.route__fineprint { color: var(--muted); font-size: var(--t-xs); }
.route__noscript { color: var(--text-dim); margin-top: var(--s-3); }

@media (max-width: 599px) {
  .route__form, .route__card { padding: var(--s-3); }
  .route__cta .btn { flex: 1 1 100%; text-align: center; }
}