/* Bổ sung cho dental.css (sinh từ demo, không sửa tay): ảnh thật thay khối minh hoạ, biểu mẫu của form builder,
   bản đồ Leaflet, thanh xem trước giao diện. Giữ đúng màu/khoảng cách của demo đã duyệt. */
.pvbar{background:repeating-linear-gradient(-45deg,#fff7e8,#fff7e8 10px,#fff2dc 10px,#fff2dc 20px);color:#8a5a12;font-size:11px;font-weight:var(--fw-semi);text-align:center;padding:4px}

/* logo tròn & ảnh bìa thật */
.lg img,.lgo img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.lg:has(img),.lgo:has(img){background:#fff;overflow:hidden}
.lr .img img.cover,.cc .cv img.cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cc a.cv{display:block}
.cc .nm a:hover,.lr .nm a:hover{color:var(--blue)}
.lr .act .mini-i a{display:flex;gap:3px;align-items:center}
.lr .act .mini-i a:hover{color:var(--blue)}
a.mini{color:inherit}
a.mini:hover{background:var(--bg-2)}
.near a.it:hover{background:var(--bg-2)}
.mapv a.mi{color:inherit}
.pcover.has-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pcover.has-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,18,36,.55),rgba(10,18,36,.1))}
.pcover.has-img .txt{z-index:1}
.pid.spon{border-color:#9dbcf0;box-shadow:0 0 0 1px #dfe9fb,var(--sh-1)}
.pid.spon .lg{box-shadow:0 0 0 4px #fff,0 0 0 6px var(--blue),var(--sh-2)}
.gal .slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gal .thumbs button{overflow:hidden;padding:0}
.gal .thumbs button img{width:100%;height:100%;object-fit:cover}
.intro .bb img{max-width:100%;height:auto;border-radius:var(--r-s)}

/* trang chủ: 2 khung (khu vực + labo) */
.split.two{grid-template-columns:2fr 1fr}
.alist.cols{columns:2;column-gap:8px}
.alist.cols li{break-inside:avoid}
@media (max-width:960px){.split.two{grid-template-columns:1fr}.alist.cols{columns:1}}

/* ô chọn trong khung tìm nhanh */
.finder .v select{width:100%;border:0;background:transparent;font:inherit;font-weight:var(--fw-semi);font-size:14px;color:var(--ink);outline:0;padding:0;cursor:pointer;appearance:auto}
.pills a.pill{text-decoration:none}

/* biểu mẫu đặt hẹn (form builder lõi) theo kiểu .inp/.seg của demo */
.cms-form .hp-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cms-form .form-grid{display:grid;gap:8px}
.cms-form .form-label{display:block;font-size:11px;font-weight:var(--fw-semi);color:var(--ink-3);margin:0 0 3px}
.cms-form .form-control{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:var(--r-s);height:36px;padding:0 10px;background:var(--bg-2);font:inherit;font-size:13px;color:var(--ink);outline:0}
.cms-form .form-control:focus{border-color:var(--blue);background:#fff}
.cms-form textarea.form-control{height:64px;padding:8px 10px;resize:vertical}
.cms-form .choice-group{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden}
.cms-form .choice{display:flex;gap:5px;justify-content:center;align-items:center;padding:7px 0;font-size:13px;font-weight:var(--fw-semi);color:var(--ink-2);background:#fff;border-right:1px solid var(--line);cursor:pointer}
.cms-form .choice:last-child{border-right:0}
.cms-form .choice input{position:absolute;opacity:0;pointer-events:none}
.cms-form .choice:has(input:checked){background:var(--blue-s);color:var(--blue-d);box-shadow:inset 0 -2px 0 var(--blue)}
.cms-form .choice:nth-child(1)::before{content:"\25D1";color:#f0a020}
.cms-form .choice:nth-child(2)::before{content:"\2600";color:var(--orange)}
.cms-form .choice:nth-child(3)::before{content:"\263E";color:var(--violet)}
.cms-form .btn-primary{display:flex;width:100%;justify-content:center;align-items:center;gap:6px;height:40px;border:0;border-radius:var(--r);font:inherit;font-weight:var(--fw-semi);font-size:13px;cursor:pointer;color:#fff;background:var(--blue);box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}
.bk .hd:not([style]) ~ .bd .cms-form .btn-primary{background:var(--mint)}
.cms-form .btn-primary svg{width:16px;height:16px}
.cms-form .alert{display:flex;gap:8px;align-items:flex-start;font-size:13px;border-radius:var(--r-s);padding:8px 10px;margin-bottom:8px}
.cms-form .alert svg{flex:none;width:18px;height:18px}
.cms-form .alert-success{background:var(--mint-s);color:var(--mint-d);border:1px solid #bfe6d8}
.cms-form .alert-error{background:#fff1f2;color:#b42318;border:1px solid #f8c9cf}

/* bản đồ Leaflet trong chế độ xem "Bản đồ" */
#leafletMap{position:relative;height:100%;z-index:0}
#leafletMap .attr{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:13px;color:var(--ink-3)}

/* trang lõi (tin tức, liên hệ…) vẫn dùng template theme cha */
.core-main{min-height:40vh}
.f5 .by{color:#8f9ab0}

/* điện thoại: thanh "Bạn là chủ…?" xuống dòng thay vì tràn ngang */
@media (max-width:760px){.claimbar{flex-wrap:wrap}.claimbar>div{flex:1 1 calc(100% - 56px);min-width:0}.claimbar .btn{flex:1 1 auto;justify-content:center}}

/* gợi ý khi gõ: ô rỗng thì ẩn; bản gắn vào <body> dưới ô tìm ở đầu trang */
.ac:empty{display:none!important}
.ac.float{position:absolute;display:block;right:auto}
.ac.float a{color:var(--ink)}

/* trang tĩnh (giới thiệu, chính sách) */
.dental-prose{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;margin-top:14px;font-size:14px;line-height:1.75;color:#26324a}
.dental-prose h2{font-size:16px;margin:20px 0 6px;color:var(--ink)}
.dental-prose .aud{margin:14px 0}
.dental-prose .aud ol{padding:0}
@media (max-width:960px){.aud{grid-template-columns:1fr}}
@media (max-width:760px){.pol{grid-template-columns:1fr}.pol nav{position:static;display:flex;overflow-x:auto;gap:4px}.pol nav a{white-space:nowrap}.pol article,.dental-prose{padding:16px}}

/* Nút có icon: icon không bị co về 0 (tránh chữ đè icon) */
.btn i{flex-shrink:0}
/* Thẻ nha khoa 2 cột trên điện thoại: nút hẹp → bỏ icon, giữ chữ (giống app) */
@media (max-width:760px){.cc .ft .btn{padding:0 6px;min-width:0}.cc .ft .btn i{display:none}}


/* ===== biểu mẫu đặt hẹn: hai ô một hàng; popup đặt hẹn theo dịch vụ + khung voucher + thông báo đã đặt ===== */
.cms-form-dat-hen .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px}
.cms-form-dat-hen .form-grid>.full{grid-column:1/-1}
.cms-form-dat-hen .form-grid>div[hidden]{display:none}
.bkhead{display:grid;gap:1px;padding:10px 12px;margin-bottom:10px;border-radius:var(--r-s);background:var(--mint-s,#e6f6f1);border:1px solid #bfe6da}
.bkhead b{font-size:15px;color:var(--ink)}
.bkhead span{font-size:13px;color:var(--ink-2);font-weight:var(--fw-semi)}
.bkhead small{font-size:12px;color:var(--mint);font-weight:var(--fw-semi)}
.vcbox{margin-bottom:10px;padding:10px 12px;border:1px dashed var(--orange);border-radius:var(--r-s);background:var(--orange-s,#fff4e5)}
.vcbox .vch{display:flex;gap:7px;align-items:center;font-size:13px;color:var(--ink);margin-bottom:6px}
.vcbox .vch i{color:var(--orange)}
.vcbox .vcn{margin:0;font-size:13px;color:var(--ink-2)}
.vcl{display:grid;gap:6px}
.vc1{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:7px 9px}
.vc1 b{display:block;font-size:13px;line-height:1.3}
.vc1 small{display:block;color:var(--ink-3);font-size:11px}
.vc1 .am{font-weight:var(--fw-semi);color:var(--orange);font-size:14px;white-space:nowrap}
.vcres{margin:6px 0 0;font-size:13px;line-height:1.45}
.vcres:empty{display:none}
.vcres.ok,.vcres.bad,.vcres.warn{padding:8px 10px;border-radius:var(--r-s);border:1px solid}
.vcres.ok{background:#e9f8f1;border-color:#bfe6da;color:#0b6b4f}
.vcres.bad{background:#fdecee;border-color:#f3c3c8;color:#a1202e}
.vcres.warn{background:#fff4e5;border-color:#f5d6a8;color:#8a5200}
.vcres b{display:block}
.vcres .vcp{font-weight:var(--fw-semi);margin-top:2px}
.vcres .vcs{font-size:11px;opacity:.85;margin-top:2px}
.prow .is-off{opacity:.45;pointer-events:none}
.bkdone{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:12px 14px;border-radius:var(--r);background:#e9f8f1;border:1px solid #bfe6da;color:#0b6b4f}
.bkdone>i{font-size:22px;flex:none;margin-top:1px}
.bkdone div{display:grid;gap:2px;font-size:13px}
.bkdone b{font-size:14px}
.bkdone a{color:var(--blue);font-weight:var(--fw-semi)}
.bkdone button{margin-left:auto;border:0;background:transparent;color:inherit;cursor:pointer;font-size:16px;flex:none}
@media (max-width:640px){.vc1{grid-template-columns:minmax(0,1fr) auto}.vc1 .am{display:none}.prow{grid-template-columns:1fr auto}.prow .pr{grid-column:1/2}.prow .btn{grid-column:2/3;grid-row:1/3}}

.vc1.mut{opacity:.6}
.vc1.mut b::after{content:' · dịch vụ khác';font-weight:var(--fw-semi);color:var(--ink-3);font-size:11px}

/* biểu mẫu hỏi nha sĩ: hàng đôi khi đủ rộng */
.qf2{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;align-items:start}
.qf2>div{min-width:0}
@media (max-width:360px){.qf2{grid-template-columns:1fr}}

.plinks{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;align-items:center}
.plinks .chip{display:inline-flex;gap:6px;align-items:center;padding:7px 11px;border:1px solid var(--line);border-radius:var(--r-s);background:#fff;font-size:13px;font-weight:var(--fw-semi);color:var(--ink-2)}
.plinks .chip i{color:var(--mint)}

/* "Dùng mã" ở hồ sơ nha khoa: thông báo nổi + nhấn khung đặt hẹn + ô SĐT khoá */
.toast-use{position:fixed;left:50%;bottom:78px;transform:translate(-50%,20px);max-width:min(92vw,460px);background:#0f2a43;color:#fff;padding:11px 16px;border-radius:12px;font-size:13px;line-height:1.4;box-shadow:0 10px 30px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:.25s;z-index:2000}
.toast-use.on{opacity:1;transform:translate(-50%,0)}
.bk.flash-on{box-shadow:0 0 0 3px var(--orange,#f59e0b),0 12px 30px rgba(245,158,11,.25);transition:box-shadow .3s}
.form-control.is-locked{background:#f1f5f9;color:#475569;cursor:not-allowed}

.ribbon-app{background:#6d28d9!important;color:#fff!important;left:auto;right:8px}
.apponly{background:linear-gradient(135deg,#f5f3ff,#eef6ff);border:1px solid #ddd6fe;border-radius:14px;padding:14px;display:grid;gap:10px}
.apponly p{margin:0;font-size:13px;color:var(--ink-2)}
.ao-badge{display:inline-flex;gap:6px;align-items:center;font-weight:var(--fw-semi);color:#6d28d9;font-size:13px}

/* Đặt hẹn: ô Buổi (3 nút) chiếm cả hàng cho khỏi bị cắt chữ; ô Giờ tự lấp chỗ trống cạnh Ngày */
.cms-form-dat-hen .form-grid{grid-auto-flow:row dense}
.cms-form-dat-hen .form-grid>div:has(input[name="buoi"]){grid-column:1/-1}

/* Flash Sale trên hồ sơ: nút Dùng mã cao bằng khung đếm ngược, trải hết chiều ngang còn lại */
.fl-act{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
.fl-act .cd{width:200px;justify-content:flex-start;flex:none}
.fl-act .fl-use{flex:1 1 180px;height:auto;min-height:50px;font-size:14px;justify-content:center}
@media (max-width:520px){.fl-act .cd{width:100%;justify-content:center}.fl-act .fl-use{flex-basis:100%}}