/* ============================================
   PageLab - Dark Mode Centralized Styles
   Scope: .preview-content[data-theme="dark"]
   All section dark mode overrides in one place.
   ============================================ */

/* ============================================
   Preview Background (global)
   ============================================ */
.preview-content[data-theme="dark"] {
  background: var(--pl-neutral-100);
}

/* ============================================
   Section Title (shared across sections)
   ============================================ */
.preview-content[data-theme="dark"] .pl-section-title__label {
  color: var(--pl-text-link);
}

.preview-content[data-theme="dark"] .pl-section-title__desc {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-section-title__note {
  color: var(--pl-text-lowest);
}

/* ============================================
   About - Type A List
   ============================================ */
.preview-content[data-theme="dark"] .pl-about--list {
  background: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-list-card {
  background: var(--pl-alpha-gray-96);
  border-color: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-list-card__title {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-list-card__desc {
  color: var(--pl-text-secondary);
}

/* ============================================
   About - Type B Grid
   ============================================ */
.preview-content[data-theme="dark"] .pl-grid-card {
  background: var(--pl-bg-default);
}

/* ============================================
   About - Type C Card Slide
   ============================================ */
.preview-content[data-theme="dark"] .pl-slide-card__title {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-slide-card__desc {
  color: var(--pl-neutral-0);
}

/* ============================================
   About - Type D Card Swipe
   ============================================ */
.preview-content[data-theme="dark"] .pl-swipe-card {
  background: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-swipe-btn {
  background: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-swipe-controls {
  background: linear-gradient(90deg, var(--pl-bg-default) 0%, transparent 100%);
}

.preview-content[data-theme="dark"] .pl-swipe-card__overlay-bg {
  background: var(--pl-alpha-black-80);
}

/* ============================================
   About - Type E Tab
   ============================================ */
/* Override: type-e-tab uses brand color for label */
.preview-content[data-theme="dark"] .pl-about--tab .pl-section-title__label {
  color: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-tab-nav:not(.pl-tab-nav--style-b) .pl-tab-btn {
  background: var(--pl-neutral-0);
  color: var(--pl-text-accent);
  border-color: var(--pl-border-accent-light);
}

.preview-content[data-theme="dark"] .pl-tab-nav:not(.pl-tab-nav--style-b) .pl-tab-btn.is-active {
  background: var(--pl-text-accent);
  color: var(--pl-neutral-0);
  border-color: var(--pl-text-accent);
}

.preview-content[data-theme="dark"] .pl-tab-nav--style-b .pl-tab-btn.is-active {
  color: var(--pl-text-link);
  background: var(--pl-neutral-0);
}

/* ============================================
   Benefit - Type A Plus
   ============================================ */
.preview-content[data-theme="dark"] .pl-benefit__card--small {
  background: var(--pl-lightblue-70);
}

.preview-content[data-theme="dark"] .pl-benefit__card-title {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-benefit__card-sub {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-benefit__card-note {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-benefit__plus-icon {
  color: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-benefit__card--large {
  background: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-benefit__card--large .pl-benefit__card-title {
  color: var(--pl-text-invert);
}

.preview-content[data-theme="dark"] .pl-benefit__card--large .pl-benefit__card-sub {
  color: var(--pl-text-invert);
}

/* ============================================
   Benefit - Type B Img
   ============================================ */
/* Override: type-b-img uses brand color for label */
.preview-content[data-theme="dark"] .pl-benefit--img .pl-section-title__label {
  color: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-benefit__image {
  background: var(--pl-neutral-100);
}

/* ============================================
   Intro - Type A Textblock
   ============================================ */
.preview-content[data-theme="dark"] .pl-intro--textblock {
  background: var(--pl-blue-90);
}

/* ============================================
   Intro - Type B Textgrid
   ============================================ */
.preview-content[data-theme="dark"] .pl-stats-grid__label {
  color: var(--pl-text-tertiary);
}

/* ============================================
   Step - Type A Img & Type B Text
   ============================================ */
.preview-content[data-theme="dark"] .pl-step {
  background: var(--pl-neutral-100);
}

.preview-content[data-theme="dark"] .pl-step__arrow {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-text__label {
  background: var(--pl-neutral-100);
  border-color: var(--pl-text-brand);
  color: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-step-text__title {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-text__desc {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-text__arrow {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-textonly__item {
  background: var(--pl-neutral-80);
}

.preview-content[data-theme="dark"] .pl-step-textonly__label {
  background: var(--pl-neutral-100);
  border-color: var(--pl-text-brand);
  color: var(--pl-text-brand);
}

.preview-content[data-theme="dark"] .pl-step-textonly__title {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-textonly__desc {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-step-textonly__arrow {
  color: var(--pl-text-secondary);
}

/* ============================================
   Review - Type A Highlight
   ============================================ */
.preview-content[data-theme="dark"] .pl-review-highlight__quote {
  color: var(--pl-text-accent);
}

.preview-content[data-theme="dark"] .pl-review-highlight__desc {
  color: var(--pl-text-secondary);
}

/* ============================================
   Review - Type A, B, C (Card)
   ============================================ */
.preview-content[data-theme="dark"] .pl-review-card {
  background: var(--pl-alpha-white-12);
}

.preview-content[data-theme="dark"] .pl-review-card__user-name {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-review-card__user-info {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-review-card__name {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-review-card__info {
  color: var(--pl-border-default);
}

/* ============================================
   Navigation - Type A GNB Footer
   ============================================ */
.preview-content[data-theme="dark"] .pl-nav-content {
  background: var(--pl-neutral-100);
  margin-top: -74px;
  padding-top: calc(74px + var(--pl-layout-body-top));
}

.preview-content[data-theme="dark"] .pl-footer {
  background: var(--pl-neutral-100);
  border-top-color: var(--pl-text-lowest);
}

.preview-content[data-theme="dark"] .pl-footer__category-link {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__category-link:hover {
  color: var(--pl-text-primary);
}

.preview-content[data-theme="dark"] .pl-footer__category-link--bold {
  color: var(--pl-text-primary);
}

.preview-content[data-theme="dark"] .pl-footer__company-toggle {
  color: var(--pl-text-primary);
}

.preview-content[data-theme="dark"] .pl-footer__company-toggle svg {
  stroke: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-footer__address p {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__call-label {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-footer__call-number {
  color: var(--pl-text-secondary);
}

.preview-content[data-theme="dark"] .pl-footer__call-time {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__isms-text p {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__isms-text strong {
  color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__copyright {
  color: var(--pl-text-lowest);
}

.preview-content[data-theme="dark"] .pl-footer__bottom {
  border-top-color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown {
  background: var(--pl-neutral-80);
  border-color: var(--pl-border-default);
  color: var(--pl-text-primary);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown svg {
  stroke: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown:hover {
  border-color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown-list {
  background: var(--pl-neutral-80);
  border-color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown-item {
  color: var(--pl-text-primary);
}

.preview-content[data-theme="dark"] .pl-footer__dropdown-item:hover {
  background: var(--pl-alpha-white-08);
}

/* ============================================
   CTA - Type A Finish
   ============================================ */
.preview-content[data-theme="dark"] .pl-cta--finish {
  background: var(--pl-neutral-90);
}

/* ============================================
   FAQ
   ============================================ */
.preview-content[data-theme="dark"] .pl-faq {
  background: var(--pl-neutral-100);
}

.preview-content[data-theme="dark"] .pl-faq__item {
  border-bottom-color: var(--pl-neutral-20);
}

.preview-content[data-theme="dark"] .pl-faq__question {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-faq__icon {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-faq__header:hover {
  background: rgba(255, 255, 255, 0.05); /* 토큰 없음 (white-05) */
}

.preview-content[data-theme="dark"] .pl-faq__answer {
  background: transparent;
  border-color: var(--pl-border-default);
}

.preview-content[data-theme="dark"] .pl-faq__answer-title {
  color: var(--pl-neutral-0);
}

.preview-content[data-theme="dark"] .pl-faq__answer-text {
  color: var(--pl-text-secondary);
}

/* ============================================
   Etc - Caution
   ============================================ */
.preview-content[data-theme="dark"] .pl-caution {
  background: var(--pl-neutral-100);
}

.preview-content[data-theme="dark"] .pl-caution__bullet::before {
  background: var(--pl-text-lowest);
}

.preview-content[data-theme="dark"] .pl-caution__text {
  color: var(--pl-text-secondary);
}

/* ============================================
   About - Type H Compare
   ============================================ */
.preview-content[data-theme="dark"] .pl-about--compare {
  background: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-compare__card {
  background: var(--pl-neutral-90);
  border-color: var(--pl-neutral-80);
}

.preview-content[data-theme="dark"] .pl-compare__card--highlight {
  border-color: var(--pl-border-brand);
}

.preview-content[data-theme="dark"] .pl-compare__divider {
  background: var(--pl-neutral-80);
}

/* ============================================
   Benefit - Type C Pricing
   ============================================ */
.preview-content[data-theme="dark"] .pl-benefit--pricing {
  background: var(--pl-bg-default);
}

.preview-content[data-theme="dark"] .pl-pricing__card {
  background: var(--pl-neutral-90);
  border-color: var(--pl-neutral-80);
}

.preview-content[data-theme="dark"] .pl-pricing__card--popular {
  border-color: var(--pl-border-brand);
}

.preview-content[data-theme="dark"] .pl-pricing__divider {
  background: var(--pl-neutral-80);
}