/* --- Global Styles --- */
body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft JhengHei", Roboto, "Helvetica Neue", Arial, sans-serif;
    background-color: #f4f7f6;
    color: #333;
    margin: 0;
    line-height: 1.6;
}

a {
    color: #007bff;
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: #0056b3;
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

/* --- Layout --- */
.container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.content-wrapper {
    background-color: #ffffff;
    padding: 25px 30px;
    margin-top: 20px;
    margin-bottom: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

/* --- Header & Logo --- */
.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    border-bottom: 2px solid #e9ecef;
}

.logo img {
    max-height: 60px; /* 控制LOGO高度 */
}

.site-title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #2c3e50;
}

.navigation {
    margin-top: 10px;
    padding: 10px 0;
    background-color: #343a40;
    border-radius: 5px;
}

.navigation ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: center;
}

.navigation li a {
    color: white;
    padding: 10px 20px;
    display: block;
    font-weight: 500;
}

.navigation li a:hover {
    background-color: #495057;
    text-decoration: none;
}

/* --- Footer --- */
.site-footer {
    text-align: center;
    padding: 20px 0;
    margin-top: 30px;
    font-size: 0.9rem;
    color: #777;
    border-top: 1px solid #e9ecef;
}

/* --- Index Page (Schedule) - 參考 圖1 --- */
.schedule-grid {
    display: grid;
    gap: 25px;
}

.schedule-row {
    display: flex;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.day-info {
    flex: 0 0 100px; /* 固定寬度 */
    padding: 15px;
    text-align: center;
    color: white;
    background-color: #d9534f; /* 參考圖1的紅色 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-weight: bold;
}

.day-info .date {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.2;
}

.day-info .weekday {
    font-size: 0.9rem;
    margin-top: 5px;
}

/* 針對 11月28日 (星期四) 的藍色 */
.schedule-row[data-day*="四"] .day-info {
    background-color: #337ab7; /* 參考圖1的藍色 */
}

.session-list {
    flex: 1;
    padding: 15px 20px;
}

.session-block {
    display: flex;
    border-bottom: 1px dashed #eee;
    padding: 15px 0;
}

.session-block:last-child {
    border-bottom: none;
    padding-bottom: 0;
}
.session-block:first-child {
    padding-top: 0;
}

.session-time {
    flex: 0 0 80px;
    font-size: 1.1rem;
    font-weight: 600;
    color: #d9534f; /* 紅色字 */
    padding-top: 5px;
}
.session-name {
    flex: 0 0 80px;
    font-size: 1.1rem;
    font-weight: 600;
    color: #d9534f; /* 紅色字 */
    padding-top: 5px;
	writing-mode: vertical-lr;
}
.session-details ul {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}

.session-details li {
    font-size: 1.1rem;
    margin-bottom: 10px;
}

.session-details li a {
    font-weight: 500;
    color: #333;
}
.session-details li a:hover {
    color: #0056b3;
}
.session-details li span {
    color: #666;
    font-size: 0.95rem;
    margin-left: 8px;
}

/* --- Results Page (Table) - 參考 圖2/圖3 --- */
.page-title {
    font-size: 1.6rem;
    font-weight: 600;
    color: #2c3e50;
    border-bottom: 3px solid #007bff;
    padding-bottom: 10px;
    margin-bottom: 25px;
}

.table-responsive-wrapper {
    overflow-x: auto; /* 在小螢幕上啟用水平滾動 */
    margin-top: 20px;
}

.results-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.results-table th, 
.results-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    white-space: nowrap; /* 確保表格內容不換行 */
}

.results-table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    color: #343a40;
    border-top: 1px solid #ddd;
}

/* 條紋式表格 */
.results-table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

.results-table tbody tr:hover {
    background-color: #f1f1f1;
}

/* 欄位對齊 */
.results-table td:nth-child(1), /* 出場序 */
.results-table td:nth-child(3), /* 名序總和 */
.results-table td:nth-child(4), /* 排名 */
.results-table td:nth-child(5) { /* 平均分數 */
    text-align: center;
}
.results-table th:nth-child(1),
.results-table th:nth-child(3),
.results-table th:nth-child(4),
.results-table th:nth-child(5) {
    text-align: center;
}


/* --- Search Page (Form) --- */
.search-form {
    background-color: #fdfdfd;
    border: 1px solid #e9ecef;
    padding: 25px;
    border-radius: 8px;
    max-width: 500px;
    margin: 0 auto 30px auto;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
}

.form-group input[type="text"],
.form-group input[type="date"] {
    width: 100%;
    padding: 10px;
    font-size: 1rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box; /* 確保 padding 不會撐開寬度 */
}

.btn-submit {
    display: block;
    width: 100%;
    padding: 12px;
    font-size: 1.1rem;
    font-weight: 600;
    color: #fff;
    background-color: #007bff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.btn-submit:hover {
    background-color: #0056b3;
}

.search-result h3 {
    font-size: 1.4rem;
    color: #2c3e50;
    margin-bottom: 20px;
}

.error-message {
    color: #d9534f;
    font-weight: bold;
    text-align: center;
}

/* --- Responsive Web Design (RWD) --- */
@media (max-width: 768px) {
    .container {
        padding: 0 15px;
    }

    .content-wrapper {
        padding: 20px;
    }

    .header-container {
        flex-direction: column;
        text-align: center;
    }
    
    .site-title {
        margin-top: 10px;
        font-size: 1.6rem;
    }

    .navigation ul {
        flex-direction: column;
        text-align: center;
    }

    .schedule-row {
        flex-direction: column; /* 賽程卡片垂直堆疊 */
    }

    .day-info {
        flex-basis: auto;
        padding: 10px;
    }

    .session-block {
        flex-direction: column;
    }
    
    .session-time {
        padding-top: 0;
        margin-bottom: 10px;
        border-bottom: 1px dashed #ccc;
        padding-bottom: 5px;
    }
}
/* --- Admin & Message Styles (新增) --- */

.admin-nav {
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    padding: 10px 20px;
    margin-bottom: 20px;
    border-radius: 5px;
}
.admin-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
}
.admin-nav li {
    margin-right: 15px;
}
.admin-nav li a {
    font-weight: 500;
    color: #007bff;
}
.admin-nav li a.active {
    color: #333;
    font-weight: bold;
    text-decoration: none;
}

.message-box {
    padding: 15px 20px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-weight: 500;
}

.message-box.success {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.message-box.error {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    /* .error-message 樣式已存在，但我們用 .message-box.error 統一樣式 */
}

/* 讓後台的表單也使用 .search-form 的樣式 */
.admin-form {
    background-color: #fdfdfd;
    border: 1px solid #e9ecef;
    padding: 25px;
    border-radius: 8px;
    max-width: 600px; /* 後台表單可稍寬 */
    margin: 30px 0;
}

/* 後台的表格也使用 .results-table 樣式 */
.admin-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
    margin-top: 20px;
}
.admin-table th, 
.admin-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    white-space: nowrap;
}
.admin-table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
}
.admin-table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}
.admin-table .action-links a {
    color: #d9534f;
    margin-left: 10px;
    font-weight: bold;
}
.admin-table .action-links a:hover {
    text-decoration: underline;
}
/* --- Official Documents Section (新增) --- */
.official-docs {
    background-color: #e9f5ff;
    border: 1px solid #bce8f1;
    border-radius: 8px;
    padding: 20px 25px;
    margin-bottom: 30px;
}
.official-docs .section-title {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 1.3rem;
    color: #31708f;
    border-bottom: 2px solid #bce8f1;
    padding-bottom: 10px;
}
.official-docs ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}
.official-docs li {
    padding: 8px 0;
    border-bottom: 1px dashed #d1eaff;
}
.official-docs li:last-child {
    border-bottom: none;
}
.official-docs li a {
    font-weight: 500;
    color: #337ab7;
    /* 增加一個 PDF 圖示 */
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-file-earmark-pdf" viewBox="0 0 16 16"><path d="M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2zM9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5v2z"/><path d="M4.603 14.087a.81.81 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.68 7.68 0 0 1 1.482-.645 19.697 19.697 0 0 0 1.062-2.227 7.269 7.269 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.658-.877.37-.198.816-.22 1.224-.072.494.18.841.524.962.997.14.542.115.954-.047 1.278a6.517 6.517 0 0 1-1.03 1.185c-.12.132-.253.274-.384.426.118.25.243.49.377.722.122.21.232.393.333.559.125.202.248.39.368.56.119.169.23.32.329.453.14.192.27.358.375.495.107.14.168.255.193.336a.61.61 0 0 1-.035.465c-.063.18-.19.34-.375.462a.779.779 0 0 1-.51.184c-.31-.01-.58-.152-.793-.382a2.333 2.333 0 0 1-.441-.606c-.143-.247-.29-.504-.441-.776-.152-.271-.31-.553-.474-.847a5.18 5.18 0 0 0-.52-1.04c-.154-.29-.328-.582-.52-.882-.186-.289-.39-.58-.614-.874-.218-.285-.45-.566-.7-.836a6.51 6.51 0 0 1-.569.34c-.164.095-.32.182-.465.26a1.256 1.256 0 0 0-.495.426.74.74 0 0 0-.153.572c.003.165.042.33.125.486.08.152.185.305.31.459.12.15.25.307.397.472.132.152.26.29.377.408a2.511 2.511 0 0 1-.22.28c-.09.11-.19.223-.3.345-.12.125-.25.252-.39.382-.132.12-.25.222-.353.304a.61.61 0 0 1-.42.145z"/></svg>');
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 22px;
}
/* 新增到您的 CSS 文件中 */
.result-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.action-buttons {
    margin-left: auto;
}

.btn-print {
    background-color: #4CAF50;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}

.btn-print:hover {
    background-color: #45a049;
}

.result-item {
    margin-bottom: 20px;
}

@media print {
    .search-form, .action-buttons, .page-title, .error-message {
        display: none !important;
    }
}
/* 新增到您的 CSS 文件中 */
.result-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.action-buttons {
    margin-left: auto;
    display: flex;
    gap: 10px;
}

.btn-print, .btn-certificate {
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}

.btn-print {
    background-color: #4CAF50;
}

.btn-print:hover {
    background-color: #45a049;
}

.btn-certificate {
    background-color: #2196F3;
}

.btn-certificate:hover {
    background-color: #0b7dda;
}

.result-item {
    margin-bottom: 20px;
}

@media print {
    .search-form, .action-buttons, .page-title, .error-message {
        display: none !important;
    }
}