/* Visa help (/visa-help/<country>, the pack) and Gift a trip (/gift), 2026-10-28.
   Built on et-blocks.css; brand tokens only. Prefix .vg-. */
.vg-page .et-crumbs { margin-bottom: 12px; }
.vg-page .to-layout { margin-top: 4px; }
.vg-page .to-form { min-width: 0; }
.vg-page .eb-card > h2 { margin: 0; }
.vg-page .eb-card__head > div { min-width: 0; }
.vg-page .eb-card__head h2 { font-size: 1.08rem; margin: 0; }
.vg-page .eb-card .form-grid { margin-bottom: 0; gap: 14px; }
.vg-page .to-form h2 + .form-grid { margin-bottom: 0; }

/* Labels with an icon, inside the shared .f-field */
.vg-page .f-field label.eb-label { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 7px; }
.vg-page .f-field label.eb-label .to-opt { margin: 0; font-weight: 400; color: var(--eb-muted); font-size: .8rem; }
.vg-page .eb-card .form-grid { align-items: end; }
.vg-page .f-field label.to-check { display: flex; align-items: flex-start; gap: 10px; padding: 12px; border-radius: 12px; background: var(--eb-soft); font-weight: 500; line-height: 1.4; }
.vg-page .f-field label.to-check input { width: 18px; height: 18px; margin: 2px 0 0; flex: none; accent-color: var(--eb-blue); }
.vg-page .f-field--wide { grid-column: 1 / -1; }

/* Facts row: allow long processing lines */
.vg-page .eb-facts li { align-items: flex-start; }
.vg-page .eb-facts .eb-ico { width: 34px; height: 34px; border-radius: 10px; background: #fff; }
.vg-page .eb-facts .eb-ico .et-i { width: 17px; height: 17px; }
.vg-page .eb-facts b { font-size: .88rem; line-height: 1.3; }

/* The submit block */
.vg-submit .et-btn { width: 100%; justify-content: center; display: inline-flex; align-items: center; gap: 8px; }
.vg-submit .to-fine { margin: 0 0 14px; }
div.vg-submit { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--eb-line); }
@media (min-width: 861px) { .vg-submit .et-btn { width: auto; } }

/* Side cards */
.vg-page .to-side .pg-card { box-shadow: var(--eb-sh); }
.vg-page .tp-table--fees { width: 100%; }
.vg-page .tp-table--fees td, .vg-page .tp-table--fees th { overflow-wrap: break-word; }
/* In the narrow side card: label + price on one line, the note under it */
.vg-page .to-side .tp-table--fees tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--eb-line); }
.vg-page .to-side .tp-table--fees th, .vg-page .to-side .tp-table--fees td { padding: 0; border: 0; text-align: left; }
.vg-page .to-side .tp-table--fees td:first-of-type { font-weight: 800; color: var(--eb-blue); white-space: nowrap; }
.vg-page .to-side .tp-table--fees td:last-child { grid-column: 1 / -1; color: var(--eb-muted); font-size: .82rem; }
.vg-portal { display: flex; gap: 10px; align-items: center; padding: 12px; margin: 12px 0; border-radius: 12px; background: var(--eb-blue-soft); color: var(--eb-ink); font-size: .88rem; line-height: 1.4; }
.vg-portal .et-i { width: 18px; height: 18px; color: var(--eb-blue); flex: none; }
.vg-portal a { color: var(--eb-blue); font-weight: 700; overflow-wrap: anywhere; }

/* Pack: the copy table and the portal button */
.vg-page .to-pack { width: 100%; table-layout: fixed; }
.vg-page .to-pack th { width: 42%; }
.vg-page .to-pack td { font-weight: 700; overflow-wrap: anywhere; }
.vg-page .to-pack__email { width: 100%; max-width: 100%; box-sizing: border-box; font-size: .85rem; border-radius: 12px; }
.vg-page .eb-card .et-btn { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; overflow-wrap: anywhere; }
.vg-page .tv-steps { margin-bottom: 12px; }

/* Gift: how it works, numbered in blue */
.vg-page .to-steps { counter-reset: vg; }
.vg-page .to-steps li { counter-increment: vg; }
.vg-page .to-steps li::before { content: counter(vg); flex: 0 0 26px; height: 26px; border-radius: 50%; background: var(--eb-blue); color: #fff;
                                display: inline-flex; align-items: center; justify-content: center; font-size: .82rem; font-weight: 800; }
.vg-photo { display: block; aspect-ratio: 16 / 9; border-radius: 14px; margin: 0 0 14px; background: var(--eb-soft) var(--eb-img, none) center / cover no-repeat; }
.vg-page .eb-chips.vg-chips { margin: 0 0 16px; }
