/* Minibasket fullscreen på mobil - AGGRESSIV VERSION */

/* Kun på mobil og kun når minibasket har .active class */
@media (max-width: 768px) {
    /* Fallback for ældre browsere (iPhone 7 Safari) - NO transforms eller moderne features */
    .minibasketcontainer.active,
    .minibasket.active {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    /* Target minibasket direkte når den er active - slide in fra højre */
    .minibasketcontainer.active,
    .minibasket.active,
    div.minibasketcontainer.active,
    div.minibasket.active,
    [class*="minibasket"].active,
    [class*="basket"].active {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
        transform: translate3d(0, 0, 0) !important;
        -webkit-transform: translate3d(0, 0, 0) !important;
        border-radius: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        padding-left: 60px !important; /* 60px padding til venstre */
        z-index: 999999 !important;
        overflow: hidden !important;
        background: rgba(0, 0, 0, 0.5) !important; /* Dark overlay baggrund */
        transition: background 0.3s ease-in-out !important;
    }


    /* Sikre at indholdet også fylder */
    .minibasketcontainer.active > *,
    .minibasket.active > * {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Fix nested minibasket inde i minibasketcontainer - hvid baggrund */
    .minibasketcontainer.active .minibasket,
    .minibasketcontainer.active > .minibasket {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 60px !important; /* Starter fra efter det mørke område */
        width: auto !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        -webkit-transform: none !important;
        transform: none !important;
        display: -webkit-box !important; /* Old flexbox for Safari */
        display: -webkit-flex !important; /* Safari */
        display: flex !important;
        -webkit-box-orient: vertical !important;
        -webkit-box-direction: normal !important;
        -webkit-flex-direction: column !important;
        flex-direction: column !important;
        overflow: hidden !important;
        background: white !important; /* Hvid baggrund for selve kurven */
        -webkit-box-shadow: -4px 0 20px rgba(0, 0, 0, 0.3) !important;
        box-shadow: -4px 0 20px rgba(0, 0, 0, 0.3) !important;
    }

    /* Header (h2, "Din indkøbskurv") - sticky i toppen */
    .minibasketcontainer.active .minibasket h2,
    .minibasket.active h2 {
        position: -webkit-sticky !important; /* Safari */
        position: sticky !important;
        top: 0 !important;
        -webkit-box-flex: 0 !important;
        -webkit-flex: 0 0 auto !important; /* Ingen shrink eller grow */
        flex: 0 0 auto !important;
        background: white !important;
        z-index: 100 !important;
        margin: 0 !important;
        padding: 15px 20px !important;
        border-bottom: 1px solid #e0e0e0 !important;
    }

    /* Hele minibasket skal kunne scrolle for at sticky virker */
    .minibasketcontainer.active .minibasket,
    .minibasketcontainer.active > .minibasket {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* Wrapper for scrollable content */
    .minibasketcontainer.active .minibasket > div:not(.minibasketbottom),
    .minibasket.active > div:not(.minibasketbottom) {
        -webkit-box-flex: 1 !important;
        -webkit-flex: 1 1 auto !important;
        flex: 1 1 auto !important;
    }

    /* Scrollable content area - minibasketcontent */
    .minibasketcontainer.active .minibasketcontent,
    .minibasket.active .minibasketcontent {
        height: auto !important;
    }

    /* Minibasketbottom - fixed i bunden */
    .minibasketcontainer.active .minibasketbottom,
    .minibasket.active .minibasketbottom {
        -webkit-box-flex: 0 !important;
        -webkit-flex: 0 0 auto !important; /* Ingen shrink eller grow */
        flex: 0 0 auto !important;
        width: 100% !important;
        margin: 0 !important;
        background: white !important;
        -webkit-box-shadow: 0 -2px 10px rgba(0,0,0,0.1) !important;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.1) !important;
        padding-bottom: env(safe-area-inset-bottom, 0) !important;
        padding-bottom: constant(safe-area-inset-bottom, 0) !important; /* iOS 11.0-11.2 */
        z-index: 10 !important;
    }

    /* Fjern border-radius fra alle elementer inde i minibasket */
    .minibasketcontainer.active *,
    .minibasket.active * {
        border-radius: 0 !important;
    }

    /* Specifikt fix for h2 og header elementer */
    .minibasketcontainer.active h2,
    .minibasket.active h2,
    .minibasketcontainer.active .minibasketcontent,
    .minibasket.active .minibasketcontent,
    .minibasketcontainer.active .minibasketcontent *,
    .minibasket.active .minibasketcontent * {
        border-radius: 0 !important;
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    /* Fix parent containers der kan begrænse */
    body:has(.minibasketcontainer.active),
    body:has(.minibasket.active) {
        overflow: hidden !important;
    }

    /* Fjern eventuelle wrapper constraints */
    .minibasketcontainer.active,
    .minibasket.active {
        inset: 0 !important; /* shorthand for top/right/bottom/left: 0 */
    }

    /* Hvis der er en wrapper omkring minibasket */
    *:has(> .minibasketcontainer.active),
    *:has(> .minibasket.active) {
        position: static !important;
        overflow: visible !important;
    }

    /* Fix minibasket sections - altid vis "Gå til kassen" */
    .minibaskettop {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        min-height: 0 !important;
        max-height: calc(100vh - 250px) !important;
    }

    .minibasketproducts {
        overflow-y: auto !important;
        max-height: 100% !important;
    }

    .minibasketactions {
        position: relative !important;
        z-index: 1000 !important;
    }

    .minibasketactions a.knap {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Ekstra sikkerhed ved ekstrem zoom - KUN PÅ MOBIL */
@media screen and (max-width: 768px) and (max-height: 700px) {
    .minibaskettop {
        max-height: calc(100vh - 200px) !important;
    }

    .minibasketbottom {
        padding: 10px !important;
    }
}

/* For meget ekstrem zoom eller små skærme - KUN PÅ MOBIL */
@media screen and (max-width: 768px) and (max-height: 500px) {
    .minibasketproducts {
        max-height: calc(100vh - 300px) !important;
    }

    .minibaskettotal,
    .minibasketcards,
    .minibasketprefooter {
        padding: 5px 10px !important;
        margin: 2px 0 !important;
    }

    /* Skjul Tidio chat på ekstrem zoom */
    #tidio-chat-root,
    .tidio-chat-root,
    iframe[title*="Tidio"],
    div[id*="tidio"] {
        display: none !important;
        visibility: hidden !important;
    }
}