/**
 * widgets/ui/ad-slot — 광고 한 칸 (배너 또는 점선 모집 박스)
 *
 * 높이는 --w-ad-slot-h 로 칸마다 다르게 준다(위젯이 style 속성으로 주입).
 */
.w-ad-slot {
    --w-ad-slot-h:      88px;
    --w-ad-slot-border: #d1d5db;
    --w-ad-slot-fg:     #b6bcc6;
    --w-ad-slot-radius: 8px;
    --w-ad-slot-gap:    0.4rem;

    display: block;
    height: var(--w-ad-slot-h);
    border-radius: var(--w-ad-slot-radius);
    overflow: hidden;
}

/* ── 모집 박스 ───────────────────────────────────── */
.w-ad-slot.is-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed var(--w-ad-slot-border);
    color: var(--w-ad-slot-fg);
    text-decoration: none;
    background: transparent;
}

.w-ad-slot__inner {
    display: inline-flex;
    align-items: center;
    gap: var(--w-ad-slot-gap);
    font-size: 0.8125rem;
    line-height: 1;
}

.w-ad-slot__inner i { font-size: 0.9375rem; }

/* 링크일 때만 호버 — 프로젝트 규칙(배경 #f1f5f9 / 텍스트 #64748b) */
a.w-ad-slot.is-empty:hover {
    background: #f1f5f9;
    color: #64748b;
    text-decoration: none;
}

/* ── 실제 배너 ───────────────────────────────────── */
.w-ad-slot.is-filled a,
.w-ad-slot.is-filled img {
    display: block;
    width: 100%;
    height: 100%;
}

.w-ad-slot.is-filled img { object-fit: cover; }

/* 정사각형 칸 — 날개 배너. 칸 폭이 사이트마다 달라도 배너가 잘리지 않는다(v7/css/advertisement.css:34-39). */
.w-ad-slot.is-square { height: auto; aspect-ratio: 1; }
.w-ad-slot.is-square.is-filled img { object-fit: fill; }

/* ── 로테이션 ─────────────────────────────────────
   🔴 필고 v7 의 배너 로테이션 JS(/v7/js/advertisement.js)가 붙였다 떼는 클래스다.
      그 JS 는 [data-adv-group] 요소에 adv-hidden 을 토글할 뿐이고, 실제로 감추는 것은
      CSS 다. v7 은 이 규칙을 .v7-top-banner·.v7-mobile-banners 하위에만 두었으므로
      (v7/css/advertisement.css:25,65) 이 위젯은 자체 규칙을 반드시 가져야 한다.
      빠뜨리면 배너가 전부 겹쳐 보인다. */
.w-ad-slot.adv-hidden { display: none; }