/**
 * Team Card Components CSS - v2.1 (Enhanced Specificity Layout Fix)
 * 
 * Team member card styling
 * Extends base card system from cards.css
 * 
 * Contains:
 * - Team cards (.card-team)
 * - Contact info layouts
 * - Team card hover effects
 * - Horizontal card variant for team profiles
 * 
 * v2.1 Changes: Enhanced CSS specificity to ensure bio flex layout and contact group bottom alignment
 */

/* ============================
   Team Card
   ============================ */

/* Team Card - inherits most styling from base .card class */
body.theme-pt .card.card-team {
    text-align: left;
}

body.theme-pt .card.card-team .card-image {
    height: 350px;
    border-radius: 0;
    flex-shrink: 0;
}

body.theme-pt .card.card-team .card-image img {
    border-radius: 0;
}

/* Team card title styling inherited from base .card class */

body.theme-pt .card.card-team .card-body .designation {
    font-weight: 500;
    color: var(--color-text-muted);
    margin-bottom: 0;
    min-height: 2.8em; /* Handle longer titles gracefully */
    line-height: 1.4;
    display: flex;
    align-items: flex-start;
}

body.theme-pt .card.card-team .card-body hr {
    margin-top: var(--card-compact-padding);
    margin-bottom: 25px;
}

body.theme-pt .card.card-team .contact-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: auto;
    justify-content: flex-start;
}


/* ============================
   Team Profile Card
   ============================ */

/* Team Profile Card - Team Member Profile Style - Unified modifier class */
body.theme-pt .card.card-team-profile {
    background: var(--card-bg);
    box-shadow: var(--card-shadow);
    border-radius: var(--card-radius);
    padding: 0;
    overflow: hidden;
    position: relative;
    z-index: 3;
}

/* Specific context for single team page */
body.theme-pt .single--team .card.card-team-profile {
    z-index: 3; /* Ensures card appears above the background */
}


/* Remove Bootstrap gutters from team profile card columns */
body.theme-pt .card.card-team-profile .row > * {
    padding-right: 0;
    padding-left: 0;
}

body.theme-pt .card.card-team-profile .img {
    position: relative;
    overflow: hidden;
}

body.theme-pt .card.card-team-profile .img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: top;
    border-top-left-radius: var(--card-radius);
    border-bottom-left-radius: var(--card-radius);
}

/* Override Bootstrap row alignment for team profile cards */
body.theme-pt .card.card-team-profile .row {
    align-items: stretch !important;
    margin-right: 0;
    margin-left: 0;
}

/* Make right column flex container with full height - Enhanced v2.1 */
body.theme-pt .single--team .card.card-team-profile .col-lg-7:last-child,
body.theme-pt .card.card-team-profile .col-lg-7:last-child {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 400px !important; /* Ensure minimum height for proper flexbox behavior */
}

/* Enhanced inner container with maximum specificity - v2.1 */
body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner,
body.theme-pt .card.card-team-profile .inner {
    padding: 30px !important; /* Remove top padding completely */
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    flex-grow: 1 !important; /* Fill available height in column */
    min-height: 100% !important; /* Ensure full height utilization */
    justify-content: space-between !important; /* Distribute space properly */
}

/* Content section wrapper for better flexbox control - v2.1 */
body.theme-pt .single--team .card.card-team-profile .inner .content-section,
body.theme-pt .card.card-team-profile .inner .content-section {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    flex-shrink: 1 !important;
}

body.theme-pt .card.card-team-profile h1 {
    font-size: var(--heading-size-h1);
    font-weight: var(--font-weight-bold);
    color: var(--heading-color-primary);
    line-height: var(--heading-line-height-tight);
    margin-top: 0;
    margin-bottom: 0.5rem;
}

body.theme-pt .card.card-team-profile h3 {
    font-size: var(--heading-size-h3);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-muted);
    line-height: var(--heading-line-height-h3);
    margin-top: 0;
    margin-bottom: 1.5rem;
}

/* Enhanced bio flexbox layout - v2.1 maximum specificity */
body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner .bio,
body.theme-pt .single--team .card.card-team-profile .inner .bio,
body.theme-pt .card.card-team-profile .inner .bio {
    display: flex !important;
    flex-direction: column !important; 
    justify-content: flex-start !important;
    flex-grow: 1 !important;
    flex-shrink: 1 !important; /* Allow shrinking if needed */
    margin-bottom: 20px !important; /* Consistent spacing before contact group */
    overflow-y: auto !important; /* Handle overflow content gracefully */
}

body.theme-pt .single--team .card.card-team-profile .inner .bio p {
    font-size: var(--body-text-secondary);
    line-height: var(--body-line-height-secondary);
    margin-bottom: 15px;
    color: var(--card-text-color);
}

/* Enhanced contact group bottom alignment - v2.1 maximum specificity */
body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner .contact-group,
body.theme-pt .single--team .card.card-team-profile .inner .contact-group,
body.theme-pt .card.card-team-profile .inner .contact-group {
    flex-shrink: 0 !important; /* Prevent shrinking */
    flex-grow: 0 !important; /* Don't grow, stay fixed size */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: stretch !important; /* Ensure HR and UL take full width */
}

body.theme-pt .card.card-team-profile hr {
    width: 100%;
    min-height: 1px;
    border-color: var(--card-border-color);
    margin-top: 0;
    margin-bottom: 20px;
    opacity: 1;
}

body.theme-pt .card.card-team-profile ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: var(--space-lg);
}

body.theme-pt .card.card-team-profile ul li {
    margin-bottom: 15px;
}

body.theme-pt .card.card-team-profile ul li a {
    color: var(--card-text-color);
    text-decoration: none;
    font-size: 19px;
    font-weight: 500;
    transition: var(--card-transition-fast);
}

body.theme-pt .card.card-team-profile ul li a:hover {
    color: var(--primary-color);
}

body.theme-pt .card.card-team-profile ul li a i {
    margin-right: 8px;
    color: var(--primary-color);
}

/* ============================
   Mobile Bootstrap Row/Column Spacing Fix
   ============================ */

/* Fix team section spacing inconsistency to match other card sections */
@media (max-width: 767.98px) {
    /* Fix team section row margin to match other sections */
    .aboutteam .row.pb-5.mb-1 {
        margin-left: calc(-1 * var(--bs-gutter-x, 1.5rem)) !important;
        margin-right: calc(-1 * var(--bs-gutter-x, 1.5rem)) !important;
        margin-bottom: var(--space-xs, 4px) !important;
    }
    
    /* Ensure team section columns match other sections' padding */
    .aboutteam .row.card-row .col {
        padding-left: var(--bs-gutter-x, 1.5rem) !important;
        padding-right: var(--bs-gutter-x, 1.5rem) !important;
    }
}

/* ============================
   Mobile Responsive Adjustments
   ============================ */

@media (max-width: 991.98px) {
    /* Card layout adjustments from page-team.css */
    .single--team .card.card-team-profile {
        margin-top: 20px;
    }
    
    .single--team .card.card-team-profile .row {
        margin: 0;
    }
    
    .single--team .card.card-team-profile .col-lg-5,
    .single--team .card.card-team-profile .col-lg-7 {
        padding: 0;
    }
}

@media (max-width: 767.98px) {
    /* Team profile card mobile adjustments from mobile-consolidated.css */
    body.theme-pt .card.card-team-profile .img img {
        height: auto;
        border-radius: var(--card-radius) var(--card-radius) 0 0;
    }
    
    /* Mobile: Override Bootstrap row alignment */
    body.theme-pt .card.card-team-profile .row {
        align-items: stretch !important;
    }
    
    /* Mobile: Make right column flex container - Enhanced v2.1 */
    body.theme-pt .single--team .card.card-team-profile .col-lg-7:last-child,
    body.theme-pt .card.card-team-profile .col-lg-7:last-child {
        display: flex !important;
        flex-direction: column !important;
        min-height: 300px !important; /* Mobile minimum height */
    }
    
    /* Mobile: Enhanced inner container - v2.1 maximum specificity */
    body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner,
    body.theme-pt .card.card-team-profile .inner {
        padding: 15px !important; /* Remove top padding on mobile */
        display: flex !important;
        flex-direction: column !important;
        height: 100% !important;
        flex-grow: 1 !important;
        min-height: 100% !important; /* Ensure full height utilization on mobile */
        justify-content: space-between !important; /* Distribute space properly on mobile */
    }
    
    /* Mobile: Content section wrapper - v2.1 */
    body.theme-pt .single--team .card.card-team-profile .inner .content-section,
    body.theme-pt .card.card-team-profile .inner .content-section {
        display: flex !important;
        flex-direction: column !important;
        flex-grow: 1 !important;
        flex-shrink: 1 !important;
    }
    
    body.theme-pt .card.card-team-profile h1 {
        font-size: var(--heading-size-h1) !important;
        line-height: 1.3 !important;
        margin-bottom: 0.4rem !important;
    }
    
    body.theme-pt .card.card-team-profile h3 {
        font-size: var(--heading-size-h3) !important;
        line-height: 1.4 !important;
        margin-bottom: 1rem !important;
    }
    
    /* Mobile: Bio section enhancement - v2.1 maximum specificity */
    body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner .bio,
    body.theme-pt .single--team .card.card-team-profile .inner .bio,
    body.theme-pt .card.card-team-profile .inner .bio {
        flex-grow: 1 !important;
        flex-shrink: 1 !important; /* Allow shrinking on mobile */
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        margin-bottom: 15px !important; /* Mobile spacing before contact group */
        overflow-y: auto !important; /* Handle mobile content overflow */
    }
    
    body.theme-pt .single--team .card.card-team-profile .inner .bio p {
        font-size: var(--body-text-secondary);
        line-height: var(--body-line-height-secondary);
    }
    
    body.theme-pt .card.card-team-profile ul li a {
        font-size: var(--font-size-md);
    }
    
    body.theme-pt .card.card-team-profile hr {
        margin-top: 0;
        margin-bottom: 15px;
    }
    
    /* Mobile: Contact group alignment - v2.1 maximum specificity */
    body.theme-pt .single--team .card.card-team-profile .col-lg-7 .inner .contact-group,
    body.theme-pt .single--team .card.card-team-profile .inner .contact-group,
    body.theme-pt .card.card-team-profile .inner .contact-group {
        flex-shrink: 0 !important;
        flex-grow: 0 !important; /* Don't grow on mobile */
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: stretch !important; /* Ensure HR and UL take full width on mobile */
    }
    
    /* Mobile: Contact list styling handled by contact-group margin-top auto */
}

/* Enhanced team member contact links from mobile-consolidated.css */
@media (max-width: 767.98px) {
    .card-team-profile .contact-info a {
        display: inline-block;
        padding: var(--space-sm) var(--space-xs);
        margin: 4px 0;
        min-height: var(--touch-target-min-height);
        min-width: var(--touch-target-min-width);
        text-decoration: none;
        border-radius: var(--radius-sm);
        transition: var(--transition-background);
        text-align: center;
        justify-content: center;
        align-items: center;
    }
    
    .card-team-profile .contact-info a:hover {
        background-color: var(--color-overlay-light);
    }
}