/*
 * 랜딩페이지 편집모달 — 부가설정 탭 (.lpxt-*)  2026-08-22 신설
 * 구 이벤트설정·하단정보 두 탭을 A-4 전폭 2컬럼으로 통합: 좌 = 이벤트(팝업·동작) | 우 = 하단정보.
 * 반응형 = 컨테이너 쿼리(.lpxt-wrap 이 컨테이너, rmm 모달 드래그 리사이즈 대응) ≤1100px 1컬럼.
 * 내부 콘텐츠 스타일은 기존 그대로(.sset-card / landing-page-footer JS 렌더) — 여기는 골격만.
 * (통계 .lps- / 보안 .lpsec- / 마케팅 .lpmk- 와 같은 탭 골격 문법 — 추후 공용화 후보)
 */

.lpxt-wrap {
  container-type: inline-size;
  text-align: left;
  color: #374151;
}

/* ── 상단: 액센트 타이틀 ── */
.lpxt-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.lpxt-title { font-size: 15px; font-weight: 800; color: #0f172a; padding-left: 10px; border-left: 4px solid #3e6187; letter-spacing: -0.2px; }
.lpxt-sub { font-size: 11.5px; color: #94a3b8; }

/* ── 2컬럼: 좌 이벤트 | 우 하단정보 (상담사 제한 모드 = 이벤트만 1컬럼) ── */
.lpxt-cols {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.lpxt-cols-single { grid-template-columns: minmax(0, 1fr); max-width: 860px; }
.lpxt-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

/* ── 섹션 카드 — A-4 언어: 헤더 밴드 + 본문 ── */
.lpxt-sec { background: #ffffff; border: 1px solid #dbe6f0; border-radius: 10px; overflow: hidden; }
.lpxt-sec-title {
  font-size: 12px;
  font-weight: 700;
  color: #3e6187;
  margin: 0;
  padding: 8px 14px;
  background: #f3f7fb;
  border-bottom: 1px solid #e4edf5;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.lpxt-sec-meta { font-size: 10.5px; font-weight: 400; color: #94a3b8; }
.lpxt-sec-bd { padding: 12px 14px; }

/* ── 반응형 (컨테이너 쿼리 — .lpxt-wrap 폭 기준) ── */
@container (max-width: 1100px) {
  .lpxt-cols { grid-template-columns: minmax(0, 1fr); }
}