/*
 * Autana accessibility infrastructure.
 *
 * This layer is intentionally small and visual-system agnostic. It is loaded
 * after each surface stylesheet so shared accessibility guarantees do not
 * depend on a specific vertical or theme.
 */

.sr-only:not(:focus):not(:active) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.autana-skip-link {
    position: fixed;
    top: max(12px, env(safe-area-inset-top));
    left: 12px;
    z-index: 10000;
    max-width: calc(100vw - 24px);
    padding: 12px 16px;
    color: #ffffff;
    background: #102b32;
    border: 2px solid #ffffff;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(8, 29, 51, 0.28);
    font: 700 1rem/1.25 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    text-decoration: none;
    transform: translateY(calc(-100% - 24px - env(safe-area-inset-top)));
    transition: transform 120ms ease-out;
}

.autana-skip-link:focus,
.autana-skip-link:focus-visible {
    color: #ffffff;
    outline: 3px solid #147dce;
    outline-offset: 3px;
    transform: translateY(0);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid #147dce;
    outline-offset: 3px;
}

:where(a, button, input, select, textarea, summary, [tabindex]) {
    scroll-margin-block: 5rem;
}

.customer-pwa :where(a, button, input, select, textarea, summary):focus-visible,
.autana-backoffice :where(a, button, input, select, textarea, summary):focus-visible,
.autana-rider-terminal :where(a, button, input, select, textarea, summary):focus-visible {
    outline: 3px solid #147dce;
    outline-offset: 3px;
}

:where(main, [role="main"])[tabindex="-1"]:focus {
    outline: none;
}

@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

@media (forced-colors: active) {
    .autana-skip-link,
    :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
        outline-color: Highlight;
    }
}

@media print {
    .autana-skip-link {
        display: none !important;
    }
}

.kakike-product-options-trigger {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid currentColor;
    border-radius: 10px;
    color: inherit;
    background: transparent;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.kakike-product-options-dialog {
    width: min(560px, calc(100vw - 32px));
    max-height: min(80vh, 720px);
    padding: 20px;
    overflow: auto;
    border: 0;
    border-radius: 18px;
    color: inherit;
    background: #ffffff;
    box-shadow: 0 24px 80px rgba(8, 29, 51, 0.32);
}

.kakike-product-options-dialog::backdrop {
    background: rgba(8, 29, 51, 0.68);
}

.kakike-product-options-dialog > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.kakike-product-options-dialog > header h2 {
    margin: 0;
    font-size: 1.2rem;
}

.kakike-product-options-close {
    display: inline-grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    place-items: center;
    border: 1px solid #b9c7cf;
    border-radius: 50%;
    background: #ffffff;
    color: #102b32;
    font: 700 1.5rem/1 system-ui, sans-serif;
    cursor: pointer;
}

.table-wrap[role="region"]:focus-visible {
    outline: 3px solid #147dce;
    outline-offset: 3px;
}

.kakike-store-header .demo-stepper {
    position: relative;
    z-index: 1;
}

html:has(body.customer-pwa-checkout) {
    scroll-padding-bottom: calc(8rem + env(safe-area-inset-bottom, 0px));
}

.customer-pwa-checkout :where(a, button, input, select, textarea, summary):focus-visible {
    scroll-margin-bottom: calc(8rem + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 319px) {
    body.customer-pwa-checkout {
        min-width: 0;
    }

    .customer-pwa-checkout .customer-checkout-page.panel {
        padding-inline: 8px;
    }

    .customer-pwa-checkout .customer-checkout-mobile-header {
        grid-template-columns: 40px minmax(0, 1fr) 40px;
        margin-inline: -8px;
    }

    .customer-pwa-checkout .customer-checkout-summary,
    .customer-pwa-checkout .customer-checkout-main,
    .customer-pwa-checkout .au-checkout-form,
    .customer-pwa-checkout .checkout-service-options {
        min-width: 0;
    }

    .customer-pwa-checkout .customer-checkout-summary-content {
        padding-inline: 12px;
    }

    .customer-pwa-checkout .au-checkout-product-actions {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
    }

    .customer-pwa-checkout .au-checkout-product-actions > strong {
        grid-column: 1;
        grid-row: 1;
    }

    .customer-pwa-checkout .au-checkout-product-actions > a {
        grid-column: 2;
        grid-row: 1;
    }

    .customer-pwa-checkout .au-checkout-product-actions > .checkout-item-action {
        grid-column: 1 / -1;
        grid-row: 2;
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    .customer-pwa-checkout .au-checkout-product-actions > form:not(.checkout-item-action) {
        grid-column: 2;
        grid-row: 3;
        justify-self: end;
    }

    .customer-pwa-checkout .customer-checkout-pay-zone {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
        padding: 8px 8px calc(8px + var(--customer-safe-bottom));
    }

    .customer-pwa-checkout .customer-checkout-pay-zone > span {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
    }
}

@media (max-width: 767px) and (max-height: 420px) {
    .customer-pwa-checkout .customer-pwa-shell {
        padding-bottom: calc(24px + var(--customer-safe-bottom));
    }

    .customer-pwa-checkout .customer-checkout-main {
        order: 0;
    }

    .customer-pwa-checkout .customer-checkout-summary {
        order: 1;
    }

    .customer-pwa-checkout .customer-checkout-pay-zone {
        position: static;
        box-shadow: none;
        backdrop-filter: none;
    }
}

@media (forced-colors: active) {
    .kakike-store-status,
    .store-open-pill,
    .availability-pill,
    .au-state-chip {
        border: 1px solid CanvasText;
    }
}