/* PLADINUM DOMAIN SEARCH v1.0.0 */

.pld-ds{
    --ds-ink:#232222;
    --ds-border:#d8d8d8;
    --ds-mut:#8b8b8e;
    --ds-accent:#d04841;
    --ds-ok:rgb(38,150,86);
    --ds-ok-bg:rgba(74,200,110,.12);
    --ds-off:#f4f4f5;
    width:100%;
    font-family:'Inter',system-ui,sans-serif;
    text-align:left;
}

.pld-ds__form{
    display:flex;
    align-items:stretch;
    gap:10px;
    width:100%;
}

.pld-ds__input{
    flex:1 1 auto;
    min-width:0;
    padding:16px 20px;
    font-family:inherit;
    font-size:1rem;
    font-weight:400;
    line-height:1.4;
    color:var(--ds-ink);
    background:#fff;
    border:1px solid var(--ds-border);
    border-radius:12px;
    outline:none;
    transition:border-color .18s ease, box-shadow .18s ease;
}
.pld-ds__input::placeholder{color:var(--ds-mut);opacity:1}
.pld-ds__input:hover{border-color:#999}
.pld-ds__input:focus{border-color:var(--ds-ink)}

.pld-ds__btn{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:var(--pld-gap-8,8px);
    padding-block:var(--pld-space-12,12px);
    padding-inline:var(--pld-space-28,28px);
    font-family:inherit;
    font-size:1rem;
    font-weight:500;
    line-height:1.6;
    color:var(--pld-core-white,#fff);
    background:var(--pld-btn-hero-bg,#000);
    border:1px solid var(--pld-btn-border-dark,rgb(66,66,66));
    border-radius:var(--pld-radius-s-12,12px);
    cursor:pointer;
    transition:background-color 200ms;
}
.pld-ds__btn:hover{background:rgba(17,17,17,.8)}
.pld-ds__btn-arrow{
    width:8px;height:8px;
    border-top:1.5px solid currentColor;
    border-right:1.5px solid currentColor;
    transform:rotate(45deg);
}

.pld-ds__chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.pld-ds__chip{
    padding:6px 13px;
    font-family:'IBM Plex Mono',monospace;
    font-size:12px;
    color:var(--ds-mut);
    background:transparent;
    border:1px solid var(--ds-border);
    border-radius:999px;
    cursor:pointer;
    transition:border-color .18s ease,color .18s ease;
}
.pld-ds__chip:hover{border-color:var(--ds-ink);color:var(--ds-ink)}

.pld-ds__note{margin:12px 0 0;font-size:13px;color:var(--ds-mut)}

.pld-ds__status{
    margin-top:16px;
    font-size:13px;
    color:var(--ds-mut);
    display:none;
}
.pld-ds__status.is-on{display:block}
.pld-ds.is-loading .pld-ds__status::after{
    content:"";
    display:inline-block;
    width:5px;height:5px;
    margin-left:7px;
    border-radius:50%;
    background:currentColor;
    animation:pld-ds-pulse 1s ease-in-out infinite;
}

.pld-ds__results{
    list-style:none !important;
    margin:18px 0 0 !important;
    padding:0 !important;
    display:flex;
    flex-direction:column;
    gap:8px;
}
.pld-ds__results > li{
    display:flex !important;
    align-items:center;
    gap:14px;
    margin:0 !important;
    padding:14px 18px !important;
    background:#fff;
    border:1px solid var(--ds-border);
    border-radius:12px;
    list-style:none !important;
}
.pld-ds__results > li::marker{content:"" !important}
.pld-ds__results > li::before{content:none !important;display:none !important}

.pld-ds__name{
    flex:1 1 auto;
    min-width:0;
    font-size:15px;
    font-weight:500;
    color:var(--ds-ink);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.pld-ds__state{
    flex:0 0 auto;
    padding:4px 10px;
    font-family:'IBM Plex Mono',monospace;
    font-size:10.5px;
    letter-spacing:.06em;
    text-transform:uppercase;
    border-radius:6px;
    color:var(--ds-mut);
    background:var(--ds-off);
}
.pld-ds__row--available .pld-ds__state{color:var(--ds-ok);background:var(--ds-ok-bg)}
.pld-ds__row--taken     .pld-ds__state{color:var(--ds-accent);background:rgba(208,72,65,.1)}
.pld-ds__row--taken     .pld-ds__name{color:var(--ds-mut)}

.pld-ds__price{flex:0 0 auto;font-size:14px;font-weight:600;color:var(--ds-ink);white-space:nowrap}

.pld-ds__cta{
    flex:0 0 auto;
    padding:8px 16px;
    font-size:13px;
    font-weight:500;
    color:#fff;
    background:var(--pld-btn-hero-bg,#000);
    border-radius:10px;
    text-decoration:none;
    white-space:nowrap;
}
.pld-ds__cta:hover{background:rgba(17,17,17,.8);color:#fff}
.pld-ds__cta--off{background:var(--ds-off);color:var(--ds-mut);cursor:default}

@keyframes pld-ds-pulse{0%,100%{opacity:.3}50%{opacity:1}}

@media (max-width:600px){
    .pld-ds__form{flex-direction:column}
    .pld-ds__btn{width:100%}
    .pld-ds__results > li{flex-wrap:wrap;gap:10px}
    .pld-ds__name{flex:1 1 100%}
}
