/** * Chính sách trẻ em theo độ tuổi — style dùng chung cho mọi theme. * * Ba chỗ dùng: * .dropdown-children-ages ô chọn tuổi trong dropdown khách của form đặt phòng (trang chi tiết) * .search-children-ages ô chọn tuổi trong form tìm kiếm (form GET, không Vue) * .child-fee-summary bảng phụ phí trẻ em ở kết quả tìm phòng * * Để ở public/module (không phải assets của theme) vì partial render giữa thân trang: * @push('css') sẽ mất do đã in xong. Nạp bằng trong @once. */ /* ── Ô chọn tuổi: dropdown trang chi tiết + form tìm kiếm ─────────────────────── */ .dropdown-children-ages, .search-children-ages { padding: 10px 12px; border-top: 1px solid #eceff3; } .children-ages-title, .search-children-ages .title { font-size: 13px; font-weight: 600; color: #4a5568; margin-bottom: 8px; } .children-ages-list, .search-children-ages .list { display: flex; flex-wrap: wrap; gap: 8px; } .child-age-item { display: flex; align-items: center; gap: 6px; flex: 0 0 calc(50% - 4px); max-width: calc(50% - 4px); } .child-age-item label { margin: 0; font-size: 13px; color: #4a5568; white-space: nowrap; } .child-age-item select { flex: 1 1 auto; min-width: 0; height: 34px; padding: 0 8px; font-size: 13px; border: 1px solid #d9dee5; border-radius: 6px; background: #fff; color: #2d3748; } /* Chưa chọn tuổi: viền cam để khách thấy ngay ô còn thiếu, không phải bấm đặt mới biết */ .child-age-item select.is-empty { border-color: #f0ad4e; background: #fffaf2; } .children-ages-note, .search-children-ages .note { margin-top: 8px; font-size: 12px; line-height: 1.4; color: #8a94a6; } /* ── Bảng phụ phí trẻ em ở kết quả tìm phòng ──────────────────────────────────── */ .child-fee-summary { padding: 12px 14px; border: 1px solid #e6ebf1; border-left: 3px solid #f0ad4e; border-radius: 8px; background: #fffdf9; } .child-fee-title { font-size: 14px; font-weight: 600; color: #2d3748; margin-bottom: 8px; } .child-fee-list { list-style: none; margin: 0 0 8px; padding: 0; } .child-fee-list li { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; font-size: 13px; color: #4a5568; } .child-fee-note { font-size: 12px; margin-bottom: 6px; } .child-fee-total { padding-top: 8px; border-top: 1px dashed #e6ebf1; font-size: 14px; color: #2d3748; } .child-fee-total small { display: block; font-size: 12px; margin-top: 2px; } @media (max-width: 575px) { .child-age-item { flex: 0 0 100%; max-width: 100%; } } /* ── Khối "Chính sách trẻ em" trên trang chi tiết khách sạn ───────────────────── */ .hotel-child-policy { margin-top: 12px; padding: 12px 14px; border: 1px solid #e6ebf1; border-left: 3px solid #4a90d9; border-radius: 8px; background: #f8fbff; } .hotel-child-policy-title { font-size: 15px; font-weight: 600; color: #2d3748; margin-bottom: 6px; } .hotel-child-policy-lines { margin: 0; padding-left: 18px; } .hotel-child-policy-lines li { font-size: 14px; line-height: 1.6; color: #4a5568; }