.lichtxpert-ar-launcher { margin-top: 1rem; margin-bottom: 1rem; }

/* Trigger buttons — let Flatsome's .button classes do the visual styling. */
.lichtxpert-ar-launcher__btn { cursor: pointer; }

/* AR icon alignment inside trigger button and link.
   Two-class selectors (matching device-switch block above) outrank Flatsome's single-class .flex. */
.lichtxpert-ar-launcher .lichtxpert-ar-launcher__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}
.lichtxpert-ar-launcher .lichtxpert-ar-launcher__icon {
    flex-shrink: 0;
    vertical-align: middle;
}

/* Device switching. Selectors are scoped under .lichtxpert-ar-launcher (two-class
   specificity) ON PURPOSE: Flatsome's single-class `.flex { display: flex }` is
   enqueued AFTER this stylesheet, so a single-class `.lichtxpert-ar-launcher__link`
   rule would lose the cascade by source order and BOTH buttons would show. The
   two-class scope outranks `.flex` regardless of load order. */
.lichtxpert-ar-launcher .lichtxpert-ar-launcher__link { display: none; }

/* Touch devices: hide the modal trigger, show the direct AR link (1-tap). */
@media (hover: none) and (pointer: coarse) {
    .lichtxpert-ar-launcher .lichtxpert-ar-launcher__open { display: none; }
    .lichtxpert-ar-launcher .lichtxpert-ar-launcher__link { display: inline-flex; }
}

/* Modal */
.lichtxpert-ar-modal[hidden] { display: none; }
.lichtxpert-ar-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.lichtxpert-ar-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}
.lichtxpert-ar-modal__dialog {
    position: relative;
    background: #fff;
    border-radius: 6px;
    padding: 24px;
    max-width: 320px;
    width: calc(100% - 32px);
    text-align: center;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
}
.lichtxpert-ar-modal__close {
    position: absolute;
    top: 8px;
    right: 12px;
    background: none;
    border: 0;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
    color: #444;
}
.lichtxpert-ar-modal__headline { font-weight: 600; margin: 0 0 4px; }
.lichtxpert-ar-modal__qr { margin: 8px auto 12px; }
.lichtxpert-ar-modal__qr svg {
    width: 220px;
    height: auto;
    max-width: 100%;
    display: block;
    margin: 0 auto;
}
.lichtxpert-ar-modal__sublabel { margin: 8px 0 0; font-size: 0.9em; color: #555; }
