@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700&display=swap');

body {
    font-family: 'Noto Sans TC', sans-serif;
    background-color: #f3f4f6;
    color: #1f2937;
    overflow-x: hidden;
    font-size: 0.875rem;
}

input[type="text"], input[type="date"], input[type="number"], input[type="password"], select, textarea {
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    padding: 0.5rem;
    font-size: 0.875rem;
    height: 38px;
    width: 100%;
    background-color: #fff;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    box-sizing: border-box;
}

select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 1rem;
    padding-right: 2rem;
}

input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.2);
}

.checkbox-label {
    display: inline-flex;
    align-items: center;
    font-size: 0.875rem;
    cursor: pointer;
    user-select: none;
    margin-right: 0.5rem;
    margin-bottom: 0.375rem;
}

.checkbox-label input[type="checkbox"], .checkbox-label input[type="radio"] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: #dc2626;
    margin-right: 0.375rem;
    border-radius: 0.25rem;
}

.section-header {
    background-color: #fee2e2;
    color: #991b1b;
    font-weight: 700;
    padding: 0.5rem 0.75rem;
    border-left: 4px solid #dc2626;
    margin-bottom: 0.75rem;
    border-radius: 0 0.375rem 0.375rem 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

h1, h2, h3, .section-header span {
    white-space: nowrap;
}

@media print {
    body { background-color: #ffffff !important; color: #000000 !important; padding: 0 !important; overflow: auto !important; }
    .no-print { display: none !important; }
    .page-container { box-shadow: none !important; padding: 0 !important; margin: 0 !important; max-width: 100% !important; width: 100% !important; }
    .section-header { background-color: #f3f4f6 !important; color: #000000 !important; border-left-color: #000000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    input, select, textarea { border: none !important; border-bottom: 1px solid #000 !important; border-radius: 0 !important; padding: 2px !important; background: transparent !important; color: #000 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; height: auto !important; }
}