/* Contributors Block - Using 5th Floor Theme Styles */

/* Theme color variables support */
.contributors,
.cownected-team-members,
.post-team-members {
    --cownected-primary: var(--wp--preset--color--primary, #FFDB17);
    --cownected-main: var(--wp--preset--color--main, #0F0F0F);
    --cownected-transition: var(--transition--fade, 0.2s all ease-in-out);
    margin-top: 40px;
}

.contributors.has-border,
.cownected-team-members.has-border,
.post-team-members.has-border {
    border: 1px solid #E8E8E8;
    padding: 1.5rem;
    border-radius: 8px;
}

/* List Layout (Default) */
.contributors .contributor-item,
.cownected-team-members .team-member-item,
.post-team-members .team-member-item {
    display: flex;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 15px;
    margin-bottom: 15px;
}

/* List layout specific */
.contributors--list .contributor-item,
.cownected-team-members--list .team-member-item {
    align-items: center !important;
}

/* Inline layout - center align */
.contributors--inline .contributor-item,
.cownected-team-members--inline .team-member-item {
    align-items: center !important;
    margin-bottom: 0;
}

/* Grid layout - center content horizontally */
.contributors--grid .contributor-item,
.cownected-team-members--grid .team-member-item {
    align-items: center !important;
    flex-direction: column;
}

/* Contributor Images - Base styles */
.contributors .contributor-image,
.cownected-team-members .team-member-image-column,
.post-team-members .team-member-image-column {
    overflow: hidden;
    flex-shrink: 0;
    display: block;
}

.contributors .contributor-image img,
.cownected-team-members .team-member-image-column img,
.post-team-members .team-member-image-column img {
    object-fit: cover;
    display: block;
}

/* Image Sizes */
/* Small / Thumbnail (default - 56px) */
.contributors--image-small .contributor-image,
.contributors--image-small .contributor-image img,
.contributors--image-thumbnail .contributor-image,
.contributors--image-thumbnail .contributor-image img,
.contributors .contributor-image,
.cownected-team-members .team-member-image-column,
.post-team-members .team-member-image-column,
.cownected-team-members .team-member-image-column img,
.post-team-members .team-member-image-column img {
    width: 56px !important;
    height: 56px !important;
}

/* Medium (80px) */
.contributors--image-medium .contributor-image,
.contributors--image-medium .contributor-image img {
    width: 80px !important;
    height: 80px !important;
}

/* Large (120px) */
.contributors--image-large .contributor-image,
.contributors--image-large .contributor-image img {
    width: 120px !important;
    height: 120px !important;
}

/* Image Shapes */
/* Circle (default) */
.contributors--image-circle .contributor-image,
.contributors--image-circle .contributor-image img,
.contributors .contributor-image,
.contributors .contributor-image img,
.cownected-team-members .team-member-image-column,
.cownected-team-members .team-member-image-column img,
.post-team-members .team-member-image-column,
.post-team-members .team-member-image-column img {
    border-radius: 50% !important;
}

/* Square */
.contributors--image-square .contributor-image,
.contributors--image-square .contributor-image img {
    border-radius: 0 !important;
}

/* Rounded Square */
.contributors--image-rounded .contributor-image,
.contributors--image-rounded .contributor-image img {
    border-radius: 8px !important;
}

/* Contributor Info */
.contributors .contributor-info,
.cownected-team-members .team-member-info,
.post-team-members .team-member-info {
    display: block !important;
    color: var(--cownected-main);
    flex: 1;
}

.contributors .contributor-info p,
.cownected-team-members .team-member-info p,
.post-team-members .team-member-info p {
    display: none !important;
}

/* Contributor Names/Links */
.contributors .contributor-name,
.contributors .contributor-link,
.cownected-team-members .team-member-name,
.cownected-team-members .team-member-link,
.post-team-members .team-member-name,
.post-team-members .team-member-link {
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    color: inherit;
    display: block;
    transition: var(--cownected-transition);
}

.contributors .contributor-link:hover,
.cownected-team-members .team-member-link:hover,
.post-team-members .team-member-link:hover {
    opacity: 0.8;
    text-decoration: none;
}

/* Role & Company */
.contributors .contributor-role-company,
.cownected-team-members .team-member-role-company,
.post-team-members .team-member-role-company {
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: -1%;
    color: #3F3F3F;
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.contributors .role-company-separator,
.cownected-team-members .role-company-separator,
.post-team-members .role-company-separator {
    color: #999;
}

/* Contributors wrapper variant */
.contributors-wrapper .contributors,
.contributors-wrapper .cownected-team-members,
.contributors-wrapper .post-team-members {
    display: flex;
    gap: 40px;
    flex-wrap: wrap;
}

/* Grid Layout */
.contributors--grid .contributors-container,
.cownected-team-members--grid .team-members-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 40px;
}

.contributors--grid .contributor-item,
.cownected-team-members--grid .team-member-item {
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: flex-start;
}

.contributors--grid .contributor-image,
.cownected-team-members--grid .team-member-image-column {
    width: 80px !important;
    height: 80px !important;
    min-width: 80px;
    min-height: 80px;
    max-width: 80px;
    max-height: 80px;
    border-radius: 80px !important;
}

.contributors--grid .contributor-image img,
.cownected-team-members--grid .team-member-image-column img {
    width: 80px !important;
    height: 80px !important;
    border-radius: 80px !important;
}

.contributors--grid .contributor-info,
.cownected-team-members--grid .team-member-info {
    align-items: center;
    text-align: center;
}

.contributors--grid .contributor-role-company,
.cownected-team-members--grid .team-member-role-company {
    flex-direction: column;
    gap: 0.25rem;
    justify-content: center;
}

.contributors--grid .role-company-separator,
.cownected-team-members--grid .role-company-separator {
    display: none;
}

/* Inline Layout */
.contributors--inline .contributors-container,
.cownected-team-members--inline .team-members-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.contributors--inline .contributor-item,
.cownected-team-members--inline .team-member-item {
    display: inline-flex;
    margin-bottom: 0;
    gap: 0.5rem;
}

.contributors--inline .separator,
.cownected-team-members--inline .separator {
    color: #999;
}

/* Editor Preview Styles */
.contributors-preview,
.team-members-preview {
    border: 2px dashed #ddd;
    padding: 1rem;
    background: #f9f9f9;
}

.contributor-item-preview,
.team-member-item-preview {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    margin-top: 1rem;
}

.contributor-info-preview,
.team-member-info-preview {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Responsive */
@media (max-width: 768px) {
    .contributors--grid .contributors-container,
    .cownected-team-members--grid .team-members-container {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }


    
    .contributors .role-company-separator,
    .cownected-team-members .role-company-separator {
        display: none;
    }
}