/* Shared craftsman card appearance, based on the allcraftsman directory. */
.fb-friend-card,
.craftsman-card,
.pro-card,
.craft-card,
.premium-slide .premium-card,
.khdmli-pro-card,
.ss-map-craftsman-card,
.recommended-craftsman-card,
.suggested-craftsman-card{
    box-sizing:border-box;
    overflow:hidden;
    border:1px solid #e4e6eb!important;
    border-radius:10px!important;
    background:#fff!important;
    box-shadow:0 1px 2px rgba(0,0,0,.12)!important;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.fb-friend-card:hover,
.craftsman-card:hover,
.pro-card:hover,
.craft-card:hover,
.premium-slide .premium-card:hover,
.khdmli-pro-card:hover,
.ss-map-craftsman-card:hover,
.recommended-craftsman-card:hover,
.suggested-craftsman-card:hover{
    transform:translateY(-2px);
    border-color:#d3d8df!important;
    box-shadow:0 4px 12px rgba(0,0,0,.15)!important;
}
.fb-friend-img,
.craftsman-card .image-wrapper,
.khdmli-pro-photo,
.suggested-craftsman-cover{
    display:block!important;
    width:100%!important;
    height:138px!important;
    overflow:hidden;
    border:0!important;
    border-radius:0!important;
    background:#f0f2f5;
}
.fb-friend-img img,
.craftsman-card .craftsman-image,
.khdmli-pro-photo img,
.suggested-craftsman-cover img{
    display:block;
    width:100%!important;
    height:100%!important;
    object-fit:cover;
    border:0!important;
    border-radius:0!important;
}
.fb-friend-body,
.khdmli-pro-info,
.suggested-craftsman-body{
    padding:8px!important;
}
.fb-friend-body h3,
.craftsman-card .craftsman-name,
.craft-card .craft-name,
.premium-slide .premium-card .craft-name,
.pro-card .pro-name,
.khdmli-pro-info>strong,
.suggested-craftsman-name{
    display:block;
    margin:0 0 4px!important;
    overflow:hidden;
    color:#111!important;
    font-size:13px!important;
    font-weight:850!important;
    line-height:1.4;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.fb-mutual,
.craftsman-card .craftsman-meta,
.craft-card .card-body-mini,
.premium-slide .premium-card .card-body-mini,
.pro-card .pro-meta-row,
.khdmli-pro-meta,
.suggested-craftsman-meta{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    min-height:0;
    margin:3px 0 0!important;
    padding:0!important;
    color:#65676b!important;
    font-size:10px!important;
    font-weight:500;
    line-height:1.35;
}
.fb-mutual span,
.craftsman-card .meta-line,
.craft-card .card-body-mini .line,
.premium-slide .premium-card .card-body-mini .line,
.pro-card .pro-meta-craft,
.pro-card .pro-meta-city,
.khdmli-pro-meta span,
.suggested-craftsman-meta{
    display:flex;
    align-items:center;
    gap:5px;
    min-width:0;
    overflow:hidden;
    color:#65676b!important;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.fb-mutual i,
.craftsman-card .meta-line i,
.craft-card .card-body-mini .line i,
.premium-slide .premium-card .card-body-mini .line i,
.pro-card .pro-meta-craft .svg-icon,
.pro-card .pro-meta-city .svg-icon,
.khdmli-pro-meta i,
.suggested-craftsman-meta i{
    flex:0 0 14px;
    width:14px;
    min-width:14px;
    color:#65676b!important;
    font-size:11px;
}
.fb-rating,
.craftsman-card .rating-box,
.craft-card .rating-box,
.premium-slide .premium-card .rating-box,
.pro-card .pro-rating-badge,
.khdmli-pro-rating,
.suggested-rating{
    display:flex;
    align-items:center;
    gap:4px;
    margin:6px 0 0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#111!important;
    font-size:10px!important;
    font-weight:800;
    line-height:1.35;
}
.fb-rating .stars,
.craftsman-card .rating-star,
.craft-card .rating-box,
.premium-slide .premium-card .rating-box,
.suggested-rating i{
    color:#f2a100!important;
}

.pro-card .pro-rating-badge .star{color:#d8dde5!important;}
.pro-card .pro-rating-badge .star.active,
.pro-card .pro-rating-badge .star.partial{color:#f2a100!important;}
.fb-rating small,
.craftsman-card .rating-box span,
.craft-card .rating-box,
.premium-slide .premium-card .rating-box,
.pro-card .pro-rating-count,
.suggested-rating small{
    color:#65676b!important;
    font-size:10px!important;
    font-weight:650;
}

/* Convert compact avatar cards into the same image-first directory card. */
.pro-card{display:block!important;padding:0!important;}
.pro-card .pro-top{display:block!important;}
.pro-card .pro-photo-wrap,
.pro-card .pro-img{
    position:relative;
    display:block!important;
    width:100%!important;
    height:138px!important;
    overflow:hidden;
    margin:0!important;
    border-radius:0!important;
    background:#f0f2f5;
}
.pro-card .pro-photo,
.pro-card .pro-img img{
    display:block;
    width:100%!important;
    height:100%!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    object-fit:cover;
    box-shadow:none!important;
}
.pro-card .pro-top>div:last-child,
.pro-card .pro-body{padding:8px 8px 0!important;}
.pro-card .pro-meta-row{padding:0 8px 8px!important;}
.pro-card .pro-meta-separator{display:none!important;}
.pro-card .pro-meta-craft,
.pro-card .pro-meta-city{max-width:100%;border:0!important;background:transparent!important;}
.pro-card .pro-rating-badge .stars{display:inline-flex;direction:ltr;}
.pro-card .pro-rating-badge .star{width:12px;height:12px;}
.pro-card::before{display:none!important;}
.pro-card .pro-img .heart,
.pro-card .pro-img .online,
.pro-card .pro-img .featured-mark{z-index:2;}

/* Cards used in craft, city and region result grids. */
.craftsman-card{padding:0!important;}
.craftsman-card .card-top{display:block!important;padding:0!important;}
.craft-card,
.premium-slide .premium-card{padding:0!important;}
.craft-card .card-top,
.premium-slide .premium-card .card-top{display:block!important;padding:0!important;text-align:start!important;}
.craft-card .avatar-wrap,
.premium-slide .premium-card .avatar-wrap{
    position:relative;
    display:block!important;
    width:100%!important;
    height:138px!important;
    overflow:hidden;
    margin:0!important;
    border-radius:0!important;
}
.craft-card .avatar,
.premium-slide .premium-card .avatar{
    display:block;
    width:100%!important;
    height:100%!important;
    border:0!important;
    border-radius:0!important;
    object-fit:cover;
}
.craft-card .craft-name,
.premium-slide .premium-card .craft-name{padding:8px 8px 0!important;}
.craft-card .card-body-mini,
.premium-slide .premium-card .card-body-mini{padding:0 8px 8px!important;}
.craft-card .card-actions,
.premium-slide .premium-card .card-actions{display:flex;gap:6px;padding:0 8px 8px!important;}
.craft-card .btn-card,
.premium-slide .premium-card .btn-card{min-height:30px;border-radius:6px;}
.craftsman-card .craftsman-name{padding:8px 8px 0!important;}
.craftsman-card>.profile-img{display:block;width:100%!important;height:138px!important;object-fit:cover;border:0!important;border-radius:0!important;}
.craftsman-card .craftsman-meta{padding:0 8px!important;}
.craftsman-card .rating-box{padding:0 8px 8px!important;}
.craftsman-card .profile-btn{margin:0 8px 8px!important;}

/* Suggested and request match lists use the same portrait, metadata and hover. */
.recommended-craftsman-card .recommended-craftsman-main{
    position:relative;
    display:block!important;
    padding:0!important;
}
.recommended-craftsman-card .recommended-craftsman-main>img{
    display:block;
    width:100%!important;
    height:138px!important;
    border:0!important;
    border-radius:0!important;
    object-fit:cover;
    box-shadow:none!important;
}
.recommended-craftsman-card .recommended-craftsman-info{padding:8px;}
.recommended-craftsman-card .recommended-craftsman-arrow{
    position:absolute;
    top:7px;
    inset-inline-end:7px;
    width:26px;
    height:26px;
    border:1px solid rgba(255,255,255,.75);
    background:rgba(255,255,255,.92);
    color:#1877f2;
}
.suggested-craftsman-card{padding:0!important;text-align:start!important;}
.suggested-craftsmen-strip .suggested-craftsman-card{align-items:stretch!important;gap:0!important;}
.suggested-craftsman-card .suggested-avatar{
    display:block;
    width:100%!important;
    height:138px!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}
.suggested-craftsmen-strip .suggested-name,
.suggested-craftsmen-strip .suggested-meta,
.suggested-craftsmen-strip .suggested-rating{margin:5px 8px 0!important;text-align:start!important;}
.suggested-craftsmen-strip .suggested-rating{margin-bottom:8px!important;}

/* Compact suggested cards shown on artisan and service pages. */
.suggested-craftsmen-track .suggested-craftsman-card{display:block!important;}
.suggested-craftsman-card .suggested-craftsman-cover{position:relative;}
.suggested-craftsman-card .suggested-craftsman-body{display:block;}
.suggested-craftsman-card .suggested-craftsman-actions{display:flex;gap:6px;margin-top:8px;}
.suggested-craftsman-card .suggested-craftsman-actions>a{
    min-height:30px;
    border-radius:6px;
    font-size:10px;
}

/* Search and recommendation sliders. */
.khdmli-pro-card{display:flex!important;flex-direction:column;min-width:0;}
.khdmli-pro-photo{position:relative;flex:none;}
.khdmli-pro-photo>span{position:absolute;inset-inline-start:7px;inset-block-start:7px;}
.khdmli-pro-info{flex:1;}
.khdmli-pro-info>strong{margin:0 0 5px!important;}
.khdmli-pro-actions{display:flex;gap:6px;padding:0 8px 8px;}
.khdmli-pro-actions>a{min-height:30px;border-radius:6px;}

@media(max-width:699px){
    .fb-friend-img,
    .craftsman-card .image-wrapper,
    .pro-card .pro-photo-wrap,
    .pro-card .pro-img,
    .craft-card .avatar-wrap,
    .premium-slide .premium-card .avatar-wrap,
    .khdmli-pro-photo,
    .recommended-craftsman-card .recommended-craftsman-main>img,
    .suggested-craftsman-card .suggested-avatar,
    .suggested-craftsman-cover{height:128px!important;}
    .fb-friend-body,
    .khdmli-pro-info,
    .suggested-craftsman-body{padding:7px!important;}
}
@media(prefers-reduced-motion:reduce){
    .fb-friend-card,
    .craftsman-card,
    .pro-card,
    .craft-card,
    .premium-slide .premium-card,
    .khdmli-pro-card,
    .ss-map-craftsman-card,
    .recommended-craftsman-card,
    .suggested-craftsman-card{transition:none;}
    .fb-friend-card:hover,
    .craftsman-card:hover,
    .pro-card:hover,
    .craft-card:hover,
    .premium-slide .premium-card:hover,
    .khdmli-pro-card:hover,
    .ss-map-craftsman-card:hover,
    .recommended-craftsman-card:hover,
    .suggested-craftsman-card:hover{transform:none;}
}


/* Six featured craftsman cards across on desktop, with a responsive tablet layout. */
@media(min-width:900px){
    .section .craftsmen-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;}
}
@media(min-width:700px) and (max-width:899px){
    .section .craftsmen-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
}
.pro-card .fb-heart{
    position:absolute;
    inset-block-start:8px;
    inset-inline-end:8px;
    z-index:5;
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    padding:0;
    border:1px solid rgba(255,255,255,.92);
    border-radius:50%;
    background:rgba(255,255,255,.96);
    color:#667085;
    box-shadow:0 2px 8px rgba(0,0,0,.18);
    cursor:pointer;
    transition:color .18s ease,background .18s ease,transform .18s ease;
}
.pro-card .fb-heart i{font-size:16px;line-height:1;}
.pro-card .fb-heart:hover{transform:scale(1.06);color:#e11d48;}
.pro-card .fb-heart.active{background:#fff1f2;color:#e11d48;}
.pro-card .fb-heart:disabled{opacity:.65;cursor:wait;}
.pro-card .pro-name-link{color:inherit;text-decoration:none;}
.pro-card .pro-name-link:hover .pro-name{color:#1769d2!important;}




/* Keep the homepage bell visible in the mobile hero header. */
@media(max-width:767px){
    .hero .topbar{min-height:50px!important;}
    .hero .topbar .notification-wrap{
        display:block!important;
        visibility:visible!important;
        opacity:1!important;
    }
    .hero .topbar .notification-wrap>.top-btn,
    .hero .topbar .notification-wrap .notification-trigger{
        display:flex!important;
        visibility:visible!important;
        opacity:1!important;
    }
}
