/* Pricing Switcher — bkpsw- */
.bkpsw-wrap {
  display: flex;
  justify-content: center;
  padding: 20px 0;
  width: 100%;
}
.bkpsw-switch {
  display: inline-flex;
  align-items: center;
  padding: 4px;
  gap: 4px;
  background: var(--bkpsw-bg, #f3f3f7);
  border-radius: var(--bkpsw-radius, 40px);
}
.bkpsw-btn {
  padding: 8px 24px;
  border-radius: calc( var(--bkpsw-radius, 40px) - 4px );
  background: transparent;
  color: var(--bkpsw-inactive-text, #555);
  border: none;
  cursor: pointer;
  font-family: var(--bkpsw-lb-font-family, inherit);
  font-size: var(--bkpsw-lb-font-size-d, 14px);
  font-weight: var(--bkpsw-lb-font-weight, 600);
  font-style: var(--bkpsw-lb-font-style, normal);
  text-decoration: var(--bkpsw-lb-text-decoration, none);
  text-transform: var(--bkpsw-lb-text-transform, none);
  line-height: var(--bkpsw-lb-line-height-d, 1.4);
  letter-spacing: var(--bkpsw-lb-letter-spacing-d, normal);
  word-spacing: var(--bkpsw-lb-word-spacing-d, normal);
  transition: background 0.25s, color 0.25s;
}
.bkpsw-btn.bkpsw-active {
  background: var(--bkpsw-accent, #6c3fb5);
  color: var(--bkpsw-active-text, #fff);
}

/* Badge */
.bkpsw-badge {
  margin-left: 6px;
  background: #f59e0b;
  color: #fff;
  border-radius: 20px;
  padding: 2px 7px;
  vertical-align: middle;
  display: inline-block;
  font-family: var(--bkpsw-bd-font-family, inherit);
  font-size: var(--bkpsw-bd-font-size-d, 11px);
  font-weight: var(--bkpsw-bd-font-weight, 700);
  font-style: var(--bkpsw-bd-font-style, normal);
  text-decoration: var(--bkpsw-bd-text-decoration, none);
  text-transform: var(--bkpsw-bd-text-transform, none);
  line-height: var(--bkpsw-bd-line-height-d, normal);
  letter-spacing: var(--bkpsw-bd-letter-spacing-d, normal);
  word-spacing: var(--bkpsw-bd-word-spacing-d, normal);
}

/* ---- Slider style ---- */
.bkpsw-style-slider .bkpsw-switch {
  position: relative;
}
.bkpsw-style-slider .bkpsw-btn {
  position: relative;
  z-index: 1;
}

/* ---- Toggle style ---- */
.bkpsw-style-toggle .bkpsw-switch {
  gap: 10px;
  background: transparent !important;
  padding: 0;
}
.bkpsw-style-toggle .bkpsw-btn {
  background: transparent !important;
  color: var(--bkpsw-inactive-text, #555);
  border: none !important;
  padding: 0 4px;
}
.bkpsw-style-toggle .bkpsw-btn.bkpsw-active {
  color: var(--bkpsw-accent, #6c3fb5);
  background: transparent !important;
}
.bkpsw-style-toggle .bkpsw-switch::before {
  content: '';
  display: inline-block;
  width: 48px;
  height: 26px;
  background: var(--bkpsw-accent, #6c3fb5);
  border-radius: 13px;
  vertical-align: middle;
  transition: background 0.25s;
  cursor: pointer;
  flex-shrink: 0;
}
.bkpsw-style-toggle .bkpsw-switch::after {
  content: '';
  position: absolute;
  left: calc( 50% - 24px + 2px );
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  background: #fff;
  border-radius: 50%;
  transition: left 0.25s;
  pointer-events: none;
}
.bkpsw-yearly-active .bkpsw-style-toggle .bkpsw-switch::after {
  left: calc( 50% - 24px + 26px );
}

/* ---- Pricing table visibility integration ---- */
.wp-block-blockenberg-pricing-table .bkpsw-monthly,
.wp-block-blockenberg-pricing-table .bkpsw-yearly {
  display: none;
}
/* When page is in monthly mode */
body.bkpsw-page-monthly .wp-block-blockenberg-pricing-table .bkpsw-monthly,
.bkpsw-monthly-active ~ .wp-block-blockenberg-pricing-table .bkpsw-monthly {
  display: '';
}
/* When page is in yearly mode */
body.bkpsw-page-yearly .wp-block-blockenberg-pricing-table .bkpsw-yearly,
.bkpsw-yearly-active ~ .wp-block-blockenberg-pricing-table .bkpsw-yearly {
  display: '';
}

@media (max-width: 1024px) {
    .bkpsw-btn {
        font-size: var(--bkpsw-lb-font-size-t, 14px);
        line-height: var(--bkpsw-lb-line-height-t, 1.4);
        letter-spacing: var(--bkpsw-lb-letter-spacing-t, normal);
        word-spacing: var(--bkpsw-lb-word-spacing-t, normal);
    }
    .bkpsw-badge {
        font-size: var(--bkpsw-bd-font-size-t, 11px);
        line-height: var(--bkpsw-bd-line-height-t, normal);
        letter-spacing: var(--bkpsw-bd-letter-spacing-t, normal);
        word-spacing: var(--bkpsw-bd-word-spacing-t, normal);
    }
}

@media (max-width: 767px) {
    .bkpsw-btn {
        font-size: var(--bkpsw-lb-font-size-m, 14px);
        line-height: var(--bkpsw-lb-line-height-m, 1.4);
        letter-spacing: var(--bkpsw-lb-letter-spacing-m, normal);
        word-spacing: var(--bkpsw-lb-word-spacing-m, normal);
    }
    .bkpsw-badge {
        font-size: var(--bkpsw-bd-font-size-m, 11px);
        line-height: var(--bkpsw-bd-line-height-m, normal);
        letter-spacing: var(--bkpsw-bd-letter-spacing-m, normal);
        word-spacing: var(--bkpsw-bd-word-spacing-m, normal);
    }
}
