/* ==========================================================================
   RPG Theme Stylesheet (theme-rpg.css)
   GBA 復古像素 JRPG 風格（寶可夢綠寶石 / 星露谷 / 黃金太陽 冒險美學）
   ========================================================================== */

[data-theme="rpg"] {
    /* 核心色彩代碼 (NES 16色感暖色調) */
    --bg-cream: #f4ecd8;             /* 羊皮紙底色 */
    --bg-dark: #2d1f1a;              /* 對話框深色底 / 深墨外框 */
    --ink: #1a1410;                  /* 內文深墨色 */
    --accent-leaf: #6a8c3f;          /* 上班打卡 (HP生命綠) */
    --accent-rose: #c44d4d;          /* 下班打卡 (Boss玫瑰紅) */
    --accent-gold: #d4a04d;          /* 公出任務 (金幣/經驗金) */
    --accent-sky: #6a9bc4;           /* 次要/外框 (MP魔力藍) */
    --frame-wood-light: #8c6d4a;     /* 亮木色邊框 */
    --frame-wood-dark: #5a3f29;      /* 深木色陰影邊 */

    /* 字型系統 */
    --font-family-main: 'Noto Sans TC', 'Microsoft JhengHei', sans-serif;
    --font-family-header: 'Press Start 2P', 'VT323', 'Noto Sans TC', sans-serif;
    
    /* 頁面整體底色與像素微點陣紋理 */
    --body-text-color: #1a1410;
    --body-bg-gradient: none;
    --body-bg-image: radial-gradient(#d8cca9 1.5px, transparent 1.5px);
    
    /* 頂部 Header */
    --header-bg: #2d1f1a;
    --header-border-bottom: 3px solid #8c6d4a;
    --header-box-shadow: 0 4px 0 #1a1410;
    --header-text-color: #f4ecd8;
    --header-text-shadow: 2px 2px 0 #000000;
    --header-font-weight: 700;
    
    --nav-link-color: #f4ecd8;
    --nav-link-hover-color: #d4a04d;
    --nav-link-hover-shadow: none;
    
    /* 卡片與主要內容容器 (羊皮紙木框) */
    --card-bg: #fffdf5;
    --card-border: 3px solid #8c6d4a;
    --card-box-shadow: 3px 3px 0 #5a3f29, 5px 5px 0 #2d1f1a;
    --card-border-radius: 0px;
    --card-clip-path: none;
    --card-padding: 24px;
    
    /* 輸入框 (羊皮紙深凹陷框) */
    --input-bg: #f7f1e1;
    --input-border: 2px solid #5a3f29;
    --input-color: #1a1410;
    --input-border-radius: 0px;
    --input-focus-border: #8c6d4a;
    --input-focus-shadow: 2px 2px 0 #2d1f1a;
    
    /* 按鈕基礎屬性 */
    --button-font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    --button-border-radius: 0px;
    --button-clip-path: none;
    --button-border: 2px solid #2d1f1a;
    
    /* 上班打卡 (HP生命綠) */
    --btn-primary-bg: #6a8c3f;
    --btn-primary-color: #ffffff;
    --btn-primary-border: 2px solid #2d1f1a;
    --btn-primary-shadow: 2px 2px 0 #2d1f1a;
    --btn-primary-hover-bg: #7da54b;
    --btn-primary-hover-color: #ffffff;
    --btn-primary-hover-shadow: 3px 3px 0 #2d1f1a;
    
    /* 下班打卡 (Boss玫瑰紅) */
    --btn-danger-bg: #c44d4d;
    --btn-danger-color: #ffffff;
    --btn-danger-border: 2px solid #2d1f1a;
    --btn-danger-shadow: 2px 2px 0 #2d1f1a;
    --btn-danger-hover-bg: #d95e5e;
    --btn-danger-hover-color: #ffffff;
    --btn-danger-hover-shadow: 3px 3px 0 #2d1f1a;
    
    /* 輔助/公出按鈕 (金幣/經驗金) */
    --btn-outline-bg: #d4a04d;
    --btn-outline-color: #1a1410;
    --btn-outline-border: 2px solid #2d1f1a;
    --btn-outline-shadow: 2px 2px 0 #2d1f1a;
    --btn-outline-hover-bg: #e6b360;
    --btn-outline-hover-color: #1a1410;
    --btn-outline-hover-shadow: 3px 3px 0 #2d1f1a;
    
    /* 次要按鈕 (魔力藍) */
    --btn-secondary-bg: #6a9bc4;
    --btn-secondary-color: #ffffff;
    --btn-secondary-border: 2px solid #2d1f1a;
    --btn-secondary-shadow: 2px 2px 0 #2d1f1a;
    --btn-secondary-hover-bg: #7daed8;
    --btn-secondary-hover-color: #ffffff;
    --btn-secondary-hover-shadow: 3px 3px 0 #2d1f1a;
    
    /* 歷史紀錄明細卡片 */
    --record-row-bg: #f9f4e6;
    --record-row-border: 2px solid #8c6d4a;
    --record-row-color: #1a1410;
    --record-row-shadow: 2px 2px 0 #5a3f29;
    --record-row-border-radius: 0px;
    
    /* Modal 視窗 (NPC 對話框深色底 + 雙重木框) */
    --modal-overlay-bg: rgba(45, 31, 26, 0.75);
    --modal-content-bg: #2d1f1a;
    --modal-content-color: #f4ecd8;
    --modal-content-border: 3px solid #8c6d4a;
    --modal-content-shadow: 4px 4px 0 #1a1410;
    --modal-content-border-radius: 0px;
    --modal-content-clip-path: none;
    --modal-button-bg: #6a8c3f;
    --modal-button-shadow: 2px 2px 0 #1a1410;
    
    /* 底部導航 (GBA 底部木質工具列) */
    --bottom-nav-bg: #2d1f1a;
    --bottom-nav-height: 65px;
    --bottom-nav-border-top: 3px solid #8c6d4a;
    --bottom-nav-shadow: 0 -3px 0 #1a1410;
    --bottom-nav-padding: 0;
    
    --bottom-nav-item-color: #a89379;
    --bottom-nav-item-bg: transparent;
    --bottom-nav-item-border: none;
    --bottom-nav-item-clip-path: none;
    --bottom-nav-item-width: auto;
    --bottom-nav-item-height: auto;
    --bottom-nav-item-active-color: #d4a04d;
    --bottom-nav-item-active-bg: rgba(212, 160, 77, 0.12);
    --bottom-nav-item-active-border: 1px dashed #d4a04d;
    --bottom-nav-item-active-shadow: none;
    
    /* 首頁時鐘與日期 (VT323 / Press Start 2P) */
    --dashboard-time-font: 'VT323', monospace;
    --dashboard-time-size: 3.2rem;
    --dashboard-time-color: #2d1f1a;
    --dashboard-time-shadow: 1px 1px 0 #8c6d4a;
    --dashboard-time-margin: 5px 0;
    --dashboard-time-weight: 400;
    --dashboard-date-font: 'Press Start 2P', monospace;
    --dashboard-date-color: #5a3f29;
    
    --wrapper-padding-top: 75px;
    --wrapper-padding-bottom: 75px;

    /* 登入頁專屬變數 (冒險者公會羊皮紙簽到桌) */
    --login-container-bg: #fffdf5;
    --login-container-border: 3px solid #8c6d4a;
    --login-container-shadow: 4px 4px 0 #5a3f29, 6px 6px 0 #2d1f1a;
    --login-container-border-radius: 0px;
    --login-container-clip-path: none;
    --login-container-padding: 30px 24px;
    --login-container-max-width: 440px;
    --login-container-margin: 8% auto;
    
    --title-font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    --title-letter-spacing: 1px;
    --title-text-color: #2d1f1a;
    --title-text-shadow: 2px 2px 0 #d8cca9;
    --title-font-weight: 700;
    --title-margin-bottom: 1.5rem;
    --title-font-size: 1.3rem;
    
    --label-color: #5a3f29;
    --label-font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    --label-letter-spacing: 1px;
    --label-font-size: 11px;
    
    --button-padding: 12px;
    --button-font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    --button-letter-spacing: 1px;
    --button-border-radius: 0px;
    --button-clip-path: none;
    --button-border: 2px solid #2d1f1a;
    --button-bg: #6a8c3f;
    --button-color: #ffffff;
    --button-shadow: 2px 2px 0 #2d1f1a;
    
    --button-hover-bg: #7da54b;
    --button-hover-color: #ffffff;
    --button-hover-shadow: 3px 3px 0 #2d1f1a;
    
    --error-color: #c44d4d;
    --error-text-shadow: none;
    --error-font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    --error-margin-top: 1rem;
    --error-font-size: 11px;
    --error-letter-spacing: 0.5px;
}

/* === RPG 專屬按鍵點擊位移回饋 (2px Pixel Step) === */
[data-theme="rpg"] button,
[data-theme="rpg"] .btn {
    image-rendering: pixelated;
    transition: none !important;
}

[data-theme="rpg"] button:hover,
[data-theme="rpg"] .btn:hover {
    transform: none !important;
}

[data-theme="rpg"] button:active,
[data-theme="rpg"] .btn:active {
    transform: translate(2px, 2px) !important;
    box-shadow: none !important;
}

/* === 裝飾性雙重木框 (Outer Frame Outline) === */
[data-theme="rpg"] .main-content,
[data-theme="rpg"] .card-lite,
[data-theme="rpg"] .login-container {
    outline: 2px solid #5a3f29 !important;
    outline-offset: -5px;
}

/* === 帳戶與紀錄清單項目 === */
[data-theme="rpg"] .card-lite h5 {
    color: #2d1f1a !important;
    border-bottom: 2px dashed #8c6d4a;
    padding-bottom: 8px;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif;
    font-size: 13px;
    text-shadow: none !important;
}

[data-theme="rpg"] .kv {
    border-bottom: 1px dashed #c2b59b;
    padding: 10px 0;
    color: #1a1410 !important;
}

/* === RPG 對話框風格 (Modal & Message Box) === */
[data-theme="rpg"] .modal-content,
[data-theme="rpg"] .msg-modal-content {
    background: #2d1f1a !important;
    color: #f4ecd8 !important;
    border: 3px solid #8c6d4a !important;
    outline: 2px solid #5a3f29 !important;
    outline-offset: -5px;
    box-shadow: 4px 4px 0 #1a1410 !important;
    position: relative;
}

/* 對話框標題與文字 */
[data-theme="rpg"] .modal-content h1,
[data-theme="rpg"] .modal-content h2,
[data-theme="rpg"] .modal-content h3,
[data-theme="rpg"] .modal-content h4,
[data-theme="rpg"] .modal-content h5,
[data-theme="rpg"] .modal-content .modal-title,
[data-theme="rpg"] .msg-modal-content h4 {
    color: #d4a04d !important;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-shadow: 1px 1px 0 #000000 !important;
}

[data-theme="rpg"] .modal-content p,
[data-theme="rpg"] .msg-modal-content p {
    color: #f4ecd8 !important;
    line-height: 1.6;
}

/* 對話框右下角經典跳動指針 ▼ */
[data-theme="rpg"] .modal-content::after,
[data-theme="rpg"] .msg-modal-content::after {
    content: "▼";
    position: absolute;
    bottom: 8px;
    right: 12px;
    color: #d4a04d;
    font-size: 12px;
    animation: rpgBlink 0.8s infinite steps(2, start);
    pointer-events: none;
}

@keyframes rpgBlink {
    0%, 100% { opacity: 1; transform: translateY(0); }
    50% { opacity: 0; transform: translateY(2px); }
}

[data-theme="rpg"] .modal-content input,
[data-theme="rpg"] .modal-content select,
[data-theme="rpg"] .modal-content textarea {
    background: #f4ecd8 !important;
    color: #1a1410 !important;
    border: 2px solid #8c6d4a !important;
}

/* RPG 對話框按鈕樣式 */
[data-theme="rpg"] .modal-content button#btnSubmitWorkHour,
[data-theme="rpg"] #workHourModal button#btnSubmitWorkHour {
    background: #6a8c3f !important;
    background-color: #6a8c3f !important;
    color: #ffffff !important;
    border: 2px solid #2d1f1a !important;
    border-radius: 0 !important;
    clip-path: none !important;
    box-shadow: 2px 2px 0 #1a1410 !important;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif !important;
    font-size: 11px !important;
}

[data-theme="rpg"] .modal-content button#btnSubmitWorkHour:hover,
[data-theme="rpg"] #workHourModal button#btnSubmitWorkHour:hover {
    background: #7da54b !important;
    background-color: #7da54b !important;
    box-shadow: 3px 3px 0 #1a1410 !important;
}

[data-theme="rpg"] .modal-content button.btn-cancel,
[data-theme="rpg"] #workHourModal button.btn-cancel {
    background: #5a3f29 !important;
    background-color: #5a3f29 !important;
    color: #f4ecd8 !important;
    border: 2px solid #2d1f1a !important;
    border-radius: 0 !important;
    clip-path: none !important;
    box-shadow: 2px 2px 0 #1a1410 !important;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif !important;
    font-size: 11px !important;
}

[data-theme="rpg"] .modal-content button.btn-cancel:hover,
[data-theme="rpg"] #workHourModal button.btn-cancel:hover {
    background: #704f35 !important;
    background-color: #704f35 !important;
    box-shadow: 3px 3px 0 #1a1410 !important;
}

[data-theme="rpg"] .modal-content button#btnDeleteWorkHour,
[data-theme="rpg"] #workHourModal button#btnDeleteWorkHour {
    background: #8b2626 !important;
    background-color: #8b2626 !important;
    color: #ffffff !important;
    border: 2px solid #2d1f1a !important;
    border-radius: 0 !important;
    clip-path: none !important;
    box-shadow: 2px 2px 0 #1a1410 !important;
}

[data-theme="rpg"] .modal-content button#btnDeleteWorkHour:hover,
[data-theme="rpg"] #workHourModal button#btnDeleteWorkHour:hover {
    background: #a33232 !important;
    background-color: #a33232 !important;
    box-shadow: 3px 3px 0 #1a1410 !important;
}

/* === 本週超載能量槽 (8-bit RPG 點陣生命/經驗槽) === */
[data-theme="rpg"] .weekly-energy-grid {
    display: flex !important;
    justify-content: space-between !important;
    gap: 6px !important;
    width: 100% !important;
    margin-top: 14px !important;
    padding: 10px 8px !important;
    background: #2d1f1a !important;
    border: 2px solid #8c6d4a !important;
    box-shadow: 2px 2px 0 #1a1410 !important;
    box-sizing: border-box !important;
}

[data-theme="rpg"] .energy-cell {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

[data-theme="rpg"] .energy-cell .cell-label {
    font-family: 'Press Start 2P', monospace !important;
    font-size: 8px !important;
    color: #d4a04d !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[data-theme="rpg"] .energy-cell .cell-bar {
    width: 100%;
    height: 14px;
    background: #1a1410;
    border: 1px solid #5a3f29;
    border-radius: 0 !important;
    position: relative;
    overflow: hidden;
}

/* 充能格 (已達標：亮綠點陣生命條) */
[data-theme="rpg"] .energy-cell.active .cell-bar {
    background: #6a8c3f !important;
    box-shadow: inset 1px 1px 0 #92bd58, inset -1px -1px 0 #4a632c !important;
}

/* 當日格 (閃爍金色提示) */
[data-theme="rpg"] .energy-cell.current .cell-bar {
    border-color: #d4a04d !important;
    background: #d4a04d !important;
    box-shadow: inset 1px 1px 0 #ffcf75, inset -1px -1px 0 #9e722e !important;
    animation: rpgCellPulse 1s infinite steps(2, start);
}

@keyframes rpgCellPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* === 底部導航選單 (GBA 底部木框) === */
[data-theme="rpg"] .bottom-nav .nav-item {
    color: #a89379 !important;
    transition: none !important;
}

[data-theme="rpg"] .bottom-nav .nav-item:hover {
    color: #f4ecd8 !important;
    transform: none !important;
}

[data-theme="rpg"] .bottom-nav .nav-item.active {
    color: #d4a04d !important;
    text-shadow: 1px 1px 0 #000000;
}

[data-theme="rpg"] .bottom-nav .nav-item .material-symbols-outlined {
    font-size: 24px !important;
}

[data-theme="rpg"] .bottom-nav .nav-item span:not(.material-symbols-outlined) {
    font-family: 'Noto Sans TC', sans-serif !important;
    font-size: 11px !important;
    font-weight: bold;
    letter-spacing: 0.5px;
}

/* 手機版適配微調 */
@media (max-width: 576px) {
    [data-theme="rpg"] .main-content {
        padding: 16px 12px !important;
    }
    
    [data-theme="rpg"] #time {
        font-size: 2.5rem !important;
    }
    
    [data-theme="rpg"] .energy-cell .cell-label {
        font-size: 7px !important;
    }
    
    [data-theme="rpg"] .energy-cell .cell-bar {
        height: 11px;
    }
}

/* === RPG 專屬打卡歷史紀錄月曆 (FullCalendar) 高對比像素美化 === */
[data-theme="rpg"] #calendar {
    background: #fffdf5 !important;
    border: 2px solid #8c6d4a !important;
    outline: 2px solid #5a3f29 !important;
    outline-offset: -5px;
    box-shadow: 3px 3px 0 #5a3f29 !important;
    border-radius: 0 !important;
    padding: 12px !important;
}

[data-theme="rpg"] .fc {
    --fc-page-bg-color: #fffdf5;
    --fc-neutral-bg-color: rgba(90, 63, 41, 0.08);
    --fc-border-color: #c2b59b;
    --fc-today-bg-color: rgba(212, 160, 77, 0.25);
    --fc-list-event-hover-bg-color: rgba(212, 160, 77, 0.15);
    color: #2d1f1a !important;
}

/* 月曆標題與切換按鈕 */
[data-theme="rpg"] .fc .fc-toolbar-title {
    color: #2d1f1a !important;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif !important;
    font-size: 1.1rem !important;
    letter-spacing: 1px;
}

[data-theme="rpg"] .fc .fc-button {
    border-radius: 0 !important;
    clip-path: none !important;
    font-family: 'Press Start 2P', 'Noto Sans TC', sans-serif !important;
    font-size: 10px !important;
    padding: 6px 12px !important;
    border: 2px solid #2d1f1a !important;
    box-shadow: 2px 2px 0 #1a1410 !important;
    transition: none !important;
}

[data-theme="rpg"] .fc .fc-button-primary {
    background: #5a3f29 !important;
    background-color: #5a3f29 !important;
    color: #f4ecd8 !important;
    border: 2px solid #2d1f1a !important;
}

[data-theme="rpg"] .fc .fc-button-primary:hover {
    background: #704f35 !important;
    background-color: #704f35 !important;
    transform: none !important;
    box-shadow: 3px 3px 0 #1a1410 !important;
}

[data-theme="rpg"] .fc .fc-button-primary:active {
    transform: translate(2px, 2px) !important;
    box-shadow: none !important;
}

[data-theme="rpg"] .fc .fc-button-primary:disabled {
    background: #a89379 !important;
    border-color: #5a3f29 !important;
    color: #dfdfdf !important;
    opacity: 0.65;
    transform: none !important;
    box-shadow: 1px 1px 0 #1a1410 !important;
}

/* 星期欄位表頭 (Sun ~ Sat) */
[data-theme="rpg"] .fc th {
    background: #5a3f29 !important;
    border-color: #8c6d4a !important;
    padding: 6px 0 !important;
}

[data-theme="rpg"] .fc th .fc-col-header-cell-cushion {
    color: #f4ecd8 !important;
    font-family: 'Press Start 2P', monospace !important;
    font-size: 10px !important;
    text-decoration: none !important;
    letter-spacing: 0.5px;
}

/* 日期數字 */
[data-theme="rpg"] .fc .fc-daygrid-day-number {
    color: #2d1f1a !important;
    font-family: 'VT323', monospace !important;
    font-size: 17px !important;
    font-weight: bold;
    padding: 4px 6px !important;
}

/* 當日高亮格子邊框提示 */
[data-theme="rpg"] .fc .fc-day-today {
    box-shadow: inset 0 0 0 2px #d4a04d !important;
}

/* === 核心：格子標記對比顯著強化 === */

/* 1. 缺卡日背景 (鮮明冒險血條紅底 + 內嵌點陣紅框) */
[data-theme="rpg"] .fc-bg-miss {
    background: rgba(196, 77, 77, 0.35) !important;
    box-shadow: inset 0 0 0 1.5px #c44d4d !important;
}

/* 2. 補登簽核中背景 (鮮明經驗橘金底 + 內嵌金框) */
[data-theme="rpg"] .fc-bg-pending {
    background: rgba(212, 160, 77, 0.38) !important;
    box-shadow: inset 0 0 0 1.5px #d4a04d !important;
}

/* 3. 休假日/非工作日背景 (羊皮紙深棕區隔) */
[data-theme="rpg"] .fc-bg-rest {
    background: rgba(90, 63, 41, 0.12) !important;
}

/* 點點標記 (●) 像素銳利化 (移除模糊光暈) */
[data-theme="rpg"] .fc-dot-ok .fc-event-title {
    color: #4e7c2c !important;
    font-weight: 900;
    text-shadow: none !important;
}

[data-theme="rpg"] .fc-dot-pending .fc-event-title {
    color: #d48817 !important;
    font-weight: 900;
    text-shadow: none !important;
}

[data-theme="rpg"] .fc-dot-miss .fc-event-title {
    color: #b83232 !important;
    font-weight: 900;
    text-shadow: none !important;
}

[data-theme="rpg"] .fc-dot-rest .fc-event-title {
    color: #6a9bc4 !important;
    font-weight: 900;
    text-shadow: none !important;
}

/* 圖例文字與方塊同步 RPG 風格調校 */
[data-theme="rpg"] .legend {
    color: #2d1f1a !important;
    font-family: 'Noto Sans TC', sans-serif !important;
    font-weight: 600;
}

[data-theme="rpg"] .legend .bg-miss {
    background: rgba(196, 77, 77, 0.45) !important;
    border: 1px solid #c44d4d !important;
}

[data-theme="rpg"] .legend .bg-pending {
    background: rgba(212, 160, 77, 0.45) !important;
    border: 1px solid #d4a04d !important;
}

[data-theme="rpg"] .legend .bg-rest {
    background: rgba(90, 63, 41, 0.18) !important;
    border: 1px solid #8c6d4a !important;
}

[data-theme="rpg"] .sub {
    color: #5a3f29 !important;
}