.js-alert-bait-switch {
    position: absolute;
    top: 56px; /* 36px menubar + 20px offset */
    right: -350px; /* Initially off-screen */
    width: 340px;
    background-color: #dadada;
    border: 1px solid #000;
    box-shadow: 1px 1px #111, inset 1px 1px #fff, inset -1px -1px #999;
    font-family: 'ChicagoFLF', 'Charcoal', sans-serif;
    z-index: 2000000;
    transition: right 0.5s cubic-bezier(0.19, 1, 0.22, 1), height 0.4s ease-in-out;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 120px; /* Increased initial height for two lines */
    cursor: pointer;
    pointer-events: auto;
    text-decoration: none;
    color: #000;
}

.js-alert-bait-switch.visible {
    right: 20px;
}

.js-alert-bait-switch:hover {
    height: 520px; /* Increased expanded height for more lines */
}

/* Header Style */
.js-alert-bait-switch .js-alert-header {
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid #000;
    background-image: repeating-linear-gradient(#fff 0 1px, #737373 0 2px); /* Classic OS 9 stripes */
    position: relative;
    padding: 0 4px;
    flex-shrink: 0;
}

.js-alert-bait-switch .js-alert-header-title {
    background-color: #dadada;
    padding: 0 8px;
    font-size: 12px;
    color: #000;
}

.js-alert-bait-switch .js-alert-close-box {
    position: absolute;
    left: 4px;
    top: 4px;
    height: 11px;
    width: 11px;
    border: 1px inset #fff;
    cursor: pointer;
    z-index: 10;
}

.js-alert-bait-switch .js-alert-close-box-inner {
    display: block;
    height: 9px;
    width: 9px;
    background-image: linear-gradient(to bottom right, #999, #eee, #fff);
    border: 1px solid #222;
}

/* Content Area */
.js-alert-bait-switch .js-alert-body {
    padding: 15px;
    display: flex;
    flex-direction: row;
    gap: 15px;
    align-items: center; /* Center icon and text vertically */
    flex-shrink: 0;
}

.js-alert-bait-switch .js-alert-icon-container {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.js-alert-bait-switch .js-alert-icon {
    width: 64px;
    height: 64px;
    image-rendering: pixelated;
    display: block;
}

.js-alert-bait-switch .js-alert-text-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.js-alert-bait-switch .js-alert-message {
    font-size: 15px; /* Larger font size */
    line-height: 1.2;
    font-weight: bold;
}

/* Expanded Ad Content */
.js-alert-bait-switch .js-alert-ad-content {
    padding: 15px;
    border-top: 1px solid #000;
    box-shadow: inset 0 1px #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.js-alert-bait-switch:hover .js-alert-ad-content {
    opacity: 1;
}

.js-alert-bait-switch .js-alert-product-img {
    width: 200px;
    height: 200px;
    object-fit: contain;
    margin-bottom: 12px;
    background: #fff;
    border: 1px solid #000;
    box-shadow: 1px 1px #fff;
}

.js-alert-bait-switch .js-alert-product-info {
    text-align: center;
    font-size: 12px;
    line-height: 1.4;
}

.js-alert-bait-switch .js-alert-offer {
    margin-top: 8px;
    color: #c00;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
}

.js-alert-bait-switch .js-alert-link {
    display: inline-block;
    margin-top: 12px;
    padding: 6px 20px;
    background-color: #dadada;
    border: 1px solid #000;
    box-shadow: 1px 1px #000, inset 1px 1px #fff;
    text-decoration: none;
    color: #000;
    font-size: 14px;
}
