/* ==========================================================================
   REPAGIFY RESET CSS
   Enqueued on all Repagify-managed pages. Provides structural foundations
   for form plugins and common elements that themes normally handle.
   ========================================================================== */

/* ==========================================================================
   1. BOX MODEL & BASE RESET
   ========================================================================== */

#repagify-wrapper *,
#repagify-wrapper *::before,
#repagify-wrapper *::after {
    box-sizing: border-box;
}

/* img intentionally omitted — the ID-scoped selector would win over
   class-level styles from the design. */

button {
    cursor: pointer;
    border: none;
    background: none;
    font: inherit;
}

/* ==========================================================================
   2. GRAVITY FORMS STRUCTURAL GRID RESET
   Use when "Output CSS" is set to "No" in Gravity Forms settings.
   ========================================================================== */

/* 2.1 Reset the list structure */
.gform_wrapper ul.gform_fields {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 1.5rem;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.gform_wrapper li.gfield {
    grid-column: span 12;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 2.2 Complex inputs (Name, Address, etc.) */
.gform_wrapper .ginput_complex {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-gap: 15px;
    width: 100%;
}

.gform_wrapper .ginput_complex span {
    display: flex;
    flex-direction: column-reverse;
}

.gform_wrapper .ginput_complex label {
    margin-top: 5px;
    font-size: 0.85em;
    opacity: 0.8;
}

/* 2.3 Field labels & inputs */
.gform_wrapper .gfield_label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

.gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]),
.gform_wrapper textarea,
.gform_wrapper select {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

/* 2.4 Re-implementing "Ready Classes" via grid */
@media (min-width: 768px) {
    .gform_wrapper .gf_left_half,
    .gform_wrapper .gf_right_half {
        grid-column: span 6;
    }

    .gform_wrapper .gf_left_third,
    .gform_wrapper .gf_middle_third,
    .gform_wrapper .gf_right_third {
        grid-column: span 4;
    }

    .gform_wrapper .gf_list_2col {
        grid-column: span 6;
    }
}

/* 2.5 Checkboxes & radios */
.gform_wrapper .gfield_checkbox,
.gform_wrapper .gfield_radio {
    list-style-type: none !important;
    padding: 0;
    margin: 10px 0 0 0;
}

.gform_wrapper .gfield_checkbox li,
.gform_wrapper .gfield_radio li {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
}

/* 2.6 Submit button area */
.gform_footer {
    grid-column: span 12;
    padding: 20px 0;
    margin-top: 10px;
}

/* 2.7 Hidden fields & honeypot */
.gform_wrapper .gfield_visibility_hidden,
.gform_wrapper .gform_validation_container {
    display: none !important;
    position: absolute;
    left: -9999px;
}

/* 2.8 Validation messages */
.gform_wrapper .gfield_error .gfield_label {
    color: inherit;
}

.gform_wrapper .validation_message {
    font-size: 0.85em;
    margin-top: 4px;
    display: block;
}

.gform_wrapper .gform_validation_errors {
    margin-bottom: 1rem;
}

/* ==========================================================================
   3. WPFORMS STRUCTURAL RESET
   ========================================================================== */

.wpforms-container .wpforms-form .wpforms-field {
    margin-bottom: 1.25rem;
    padding: 0;
}

.wpforms-container .wpforms-form label.wpforms-field-label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

.wpforms-container .wpforms-form input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]),
.wpforms-container .wpforms-form textarea,
.wpforms-container .wpforms-form select {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

.wpforms-container .wpforms-form .wpforms-field-row {
    display: flex;
    gap: 16px;
}

.wpforms-container .wpforms-form .wpforms-field-row .wpforms-field {
    flex: 1 1 200px;
}

.wpforms-container .wpforms-form .wpforms-submit-container {
    margin-top: 1rem;
    padding: 0;
}

/* Fieldset elements (e.g. WPForms multiple choice, checkboxes) --
   Remove default browser fieldset styling so they look like normal labels */
.wpforms-container .wpforms-form fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

.wpforms-container .wpforms-form fieldset legend {
    display: block;
    width: 100%;
    font-size: inherit;
    font-weight: 500;
    color: inherit;
    margin-bottom: 6px;
    padding: 0;
    float: none;
}

/* Checkbox & radio lists */
.wpforms-container .wpforms-form .wpforms-field-checkbox ul,
.wpforms-container .wpforms-form .wpforms-field-radio ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.wpforms-container .wpforms-form .wpforms-field-checkbox li,
.wpforms-container .wpforms-form .wpforms-field-radio li {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

/* ==========================================================================
   4. CONTACT FORM 7 STRUCTURAL RESET
   ========================================================================== */

.wpcf7-form p {
    margin-bottom: 1rem;
}

.wpcf7-form .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

.wpcf7-form input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]),
.wpcf7-form textarea,
.wpcf7-form select {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
}

.wpcf7-form .wpcf7-validation-errors,
.wpcf7-form .wpcf7-acceptance-missing {
    border: none;
    margin: 0.5rem 0;
    padding: 0;
    font-size: 0.85em;
}

.wpcf7-form .wpcf7-not-valid-tip {
    font-size: 0.8em;
    display: block;
    margin-top: 4px;
}

.wpcf7-form .wpcf7-spinner {
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
}

/* ==========================================================================
   5. WORDPRESS CORE FORM ELEMENTS
   Normalise native WP comment forms, search, login etc.
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="search"],
input[type="date"],
textarea,
select {
    box-sizing: border-box;
    max-width: 100%;
    font: inherit;
}

input[type="submit"],
button[type="submit"] {
    cursor: pointer;
    font: inherit;
}

/* ==========================================================================
   6. WOOCOMMERCE STRUCTURAL RESET
   Scoped to repagify wrapper — only fires on Repagify-managed WooCommerce pages.
   ========================================================================== */

#repagify-wrapper .woocommerce ul.products,
#repagify-wrapper .woocommerce-page ul.products {
    list-style: none;
    padding: 0;
    margin: 0;
}

#repagify-wrapper .woocommerce ul.products li.product,
#repagify-wrapper .woocommerce-page ul.products li.product {
    float: none;
    width: auto;
}

#repagify-wrapper .woocommerce table.shop_table {
    width: 100%;
    border-collapse: collapse;
}

#repagify-wrapper .woocommerce-notices-wrapper {
    margin-bottom: 1rem;
}

/* ==========================================================================
   7. WORDPRESS ADMIN BAR OFFSET
   Prevent the admin bar from overlapping fixed headers on Repagify pages.
   ========================================================================== */

/* The WP admin bar is 32px tall (46px on mobile).
   Repagify designs often use fixed/sticky headers at top:0 that don't
   account for the admin bar. We shift fixed/sticky elements down so they
   sit below the bar without creating a gap in the page flow. */

/* Shift fixed or sticky positioned elements inside the wrapper down. */
.admin-bar #repagify-wrapper [style*="position: fixed"],
.admin-bar #repagify-wrapper [style*="position:fixed"],
.admin-bar #repagify-wrapper [style*="position: sticky"],
.admin-bar #repagify-wrapper [style*="position:sticky"] {
    top: 32px !important;
}

@media screen and (max-width: 782px) {
    .admin-bar #repagify-wrapper [style*="position: fixed"],
    .admin-bar #repagify-wrapper [style*="position:fixed"],
    .admin-bar #repagify-wrapper [style*="position: sticky"],
    .admin-bar #repagify-wrapper [style*="position:sticky"] {
        top: 46px !important;
    }
}

/* ==========================================================================
   8. SCREEN READER & ACCESSIBILITY UTILITIES
   WordPress core outputs these but they're normally in theme CSS.
   ========================================================================== */

#repagify-wrapper .screen-reader-text,
#repagify-wrapper .sr-only {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

#repagify-wrapper .screen-reader-text:focus,
#repagify-wrapper .sr-only:focus {
    background: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0,0,0,0.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* ==========================================================================
   9. ALIGNMENT HELPERS
   WordPress core block alignment classes — normally provided by themes.
   ========================================================================== */

#repagify-wrapper .alignleft  { float: left;  margin-right: 1.5rem; margin-bottom: 1rem; }
#repagify-wrapper .alignright { float: right; margin-left: 1.5rem;  margin-bottom: 1rem; }
#repagify-wrapper .aligncenter { display: block; margin-left: auto; margin-right: auto; margin-bottom: 1rem; }
#repagify-wrapper .alignfull  { width: 100vw; max-width: none; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
#repagify-wrapper .alignwide  { width: 100%; max-width: none; }

/* Clearfix for floated content */
#repagify-wrapper .wp-block-group::after,
#repagify-wrapper .entry-content::after {
    content: '';
    display: table;
    clear: both;
}

/* ==========================================================================
   10. GUTENBERG BLOCK STYLES
   Core block elements output by the WordPress block editor. Normally
   handled by theme.css or block-library/style.css. Scoped to the
   repagify wrapper so they don't affect admin or non-Repagify pages.
   ========================================================================== */

/* ── Paragraph ─────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-paragraph {
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
    float: left;
    font-size: 4em;
    line-height: 0.68;
    font-weight: 700;
    margin: 0.1em 0.15em 0 0;
    text-transform: uppercase;
}

/* ── Headings ──────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-heading {
    margin-bottom: 0.75rem;
    line-height: 1.3;
}

/* ── Image ─────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-image {
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-image img {
    height: auto;
    max-width: 100%;
    vertical-align: bottom;
}

#repagify-wrapper .wp-block-image figcaption {
    font-size: 0.8em;
    margin-top: 0.5rem;
    text-align: center;
    color: currentColor;
    opacity: 0.65;
}

#repagify-wrapper .wp-block-image.is-style-rounded img {
    border-radius: 9999px;
}

/* ── Gallery ───────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding: 0;
    list-style: none;
}

#repagify-wrapper .wp-block-gallery .blocks-gallery-item {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    position: relative;
}

#repagify-wrapper .wp-block-gallery .blocks-gallery-item figure {
    height: 100%;
    margin: 0;
}

#repagify-wrapper .wp-block-gallery .blocks-gallery-item img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}

#repagify-wrapper .wp-block-gallery .blocks-gallery-item figcaption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.5rem;
    background: linear-gradient(transparent, rgba(0,0,0,0.6));
    color: #fff;
    font-size: 0.8em;
    text-align: center;
}

#repagify-wrapper .wp-block-gallery.columns-2 .blocks-gallery-item { width: calc(50% - 0.25rem); flex-grow: 0; }
#repagify-wrapper .wp-block-gallery.columns-3 .blocks-gallery-item { width: calc(33.33% - 0.34rem); flex-grow: 0; }
#repagify-wrapper .wp-block-gallery.columns-4 .blocks-gallery-item { width: calc(25% - 0.375rem); flex-grow: 0; }

/* ── Quote ─────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-quote {
    margin: 0 0 1.5rem;
    padding: 1rem 1.5rem;
    border-left: 4px solid currentColor;
    font-style: italic;
}

#repagify-wrapper .wp-block-quote p {
    margin-bottom: 0.5rem;
}

#repagify-wrapper .wp-block-quote cite,
#repagify-wrapper .wp-block-quote footer {
    font-size: 0.85em;
    font-style: normal;
    opacity: 0.75;
}

#repagify-wrapper .wp-block-quote.is-style-large {
    border: none;
    padding: 1.5rem 2rem;
    font-size: 1.4em;
}

/* ── Pullquote ─────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-pullquote {
    padding: 2rem 1rem;
    text-align: center;
    border-top: 4px solid currentColor;
    border-bottom: 4px solid currentColor;
    margin-bottom: 1.5rem;
}

#repagify-wrapper .wp-block-pullquote blockquote {
    margin: 0;
}

#repagify-wrapper .wp-block-pullquote p {
    font-size: 1.4em;
    font-style: italic;
    margin-bottom: 0.5rem;
}

#repagify-wrapper .wp-block-pullquote cite {
    font-size: 0.85em;
    opacity: 0.75;
}

/* ── Code & Preformatted ───────────────────────────────────────────── */
#repagify-wrapper .wp-block-code,
#repagify-wrapper .wp-block-preformatted {
    font-family: monospace;
    font-size: 0.9em;
    overflow-x: auto;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    background: rgba(0,0,0,0.05);
    border-radius: 4px;
    white-space: pre;
}

#repagify-wrapper .wp-block-code code {
    font-family: inherit;
    background: none;
    padding: 0;
}

/* ── Table ─────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-table {
    margin-bottom: 1rem;
    overflow-x: auto;
    display: block;
}

#repagify-wrapper .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

#repagify-wrapper .wp-block-table th,
#repagify-wrapper .wp-block-table td {
    padding: 0.625rem 0.875rem;
    border: 1px solid currentColor;
    text-align: left;
    word-break: normal;
}

#repagify-wrapper .wp-block-table thead th {
    font-weight: 700;
}

#repagify-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background: rgba(0,0,0,0.04);
}

/* ── List ──────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-list,
#repagify-wrapper .entry-content ul:not([class]),
#repagify-wrapper .entry-content ol:not([class]) {
    padding-left: 1.5rem;
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-list li,
#repagify-wrapper .entry-content ul:not([class]) li,
#repagify-wrapper .entry-content ol:not([class]) li {
    margin-bottom: 0.35rem;
}

#repagify-wrapper .wp-block-list.is-style-checkmark-list {
    list-style: none;
    padding-left: 0;
}

#repagify-wrapper .wp-block-list.is-style-checkmark-list li::before {
    content: '✓';
    margin-right: 0.5rem;
}

/* ── Separator / HR ────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-separator {
    border: none;
    border-top: 2px solid currentColor;
    margin: 2rem auto;
    opacity: 0.25;
}

#repagify-wrapper .wp-block-separator.is-style-dots {
    border: none;
    text-align: center;
    line-height: 1;
    height: auto;
}

#repagify-wrapper .wp-block-separator.is-style-dots::before {
    content: '···';
    font-size: 1.5em;
    letter-spacing: 0.75em;
    opacity: 0.5;
}

#repagify-wrapper .wp-block-separator.is-style-wide {
    width: 100%;
}

/* ── Buttons ───────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-button__link {
    display: inline-block;
    padding: 0.6em 1.2em;
    border-radius: 4px;
    text-decoration: none;
    font-weight: 600;
    cursor: pointer;
    box-sizing: border-box;
}

#repagify-wrapper .wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    border: 2px solid currentColor;
}

/* ── Columns ───────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    align-items: normal;
}

#repagify-wrapper .wp-block-column {
    flex: 1 1 0;
    min-width: 0;
}

@media (max-width: 599px) {
    #repagify-wrapper .wp-block-columns {
        flex-direction: column;
    }
    #repagify-wrapper .wp-block-column {
        flex-basis: 100% !important;
    }
}

/* ── Group & Cover ─────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-group {
    margin-bottom: 1.5rem;
}

#repagify-wrapper .wp-block-group.is-layout-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

#repagify-wrapper .wp-block-cover {
    position: relative;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 430px;
    padding: 2rem;
    box-sizing: border-box;
    overflow: hidden;
}

#repagify-wrapper .wp-block-cover__inner-container {
    position: relative;
    z-index: 1;
    width: 100%;
}

#repagify-wrapper .wp-block-cover .wp-block-cover__image-background,
#repagify-wrapper .wp-block-cover .wp-block-cover__video-background {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* ── Media & Text ──────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-media-text {
    display: grid;
    grid-template-columns: 50% 1fr;
    gap: 1.5rem;
    align-items: center;
    margin-bottom: 1.5rem;
}

#repagify-wrapper .wp-block-media-text.has-media-on-the-right {
    grid-template-columns: 1fr 50%;
}

#repagify-wrapper .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
    grid-column: 2;
    grid-row: 1;
}

#repagify-wrapper .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
    grid-column: 1;
    grid-row: 1;
}

#repagify-wrapper .wp-block-media-text__media img,
#repagify-wrapper .wp-block-media-text__media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 599px) {
    #repagify-wrapper .wp-block-media-text,
    #repagify-wrapper .wp-block-media-text.has-media-on-the-right {
        grid-template-columns: 1fr;
    }
    #repagify-wrapper .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media,
    #repagify-wrapper .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
        grid-column: 1;
        grid-row: auto;
    }
}

/* ── Embed & Video ─────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-embed,
#repagify-wrapper .wp-block-video {
    margin-bottom: 1.5rem;
}

#repagify-wrapper .wp-block-embed__wrapper {
    position: relative;
    overflow: hidden;
}

#repagify-wrapper .wp-block-embed.is-type-video .wp-block-embed__wrapper::before {
    content: '';
    display: block;
    padding-top: 56.25%; /* 16:9 */
}

#repagify-wrapper .wp-block-embed.is-type-video iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

#repagify-wrapper .wp-block-video video {
    width: 100%;
    height: auto;
    display: block;
}

/* ── Audio ─────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-audio {
    margin-bottom: 1.5rem;
}

#repagify-wrapper .wp-block-audio audio {
    width: 100%;
    display: block;
}

/* ── File ──────────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-file {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-file .wp-block-file__button {
    display: inline-block;
    padding: 0.5em 1em;
    font-size: 0.85em;
    border-radius: 4px;
    text-decoration: none;
    white-space: nowrap;
}

/* ── Social Links ──────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0;
    margin-bottom: 1rem;
    list-style: none;
}

#repagify-wrapper .wp-block-social-links .wp-block-social-link {
    margin: 0;
}

#repagify-wrapper .wp-block-social-links .wp-block-social-link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    text-decoration: none;
}

#repagify-wrapper .wp-block-social-links .wp-block-social-link svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

/* ── Navigation ────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* ── Details / Accordion ───────────────────────────────────────────── */
#repagify-wrapper .wp-block-details {
    margin-bottom: 1rem;
}

#repagify-wrapper .wp-block-details summary {
    cursor: pointer;
    font-weight: 600;
    padding: 0.5rem 0;
    user-select: none;
}

/* ── Footnotes ─────────────────────────────────────────────────────── */
#repagify-wrapper .wp-block-footnotes {
    font-size: 0.85em;
    opacity: 0.75;
    border-top: 1px solid currentColor;
    padding-top: 1rem;
    margin-top: 2rem;
}

#repagify-wrapper .wp-block-footnotes ol {
    padding-left: 1.25rem;
    margin: 0;
}

/* ── Post Content wrapper ──────────────────────────────────────────── */
#repagify-wrapper .rp-content > * + * {
    margin-top: 1rem;
}

#repagify-wrapper .rp-content > h1,
#repagify-wrapper .rp-content > h2,
#repagify-wrapper .rp-content > h3,
#repagify-wrapper .rp-content > h4,
#repagify-wrapper .rp-content > h5,
#repagify-wrapper .rp-content > h6 {
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
}

#repagify-wrapper .rp-content > p:last-child {
    margin-bottom: 0;
}

/* ── Form plugin compatibility ────────────────────────────────────────────
   When a form plugin is injected into a Repagify form slot, flatten the
   plugin's wrapper divs using display:contents so the inner input/button
   participate directly in whatever flex/grid layout the design expects.
   Scoped to [data-rp-form-wrapper] so it never affects other form plugins
   on the page.
   ─────────────────────────────────────────────────────────────────────── */

/* ── GravityForms (Orbital theme) — proper field-width-aware grid layout ──
   Newer GravityForms themes (Orbital) use BEM-style classes like
   .gfield--width-half / .gfield--width-third / .gfield--width-full on a
   div-based .gform_fields container, rather than the older ul.gform_fields
   / li.gfield / .gf_left_half markup handled earlier in this file.
   Previously this section flattened the whole structure with
   display:contents and forced the outer <form> into a flex row — correct
   only for a 1-2 field pill-style layout (e.g. a newsletter signup), but
   for a real multi-field form it collapsed every label/input/select/
   textarea/button into one crushed horizontal row. Replaced with grid-
   based layout that respects GravityForms' own field-width classes and
   scales correctly regardless of how many fields the form has.
   ─────────────────────────────────────────────────────────────────────── */

[data-rp-form-wrapper] .gform_fields {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px 14px;
}

/* Fields default to full width; explicit width classes narrow them. */
[data-rp-form-wrapper] .gfield {
    grid-column: span 2;
}
[data-rp-form-wrapper] .gfield--width-half,
[data-rp-form-wrapper] .gfield--width-third {
    grid-column: span 1;
}

@media (max-width: 560px) {
    [data-rp-form-wrapper] .gform_fields {
        grid-template-columns: 1fr;
    }
    [data-rp-form-wrapper] .gfield,
    [data-rp-form-wrapper] .gfield--width-half,
    [data-rp-form-wrapper] .gfield--width-third {
        grid-column: span 1;
    }
}

/* Honeypot / validation-only fields are never meant to be visible. */
[data-rp-form-wrapper] .gform_validation_container,
[data-rp-form-wrapper] .gfield--type-honeypot {
    display: none !important;
}

[data-rp-form-wrapper] .gform-field-label,
[data-rp-form-wrapper] .gfield_label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 6px;
}
[data-rp-form-wrapper] .gfield_required_asterisk {
    color: var(--orange, #e8470a);
}

[data-rp-form-wrapper] .ginput_container input[type="text"],
[data-rp-form-wrapper] .ginput_container input[type="email"],
[data-rp-form-wrapper] .ginput_container input[type="tel"],
[data-rp-form-wrapper] .ginput_container input[type="number"],
[data-rp-form-wrapper] .ginput_container select,
[data-rp-form-wrapper] .ginput_container textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d0cec9 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
    color: #1a1917;
    background: #fff;
}
[data-rp-form-wrapper] .ginput_container input:focus,
[data-rp-form-wrapper] .ginput_container select:focus,
[data-rp-form-wrapper] .ginput_container textarea:focus {
    outline: none;
    border-color: var(--orange, #e8470a) !important;
    box-shadow: none !important;
}
[data-rp-form-wrapper] .ginput_container textarea {
    resize: vertical;
    min-height: 90px;
}

/* Select: force native appearance and a fixed line-height so the chosen
   option's text doesn't overflow or sit off-center — page CSS setting a
   mismatched height/line-height on generic inputs was pushing text out of
   the visible box. Also force readable <option> colors explicitly — some
   page designs set a light/near-white text color broadly for a dark theme,
   which native <option> dropdowns (rendered by the OS/browser, not styled
   by page CSS) can inherit as white-on-white and become unreadable,
   particularly in Chrome. */
[data-rp-form-wrapper] .ginput_container select {
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
    height: auto;
    line-height: 1.4;
}
[data-rp-form-wrapper] .ginput_container select option {
    color: #1a1917 !important;
    background: #fff !important;
}

/* Checkboxes / radios — reset to small, square(ish) native controls.
   Page CSS applying pill-shaped, drop-shadowed styling meant for text
   inputs was also matching bare <input> elements here, producing oversized
   rounded-pill checkboxes instead of small checkable boxes. */
[data-rp-form-wrapper] input[type="checkbox"],
[data-rp-form-wrapper] input[type="radio"] {
    -webkit-appearance: auto !important;
    -moz-appearance: auto !important;
    appearance: auto !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px;
    min-height: 18px;
    border-radius: 3px !important;
    box-shadow: none !important;
    margin: 0 8px 0 0;
    padding: 0;
    flex-shrink: 0;
}
[data-rp-form-wrapper] input[type="radio"] {
    border-radius: 50% !important;
}
[data-rp-form-wrapper] .gfield_checkbox label,
[data-rp-form-wrapper] .gfield_radio label,
[data-rp-form-wrapper] .gchoice {
    display: flex;
    align-items: center;
    font-weight: 500;
    box-shadow: none !important;
    background: transparent !important;
    border: none !important;
}

/* .gform_body (holding the field grid) and .gform_footer (holding the
   submit button) are siblings under <form>, which has no special display
   set here — they stack naturally: fields first, submit button below. */
[data-rp-form-wrapper] .gform_footer {
    margin-top: 10px;
}
[data-rp-form-wrapper] .gform_button {
    display: inline-block;
    width: auto;
    background: var(--orange, #e8470a);
    color: #fff;
    border: none;
    border-radius: 6px !important;
    padding: 12px 28px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}
[data-rp-form-wrapper] .gform_button:hover {
    background: var(--dark-navy, #1a1917);
}

/* WPForms — flatten structural wrapper divs */
[data-rp-form-wrapper] .wpforms-form,
[data-rp-form-wrapper] .wpforms-field-container,
[data-rp-form-wrapper] .wpforms-field,
[data-rp-form-wrapper] .wpforms-submit-container {
    all: unset;
    display: contents;
}

/* CF7 — flatten structural wrapper divs */
[data-rp-form-wrapper] .wpcf7-form,
[data-rp-form-wrapper] .wpcf7-form-control-wrap {
    all: unset;
    display: contents;
}

/* Make the inner form a flex row to match simple input+button layouts —
   applies to WPForms/CF7 (still flattened above) but NOT GravityForms,
   whose <form> now has real block-level children (.gform_body, .gform_footer)
   that need to stack vertically, not sit side by side. */
[data-rp-form-wrapper] form:not(:has(> .gform_body)) {
    display: flex;
    width: 100%;
    gap: 0;
}

/* ── WooCommerce Checkout defaults ─────────────────────────────────────────
   Baseline styling for [repagify_woocommerce_checkout] output so it looks
   reasonable out of the box before any design-specific CSS overrides it.
   Layout: billing/customer details on the left, order review + payment on
   the right. Scoped to the shortcode's own wrapper attribute so it never
   affects a native (non-Repagify-managed) WooCommerce checkout page.
   ─────────────────────────────────────────────────────────────────────── */

[data-rp-sc="repagify_woocommerce_checkout"] {
    font-family: var(--font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    font-size: 15px;
    line-height: 1.5;
    text-align: left;
}

/* Notices (coupon banner, payment-method notices) */
[data-rp-sc="repagify_woocommerce_checkout"] .wc-block-components-notice-banner {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    background: rgba(232, 71, 10, 0.06);
    border: 1px solid rgba(232, 71, 10, 0.18);
    border-radius: 6px;
    padding: 12px 14px;
    margin: 0 0 20px;
    font-size: 13.5px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .wc-block-components-notice-banner svg {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    fill: var(--orange, #e8470a);
    margin-top: 1px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .showcoupon {
    color: var(--orange, #e8470a);
    font-weight: 600;
    text-decoration: none;
}
[data-rp-sc="repagify_woocommerce_checkout"] .showcoupon:hover {
    text-decoration: underline;
}

/* Coupon form (hidden by default until toggled) */
[data-rp-sc="repagify_woocommerce_checkout"] .checkout_coupon {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-end;
    margin: 0 0 20px;
    padding: 14px;
    background: #faf9f7;
    border-radius: 6px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .checkout_coupon .form-row {
    margin: 0;
    flex: 1 1 auto;
    min-width: 160px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .checkout_coupon .form-row-last {
    flex: 0 0 auto;
    min-width: 0;
}

/* Two-column layout: billing details left, order review + payment right */
[data-rp-sc="repagify_woocommerce_checkout"] form.woocommerce-checkout {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    grid-template-rows: auto 1fr;
    gap: 48px;
    align-items: start;
}
[data-rp-sc="repagify_woocommerce_checkout"] #customer_details {
    grid-column: 1;
    grid-row: 1 / span 2;
}

/* WooCommerce's own default stylesheet often floats/flexes .col-1 and .col-2
   side by side, which crowds the "Order notes" field (in .col-2, alongside
   the normally-empty shipping-fields div) into a cramped middle strip.
   Force plain block stacking instead — billing fields first, then whatever
   is in col-2 (shipping fields if enabled, then order notes) — so notes
   ends up cleanly at the bottom of the left column. */
[data-rp-sc="repagify_woocommerce_checkout"] .col2-set {
    display: block;
}
[data-rp-sc="repagify_woocommerce_checkout"] .col2-set .col-1,
[data-rp-sc="repagify_woocommerce_checkout"] .col2-set .col-2 {
    width: 100%;
    float: none;
}
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-additional-fields {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e2e0db;
}

[data-rp-sc="repagify_woocommerce_checkout"] #order_review_heading {
    grid-column: 2;
    grid-row: 1;
    margin: 0 0 16px;
}
[data-rp-sc="repagify_woocommerce_checkout"] #order_review {
    grid-column: 2;
    grid-row: 2;
    background: #faf9f7;
    color: var(--dark-navy, #1a1917);
    border-radius: 8px;
    padding: 20px 22px;
}

@media (max-width: 820px) {
    [data-rp-sc="repagify_woocommerce_checkout"] form.woocommerce-checkout {
        grid-template-columns: 1fr;
    }
    [data-rp-sc="repagify_woocommerce_checkout"] #customer_details,
    [data-rp-sc="repagify_woocommerce_checkout"] #order_review_heading,
    [data-rp-sc="repagify_woocommerce_checkout"] #order_review {
        grid-column: 1;
    }
    [data-rp-sc="repagify_woocommerce_checkout"] #order_review_heading {
        grid-row: auto;
        margin-top: 32px;
    }
    [data-rp-sc="repagify_woocommerce_checkout"] #order_review {
        grid-row: auto;
    }
}

/* Section headings */
[data-rp-sc="repagify_woocommerce_checkout"] h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 18px;
    text-align: left;
}
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-additional-fields h3 {
    margin-top: 28px;
}

/* Form rows / fields */
[data-rp-sc="repagify_woocommerce_checkout"] .form-row {
    margin: 0 0 16px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .form-row label {
    display: block;
    text-align: left;
    font-size: 12.5px;
    font-weight: 600;
    color: #6b6968;
    margin-bottom: 5px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .form-row label .required {
    color: var(--orange, #e8470a);
    text-decoration: none;
}
[data-rp-sc="repagify_woocommerce_checkout"] .form-row label .optional {
    font-weight: 400;
    color: #9e9b93;
}
[data-rp-sc="repagify_woocommerce_checkout"] .input-text,
[data-rp-sc="repagify_woocommerce_checkout"] select,
[data-rp-sc="repagify_woocommerce_checkout"] textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d0cec9;
    border-radius: 5px;
    padding: 10px 12px;
    font-size: 14px;
    font-family: inherit;
    background: #fff;
}
[data-rp-sc="repagify_woocommerce_checkout"] .input-text:focus,
[data-rp-sc="repagify_woocommerce_checkout"] select:focus,
[data-rp-sc="repagify_woocommerce_checkout"] textarea:focus {
    outline: none;
    border-color: var(--orange, #e8470a);
}
[data-rp-sc="repagify_woocommerce_checkout"] textarea {
    resize: vertical;
    min-height: 70px;
}

/* First/last name, city/state style paired rows */
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-billing-fields__field-wrapper,
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-shipping-fields__field-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 0 16px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .form-row-first,
[data-rp-sc="repagify_woocommerce_checkout"] .form-row-last {
    flex: 1 1 calc(50% - 8px);
    min-width: 200px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .form-row-wide {
    flex: 1 1 100%;
}

/* select2 country/state dropdowns — keep them visually consistent with plain selects */
[data-rp-sc="repagify_woocommerce_checkout"] .select2-container {
    width: 100% !important;
}
[data-rp-sc="repagify_woocommerce_checkout"] .select2-selection--single {
    height: auto !important;
    border: 1px solid #d0cec9 !important;
    border-radius: 5px !important;
    padding: 10px 12px !important;
}
[data-rp-sc="repagify_woocommerce_checkout"] .select2-selection__rendered {
    padding: 0 !important;
    line-height: 1.4 !important;
    font-size: 14px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .select2-selection__arrow {
    height: 100% !important;
    top: 0 !important;
}

/* Order review table */
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    margin-bottom: 20px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table th,
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table td {
    padding: 10px 0;
    border-bottom: 1px solid #e2e0db;
    text-align: left;
}
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table .product-total,
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table td:last-child,
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table th:last-child {
    text-align: right;
}
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table thead th {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #9e9b93;
    border-bottom: 2px solid #e2e0db;
}
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table .order-total th,
[data-rp-sc="repagify_woocommerce_checkout"] .shop_table .order-total td {
    border-bottom: none;
    border-top: 2px solid var(--dark-navy, #1a1917);
    font-size: 16px;
    font-weight: 700;
    padding-top: 14px;
}
[data-rp-sc="repagify_woocommerce_checkout"] .product-quantity {
    color: #9e9b93;
    font-weight: 500;
}

/* Payment methods */
[data-rp-sc="repagify_woocommerce_checkout"] .wc_payment_methods {
    list-style: none;
    margin: 0 0 18px;
    padding: 0;
}
[data-rp-sc="repagify_woocommerce_checkout"] .wc_payment_methods li {
    border: 1px solid #e2e0db;
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 8px;
    background: #fff;
}

/* Place order button */
[data-rp-sc="repagify_woocommerce_checkout"] #place_order {
    display: block;
    width: 100%;
    background: var(--orange, #e8470a);
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 14px 20px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background 0.2s;
    margin-top: 6px;
}
[data-rp-sc="repagify_woocommerce_checkout"] #place_order:hover {
    background: var(--dark-navy, #1a1917);
}

/* Privacy/terms text */
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-privacy-policy-text,
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-privacy-policy-text p {
    font-size: 12px;
    color: #9e9b93;
    line-height: 1.5;
    margin: 12px 0;
}
[data-rp-sc="repagify_woocommerce_checkout"] .woocommerce-privacy-policy-link {
    color: var(--orange, #e8470a);
}