/* Joa Music Cafe controls: reuse the variables defined by the site/theme. */
.joa-booking,
.joa-my-tickets,
.woocommerce,
.woocommerce-page,
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
    --joa-bg: var(--background, #0f0f0f);
    --joa-surface: var(--surface, #352c25);
    --joa-text: var(--text, #e4bc89);
    --joa-muted: var(--muted, #c7b8ab);
    --joa-line: var(--line, #6a6058);
    --joa-accent: var(--accent, #dc6b06);
    --joa-radius: var(--radius, 18px);
}

.joa-booking {
    margin: 0;
    padding: clamp(22px, 4vw, 42px);
    border: 1px solid color-mix(in srgb, var(--joa-line) 70%, transparent);
    border-radius: var(--joa-radius);
    background: rgba(255, 255, 255, .045);
    color: var(--joa-text);
    box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, .28));
}

.joa-booking-title,
.joa-my-tickets > h1,
.joa-admission-group > h2,
.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.wc-block-components-title {
    font-family: 'BebasNeue', sans-serif;
    color: var(--joa-accent);
    letter-spacing: .05em;
}

.joa-booking-title { margin: 0 0 18px; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.joa-booking-availability { margin: 0 0 20px; color: var(--joa-muted); }
.joa-booking-availability span { margin: 0 6px; }
.joa-booking-message,
.joa-booking-success {
    padding: 14px 16px;
    border: 1px solid var(--joa-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .05);
    color: var(--joa-text);
}
.joa-booking-error { border-color: #a54a3c; color: #f2c2b7; background: rgba(165, 74, 60, .13); }
.joa-booking-success { border-color: #4f7f5d; color: #c7e7cf; background: rgba(79, 127, 93, .15); }
.joa-booking-sold-out { font-size: 1.15rem; font-weight: 700; }
.joa-honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

.joa-ticket-type-list { border-top: 1px solid var(--joa-line); }
.joa-ticket-type {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 90px;
    gap: 22px;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--joa-line) 75%, transparent);
}
.joa-ticket-type.is-sold-out { opacity: .55; }
.joa-ticket-type-copy strong { display: block; color: var(--joa-text); font-size: 1.12rem; }
.joa-ticket-type-copy p { margin: 5px 0; color: var(--joa-muted); }
.joa-ticket-type-copy small { display: block; margin-top: 4px; color: var(--joa-muted); }
.joa-ticket-validity { color: var(--joa-accent) !important; font-weight: 700; }
.joa-ticket-type-price { color: var(--joa-accent); font-size: 1.15rem; font-weight: 700; white-space: nowrap; }
.joa-ticket-quantity input { width: 78px; min-height: 44px; text-align: center; }
.joa-type-sold-out { color: var(--joa-muted); font-size: .9rem; font-weight: 700; }

.joa-ticket-summary {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin: 22px 0 12px;
    color: var(--joa-text);
    font-size: 1.15rem;
    font-weight: 700;
}
.joa-ticket-limit-message { margin: 0 0 12px; color: #f0a694; }

.joa-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.joa-form-grid label > span { display: block; margin-bottom: 7px; color: var(--joa-text); font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.joa-consent { display: flex; gap: 10px; align-items: flex-start; margin: 20px 0; color: var(--joa-muted); }
.joa-consent input { margin-top: 4px; }
.joa-consent a { color: var(--joa-accent); }

.joa-booking input[type='text'],
.joa-booking input[type='email'],
.joa-booking input[type='tel'],
.joa-booking input[type='number'],
.joa-booking input[type='date'],
.joa-booking select,
.joa-booking textarea,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .quantity .qty,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.select2-container--default .select2-selection--single,
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-address-form__country .wc-block-components-combobox-control input,
.wc-block-components-form .wc-block-components-textarea {
    min-height: 48px;
    padding: 11px 14px;
    border: 1px solid var(--joa-line) !important;
    border-radius: 10px !important;
    outline: 0;
    background: rgba(255, 255, 255, .055) !important;
    color: var(--joa-text) !important;
    font: inherit;
    box-shadow: none !important;
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.joa-booking input:focus,
.joa-booking select:focus,
.joa-booking textarea:focus,
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce .quantity .qty:focus,
.select2-container--default.select2-container--focus .select2-selection--single,
.wc-block-components-text-input input:focus,
.wc-block-components-combobox .wc-block-components-combobox-control input:focus,
.wc-block-components-form .wc-block-components-textarea:focus {
    border-color: var(--joa-accent) !important;
    background: rgba(255, 255, 255, .08) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--joa-accent) 20%, transparent) !important;
}

.joa-booking input::placeholder,
.woocommerce input::placeholder,
.woocommerce textarea::placeholder,
.wc-block-components-text-input input::placeholder { color: color-mix(in srgb, var(--joa-muted) 68%, transparent) !important; opacity: 1; }

.woocommerce form .form-row label,
.woocommerce-page form .form-row label,
.wc-block-components-text-input label,
.wc-block-components-checkbox__label,
.wc-block-components-radio-control__label,
.wc-block-components-form .wc-block-components-text-input label {
    color: var(--joa-muted) !important;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .045em;
}

.woocommerce form .form-row .required,
.wc-block-components-required { color: var(--joa-accent) !important; }
.joa-booking input[type='checkbox'],
.woocommerce input[type='checkbox'],
.wc-block-components-checkbox input[type='checkbox'] { accent-color: var(--joa-accent); }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--joa-text) !important; line-height: 46px; }
.select2-dropdown { border-color: var(--joa-line) !important; background: var(--joa-surface) !important; color: var(--joa-text); }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--joa-accent) !important; color: var(--joa-bg) !important; }

.joa-booking-button,
.joa-print-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 24px !important;
    border: 1px solid var(--joa-accent) !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--joa-accent) !important;
    font: inherit;
    font-size: .85rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-transform: uppercase;
    letter-spacing: .07em;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.joa-booking-button:hover,
.joa-print-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
    background: var(--joa-accent) !important;
    color: var(--joa-bg) !important;
    transform: translateY(-1px);
}
.joa-booking-button:disabled,
.woocommerce button.button:disabled,
.wc-block-components-button:disabled { opacity: .4; cursor: not-allowed; transform: none; }

/* Native/classic WooCommerce and Checkout Block surfaces. */
.woocommerce table.shop_table,
.woocommerce-cart-form,
.woocommerce .cart_totals,
.woocommerce-checkout-review-order,
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.wc-block-components-order-summary,
.wc-block-checkout__main .wc-block-components-checkout-step,
.wc-block-checkout__sidebar {
    border: 1px solid color-mix(in srgb, var(--joa-line) 70%, transparent) !important;
    border-radius: var(--joa-radius) !important;
    background: rgba(255, 255, 255, .04) !important;
    color: var(--joa-text) !important;
    box-shadow: var(--shadow, 0 10px 30px rgba(0, 0, 0, .18));
}

.woocommerce-cart-form,
.woocommerce .cart_totals,
.woocommerce-checkout-review-order,
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.wc-block-checkout__main .wc-block-components-checkout-step,
.wc-block-checkout__sidebar { padding: clamp(16px, 3vw, 26px); }

.woocommerce table.shop_table th,
.woocommerce table.shop_table td,
.wc-block-cart-items th,
.wc-block-cart-items td,
.wc-block-components-order-summary-item { border-color: color-mix(in srgb, var(--joa-line) 55%, transparent) !important; color: var(--joa-text); }
.woocommerce table.shop_table thead,
.wc-block-cart-items__header { color: var(--joa-muted); text-transform: uppercase; letter-spacing: .06em; }
.woocommerce a,
.woocommerce-page a,
.wp-block-woocommerce-cart a,
.wp-block-woocommerce-checkout a { color: var(--joa-accent); }
.woocommerce .product-name,
.woocommerce .product-name a,
.wc-block-components-product-name { color: var(--joa-text) !important; }
.woocommerce .amount,
.wc-block-components-product-price,
.wc-block-components-totals-item__value { color: var(--joa-accent); font-weight: 700; }
.woocommerce a.remove { color: var(--joa-accent) !important; }
.woocommerce a.remove:hover { background: var(--joa-accent) !important; color: var(--joa-bg) !important; }
.woocommerce-info,
.woocommerce-message,
.woocommerce-error,
.wc-block-components-notice-banner {
    border: 1px solid var(--joa-line) !important;
    border-top-color: var(--joa-accent) !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .05) !important;
    color: var(--joa-text) !important;
}
.woocommerce-info::before,
.woocommerce-message::before { color: var(--joa-accent) !important; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-account .woocommerce-MyAccount-navigation li + li { border-top: 1px solid color-mix(in srgb, var(--joa-line) 55%, transparent); }
.woocommerce-account .woocommerce-MyAccount-navigation a { display: block; padding: 11px 4px; color: var(--joa-muted); text-decoration: none; }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a { color: var(--joa-accent); }

.woocommerce-account .woocommerce-Address-title .edit {
    float: none !important;
    display: block;
    text-align: left;
    margin-top: 8px;
}

.joa-my-tickets { max-width: 1050px; margin: 0 auto; padding: 30px 20px; color: var(--joa-text); }
.joa-admission-group { margin: 34px 0; }
.joa-admission-list { display: grid; gap: 18px; }
.joa-admission-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    overflow: hidden;
    border: 1px solid #d5cec6;
    border-radius: var(--joa-radius);
    background: #fff;
    color: #171411;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
}
.joa-admission-card.is-inactive { opacity: .58; }
.joa-admission-main { padding: 24px; }
.joa-admission-brand { display: flex; gap: 14px; align-items: center; }
.joa-admission-brand img { width: 64px; max-height: 64px; object-fit: contain; }
.joa-admission-brand small { color: #6b625b; text-transform: uppercase; letter-spacing: .08em; }
.joa-admission-brand h3 { margin: 2px 0 0; color: #171411; }
.joa-admission-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 24px; margin: 22px 0; }
.joa-admission-details p { margin: 0; }
.joa-admission-details span { display: block; color: #6b625b; font-size: .85rem; }
.joa-admission-details strong,
.joa-admission-details code { display: block; margin-top: 3px; color: #171411; }
.joa-admission-qr { display: grid; place-items: center; padding: 20px; border-left: 1px dashed #b9b0a8; background: #fff; }
.joa-admission-qr img { width: 200px; height: 200px; object-fit: contain; }
.joa-status { display: inline-block; padding: 4px 10px; border: 1px solid currentColor; border-radius: 999px; background: transparent; font-size: .85rem; font-weight: 700; }
.joa-status--valid,
.joa-status--confirmed { color: #2f7042; }
.joa-status--used,
.joa-status--checked_in { color: #886819; }
.joa-status--cancelled { color: #9f3f31; }

@media (max-width: 700px) {
    .joa-ticket-type { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; }
    .joa-ticket-quantity { grid-column: 1 / -1; }
    .joa-form-grid { grid-template-columns: 1fr; }
    .joa-admission-card { grid-template-columns: 1fr; }
    .joa-admission-qr { border-top: 1px dashed var(--joa-line); border-left: 0; }
    .joa-admission-details { grid-template-columns: 1fr; }
}

@page joa-tickets {
    size: A4 portrait;
    margin: 10mm;
}

@media print {
    html,
    body.joa-printing-tickets {
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        color: #111 !important;
    }

    body.joa-printing-tickets * {
        visibility: hidden !important;
    }

    body.joa-printing-tickets .joa-print-parent {
        position: static !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        background: transparent !important;
    }

    body.joa-printing-tickets .joa-my-tickets,
    body.joa-printing-tickets .joa-my-tickets * {
        visibility: visible !important;
    }

    body.joa-printing-tickets .joa-my-tickets {
        page: joa-tickets;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        color: #111 !important;
    }

    body.joa-printing-tickets .joa-my-tickets > h1,
    body.joa-printing-tickets .joa-my-tickets > .joa-booking-success,
    body.joa-printing-tickets .joa-admission-group > h2,
    body.joa-printing-tickets .joa-print-button {
        display: none !important;
    }

    body.joa-printing-tickets .joa-admission-group,
    body.joa-printing-tickets .joa-admission-list {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.joa-printing-tickets .joa-admission-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 40mm !important;
        box-sizing: border-box !important;

        width: 100% !important;

        height: 65mm !important;
        min-height: 65mm !important;
        max-height: 65mm !important;

        margin: 0 0 3mm !important;

        overflow: hidden !important;
        break-inside: avoid-page !important;
        page-break-inside: avoid !important;

        border: .35mm solid #aaa !important;
        border-radius: 3mm !important;

        background: #fff !important;
        color: #111 !important;
        box-shadow: none !important;
        opacity: 1 !important;
    }

    body.joa-printing-tickets .joa-admission-main {
        box-sizing: border-box !important;
        padding: 4mm !important;
        overflow: hidden !important;
    }

    body.joa-printing-tickets .joa-admission-brand {
        gap: 3mm !important;
    }

    body.joa-printing-tickets .joa-admission-brand img {
        width: 11mm !important;
        max-height: 11mm !important;
    }

    body.joa-printing-tickets .joa-admission-brand small {
        color: #555 !important;
        font-size: 8pt !important;
    }

    body.joa-printing-tickets .joa-admission-brand h3 {
        margin: .5mm 0 0 !important;
        color: #111 !important;
        font-size: 13pt !important;
        line-height: 1.05 !important;
    }

    body.joa-printing-tickets .joa-admission-details {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 2mm 5mm !important;
        margin: 3mm 0 !important;
        font-size: 8.5pt !important;
    }

    body.joa-printing-tickets .joa-admission-details span {
        color: #555 !important;
        font-size: 8pt !important;
    }

    body.joa-printing-tickets .joa-admission-details strong,
    body.joa-printing-tickets .joa-admission-details code {
        color: #111 !important;
        overflow-wrap: anywhere;
    }

    body.joa-printing-tickets .joa-status {
        padding: 1mm 3mm !important;
        font-size: 8pt !important;
    }

    body.joa-printing-tickets .joa-admission-qr {
        box-sizing: border-box !important;
        padding: 3mm !important;
        border-top: 0 !important;
        border-left: .35mm dashed #aaa !important;
        background: #fff !important;
    }

    body.joa-printing-tickets .joa-admission-qr img {
        width: 32mm !important;
        height: 32mm !important;
    }
}
