/* BeHappy Gift Voucher — form [bh_gift_voucher].
   Màu ghi trực tiếp, không dùng biến CSS. Đổi màu chủ đạo: tìm #963e48 thay hết.
   Nút chính dùng .button.primary / .is-outline của Flatsome; ô nhập lấy style form của Flatsome. */
.bhg-wrap{
padding:10px 0 8px}

.bhg-eyebrow{
margin:0 0 10px;
font-size:12px;
font-weight:700;
letter-spacing:.12em;
text-transform:uppercase;
color:#963e48}

.bhg-title{
margin:0 0 10px;
font-size:30px;
line-height:1.15}

.bhg-lead{
margin:0 0 20px;
font-size:16px;
line-height:1.6;
color:#6f625d}

.bhg-h2{
margin:26px 0 12px;
padding-top:18px;
border-top:1px solid #e6dcd6;
font-size:21px}

.bhg-fld{
margin:0 0 18px}

.bhg-label{
display:block;
margin:0 0 7px;
font-size:13px;
font-weight:700;
color:#2a2220}

.bhg-opt-note{
font-weight:400;
color:#6f625d}

.bhg-fld input,
.bhg-fld select,
.bhg-fld textarea{
width:100%;
margin:0}

.bhg-fld textarea{
resize:vertical}

.bhg-fld .is-bad{
border-color:#b8324a;
background:#fdf3f4}

.bhg-small{
margin:7px 0 0;
font-size:13px;
line-height:1.5;
color:#6f625d}

/* ô số tiền có ký hiệu $ */
.bhg-money{
display:flex;
align-items:center;
border:1px solid #d9cdc7;
border-radius:8px;
background:#ffffff;
overflow:hidden}

.bhg-money span{
padding:0 4px 0 14px;
font-size:18px;
font-weight:600;
color:#6f625d}

.bhg-money input{
height:auto;
border:0;
border-radius:0;
box-shadow:none;
padding-left:2px;
font-size:18px}

.bhg-money input:focus{
outline:none}

.bhg-money:focus-within{
outline:2px solid #963e48;
outline-offset:2px}

/* nút lựa chọn */
.bhg-opts{
display:flex;
flex-wrap:wrap;
gap:8px}

.bhg-opt{
min-width:96px;
min-height:0;
margin:0;
line-height:1.3;
letter-spacing:0;
text-transform:none;
box-shadow:none;
padding:10px 16px;
border:1px solid #d9cdc7;
border-radius:8px;
background:#ffffff;
font-size:14px;
font-weight:600;
color:#2a2220;
cursor:pointer}

.bhg-opt:hover{
border-color:#963e48}

.bhg-opt:focus{
background:#ffffff;
color:#2a2220}

.bhg-opt.on,
.bhg-opt.on:hover,
.bhg-opt.on:focus{
border-color:#963e48;
background:#963e48;
color:#ffffff}

.bhg-panel{
display:grid;
gap:3px;
margin-top:10px;
padding:11px 13px;
border:1px solid #e6dcd6;
border-radius:10px;
background:#f6efeb;
font-size:14px}

.bhg-panel span{
color:#6f625d}

.bhg-note{
margin:16px 0;
padding:11px 13px;
border-left:4px solid #963e48;
border-radius:0 8px 8px 0;
background:#f5e4e5;
font-size:14px;
line-height:1.55}

.bhg-msg{
margin:0 0 12px;
padding:10px 12px;
border-radius:8px;
background:#fbe9e9;
font-size:14px;
color:#8a1f1f}

.bhg-bar{
display:flex;
flex-wrap:wrap;
justify-content:flex-end;
gap:10px;
margin-top:22px;
padding-top:16px;
border-top:1px solid #e6dcd6}

.bhg-bar .button{
margin:0}

/* xem lại, chuyển khoản */
.bhg-review{
display:grid;
grid-template-columns:120px 1fr;
gap:8px 14px;
margin:0;
padding:14px 0;
border-top:1px solid #e6dcd6;
border-bottom:1px solid #e6dcd6;
font-size:14.5px}

.bhg-review dt{
margin:0;
font-size:13px;
font-weight:700;
color:#6f625d}

.bhg-review dd{
margin:0;
overflow-wrap:anywhere}

.bhg-bank{
padding:16px;
border:1px solid #e6dcd6;
border-radius:12px;
background:#ffffff}

.bhg-bank-h{
margin:0 0 10px;
font-weight:700}

.bhg-bank .bhg-review{
border-bottom:0}

.bhg-ref{
font-family:ui-monospace,Menlo,Consolas,monospace;
font-size:16px;
font-weight:700;
letter-spacing:.06em;
color:#963e48}

.bhg-todo{
color:#a39894;
font-style:italic}

/* xem trước voucher */
.bhg-side{
margin-top:22px;
padding:16px;
border:1px solid #e6dcd6;
border-radius:14px;
background:#ffffff}

.bhg-wrap:not([data-step="choose"]) .bhg-side{
display:none}

.bhg-side-h{
margin:0 0 10px;
font-size:12px;
font-weight:700;
letter-spacing:.12em;
text-transform:uppercase;
color:#6f625d}

.bhg-paper{
width:100%;
height:auto;
border-radius:8px}

.bhg-ecard{
display:grid;
gap:4px;
padding:20px;
border-radius:12px;
background:#963e48;
color:#ffffff;
aspect-ratio:2/1}

.bhg-ecard.is-cherry{
background:#b8324a}

.bhg-ecard-k{
font-size:11px;
font-weight:700;
letter-spacing:.14em;
text-transform:uppercase;
opacity:.85}

.bhg-ecard-v{
font-size:40px;
line-height:1.1}

.bhg-ecard-to{
align-self:end;
font-size:14px}

.bhg-ecard-s{
font-size:12px;
opacity:.85}

.bhg-sum{
display:grid;
grid-template-columns:auto 1fr;
gap:6px 12px;
margin:14px 0 0;
font-size:14px}

.bhg-sum dt{
color:#6f625d}

.bhg-sum dd{
margin:0;
font-weight:600;
text-align:right}

/* ô bẫy spam, khách không thấy */
.bhg-hp{
position:absolute;
left:-9999px;
width:1px;
height:1px;
overflow:hidden}

[data-bhg] [hidden]{
display:none!important}

/* ---------- máy tính ---------- */
@media (min-width:850px){
.bhg-wrap{
display:grid;
grid-template-columns:minmax(0,1fr) 360px;
gap:48px;
align-items:start;
padding:20px 0 16px}

.bhg-title{
font-size:42px}

.bhg-lead{
font-size:17px}

.bhg-main{
max-width:600px}

.bhg-wrap .bhg-side,
.bhg-wrap:not([data-step="choose"]) .bhg-side{
display:block;
position:sticky;
top:100px;
margin-top:0}

.bhg-wrap[data-step="waiting"] .bhg-side{
display:none}

.bhg-wrap[data-step="waiting"]{
grid-template-columns:minmax(0,640px)}

.bhg-review{
grid-template-columns:160px 1fr}
}
