/* =========================================================================
   Irish Farmers Journal — Flip-Pay house style  ·  "Modules" design
   Matches the IFJ subscribe-page design system (design-system_1):
   flat bordered plan cards, sharp 2px CTAs (weight 900), display-serif prices,
   gold "pro"/featured treatment, viridian ticks. Content stays live from
   Flip-Pay — this only restyles what Flip-Pay renders.
   Scope: everything under .ifj-fp. Variables first; scoped enhancements second.
   ========================================================================= */
.ifj-fp #flip-pay,
.ifj-fp {
  /* --- Brand --- */
  --fp_brand_primary_color:   #BD1F21; /* c-red */
  --fp_brand_secondary_color: #4D5856; /* c-carbon-light */
  --fp_brand_popular_color:   #C9A84C; /* c-gold — featured/"pro" CTA + ribbon */

  /* --- Buttons (.btn / .btn-primary) --- */
  --fp_btn_bg_color:            #BD1F21;
  --fp_btn_text_color:          #FFFFFF;
  --fp_btn_bg_color_hover:      #8E1719; /* c-red-dark */
  --fp_btn_text_color_hover:    #FFFFFF;
  --fp_btn_border_color:        #BD1F21;
  --fp_btn_border_radius:       2px;    /* --r-ifj: sharp IFJ corners */
  --fp_btn_font_size:           13px;
  --fp_btn_font_weight_regular: 900;
  --fp_btn_text_transform:      uppercase;
  --fp_btn_font_family:         'Interstate', system-ui, sans-serif;

  /* --- Cards & layout (.plan / .plans) --- */
  --fp_bg_card_color:      #FFFFFF;
  --fp_bg_wrapper_color:   #FAF7F2; /* c-parchment */
  --fp_border_radius_card: 12px;    /* --r-card */
  --fp_cards_gap:          24px;    /* --s-6 */
  --fp_box_shadow_card:    none;    /* plans are flat + bordered (border added below) */

  /* --- Typography --- */
  --fp_text_default_color:   #141C1A; /* c-carbon */
  --fp_text_secondary_color: #6B6560; /* c-slate */
  --fp_font_family_base:     'Interstate', system-ui, sans-serif;
  --fp_font_family_title:    'Coranto2 Headline', 'Coranto2', Georgia, serif;
  --fp_font_size_base:       14px;
  --fp_font_size_plan_name:  22px;
  --fp_font_size_price_big:  44px;    /* .t-price */
  --fp_font_size_price_span: 14px;
  --fp_font_size_card_title: 11px;
}

/* ---- Cards: flat, 1px warm border, subtle hover-raise (.plan / .card-raise) ---- */
.ifj-fp #flip-pay [data-fp-element="price"].fp-price-main {
  border: 1px solid #E4DFD5;                 /* c-border */
  box-shadow: none;
  transition: border-color .2s cubic-bezier(.2,.7,.3,1), box-shadow .2s cubic-bezier(.2,.7,.3,1), transform .2s cubic-bezier(.2,.7,.3,1);
}
.ifj-fp #flip-pay [data-fp-element="price"].fp-price-main:hover {
  border-color: #B5AFA7;                      /* c-border-strong */
  box-shadow: 0 8px 24px rgba(20,28,26,.10);  /* --e-lg */
}
/* Featured/"pro" plan: 3px gold top border (.plan-pro) */
.ifj-fp #flip-pay [data-fp-element="price"].fp-special-border {
  border-top: 3px solid #C9A84C !important;
}

/* ---- Buttons: block, tall, sharp, heavy (.btn / .btn-block) ---- */
.ifj-fp #flip-pay .fp-btn {
  width: 100%;
  max-width: none;
  min-height: 48px;
  padding: 12px 26px;
  border-width: 2px;
  letter-spacing: .06em;
}
/* Featured CTA = gold "pro" button: dark ink on gold, carbon on hover (.btn-pro) */
.ifj-fp #flip-pay [data-fp-element="price"].fp-special-border .fp-btn {
  color: #141C1A !important;
  border-color: #C9A84C !important;
}
.ifj-fp #flip-pay [data-fp-element="price"].fp-special-border .fp-btn:hover {
  background: #141C1A !important;
  color: #FFFFFF !important;
  border-color: #141C1A !important;
}

/* ---- Flatten Flip-Pay's inner panel so the plan reads as one flat card ---- */
.ifj-fp #flip-pay .fp-price-card,
.ifj-fp #flip-pay .fp-sub-plan-header {
  box-shadow: none !important;
  background: transparent !important;
}

/* ---- Plan name in carbon (accents are reserved for CTAs/badges) ---- */
.ifj-fp #flip-pay .fp-premium,
.ifj-fp #flip-pay .fp-premium-wrap,
.ifj-fp #flip-pay .fp-premium-wrap span {
  color: #141C1A !important;
}

/* ---- Price: display serif, tight tracking, carbon ink (.t-price) ---- */
.ifj-fp #flip-pay .fp-price,
.ifj-fp #flip-pay .fp-price big {
  color: #141C1A !important;
}
.ifj-fp #flip-pay .fp-price big {
  font-family: var(--fp_font_family_title);
  font-weight: 700;
  letter-spacing: -.02em;
}
.ifj-fp #flip-pay .fp-price span {
  color: #6B6560; /* "per year" → slate */
}

/* ---- Ribbon → gold pill badge (.badge / .badge-pro) ---- */
.ifj-fp #flip-pay .fp-ribbon {
  background: #C9A84C;
  color: #141C1A;
  border-radius: 999px;                 /* --r-pill */
  padding: 5px 11px;
  font-family: 'Interstate', system-ui, sans-serif;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* ---- Feature ticks → viridian "positive" (.ticks .yes .ic) ---- */
.ifj-fp #flip-pay .fp-check-mark {
  color: #1F7A61 !important;            /* c-viridian-deep */
}

/* --- Focused single-product layout --- */
.ifj-fp--focused #flip-pay .fp-sub-title.fp-redirect-to-gift,
.ifj-fp--focused #flip-pay .fp-sub-title.fp-see-all-plans,
.ifj-fp--focused #flip-pay .fp-promo-code-wrap {
  display: none !important;
}
.ifj-fp--focused #flip-pay .fp-digital-plans-wrapper,
.ifj-fp--focused #flip-pay .fp-sub-plans-wrapper {
  justify-content: center !important;
}
.ifj-fp--focused #flip-pay [data-fp-element="price"] {
  max-width: 440px;
  margin-left: auto;
  margin-right: auto;
}
