/**
 * jp-cloud-erp-pricing-cta.css
 *   Pages: body.page-id-114415  /de/warenwirtschaftssystem-software/jtl-warenwirtschaft-cloud/
 *          body.page-id-268013  /en/erp-software/jtl-cloud-erp/
 *
 * QA (Christoph): "In the Pricing Section the CTA Buttons are in the old Style."
 * Design ref: Figma 203:3629 (JTL Wawi Preisboxen).
 *
 * Two old-style things in the pricing cards vs the Figma:
 *
 * 1) FEATURED ("Beliebte Edition" / "Best buy") CTA — rendered white fill +
 *    orange border with a dark label. Figma = SOLID ORANGE pill with WHITE
 *    label. (Non-featured cards already use the cream outline pill = correct.)
 *    The plugin paints the featured button white via an 8-class `!important`
 *    rule in style.css; mirror that full chain + a `body.page-id` prefix and use
 *    the `background` shorthand so this wins on specificity.
 *
 * 2) FEATURE-ROW ICON — the cards mark each feature with an orange ARROW
 *    (`span.card-arrow` holding an inline arrow SVG). Figma uses an orange
 *    CHECKMARK. Hide the inline arrow SVG and paint a checkmark as a
 *    font-independent inline-SVG background on the span (orange #FB581F), across
 *    every card in the section.
 *
 * Scoped to the two cloud-ERP pages only.
 */

/* 1 — featured CTA: solid orange pill, white label, hover darken. */
body:is(.page-id-114415, .page-id-268013) .product-price-plan-section.orange
    .dark-card-items .dark-card-item.show-pro-plan .dark-card-item__bottom
    .dark-card-item__card-link-wrapper a.card-link {
    background: #fb581f !important;
    border: 2px solid #fb581f !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
body:is(.page-id-114415, .page-id-268013) .product-price-plan-section.orange
    .dark-card-items .dark-card-item.show-pro-plan .dark-card-item__bottom
    .dark-card-item__card-link-wrapper a.card-link span,
body:is(.page-id-114415, .page-id-268013) .product-price-plan-section.orange
    .dark-card-items .dark-card-item.show-pro-plan .dark-card-item__bottom
    .dark-card-item__card-link-wrapper a.card-link .text {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
body:is(.page-id-114415, .page-id-268013) .product-price-plan-section.orange
    .dark-card-items .dark-card-item.show-pro-plan .dark-card-item__bottom
    .dark-card-item__card-link-wrapper a.card-link:hover {
    background: #e44a17 !important;
    border-color: #e44a17 !important;
}

/* 2 — feature-row marker: arrow -> orange checkmark. */
body:is(.page-id-114415, .page-id-268013) section.product-price-plan-section .card-arrow svg {
    display: none !important;
}
body:is(.page-id-114415, .page-id-268013) section.product-price-plan-section .card-arrow {
    display: inline-block !important;
    width: 18px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23FB581F'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpolyline%20points='4,12%2010,18%2020,6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px 16px !important;
}