/* ============================================================
   Defender Rally – Zwevende winkelwagenknop + mobiele fixes
   ============================================================ */

/* ── Zwevende winkelwagenknop ─────────────────────────────────────────────── */

#dr-floating-cart-btn {
    position:        fixed;
    bottom:          60px;   /* boven de GTranslate widget (~40 px hoog) */
    right:           12px;
    z-index:         99990;  /* onder GTranslate (99999) maar boven content */

    display:         flex;
    align-items:     center;
    justify-content: center;

    width:           48px;
    height:          48px;
    border-radius:   50%;

    background-color: #1e3a5f;   /* donkerblauw – past bij het site-thema */
    color:            #ffffff;
    box-shadow:       0 3px 10px rgba(0, 0, 0, 0.35);

    text-decoration:  none;
    transition:       background-color 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}

#dr-floating-cart-btn:hover {
    background-color: #2a5298;
    transform:        scale(1.08);
    box-shadow:       0 5px 16px rgba(0, 0, 0, 0.45);
}

#dr-floating-cart-btn svg {
    width:  22px;
    height: 22px;
    flex-shrink: 0;
}

/* Tellerbadge */
.dr-cart-badge {
    position:        absolute;
    top:             2px;
    right:           2px;
    min-width:       18px;
    height:          18px;
    padding:         0 4px;
    border-radius:   9px;

    background-color: #e63946;
    color:            #ffffff;
    font-size:        11px;
    font-weight:      700;
    font-family:      Arial, sans-serif;
    line-height:      18px;
    text-align:       center;

    box-sizing:       border-box;
    pointer-events:   none;
}

/* ── Tickera winkelwagen – responsieve tabel op mobiel ───────────────────── */
/*
 * Op schermen ≤ 640 px wordt de tabelrij omgezet naar een kaart-lay-out.
 * Elke cel wordt een blokelement met een vetgedrukt label ervóór (::before).
 * Zo past alles netjes binnen de schermbreedte zonder horizontaal te scrollen.
 */

@media only screen and (max-width: 640px) {

    /* Verberg de tabelkopteksten – labels worden via ::before getoond         */
    .tickera-checkout .tickera_table thead {
        display: none !important;
    }

    /* Zet tabel, rijen en cellen om naar blok-elementen                       */
    .tickera-checkout .tickera_table,
    .tickera-checkout .tickera_table tbody,
    .tickera-checkout .tickera_table tr,
    .tickera-checkout .tickera_table td {
        display:   block !important;
        width:     100%  !important;
        box-sizing: border-box !important;
    }

    /* Elke ticketrij als kaart                                                */
    .tickera-checkout .tickera_table tbody tr {
        border:        1px solid #e0e0e0;
        border-radius: 6px;
        margin-bottom: 12px;
        padding:       8px 10px;
        background:    #fafafa;
    }

    /* Verberg de subtotaalrij-border niet opnieuw dubbelen                    */
    .tickera-checkout .tickera_table tr.last-table-row {
        border:     none;
        background: transparent;
        padding:    0;
    }

    /* Standaard opmaak voor alle cellen                                       */
    .tickera-checkout .tickera_table td {
        padding:      5px 0 !important;
        text-align:   left !important;
        border:       none !important;
        font-size:    14px;
    }

    /* Vetgedrukte labels vóór elke cel                                        */
    .tickera-checkout .tickera_table td.ticket-type::before    { content: "Ticket: ";   font-weight: 700; display: inline-block; min-width: 80px; }
    .tickera-checkout .tickera_table td.ticket-price::before   { content: "Prijs: ";    font-weight: 700; display: inline-block; min-width: 80px; }
    .tickera-checkout .tickera_table td.ticket-quantity::before { content: "Aantal: ";  font-weight: 700; display: inline-block; min-width: 80px; }
    .tickera-checkout .tickera_table td.ticket-total::before   { content: "Totaal: ";   font-weight: 700; display: inline-block; min-width: 80px; }

    /* Hoeveelheid-invoer: compacter houden                                    */
    .tickera-checkout .tickera_table td.ticket-quantity .inner-wrap {
        display:     inline-flex;
        align-items: center;
        gap:         6px;
    }
    .tickera-checkout .tickera_table td.ticket-quantity .quantity {
        width:     52px !important;
        min-width: 0    !important;
        text-align: center;
    }

    /* Proceed / Update-knop volledig breed                                    */
    .tickera-checkout .tickera_update,
    .tickera-checkout input[type="submit"],
    .tickera-checkout button[type="submit"] {
        width:      100%       !important;
        box-sizing: border-box !important;
        margin-top: 8px        !important;
    }

    /* ── Actieknoppen (Winkelmandje leegmaken / bijwerken) ─────────────────── */
    /* Stapel de knoppenrij verticaal en maak elke knop volledig breed         */
    .tickera-checkout .action-wrap {
        flex-direction: column !important;
        align-items:    stretch !important;
        gap:            8px    !important;
    }
    .tickera-checkout .update-wrap {
        flex-direction: column !important;
        justify-content: stretch !important;
        width:          100%   !important;
    }
    .tickera-checkout .update-wrap > *,
    .tickera-checkout .update-wrap input[type="submit"] {
        width:      100%       !important;
        flex:       none       !important;
        box-sizing: border-box !important;
        text-align: center     !important;
    }
    /* Kortingsveld ook volledig breed                                          */
    .tickera-checkout .discount-wrap {
        width: 100% !important;
    }
}