/* Trang gift card online cua tiem (/gift, /gift/balance, /gift/card). Mau theo tiem qua customer-theme.css. */
:root{--ivory:var(--k-faf6ef);--cream:var(--k-f3ebdd);--champ:var(--k-e9dcc5);--gold:var(--k-b9894a);--gold-d:var(--k-96703a);--esp:var(--k-241b12);--ink:var(--k-3a2e20);--mute:var(--k-7a6a56);--line:var(--k-e3d6bf);--err:#A8321F;--ok:#3E6B45}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ivory);color:var(--ink);font:400 16px/1.5 'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;min-height:100vh}
a{color:var(--gold-d)}:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
header{background:var(--esp);color:var(--ivory)}
.top{max-width:600px;margin:auto;padding:13px 16px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.top a{color:var(--ivory);text-decoration:none}.brand{font:500 19px 'Fraunces',Georgia,serif}.top small a{color:var(--champ);font-size:14px}
main{max-width:600px;margin:auto;padding:18px 16px 60px}
h1{font:500 28px/1.15 'Fraunces',Georgia,serif;margin:0 0 4px;color:var(--esp)}
h2{font:600 15px 'Jost',sans-serif;color:var(--gold-d);margin:20px 0 8px;letter-spacing:.02em}
.lead{margin:0 0 16px;color:var(--mute);font-size:15px}
[hidden]{display:none!important}
.amts{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:8px}
.amt{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:12px;padding:14px 6px;font:500 20px 'Fraunces',Georgia,serif;cursor:pointer;min-height:56px}
.amt[aria-pressed=true]{background:var(--esp);border-color:var(--esp);color:var(--ivory)}
label.f{display:block;margin:0 0 12px;font-weight:500;font-size:15px}
label.f input,label.f textarea{display:block;width:100%;margin-top:5px;padding:12px;border:1px solid var(--k-cdbd9f);border-radius:8px;background:#fff;font:inherit;color:var(--ink)}
label.f textarea{min-height:72px;resize:vertical}label.f em{font-style:normal;color:var(--mute);font-weight:400}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media(max-width:520px){.row2{grid-template-columns:1fr}}
.seg{display:flex;gap:6px;margin:0 0 12px}.seg button{flex:1;border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px;font:inherit;cursor:pointer;color:var(--ink);min-height:44px}
.seg button[aria-pressed=true]{background:var(--esp);color:var(--ivory);border-color:var(--esp)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;background:var(--gold);color:var(--esp);font:600 16px 'Jost',sans-serif;padding:14px 26px;cursor:pointer;min-height:50px;text-decoration:none}
.btn.wide{width:100%}.btn:disabled{opacity:.55;cursor:default}.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.msg{margin:10px 0;padding:11px 14px;border-radius:8px;background:#fbeae6;color:var(--err);font-size:15px}.msg:empty{display:none}
.okmsg{margin:10px 0;padding:11px 14px;border-radius:8px;background:#e8f1e9;color:var(--ok);font-size:15px}
.note{font-size:13.5px;color:var(--mute);margin:10px 0 0}
.hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.sumbox{background:var(--cream);border-radius:12px;padding:14px 16px;margin:16px 0}.sumbox .r{display:flex;justify-content:space-between;gap:10px}.sumbox b{font:500 20px 'Fraunces',Georgia,serif}
.gcard{border-radius:18px;background:var(--esp);color:var(--ivory);padding:22px;box-shadow:0 10px 30px rgba(36,27,18,.18);position:relative;overflow:hidden}
.gcard:after{content:"";position:absolute;right:-60px;top:-60px;width:180px;height:180px;border-radius:50%;background:var(--gold);opacity:.25}
.gcard .k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.8}.gcard .s{font:500 20px 'Fraunces',Georgia,serif}.gcard .v{font:600 40px/1.1 'Fraunces',Georgia,serif;margin-top:10px}
.gcard .bal{font-size:14px;opacity:.85}
.bc{background:#fff;border-radius:12px;padding:14px 8px 10px;margin:14px 0 0;text-align:center}.bc svg{max-width:100%;height:auto}
.code{font:600 18px 'Courier New',monospace;letter-spacing:.08em;color:var(--esp);margin-top:6px;word-break:break-all}
.quote{border-left:3px solid var(--gold);padding:6px 12px;margin:14px 0;font-style:italic}
.pay{border:1px solid var(--line);background:#fff;border-radius:12px;padding:16px}
.tag{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--champ);color:var(--esp)}
footer{max-width:600px;margin:auto;padding:16px;color:var(--mute);font-size:13px}
