/* Полностью изолированные стили баннера */
#asb-container {
    display: none;
    width: 100%;
    position: fixed;
    /* Баннер приклеен под хедер. Если хедер 60px, ставим 60px. 
       Если на лендинге хедер другой — JS поправит это ниже */
    top: var(--asb-top-offset, 60px); 
    left: 0;
    z-index: 999999; /* Поверх всего */
    box-sizing: border-box;
}

.asb-banner {
    all: initial; /* Сброс всех наследуемых стилей сайта */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 45px 0 16px;
    min-height: 48px;
    font-family: 'Inter', -apple-system, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #333333;
    position: relative;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    animation: asbSlideDown 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Типы */
.asb-banner.info { background-color: #f3f0ff !important; }
.asb-banner.warning { background-color: #f5f5dc !important; }
.asb-banner.maintenance { background-color: #FBEFE3 !important; }

.asb-content strong { font-weight: 700; margin-right: 5px; }

.asb-close {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none !important;
    border: none !important;
    cursor: pointer;
    color: #666;
    font-size: 28px;
    line-height: 1;
    padding: 5px;
    opacity: 0.7;
    transition: opacity 0.2;
}
.asb-close:hover { opacity: 1; }

@keyframes asbSlideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}

.asb-fade-out {
    transition: opacity 0.3s, transform 0.3s;
    opacity: 0;
    transform: translateY(-10px);
}

@media (max-width: 768px) {
    .asb-banner { min-height: 64px; text-align: center; }
}