@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* /Component/Modal/ListDisplayModal.razor.rz.scp.css */
body[b-285ij2rabn] {
}
/* /Component/Modal/ParserModal.razor.rz.scp.css */
.ptm-wrap[b-00pnghv8ph] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    color: #111827;
    font-size: 14px;
    min-width: 50vw;
}

/* 輸入區 */
.ptm-input .ptm-label[b-00pnghv8ph] {
    display: block;
    font-weight: 600;
    margin-bottom: 6px;
}

.ptm-textarea[b-00pnghv8ph] {
    width: 100%;
    min-height: 160px;
    resize: vertical;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    outline: none;
    line-height: 1.6;
}

    .ptm-textarea:focus[b-00pnghv8ph] {
        border-color: #60a5fa;
        box-shadow: 0 0 0 3px rgba(96,165,250,.25);
    }

.ptm-actions[b-00pnghv8ph] {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    justify-content:space-between;
}

.ptm-btn[b-00pnghv8ph] {
    appearance: none;
    border: 1px solid #d1d5db;
    background: #fff;
    padding: 8px 12px;
    border-radius: 10px;
    cursor: pointer;
    transition: box-shadow .15s ease, transform .02s ease, background .15s ease;
}

    .ptm-btn:hover[b-00pnghv8ph] {
        box-shadow: 0 2px 8px rgba(0,0,0,.06);
    }

    .ptm-btn:active[b-00pnghv8ph] {
        transform: translateY(1px);
    }

    .ptm-btn:disabled[b-00pnghv8ph] {
        opacity: .55;
        cursor: not-allowed;
        box-shadow: none;
    }

    .ptm-btn.primary[b-00pnghv8ph] {
        border-color: #60a5fa;
        background: #eff6ff;
    }

    .ptm-btn.success[b-00pnghv8ph] {
        border-color: #34d399;
        background: #ecfdf5;
    }

    .ptm-btn.danger[b-00pnghv8ph] {
        border-color: #f87171; /* 紅色邊框 */
        background: #fef2f2; /* 淺紅底色 */
        color: #b91c1c; /* 深紅字 */
    }

.ptm-hint[b-00pnghv8ph] {
    margin-top: 6px;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

    .ptm-hint .sep[b-00pnghv8ph] {
        opacity: .6;
    }

.kbd[b-00pnghv8ph] {
    display: inline-block;
    border: 1px solid #d1d5db;
    padding: 0 6px;
    border-radius: 6px;
    background: #f9fafb;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
}

/* 結果區 */
.ptm-result[b-00pnghv8ph] {
    border-top: 1px dashed #e5e7eb;
    padding-top: 12px;
}

.ptm-result-head[b-00pnghv8ph] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 10px;
}

    .ptm-result-head .title[b-00pnghv8ph] {
        font-weight: 700;
    }

    .ptm-result-head .stats[b-00pnghv8ph] {
        display: flex;
        gap: 8px;
        color: #6b7280;
        font-size: 13px;
    }

        .ptm-result-head .stats .ok[b-00pnghv8ph] {
            color: #059669;
        }

        .ptm-result-head .stats .bad[b-00pnghv8ph] {
            color: #b91c1c;
        }

        .ptm-result-head .stats .dot[b-00pnghv8ph] {
            opacity: .4;
        }

.ptm-list[b-00pnghv8ph] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ptm-empty[b-00pnghv8ph] {
    color: #9ca3af;
    padding: 12px;
    border: 1px dashed #e5e7eb;
    border-radius: 10px;
    background: #fafafa;
}

/* 列表項目 */
.ptm-row[b-00pnghv8ph] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    align-items: center;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
}

    .ptm-row.ok[b-00pnghv8ph] {
        border-color: #bbf7d0;
        background: #f0fdf4;
    }

    .ptm-row.bad[b-00pnghv8ph] {
        border-color: #fecaca;
        background: #fef2f2;
    }

.ptm-main[b-00pnghv8ph] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.ptm-line[b-00pnghv8ph] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-weight: 600;
}

.ptm-item[b-00pnghv8ph] {
}

.ptm-qty[b-00pnghv8ph] {
    padding: 0 6px;
    border-radius: 6px;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
}

.ptm-unit[b-00pnghv8ph] {
    opacity: .9;
}

.ptm-remark[b-00pnghv8ph] {
    color: #6b7280;
    font-weight: 500;
}

.ptm-org[b-00pnghv8ph] {
    font-size: 12px;
    color: #6b7280;
    word-break: break-all;
}

.ptm-del[b-00pnghv8ph] {
    appearance: none;
    border: none;
    background: #fef2f2;
    color: #b91c1c;
    width: 28px;
    height: 28px;
    line-height: 26px;
    text-align: center;
    border-radius: 8px;
    cursor: pointer;
    font-size: 18px;
    padding: 0;
}

    .ptm-del:hover[b-00pnghv8ph] {
        background: #fee2e2;
    }

    .ptm-del:active[b-00pnghv8ph] {
        transform: translateY(1px);
    }

/* 小尺寸優化 */
@media (max-width: 560px) {
    .ptm-actions[b-00pnghv8ph] {
        flex-wrap: wrap;
    }

    .ptm-result-head[b-00pnghv8ph] {
        flex-direction: column;
        gap: 6px;
    }
}
/* /Component/PageComponents/ShipmentView.razor.rz.scp.css */
/* 頁面容器 */
.pagecontainer[b-6vcs4n7zk6] {
    width: 100%;
    max-width: 384px;  /*58mm 熱敏印表機的最大列印寬度 */
    margin: 0 auto;
    padding: 16px 0px;
    font-size: 12px;
    font-family: "Arial", sans-serif;
}

/* 頁面標題區域 */
.pageheader[b-6vcs4n7zk6] {
    width: 100%;
    text-align: center;
    margin-bottom: 5px;
}

.pageheader-title[b-6vcs4n7zk6] {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 8px;
}

.pageheader-row[b-6vcs4n7zk6] {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
}

/* 內容區域 */
.pagecontent[b-6vcs4n7zk6] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 10px;
}

/* 標題與內容列 */
.contentheader[b-6vcs4n7zk6], .contentitem[b-6vcs4n7zk6] {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px dashed #000; /* 點線符合熱感紙列印風格 */
    padding: 3px 0;
}

.contentheader[b-6vcs4n7zk6] {
    border-bottom: 1px solid #000;
    font-weight: bold;
}

    .contentheader span[b-6vcs4n7zk6], .contentitem span[b-6vcs4n7zk6] {
        flex-grow: 0;
        white-space: nowrap; /* 避免自動換行 */
        overflow: hidden;
        text-overflow: ellipsis;
    }

        /* 第一欄（品名）40% */
        .contentheader span:nth-child(1)[b-6vcs4n7zk6],
        .contentitem span:nth-child(1)[b-6vcs4n7zk6] {
            flex-basis: 40%; /* 給品名更多空間 */
            text-align: left;
        }

        /* 其餘欄位 17% */
        .contentheader span:nth-child(2)[b-6vcs4n7zk6],
        .contentitem span:nth-child(2)[b-6vcs4n7zk6],
        .contentheader span:nth-child(3)[b-6vcs4n7zk6],
        .contentitem span:nth-child(3)[b-6vcs4n7zk6],
        .contentheader span:nth-child(4)[b-6vcs4n7zk6],
        .contentitem span:nth-child(4)[b-6vcs4n7zk6] {
            flex-basis: 20%;
            text-align: right;
        }

/* 結尾總計 */
.contentfooter[b-6vcs4n7zk6] {
    text-align: start;
    font-size: 14px;
    font-weight: bold;
    padding-top: 5px;
}

.shipment-toolbar[b-6vcs4n7zk6] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pagecontainer[b-6vcs4n7zk6] {
    padding: 0 12px;
}


.pagecontainer-wrapper[b-6vcs4n7zk6] {
    /* 你可以依按鈕高度調整這兩個數字 */
    padding-top: 74px; /* 上方工具列高度 + 間距 */
    padding-bottom: 92px; /* 下方工具列高度 + 間距 + 安全區 */
    box-sizing: border-box;
}

.shipment-toolbar[b-6vcs4n7zk6] {
    padding: 0 12px;
}

.shipment-toolbar:not(.sticky-bottom)[b-6vcs4n7zk6] {
    position: fixed;
    top: 12px;
    width: 100%;
    justify-content: space-between;
}

    .shipment-toolbar.sticky-bottom[b-6vcs4n7zk6] {
        position: fixed;
        bottom: calc(12px + env(safe-area-inset-bottom));
        width: 100%;
    }

.btn[b-6vcs4n7zk6] {
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 13px;
    border: 1px solid #ccc;
    
}
/* /Component/PageComponents/TriSegmentSwitch.razor.rz.scp.css */
/* TriSegmentSwitch.razor.css */
.tri[b-duj4bsjcn1], .tri *[b-duj4bsjcn1] {
    box-sizing: border-box;
}

.tri[b-duj4bsjcn1] {
    --bg: #f3f4f6;
    --bd: rgba(15, 23, 42, .12);
    --txt: #475569;
    --txtOn: #0f172a;
    --on: #ffffff;
    --shadow: 0 10px 28px rgba(15, 23, 42, .08);
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    padding: 6px;
    border-radius: 999px;
    background: var(--bg);
    border: 1px solid var(--bd);
    box-shadow: 0 1px 0 rgba(255,255,255,.7) inset;
}

/* 真正的 radio 隱藏，但保留可用性 */
.tri__input[b-duj4bsjcn1] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.tri__seg[b-duj4bsjcn1] {
    appearance: none;
    user-select: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    min-width: 84px;
    border-radius: 999px;
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .2px;
    color: var(--txt);
    transition: transform .12s ease, background .15s ease, color .15s ease, box-shadow .15s ease, filter .15s ease;
}

    .tri__seg:hover[b-duj4bsjcn1] {
        filter: brightness(.98);
    }

    .tri__seg.is-on[b-duj4bsjcn1] {
        background: var(--on);
        color: var(--txtOn);
        box-shadow: var(--shadow);
    }

    .tri__seg:active[b-duj4bsjcn1] {
        transform: scale(.98);
    }

    /* keyboard focus */
    .tri__seg:focus[b-duj4bsjcn1] {
        outline: none;
    }

    .tri__seg:focus-visible[b-duj4bsjcn1] {
        box-shadow: 0 0 0 3px rgba(59, 130, 246, .25), var(--shadow);
    }
/* /Layout/LeftNavPageLayout.razor.rz.scp.css */
.ds-layout-container[b-g1oeqzmgnn] {
    display: flex;
    min-height: 100vh;
    /* background: linear-gradient(145deg, #f5f7fa 0%, #e4e9f2 100%); */
}

/* 行動端頂部欄 */
.ds-mobile-header[b-g1oeqzmgnn] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: rgba(255, 255, 255, 0.95);
    /* backdrop-filter: blur(0px); */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    z-index: 99;
    padding: 0 1rem;
    background: linear-gradient(145deg, #f5f7fa 0%, #e4e9f2 100%);
}

.ds-burger-menu[b-g1oeqzmgnn] {
    background: none;
    border: none;
    color: #37474F;
    font-size: 24px;
    padding: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    /* 移除任何可能的浮動或定位屬性 */
}

.ds-mobile-header-title[b-g1oeqzmgnn] {
    color: #2196F3;
    font-size: 20px;
    padding-left:10px;
}

.ds-burger-menu:hover[b-g1oeqzmgnn] {
    color: #2196F3;
}

/* 導航容器 */
.ds-navcontainer[b-g1oeqzmgnn] {
    width: 280px;
    background: rgba(255, 255, 255, 0.95);
    /* backdrop-filter: blur(0px); */
    border-right: 1px solid #E0E0E0;
    height: 100vh;
    position: fixed;
    box-shadow: 0 4px 6px rgba(33, 150, 243, 0.1);
    background: linear-gradient(145deg, #f5f7fa 0%, #e4e9f2 100%);
}

.ds-nav-list[b-g1oeqzmgnn] {
    list-style: none;
    padding: 1rem 0;
    margin: 0;
}

/* 導航項目樣式 */
.ds-nav-item[b-g1oeqzmgnn] {
    margin: 0.5rem 1rem;
    border-radius: 8px;
    overflow: hidden;
    background: white;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.ds-nav-item:hover[b-g1oeqzmgnn] {
    box-shadow: 0 4px 6px rgba(33, 150, 243, 0.1);
    transform: translateY(-1px);
}

.ds-nav-item-main[b-g1oeqzmgnn] {
    padding: 12px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.ds-nav-title[b-g1oeqzmgnn] {
    color: #37474F;
    font-weight: 500;
}

.ds-submenu-indicator[b-g1oeqzmgnn] {
    font-size: 12px;
    color: #607D8B;
    transition: all 0.3s ease;
}

.ds-submenu-expanded .ds-submenu-indicator[b-g1oeqzmgnn] {
    transform: rotate(180deg);
}

/* 主連結樣式 */
.ds-main-link[b-g1oeqzmgnn] {
    padding: 12px 20px;
    display: block;
    text-decoration: none;
    color: #37474F;
    transition: all 0.5s ease;
    position: relative;
    overflow: hidden;
}

.ds-main-link[b-g1oeqzmgnn]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 3px;
    background: #2196F3;
    transform: scaleY(0);
    transition: all 0.3s ease;
}

.ds-main-link:hover[b-g1oeqzmgnn]::before {
    transform: scaleY(1);
}

/* 子選單樣式 */
.ds-sub-links[b-g1oeqzmgnn] {
    display: none;
    background: rgba(255, 255, 255, 0.5);
    border-top: 1px solid #E0E0E0;
}

.ds-submenu-expanded[b-g1oeqzmgnn] {
    display: block;
    animation: slideDown-b-g1oeqzmgnn 0.3s ease-out;
}

.ds-nav-link[b-g1oeqzmgnn] {
    padding: 10px 20px 10px 40px;
    display: block;
    text-decoration: none;
    color: #607D8B;
    transition: all 0.3s ease;
    position: relative;
}

.ds-nav-link[b-g1oeqzmgnn]::before {
    content: '•';
    position: absolute;
    left: 25px;
    opacity: 0;
    transition: all 0.3s ease;
}

.ds-nav-link:hover[b-g1oeqzmgnn] {
    color: #2196F3;
    background: #E3F2FD;
}

.ds-nav-link:hover[b-g1oeqzmgnn]::before {
    opacity: 1;
}

/* 內容區域 */
.ds-pagecontent[b-g1oeqzmgnn] {
    flex: 1;
    /* margin-left: 280px; */
    /* padding: 2rem; */
    position: relative;
    background: white;
    /* border-radius: 12px; */
    margin: 0rem 0rem 0rem 280px;
    /* box-shadow: 0 2px 4px rgba(0,0,0,0.05); */
}

/* Loading 樣式 */
.ds-loading-overlay[b-g1oeqzmgnn] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    /* backdrop-filter: blur(10px); */
    display: flex;
    justify-content: center;
    align-items: center;
}

.ds-loading-spinner[b-g1oeqzmgnn] {
    width: 40px;
    height: 40px;
    border: 3px solid #E3F2FD;
    border-top: 3px solid #2196F3;
    border-radius: 50%;
    animation: spin-b-g1oeqzmgnn 1s linear infinite;
}

@keyframes spin-b-g1oeqzmgnn {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes slideDown-b-g1oeqzmgnn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 響應式設計 */
@media (max-width: 768px) {
    .ds-layout-container[b-g1oeqzmgnn] {
        flex-direction: column;
    }

    .ds-mobile-header[b-g1oeqzmgnn] {
        display: flex;
        justify-content: space-between;
        align-items: center;

    }

    .ds-navcontainer[b-g1oeqzmgnn] {
        display: none;
        width: 100%;
        height: auto;
        position: fixed;
        top: 60px;
        z-index: 999;
    }

    .ds-pagecontent[b-g1oeqzmgnn] {
        margin: 60px 0rem 0rem 0rem;
    }

    .ds-nav-item[b-g1oeqzmgnn] {
        margin: 0.5rem;
    }

    /* 當導航條隱藏時 */
    .navhide[b-g1oeqzmgnn] {
        transform: translateY(-100%);
        /* 向上滑動隱藏 */
    }

    /* 當導航條出現時 */
    .navshow[b-g1oeqzmgnn] {
        transform: translateY(0);
        /* 從上方滑入 */
        animation: navfadein-b-g1oeqzmgnn ease 1s;
    }
}

/* 互動效果 */
.ds-nav-item-main:hover[b-g1oeqzmgnn],
.ds-main-link:hover[b-g1oeqzmgnn] {
    background: #E3F2FD;
    color: #2196F3;
}

/* 額外的動畫效果 */
.ds-nav-item[b-g1oeqzmgnn],
.ds-nav-link[b-g1oeqzmgnn],
.ds-main-link[b-g1oeqzmgnn] {
    position: relative;
    overflow: hidden;
}

/* .ds-nav-item::after,
.ds-nav-link::after,
.ds-main-link::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(120deg,
            transparent,
            rgba(255, 255, 255, 0.3),
            transparent);
    transition: 0.5s;
} */

.ds-nav-item:hover[b-g1oeqzmgnn]::after,
.ds-nav-link:hover[b-g1oeqzmgnn]::after,
.ds-main-link:hover[b-g1oeqzmgnn]::after {
    left: 100%;
}




@keyframes navfadein-b-g1oeqzmgnn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@media print {
    .ds-mobile-header[b-g1oeqzmgnn] {
        display: none !important;
    }

    .ds-navcontainer[b-g1oeqzmgnn] {
        display: none !important;
    }

    .ds-pagecontent[b-g1oeqzmgnn] {
        margin: 0;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
/* /Layout/NavMenu.razor.rz.scp.css */
/* nav-menu 基本樣式 */
.nav-menu[b-aygo60u7ji] {
    background-color: #cccccc99; /* 設置半透明的背景顏色 */
    backdrop-filter: blur(4px); /* 背景模糊處理 */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 12px 0px; /* 增加上下邊距 */
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.3); /* 更加強烈的陰影效果 */
    z-index: 500; /* 讓導航條浮在最上方 */
    /*transition: transform 0.3s ease, box-shadow 0.3s ease;*/
    font-family: "Noto Sans TC", sans-serif;
    justify-content: center;
    display: flex;
}

    /* 當導航條隱藏時 */
    .nav-menu.hide[b-aygo60u7ji] {
        transform: translateY(-100%); /* 向上滑動隱藏 */
    }

    /* 當導航條出現時 */
    .nav-menu.show[b-aygo60u7ji] {
        transform: translateY(0); /* 從上方滑入 */
        animation: navfadein-b-aygo60u7ji ease 1s;
    }

    /* container - 設置flex布局 */
    .nav-menu .navcontainer[b-aygo60u7ji] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 90%;
        max-width: 1600px;
    }

    /* Logo和標題部分 */
    .nav-menu .logo-link[b-aygo60u7ji] {
        display: flex;
        align-items: center;
        text-decoration: none;
        gap: 0em;
    }

    .nav-menu .logo[b-aygo60u7ji] {
        width: 55px;
        height: 55px;
        background-color: rgba(255,255,255,1);
        padding: 5px;
        border-radius: 5px;
        margin-right: 10px;
    }

    .nav-menu .site-title[b-aygo60u7ji] {
        border-radius: 8px;
        font-weight: bolder;
        color: navy;
        padding: 4px 6px;
        text-decoration: none;
        font-size: 22px;
    }

    /* 電腦版選單 - 靠右 */
    .nav-menu .pc-nav-links[b-aygo60u7ji] {
        display: flex;
        list-style: none;
        gap: 20px; /* 增加選單間距 */
        margin: 0;
        padding: 0;
        margin-left: auto; /* 靠右對齊 */
    }

        .nav-menu .pc-nav-links .nav-item[b-aygo60u7ji] {
            position: relative;
        }

        .nav-menu .pc-nav-links a[b-aygo60u7ji] {
            text-decoration: none;
            color: #222;
            padding: 10px 15px;
            font-size: 22px;
            transition: color 0.3s, background-color 0.3s;
            border-radius: 5px;
        }

            .nav-menu .pc-nav-links a:hover[b-aygo60u7ji] {
                color: #f2f2f2; /* 更淺的白色 */
                background-color: #555; /* 藍綠色系 */
            }

    /* 下拉選單 */
    .nav-menu .dropdown-toggle[b-aygo60u7ji] {
        background: none;
        border: none;
        color: #fff;
        cursor: pointer;
    }

    .nav-menu .dropdown-menu[b-aygo60u7ji] {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background-color: #333; /* 更新下拉選單背景色，與主色系一致 */
        list-style: none;
        padding: 10px 0px;
        width: 180px;
        z-index: 300;
        border-radius: 5px;
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    }

        .nav-menu .dropdown-menu a[b-aygo60u7ji] {
            display: block;
            padding: 10px 20px;
            color: #fff; /* 白色文字 */
            text-decoration: none;
        }

            .nav-menu .dropdown-menu a:hover[b-aygo60u7ji] {
                background-color: #666; /* 更深的藍綠色系，適合hover效果 */
            }

    .nav-menu .dropdown:hover .dropdown-menu[b-aygo60u7ji] {
        display: block;
    }

    /* 手機版選單 */
    .nav-menu .burger-icon[b-aygo60u7ji] {
        display: none; /* 預設電腦版隱藏 */
        width: 30px;
        height: 30px;
        background: url('images/burger.png') no-repeat center;
        background-size: contain;
        cursor: pointer;
    }

/* 手機版選單開關樣式 */
.burger-switch[b-aygo60u7ji] {
    display: none;
}

/* 手機版選單開關 */
.nav-menu .burger-label[b-aygo60u7ji] {
    display: none;
    cursor: pointer;
}



.burger-switch:checked ~ .phone-nav-menu[b-aygo60u7ji] {
    max-height: 80vh;
    padding: 20px 0;
}


.phone-nav-menu[b-aygo60u7ji] {
    display: block;
    list-style: none;
    background-color: #666; /* 藍綠色系 */
    position: absolute;
    top: 65px;
    left: 0;
    width: 100%;
    z-index: 500;
    border-radius: 5px;
    max-height: 0;
    transition: .5s ease-in-out;
    overflow: hidden;
}






.phone-nav-menu .nav-item[b-aygo60u7ji] {
    text-align: center;
    opacity: 0;
    transition: 1s;
    margin-bottom: 1em;
}

.burger-switch:checked ~ .phone-nav-menu .nav-item[b-aygo60u7ji] {
    opacity: 1;
}

.phone-nav-menu .nav-item .main-link[b-aygo60u7ji] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
    margin-top: 1em;
}

.phone-nav-menu .nav-item .nav-item-main[b-aygo60u7ji] {
    font-size: 1em;
    color: whitesmoke;
    text-align: start;
    border-bottom: 1px solid white;
    margin: 10px 20vw 10px 20vw;
}


.phone-nav-menu .nav-item .nav-link[b-aygo60u7ji] {
    font-size: 1.5em;
    text-decoration: none;
    color: white;
}





/* 手機版選單開關 - 開啟時顯示 */
@media (max-width: 768px) {
    .nav-menu .pc-nav-links[b-aygo60u7ji] {
        display: none; /* 電腦版選單隱藏 */
    }

    .nav-menu .burger-icon[b-aygo60u7ji] {
        display: block; /* 顯示漢堡選單圖示 */
        margin-left: auto;
    }
}


@keyframes navfadein-b-aygo60u7ji {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* /Layout/TopNavPageLayout.razor.rz.scp.css */
.profile-nav-container[b-u5f42x0y6n] {
    position: relative;
    width: 100%;
    height: auto; /* Let the height adjust based on content */
    cursor: default;
}

.loadingcomponent[b-u5f42x0y6n] {
    display: flex;
    height: 100vh;
    width: 100%;
    justify-content: center;
    align-items: center;
}
/* /Pages/ContentPage/DeliveryNotePage.razor.rz.scp.css */
.page-container[b-61ec1a01pq] {
    padding: 1rem;
    margin: 0 auto;
    display: flex;
    flex-direction: row; /* 預設為左右排 */
    gap: 1em;
}

.summary-content[b-61ec1a01pq] {
    width: 360px; /* 左邊區域寬度 */
}

.daily-content[b-61ec1a01pq] {
    width: 200px; /* 左邊區域寬度 */
}


.note-content[b-61ec1a01pq] {
    flex-grow: 1; /* 右邊區域佔用剩餘空間 */
    background-color: #ffffff; /* 背景顏色 */
}

/* 手機尺寸樣式 */
@media (max-width: 768px) {
    .page-container[b-61ec1a01pq] {
        flex-direction: column; /* 手機上上下排 */
    }

    .summary-content[b-61ec1a01pq], .detail-content[b-61ec1a01pq] {
        width: 100%; /* 手機上兩個區域都佔滿寬度 */
    }
}


/* 整體摘要項目樣式 */
.summary-item[b-61ec1a01pq] {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin: 10px 0;
    padding: 15px;
    background-color: #f9f9f9;
    transition: background-color 0.3s;
}

    .summary-item:hover[b-61ec1a01pq] {
        background-color: #f1f1f1;
    }

/* 摘要標題樣式 */
.summary-header[b-61ec1a01pq] {
    cursor: pointer;
}

    .summary-header h4[b-61ec1a01pq] {
        display: flex;
        justify-content: space-between;
        align-content: center;
        margin: 0;
        font-size: 1em;
        color: #000;
    }

/* 切換圖示樣式 */
.toggle-icon[b-61ec1a01pq] {
    font-weight: bold;
    font-size: 1.2em;
}

/* 收入數據樣式 */
.summary-header div[b-61ec1a01pq] {
    margin-top: 5px;
    color: #000;
}

    .summary-header div span[b-61ec1a01pq] {
        font-weight: bold;
        color: #007bff; /* 自定義顏色 */
    }

.school-card[b-61ec1a01pq] {
    padding: 0em;
    margin-bottom: .5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
}

/* 學校列表樣式 */
.school-list[b-61ec1a01pq] {
    margin-top: 10px;
    padding-left: 20px;
    border-left: 2px solid #007bff; /* 自定義邊框顏色 */
}

    .school-list h5[b-61ec1a01pq] {
        margin: 5px 0;
        font-size: 1.1em;
        color: #444;
    }

    .school-list div[b-61ec1a01pq] {
        margin-top: 5px;
        color: #666;
    }

        .school-list div span[b-61ec1a01pq] {
            font-weight: bold;
            color: #28a745; /* 自定義顏色 */
        }

.date-card[b-61ec1a01pq] {
    padding: 4px 1em;
    border: 1px solid #ddd;
    margin-bottom: 4px;
    border-radius: 8px;
    text-align: center;
    cursor: pointer;
}

.date-card.selected[b-61ec1a01pq] {
    background-color: #007bff; /* 自定義選中顏色 */
    color: white;
}

    .date-card.selected:hover[b-61ec1a01pq] {
        background-color: #007bff; /* 自定義選中顏色 */
        color: white;
    }

.date-card:hover[b-61ec1a01pq] {
    background-color: #fafafa;
}

.daily-header[b-61ec1a01pq] {
    color: #28a745;
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 8px;
}

.note-header[b-61ec1a01pq] {
    text-align: center;
    margin-bottom: 20px;
}

.header-title[b-61ec1a01pq] {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 6px;
    color: #000;
}

.header-row[b-61ec1a01pq] {
    font-size: 20px;
    color: #000;
}

.note-body[b-61ec1a01pq] {
    border-top: 1px solid #666;
    padding-top: 10px;
}

.note-body-header[b-61ec1a01pq] {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    border-bottom: 1px solid #666;
    padding: 6px 0;
}

    .note-body-header span[b-61ec1a01pq] {
        flex: 0 0 auto; /* 使每個 span 的大小固定 */
    }

        .note-body-header span:nth-child(1)[b-61ec1a01pq] {
            padding-left: 1em;
            flex-basis: 40%; /* 品名 40% */
        }

        .note-body-header span:nth-child(2)[b-61ec1a01pq] {
            flex-basis: 20%; /* 數量 20% */
        }

        .note-body-header span:nth-child(3)[b-61ec1a01pq] {
            flex-basis: 20%; /* 單價 20% */
        }

        .note-body-header span:nth-child(4)[b-61ec1a01pq] {
            flex-basis: 20%; /* 金額 20% */
        }

.body-item[b-61ec1a01pq] {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #999;
}

    .body-item span:nth-child(1)[b-61ec1a01pq] {
        padding-left: 1em;
        flex-basis: 40%; /* 品名 40% */
    }

    .body-item span:nth-child(2)[b-61ec1a01pq] {
        flex-basis: 20%; /* 數量 20% */
    }

    .body-item span:nth-child(3)[b-61ec1a01pq] {
        flex-basis: 20%; /* 單價 20% */
    }

    .body-item span:nth-child(4)[b-61ec1a01pq] {
        flex-basis: 20%; /* 金額 20% */
    }


.note-body-footer[b-61ec1a01pq] {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    padding: 10px 0;
    margin-top: 10px;
    font-size: 1.2em;
}
/* /Pages/ContentPage/IngredientPage.razor.rz.scp.css */
span[b-ngtjufv2qb] {
    cursor: default;
}


.pagecontainer[b-ngtjufv2qb] {
    padding: 1em;
    display: grid;
    grid-template-columns: 350px auto;
    gap: 16px;
}

.functionsection[b-ngtjufv2qb] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}



.inputarea[b-ngtjufv2qb] {
    display: flex;
    flex-direction: column;
    /*gap: 10px;*/
    width: 100%;
    max-width: 500px;
}


.pointer[b-ngtjufv2qb] {
    cursor: pointer;
}

.controlarea[b-ngtjufv2qb] {
    border-radius: 8px;
    border: .5px solid #ddd;
}

.controlheader[b-ngtjufv2qb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px;
    background-color: #f1f1f1;
    font-weight: bold;
    font-size: 16px;
    color: #333;
    border-radius: 8px;
}


.controlcontent[b-ngtjufv2qb] {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .5s ease-out, all .8s ease-out;

}

    .controlcontent.display[b-ngtjufv2qb] {
        max-height: 600px;
        opacity: 1;
        padding: 1em;
    }



.datasection[b-ngtjufv2qb] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.accordionarea[b-ngtjufv2qb] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.accordionitem[b-ngtjufv2qb] {
    border: .5px solid #ddd;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 5px;
}

.accordionheader[b-ngtjufv2qb] {
    font-weight: bold;
    font-size: 16px;
    cursor: pointer;
    padding: 8px;
    border-radius: 5px;
    display: flex;
    gap: 16px;
}


.accordionitemcontent[b-ngtjufv2qb] {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .5s ease-out, opacity .8s ease-out;
}

.contentdisplay[b-ngtjufv2qb] {
    display: block;
    max-height: 3000px; /* Adjust depending on your content size */
    opacity: 1;
    padding: 0 0px 0px 0px;
}

.contentitemheader[b-ngtjufv2qb] {
    color: #333;
    display: grid;
    grid-template-columns: 60% 18% 18%;
    border-bottom: 1px solid #eee;
    text-align: left;
    width: 100%;
    font-size: 16px;
    margin-bottom: 5px;
    background-color: #f1f1f1;
    padding: 4px 0;
}

    .contentitemheader .item[b-ngtjufv2qb] {
        cursor: default;
    }

        .contentitemheader .item:hover[b-ngtjufv2qb] {
            text-decoration: none;
        }

    .contentitem[b-ngtjufv2qb] {
        color: #333;
        display: grid;
        grid-template-columns: 60% 18% 18%;
        border-bottom: 1px solid #eee;
        text-align: left;
        width: 100%;
        font-size: 16px;
        margin-bottom: 5px;
    }

    .contentitem .item[b-ngtjufv2qb] {
        cursor: pointer;
    }

        .contentitem .item:hover[b-ngtjufv2qb] {
            text-decoration: underline;
        }

.accordionarea .accordionitem:last-child[b-ngtjufv2qb] {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .pagecontainer[b-ngtjufv2qb] {
        grid-template-columns: 1fr;
    }

    .accordionheader[b-ngtjufv2qb] {
        justify-content: space-between;
        gap: 0;
    }

    .contentitemheader[b-ngtjufv2qb] {
        display: grid;
        grid-template-columns: 60% 20% 20%;
    }
}


.inputgroup[b-ngtjufv2qb] {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    width: 100%;
}

    .inputgroup input[b-ngtjufv2qb] {
        flex: 1;
        padding: 8px 12px;
        border: none;
        outline: none;
        font-size: 16px;
        min-width: 0;
    }

    .inputgroup div[b-ngtjufv2qb] {
        white-space: nowrap;
        background-color: #007bff;
        color: white;
        padding: 8px 15px;
        cursor: pointer;
        transition: background 0.3s;
        font-size: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .inputgroup div:hover[b-ngtjufv2qb] {
            background-color: #0056b3;
        }
/* /Pages/ContentPage/IngredientSummaryPage.razor.rz.scp.css */
/* ingredient-summary.razor.css */

.page-container[b-tk5ngt5yi4] {
    padding: 1rem;
    margin: 0 auto;
    display: flex;
    flex-direction: row; /* 預設為左右排 */
    gap: 1em;
}


.title[b-tk5ngt5yi4] {
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 1.5rem;
    text-align: center;
}

/* Section 1: Customer Info */
.customer-section[b-tk5ngt5yi4] {
    margin-bottom: 2rem;
    padding: 1rem;
    border: 1px solid #ddd;
    border-radius: 0.25rem;
    font-weight: bold;
}


/* Section 2: Summary Table */
.summary-section[b-tk5ngt5yi4] {
    margin-bottom: 2rem;
}

.section-title[b-tk5ngt5yi4] {
    font-size: 1rem;
}

.summary-table[b-tk5ngt5yi4] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.8em;
}

    .summary-table th[b-tk5ngt5yi4],
    .summary-table td[b-tk5ngt5yi4] {
        padding: 3px 8px;
        text-align: right;
        border: 1px solid #ddd;
    }

        .summary-table th:first-child[b-tk5ngt5yi4],
        .summary-table td:first-child[b-tk5ngt5yi4] {
            text-align: left;
        }

    .summary-table thead th[b-tk5ngt5yi4] {
        background-color: #f5f5f5;
    }

.total-row[b-tk5ngt5yi4] {
    font-weight: bold;
    background-color: #f5f5f5;
}

.tax-summary[b-tk5ngt5yi4] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-top: 1rem;
}

.tax-item[b-tk5ngt5yi4] {
    display: flex;
    margin-bottom: 0.5rem;
    color:gray;
}

.tax-label[b-tk5ngt5yi4] {
    font-weight: bold;
    width: 8rem;
    text-align: right;
    margin-right: 1rem;
}

.tax-value[b-tk5ngt5yi4] {
    width: 8rem;
    text-align: right;
}

.tax-item.total[b-tk5ngt5yi4] {
    font-weight: bold;
    border-bottom: 1px solid #ddd;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    color: black;
}

/* Section 3: Detail Tables */
.detail-section[b-tk5ngt5yi4] {
    margin-bottom: 2rem;
}

.day-group[b-tk5ngt5yi4] {
    margin-bottom: 2rem;
}

.day-header[b-tk5ngt5yi4] {
    display: flex;
    justify-content: space-between;
    padding: 3px 8px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-bottom: none;
    font-weight: bold;
}

.detail-table[b-tk5ngt5yi4] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
    font-size: 0.8em;
}

    .detail-table th[b-tk5ngt5yi4],
    .detail-table td[b-tk5ngt5yi4] {
        padding: 3px 8px;
        border: 1px solid #ddd;
        text-align: right;
    }

        .detail-table th:first-child[b-tk5ngt5yi4],
        .detail-table td:first-child[b-tk5ngt5yi4] {
            text-align: left;
        }

        .detail-table th:nth-child(2)[b-tk5ngt5yi4],
        .detail-table td:nth-child(2)[b-tk5ngt5yi4],
        .detail-table th:nth-child(3)[b-tk5ngt5yi4],
        .detail-table td:nth-child(3)[b-tk5ngt5yi4] {
            text-align: center;
        }

        /* 設定每一欄的寬度 */
        .detail-table th:nth-child(2)[b-tk5ngt5yi4],
        .detail-table td:nth-child(2)[b-tk5ngt5yi4],
        .detail-table th:nth-child(3)[b-tk5ngt5yi4],
        .detail-table td:nth-child(3)[b-tk5ngt5yi4],
        .detail-table th:nth-child(4)[b-tk5ngt5yi4],
        .detail-table td:nth-child(4)[b-tk5ngt5yi4],
        .detail-table th:nth-child(5)[b-tk5ngt5yi4],
        .detail-table td:nth-child(5)[b-tk5ngt5yi4] {
            width: 15%; /* 設定數量、單位、單價、總價各佔 15% */
        }

        .detail-table th:first-child[b-tk5ngt5yi4],
        .detail-table td:first-child[b-tk5ngt5yi4] {
            width: 40%; /* 品項佔用剩餘的空間 */
        }

    .detail-table thead th[b-tk5ngt5yi4] {
        background-color: #f5f5f5;
    }




.summary-content[b-tk5ngt5yi4] {
    width: 360px; /* 左邊區域寬度 */
}

.detail-content[b-tk5ngt5yi4] {
    flex-grow: 1; /* 右邊區域佔用剩餘空間 */
    background-color: #ffffff; /* 背景顏色 */
    /*padding: 15px;*/
/*    box-shadow: -2px 2px 5px rgba(0, 0, 0, 0.1);*/
}

/* 手機尺寸樣式 */
@media (max-width: 768px) {
    .page-container[b-tk5ngt5yi4] {
        flex-direction: column; /* 手機上上下排 */
    }

    .summary-content[b-tk5ngt5yi4], .detail-content[b-tk5ngt5yi4] {
        width: 100%; /* 手機上兩個區域都佔滿寬度 */
    }
}


/* 整體摘要項目樣式 */
.summary-item[b-tk5ngt5yi4] {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin: 10px 0;
    padding: 15px;
    background-color: #f9f9f9;
    transition: background-color 0.3s;
}

    .summary-item:hover[b-tk5ngt5yi4] {
        background-color: #f1f1f1;
    }

/* 摘要標題樣式 */
.summary-header[b-tk5ngt5yi4] {
    cursor: pointer;
}

    .summary-header h4[b-tk5ngt5yi4] {
        display: flex;
        justify-content: space-between;
        align-content:center;
        margin: 0;
        font-size: 1em;
        color: #333;
    }

/* 切換圖示樣式 */
.toggle-icon[b-tk5ngt5yi4] {
    font-weight: bold;
    font-size: 1.2em;
}

/* 收入數據樣式 */
.summary-header div[b-tk5ngt5yi4] {
    margin-top: 5px;
    color: #555;
}

    .summary-header div span[b-tk5ngt5yi4] {
        font-weight: bold;
        color: #007bff; /* 自定義顏色 */
    }

.school-card[b-tk5ngt5yi4] {
    padding: 0em;
    margin-bottom: .5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
}

/* 學校列表樣式 */
.school-list[b-tk5ngt5yi4] {
    margin-top: 10px;
    padding-left: 10px;
    border-left: 2px solid #007bff; /* 自定義邊框顏色 */
}

    .school-list h5[b-tk5ngt5yi4] {
        margin: 5px 0;
        font-size: 1em;
        color: #444;
    }

    .school-list div[b-tk5ngt5yi4] {
        margin-top: 5px;
        color: #666;
    }

        .school-list div span[b-tk5ngt5yi4] {
            font-weight: bold;
            color: #28a745; /* 自定義顏色 */
            font-size: 15px;
        }

/* /Pages/ContentPage/MenuPage.razor.rz.scp.css */
/* /Pages/ContentPage/ServerStatusPage.razor.rz.scp.css */
.page-container[b-wbfvrsdim3] {
    max-width: 800px;
    margin: 20px auto;
    padding: 12px;
    background-color: #fdfdfd;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    font-family: "Segoe UI", sans-serif;
    font-size: 15px;
    color: #333;
}

/* 依然左右排列 */
.info-section[b-wbfvrsdim3] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 24px;
    background-color: #fff;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.current-content[b-wbfvrsdim3],
.history-content[b-wbfvrsdim3] {
    flex: 1;
    min-width: 0;
    padding: 10px;
    border-radius: 8px;
    background-color: #f7faff;
    border: 1px solid #e0e6f0;
}

    .current-content > div:first-child[b-wbfvrsdim3],
    .history-content > div:first-child[b-wbfvrsdim3] {
        font-weight: bold;
        margin-bottom: 8px;
        color: #1e40af;
    }

.text-danger[b-wbfvrsdim3] {
    color: #d93025;
    font-weight: bold;
}

.text-primary[b-wbfvrsdim3] {
    color: #2563eb;
    font-weight: bold;
}

.mx-3[b-wbfvrsdim3] {
    margin-left: 12px;
    margin-right: 12px;
}

/* 按鈕區仍可適應小螢幕 */
.button-section[b-wbfvrsdim3] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-start;
    margin-top: 10px;
}

    .button-section button[b-wbfvrsdim3] {
        padding: 8px 14px;
        font-size: 14px;
        border: none;
        border-radius: 6px;
        cursor: pointer;
        transition: background-color 0.2s ease, transform 0.1s ease;
    }

        .button-section button:hover[b-wbfvrsdim3] {
            transform: translateY(-1px);
        }

.fresh-button[b-wbfvrsdim3] {
    background-color: #10b981;
    color: white;
}

    .fresh-button:hover[b-wbfvrsdim3] {
        background-color: #059669;
    }

.update-button[b-wbfvrsdim3] {
    background-color: #3b82f6;
    color: white;
}

    .update-button:hover[b-wbfvrsdim3] {
        background-color: #2563eb;
    }

.important-button[b-wbfvrsdim3] {
    background-color: #ef4444;
    color: white;
    font-weight: bold;
}

    .important-button:hover[b-wbfvrsdim3] {
        background-color: #dc2626;
    }

/* 強制手機維持左右排，縮減 padding */
@media (max-width: 768px) {
    .page-container[b-wbfvrsdim3] {
        padding: 8px;
    }

    .info-section[b-wbfvrsdim3] {
        flex-direction: row;
        padding: 8px;
        gap: 8px;
    }

    .current-content[b-wbfvrsdim3],
    .history-content[b-wbfvrsdim3] {
        padding: 6px;
        font-size: 14px;
    }

    .button-section[b-wbfvrsdim3] {
        flex-direction: column;
        align-items: stretch;
    }

        .button-section button[b-wbfvrsdim3] {
            width: 100%;
            font-size: 15px;
        }
}
/* /Pages/ContentPage/TestFreshmanPage.razor.rz.scp.css */
/* Basic Form Container */
.form-container[b-m2rnphe0t0] {
    max-width: 800px;
    margin: 20px auto;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Grouped Form Sections */
details[b-m2rnphe0t0] {
    margin-bottom: 15px;
}

/* Group Summary */
summary[b-m2rnphe0t0] {
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
    color: #007bff;
    padding: 10px;
    background-color: #f1f1f1;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

    summary:hover[b-m2rnphe0t0] {
        background-color: #e2e2e2;
    }

/* Form Fields */
.form-group[b-m2rnphe0t0] {
    margin-bottom: 15px;
    margin-top: 15px;
    margin-left: 15px;
}



/* Responsive Styles */
@media (max-width: 768px) {
    .form-container[b-m2rnphe0t0] {
        padding: 15px;
    }

    .form-label[b-m2rnphe0t0] {
        font-size: 0.9em;
    }

    .form-control[b-m2rnphe0t0] {
        font-size: 0.9em;
    }

    summary[b-m2rnphe0t0] {
        font-size: 1em;
    }
}

.required[b-m2rnphe0t0]::before {
    content: "*";
    color: red; /* 想整個 label 變紅，把這行搬到 .required 本身 */
    margin: 0 2px;
    font-weight: 700; /* 可有可無，看風格 */
}

.noselect[b-m2rnphe0t0] {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
/* /Pages/FunctionPages/Login.razor.rz.scp.css */
.pagecontainer[b-5pdxb0xfpw] {
    height: 100vh;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-header[b-5pdxb0xfpw] {
    text-align: center;
    margin-bottom: 40px;
}

.inputarea[b-5pdxb0xfpw] {
    min-width: 20vw;
    max-width: 350px;
}

.separator[b-5pdxb0xfpw] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 20px 0;
}

    .separator[b-5pdxb0xfpw]::before,
    .separator[b-5pdxb0xfpw]::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid #999; /* ���j�u�C�� */
    }

    .separator[b-5pdxb0xfpw]::before {
        margin-right: 10px; /* ��r���������Z */
    }

    .separator[b-5pdxb0xfpw]::after {
        margin-left: 10px; /* ��r�k�������Z */
    }

    .separator span[b-5pdxb0xfpw] {
        padding: 0 10px; /* ��r������Z */
        color: #999; /* ��r�C�� */
    }
/* /Pages/Home.razor.rz.scp.css */