/* ══════════════════════════════════════════════════════════════
   Member Zoom CTA — 홈 최상단 '다음 ZOOM' 카드
   ══════════════════════════════════════════════════════════════ */

.zoom-cta {
    background: var(--color-primary-50);
    border: 1px solid var(--color-primary-100, #dbeafe);
    border-radius: var(--radius-xl);
    padding: var(--space-4) var(--space-5);
    margin-bottom: var(--space-4);
}

.zoom-cta-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

.zoom-cta-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: var(--radius-full);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
}

/* 우측 상단 '전체 보기' → 캘린더 > 일정.
   원래 '오늘/내일' 라벨이 있던 자리다 — 날짜는 제목 줄의 시각 앞으로 옮겼다. */
.zoom-cta-all {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 4px 0 4px var(--space-2);
    border: none;
    background: none;
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    color: var(--color-primary);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.zoom-cta-title {
    font-size: var(--text-lg);
    font-weight: var(--font-extrabold);
    color: var(--color-text);
    line-height: 1.35;
    margin-bottom: var(--space-3);
}

.zoom-cta-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
}

.zoom-cta-meta {
    font-size: var(--text-sm);
    color: var(--color-text-sub);
    /* 긴 코치명·안내 문구가 버튼을 밀어내지 않게 (flex item 은 min-width:auto 가 기본) */
    min-width: 0;
    flex: 1 1 auto;
}

.zoom-cta-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* 44px 터치 영역 */
    min-height: 44px;
    padding: 0 var(--space-5);
    border-radius: var(--radius-lg);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-base);
    font-weight: var(--font-bold);
    text-decoration: none;
}

.zoom-cta-btn-off {
    background: var(--color-gray-200);
    color: var(--color-text-muted);
    cursor: default;
}

.zoom-cta .zoom-cred {
    margin-top: var(--space-3);
}

/* ── 아래 한 줄: 복습클래스 ──────────────────────────────────
   같은 카드 안에서 구분선으로만 나눈다. 풀카드로 승격하면 아래
   훈련 카드가 첫 화면(844px) 밖으로 밀린다 — member-zoom-cta.js 주석 참조. */
.zoom-cta-sub {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 44px;
    margin-top: var(--space-3);
    padding-top: var(--space-3);
    border-top: 1px solid var(--color-primary-100, #dbeafe);
}

.zoom-cta-sub-label {
    flex-shrink: 0;
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    color: var(--color-primary);
}

.zoom-cta-sub-text {
    /* 긴 닉네임이 버튼을 밀어내지 않게 (flex item 은 min-width:auto 가 기본) */
    min-width: 0;
    flex: 1 1 auto;
    font-size: var(--text-sm);
    color: var(--color-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zoom-cta-sub-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* 44px 터치 영역 — 행 높이도 이 값이 잡는다 */
    min-height: 44px;
    padding: 0 var(--space-4);
    border-radius: var(--radius-lg);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    text-decoration: none;
}

.zoom-cta-sub-btn-off {
    background: transparent;
    color: var(--color-text-muted);
    padding: 0;
    cursor: default;
}