/* 頁面基本樣式設定 */
body {
    margin: 0; 										/* 移除頁面預設邊距 */
    display: flex; 									/* 使用 Flexbox 進行對齊 */
    justify-content: center; 						/* 水平置中內容 */
    align-items: center; 							/* 垂直置中內容 */
    height: 100vh; 									/* 設定頁面高度為視口高度 */
    background-color: #ffffff;						/* 背景色設定為白色 */
    font-family: Arial, sans-serif; 				/* 頁面預設字型 */
}

/* 所有按鈕的樣式設定 */
button {
    font-size: 16px; 								/* 設定字型大小 */
    padding: 10px 20px; 							/* 設定按鈕內部填充距離 */
    cursor: pointer; 								/* 指針在按鈕上顯示為手形 */
    margin: 5px;									/* 按鈕之間的間距 */
}

/* 預設隱藏的列印內容區塊 */
.a4-content {
	display: none; 									/* 頁面預覽時隱藏內容 */
}

/* 列印模式樣式設定 */
@media print {
    /* 設定列印頁面大小和邊距 */
    @page {
        size: A4; 									/* 設定列印頁面大小為A4 */
        margin: 0; 									/* 移除頁面邊距，使用全頁列印 */
    }

    /* 列印時顯示的內容區塊設定 */
    .a4-content {
        display: block; 							/* 列印時顯示內容 */
        position: relative; 							/* 使用固定定位避免影響頁面佈局 */
        width: 210mm; 								/* 設定寬度為A4寬度 */
        height: 297mm; 								/* 設定高度為A4高度 */
        margin: 0; 									/* 移除內外邊距 */
        background-color: white; 					/* 背景設定為白色 */
        font-family: 'DFKai-SB', '標楷體', serif; 	/* 指定列印時使用的字型為標楷體 */
        z-index: 1000;                              /*確保列印內容在列印時顯示在最上層 */
    }

    /* 定位文字通用設定 */
    .text-box-vertical-rl, .text-box-vertical-lr, .text-box-horizontal-rtl, .text-box-horizontal-ltr {
        position: absolute; 						/* 絕對定位，根據父元素定位 */
        overflow-wrap: break-word; 					/* 當文字超出容器寬度時自動換行 */
        display: flex; 								/* 使用 Flexbox 進行內容排列 */
        flex-wrap: wrap; 							/* 允許內容換行 */
        align-content: flex-start; 					/* 內容從起點開始排列 */
        font-size: 20pt; 							/* 預設字型大小為20pt */
		justify-content: flex-start;   				/* 讓文字靠上對齊 */
        align-items: flex-start;       				/* 讓文字靠上對齊 */
	}

/* 直書通用設定 */
.text-box-vertical-rl, .text-box-vertical-lr {
    letter-spacing: 0mm;							/* 水平間距 */
	line-height: 1; 								/* 垂直間距 */
}

/* 橫書通用設定 */
.text-box-horizontal-rtl, .text-box-horizontal-ltr {
	letter-spacing: 0mm;							/* 水平間距 */
    line-height: 1; 								/* 垂直間距 */
}

/* 直書模式，從右向左書寫，靠上對齊 */
.text-box-vertical-rl {
    writing-mode: vertical-rl;
}

/* 直書模式，從左向右書寫，靠左對齊 */
.text-box-vertical-lr {
    writing-mode: vertical-lr;
}

/* 橫書模式，從右至左書寫，靠右對齊 */
.text-box-horizontal-rtl {
    direction: rtl; 
    text-align: right;
}

/* 橫書模式，從左至右書寫，靠左對齊 */
.text-box-horizontal-ltr {
    direction: ltr;
    text-align: left;
}