button#mceu_0-open {
    color: #ffff;
}

button#mceu_1-button i {
    color: #ffff;
}

button#mceu_2-button i {
    color: #ffff;
}

button#mceu_3-button i {
    color: #ffff;
}

button#mceu_4-button i {
    color: #ffff;
}

button#mceu_5-button i {
    color: #ffff;
}

button#mceu_6-button i {
    color: #ffff;
}

button#mceu_7-button i {
    color: #ffff;
}

button#mceu_8-button i {
    color: #ffff;
}

button#mceu_9-button i {
    color: #ffff;
}

button#mceu_10-button i {
    color: #ffff;
}

button#mceu_11-button i {
    color: #ffff;
}

button#mceu_12-button i {
    color: #ffff;
}
span.wc-stripe-card-icons-container {
    display: none;
}

button#place_order {
    width: 200px !important;
    float: left !important;
    background: var( --e-global-color-primary );
}

button#place_order:hover {
    background: var( --e-global-color-accent );
}


.cmf-wrapper {
    max-width: 750px;
    margin: 0 auto;
    padding: 30px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    border: 1px solid #e1e1e1;
    padding: 28px;
    background: #f9f9f9;
    
    
}
ul.woocommerce-error {
    display: none;
}
.elementor-kit-211 h5 {
    margin-top: 15px;
}
/* Submit intro (2026-11-03): the H1 was left-aligned here; 6 Nov 2026, Richard: centred again (rule at the end). */
.page-id-31234 .entry-content.clear {
    max-width: 790px;
    margin: 40px auto;
}
/* Style for the tooltip */
.option {
    position: relative;
    margin-bottom: 15px;
}
/* For radio buttons */
input[type="radio"]:checked {
    accent-color: #ff335b;
}

/* For checkboxes */
input[type="checkbox"]:checked {
    accent-color: #ff335b;
}

.tooltip_rv {
    display: none;
    position: absolute;
    top : 35px;
    left: 6px;
    z-index: 1;
    background-color: #ff335b;
    color: #ffffff;
    border: 1px solid #ff335b;
    padding: 8px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    font-size: 12px;
    line-height: 14px;
}

/* Options kit (2026-11-06): the hover tooltip is replaced by the click popover (rules at the end). */



.cmf-wrapper  .email-field label {
    font-size: 16px;
    font-weight: 700;
}

/* Options kit (2026-11-06): the distribution rows are drawn as a list; rules at the end of this file. */


div#distribution-options label {
    font-size: 16px;
    font-weight: 400;
}


div#distribution-options .option{
    margin-bottom: 0px;
}

.cmf-wrapper h5 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
}

.cmf-wrapper .step.step-3 label {
     font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
}


.cmf-wrapper .step.step-3 input{
    margin: 6px 0 10px;
}

div#services-options label {
    font-size: 16px;
    font-weight: 300;
}
i.fas.fa-info-circle {
    padding: 0 6px;
}
/* Options kit (2026-11-06): the service rows are drawn as a list; rules at the end of this file. */

.img-feature {
    display: grid;
    grid-template-columns: 33% 33% 33%;
}

.checkbox-grid_rv {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 6px;
}

.accordion-header {
    border: 1px solid #333;
    padding: 8px 15px;
    display: flex;
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    border-radius: 5px;
    margin: 18px 0;
}


.accordion-header span {
    color: #333;
    font-size: 18px;
    font-weight: 600;
}



.checkbox-grid_rv label {
    font-weight: 400 !important;
    margin: 0 !important;
}


button.back-btn {
    background-color: #ff335b;
    color: #ffffff;
    border: none;
    padding: 12px 24px;
    font-size: 16px;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

h3, h4 {
    color: #333;
}

.button-row button {
    padding: 12px 24px!important;
    margin: 10px 10px 20px 0;
    background-color: #ff335b;
    border: none;
    border-radius: 8px;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease;
}

.button-row button:hover {
    background-color: #ff335b;
}

input[type="text"],
input[type="email"],
input[type="date"],
input[type="time"],
textarea,
select {
    width: 100%;
    padding: 10px;
    margin: 6px 0 20px;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.option {
    margin-bottom: 15px;
}

input[type="radio"],
input[type="checkbox"] {
    margin-right: 8px;
}

textarea {
    resize: vertical;
}

.button-row {
    display: flex;
    justify-content:center;
    margin-top: 20px;
}

.step {
    display: none;
}

.step.active {
    display: block;
}

button.final-submit-btn {
    background-color: #ff335b;
    color: #ffffff;
    border: none;
    padding: 12px 24px;
    font-size: 16px;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

button.final-submit-btn:hover {
    background-color: #ff335b; 
}

/* Submit intro (2026-11-03): the progress line and numbered circles are replaced by the step bars
   at the end of this file (.cmf-wrapper ol.cmf-progress and .cmf-progress-step). */

.woocommerce-page.woocommerce-checkout table.shop_table td, .woocommerce.woocommerce-checkout table.shop_table td
{
    padding:10px!important;
}
@media screen and (max-width: 767px) {

    .language-checkboxes {
        grid-template-columns: repeat(2, 1fr) !important;
    }


    .page .entry-header {
    margin-top: 1.5em;
}
.button-row button {
    display: block;
    width:100%;
}
.img-feature {
    grid-template-columns: auto;
    gap: 10px;
}
div#services-options .option {
    margin-bottom: 15px;
}
div#distribution-options {
    grid-template-columns: auto;
    gap: 15px;
}
.cmf-wrapper
{
  padding:20px;
}
.checkbox-grid_rv {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
}
div#services-options label {
    font-weight: 400;
}
}




#cmf-review-summary {
    margin-top: 1em;
    border-radius: 12px;
    font-family: 'Segoe UI', 'Arial', sans-serif;
    font-size: 16px;
}

.cmf-summary-row {
    margin-bottom: 18px;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}
.cmf-summary-label {
    min-width: 140px;
    color: #6c757d;
    font-weight: 500;
}
.cmf-summary-value {
    flex: 1;
    font-weight: 600;
    color: #102a43;
}

.cmf-summary-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cmf-summary-badge {
    background: #f1f7fd;
    color: #1d3b73;
    border-radius: 14px;
    padding: 3px 12px;
    font-size: 14px;
    display: inline-block;
    margin-right: 4px;
    margin-bottom: 2px;
    border: 1px solid #c2d1ee;
}


.language-checkboxes {
    display: grid;
    grid-template-columns: repeat(5, 1fr); /* 5 columns */
    gap: 12px 25px;
    margin-top: 12px;
    max-width: 100%;
}

.language-checkboxes label {
    font-weight: 500;
    color: #333;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.language-checkboxes input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #ff335b;
}


/* ==========================================================================================
   Submit intro (2026-11-03): the top of /submit-press-release/ redrawn to the design handoff.
   Tokens first: the accent is the site's primary; change it here and the whole section follows.
   ========================================================================================== */
:root {
    --cmf-accent: #ff335b;
    --cmf-ink: #1a1c1f;
    --cmf-body: #3b3f46;
    --cmf-muted: #6b6f76;
    --cmf-faint: #9a9ea6;
    --cmf-line: #e3e5e9;
    --cmf-line2: #cfd3d9;
    --cmf-surface: #f7f8f9;
    --cmf-surface2: #f1f2f4;
}

/* The intro paragraphs (page content, the direct children before the form). 6 Nov 2026 (Richard): centred. */
.page-id-31234 .entry-content > p {
    font-size: 17px;
    line-height: 1.6;
    color: var(--cmf-body);
    max-width: 640px;
    margin: 0 auto 10px;
    text-align: center;
    text-wrap: pretty;
}
.page-id-31234 .entry-content > p a {
    color: var(--cmf-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: #b9bcc2;
}
.page-id-31234 .entry-content > p a:hover {
    text-decoration-color: var(--cmf-ink);
}

/* Three points under the intro */
ul.cmf-assure {
    list-style: none;
    margin: 18px 0 32px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   /* 6 Nov 2026: centred with the intro above it */
    gap: 10px 28px;
    font-size: 14px;
    color: var(--cmf-body);
}
ul.cmf-assure li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
ul.cmf-assure li::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--cmf-accent);
    flex-shrink: 0;
}

/* The step indicator: three bars with labels (the old numbered circles are gone) */
.cmf-wrapper ol.cmf-progress {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    list-style: none;
    margin: 0 0 36px;
    padding: 0;
    position: static;
    justify-content: normal;
}
.cmf-wrapper .cmf-progress::before {
    content: none;
}
.cmf-wrapper .cmf-progress-step {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: auto;
    height: auto;
    margin: 0;
    border-radius: 0;
    background: transparent !important;
    text-align: left;
    line-height: 1.3;
    position: static;
    z-index: auto;
    transition: none;
}
.cmf-wrapper .cmf-progress-step .cmf-step-bar {
    display: block;
    height: 3px;
    border-radius: 2px;
    background: var(--cmf-line);
}
.cmf-wrapper .cmf-progress-step .cmf-step-n {
    display: block;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--cmf-faint);
}
.cmf-wrapper .cmf-progress-step .cmf-step-label {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--cmf-muted);
    margin-top: -6px;
}
.cmf-wrapper .cmf-progress-step.active {
    background: transparent !important;
}
.cmf-wrapper .cmf-progress-step.active .cmf-step-bar {
    background: var(--cmf-accent);
}
.cmf-wrapper .cmf-progress-step.active .cmf-step-n {
    color: var(--cmf-muted);
}
.cmf-wrapper .cmf-progress-step.active .cmf-step-label {
    color: var(--cmf-ink);
}
@media screen and (max-width: 359px) {
    .cmf-wrapper ol.cmf-progress {
        grid-template-columns: 1fr;
    }
}

/* The restart link under the step bars (shown only while the strip has no row of its own) */
.cmf-wrapper #cmf-new-release-row {
    text-align: right;
    font-size: 14px;
    margin: -22px 0 20px;
}
.cmf-wrapper #cmf-new-release-row a {
    color: var(--cmf-muted);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.cmf-wrapper #cmf-new-release-row a:hover {
    color: var(--cmf-ink);
}

/* Currency: heading, helper line, cards */
.cmf-wrapper .cmf-currency-title {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.25;
    text-transform: none;
    color: var(--cmf-ink);
    margin: 0 0 6px;
}
.cmf-wrapper .cmf-currency-help {
    font-size: 15px;
    line-height: 1.5;
    color: var(--cmf-muted);
    margin: 0 0 18px;
}
.cmf-wrapper .currency-buttons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    margin: 0 0 24px;
}
.cmf-wrapper .currency-buttons .currency-btn {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    margin: 0;
    padding: 16px 18px !important;
    border-radius: 10px;
    border: 1.5px solid var(--cmf-line);
    background: #fff;
    color: var(--cmf-ink);
    text-align: left;
    font-weight: 400;
    line-height: 1.2;
    text-transform: none;      /* the theme capitalises buttons; the cards are sentence case */
    letter-spacing: normal;
    box-shadow: none;
    cursor: pointer;
    transition: border-color .12s ease, box-shadow .12s ease;
}
.cmf-wrapper .currency-buttons .currency-btn:hover {
    border-color: var(--cmf-ink);
    background: #fff;
    color: var(--cmf-ink);
}
.cmf-wrapper .currency-buttons .currency-btn.active {
    border-color: var(--cmf-ink);
    box-shadow: 0 0 0 1px var(--cmf-ink);
    background: #fff;
    color: var(--cmf-ink);
}
.cmf-wrapper .currency-buttons .currency-btn:focus-visible {
    outline: 2px solid var(--cmf-accent);
    outline-offset: 2px;
}
.cmf-wrapper .cmf-cur-sym {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--cmf-surface2);
    color: var(--cmf-ink);
    font-size: 20px;
    font-weight: 700;
    flex-shrink: 0;
    transition: background .12s ease, color .12s ease;
}
.cmf-wrapper .currency-btn.active .cmf-cur-sym {
    background: var(--cmf-ink);
    color: #fff;
}
.cmf-wrapper .cmf-cur-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.cmf-wrapper .cmf-cur-code {
    font-size: 16px;
    font-weight: 700;
    color: var(--cmf-ink);
}
.cmf-wrapper .cmf-cur-name {
    font-size: 13px;
    color: var(--cmf-muted);
}

/* The Continue button at the end of step 1 (the Next buttons of the later steps are unchanged) */
.cmf-wrapper .cmf-row-continue {
    display: flex;
    justify-content: flex-end;
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px solid var(--cmf-line);
}
.cmf-wrapper .cmf-row-continue .next-btn {
    height: 46px;
    padding: 0 26px !important;
    margin: 0;
    border-radius: 8px;
    border: 0;
    background-color: var(--cmf-accent);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    line-height: 46px;
    text-transform: none;
    letter-spacing: normal;
    transition: filter .12s ease;
}
.cmf-wrapper .cmf-row-continue .next-btn:hover {
    background-color: var(--cmf-accent);
    filter: brightness(.92);
}
@media screen and (max-width: 767px) {
    .cmf-wrapper .cmf-row-continue .next-btn {
        width: 100%;
    }
}

/* The saved-release strip (drawn by the script above the form) */
.cmf-wrapper #cmf-draft-banner {
    margin: 0 0 24px;
    padding: 14px 18px;
    border: 1px solid var(--cmf-line);
    border-radius: 10px;
    background: #fff;
    font-size: 14px;
    line-height: 1.45;
    color: var(--cmf-ink);
}
.cmf-wrapper #cmf-draft-banner p {
    margin: 0 0 10px;
}
.cmf-wrapper #cmf-draft-banner p:last-child {
    margin-bottom: 0;
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-note {
    color: var(--cmf-body);
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-row + .cmf-strip-row,
.cmf-wrapper #cmf-draft-banner p + .cmf-strip-row {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--cmf-line);
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 380px;   /* wide enough that the buttons drop to their own line rather than cut the title short */
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-head {
    font-weight: 600;
}
.cmf-wrapper #cmf-draft-banner .cmf-strip-sub {
    color: var(--cmf-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cmf-wrapper #cmf-draft-banner .cmf-draft-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
    flex-shrink: 0;
}

/* Buttons in the strip and in the dialog */
.cmf-wrapper .cmf-draft-btn,
dialog.cmf-dialog .cmf-draft-btn {
    height: 38px;
    line-height: 36px;
    padding: 0 16px !important;
    margin: 0;
    white-space: nowrap;
    border-radius: 8px;
    border: 1px solid var(--cmf-line2);
    background: #fff;
    color: var(--cmf-ink);
    font-size: 14px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}
.cmf-wrapper .cmf-draft-btn:hover,
dialog.cmf-dialog .cmf-draft-btn:hover {
    border-color: var(--cmf-ink);
    background: #fff;
    color: var(--cmf-ink);
}
.cmf-wrapper .cmf-draft-btn.cmf-btn-dark,
dialog.cmf-dialog .cmf-draft-btn.cmf-btn-dark {
    background: var(--cmf-ink);
    border-color: var(--cmf-ink);
    color: #fff;
}
.cmf-wrapper .cmf-draft-btn.cmf-btn-dark:hover,
dialog.cmf-dialog .cmf-draft-btn.cmf-btn-dark:hover {
    background: #33363c;
    border-color: #33363c;
    color: #fff;
}
.cmf-wrapper .cmf-draft-btn.cmf-btn-text {
    border-color: transparent;
    background: transparent;
    color: var(--cmf-muted);
    font-weight: 500;
    padding: 0 6px !important;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.cmf-wrapper .cmf-draft-btn.cmf-btn-text:hover {
    color: var(--cmf-ink);
    background: transparent;
    border-color: transparent;
}

/* The confirm dialog for a new release */
dialog.cmf-dialog {
    width: calc(100% - 48px);
    max-width: 440px;
    margin: auto;
    border: 0;
    border-radius: 14px;
    padding: 0;
    background: #fff;
    color: var(--cmf-ink);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .25);
}
dialog.cmf-dialog::backdrop {
    background: rgba(20, 22, 26, .45);
}
dialog.cmf-dialog .cmf-dialog-panel {
    padding: 28px;
}
dialog.cmf-dialog h3 {
    margin: 0 0 10px;
    font-family: 'Oswald', sans-serif;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.25;
    text-transform: none;
    color: var(--cmf-ink);
}
dialog.cmf-dialog p {
    margin: 0 0 24px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--cmf-body);
}
dialog.cmf-dialog .cmf-draft-actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
}
dialog.cmf-dialog .cmf-draft-btn {
    height: 42px;
    line-height: 40px;
    padding: 0 18px !important;
}


/* 6 Nov 2026 (Richard): the page's H1 centred, as it was before the 3 Nov kit. */
.page-id-31234 h1.entry-title {
    text-align: center;
}


/* ==========================================================================================
   Options kit (2026-11-06): the distribution-area and services rows of step 1, the info popover
   and the running total, to the second design handoff. The rows are drawn by the script with the
   same inputs as before; only their wrapping changed.
   ========================================================================================== */
.cmf-wrapper .cmf-sec-title {
    font-family: 'Oswald', sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.25;
    text-transform: none;
    color: var(--cmf-ink);
    margin: 30px 0 6px;
}
.cmf-wrapper .cmf-sec-help,
.cmf-wrapper #cmf-services-hint {
    font-size: 15px !important;
    line-height: 1.5;
    color: var(--cmf-muted);
    margin: 0 0 18px !important;
}
.cmf-wrapper #distribution-options,
.cmf-wrapper #services-options {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0 0 8px;
    padding: 0;
    border: 1px solid var(--cmf-line);
    border-radius: 12px;
    background: #fff;
}
.cmf-wrapper #distribution-options .option.cmf-row,
.cmf-wrapper #services-options .option.cmf-row {
    position: relative;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    margin: 0;
    padding: 16px 18px;
    border-top: 1px solid var(--cmf-line);
    background: #fff;
    cursor: pointer;
    transition: background .12s ease;
}
.cmf-wrapper #services-options .option.cmf-row {
    align-items: start;
}
.cmf-wrapper .option.cmf-row:first-child {
    border-top: 0;
    border-radius: 12px 12px 0 0;
}
.cmf-wrapper .option.cmf-row:last-child {
    border-radius: 0 0 12px 12px;
}
.cmf-wrapper .option.cmf-row:hover,
.cmf-wrapper .option.cmf-row.is-checked {
    background: var(--cmf-surface);
}
.cmf-wrapper .cmf-row input.cmf-vh {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}
.cmf-wrapper .cmf-ctl-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 22px;
    margin: 0;
    cursor: pointer;
}
.cmf-wrapper .cmf-ctl {
    display: block;
    width: 18px;
    height: 18px;
    box-sizing: border-box;
    border: 1.5px solid #b9bcc2;
    background: #fff;
    transition: border-color .12s ease, background .12s ease;
}
.cmf-wrapper .cmf-ctl-radio {
    border-radius: 50%;
}
.cmf-wrapper .cmf-ctl-check {
    border-radius: 5px;
    position: relative;
}
.cmf-wrapper .cmf-row input:checked ~ .cmf-ctl-wrap .cmf-ctl-radio {
    border: 5px solid var(--cmf-ink);
}
.cmf-wrapper .cmf-row input:checked ~ .cmf-ctl-wrap .cmf-ctl-check {
    background: var(--cmf-ink);
    border-color: var(--cmf-ink);
}
.cmf-wrapper .cmf-row input:checked ~ .cmf-ctl-wrap .cmf-ctl-check::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 1px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.cmf-wrapper .cmf-row input:focus-visible ~ .cmf-ctl-wrap .cmf-ctl {
    outline: 2px solid var(--cmf-accent);
    outline-offset: 2px;
}
.cmf-wrapper .cmf-row-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.cmf-wrapper .cmf-row-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.cmf-wrapper label.cmf-row-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--cmf-ink);
    line-height: 1.3;
    margin: 0;
    cursor: pointer;
}
.cmf-wrapper .cmf-row-note,
.cmf-wrapper .cmf-row-desc {
    font-size: 13px;
    line-height: 1.5;
    color: var(--cmf-muted);
}
.cmf-wrapper .cmf-row-desc {
    font-size: 14px;
    text-wrap: pretty;
}
.cmf-wrapper .cmf-row-price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    font-size: 16px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--cmf-ink);
    white-space: nowrap;
}
.cmf-wrapper .cmf-row-unit {
    font-size: 12px;
    font-weight: 400;
    color: var(--cmf-muted);
}

/* The info button and its popover (outside the labels, so a click never ticks the box) */
.cmf-wrapper .cmf-info {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}
.cmf-wrapper .cmf-info-btn {
    width: 20px;
    height: 20px;
    padding: 0 !important;
    margin: 0;
    border-radius: 50%;
    border: 1.5px solid var(--cmf-line2);
    background: #fff;
    color: var(--cmf-muted);
    font: italic 700 11px/1 Georgia, "Times New Roman", serif;
    text-transform: none;
    letter-spacing: normal;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color .12s ease, color .12s ease;
}
.cmf-wrapper .cmf-info-btn:hover {
    border-color: var(--cmf-ink);
    color: var(--cmf-ink);
    background: #fff;
}
.cmf-wrapper .cmf-info.is-open .cmf-info-btn {
    background: var(--cmf-ink);
    border-color: var(--cmf-ink);
    color: #fff;
}
.cmf-wrapper .cmf-popover {
    display: none;
    position: absolute;
    left: 0;
    top: 28px;
    z-index: 30;
    width: min(320px, 80vw);
    padding: 14px 16px;
    border-radius: 10px;
    background: var(--cmf-ink);
    color: #fff;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 400;
    text-align: left;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
    cursor: default;
}
.cmf-wrapper .cmf-popover::before {
    content: "";
    position: absolute;
    left: 5px;
    top: -5px;
    width: 10px;
    height: 10px;
    background: var(--cmf-ink);
    transform: rotate(45deg);
}
.cmf-wrapper .cmf-info.is-open .cmf-popover {
    display: block;
}
.cmf-wrapper .cmf-info.is-above .cmf-popover {
    top: auto;
    bottom: 28px;
}
.cmf-wrapper .cmf-info.is-above .cmf-popover::before {
    top: auto;
    bottom: -5px;
}
.cmf-wrapper .cmf-pop-title {
    display: block;
    font-weight: 700;
    margin-bottom: 4px;
    color: #fff;
}
.cmf-wrapper .cmf-pop-body {
    display: block;
    color: #d4d6da;
}

/* The step check marks the whole container */
#cmf-form #distribution-options.cmf-invalid-group,
#cmf-form #services-options.cmf-invalid-group {
    border-color: #b3261e;
    border-left: 3px solid #b3261e;
    padding-left: 0;
}

/* Order so far, beside Continue */
.cmf-wrapper .cmf-row-continue {
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.cmf-wrapper .cmf-order-so-far {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cmf-wrapper .cmf-osf-label {
    font-size: 13px;
    color: var(--cmf-muted);
}
.cmf-wrapper .cmf-osf-total {
    font-size: 20px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--cmf-ink);
    line-height: 1.2;
}
