.dsd-ri-strip{
    display:none;
    align-items:center;
    gap:5px;

    min-height:30px;

    padding:4px 9px;

    overflow-x:auto;

    border-bottom:1px solid #edf0f5;

    background:#fafbfe;

    scrollbar-width:none;
}

.dsd-ri-strip::-webkit-scrollbar{
    display:none;
}

.dsd-ri-strip.has-results{
    display:flex;
}

.dsd-ri-chip{
    flex:0 0 auto;

    display:inline-flex;
    align-items:center;
    gap:5px;

    height:24px;

    padding:0 7px;

    border:1px solid #dfe4eb;
    border-radius:999px;

    background:#fff;

    color:#55606f;

    font-size:.58rem;
    font-weight:700;

    cursor:default;
}

.dsd-ri-chip::before{
    content:"•";

    font-size:.76rem;
}

.dsd-ri-chip.is-checking::before{
    content:"◌";
    color:#687386;
}

.dsd-ri-chip.is-likely{
    border-color:#cfe8dc;
    background:#f7fcf9;
    color:#286247;
}

.dsd-ri-chip.is-likely::before{
    content:"✓";
    color:#21845c;
}

.dsd-ri-chip.is-caution{
    border-color:#eadfbf;
    background:#fffaf0;
    color:#755c20;
}

.dsd-ri-chip.is-caution::before{
    content:"!";
    color:#a57711;
}

.dsd-ri-chip.is-invalid{
    border-color:#edcccc;
    background:#fff7f7;
    color:#7e3030;
}

.dsd-ri-chip.is-invalid::before{
    content:"×";
    color:#a12d2d;
}

.dsd-ri-refresh{
    flex:0 0 auto;

    height:24px;

    padding:0 7px;

    border:1px solid #e0e4eb;
    border-radius:7px;

    background:#fff;

    color:#5d6674;

    font-size:.56rem;
    font-weight:750;

    cursor:pointer;
}

.dsd-ri-refresh:hover{
    background:#f0f2f7;
}

.dsd-ri-input-invalid{
    color:#8b0000 !important;
}

.dsd-ri-summary{
    flex:0 0 auto;

    color:#858d99;

    font-size:.54rem;
    font-weight:650;
}
/* ============================================================
   DSDILLON_RECIPIENT_INTELLIGENCE_MOBILE_FINAL_V1

   Mobile-safe recipient verification surface.
   ============================================================ */

.dsd-ri-strip{
    box-sizing:border-box;
    width:100%;
    max-width:100%;
}

.dsd-ri-chip{
    box-sizing:border-box;
    max-width:min(320px,70vw);
}

.dsd-ri-chip{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.dsd-ri-summary{
    min-width:0;
}

@media (max-width:580px){

    /*
     * Verification belongs to the composer, not to a horizontal
     * pseudo-carousel. Allow statuses to wrap naturally.
     */
    .dsd-ri-strip{
        flex-wrap:wrap;
        align-items:center;

        width:100%;
        max-width:100%;

        min-height:0;

        gap:5px;

        padding:
            6px
            8px;

        overflow-x:hidden;
        overflow-y:visible;

        overscroll-behavior:contain;
    }

    .dsd-ri-strip.has-results{
        display:flex;
    }

    .dsd-ri-chip{
        flex:
            0
            1
            auto;

        min-width:0;

        max-width:
            calc(100% - 8px);

        height:26px;

        padding:
            0
            8px;

        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    /*
     * Verify remains directly usable even when several recipient
     * chips occupy preceding rows.
     */
    .dsd-ri-refresh{
        flex:
            0
            0
            auto;

        height:28px;

        padding:
            0
            9px;

        touch-action:
            manipulation;
    }

    .dsd-ri-summary{
        flex:
            1
            1
            120px;

        min-width:
            80px;

        max-width:
            100%;

        line-height:
            1.25;

        white-space:
            normal;
    }

    /*
     * Invalid state remains visible without changing input width.
     */
    .dsd-ri-input-invalid{
        box-shadow:
            inset 3px 0 0 #8b0000;
    }
}

@media (max-width:360px){

    .dsd-ri-chip{
        max-width:
            100%;
    }

    .dsd-ri-summary{
        flex-basis:
            100%;
    }
}
