/*
 * DF Ticketseite Design 7.0
 * Visual direction based on the supplied DF Event Concept reference:
 * dark cinematic blue background, blue light waves, glass-like booking card.
 */

/* =========================================================
   PAGE / BACKGROUND
   ========================================================= */

:root {
    --df-bg: #031d36;
    --df-bg-2: #062f58;
    --df-panel: rgba(3, 25, 46, .90);
    --df-panel-2: rgba(5, 38, 68, .78);
    --df-line: rgba(72, 171, 255, .55);
    --df-blue: #087fe8;
    --df-blue-2: #0066d0;
    --df-text: #fff;
    --df-muted: #d3e0ea;
    --df-gold: #e1a83a;
}

/* Full browser-width background; The7 remains responsible for content width. */
html,
body.single-product {
    background: #fff !important;
    min-height: 100%;
}

/* Normal page background is white. Only the booking panel is blue. */

/* Never alter The7 content width. */
body.single-product #main,
body.single-product .main-container,
body.single-product .page-inner,
body.single-product .page-content,
body.single-product .content-wrap,
body.single-product .wf-wrap,
body.single-product .wf-container,
body.single-product .content {
    background: transparent !important;
}

/* Product text colours are intentionally not controlled by this plugin. */

/* =========================================================
   TICKET BOOKING CARD
   ========================================================= */

.single-product .summary.entry-summary form.df-ticket-cart-form {
    position: relative;
    z-index: 2;
    box-sizing: border-box;
    width: 100%;
    margin-top: 28px !important;
    padding: 18px 22px 20px !important;
    border: 1px solid rgba(66,167,245,.65) !important;
    border-radius: 5px !important;
    background: linear-gradient(
        145deg,
        rgba(2,29,52,.96),
        rgba(2,22,40,.92)
    ) !important;
    box-shadow:
        0 14px 40px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.04);
}

/* Header */
.df-ticket-booking-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 14px;
}

.df-ticket-booking-title {
    color: #fff;
    font-size: 32px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -.5px;
}

.df-ticket-reset-holder {
    display: block;
    flex: 0 0 auto;
}

.df-ticket-reset-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 155px;
    min-height: 42px;
    box-sizing: border-box;
    padding: 7px 18px !important;
    border: 1px solid rgba(255,255,255,.65) !important;
    border-radius: 4px !important;
    background: transparent !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 15px !important;
    font-weight: 600;
}

/* =========================================================
   STEP BOXES
   ========================================================= */

.df-ticket-price-step,
.df-ticket-seat-step {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 10px !important;
    padding: 14px 16px 15px !important;
    border: 1px solid rgba(57,157,236,.55) !important;
    border-radius: 5px !important;
    background: linear-gradient(
        180deg,
        rgba(3,39,70,.82),
        rgba(2,28,50,.90)
    ) !important;
}

.df-ticket-step-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 10px;
}

.df-ticket-step-number {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    line-height: 48px;
    border-radius: 50%;
    background: linear-gradient(180deg, #1495ff, #0873dc);
    color: #fff;
    text-align: center;
    font-size: 27px;
    font-weight: 800;
    box-shadow: 0 4px 14px rgba(0,112,230,.30);
}

.df-ticket-step-copy {
    display: block;
}

.df-ticket-step-copy strong {
    display: block;
    color: #fff !important;
    font-size: 22px;
    line-height: 1.05;
    font-weight: 800;
}

.df-ticket-step-copy small {
    display: block;
    margin-top: 4px;
    color: var(--df-muted) !important;
    font-size: 13px;
    line-height: 1.25;
}

/* Price select */
.df-ticket-price-select {
    display: block !important;
    width: 100% !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 48px 0 18px !important;
    border: 1px solid rgba(255,255,255,.72) !important;
    border-radius: 4px !important;
    background: #061e35 !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 600 !important;
}

/* Seat button */
.df-ticket-seat-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 56px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 10px 20px !important;
    border: 1px solid #1597ff !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, #0b8cf2, #006ad5) !important;
    color: #fff !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    box-shadow: 0 5px 18px rgba(0,87,190,.25);
}

.df-ticket-seat-button:hover {
    background: linear-gradient(180deg, #18a0ff, #087be4) !important;
    color: #fff !important;
}

/* Remove confusing (0) */
.df-ticket-seat-button {
    white-space: nowrap;
}

/* =========================================================
   QUANTITY + CART
   ========================================================= */

.single-product .summary.entry-summary .df-ticket-cart-form .quantity {
    float: left !important;
    margin: 8px 12px 0 0 !important;
}

.single-product .summary.entry-summary .df-ticket-cart-form .quantity input {
    min-height: 52px !important;
}

.single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    width: calc(100% - 92px) !important;
    min-height: 54px !important;
    box-sizing: border-box !important;
    margin-top: 8px !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, #9aadc0, #6d8093) !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
}

.single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button:hover {
    background: linear-gradient(180deg, #aec0d0, #8194a7) !important;
}

/* Clear floats */
.single-product .summary.entry-summary .df-ticket-cart-form:after {
    content: "";
    display: table;
    clear: both;
}


/* =========================================================
   TICKET BOTTOM ROW – STOCK / QUANTITY / CART
   Matches the reference proportions.
   ========================================================= */

.df-ticket-cart-bottom {
    display: grid !important;
    grid-template-columns: clamp(95px, 9%, 125px) clamp(190px, 22%, 270px) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 28px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-top: 18px !important;
}

.df-ticket-cart-bottom .df-ticket-stock {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 24px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

.df-ticket-cart-bottom .df-ticket-quantity {
    float: none !important;
    display: grid !important;
    grid-template-columns: 1fr 1.15fr 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.72) !important;
    border-radius: 5px !important;
    overflow: hidden !important;
    background: #061e35 !important;
}

.df-ticket-cart-bottom .df-ticket-quantity .minus,
.df-ticket-cart-bottom .df-ticket-quantity .plus,
.df-ticket-cart-bottom .df-ticket-quantity input.qty {
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 25px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

.df-ticket-cart-bottom .df-ticket-quantity .minus,
.df-ticket-cart-bottom .df-ticket-quantity .plus {
    cursor: pointer;
}

.df-ticket-cart-bottom .df-ticket-quantity input.qty {
    border-left: 1px solid rgba(255,255,255,.35) !important;
    border-right: 1px solid rgba(255,255,255,.35) !important;
}

.df-ticket-cart-bottom .df-ticket-add-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 58px !important;
    height: 58px !important;
    margin: 0 !important;
    padding: 0 22px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 5px !important;
    background: linear-gradient(180deg, #879db4, #6d839a) !important;
    color: #fff !important;
    font-size: 19px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.df-ticket-cart-bottom .df-ticket-add-button:hover {
    background: linear-gradient(180deg, #9bb0c4, #7e93a7) !important;
}

/* =========================================================
   BOOKING AREA: BLUE + CLEAR GAP BEFORE CART BUTTON
   ========================================================= */

.single-product .summary.entry-summary form.df-ticket-cart-form {
    background: linear-gradient(145deg, #052f58, #031f3b) !important;
}

/* Quantity gets its own line and sufficient space below it. */
.single-product .summary.entry-summary .df-ticket-cart-form .quantity {
    float: none !important;
    display: inline-flex !important;
    margin: 10px 0 16px 0 !important;
}

/* Cart button is below the quantity selector and spans the booking card. */
.single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button {
    display: flex !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 54px !important;
    margin: 0 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */



/* =========================================================
   V15 – MOBILE CART ROW
   On phones the quantity selector and cart button must not
   overlap. They are stacked cleanly and both use the full
   available width.
   ========================================================= */

@media (max-width: 767px) {

    .single-product .summary.entry-summary .df-ticket-cart-form .quantity {
        float: none !important;
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 8px 0 14px 0 !important;
        box-sizing: border-box !important;
        justify-content: flex-start !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .minus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .plus {
        flex: 0 0 48px !important;
        width: 48px !important;
        min-width: 48px !important;
        box-sizing: border-box !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .quantity input.qty {
        flex: 0 0 72px !important;
        width: 72px !important;
        min-width: 72px !important;
        max-width: 72px !important;
        box-sizing: border-box !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button {
        display: flex !important;
        float: none !important;
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 10px 14px !important;
        box-sizing: border-box !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.2 !important;
        font-size: 15px !important;
    }
}

@media (max-width: 767px) {
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button,
    .single-product .summary.entry-summary .df-ticket-cart-form button.single_add_to_cart_button {
        width: 100% !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
    }
}


/* =========================================================
   V17 – MOBILE CART BUTTON BELOW QUANTITY
   ========================================================= */

@media (max-width: 767px) {

    /* The quantity selector gets its own complete row. */
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity {
        display: flex !important;
        float: none !important;
        clear: both !important;
        width: fit-content !important;
        max-width: 100% !important;
        margin: 8px 0 16px 0 !important;
        box-sizing: border-box !important;
    }

    /* The cart button is forced onto the next line and spans the
       entire booking card. */
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-add-button,
    .single-product .summary.entry-summary .df-ticket-cart-form button.single_add_to_cart_button {
        display: flex !important;
        position: relative !important;
        float: none !important;
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        transform: none !important;
        left: auto !important;
        right: auto !important;
    }
}


/* V18 – Mobile: quantity and cart button are forced into separate rows */
@media (max-width: 767px) {
    .single-product .summary.entry-summary form.df-ticket-cart-form {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-flow: row !important;
        align-items: stretch !important;
    }

    .single-product .summary.entry-summary form.df-ticket-cart-form .quantity {
        grid-column: 1 / -1 !important;
        float: none !important;
        display: flex !important;
        width: fit-content !important;
        max-width: 100% !important;
        margin: 10px 0 16px 0 !important;
        justify-self: start !important;
        box-sizing: border-box !important;
    }

    .single-product .summary.entry-summary form.df-ticket-cart-form .df-ticket-add-button,
    .single-product .summary.entry-summary form.df-ticket-cart-form button.single_add_to_cart_button {
        grid-column: 1 / -1 !important;
        float: none !important;
        clear: both !important;
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }
}


/* =========================================================
   V19 – MOBILE FINAL ALIGNMENT / ACTIVE CART / PRODUCT TEXT
   ========================================================= */

/* MOBILE: cart button exactly fits the booking card. */
@media (max-width: 767px) {
    .single-product .summary.entry-summary form.df-ticket-cart-form
        .df-ticket-add-button,
    .single-product .summary.entry-summary form.df-ticket-cart-form
        button.single_add_to_cart_button {
        display: flex !important;
        float: none !important;
        clear: both !important;
        position: relative !important;
        left: 0 !important;
        right: auto !important;
        width: 100% !important;
        inline-size: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    /* Quantity remains its own row. */
    .single-product .summary.entry-summary form.df-ticket-cart-form
        .quantity {
        display: flex !important;
        float: none !important;
        clear: both !important;
        width: fit-content !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 16px !important;
    }
}

/* ACTIVE cart button: same blue as seat-selection button. */
.single-product .summary.entry-summary .df-ticket-cart-form
.df-ticket-add-button.df-ticket-active,
.single-product .summary.entry-summary .df-ticket-cart-form
.df-ticket-add-button.is-enabled {
    background: linear-gradient(180deg, #0b8cf2, #006ad5) !important;
    border-color: #1597ff !important;
    color: #fff !important;
    opacity: 1 !important;
    cursor: pointer !important;
}

/* Explicit inactive state stays grey. */
.single-product .summary.entry-summary .df-ticket-cart-form
.df-ticket-add-button.df-ticket-inactive,
.single-product .summary.entry-summary .df-ticket-cart-form
.df-ticket-add-button:disabled,
.single-product .summary.entry-summary .df-ticket-cart-form
.df-ticket-add-button.disabled {
    background: linear-gradient(180deg, #9aadc0, #6d8093) !important;
    border-color: rgba(255,255,255,.35) !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* Product description colours are intentionally left untouched. */

/* Never affect the blue booking form. */
.single-product .df-ticket-cart-form,
.single-product .df-ticket-cart-form * {
    /* specific booking rules below remain authoritative */
}



/* =========================================================
   V20 – QUANTITY FINETUNING
   "Vorrätig" smaller + semi-bold
   +/- smaller and less dominant
   ========================================================= */

/* "Vorrätig" */
.single-product .summary.entry-summary .df-ticket-cart-form .stock,
.single-product .summary.entry-summary .df-ticket-cart-form .available,
.single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-stock,
.single-product .summary.entry-summary .df-ticket-cart-form .stock.in-stock {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

/* Quantity control: smaller +/- symbols */
.single-product .summary.entry-summary .df-ticket-cart-form .quantity .minus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity .plus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity button.minus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity button.plus {
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* Keep the quantity number balanced */
.single-product .summary.entry-summary .df-ticket-cart-form .quantity input.qty {
    font-size: 22px !important;
    font-weight: 500 !important;
}

/* Mobile: make the controls a little more compact */
@media (max-width: 767px) {
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .minus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .plus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity button.minus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity button.plus {
        width: 42px !important;
        min-width: 42px !important;
        font-size: 18px !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .quantity input.qty {
        width: 64px !important;
        min-width: 64px !important;
        max-width: 64px !important;
        font-size: 21px !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .stock,
    .single-product .summary.entry-summary .df-ticket-cart-form .available,
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-stock,
    .single-product .summary.entry-summary .df-ticket-cart-form .stock.in-stock {
        font-size: 19px !important;
        font-weight: 600 !important;
    }
}


/* =========================================================
   V21 – MOBILE CART BUTTON MUST STAY INSIDE THE BLUE CARD
   ========================================================= */

@media (max-width: 767px) {

    .single-product .summary.entry-summary form.df-ticket-cart-form {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .single-product .summary.entry-summary form.df-ticket-cart-form .df-ticket-add-button,
    .single-product .summary.entry-summary form.df-ticket-cart-form button.single_add_to_cart_button {
        display: flex !important;
        float: none !important;
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        transform: none !important;
        left: auto !important;
        right: auto !important;
        overflow: hidden !important;
        white-space: normal !important;
        word-break: normal !important;
    }

    /* Make the button a separate full-width grid row. */
    .single-product .summary.entry-summary form.df-ticket-cart-form {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .single-product .summary.entry-summary form.df-ticket-cart-form .quantity {
        grid-column: 1 !important;
        width: fit-content !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .single-product .summary.entry-summary form.df-ticket-cart-form .df-ticket-add-button,
    .single-product .summary.entry-summary form.df-ticket-cart-form button.single_add_to_cart_button {
        grid-column: 1 !important;
        justify-self: stretch !important;
    }
}


/* =========================================================
   V22 – PLUS / MINUS MUCH SMALLER
   The symbols themselves are intentionally small; the control
   boxes retain their existing size.
   ========================================================= */

.single-product .summary.entry-summary .df-ticket-cart-form .quantity .minus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity .plus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity button.minus,
.single-product .summary.entry-summary .df-ticket-cart-form .quantity button.plus {
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-transform: none !important;
}

@media (max-width: 767px) {
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .minus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity .plus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity button.minus,
    .single-product .summary.entry-summary .df-ticket-cart-form .quantity button.plus {
        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1 !important;
    }
}


/* =========================================================
   V24 – MOBILE QUANTITY / CART LAYOUT
   Stock on top, quantity below, cart button full width.
   Plus/minus are small but clearly visible.
   ========================================================= */

@media (max-width: 767px) {

    .df-ticket-cart-bottom {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 22px !important;
        box-sizing: border-box !important;
    }

    .df-ticket-cart-bottom .df-ticket-stock {
        order: 1 !important;
        width: 100% !important;
        font-size: 19px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        margin: 0 !important;
    }

    .df-ticket-cart-bottom .df-ticket-quantity {
        order: 2 !important;
        display: grid !important;
        grid-template-columns: 1fr 1.15fr 1fr !important;
        flex: 0 0 auto !important;
        width: 195px !important;
        max-width: 195px !important;
        min-width: 195px !important;
        height: 58px !important;
        min-height: 58px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .df-ticket-cart-bottom .df-ticket-quantity .minus,
    .df-ticket-cart-bottom .df-ticket-quantity .plus {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        font-size: 0 !important;
        line-height: 1 !important;
    }

    /* Small, clearly visible symbols */
    .df-ticket-cart-bottom .df-ticket-quantity .minus::before {
        content: "−" !important;
        display: block !important;
        width: 18px !important;
        height: 18px !important;
        font-family: Arial, sans-serif !important;
        font-size: 22px !important;
        font-weight: 400 !important;
        line-height: 16px !important;
        text-align: center !important;
    }

    .df-ticket-cart-bottom .df-ticket-quantity .plus::before {
        content: "+" !important;
        display: block !important;
        width: 18px !important;
        height: 18px !important;
        font-family: Arial, sans-serif !important;
        font-size: 22px !important;
        font-weight: 400 !important;
        line-height: 18px !important;
        text-align: center !important;
    }

    .df-ticket-cart-bottom .df-ticket-quantity input.qty {
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        font-size: 21px !important;
        font-weight: 500 !important;
    }

    .df-ticket-cart-bottom .df-ticket-add-button {
        order: 3 !important;
        display: flex !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 58px !important;
        min-height: 58px !important;
        margin: 0 !important;
        padding: 0 12px !important;
        box-sizing: border-box !important;
        white-space: normal !important;
        overflow: hidden !important;
        text-overflow: clip !important;
        text-align: center !important;
        line-height: 1.2 !important;
        font-size: 15px !important;
    }
}


/* =========================================================
   V25 – FINAL QUANTITY SYMBOL FIX
   Do not create a second +/- symbol. WooCommerce's real button text
   is used; all theme/plugin pseudo-elements are disabled.
   ========================================================= */

.df-ticket-cart-bottom .df-ticket-quantity .minus,
.df-ticket-cart-bottom .df-ticket-quantity .plus {
    font-size: 20px !important;
    font-family: Arial, sans-serif !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
    text-shadow: none !important;
    position: relative !important;
}

/* Kill every pseudo-generated duplicate. */
.df-ticket-cart-bottom .df-ticket-quantity .minus::before,
.df-ticket-cart-bottom .df-ticket-quantity .minus::after,
.df-ticket-cart-bottom .df-ticket-quantity .plus::before,
.df-ticket-cart-bottom .df-ticket-quantity .plus::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: 0 !important;
}

/* The product's own content controls its colours.
   No selector here assigns a colour to the event notice, description,
   organizer text or other user-authored product content. */

@media (max-width: 767px) {
    .df-ticket-cart-bottom .df-ticket-quantity .minus,
    .df-ticket-cart-bottom .df-ticket-quantity .plus {
        font-size: 20px !important;
        font-weight: 400 !important;
    }
}


/* =========================================================
   V26 – PRODUCT COLOURS ARE COMPLETELY HANDLED BY THE PRODUCT
   ========================================================= */

/* Intentionally no colour rules for product description, event notices,
   organizer information or other user-authored product content. */

/* =========================================================
   V26 – SINGLE REAL +/- SYMBOL
   JS supplies the actual button text. No CSS pseudo-symbols are used.
   ========================================================= */

.df-ticket-cart-bottom .df-ticket-quantity .minus,
.df-ticket-cart-bottom .df-ticket-quantity .plus {
    font-family: Arial, sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-indent: 0 !important;
    text-shadow: none !important;
}

.df-ticket-cart-bottom .df-ticket-quantity .minus::before,
.df-ticket-cart-bottom .df-ticket-quantity .minus::after,
.df-ticket-cart-bottom .df-ticket-quantity .plus::before,
.df-ticket-cart-bottom .df-ticket-quantity .plus::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: 0 !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-bottom .df-ticket-quantity .minus,
    .df-ticket-cart-bottom .df-ticket-quantity .plus {
        font-size: 20px !important;
    }
}


/* =========================================================
   V27 – STANDING-ONLY TICKET CATEGORIES
   A standing category does not use the FooEvents seat selector.
   ========================================================= */
.df-ticket-cart-form.df-ticket-standing-mode .df-ticket-seat-step {
    display: none !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-form.df-ticket-standing-mode .df-ticket-seat-step {
        display: none !important;
    }
}

/* =========================================================
   V27 – STANDING-ONLY TICKET CATEGORIES
   A standing category does not use the FooEvents seat selector.
   ========================================================= */
.df-ticket-cart-form.df-ticket-standing-mode .df-ticket-seat-step {
    display: none !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-form.df-ticket-standing-mode .df-ticket-seat-step {
        display: none !important;
    }
}


/* =========================================================
   V28 – STANDING: HIDE DUPLICATE NATIVE QUANTITY
   The plugin's bottom quantity is the single quantity control.
   ========================================================= */

.df-ticket-cart-form.df-ticket-standing-mode .df-native-standing-quantity {
    display: none !important;
}


/* =========================================================
   V31 – native FooEvents standing quantity in bottom bar
   ========================================================= */
.df-ticket-cart-bottom .df-ticket-native-standing-quantity {
    float: left !important;
    margin: 8px 12px 0 0 !important;
}

.df-ticket-cart-bottom .df-ticket-native-standing-quantity input {
    min-height: 52px !important;
}

.df-ticket-cart-bottom .df-ticket-native-standing-quantity .minus,
.df-ticket-cart-bottom .df-ticket-native-standing-quantity .plus {
    line-height: 1 !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-bottom .df-ticket-native-standing-quantity {
        float: none !important;
        width: 100% !important;
        margin: 8px 0 0 !important;
    }

    .df-ticket-cart-bottom .df-ticket-native-standing-quantity input {
        width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* =========================================================
   V31.1 – FIX STANDING DESKTOP ORDER
   FooEvents may append the native standing quantity after the
   cart button. The visual order must always be:
   VORRÄTIG -> MENGE -> WARENKORB.
   ========================================================= */

@media (min-width: 768px) {
    .df-ticket-cart-bottom {
        align-items: center !important;
        grid-template-columns: auto 255px minmax(260px, 1fr) !important;
        gap: 28px !important;
    }

    .df-ticket-cart-bottom .df-ticket-stock {
        order: 1 !important;
    }

    .df-ticket-cart-bottom .df-ticket-quantity,
    .df-ticket-cart-bottom .df-ticket-native-standing-quantity {
        order: 2 !important;
        justify-self: start !important;
        min-width: 0 !important;
        width: 255px !important;
        margin: 0 !important;
    }

    .df-ticket-cart-bottom .df-ticket-add-button {
        order: 3 !important;
        justify-self: stretch !important;
        min-width: 0 !important;
        width: 100% !important;
        margin: 0 !important;
    }
}

/* Never allow the native standing quantity to push the cart button
   outside its grid column. */
.df-ticket-cart-bottom .df-ticket-native-standing-quantity {
    float: none !important;
    box-sizing: border-box !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-bottom .df-ticket-native-standing-quantity {
        order: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .df-ticket-cart-bottom .df-ticket-add-button {
        order: 3 !important;
    }
}


/* V31.2 – keep the normal WooCommerce quantity available for seated tickets.
 * It is moved to the blue bottom bar only for PK1/PK2/PK3 and returned to
 * its original FooEvents position for STEHPLATZ.
 */
.df-ticket-cart-form.df-ticket-standing-mode .df-ticket-normal-quantity {
    display: none !important;
}

.df-ticket-standing-placeholder,
.df-ticket-normal-quantity-placeholder {
    display: none !important;
}

@media (max-width: 767px) {
    .df-ticket-cart-bottom .df-ticket-quantity,
    .df-ticket-cart-bottom .df-ticket-native-standing-quantity {
        width: 100% !important;
        max-width: 100% !important;
    }
}


/* =========================================================
   V31.3 – FINAL QUANTITY / CART LAYOUT
   Exactly one quantity control is visible. Flex is used here
   deliberately so a second hidden FooEvents quantity can never
   create an extra grid column or push the cart button onto a
   second desktop row.
   ========================================================= */
@media (min-width: 768px) {
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 28px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-stock {
        flex: 0 0 125px !important;
        width: 125px !important;
        order: 1 !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .quantity {
        flex: 0 0 255px !important;
        width: 255px !important;
        min-width: 255px !important;
        max-width: 255px !important;
        order: 2 !important;
        margin: 0 !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-add-button {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        order: 3 !important;
        margin: 0 !important;
    }
}

/* Any quantity that the V31.3 script marks as non-canonical is hidden.
   This is intentionally scoped to the booking form only. */
.df-ticket-cart-form.df-ticket-standing-mode .df-ticket-normal-quantity {
    display: none !important;
}

.df-ticket-cart-form.df-ticket-standing-mode .quantity:not(.df-ticket-native-standing-quantity) {
    display: none !important;
}

.df-ticket-cart-form:not(.df-ticket-standing-mode) .quantity.df-ticket-native-standing-quantity {
    display: none !important;
}

@media (max-width: 767px) {
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
        width: 100% !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-stock,
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .quantity,
    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-add-button {
        flex: 0 0 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-stock {
        order: 1 !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .quantity {
        order: 2 !important;
    }

    .single-product .summary.entry-summary .df-ticket-cart-form .df-ticket-cart-bottom > .df-ticket-add-button {
        order: 3 !important;
    }
}


/* V31.7 – IMPORTANT: keep exactly one visible quantity control.
 * The styled WooCommerce quantity remains in the blue bottom bar.
 * FooEvents' native "Anzahl Stehplätze" block stays in its original
 * location for its internal field, but is hidden visually.
 */
.df-ticket-cart-form.df-ticket-standing-mode .df-native-standing-quantity {
    display: none !important;
}

.df-ticket-cart-form.df-ticket-standing-mode .df-ticket-normal-quantity {
    display: grid !important;
}

/* V31.8 – FIX: native Stehplatz-Mengenblock nur bei STEHPLATZ sichtbar.
 * Bei PK1/PK2/PK3 darf "Anzahl Stehplätze" niemals erscheinen.
 * Das ist bewusst nur eine Sichtbarkeitskorrektur; das bestehende
 * Layout und die Mengenlogik bleiben unverändert.
 */
.df-ticket-cart-form:not(.df-ticket-standing-mode) .df-native-standing-quantity {
    display: none !important;
}
