/* SPACE2047 HOTSPOTS NO OVERLAP COMMERCE FIX */

/* Keep text visible on hover for every hotspot. */
.s2047-hotspot:hover,
.s2047-hotspot:focus,
.s2047-hotspot:active,
.s2047-hotspot:hover strong,
.s2047-hotspot:hover span,
.s2047-hotspot:focus strong,
.s2047-hotspot:focus span,
.s2047-hotspot:active strong,
.s2047-hotspot:active span {
    opacity: 1 !important;
    visibility: visible !important;
}

.s2047-hotspot strong,
.s2047-hotspot span {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    white-space: normal !important;
    line-height: 1.15 !important;
}

.s2047-hotspot:hover strong,
.s2047-hotspot:hover span,
.s2047-hotspot:focus strong,
.s2047-hotspot:focus span,
.s2047-hotspot:active strong,
.s2047-hotspot:active span {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    text-shadow: none !important;
}

.s2047-hotspot:hover,
.s2047-hotspot:focus,
.s2047-hotspot:active {
    background: rgba(233,196,106,.95) !important;
    border-color: #e9c46a !important;
}

/* Make both restored commerce hotspots visible and same style as existing labels. */
.s2047-hotspot.hs-buy-books,
.s2047-hotspot.hs-merch {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 95 !important;
    min-width: 225px !important;
    min-height: 68px !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
}

/* Clear no-overlap desktop positions.
   Merch is moved away from Characters/Window.
   Buy My Books is restored in a separate lower-left empty position. */
.s2047-hotspot.hs-buy-books {
    left: 7% !important;
    top: 70% !important;
    right: auto !important;
    bottom: auto !important;
}

.s2047-hotspot.hs-merch {
    right: 7% !important;
    top: 70% !important;
    left: auto !important;
    bottom: auto !important;
}

/* Hide Cedric bubble if an older cached version leaves it behind. */
.s2047-character-bubble,
.s2047-hotspot.hs-cedric {
    display: none !important;
}

/* Mobile: stack them lower and apart, without covering existing top hotspots. */
@media (max-width: 700px) {
    .s2047-hotspot.hs-buy-books,
    .s2047-hotspot.hs-merch {
        min-width: 160px !important;
        max-width: 42vw !important;
        min-height: 56px !important;
        padding: 8px 9px !important;
    }

    .s2047-hotspot.hs-buy-books {
        left: 4% !important;
        top: 72% !important;
        right: auto !important;
    }

    .s2047-hotspot.hs-merch {
        right: 4% !important;
        top: 72% !important;
        left: auto !important;
    }

    .s2047-hotspot strong {
        font-size: .76rem !important;
    }

    .s2047-hotspot span {
        font-size: .66rem !important;
    }
}