/* 提醒顏色只由後端審核狀態決定；確認無誤後回到一般黑色。 */
.red-text { color: #b52b35; }
.blue-text { color: #155eae; }
.reminder-red { background: #fff0f1 !important; border-color: #dd8389 !important; color: #9f2230; }
.reminder-blue { background: #edf5ff !important; border-color: #80b1e7 !important; color: #154f91; }
.reservation.reminder-red { border-left: 3px solid #c02f3b; }
.reservation.reminder-blue { border-left: 3px solid #246fc4; }
.reservation:not(.reminder-red):not(.reminder-blue), .booking-card:not(.reminder-red):not(.reminder-blue) { color: #202020; }
.reminder-text { margin: 9px 0; font-size: 14px; }
.reviewed-text { color: #272727; }
.review-link { margin-bottom: 12px; }
.review-panel { margin: 20px auto; max-width: 1100px; }
.review-confirm { margin-top: 24px; }
.role-code { font-size: 12px; padding: 2px 6px; background: #d9e8f5; border-radius: 4px; }
nav .account { border-radius: 8px; overflow-wrap: anywhere; }
.legend { flex-wrap: wrap; }
.reservation strong { font-size: 13px; overflow-wrap: anywhere; }
.booking-card { overflow-wrap: anywhere; }
.password-input { position: relative; display: block; width: 100%; }
.password-field { margin-bottom: 20px; }
.password-field > label { margin-bottom: 7px; }
.password-input input { width: 100%; padding-right: 52px; }
.password-toggle { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); width: 44px; height: 40px; min-height: 40px; padding: 9px; border: 0; background: transparent; color: #476882; }
.password-toggle svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.password-toggle .eye-slash { display: none; }
.password-toggle[aria-pressed="true"] .eye-slash { display: block; }
.password-toggle:focus-visible { outline: 3px solid #8ec2ed; outline-offset: 1px; }