﻿/*#region Blazor用*/
#blazor-error-ui { color-scheme: light only; background: lightyellow; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); box-sizing: border-box; display: none; left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 1000; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
/*#endregion*/

/*色系設定*/
:root {
          --primary-orange: #FF8C00; 
          --dark-orange: #E67E00;
          --text-orange: #E67E00;
          --bg-light: #F8F9FA;
          --bg-light2: #fffef7;
          --text-dark: #333333;
}

#TA_layout .text-orange { color: var(--text-orange); }

#TA_layout .ta_main { background-color: var(--bg-light2); color: var(--text-dark); }

/*#region Nav*/
#TA_layout .ta_header { position: relative; background-image: url('../images/原語會到校網橫幅底圖.jpg'); background-size: cover; background-position: center; border-bottom: 2px solid #3e3a39; }
#TA_layout .ta_header::before { content: ''; position: absolute; inset: 0; background-color: rgba(252, 251, 249, 0.82); }
#TA_layout .ta_header .container { position: relative; z-index: 1; }
/*#endregion*/
/*#region Footer*/
#TA_layout .ta_footer { text-align: center; background-color: #3e3a39; color: #fcfbf9; }
#TA_layout .ta_footer > div { border-top: 1px solid rgba(252, 251, 249, 0.2); }
/*#endregion*/

/*#region TaSignUpBox*/
#TA_layout .TaSignUpBox .page-title { color: #444; font-weight: 700; position: relative; padding-bottom: 15px; margin-bottom: 30px; }
#TA_layout .TaSignUpBox .page-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 60px; height: 4px; background-color: var(--primary-orange); }
#TA_layout .TaSignUpBox .section-title { border-left: 5px solid var(--primary-orange); padding-left: 15px; margin-bottom: 25px; font-weight: 700; color: #444; }
/* 卡片設計 */
#TA_layout .TaSignUpBox .form-container { background: #ffffff; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); padding: 30px; margin-bottom: 30px; box-shadow: 2px 2px 18px #00000030; }
/* 表單元素自定義 */
#TA_layout .TaSignUpBox .form-label { font-weight: 500; margin-bottom: 8px; }
#TA_layout .TaSignUpBox .required::after { content: " *"; color: #dc3545; }
#TA_layout .TaSignUpBox .form-control:focus, .form-select:focus { border-color: var(--primary-orange); box-shadow: 0 0 0 0.25rem rgba(255, 140, 0, 0.25); }
/* 場次選擇卡片 */
#TA_layout .TaSignUpBox .slot-card { cursor: pointer; transition: all 0.2s; border: 2px solid #eee; border-radius: 8px; padding: 15px; text-align: center; height: 100%; }
#TA_layout .TaSignUpBox .slot-card:hover { border-color: var(--primary-orange); background-color: rgba(255, 140, 0, 0.05); }
#TA_layout .TaSignUpBox .slot-input:checked + .slot-card { border-color: var(--primary-orange); background-color: var(--primary-orange); color: white; }
#TA_layout .TaSignUpBox .slot-input { display: none; }
#TA_layout .TaSignUpBox .slot-disabled { background-color: #e9ecef; color: #adb5bd; cursor: not-allowed; }
/* 按鈕設計 */
#TA_layout .TaSignUpBox .btn-submit { background-color: var(--primary-orange); border: none; padding: 12px 50px; font-weight: 700; font-size: 1.1rem; color: white; transition: 0.3s; border-radius: 50px; }
#TA_layout .TaSignUpBox .btn-submit:hover { background-color: var(--dark-orange); transform: translateY(-2px); box-shadow: 0 5px 15px rgba(255, 140, 0, 0.3); color: white; }

#TA_layout .TaSignUpBox .alert-warning-custom { background-color: #FFF4E5; border-left: 5px solid var(--primary-orange); color: #664d03; }
#TA_layout .TaSignUpBox .validation_error { color: #D94869; font-size: 1rem; letter-spacing: 2px; }
#TA_layout .TaSignUpBox .validation_error::before { content: '⚠️'; display: inline-block; margin-right: 0.5rem; vertical-align: middle; font-size: 1.1em; }
/*#endregion*/
/*#region TaGuideBox*/
#TA_layout .TaGuideBox .guide-inner { background-color: #fcfbf9; border-radius: 16px; padding: 2rem; border: 2px solid #e4b789; margin: 0.5rem 0 1.5rem; }
#TA_layout .TaGuideBox .page-title { color: #3e3a39; font-weight: 700; position: relative; padding-bottom: 15px; margin-bottom: 30px; }
#TA_layout .TaGuideBox .page-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 60px; height: 4px; background-color: #b23f3b; }
/* 梯次卡片設計 */
#TA_layout .TaGuideBox .batch-card { background: #fcfbf9; border-radius: 16px; transition: transform 0.3s ease, box-shadow 0.3s ease; overflow: hidden; margin-bottom: 25px; border: 2px solid #3e3a39; }
#TA_layout .TaGuideBox .batch-card:hover { transform: translateY(-5px); box-shadow: 6px 6px 0 #c1843e; }
#TA_layout .TaGuideBox .batch-number { background-color: #3e3a39; color: #fcfbf9; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 8px; font-weight: bold; margin-right: 15px; }
#TA_layout .TaGuideBox .info-label { color: #693737; font-size: 0.9rem; margin-bottom: 2px; }
#TA_layout .TaGuideBox .info-value { color: #3e3a39; font-weight: 500; font-size: 1.1rem; }
/* 按鈕樣式 */
#TA_layout .TaGuideBox .btn-register { background-color: #b23f3b; color: #fff; border: none; border-radius: 50px; padding: 10px 30px; font-weight: 700; transition: 0.3s; }
#TA_layout .TaGuideBox .btn-register:hover { background-color: #693737; color: #fff; box-shadow: 0 4px 12px rgba(178, 63, 59, 0.3); }
#TA_layout .TaGuideBox .btn-locked { background-color: #e0e0e0; color: #999; cursor: not-allowed; border-radius: 50px; padding: 10px 30px; }
/*#endregion*/