.ar-payment-links,
.ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    --ar-payment-links-gap: 28px;
    --ar-payment-links-accent: var(--wp--preset--color--primary, #90001f);
    --ar-payment-links-accent-hover: #6f0018;
    --ar-payment-links-text: #353535;
    --ar-payment-links-muted: #656565;
    --ar-payment-links-border: #ddd8cf;
    --ar-payment-links-soft: #f7f5f1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--ar-payment-links-gap);
    align-items: stretch;
}

.ar-payment-links {
    margin: 0 0 36px;
}

.ar-payment-links-columns-1,
.ar-payment-links-editor-wrap.ar-payment-links-columns-1 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: minmax(0, 1fr);
}

.ar-payment-links-columns-2,
.ar-payment-links-editor-wrap.ar-payment-links-columns-2 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ar-payment-links-columns-3,
.ar-payment-links-editor-wrap.ar-payment-links-columns-3 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ar-payment-link {
    position: relative;
    min-width: 0;
    min-height: 100%;
    display: flex;
    gap: 20px;
    padding: 28px;
    border: 1px solid var(--ar-payment-links-border, #ddd8cf);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.ar-payment-link-icon {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--ar-payment-links-soft, #f7f5f1);
}

.ar-payment-link-icon::before {
    content: "";
    width: 28px;
    height: 28px;
    display: block;
    background: var(--ar-payment-links-accent, #90001f);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

.ar-payment-link-icon-card .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M8 14h48a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H8a6 6 0 0 1-6-6V20a6 6 0 0 1 6-6Zm-1 11h50v-6H7v6Zm0 8v15h50V33H7Zm7 8h14v5H14v-5Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M8 14h48a6 6 0 0 1 6 6v28a6 6 0 0 1-6 6H8a6 6 0 0 1-6-6V20a6 6 0 0 1 6-6Zm-1 11h50v-6H7v6Zm0 8v15h50V33H7Zm7 8h14v5H14v-5Z'/%3E%3C/svg%3E");
}

.ar-payment-link-icon-tax .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 4 3 19v6h58v-6L32 4ZM9 29h8v22h6V29h8v22h6V29h8v22h6V29h7v28H6V29h3Zm-6 30h58v5H3v-5Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 4 3 19v6h58v-6L32 4ZM9 29h8v22h6V29h8v22h6V29h8v22h6V29h7v28H6V29h3Zm-6 30h58v5H3v-5Z'/%3E%3C/svg%3E");
}

.ar-payment-link-icon-water .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 3S11 27 11 42a21 21 0 1 0 42 0C53 27 32 3 32 3Zm0 52a13 13 0 0 1-13-13c0-7 7-18 13-26 6 8 13 19 13 26a13 13 0 0 1-13 13Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 3S11 27 11 42a21 21 0 1 0 42 0C53 27 32 3 32 3Zm0 52a13 13 0 0 1-13-13c0-7 7-18 13-26 6 8 13 19 13 26a13 13 0 0 1-13 13Z'/%3E%3C/svg%3E");
}

.ar-payment-link-icon-permit .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M12 4h28l12 12v44H12V4Zm28 6v10h10L40 10ZM20 29h24v5H20v-5Zm0 10h24v5H20v-5Zm0 10h16v5H20v-5Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M12 4h28l12 12v44H12V4Zm28 6v10h10L40 10ZM20 29h24v5H20v-5Zm0 10h24v5H20v-5Zm0 10h16v5H20v-5Z'/%3E%3C/svg%3E");
}

.ar-payment-link-icon-invoice .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M12 4h40v56l-8-5-8 5-8-5-8 5-8-5V4Zm8 12v5h24v-5H20Zm0 10v5h24v-5H20Zm0 10v5h14v-5H20Zm19 0v5h5v-5h-5Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M12 4h40v56l-8-5-8 5-8-5-8 5-8-5V4Zm8 12v5h24v-5H20Zm0 10v5h24v-5H20Zm0 10v5h14v-5H20Zm19 0v5h5v-5h-5Z'/%3E%3C/svg%3E");
}

.ar-payment-link-icon-general .ar-payment-link-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 2a30 30 0 1 0 0 60 30 30 0 0 0 0-60Zm3 47h-6v-5h6v5Zm5-22c-1 2-3 4-5 5v6h-6v-9l2-1c3-2 6-4 6-7 0-3-2-5-6-5-4 0-7 2-9 5l-5-3c3-5 8-8 15-8 7 0 12 4 12 11 0 2-1 4-4 6Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M32 2a30 30 0 1 0 0 60 30 30 0 0 0 0-60Zm3 47h-6v-5h6v5Zm5-22c-1 2-3 4-5 5v6h-6v-9l2-1c3-2 6-4 6-7 0-3-2-5-6-5-4 0-7 2-9 5l-5-3c3-5 8-8 15-8 7 0 12 4 12 11 0 2-1 4-4 6Z'/%3E%3C/svg%3E");
}

.ar-payment-link-content {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.ar-payment-link-title {
    margin: 2px 0 10px;
    color: var(--ar-payment-links-text, #353535);
    font-size: clamp(1.2rem, 1.1rem + 0.35vw, 1.5rem);
    line-height: 1.25;
    font-weight: 700;
}

.ar-payment-link-description {
    margin: 0 0 14px;
    color: var(--ar-payment-links-text, #353535);
    font-size: 1rem;
    line-height: 1.6;
}

.ar-payment-link-description p,
.ar-payment-link-note p {
    margin: 0;
}

.ar-payment-link-note {
    margin: 0 0 18px;
    padding: 10px 12px;
    border-left: 3px solid var(--ar-payment-links-accent, #90001f);
    background: var(--ar-payment-links-soft, #f7f5f1);
    color: var(--ar-payment-links-muted, #656565);
    font-size: 0.9rem;
    line-height: 1.5;
}

.ar-payment-link-action {
    margin-top: auto;
    padding-top: 6px;
}

.ar-payment-link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 11px 22px;
    border: 2px solid var(--ar-payment-links-accent, #90001f);
    border-radius: 999px;
    background: var(--ar-payment-links-accent, #90001f);
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.2;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.ar-payment-link-button:hover,
.ar-payment-link-button:focus-visible {
    border-color: var(--ar-payment-links-accent-hover, #6f0018);
    background: var(--ar-payment-links-accent-hover, #6f0018);
    color: #fff;
    text-decoration: none;
}


.ar-payment-link-button-icon {
    width: 15px;
    height: 15px;
    display: inline-block;
    background: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m14 4-1.4 1.4 5.6 5.6H4v2h14.2l-5.6 5.6L14 20l8-8-8-8Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m14 4-1.4 1.4 5.6 5.6H4v2h14.2l-5.6 5.6L14 20l8-8-8-8Z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
}

/* Editor-only controls */
.ar-payment-links-editor-wrap {
    --ar-payment-links-gap: 28px;
    --ar-payment-links-accent: var(--wp--preset--color--primary, #90001f);
    --ar-payment-links-accent-hover: #6f0018;
    --ar-payment-links-text: #353535;
    --ar-payment-links-muted: #656565;
    --ar-payment-links-border: #ddd8cf;
    --ar-payment-links-soft: #f7f5f1;
    width: 100%;
}

.ar-payment-links-editor-toolbar,
.ar-payment-links-editor-footer {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border: 1px dashed #c9c9c9;
    border-radius: 8px;
    background: #f8f8f8;
}

.ar-payment-links-editor-toolbar {
    margin-bottom: 18px;
}

.ar-payment-links-editor-footer {
    justify-content: center;
    margin-top: 18px;
}

.ar-payment-links-editor-help {
    color: #555;
    font-size: 13px;
}

.ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block {
    margin-top: 0;
    margin-bottom: 0;
    max-width: none;
}

.ar-payment-link-editor {
    box-sizing: border-box;
}

.ar-payment-link-editor .ar-payment-link-title[contenteditable="true"]:empty::before,
.ar-payment-link-editor .ar-payment-link-description[contenteditable="true"]:empty::before,
.ar-payment-link-editor .ar-payment-link-note[contenteditable="true"]:empty::before,
.ar-payment-link-editor .ar-payment-link-button[contenteditable="true"]:empty::before {
    opacity: 0.55;
}

.ar-payment-link-action-editor {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-width: 150px;
    border-radius: 999px;
    background: var(--ar-payment-links-accent, #90001f);
    color: #fff;
}

.ar-payment-link-action-editor .ar-payment-link-button {
    min-width: 110px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.ar-payment-link-action-editor > .ar-payment-link-button-icon {
    margin-right: 18px;
}

.ar-payment-link-editor-url-note {
    margin: 8px 0 0;
    color: #666;
    font-size: 12px;
    font-style: italic;
}

@media (max-width: 980px) {
    .ar-payment-links-columns-3,
    .ar-payment-links-editor-wrap.ar-payment-links-columns-3 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .ar-payment-links,
    .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout,
    .ar-payment-links-columns-2,
    .ar-payment-links-columns-3,
    .ar-payment-links-editor-wrap.ar-payment-links-columns-2 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout,
    .ar-payment-links-editor-wrap.ar-payment-links-columns-3 .ar-payment-links-editor-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .ar-payment-link {
        gap: 16px;
        padding: 22px;
    }

    .ar-payment-link-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

    .ar-payment-links-editor-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ar-payment-link-button {
        transition: none;
    }
}

/* Accessibility, reflow, and long-content safeguards. */
.ar-payment-links *,
.ar-payment-links *::before,
.ar-payment-links *::after,
.ar-payment-links-editor-wrap *,
.ar-payment-links-editor-wrap *::before,
.ar-payment-links-editor-wrap *::after {
    box-sizing: border-box;
}

.ar-payment-link,
.ar-payment-link-title,
.ar-payment-link-description,
.ar-payment-link-note,
.ar-payment-link-button {
    overflow-wrap: anywhere;
    word-break: normal;
}

.ar-payment-link-button:focus-visible {
    outline: 3px solid var(--ar-payment-links-accent, #90001f);
    outline-offset: 4px;
    box-shadow: 0 0 0 2px #fff;
}

.ar-payment-links-editor-toolbar .components-button,
.ar-payment-links-editor-footer .components-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 44px;
}

.ar-payment-links-editor-toolbar .components-button .dashicon,
.ar-payment-links-editor-footer .components-button .dashicon {
    flex: 0 0 auto;
    margin: 0;
}

@media (forced-colors: active) {
    .ar-payment-link,
    .ar-payment-link-note,
    .ar-payment-link-button {
        border: 2px solid CanvasText;
    }

    .ar-payment-link-icon::before,
    .ar-payment-link-button-icon {
        background: currentColor;
    }
}