/* ====== Anna theme: khung tra cứu navy/gold giống anna-care cũ ====== */
:root{ --anna-blue:#06648e; --anna-gold:#FFBE00; }

.anna-warranty{ padding:56px 0 40px; }
.anna-warranty .anna-heading{ text-align:center; max-width:820px; margin:0 auto 10px; padding:0 15px; }
.anna-warranty .anna-heading h2{ color:var(--anna-blue); font-weight:700; text-transform:uppercase; margin:0; font-size:34px; line-height:1.2; }
.anna-warranty .anna-heading .desc{ font-weight:400; margin-top:10px; color:#33475b; font-size:16px; }

.anna-warranty .anna-warranty-form{ margin:0; }
.anna-warranty .warranty-inner{
    max-width:820px;
    margin:34px auto 0;
    background:url('../images/warranty-bg.jpg') center center / 100% 100% no-repeat;
    background-color:#15246b; /* dự phòng nếu ảnh chưa tải */
    display:flex; flex-direction:column; align-items:center;
    padding:135px 24px 36px;
    border-radius:36px;
    box-sizing:border-box;
}
.anna-warranty .warranty-inner > h2{
    color:var(--anna-gold); font-weight:800; text-transform:uppercase;
    margin:0 0 22px; font-size:30px; letter-spacing:1px; text-shadow:0 1px 4px rgba(0,0,0,.35);
}
.anna-warranty .warranty-field{ display:block; width:100%; max-width:560px; margin:0 auto; }
.anna-warranty .warranty-field input[name="mathe"]{
    width:100%; box-sizing:border-box; border:1px solid rgba(0,0,0,.08);
    margin:0; padding:0 28px; height:56px; line-height:normal; border-radius:50px;
    font-size:17px; outline:none; box-shadow:0 6px 18px rgba(0,0,0,.12);
}
.anna-warranty .warranty-agree{
    display:block; color:#eaf2ff; margin:14px auto 0; max-width:560px;
    font-size:13.5px; line-height:1.5; text-align:left;
}
.anna-warranty .warranty-agree input{ margin-right:8px; vertical-align:middle; }
.anna-warranty .warranty-inner button[type="submit"]{
    color:#3a2b00; background:var(--anna-gold); border:none; cursor:pointer;
    height:50px; min-width:190px; padding:0 40px; margin-top:26px;
    font-weight:700; font-size:19px; border-radius:50px;
    box-shadow:0 6px 18px rgba(0,0,0,.22); transition:filter .15s ease, transform .05s ease;
}
.anna-warranty .warranty-inner button[type="submit"]:hover{ filter:brightness(1.06); }
.anna-warranty .warranty-inner button[type="submit"]:active{ transform:translateY(1px); }

@media (max-width:640px){
    .anna-warranty .anna-heading h2{ font-size:26px; }
    .anna-warranty .warranty-inner{ padding:92px 16px 28px; border-radius:24px; }
    .anna-warranty .warranty-inner > h2{ font-size:24px; }
}

/* ===== Sơ đồ răng (FDI) ===== */
.tooth-chart{ display:flex; flex-direction:column; gap:8px; max-width:100%; margin:6px 0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tc-jaw{ display:flex; flex-wrap:nowrap; justify-content:center; gap:1px; }
.tc-tooth{ display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
    width:30px; margin:0; font-size:10px; color:#8a98ac; line-height:1.1; }
.tc-tooth img{ width:22px; height:auto; display:block; opacity:.9; }
.tc-tooth b{ font-weight:600; }
.tc-tooth.on{ color:var(--anna-blue); }
.tc-tooth.on b{ color:#d11; font-weight:800; }
/* tách khoảng giữa cung phải và cung trái (sau răng thứ 8) */
.tc-jaw .tc-tooth:nth-child(8){ margin-right:14px; }

/* Bản admin: bấm chọn */
.tooth-pick{ max-width:600px; }
.tooth-pick .tc-tooth{ cursor:pointer; padding:3px 1px; border-radius:6px; border:1px solid transparent; transition:background .12s,border-color .12s; }
.tooth-pick .tc-tooth input{ position:absolute; opacity:0; width:0; height:0; }
.tooth-pick .tc-tooth:hover{ background:#eef4ff; }
.tooth-pick .tc-tooth.on{ background:#fff6dd; border-color:var(--anna-gold); }

/* Ảnh trong chính sách / hợp đồng không tràn ngang trên mobile */
.thongtinbaohanh img, .hopdong img, .noidung img, .policy-card img{ max-width:100%; height:auto; }

/* Mobile + tablet nhỏ: GIỮ bảng 2 cột (nhãn | giá trị) cho gọn,
   chỉ riêng hàng "Vị trí răng" mới xuống dòng full để sơ đồ răng đủ chỗ */
@media (max-width:767px){
    .result-col{ max-width:100%; }
    .thongtin{ padding:4px 12px; }
    .tt{ gap:10px; padding:11px 4px; align-items:center; }
    .tt .ic{ width:30px; height:30px; font-size:14px; border-radius:8px; }
    .tt label{ flex:0 0 104px; width:104px !important; font-size:12.5px; }
    .tt .val{ font-size:14px; word-break:break-word; }
    /* Hàng Vị trí răng: nhãn 1 dòng, sơ đồ răng xuống dòng chiếm full */
    .tt-rang{ flex-wrap:wrap; align-items:center; }
    .tt-rang label{ flex:1 1 auto; width:auto !important; }
    .tt-rang .val{ flex:1 1 100% !important; width:100% !important; }
    .tc-jaw{ justify-content:flex-start; }
}
/* Điện thoại nhỏ: nhãn hẹp hơn + thu nhỏ răng cho vừa khung */
@media (max-width:560px){
    .tt label{ flex:0 0 92px; width:92px !important; }
    .tc-tooth{ width:18px; font-size:8px; }
    .tc-tooth img{ width:14px; }
    .tc-jaw .tc-tooth:nth-child(8){ margin-right:8px; }
}