/*
 * Event Card Style — scoped customer override (TSB-STYLE-B2/B3/B6).
 * Applies only inside .event-presentation-scoped with CSS variables set on that ancestor.
 * Does not affect site header, cart drawer, or pages without the scope class.
 * Footer is included when the layout shell applies .event-presentation-scoped around body + footer.
 * Gallery layout stays on EventDetailsGallery.razor.css — presentation scope changes colors only.
 */
.event-presentation-scoped {
    background-color: var(--event-presentation-bg, var(--mud-palette-background));
    color: var(--event-presentation-text, var(--mud-palette-text-primary));
}

.event-presentation-scoped[data-presentation-scope-source]:not(.event-landing-page--full-bleed):not(.event-landing-page--card-layout) {
    min-height: 100%;
}

.event-presentation-scoped.event-landing-page--full-bleed,
.event-presentation-scoped.event-landing-page--card-layout {
    --mud-palette-background: var(--event-presentation-bg);
    --mud-palette-surface: var(--event-presentation-surface-bg, transparent);
    --mud-palette-text-primary: var(--event-presentation-text);
    --mud-palette-text-secondary: color-mix(in srgb, var(--event-presentation-text) 78%, transparent);
    --mud-palette-text-disabled: color-mix(in srgb, var(--event-presentation-text) 55%, transparent);
}

.event-presentation-scoped.event-landing-page--full-bleed .event-landing-title,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-from-price,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-content-stack,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-sidebar-stack,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-panel,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-sidebar-card,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-expansion,
.event-presentation-scoped.event-landing-page--full-bleed .mud-typography:not(.mud-success-text):not(.mud-button-root) {
    color: var(--event-presentation-text);
}

.event-presentation-scoped.event-landing-page--card-layout .event-landing-title,
.event-presentation-scoped.event-landing-page--card-layout .event-landing-from-price,
.event-presentation-scoped.event-landing-page--card-layout .event-landing-panel,
.event-presentation-scoped.event-landing-page--card-layout .event-landing-sidebar-card,
.event-presentation-scoped.event-landing-page--card-layout .event-landing-expansion,
.event-presentation-scoped.event-landing-page--card-layout .mud-typography:not(.mud-success-text):not(.mud-button-root) {
    color: var(--event-presentation-surface-text, var(--event-presentation-text));
}

.event-presentation-scoped.event-landing-page--full-bleed .event-landing-rich-text,
.event-presentation-scoped.event-landing-page--card-layout .event-landing-rich-text {
    color: var(--event-presentation-surface-text, var(--event-presentation-text)) !important;
}

.event-presentation-scoped .event-landing-rich-text *:not(a) {
    color: inherit !important;
}

.event-presentation-scoped .event-landing-expansion summary,
.event-presentation-scoped .event-landing-expansion summary * {
    color: inherit !important;
}

.event-presentation-scoped .event-landing-title,
.event-presentation-scoped .event-landing-from-price,
.event-presentation-scoped .event-landing-panel .mud-typography,
.event-presentation-scoped .event-landing-sidebar-card .mud-typography:not(.mud-success-text),
.event-presentation-scoped .event-landing-expansion .mud-typography,
.event-presentation-scoped .event-landing-rich-text,
.event-presentation-scoped .booking-wizard-paper .mud-typography:not(.mud-success-text) {
    color: inherit;
}

.event-presentation-scoped .event-landing-panel,
.event-presentation-scoped .event-landing-sidebar-card,
.event-presentation-scoped .event-landing-expansion,
.event-presentation-scoped .event-landing-expansion .mud-expand-panel,
.event-presentation-scoped.event-landing-page--card-layout .mud-paper {
    background: var(--event-presentation-surface-bg, var(--mud-palette-surface)) !important;
    background-color: var(--event-presentation-surface-bg, var(--mud-palette-surface)) !important;
    border: 1px solid color-mix(in srgb, var(--event-presentation-border, var(--event-presentation-text)) 24%, transparent);
    border-radius: var(--bs-radius-lg, 0.75rem);
    box-shadow: none;
    color: inherit;
}

.event-presentation-scoped.event-landing-page--full-bleed .event-landing-panel,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-sidebar-card,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-expansion,
.event-presentation-scoped.event-landing-page--full-bleed .event-landing-expansion .mud-expand-panel {
    border: none;
    border-radius: 0;
}

.event-presentation-scoped:not(.event-landing-page) .booking-wizard-paper {
    background: transparent !important;
    border: none;
    box-shadow: none;
    color: var(--event-presentation-surface-text, inherit);
}

.event-presentation-scoped .booking-ticket-summary {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--event-presentation-surface-text, var(--event-presentation-text, inherit));
    margin-inline: auto;
    max-width: min(100%, 42rem);
    width: fit-content;
}

.event-presentation-scoped .event-landing-info-divider {
    border-color: color-mix(in srgb, var(--event-presentation-border, var(--event-presentation-text)) 24%, transparent);
    opacity: 1;
}

/* Checkout wizard — navigation continue (Næste/Videre/Gå til betaling) */
.event-presentation-scoped [data-testid="checkout-host-step-continue-button"].mud-button-root:not(.mud-disabled),
.event-presentation-scoped .checkout-buyer-info-next-button.mud-button-root:not(.mud-disabled),
.event-presentation-scoped [data-testid="checkout-order-summary-primary-action"].mud-button-root:not(.mud-disabled) {
    background-color: var(--event-presentation-button-bg, var(--mud-palette-secondary)) !important;
    border: 1px solid transparent !important;
    border-radius: var(--bs-radius-pill, 999px);
    color: var(--event-presentation-button-text, var(--mud-palette-secondary-text)) !important;
    font-weight: 700;
    min-height: 3rem;
    text-transform: none;
}

.event-presentation-scoped [data-testid="checkout-host-step-continue-button"].mud-button-root:not(.mud-disabled):hover,
.event-presentation-scoped .checkout-buyer-info-next-button.mud-button-root:not(.mud-disabled):hover,
.event-presentation-scoped [data-testid="checkout-order-summary-primary-action"].mud-button-root:not(.mud-disabled):hover {
    background-color: color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-secondary)) 88%, #000000) !important;
}

.event-presentation-scoped [data-testid="checkout-host-step-continue-button"].mud-button-root.mud-disabled,
.event-presentation-scoped .checkout-buyer-info-next-button.mud-button-root.mud-disabled,
.event-presentation-scoped [data-testid="checkout-order-summary-primary-action"].mud-button-root.mud-disabled {
    background-color: color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-secondary)) 38%, var(--event-presentation-bg, var(--mud-palette-background))) !important;
    border: 1px solid color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-secondary)) 28%, transparent) !important;
    color: color-mix(in srgb, var(--event-presentation-button-text, #ffffff) 45%, transparent) !important;
    opacity: 1;
}

/* Checkout wizard — navigation reset (Nulstil) */
.event-presentation-scoped [data-testid="checkout-host-step-reset-button"].mud-button-root:not(.mud-disabled),
.event-presentation-scoped [data-testid="checkout-order-summary-secondary-action"].mud-button-root:not(.mud-disabled) {
    background-color: transparent !important;
    border: 1px solid color-mix(in srgb, var(--event-presentation-secondary-button-border, var(--event-presentation-text)) 82%, transparent) !important;
    border-radius: var(--bs-radius-pill, 999px);
    color: var(--event-presentation-secondary-button-text, var(--event-presentation-text)) !important;
    font-weight: 700;
    min-height: 3rem;
    text-transform: uppercase;
}

.event-presentation-scoped [data-testid="checkout-host-step-reset-button"].mud-button-root:not(.mud-disabled):hover,
.event-presentation-scoped [data-testid="checkout-order-summary-secondary-action"].mud-button-root:not(.mud-disabled):hover {
    background-color: color-mix(in srgb, var(--event-presentation-text, #ffffff) 8%, transparent) !important;
}

.event-presentation-scoped [data-testid="checkout-host-step-reset-button"].mud-button-root.mud-disabled,
.event-presentation-scoped [data-testid="checkout-order-summary-secondary-action"].mud-button-root.mud-disabled {
    background-color: transparent !important;
    border: 1px solid color-mix(in srgb, var(--event-presentation-secondary-button-border, var(--event-presentation-text)) 28%, transparent) !important;
    color: color-mix(in srgb, var(--event-presentation-secondary-button-text, var(--event-presentation-text)) 42%, transparent) !important;
    opacity: 1;
}

.event-presentation-scoped .event-landing-primary-cta.mud-button-root {
    background-color: var(--event-presentation-button-bg, var(--mud-palette-primary));
    color: var(--event-presentation-button-text, var(--mud-palette-primary-text));
}

.event-presentation-scoped .event-landing-primary-cta.mud-button-root:hover {
    background-color: color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-primary)) 88%, #000000);
}

.event-presentation-scoped.event-landing-page--full-bleed .accepted-payment-method-logo {
    filter: brightness(0) invert(1);
    opacity: 0.92;
}

.event-presentation-scoped .mud-icon-root {
    color: inherit;
}

.event-presentation-scoped .event-landing-rich-text a {
    color: var(--event-presentation-link, var(--event-presentation-button-bg, var(--mud-palette-primary))) !important;
}

/* Checkout wizard — reservation countdown (match ticket summary header text + border) */
.event-presentation-scoped [data-testid="checkout-reservation-countdown"][class*="mud-alert-outlined"] {
    background-color: color-mix(in srgb, var(--event-presentation-text, #ffffff) 2%, transparent);
    border: 1px solid color-mix(in srgb, var(--event-presentation-border, var(--event-presentation-text)) 24%, transparent) !important;
    border-radius: var(--bs-radius-pill, 999px);
    color: var(--event-presentation-text, #ffffff) !important;
    margin-inline: auto;
    max-width: min(100%, 42rem);
    width: fit-content;
}

.event-presentation-scoped [data-testid="checkout-reservation-countdown"] .mud-typography,
.event-presentation-scoped [data-testid="checkout-reservation-countdown"] .mud-icon-root,
.event-presentation-scoped [data-testid="checkout-reservation-countdown"] .mud-alert-icon {
    color: var(--event-presentation-text, #ffffff) !important;
}

/* Checkout wizard — ticket selection spacing */
.event-presentation-scoped [data-testid="timeslot-ticket-step"] {
    padding-bottom: 2rem;
}

/* Checkout wizard — date and timeslot picker */
.event-presentation-scoped [data-testid="timeslot-date-step"] > .mud-stack > .mud-typography:not(.mud-button-root):not(.mud-success-text),
.event-presentation-scoped [data-testid="timeslot-date-step"] > .mud-typography:not(.mud-button-root):not(.mud-success-text) {
    color: var(--event-presentation-surface-text, var(--event-presentation-text, inherit));
}

.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-container,
.event-presentation-scoped .timeslot-date-picker .mud-picker-content,
.event-presentation-scoped .timeslot-date-picker .mud-picker-static {
    background-color: #ffffff;
    color: rgba(0, 0, 0, 0.87);
}

.event-presentation-scoped .timeslot-date-picker .mud-typography:not(.mud-button-root),
.event-presentation-scoped .timeslot-date-picker .mud-button-root:not(:disabled),
.event-presentation-scoped .timeslot-date-picker .mud-icon-button:not(:disabled),
.event-presentation-scoped .timeslot-date-picker .mud-day:not(.mud-selected):not(:disabled),
.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-header,
.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-header-day,
.event-presentation-scoped .timeslot-date-picker .mud-picker-month,
.event-presentation-scoped .timeslot-date-picker .mud-picker-year {
    color: rgba(0, 0, 0, 0.87) !important;
}

/* MudBlazor 9.x disables unavailable dates via the native disabled attribute, not .mud-disabled */
.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-day:disabled,
.event-presentation-scoped .timeslot-date-picker .mud-day:disabled {
    color: rgba(0, 0, 0, 0.38) !important;
    background-color: transparent !important;
    cursor: default;
}

/* Highlight selectable dates so they are visible without hover */
.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-day:not(:disabled):not(.mud-selected) {
    background-color: color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-primary)) 10%, transparent);
    font-weight: 600;
}

.event-presentation-scoped .timeslot-date-picker .mud-picker-calendar-day:not(:disabled):not(.mud-selected):hover,
.event-presentation-scoped .timeslot-date-picker .mud-day:not(:disabled):not(.mud-selected):hover {
    background-color: color-mix(in srgb, var(--event-presentation-button-bg, var(--mud-palette-primary)) 16%, transparent);
}

.event-presentation-scoped .timeslot-date-picker .mud-day.mud-selected {
    background-color: var(--event-presentation-button-bg, var(--mud-palette-primary)) !important;
    color: var(--event-presentation-button-text, #ffffff) !important;
}

.event-presentation-scoped [data-testid^="timeslot-slot-option-"] .mud-paper {
    background-color: #ffffff !important;
    color: rgba(0, 0, 0, 0.87);
}

.event-presentation-scoped [data-testid^="timeslot-slot-option-"] .mud-typography:not(.mud-success-text),
.event-presentation-scoped [data-testid^="timeslot-slot-option-"] .mud-radio.mud-primary .mud-radio-content {
    color: rgba(0, 0, 0, 0.87) !important;
}

.event-presentation-scoped [data-testid^="timeslot-slot-option-"] .mud-radio.mud-primary.mud-checked .mud-radio-content {
    color: var(--event-presentation-button-bg, var(--mud-palette-primary));
}

.event-presentation-scoped [data-testid^="timeslot-slot-option-"] .mud-radio.mud-primary.mud-checked .mud-icon-root {
    color: var(--event-presentation-button-bg, var(--mud-palette-primary)) !important;
}

.event-presentation-scoped .checkout-order-summary-sidebar-payment-methods .accepted-payment-method-logo {
    filter: brightness(0) invert(1);
    opacity: 0.92;
}

.event-presentation-scoped .app-site-footer.mud-paper {
    background-color: var(--event-presentation-surface-bg, var(--event-presentation-bg, var(--mud-palette-background))) !important;
    color: var(--event-presentation-surface-text, var(--event-presentation-text, var(--mud-palette-text-primary)));
}

.event-presentation-scoped .app-site-footer .mud-typography:not(.brand-primary):not(.brand-secondary) {
    color: inherit;
}

.event-presentation-scoped .app-site-footer .brand-primary {
    color: var(--event-presentation-link, var(--event-presentation-button-bg, #9fd356));
}

.event-presentation-scoped .app-site-footer .brand-secondary {
    color: var(--event-presentation-surface-text, var(--event-presentation-text, #ffffff));
}

.event-presentation-scoped .app-site-footer .mud-link {
    color: var(--event-presentation-link, var(--event-presentation-text, inherit));
}

.event-presentation-scoped .app-site-footer .mud-link:hover {
    color: color-mix(in srgb, var(--event-presentation-link, var(--event-presentation-text)) 82%, #ffffff);
}

.event-presentation-scoped .app-site-footer .mud-divider {
    border-color: color-mix(in srgb, var(--event-presentation-border, var(--event-presentation-text)) 24%, transparent);
    opacity: 1;
}
