#selection { /* override the style.php for promoters page */
        margin-left: 0px !important;
        width: auto !important;
    }
    
    .seatmap-controller {
        display: flex;
        height: 100vh;
        flex-direction: row;
        justify-content: space-evenly;
        background-color: transparent;
        gap: 1em;
        width: 100%;
    }

    .seatmap-window {
        overflow: hidden;
        background-color: #fff;
        position: relative;
        display: block;
        touch-action: auto;
        user-select: none;
        border: 1px solid #ccc;
        flex: 1 1 auto;
        cursor: grab
    }
    
    .seatmap-window.is-fullscale,
    .seatmap-window.is-fullscale .seatmap-content {
        touch-action: auto;
    }

    .seatmap-window:not(.is-fullscale),
    .seatmap-window:not(.is-fullscale) .seatmap-content {
        touch-action: none;
    }
    
    .seatmap-controller .seatmap-tickets {
        background-color: #fff;
        height: 100%;
        width: 100%;
        flex: 0 0 min(30%, 480px);
    }
    
    .seatmap-content{
        background-size: cover;
        user-select: none;
        touch-action: none;
        top: 0;
        left: 0;
        transform-origin: 0 0;
        transition: transform 0.2s ease;
        position: relative;
    }
    
    .seatmap-buttons {
        z-index: 10;
        display: flex;
        flex-direction: column;
        gap: 0.25em;
        position: absolute;
        top: 1em;
        right: 1em;
        color: #666;
    }
    
    .seatmap-buttons button {
        width: 2.25em;
        height: 2em !important;
        background-color: #ddd;
        border: none !important;
        border-radius: 5px;
        color: #666;
        padding: 5px !important;
        cursor: pointer
    }
    
    .seatmap-buttons button.zoom-reset-button {
        justify-content: center;
        align-items: center;
        display: flex;
        background-image: url(/icons/zoom_out.svg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: 1em;
    }
    
    .seatmap-preview {
        z-index: 10;
        width: 15%;
        display: flex;
        position: absolute;
        top: 1em;
        left: 1em;
        border: 1px solid black;
        background-size: contain;
        background-repeat: no-repeat;
        box-sizing: border-box;
        overflow: hidden;
    }
    
    
    .seatmap-preview-highlighted {
        z-index: 12;
        border: 1px solid #ffcc66;
        background-color: #ffcc6699;
        position: absolute;
        width: 100%;
        height: 100%;
    }
    

    .seatmap-toolbar {
        padding: 1em;
        top:0;
        width:100%;
        position:absolute;
        box-sizing: border-box;
        transition: all 0.1s ease;
        z-index: 10;
    }


    @media (max-width: 800px) {
        .seatmap-controller {
            flex-direction: column;
            height: auto;
        }

        .seatmap-window {
            flex: 0 0 80vh;
            width: 100%;
        }

        .seatmap-tickets {
            flex: 1 0 auto; 
        }
    }