/*
 * "Objednávka na úhradu" — only what booking-v2 does not already provide.
 *
 * The grid, the card, the summary rail, the checkbox and the button all reuse
 * .booking-v2 classes, so this file stays small on purpose. Scoped under
 * .slb-pay because inc/enqueue.php globs every stylesheet onto every page.
 */

/* A section of the main card, not a card inside it: the summary rail on
   the right is already the only boxed element on this page. */
.slb-pay .slb-pay__terms-extract {
    padding: 0;
    border: 0;
    background: none;
}

.slb-pay .slb-pay__terms-extract h2 {
    margin: 0 0 0.6rem;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* Key/value rows, matching the summary rail rather than a bullet list. */
.slb-pay .slb-pay__terms-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.92rem;
    line-height: 1.55;
}

.slb-pay .slb-pay__terms-table th,
.slb-pay .slb-pay__terms-table td {
    padding: 0.5rem 0;
    text-align: left;
    vertical-align: top;
    border-top: var(--hairline-w) dashed var(--line);
}

.slb-pay .slb-pay__terms-table tr:first-child th,
.slb-pay .slb-pay__terms-table tr:first-child td {
    border-top: 0;
    padding-top: 0;
}

.slb-pay .slb-pay__terms-table th {
    width: 38%;
    padding-right: 1rem;
    font-weight: 500;
    color: var(--mute);
    white-space: nowrap;
}

.slb-pay .slb-pay__terms-table td {
    color: var(--ink);
}

@media (max-width: 560px) {
    .slb-pay .slb-pay__terms-table th,
    .slb-pay .slb-pay__terms-table td {
        display: block;
        width: auto;
        white-space: normal;
    }
    .slb-pay .slb-pay__terms-table td { padding-top: 0; }
    .slb-pay .slb-pay__terms-table tr + tr th { border-top: var(--hairline-w) dashed var(--line); }
}

.slb-pay .slb-pay__form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0;
}

/* The consent sits alone here, so it needs no fieldset chrome of its own. */
.slb-pay .booking-v2__fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.slb-pay .slb-pay__fallback {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.6;
    color: var(--mute);
}



/* --------------------------------------------------------------------- *
 * One full-width column.
 * --------------------------------------------------------------------- */

.slb-pay .booking-v2__grid--single {
    grid-template-columns: minmax(0, 1fr);
}

/* GeneratePress draws a full grid on every table: table{border-width:1px 0 0 1px}
   plus th,td{border-width:0 1px 1px 0} and th{border:1px solid rgba(0,0,0,.1)}.
   Wipe it here, before our own rules add back only the lines we want. */
.slb-pay .slb-pay__items,
.slb-pay .slb-pay__recap,
.slb-pay .slb-pay__items th,
.slb-pay .slb-pay__items td,
.slb-pay .slb-pay__recap th,
.slb-pay .slb-pay__recap td {
    margin: 0;
    border: 0;
    background: none;
}

/* --------------------------------------------------------------------- *
 * Order detail.
 *
 * Deliberately a copy of the ticket e-mail's own treatment, value for
 * value, so the customer sees the same document twice: white cards on a
 * 1px #E3DED0 hairline, a small grey uppercase eyebrow, no colour washes,
 * and a plain rule under the table head instead of a filled header row.
 * The e-mail's figures are in templates/emails/ticket.php.
 * --------------------------------------------------------------------- */

.slb-pay .slb-pay__leg,
.slb-pay .slb-pay__card {
    margin: 0 0 0.75rem;
    padding: 1rem 1.25rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 4px;
}

.slb-pay .slb-pay__leg-title {
    margin: 0 0 0.375rem;
    font-size: 0.6875rem;
    font-weight: 400;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute);
}

.slb-pay .slb-pay__leg-route {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--ink);
}

.slb-pay .slb-pay__leg-when {
    margin: 0.25rem 0 0.375rem;
    font-size: 0.8125rem;
    color: var(--graphite);
}

.slb-pay .slb-pay__leg-stop {
    margin: 0.125rem 0 0;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: var(--graphite);
}

.slb-pay .slb-pay__leg-stop strong {
    color: var(--ink);
    font-weight: 700;
}

.slb-pay .slb-pay__card-title {
    margin: 0 0 0.5rem;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--ink);
}

/* Wide table scrolls inside its own box; the page never scrolls sideways. */
.slb-pay .slb-pay__table-scroll {
    overflow-x: auto;
}

.slb-pay .slb-pay__items {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
    line-height: 1.45;
}

.slb-pay .slb-pay__items thead th {
    padding: 0.5rem 0.375rem;
    border-bottom: 1px solid var(--line);
    font-size: 0.65625rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--mute);
    text-align: left;
    white-space: nowrap;
}

.slb-pay .slb-pay__items tbody td {
    padding: 0.625rem 0.375rem;
    vertical-align: top;
    border-bottom: 1px solid var(--line-soft);
    color: var(--ink);
}

.slb-pay .slb-pay__items tbody tr:last-child td {
    border-bottom: 0;
}

.slb-pay .slb-pay__items .is-label {
    font-weight: 600;
}

.slb-pay .slb-pay__items .is-mid {
    text-align: center;
    white-space: nowrap;
    font-weight: 600;
}

.slb-pay .slb-pay__items .is-num {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.slb-pay .slb-pay__items .is-vat {
    color: var(--graphite);
    font-weight: 400;
}

.slb-pay .slb-pay__items .is-strong {
    font-weight: 700;
}

.slb-pay .slb-pay__item-note {
    display: block;
    margin-top: 0.0625rem;
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1.45;
    color: var(--mute);
}

/* Recapitulation — full width of its card, label left, figure right. */
.slb-pay .slb-pay__recap {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
    line-height: 1.5;
}

.slb-pay .slb-pay__recap th,
.slb-pay .slb-pay__recap td {
    padding: 0.1875rem 0;
    text-align: left;
}

.slb-pay .slb-pay__recap th {
    font-weight: 400;
    color: var(--graphite);
}

.slb-pay .slb-pay__recap td {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--ink);
}

.slb-pay .slb-pay__recap .is-sub th,
.slb-pay .slb-pay__recap .is-sub td {
    padding-top: 0.375rem;
    border-top: 1px dashed var(--line);
}

.slb-pay .slb-pay__recap .is-total th,
.slb-pay .slb-pay__recap .is-total td {
    padding-top: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--ink);
}

/* Sits directly under the recapitulation card, as in the ticket e-mail.
   .slb-pay__after is gone from the markup, so the selector goes with it. */
.slb-pay .slb-pay__vat-note {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    line-height: 1.5;
    color: var(--mute);
}

@media (max-width: 560px) {
    .slb-pay .slb-pay__leg,
    .slb-pay .slb-pay__card { padding: 0.875rem 1rem; }
    .slb-pay .slb-pay__items .is-vat { display: none; }
}
