/**
 * widgets/ad/small-banners — 작은 배너 (92×46 이미지 + 문구 2줄)
 *
 * 🔴 필고 v7 의 .v7-small-banners 배치를 재현한다
 *    (v7/css/advertisement.css:129-179 참고 — 그 파일을 로드하지는 않는다).
 *
 * 🔴 색은 사이트 변수(--site-*)를 쓴다. v7 은 --wa-color-text 를 썼지만,
 *    멀티사이트는 사이트마다 색이 다르므로 사이트 토큰을 따른다.
 */
.w-small-banners {
    --w-small-banners-img-w:  92px;
    --w-small-banners-img-h:  46px;
    --w-small-banners-gap:    12px;
    --w-small-banners-radius: 4px;

    margin-bottom: 16px;
}

.w-small-banners a {
    display: flex;
    align-items: center;
    gap: var(--w-small-banners-gap);
    padding: 6px 0;
    text-decoration: none;
    color: var(--site-text, inherit);
}

/* 호버 — 프로젝트 규칙(배경 #f1f5f9 / 텍스트 #64748b)을 따르되,
   배너 이미지 위에 배경을 깔지 않도록 문구 쪽만 바꾼다 */
.w-small-banners a:hover { text-decoration: none; }
.w-small-banners a:hover .w-small-banners__text { color: #64748b; }

.w-small-banners img {
    display: block;
    flex-shrink: 0;
    width: var(--w-small-banners-img-w);
    height: var(--w-small-banners-img-h);
    object-fit: cover;
    border-radius: var(--w-small-banners-radius);
}

.w-small-banners__text {
    display: block;
    min-width: 0;
    overflow: hidden;
}

.w-small-banners__primary,
.w-small-banners__secondary {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.w-small-banners__primary { font-size: 0.9375rem; }

.w-small-banners__secondary {
    font-size: 0.8125rem;
    color: var(--site-muted, #666);
}
