/*
 * Visa detail/overview page — Phase 6. Built only from tokens.css.
 */

.visa-detail {
  padding-top: var(--space-8);
  padding-bottom: var(--space-10);
}

/* Long-form editorial copy (country/visa-type overview, eligibility,
   local SEO sections) — justified edges read as more polished/
   professional at this line length, paired with hyphenation so
   justify doesn't create ugly rivers of whitespace in narrow cards. */
.visa-detail p,
.visa-detail .accordion-body,
.prose {
  text-align: justify;
  hyphens: auto;
}

.visa-detail__header {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  margin-bottom: var(--space-8);
}

.visa-detail__header h1 {
  margin-bottom: var(--space-2);
}

.visa-detail__header .destination-card__flag {
  font-size: 3rem;
}

.visa-spec-grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: 1fr;
  margin-top: var(--space-6);
}

.visa-spec-grid .card p {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--font-size-sm);
}

.visa-detail__verified {
  margin-top: var(--space-6);
  font-size: var(--font-size-sm);
  color: var(--text-muted);
}

@media (min-width: 640px) {
  .visa-spec-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .visa-spec-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Document checklist — the visa detail page's "Required Documents"
   card, and the printable templates page. Checkbox UI is purely a
   personal print/tick-off aid (nothing is submitted or saved), so no
   backend state is needed. */
.document-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
}

.document-checklist__item {
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--border-color);
}

.document-checklist__item:last-child { border-bottom: none; }

.document-checklist__item label {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--text-muted);
  cursor: pointer;
}

.document-checklist__item input[type="checkbox"] {
  margin-top: 3px;
  flex-shrink: 0;
}

@media print {
  .site-header, .site-footer, .enquiry-widget, .button-group, .breadcrumb { display: none !important; }
  .visa-detail { padding-top: 0; }
}