/*
 * print.css — 列印樣式（學生端與教師端共用同一份）
 *
 * 頁面上凡是 id="print-area" 的區塊就是「按下列印時要印出來的內容」，
 * 其餘版型元素一律不印。統計名單、帳號通知單都用這一套。
 *
 * 兩端各自在 <head> 載入這一份（不加 media 屬性，由檔案內部的 @media print 判斷）：
 *   學生端 index.php         → assets/css/print.css
 *   教師端 Teacher/index.php → ../assets/css/print.css
 *
 * 【作法：只留下「從 html 到 #print-area」這條鏈，其餘旁支不顯示】
 * 用 :has() 選出「包含列印區的祖先」，把它們的其他子元素（旁支）整個 display:none，
 * 再把這條鏈上的縮排歸零，列印區就會從紙張左上角開始。
 *
 * 一開始用的是常見的「body * { visibility: hidden }」寫法，實測失敗：
 * NiceAdmin 的內容區有 margin-left（側邊欄寬度）而且祖先有 position，
 * 讓 position:absolute 的定位基準不是頁面而是那個祖先，結果姓名欄被切掉。
 * 改成這個寫法就不必知道任何版型 class，學生端的 FlexStart 與教師端的 NiceAdmin 都適用。
 *
 * 【瀏覽器支援】:has() 需要 Chrome 105+／Safari 15.4+／Firefox 121+。
 * 不支援的舊瀏覽器會整條規則忽略，結果是「連版型一起印出來」——
 * 不好看，但內容完整、不會出錯，是可以接受的降級。
 *
 * 【為什麼不另開一支列印專用頁面】
 * 資料已經在畫面上了，另開一頁等於製造第二份會分歧的副本 ——
 * 本專案已經有 37 支「成對但已分歧」的檔案，不要再增加。
 */

@media print {

    /* 旁支（不含列印區、本身也不是列印區的元素）一律不顯示 */
    :has(#print-area) > *:not(:has(#print-area)):not(#print-area) {
        display: none !important;
    }

    /* 教師端 NiceAdmin 的 main#main 有 margin-left:300px（側邊欄的寬度），
       側邊欄在列印時已經被隱藏，那塊留白就得跟著收掉，否則名單會整個往右擠。
       這一條要單獨寫：實測 :has(#print-area) 壓不過 style.css 的 #main 規則。
       兩端的主容器都是 <main id="main">，所以一條就夠。 */
    #main, #footer {
        margin: 0 !important;
        padding: 0 !important;
        /* NiceAdmin 給 #main 設了 transition: all 0.3s，切到列印樣式時 margin 會用
           0.3 秒漸變過去。列印是瞬間取畫面，慢一步就會印出過渡中間的位置，
           所以這裡要把動畫關掉。（實測踩過：截圖量到 288px 而不是 0） */
        transition: none !important;
    }

    /* 同理，整個列印區內不要有任何動畫或轉場 */
    #print-area, #print-area * {
        transition: none !important;
        animation: none !important;
    }

    /* 祖先鏈上的縮排與寬度限制歸零，內容才會貼齊紙張左上角 */
    :has(#print-area) {
        margin: 0 !important;
        padding: 0 !important;
        width: auto !important;
        max-width: none !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    /* 按鈕、匯出連結、可收合的通知文字區塊都不該印出來 */
    .no-print { display: none !important; }

    /* 表格捲動容器在紙上不需要，也不要因此被截斷 */
    #print-area .table-responsive {
        overflow: visible !important;
    }

    /* 長名單跨頁時重複表頭 —— 22 人以上的班級最有感的一項 */
    #print-area thead { display: table-header-group; }
    #print-area tr    { page-break-inside: avoid; }

    /* 不要在連結文字後面把網址也印出來（有些瀏覽器預設會這樣做） */
    a[href]:after { content: ""; }

    /* 深色背景與彩色徽章在黑白印表機上會糊成一團 */
    body {
        background: #fff !important;
        color: #000 !important;
    }
    #print-area .badge {
        border: 1px solid #000 !important;
        background: transparent !important;
        color: #000 !important;
    }
    /* 進度條（投票比例）在紙上只留外框與百分比文字 */
    #print-area .progress {
        border: 1px solid #999 !important;
        background: transparent !important;
    }
    #print-area .progress-bar {
        background: #ddd !important;
        color: #000 !important;
    }
}
