/* TBA Accessible Profiles - Frontend */

.tba-profile-section{
    width:100%!important;
    max-width:100%!important;
}

.tba-profile-section *{
    box-sizing:border-box;
}

.tba-profile-filter{
    margin:0 0 18px;
    padding:12px;
    border:1px solid #ddd;
    border-radius:12px;
    background:#fafafa;
}

.tba-profile-filter form{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    align-items:end;
}

.tba-profile-filter label{
    display:block;
    font-weight:700;
    margin-bottom:4px;
}

.tba-profile-filter select{
    width:100%;
    min-height:38px;
}

.tba-profile-filter button,
.tba-profile-filter .tba-reset-link{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:6px 12px;
    border-radius:8px;
    border:1px solid #222;
    background:#222;
    color:#fff;
    text-decoration:none;
    cursor:pointer;
}

.tba-filter-actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
}

.tba-profile-grid{
    display:grid!important;
    grid-template-columns:repeat(var(--tba-profile-columns,4),minmax(0,1fr))!important;
    gap:16px!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
}

.tba-profile-grid-single{
    grid-template-columns:minmax(0,1fr)!important;
    max-width:360px!important;
}

.tba-profile-card{
    border:1px solid #e2e2e2;
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 3px 10px rgba(0,0,0,.05);
    display:flex!important;
    flex-direction:column!important;
    width:auto!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
    box-sizing:border-box!important;
}

.tba-profile-card.tba-profile-empty{
    visibility:hidden;
    box-shadow:none;
    border-color:transparent;
    background:transparent;
    min-height:80px;
}

.tba-profile-image-wrap{
    position:relative;
    width:100%!important;
    aspect-ratio:1/1!important;
    background:#f1f1f1;
    overflow:hidden;
}

.tba-profile-image{
    width:100%!important;
    max-width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
}

.tba-profile-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#666;
    font-weight:700;
    background:#eee;
}

.tba-kk-badge{
    position:absolute;
    right:8px;
    bottom:8px;
    min-width:34px;
    height:34px;
    border-radius:50%;
    background:#005bbb;
    color:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    font-size:13px;
    border:2px solid #fff;
}

.tba-profile-body{
    padding:12px;
    line-height:1.2;
}

.tba-profile-title{
    margin:0 0 4px;
    font-size:1.2em;
    line-height:1.2;
    font-weight:700;
}

.tba-focus-line{
    margin-bottom:4px;
    border-radius:6px;
    padding:2px 4px;
    line-height:1.2;
}

.tba-focus-line:focus{
    outline:3px solid #005bbb;
    outline-offset:2px;
    background:#eef5ff;
}

.tba-screen-reader-text{
    border:0;
    clip:rect(1px,1px,1px,1px);
    clip-path:inset(50%);
    height:1px;
    margin:-1px;
    overflow:hidden;
    padding:0;
    position:absolute;
    width:1px;
    word-wrap:normal!important;
}

.tba-profile-filter select:focus,
.tba-profile-filter button:focus,
.tba-profile-filter a:focus{
    outline:3px solid #005bbb;
    outline-offset:3px;
}

@media(max-width:680px){
    .tba-profile-grid{
        grid-template-columns:1fr!important;
        gap:14px!important;
    }

    .tba-profile-card{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;
    }

    .tba-profile-image-wrap{
        width:100%!important;
        aspect-ratio:1/1!important;
    }

    .tba-profile-filter form{
        grid-template-columns:1fr!important;
    }

    .tba-profile-card.tba-profile-empty{
        display:none!important;
    }

    .tba-filter-actions{
        flex-direction:column;
        align-items:stretch;
    }
}
.tba-search-filter-row{grid-column:1/-1}.tba-search-filter-row input[type="search"]{width:100%;min-height:42px;padding:8px 10px;border:1px solid #8c8f94;border-radius:6px}.tba-search-filter-row input[type="search"]:focus{outline:3px solid #005bbb;outline-offset:3px}