/*
Theme Name: Astra Child
Description: Astra 子佈景主題
Author: Your Name
Template: astra
Version: 1.0.0
*/

/* Ultimate Member Directory 三列顯示樣式 */

/* 桌面版三列佈局 */
.um-directory .um-members-wrapper .um-members.um-members-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 1.5% !important;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
    float: none !important;
    width: 32% !important;
    background: transparent !important;
    text-align: center !important;
    margin-bottom: 30px !important;
    margin-right: 0 !important;
    position: relative;
    border: 5px solid #ffffff !important;
    box-sizing: border-box !important;
    height: 338px !important;
    flex: 0 0 32% !important;
}

/* 移除每第三個元素的右邊距（如果使用 margin 方式） */
.um-directory .um-members-wrapper .um-members.um-members-grid .um-member:nth-child(3n) {
    margin-right: 0 !important;
}

/* UM 內建的響應式類別調整 */
.um-directory.uimob960 .um-members-wrapper .um-members.um-members-grid {
    gap: 2% !important;
}

.um-directory.uimob960 .um-members-wrapper .um-members.um-members-grid .um-member {
    width: 32% !important;
    flex: 0 0 32% !important;
}

/* 頭像和其他元素樣式保持不變 */
.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-photo {
    padding: 20px 0 10px 0 !important;
    text-align: center;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-photo a img {
    display: inline !important;
    border: 3px solid #fff !important;
    background: #fff !important;
    width: 90px !important;
    height: 90px !important;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-member-meta-main .um-member-meta {
    display: none;
    margin: 0px 15px !important;
    padding: 0 !important;
    border-top: none !important;
}

/* 大螢幕優化 (1200px+) */
@media screen and (min-width: 1200px) {
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
        width: 31% !important;
        flex: 0 0 31% !important;
    }
}

/* 中等螢幕 (960px - 1199px) */
@media screen and (max-width: 1199px) and (min-width: 960px) {
    .um-directory .um-members-wrapper .um-members.um-members-grid {
        gap: 1% !important;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
        width: 32.66% !important;
        flex: 0 0 32.66% !important;
    }
}

/* 平板版 - 改為兩列 (768px - 959px) */
@media screen and (max-width: 959px) and (min-width: 768px) {
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
        width: 48% !important;
        flex: 0 0 48% !important;
        margin-bottom: 25px !important;
        height: 320px !important;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid {
        gap: 2% !important;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-photo a img {
        width: 80px !important;
        height: 80px !important;
    }
}

/* 手機版 - 單列 (最大 767px) */
@media screen and (max-width: 767px) {
    .um-directory .um-members-wrapper .um-members.um-members-grid {
        flex-direction: column !important;
        align-items: center !important;
        gap: 0 !important;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
        width: 90% !important;
        flex: none !important;
        max-width: 300px !important;
        margin: 0 auto 20px auto !important;
        height: auto !important;
        min-height: 250px !important;
        border: 3px solid #ffffff !important;
        padding: 15px !important;
        border-radius: 8px;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-photo a img {
        width: 70px !important;
        height: 70px !important;
        border-radius: 50%;
    }
}

/* 小手機版 (最大 480px) */
@media screen and (max-width: 480px) {
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
        width: 95% !important;
        margin: 0 auto 15px auto !important;
        min-height: 220px !important;
        padding: 12px !important;
    }
    
    .um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-photo a img {
        width: 60px !important;
        height: 60px !important;
    }
}

/* 確保 clearfix - 處理 float 殘留問題 */
.um-directory .um-members-wrapper .um-members.um-members-grid::after {
    content: "";
    display: table;
    clear: both;
}

/* 強制移除可能的 UM 內建樣式衝突 */
.um-directory .um-members-wrapper .um-members.um-members-grid .um-member {
    clear: none !important;
}

.um-directory .um-members-wrapper .um-members.um-members-grid .um-member:nth-child(3n+1) {
    clear: none !important;
}