body.pci-auth-return #active-environment-panel,
body.pci-auth-return .form-container > :not(#payment-form),
body.pci-auth-return #payment-form > :not(#card-api-result-panel),
body.pci-auth-return #card-api-result-panel > :not(.card-api-result-header):not(#card-api-action-open-row),
body.pci-auth-return #card-api-status-badge {
    display: none !important;
}

body.pci-auth-return .container {
    max-width: 760px;
}

body.pci-auth-return #card-api-result-panel,
body.pci-auth-return #card-api-action-open-row,
body.pci-auth-return #card-api-open-action {
    display: block !important;
}

body.pci-environment-flow #legacy-spreedly-project-configuration,
body.pci-flow #shared-buyer-billing-notes,
body.pci-flow #omnipay-hosted-name-requirement-hint,
body.pci-flow #omnipay-hosted-phone-optional-hint,
body.pci-flow #omnipay-hosted-email-format-hint,
body.pci-flow #omnipay-hosted-country-session-hint {
    display: none !important;
}

body.pci-flow #card-api-section .card-api-idempotency-field,
body.pci-flow #card-api-section .card-api-website-field,
body.pci-flow #card-api-section #card-api-new-idempotency,
body.pci-flow #card-api-section .card-api-hmac-panel {
    display: none !important;
}

body.pci-flow #card-api-section .card-api-warning {
    display: none !important;
}

body.pci-flow .card-api-payment-source-grid[hidden] {
    display: none !important;
}

body.pci-environment-flow #pci-environment-selection {
    display: block;
}

body.pci-environment-flow #legacy-environment-selection-slot {
    display: none;
}

body:not(.pci-environment-flow) #pci-environment-selection,
.pci-integrated[hidden],
.pci-integrated [hidden] {
    display: none !important;
}

#environment-status .environment-display {
    display: grid;
    grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr);
    align-items: stretch;
    gap: 0;
    padding: 14px;
    border: 1px solid #dbe3ee;
    border-radius: 10px;
    background: #fff;
    text-align: left;
}

#environment-status .environment-controls,
#environment-status .environment-info {
    min-width: 0;
    padding: 0;
}

#environment-status .environment-info {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-left: 18px;
    padding-left: 18px;
    border-left: 1px solid #e2e8f0;
}

#environment-status .environment-selection-slot > .form-group,
#environment-status #project-name-select-wrap,
#environment-status #project-name-input-wrap {
    margin: 0;
}

#environment-status .environment-status-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

#environment-status #environment-description {
    margin: 0;
    text-align: left;
    line-height: 1.55;
}

.environment-connection-status {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .06em;
}

.environment-connection-status.ready {
    color: #065f46;
    background: #d1fae5;
    border: 1px solid #6ee7b7;
}

.environment-connection-status.checking {
    color: #4b5563;
    background: #e5e7eb;
    border: 1px solid #cbd5e1;
}

.environment-connection-status.unavailable {
    color: #991b1b;
    background: #fee2e2;
    border: 1px solid #fecaca;
}

.environment-connection-refresh {
    min-height: 29px;
    padding: 5px 10px;
    font-size: 11px;
}

.pci-integrated {
    margin-top: 18px;
    border-top: 1px solid #dbe3ee;
    padding-top: 18px;
}

/* Keep the shared Payment Information card compact while preserving touch targets. */
body.pci-flow .card-fields {
    padding: 16px 18px;
    margin-bottom: 16px;
    border-radius: 14px;
}

body.pci-flow .payment-section-header {
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 12px;
}

body.pci-flow .payment-section-header p {
    margin-top: 5px;
}

body.pci-flow .iframe-security-status {
    margin-top: 8px;
    padding: 6px 10px;
}

body.pci-flow .card-icons {
    gap: 8px;
    padding: 3px;
    border-radius: 12px;
}

body.pci-flow .card-icon {
    width: 56px;
    height: 36px;
    border-radius: 9px;
    font-size: 10px;
}

body.pci-flow .card-fields-payment-inputs {
    display: grid;
    gap: 12px;
}

body.pci-flow .card-fields-payment-inputs > .form-group,
body.pci-flow .card-fields-payment-inputs > .form-row > .form-group {
    margin-bottom: 0 !important;
}

body.pci-flow .card-fields-payment-inputs > .form-row {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(180px, 0.46fr);
    gap: 16px;
    align-items: end;
    margin: 0;
}

body.pci-flow .card-fields-payment-inputs .form-group label {
    margin-bottom: 6px;
}

body.pci-flow .spreedly-field {
    min-height: 48px;
    height: 48px;
    margin-bottom: 0;
}

body.pci-flow .expiry-select-row select {
    min-height: 48px;
}

@media (max-width: 680px) {
    body.pci-flow .card-fields {
        padding: 14px 12px;
    }

    body.pci-flow .payment-section-header {
        flex-direction: column;
        gap: 10px;
    }

    body.pci-flow .card-fields-payment-inputs > .form-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

body.pci-flow #pci-integrated-section > h2 {
    display: none;
}

.pci-integrated h2 {
    margin: 0 0 8px;
    font-size: 22px;
    color: #1d3557;
}

.pci-integrated .form-row {
    gap: 14px;
}

.pci-integrated .form-group {
    min-width: 0;
}

.pci-integrated input,
.pci-integrated select {
    max-width: 100%;
    box-sizing: border-box;
}

.pci-integrated .form-hint {
    display: block;
    margin: 8px 0 0;
    line-height: 1.6;
}

.pci-action-config {
    margin: 0;
    padding: 16px;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
}

.pci-action-config-row {
    align-items: flex-start;
}

.pci-action-config-row > .form-group {
    flex: 1 1 calc(50% - 7px);
    margin-bottom: 0;
}

.pci-contract-hint {
    color: #52657a;
}

.pci-replay-row {
    align-items: center;
    margin: 14px 0 0;
}

.pci-replay-row .form-hint {
    flex: 1 1 320px;
    margin: 0;
}

.pci-replay-row #pci-replay:not(:disabled) {
    background: #2563eb;
    box-shadow: 0 4px 12px rgb(37 99 235 / 22%);
}

.pci-replay-row #pci-replay:hover:not(:disabled) {
    background: #1d4ed8;
}

.pci-replay-row #pci-replay:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

body.pci-flow #shared-order-amount-row,
body.pci-flow #shared-order-id-row {
    display: flex;
}

body.pci-flow #shared-order-amount-row[hidden],
body.pci-flow #shared-order-id-row[hidden] {
    display: none !important;
}

body.pci-flow #card-api-saved-payment-method-id,
body.pci-flow #card-api-cvv {
    -webkit-text-security: none;
}

.pci-results {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

#card-api-result-content[hidden],
#pci-result-content[hidden],
#card-api-action-open-row[hidden] {
    display: none !important;
}

.pci-results > .card-api-result-grid:empty {
    display: none;
}

.pci-results > .card-api-result-grid {
    margin-bottom: 10px;
}

@media (max-width: 900px) {
    #environment-status .environment-display {
        grid-template-columns: minmax(0, 1fr);
    }

    #environment-status .environment-info {
        margin: 14px 0 0;
        padding: 14px 0 0;
        border-top: 1px solid #e2e8f0;
        border-left: 0;
    }

    .pci-integrated .form-row {
        display: flex;
        flex-wrap: wrap;
    }

    .pci-integrated .form-row > * {
        flex: 1 1 100px;
    }

    .pci-action-config-row > .form-group {
        flex-basis: 100%;
    }
}