/* One public pill design, based on [ehbo_cursus]. Position and status
 * colours belong to the components; shape and typography are shared here.
 * Start guarantee/success uses the shortcode's compact italic variant.
 */
:root {
  --ffehbo-pill-radius: 999px;
  --ffehbo-pill-height: 28px;
  --ffehbo-pill-padding: 7px 18px 6px;
  --ffehbo-pill-font-size: 11px;
  --ffehbo-pill-font-weight: 700;
  --ffehbo-pill-letter-spacing: 0.06em;
  --ffehbo-pill-success-background: #01b47a;
}

body:not(.wp-admin) :is(
  .ehbo-row__course-badge,
  .startgarantie-flag.ehbo-row__startgarantie-top,
  .ffehbo-account-booking__course-type,
  .ffehbo-account-certificates__course-type,
  .ffehbo-account-booking__start-guarantee,
  .ffehbo-account-booking__status-pill,
  .ffehbo-account-booking__attendance-pill,
  .ffehbo-account-booking__action-pill,
  .ffehbo-account-booking__result-badge,
  .ffehbo-account-booking__certificate-validity-badge,
  .ffehbo-account-certificates__validity-pill,
  .ffehbo-account-bookings__archived-chip,
  .ffehbo-stock-pill,
  .ff-variation-stock-pill,
  .ffehbo-sale-pill,
  .onsale,
  .ffehbo-payment-pill,
  .ffehbo-product-stock-badge,
  .ffehbo-fly-cart-reservation-badge,
  .ffehbo-thankyou__reservation-badge,
  .ffehbo-course-reservation-price__label,
  .ffehbo-reservation-pill,
  .ff-mobile-savings-pill,
  .ffehbo-badge
) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  width: fit-content !important;
  max-width: 100%;
  height: auto !important;
  min-width: 0 !important;
  min-height: var(--ffehbo-pill-height) !important;
  padding: var(--ffehbo-pill-padding) !important;
  border-radius: var(--ffehbo-pill-radius) !important;
  font-family: var(--cmsmasters-text-font-family) !important;
  font-size: var(--ffehbo-pill-font-size) !important;
  font-weight: var(--ffehbo-pill-font-weight) !important;
  font-style: normal !important;
  line-height: 1 !important;
  letter-spacing: var(--ffehbo-pill-letter-spacing) !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  white-space: nowrap;
}

body:not(.wp-admin) :is(
  .ehbo-row__course-badge,
  .startgarantie-flag.ehbo-row__startgarantie-top,
  .ffehbo-account-booking__course-type,
  .ffehbo-account-certificates__course-type,
  .ffehbo-account-booking__start-guarantee,
  .ffehbo-account-booking__status-pill,
  .ffehbo-account-booking__attendance-pill,
  .ffehbo-account-booking__action-pill,
  .ffehbo-account-booking__result-badge,
  .ffehbo-account-booking__certificate-validity-badge,
  .ffehbo-account-certificates__validity-pill,
  .ffehbo-account-bookings__archived-chip,
  .ffehbo-stock-pill,
  .ff-variation-stock-pill,
  .ffehbo-sale-pill,
  .onsale,
  .ffehbo-payment-pill,
  .ffehbo-product-stock-badge,
  .ffehbo-fly-cart-reservation-badge,
  .ffehbo-thankyou__reservation-badge,
  .ffehbo-course-reservation-price__label,
  .ffehbo-reservation-pill,
  .ff-mobile-savings-pill,
  .ffehbo-badge
)[hidden] {
  display: none !important;
}

body:not(.wp-admin) :is(.ehbo-row__course-badge, .ffehbo-account-booking__course-type--basic, .ffehbo-account-certificates__course-type--basic) {
  background: #fcda97;
  color: var(--cmsmasters-colors-secondary);
}
body:not(.wp-admin) :is(.ehbo-row--course-kind-repeat .ehbo-row__course-badge, .ffehbo-account-booking__course-type--repeat, .ffehbo-account-certificates__course-type--repeat) {
  background: #b7d6e8;
}

body:not(.wp-admin) :is(
  .startgarantie-flag.ehbo-row__startgarantie-top,
  .ffehbo-account-booking__start-guarantee,
  .ffehbo-account-booking__status-pill--complete,
  .ffehbo-account-booking__status-pill--past,
  .ffehbo-account-certificates__validity-pill--valid
) {
  padding: 1px 9px !important;
  border: 1px solid var(--ffehbo-pill-success-background) !important;
  background: var(--ffehbo-pill-success-background) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-style: italic !important;
  letter-spacing: normal !important;
  text-transform: lowercase !important;
}

/* Child labels must not retain older page-specific typography. */
body:not(.wp-admin) :is(
  .startgarantie-text,
  .ffehbo-account-certificates__validity-label,
  .ff-variation-stock-pill__status,
  .ff-variation-stock-pill__detail,
  .ffehbo-delivery-time
) {
  font: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
  color: inherit;
}

body:not(.wp-admin) :is(
  .startgarantie-icon,
  .ffehbo-account-certificates__validity-icon,
  .ffehbo-account-booking__start-guarantee > span:first-child,
  .ffehbo-account-booking__status-pill > span:first-child
) {
  display: inline-flex;
  flex: 0 0 20px;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
}
body:not(.wp-admin) :is(
  .startgarantie-icon,
  .ffehbo-account-certificates__validity-icon,
  .ffehbo-account-booking__start-guarantee,
  .ffehbo-account-booking__status-pill--complete,
  .ffehbo-account-booking__status-pill--past
) svg.e-fas-check {
  display: block;
  width: 17px !important;
  height: 17px !important;
  fill: currentColor !important;
  stroke: none !important;
}

/* One reservation pill for cart, checkout, Fly Cart and order confirmation.
 * CSS also covers plugin-generated/AJAX markup without changing payment data. */
body:not(.wp-admin) :is(
  .ffehbo-reservation-pill,
  .ffehbo-fly-cart-reservation-badge,
  .ffehbo-thankyou__reservation-badge,
  .ffehbo-course-reservation-price__label
) {
  background: var(--e-global-color-primary, var(--cmsmasters-colors-primary)) !important;
  color: var(--e-global-color-secondary, var(--cmsmasters-colors-secondary)) !important;
}

body:not(.wp-admin) .ffehbo-course-reservation-price__label {
  position: static !important;
}

body:not(.wp-admin) :is(
  .ffehbo-reservation-pill,
  .ffehbo-fly-cart-reservation-badge,
  .ffehbo-thankyou__reservation-badge,
  .ffehbo-course-reservation-price__label
)::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  background: currentColor;
  mask: url("../images/icons/calendar.svg") center / contain no-repeat;
  -webkit-mask: url("../images/icons/calendar.svg") center / contain no-repeat;
}

/* Stacked circular image badge, using the shared badge typography and radius. */
body:not(.wp-admin) .ffehbo-badge.ffehbo-badge--navulling {
  flex-direction: column;
  width: 56px !important;
  height: 56px !important;
  padding: 4px !important;
  gap: 3px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
