/* Week 5 - Turn 2 - Mã đề D: Đặt lịch bảo dưỡng xe */
* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", Arial, sans-serif; background: #f3f4f6; color: #1f2937; }
header.trang-header { background: #374151; color: #ffffff; padding: 22px 28px; }
header.trang-header h1 { margin: 0 0 6px; font-size: 1.5rem; }
header.trang-header p { margin: 0; color: #d1d5db; }
nav.dieu-huong-nho { padding: 10px 28px; background: #e5e7eb; }
nav.dieu-huong-nho a { color: #374151; margin-right: 14px; text-decoration: none; font-weight: 600; }
nav.dieu-huong-nho a:hover { text-decoration: underline; }
main { max-width: 980px; margin: 0 auto; padding: 24px 20px 48px; }
div.khung-de-bai, div.nhan-xet-tiep-can {
  background: #ffffff; border: 1px solid #d1d5db; border-radius: 8px; padding: 18px 22px; margin-bottom: 22px;
}
div.khung-de-bai h2, div.nhan-xet-tiep-can h2 { color: #ea580c; margin-top: 0; }
form.form-bao-duong { background: #ffffff; border: 1px solid #d1d5db; border-radius: 10px; padding: 22px; margin-bottom: 22px; }
.khung-gara { display: flex; flex-wrap: wrap; gap: 20px; }
.cot-phuong-tien { flex: 2 1 420px; display: flex; flex-direction: column; gap: 18px; }
.cot-chu-xe { flex: 1 1 280px; display: flex; flex-direction: column; gap: 18px; }
fieldset.nhom-xe, fieldset.nhom-dich-vu-gara, fieldset.nhom-khach-gara {
  border: 1px solid #9ca3af; border-radius: 8px; padding: 16px; margin: 0; background: #f9fafb;
}
legend { font-weight: bold; color: #ea580c; padding: 0 8px; }
.truong-explicit, .truong-implicit { margin-bottom: 14px; display: flex; flex-direction: column; }
.truong-explicit label { margin-bottom: 5px; font-weight: 600; font-size: 0.9rem; }
.truong-explicit input, .truong-explicit textarea {
  padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 6px; font-family: inherit; font-size: 0.95rem;
}
.truong-implicit label.nhan-long {
  font-weight: 600; font-size: 0.9rem; display: flex; flex-direction: column; gap: 6px; cursor: pointer;
}
.truong-implicit label.nhan-long input {
  padding: 8px 10px; border: 1px solid #d1d5db; border-radius: 6px; font-family: inherit; font-size: 0.95rem;
}
input:focus, textarea:focus {
  outline: none; border-color: #ea580c; box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.25); background: #ffffff;
}
small.huong-dan { color: #c2410c; font-size: 0.82rem; margin-top: 4px; font-weight: normal; }
.nhom-radio, .nhom-checkbox { margin-bottom: 12px; display: flex; flex-direction: column; gap: 6px; }
.nhom-radio span, .nhom-checkbox span { font-weight: 600; font-size: 0.9rem; margin-bottom: 4px; }
.nhom-radio label, .nhom-checkbox label { font-weight: normal; font-size: 0.9rem; display: flex; align-items: center; gap: 6px; cursor: pointer; }
.nhom-radio input, .nhom-checkbox input { cursor: pointer; }
.nhom-radio input:focus, .nhom-checkbox input:focus { outline: 2px solid #ea580c; outline-offset: 2px; }
aside.ghi-chu-tiep-nhan {
  background: #fff7ed; border-left: 4px solid #ea580c; padding: 10px 14px; border-radius: 4px;
}
aside.ghi-chu-tiep-nhan p { margin: 0; font-size: 0.86rem; color: #9a3412; }
.nut-gui-gara {
  background: #ea580c; color: #ffffff; border: none; padding: 12px 24px;
  border-radius: 6px; font-size: 1rem; font-weight: 600; cursor: pointer;
}
.nut-gui-gara:hover { background: #c2410c; }
.nut-gui-gara:focus { outline: 3px solid #fb923c; outline-offset: 2px; }
table.bang-kiem-thu { width: 100%; border-collapse: collapse; margin-top: 10px; }
table.bang-kiem-thu th, table.bang-kiem-thu td { border: 1px solid #d1d5db; padding: 8px 10px; text-align: left; font-size: 0.88rem; }
table.bang-kiem-thu th { background: #374151; color: #ffffff; }
table.bang-kiem-thu tr:nth-child(even) td { background: #f9fafb; }
footer.trang-footer { text-align: center; padding: 16px; color: #374151; font-size: 0.85rem; }
