@import url('reset-all.css');

/* ---全站共用設定--- */
/* 匯入外部字型 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700');

html {
    font-size: 1rem;
}

/* Font size adjustment classes */
html.font-small {
    font-size: 0.875rem;
}

html.font-default {
    font-size: 1rem;
}

html.font-large {
    font-size: 1.125rem ;
}

html, body {
    font-family: 'Noto Sans TC', sans-serif, Helvetica, '微軟正黑體', Arial;
    color: var(--textcolor);
    font-weight: 500;
    background-color: var(--white);
    letter-spacing: 1.6px;
    overflow-x: hidden;
    line-height: 1.6;
}

body {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    padding: 0;
    margin: 0;
    overflow-x: hidden;
}

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    color: var(--secondary);
    text-decoration: underline;
}

a, button {
    transition: .3s;
    cursor: pointer;
}

button:focus, a:focus {
    outline: 3px dashed var(--outline-focus) !important;
    transition: .3s;
}

hr{
    border: none;
    border-top: 1px solid var(--textcolor);
    margin: 1rem 0;
    opacity: 1;
}

/*-- 清單樣式：數字 --*/
ol {
    padding-left: 1.5rem;
}

/*-- 清單樣式：◆ --*/
.list-diamond {
    list-style: none;
}

.list-diamond li::before {
    content: "◆";
    margin-right: 0.5rem;
}

/*-- 清單樣式：(num) --*/
.list-bracket-number {
    list-style: none; /* 移除預設數字 */
    counter-reset: num; /* 重設計數器 */
    padding-left: 1.5rem;
    word-break: break-all;
}

.list-bracket-number li {
    counter-increment: num;
    position: relative;
    padding-left: 0.5rem;
}

.list-bracket-number li::before {
    content: "(" counter(num) ")"; /* 顯示 (1) (2) (3) */
    position: absolute;
    left: -1.5rem;
}

p {
    word-break: break-word;
}

input[type="radio"] {
    display: none;
}

.g-5, .gy-5 {
    --bs-gutter-y: 2.5rem;
}

.g-5, .gx-5 {
    --bs-gutter-x: 2.5rem;
}

.gap-5 {
    gap: 2.5rem !important;
}

/* ---顏色變數--- */

:root {
    --primary: #1B5E20;
    --primary_light: #B9D495;
    --secondary: #C05717;
    --secondary_light: #EAD693;
    --secondary_dark: #B89A00;
    --textcolor: #000000;
    --block-green: #F5F9E8;

    /* 灰階 */
    --white: #ffffff;
    --gray_10: #F5F5F5;
    --gray_20: #4A4A4A;
    --black: #000;

    /* 無障礙導覽焦點顏色 - 深紅色 */
    --outline-focus: #B71C1C;

    /* Badge 檔案類型顏色  */
    --badge-pdf: #B71C1C;
    --badge-doc: #004085;
    --badge-odt: #0A6C7E;
}


/*-------- fontsize --------*/
/* 字級設定，以1rem為單位。（方便未來RWD文字變化時可以幾乎不寫字級設定） */
/* 基礎: 1rem = 18px (桌面版) / 16px (手機版 <540px) */

.fz_h1 {
    font-size: 2rem;
    /* 32px (桌面) */
}

.fz_h2 {
    font-size: 1.75rem;
    /* 28px (桌面) */
}

.fz_h3 {
    font-size: 1.5rem;
    /* 24px (桌面) */
}

.fz_h4 {
    font-size: 1.25rem;
    /* 20px (桌面) */
}

.fz_h5 {
    font-size: 1.125rem;
    /* 18px (桌面) */
}

.fz_h6 {
    font-size: 1rem;
    /* 16px (桌面) */
}

.fz_h7 {
    font-size: 0.87rem;
    /* 14px (桌面)*/
}

/* -------- RWD設定 [RWD sm] -------- */
@media (max-width: 575px) {
    html {
        font-size: 0.875rem;
    }

    html.font-small {
        font-size: 0.75rem;
    }

    html.font-default {
        font-size: 0.875rem;
    }

    html.font-large {
        font-size: 1rem;
    }
    .fz_h5 {
        font-size: 1.25rem;
        /* 18px (手機) */
    }

    .fz_h6 {
        font-size: 1.125rem;
        /* 16px (手機) */
    }

    .fz_h7 {
        font-size: 1rem;
        /* 14px (手機)*/
    }
}
