/* =====================================================
   K360 sidekurv + kurv-knapper
   ===================================================== */
:root {
    --k360-navy: #1F3065;
    --k360-navy-dark: #172450;
    --k360-red: #E62229;
    --k360-red-dark: #c81d23;
    --k360-ink: #151a2d;
    --k360-muted: #6b7285;
    --k360-line: #e9ebf0;
    --k360-soft: #f5f6f9;
    --k360-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Kurv-ikon til headeren: [k360_cart_icon] ----------
   Hvid knap, sort ikon, rødt badge */
.k360-cart-link, .k360-cart-link:focus { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 46px !important; height: 46px !important; border: 1px solid #e3e6ed !important; border-radius: 50% !important; background: #fff !important; color: #111 !important; text-decoration: none !important; transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s var(--k360-ease) !important; }
.k360-cart-link:hover, .k360-cart-link:focus-visible { border-color: #111 !important; background: #fff !important; color: #111 !important; box-shadow: 0 4px 14px rgba(15, 20, 40, 0.12) !important; }
.k360-cart-link:focus-visible { outline: 3px solid rgba(17, 17, 17, 0.25) !important; outline-offset: 2px !important; }
.k360-cart-link svg { width: 24px !important; height: 24px !important; }
.k360-cart-count { position: absolute !important; top: -3px !important; right: -4px !important; min-width: 20px !important; height: 20px !important; padding: 0 5px !important; border-radius: 10px !important; background: var(--k360-red) !important; color: #fff !important; font: 700 11px/20px 'Work Sans', sans-serif !important; text-align: center !important; box-sizing: border-box !important; box-shadow: 0 0 0 2px #fff !important; }
.k360-cart-count[data-count="0"] { display: none !important; }

/* ---------- Flydende kurv-knap ----------
   Hvid knap, sort ikon, rødt badge.
   Altid synlig på shopsider (.k360-fab-always) - ellers kun når der er noget i kurven. */
.k360-fab, .k360-fab:hover, .k360-fab:focus {
    /* Under bookingkalenderen og billed-overlays (z-index 9999), over sidens indhold */
    position: fixed !important; right: 22px !important; bottom: 22px !important; z-index: 9980 !important;
    display: none !important; align-items: center !important; justify-content: center !important;
    width: 62px !important; height: 62px !important; padding: 0 !important; border: 1px solid #e3e6ed !important; border-radius: 50% !important;
    background: #fff !important; color: #111 !important; cursor: pointer !important;
    box-shadow: 0 10px 30px rgba(15, 20, 40, 0.18), 0 2px 6px rgba(15, 20, 40, 0.08) !important;
    transition: transform 0.25s var(--k360-ease), border-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease, bottom 0.25s var(--k360-ease) !important;
}
.k360-fab:hover { border-color: #111 !important; transform: translateY(-3px) scale(1.04) !important; box-shadow: 0 16px 36px rgba(15, 20, 40, 0.22), 0 2px 6px rgba(15, 20, 40, 0.1) !important; }
.k360-fab:focus-visible { outline: 3px solid rgba(17, 17, 17, 0.3) !important; outline-offset: 3px !important; }
.k360-fab svg { width: 27px !important; height: 27px !important; }
.k360-fab .k360-cart-count { top: -3px !important; right: -3px !important; min-width: 24px !important; height: 24px !important; border-radius: 12px !important; font-size: 12px !important; line-height: 24px !important; }
.k360-fab.k360-fab-always { display: flex !important; }
body.k360-cart-has-items .k360-fab { display: flex !important; }
body.k360-cart-has-items .k360-fab:not(.k360-fab-always) { animation: k360-pop 0.4s var(--k360-ease) !important; }
body.k360-drawer-open .k360-fab { opacity: 0 !important; pointer-events: none !important; }
@media (max-width: 768px) {
    .k360-fab, .k360-fab:hover, .k360-fab:focus { right: 14px !important; bottom: 14px !important; width: 56px !important; height: 56px !important; }
    /* Mobil: knappen vises kun, når der ligger noget i kurven - også på shopsider */
    body:not(.k360-cart-has-items) .k360-fab.k360-fab-always { display: none !important; }
    /* Løft knappen over produktsidens faste købsbar */
    body.ulf-sticky-on .k360-fab { bottom: 104px !important; }
}

/* ---------- Baggrund ---------- */
.k360-drawer-overlay { position: fixed !important; inset: 0 !important; z-index: 99994 !important; background: rgba(15, 20, 40, 0.38) !important; opacity: 0 !important; visibility: hidden !important; transition: opacity 0.3s ease, visibility 0s linear 0.3s !important; }
body.k360-drawer-open .k360-drawer-overlay { opacity: 1 !important; visibility: visible !important; transition: opacity 0.3s ease !important; }
body.k360-drawer-open { overflow: hidden !important; }

/* ---------- Skuffen: enkel og rolig - hvid flade, tynde streger, ingen understregninger ---------- */
.k360-drawer { position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 99995 !important; width: 420px !important; max-width: 100vw !important; background: #fff !important; color: var(--k360-ink) !important; font-family: 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; font-size: 14px !important; line-height: 1.45 !important; letter-spacing: normal !important; box-shadow: -12px 0 40px rgba(15, 20, 40, 0.12) !important; transform: translateX(104%) !important; visibility: hidden !important; transition: transform 0.36s var(--k360-ease), visibility 0s linear 0.36s !important; outline: none !important; }
body.k360-drawer-open .k360-drawer { transform: translateX(0) !important; visibility: visible !important; transition: transform 0.36s var(--k360-ease) !important; }
.k360-drawer *, .k360-drawer *::before, .k360-drawer *::after { box-sizing: border-box !important; letter-spacing: normal !important; text-transform: none !important; }
.k360-drawer a, .k360-drawer a:hover, .k360-drawer a:focus { text-decoration: none !important; box-shadow: none !important; }
.k360-drawer-inner { position: relative !important; display: flex !important; flex-direction: column !important; height: 100% !important; overflow: hidden !important; }

/* Temaets globale knap-stil skal ikke slå igennem i skuffen */
.k360-drawer button, .k360-drawer button:hover, .k360-drawer button:focus { margin: 0 !important; min-width: 0 !important; min-height: 0 !important; font-family: inherit !important; text-decoration: none !important; text-shadow: none !important; box-shadow: none !important; }

/* Top */
.k360-drawer-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; padding: 20px 24px !important; border-bottom: 1px solid #f0f1f4 !important; flex-shrink: 0 !important; }
.k360-drawer .k360-drawer-title { margin: 0 !important; padding: 0 !important; border: none !important; color: var(--k360-ink) !important; font-family: 'Work Sans', sans-serif !important; font-size: 17px !important; font-weight: 600 !important; line-height: 1.2 !important; }
.k360-drawer-title-count { color: var(--k360-muted) !important; font-weight: 400 !important; }
.k360-drawer .k360-drawer-close, .k360-drawer .k360-drawer-close:focus { display: flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; height: 36px !important; margin-right: -8px !important; padding: 0 !important; border: none !important; border-radius: 50% !important; background: transparent !important; color: var(--k360-ink) !important; cursor: pointer !important; transition: background 0.2s ease !important; }
.k360-drawer .k360-drawer-close:hover { background: var(--k360-soft) !important; color: var(--k360-ink) !important; }
.k360-drawer .k360-drawer-close:focus-visible { outline: 2px solid var(--k360-ink) !important; outline-offset: 2px !important; }
.k360-drawer-close svg { width: 20px !important; height: 20px !important; }

/* Arbejder: tynd bjælke under toppen + dæmpet indhold */
.k360-drawer.is-busy .k360-drawer-head::after { content: '' !important; position: absolute !important; left: 0 !important; top: 76px !important; height: 2px !important; width: 40% !important; background: var(--k360-ink) !important; animation: k360-slide 0.9s ease-in-out infinite !important; }
.k360-drawer.is-busy .k360-drawer-items, .k360-drawer.is-busy .k360-drawer-foot { opacity: 0.5 !important; pointer-events: none !important; transition: opacity 0.15s ease !important; }

/* Henter */
.k360-drawer-loading { flex: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.k360-spinner { width: 26px !important; height: 26px !important; border: 2px solid #e9ebf0 !important; border-top-color: var(--k360-ink) !important; border-radius: 50% !important; animation: k360-spin 0.8s linear infinite !important; }
.k360-drawer .screen-reader-text { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; }

/* Tom kurv */
.k360-drawer-empty { flex: 1 !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 18px !important; padding: 40px 32px !important; text-align: center !important; }
.k360-drawer-empty-title { margin: 0 !important; color: var(--k360-muted) !important; font-size: 15px !important; }
.k360-drawer .k360-drawer-btn-outline, .k360-drawer .k360-drawer-btn-outline:focus { height: 44px !important; padding: 0 22px !important; border: 1px solid var(--k360-ink) !important; border-radius: 8px !important; background: #fff !important; color: var(--k360-ink) !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1 !important; cursor: pointer !important; transition: background 0.2s ease, color 0.2s ease !important; }
.k360-drawer .k360-drawer-btn-outline:hover { background: var(--k360-ink) !important; color: #fff !important; }

/* Linjer */
.k360-drawer-items { flex: 1 !important; min-height: 0 !important; margin: 0 !important; padding: 0 24px !important; list-style: none !important; overflow-y: auto !important; overscroll-behavior: contain !important; scrollbar-width: thin !important; }
.k360-drawer-item { display: grid !important; grid-template-columns: 64px minmax(0, 1fr) !important; gap: 14px !important; margin: 0 !important; padding: 20px 0 !important; border-bottom: 1px solid #f0f1f4 !important; list-style: none !important; transition: opacity 0.25s ease !important; }
.k360-drawer-item:last-child { border-bottom: none !important; }
.k360-drawer-item.is-removing { opacity: 0.3 !important; }
.k360-drawer-item-thumb { width: 64px !important; height: 64px !important; border-radius: 8px !important; overflow: hidden !important; background: var(--k360-soft) !important; }
.k360-drawer-item-thumb a { display: block !important; width: 100% !important; height: 100% !important; }
.k360-drawer-item-thumb img { display: block !important; width: 100% !important; height: 100% !important; margin: 0 !important; border-radius: 0 !important; object-fit: cover !important; }
.k360-drawer-item-body { display: flex !important; flex-direction: column !important; gap: 4px !important; min-width: 0 !important; }
.k360-drawer-item-top { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 14px !important; }
.k360-drawer .k360-drawer-item-name, .k360-drawer .k360-drawer-item-name:hover { color: var(--k360-ink) !important; font-size: 14.5px !important; font-weight: 500 !important; line-height: 1.35 !important; }
.k360-drawer-item-price { flex-shrink: 0 !important; color: var(--k360-ink) !important; font-size: 14.5px !important; font-weight: 600 !important; line-height: 1.35 !important; white-space: nowrap !important; }
.k360-drawer .k360-drawer-item-meta { margin: 0 !important; padding: 0 !important; color: var(--k360-muted) !important; font-size: 12.5px !important; line-height: 1.5 !important; }

/* Udstyr, nummerplade m.m. foldet ind */
.k360-drawer-item-details { margin: 0 !important; color: var(--k360-muted) !important; font-size: 12.5px !important; line-height: 1.5 !important; }
.k360-drawer-item-details summary { display: inline-flex !important; align-items: center !important; gap: 5px !important; color: var(--k360-muted) !important; cursor: pointer !important; list-style: none !important; user-select: none !important; }
.k360-drawer-item-details summary::-webkit-details-marker { display: none !important; }
.k360-drawer-item-details summary::after { content: '' !important; width: 6px !important; height: 6px !important; margin-top: -3px !important; border-right: 1.5px solid currentColor !important; border-bottom: 1.5px solid currentColor !important; transform: rotate(45deg) !important; transition: transform 0.2s ease !important; }
.k360-drawer-item-details[open] summary::after { margin-top: 3px !important; transform: rotate(-135deg) !important; }
.k360-drawer-item-details summary:hover { color: var(--k360-ink) !important; }
.k360-drawer .k360-drawer-item-details p { margin: 6px 0 0 !important; padding: 0 !important; color: var(--k360-muted) !important; font-size: 12.5px !important; line-height: 1.5 !important; }
.k360-drawer-item-details p span { color: var(--k360-ink) !important; font-weight: 500 !important; }

.k360-drawer-item-bottom { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-top: 8px !important; }
.k360-qty-fixed { color: var(--k360-muted) !important; font-size: 12.5px !important; }
.k360-drawer .k360-drawer-remove, .k360-drawer .k360-drawer-remove:focus { padding: 4px 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; color: var(--k360-muted) !important; font-size: 12.5px !important; font-weight: 400 !important; line-height: 1.2 !important; cursor: pointer !important; transition: color 0.2s ease !important; }
.k360-drawer .k360-drawer-remove:hover { background: transparent !important; color: var(--k360-red) !important; }
.k360-drawer .k360-drawer-remove:focus-visible { outline: 2px solid var(--k360-ink) !important; outline-offset: 2px !important; }

/* Antal */
.k360-qty { display: inline-flex !important; align-items: center !important; height: 32px !important; border: 1px solid #e3e6ed !important; border-radius: 6px !important; overflow: hidden !important; background: #fff !important; }
.k360-drawer .k360-qty-btn, .k360-drawer .k360-qty-btn:focus { width: 30px !important; height: 100% !important; padding: 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; color: var(--k360-ink) !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1 !important; cursor: pointer !important; transition: background 0.15s ease !important; }
.k360-drawer .k360-qty-btn:hover:not(:disabled) { background: var(--k360-soft) !important; color: var(--k360-ink) !important; }
.k360-drawer .k360-qty-btn:disabled { opacity: 0.3 !important; cursor: not-allowed !important; }
.k360-drawer .k360-qty-btn:focus-visible { outline: 2px solid var(--k360-ink) !important; outline-offset: -2px !important; }
.k360-drawer .k360-qty-input, .k360-drawer .k360-qty-input:focus { width: 32px !important; height: 100% !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; color: var(--k360-ink) !important; font-family: 'Work Sans', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1 !important; text-align: center !important; box-shadow: none !important; outline: none !important; -moz-appearance: textfield !important; appearance: textfield !important; }
.k360-drawer .k360-qty-input::-webkit-outer-spin-button, .k360-drawer .k360-qty-input::-webkit-inner-spin-button { -webkit-appearance: none !important; margin: 0 !important; }

/* Bund */
.k360-drawer-foot { flex-shrink: 0 !important; padding: 18px 24px calc(20px + env(safe-area-inset-bottom, 0px)) !important; border-top: 1px solid #f0f1f4 !important; background: #fff !important; }
.k360-drawer-totals { margin: 0 0 16px !important; padding: 0 !important; }
.k360-drawer-row { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 16px !important; margin: 0 !important; padding: 3px 0 !important; color: var(--k360-muted) !important; font-size: 13.5px !important; }
.k360-drawer .k360-drawer-row dt, .k360-drawer .k360-drawer-row dd { margin: 0 !important; padding: 0 !important; font-weight: 400 !important; }
.k360-drawer .k360-drawer-row dd { color: var(--k360-ink) !important; white-space: nowrap !important; }
.k360-drawer .k360-drawer-row-total { padding-top: 8px !important; }
.k360-drawer .k360-drawer-row-total dt { color: var(--k360-ink) !important; font-size: 15px !important; font-weight: 500 !important; }
.k360-drawer .k360-drawer-row-total dt small { color: var(--k360-muted) !important; font-size: 12px !important; font-weight: 400 !important; }
.k360-drawer .k360-drawer-row-total dd { color: var(--k360-ink) !important; font-size: 20px !important; font-weight: 600 !important; }
.k360-drawer .k360-drawer-warning { margin: 0 0 14px !important; padding: 0 !important; color: #a3161b !important; font-size: 13px !important; line-height: 1.45 !important; }
.k360-drawer .k360-drawer-checkout, .k360-drawer .k360-drawer-checkout:focus { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 52px !important; margin: 0 !important; border-radius: 8px !important; background: var(--k360-red) !important; color: #fff !important; font-size: 15.5px !important; font-weight: 600 !important; line-height: 1 !important; transition: background 0.2s ease !important; }
.k360-drawer .k360-drawer-checkout:hover { background: var(--k360-red-dark) !important; color: #fff !important; }
.k360-drawer .k360-drawer-checkout:focus-visible { outline: 2px solid var(--k360-ink) !important; outline-offset: 3px !important; }
.k360-drawer .k360-drawer-foot .k360-drawer-continue, .k360-drawer .k360-drawer-foot .k360-drawer-continue:hover, .k360-drawer .k360-drawer-foot .k360-drawer-continue:focus { display: block !important; width: 100% !important; margin-top: 12px !important; padding: 6px 0 !important; border: none !important; border-radius: 0 !important; background: transparent !important; color: var(--k360-muted) !important; font-size: 13.5px !important; font-weight: 400 !important; line-height: 1.2 !important; text-align: center !important; cursor: pointer !important; }
.k360-drawer .k360-drawer-foot .k360-drawer-continue:hover { color: var(--k360-ink) !important; }

@media (max-width: 480px) {
    .k360-drawer { width: 100vw !important; }
    .k360-drawer-head { padding: 16px 18px !important; }
    .k360-drawer.is-busy .k360-drawer-head::after { top: 68px !important; }
    .k360-drawer-items { padding: 0 18px !important; }
    .k360-drawer-foot { padding: 16px 18px calc(18px + env(safe-area-inset-bottom, 0px)) !important; }
}

@keyframes k360-spin { to { transform: rotate(360deg); } }
@keyframes k360-slide { 0% { left: -40%; } 100% { left: 100%; } }
@keyframes k360-pop { 0% { transform: scale(0.6); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
    .k360-drawer, .k360-drawer-overlay, .k360-fab, .k360-drawer-item, .k360-drawer .k360-drawer-close { transition: none !important; animation: none !important; }
}