.da-hai-pan-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center
}

.da-hai-pan-button-item {
    display: flex;
    align-items: center;
    gap: 8px
}

.da-hai-pan-button {
    position: relative;
    display: inline-flex!important;
    align-items: center!important;
    justify-content: flex-start!important;
    width: 142px!important;
    height: 52px!important;
    min-width: 142px!important;
    max-width: 142px!important;
    padding: 0 8px 0 15px!important;
    margin: 0!important;
    border: 0!important;
    background: transparent url('../bg.svg') center/100% 100% no-repeat!important;
    cursor: pointer
}

.da-hai-pan-button:disabled {
    opacity: .55;
    cursor: not-allowed
}

.da-hai-pan-button.disabled {
    opacity: .65;
    cursor: wait
}

.da-hai-pan-button img.da-hai-pan-icon,.da-hai-pan-button img.da-hai-pan-word {
    display: block!important;
    float: none!important;
    margin: 0!important;
    padding: 0!important;
    border: 0!important;
    max-width: none!important;
    max-height: none!important;
    min-width: 0!important;
    min-height: 0!important;
    pointer-events: none!important;
    object-fit: contain!important
}

.da-hai-pan-button img.da-hai-pan-icon {
    width: 24px!important;
    height: 24px!important;
    flex: 0 0 24px!important;
    margin-right: 22px!important;
}

.da-hai-pan-button img.da-hai-pan-word {
    height: auto!important;
    flex: 0 0 66px!important
}

.da-hai-pan-custom-word {
    width: auto!important;
    max-width: 86px!important;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    word-break: break-all;
    pointer-events: none
}

.da-hai-pan-button-desc {
    display: block;
    width: 100%;
    color: #a1a1a1;
    font-size: 13px;
    line-height: 1.4;
    max-width: 220px;
    text-align: center;
    word-break: break-word;
    margin-top: -5px;
}

.da-hai-pan-buttons-desc {
    flex-basis: 100%;
    margin-top: 4px
}

.da-hai-pan-buttons-editor {
    padding: 16px;
    background: #f6f8fb;
    border: 1px solid #dfe5ec;
    border-radius: 8px
}

.da-hai-pan-editor-frame {
    padding: 14px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0,0,0,.04)
}

.da-hai-pan-editor-row {
    display: flex;
    gap: 12px;
    align-items: flex-start
}

.da-hai-pan-editor-row+.da-hai-pan-editor-row {
    margin-top: 10px
}

.da-hai-pan-editor-row .components-base-control {
    flex: 1 1 0;
    min-width: 0
}

.da-hai-pan-buttons-editor .components-base-control {
    margin-bottom: 8px
}

.da-hai-pan-buttons-editor .da-hai-pan-editor-frame>.components-base-control {
    margin-top: 10px
}

.da-hai-pan-buttons-editor button {
    padding: 8px 14px;
    border: 0;
    border-radius: 4px;
    background: #2271b1;
    color: #fff
}

.da-hai-pan-buttons-editor button:disabled {
    opacity: .5
}

@media (max-width: 600px) {
    .da-hai-pan-editor-row {
        display:block
    }

    .da-hai-pan-editor-row .components-base-control {
        width: 100%
    }

    .da-hai-pan-button-item {
        width: 100%
    }
}