/**
 * Guandan Scheduler for SportsPress - Admin Stylesheet
 *
 * @version 1.6.0 (Added export button styles)
 * @author  Your Name
 */

/* ==========================================================================
   主容器和布局
   ========================================================================== */
.gs-scheduler-wrap {
    margin-top: 20px;
}
.gs-scheduler-wrap .gs-layout {
    display: grid;
    grid-template-columns: 400px 1fr;
    gap: 30px;
    margin-top: 20px;
}
.gs-scheduler-wrap .gs-section {
    background-color: #fff;
    border: 1px solid #ccd0d4;
    padding: 1px 20px 20px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
    margin-bottom: 20px;
}
.gs-scheduler-wrap .gs-section:last-child {
    margin-bottom: 0;
}
.gs-scheduler-wrap .gs-section h2 {
    font-size: 1.2em;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    margin: 20px 0;
}
.gs-scheduler-wrap .gs-section p.description {
    font-size: 13px;
    color: #646970;
}

/* ==========================================================================
   表单元素和按钮
   ========================================================================== */
.gs-scheduler-wrap .form-table th {
    width: 120px;
}
.gs-scheduler-wrap .form-table select,
.gs-scheduler-wrap .form-table input[type="number"] {
    width: 100%;
    max-width: 250px;
}
.gs-scheduler-wrap .button {
    margin-right: 10px;
}

/* ==========================================================================
   加载动画和反馈信息
   ========================================================================== */
.gs-scheduler-wrap .spinner {
    float: none;
    vertical-align: middle;
    margin-left: 8px;
    visibility: hidden;
}
.gs-scheduler-wrap .spinner.is-active {
    visibility: visible;
}
#gs-feedback {
    margin-bottom: 20px;
}
#gs-feedback .notice {
    margin: 0;
}

/* ==========================================================================
   数据展示区域 (队伍列表和对阵预览)
   ========================================================================== */
#gs-team-list-container {
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #e5e5e5;
}
#gs-team-list-container .wp-list-table {
    margin: 0;
}
#gs-team-list-container .wp-list-table th {
    font-weight: 600;
}
#gs-team-list-container .wp-list-table td:last-child {
    text-align: right;
    font-weight: bold;
}

/* ==========================================================================
   东南西北座位卡片布局 (对阵预览)
   ========================================================================== */
#gs-match-preview-container {
    padding: 5px;
}
.gs-tables-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}
.gs-table {
    text-align: center;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;
}
.gs-table.is-clickable:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    transform: translateY(-3px);
    cursor: pointer;
    border-color: #007cba;
}
.gs-table-number {
    font-weight: bold;
    font-size: 1.1em;
    margin-bottom: 15px;
    color: #2271b1;
    border-bottom: 1px solid #f0f0f1;
    padding-bottom: 10px;
}
.gs-seat {
    padding: 8px;
    margin: 5px 0;
    background: #f9f9f9;
    border-radius: 4px;
    border: 1px solid #e5e5e5;
}
.gs-seat .seat-pos {
    font-weight: bold;
    margin-right: 5px;
}
.team-info {
    display: block;
    font-size: 0.9em;
    color: #50575e;
    margin-top: 4px;
}
.middle-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
.middle-row .gs-seat {
    flex: 1;
}
.gs-table.bye-card {
    background-color: #fcfcfc;
    border-style: dashed;
    justify-content: center;
    align-items: center;
    min-height: 200px;
}
.bye-card .gs-table-number {
    border-bottom: none;
    font-size: 1.3em;
    color: #8c8f94;
}
.bye-card .bye-team-name {
    font-size: 1.1em;
    font-weight: bold;
    color: #3c434a;
}

/* ==========================================================================
   阵容选择模态框 (Modal/Popup) 样式
   ========================================================================== */
#gs-lineup-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 160000;
    display: flex;
    justify-content: center;
    align-items: center;
}
#gs-lineup-modal {
    background-color: #f6f7f7;
    padding: 0;
    border-radius: 4px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}
#gs-lineup-modal h3 {
    font-size: 18px;
    margin: 0;
    padding: 16px 24px;
    border-bottom: 1px solid #ddd;
}
#gs-modal-player-list {
    margin: 0;
    max-height: 300px;
    overflow-y: auto;
    padding: 8px 0;
}
label.gs-player-checkbox {
    display: flex;
    align-items: center;
    padding: 10px 24px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f1;
}
label.gs-player-checkbox:last-child {
    border-bottom: none;
}
label.gs-player-checkbox:hover {
    background-color: #f0f0f1;
}
label.gs-player-checkbox input[type="checkbox"] {
    margin-right: 12px;
    width: 16px;
    height: 16px;
}
#gs-modal-actions {
    text-align: right;
    padding: 16px 24px;
    background-color: #fff;
    border-top: 1px solid #ddd;
    border-radius: 0 0 4px 4px;
}
.gs-lineup-controls {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px dashed #ccc;
}

/* ==========================================================================
   新增：CSV导出按钮样式 (用于前台短代码)
   ========================================================================== */
.gs-export-controls {
    margin-bottom: 1.5em;
    text-align: right;
}
.gs-export-csv-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px; /* 图标和文字之间的间距 */
    padding: 8px 16px;
    background-color: #0073aa; /* WordPress标准蓝色 */
    color: #fff;
    border: 1px solid #0073aa;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.5;
    transition: background-color 0.15s ease-in-out;
}
.gs-export-csv-btn:hover,
.gs-export-csv-btn:focus {
    background-color: #005a87;
    border-color: #005a87;
    color: #fff;
}
.gs-export-csv-btn .dashicons {
    line-height: 1; /* 确保图标垂直居中 */
    vertical-align: text-bottom;
}


/* ==========================================================================
   响应式布局
   ========================================================================== */
@media screen and (max-width: 960px) {
    .gs-scheduler-wrap .gs-layout {
        grid-template-columns: 1fr;
    }
}


/* 追加到文件末尾 */

/* ==========================================================================
   队伍交换模态框样式
   ========================================================================== */
#gs-team-swap-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 160001; /* 比阵容选择框高一点 */
    display: flex;
    justify-content: center;
    align-items: center;
}
#gs-team-swap-modal {
    background-color: #f6f7f7;
    padding: 0;
    border-radius: 4px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}
#gs-team-swap-modal h3 {
    font-size: 18px;
    margin: 0;
    padding: 16px 24px;
    border-bottom: 1px solid #ddd;
}
.gs-swap-modal-body {
    padding: 20px 24px;
}
.gs-swap-modal-body .form-table {
    margin-bottom: 15px;
}
.gs-swap-modal-body .form-table th {
    width: 80px;
}
.gs-swap-modal-body select {
    width: 100%;
}
.gs-lineup-controls .gs-edit-teams-btn {
    margin-top: 5px;
    width: 100%;
    box-sizing: border-box;
}