/* =========================================================
   BẾP SINH — forms.css
   ========================================================= */

.field{margin-bottom:18px;}
.field label{display:block; font-size:13px; font-weight:600; color:var(--bs-ink); margin-bottom:8px;}
.field input[type=text],
.field input[type=email],
.field input[type=tel],
.field select,
.field textarea{
  width:100%; padding:13px 15px; border:1px solid var(--bs-gray-200); border-radius:10px;
  font-size:14px; background:#fff; color:var(--bs-ink);
  transition:border-color .2s, box-shadow .2s, transform .2s;
  box-shadow:inset 0 1px 2px rgba(11,58,43,0.04);
}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--bs-gray-400);}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--bs-green-700); box-shadow:0 0 0 4px rgba(20,107,76,0.12); transform:translateY(-1px);}
.field textarea{resize:vertical; min-height:110px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.required{color:#C0392B;}

/* Choice-chip groups (consultation) */
.choice-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:10px;}
.choice-chip{position:relative;}
.choice-chip input{position:absolute; opacity:0;}
.choice-chip label{
  display:flex; align-items:center; justify-content:center; text-align:center;
  padding:14px 10px; border:1.5px solid var(--bs-gray-200); border-radius:4px;
  font-size:13px; font-weight:600; color:var(--bs-ink-soft); cursor:pointer;
  transition:all .18s var(--ease); min-height:52px;
}
.choice-chip input:checked + label{
  border-color:var(--bs-green-700); background:var(--bs-green-100); color:var(--bs-green-700);
}

.form-card{background:#fff; border:1px solid var(--bs-gray-200); border-radius:6px; padding:36px;}
.form-success{
  display:none; text-align:center; padding:40px 20px;
}
.form-success.show{display:block;}
.form-success .ic{
  width:64px; height:64px; border-radius:50%; background:var(--bs-green-100); color:var(--bs-green-700);
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
}
.form-success h3{margin-bottom:10px;}
.form-success p{color:var(--bs-ink-soft);}

/* FAQ search */
.faq-search{
  max-width:640px; margin:0 auto 8px; display:flex; gap:10px;
  background:#fff; border:1.5px solid var(--bs-gray-200); border-radius:30px; padding:6px 6px 6px 20px;
}
.faq-search input{flex:1; border:none; outline:none; font-size:14.5px;}
.faq-search button{
  background:var(--bs-green-700); color:#fff; border:none; border-radius:24px; padding:11px 22px;
  font-weight:700; font-size:13px;
}
.faq-categories{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin:26px 0 40px;}
.faq-categories button{
  padding:9px 18px; border-radius:20px; border:1px solid var(--bs-gray-200); background:#fff;
  font-size:13px; font-weight:600; color:var(--bs-ink-soft);
}
.faq-categories button.active{background:var(--bs-green-900); border-color:var(--bs-green-900); color:#fff;}
.faq-no-result{display:none; text-align:center; padding:40px 20px; color:var(--bs-ink-soft);}
.faq-no-result.show{display:block;}

/* Warranty lookup */
.warranty-lookup{
  background:var(--bs-green-900); border-radius:8px; padding:44px; color:#fff; text-align:center;
}
.warranty-lookup h2{color:#fff; margin-bottom:10px;}
.warranty-lookup p{color:#CDE7DA; margin-bottom:26px;}
.lookup-form{display:flex; gap:10px; max-width:520px; margin:0 auto;}
.lookup-form input{flex:1; padding:14px 16px; border-radius:3px; border:none; font-size:14px;}
.lookup-form button{padding:14px 26px;}
.lookup-result{
  max-width:520px; margin:22px auto 0; background:rgba(255,255,255,.08); border-radius:6px;
  padding:18px; text-align:left; font-size:13.5px; display:none;
}
.lookup-result.show{display:block;}
.lookup-result .row{display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px solid rgba(255,255,255,.12);}

/* Dealer search */
.dealer-search{display:flex; gap:10px; margin-bottom:28px;}
.dealer-search select,.dealer-search input{flex:1; padding:12px 14px; border:1px solid var(--bs-gray-200); border-radius:3px;}
.dealer-list{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
.dealer-card{border:1px solid var(--bs-gray-200); border-radius:4px; padding:22px;}
.dealer-card h4{font-size:15.5px; margin-bottom:8px;}
.dealer-card p{font-size:13px; color:var(--bs-ink-soft); margin-bottom:4px;}
.dealer-card .region-tag{display:inline-block; margin-bottom:10px;}

/* ---- Floating chat widget ---- */
.chat-launcher{
  position:fixed; right:24px; bottom:24px; z-index:500;
  width:58px; height:58px; border-radius:50%; background:var(--bs-green-700); color:#fff;
  display:flex; align-items:center; justify-content:center; border:none;
  box-shadow:0 8px 24px rgba(11,58,43,.35);
  transition:transform .2s;
}
.chat-launcher:hover{transform:scale(1.06);}
.chat-launcher svg{width:26px; height:26px;}

.chat-panel{
  position:fixed; right:24px; bottom:94px; z-index:600;
  width:340px; max-width:88vw; max-height:70vh;
  background:#fff; border-radius:10px; overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  display:flex; flex-direction:column;
  transform:translateY(16px) scale(.97); opacity:0; pointer-events:none;
  transition:all .22s var(--ease);
}
.chat-panel.open{transform:translateY(0) scale(1); opacity:1; pointer-events:auto;}
.chat-head{
  background:var(--bs-green-900); color:#fff; padding:16px 18px;
  display:flex; align-items:center; justify-content:space-between;
}
.chat-head h4{color:#fff; font-size:14.5px;}
.chat-head span{font-size:11.5px; color:#9FDABE;}
.chat-head button{background:none; border:none; color:#fff; font-size:18px;}
.chat-body{padding:16px 18px; overflow-y:auto; flex:1; font-size:13.5px; color:var(--bs-ink-soft); background:var(--bs-off-white);}
.chat-msg{background:#fff; border-radius:8px; padding:10px 14px; margin-bottom:10px; max-width:85%;}
.chat-quick{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px;}
.chat-quick button{
  background:#fff; border:1px solid var(--bs-gray-200); border-radius:16px; padding:7px 13px; font-size:12.5px; color:var(--bs-ink);
}
.chat-quick button:hover{background:var(--bs-green-100); border-color:var(--bs-green-700);}
.chat-input{display:flex; border-top:1px solid var(--bs-gray-200); padding:10px;}
.chat-input input{flex:1; border:none; outline:none; font-size:13.5px; padding:8px;}
.chat-input button{background:var(--bs-green-700); color:#fff; border:none; border-radius:6px; padding:8px 14px; font-weight:700; font-size:12.5px;}