#d2c-root, #d2c-root * { box-sizing: border-box; }
#d2c-root { font-family: Arial, Helvetica, 'Segoe UI', sans-serif !important; color:#1f2937; background:#f8fafc; min-height:100vh; line-height:1.45; }
#d2c-root button, #d2c-root input, #d2c-root select, #d2c-root textarea, #d2c-root h1, #d2c-root h2, #d2c-root h3, #d2c-root h4, #d2c-root p, #d2c-root span, #d2c-root div, #d2c-root a { font-family:inherit; }
#d2c-root h1, #d2c-root h2, #d2c-root h3, #d2c-root h4 { letter-spacing:normal; text-transform:none; }
.d2c-shell { max-width:1280px; margin:0 auto; padding:0 16px; }
.d2c-header { position:sticky; top:0; z-index:40; background:#fff; border-bottom:1px solid #eef2f7; box-shadow:0 1px 3px rgba(15,23,42,.06); }
.d2c-header-inner { min-height:48px; height:48px; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.d2c-logo { height:38px; max-height:calc(100% - 6px); width:auto; max-width:150px; display:block; object-fit:contain; cursor:pointer; }
.d2c-nav { height:100%; display:flex; align-items:stretch; gap:18px; }
.d2c-tab { position:relative; height:100%; border:0; background:transparent; color:#64748b; padding:0 2px; cursor:pointer; font-weight:700; font-size:13px; border-bottom:3px solid transparent; display:flex; align-items:center; gap:6px; }
.d2c-tab.active { color:#2563eb; border-bottom-color:#2563eb; }
.d2c-badge { position:absolute; right:-12px; top:2px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:#ef4444; color:#fff; font-size:10px; font-weight:800; display:flex; align-items:center; justify-content:center; }
.d2c-main { padding-top:16px; padding-bottom:52px; }
.d2c-panel { background:#fff; border:1px solid #edf1f5; border-radius:18px; box-shadow:0 2px 10px rgba(15,23,42,.04); }
.d2c-loader { min-height:280px; padding:80px 20px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.d2c-spinner { width:46px; height:46px; border:4px solid #dbe5f1; border-bottom-color:#2563eb; border-radius:50%; animation:d2c-spin .8s linear infinite; margin-bottom:14px; }
@keyframes d2c-spin { to { transform:rotate(360deg); } }
.d2c-error { padding:24px; text-align:center; color:#b91c1c; background:#fff1f2; border-color:#fecdd3; }
.d2c-error button { margin-top:14px; border:0; border-radius:10px; padding:10px 18px; background:#dc2626; color:#fff; font-weight:700; cursor:pointer; }
.d2c-hero { position:relative; height:260px; overflow:hidden; border-radius:20px; background:#e5e7eb; margin-bottom:24px; }
.d2c-hero a, .d2c-hero img { position:absolute; inset:0; width:100%; height:100%; }
.d2c-hero img { object-fit:cover; }
.d2c-dots { position:absolute; left:0; right:0; bottom:9px; z-index:2; display:flex; justify-content:center; align-items:center; gap:5px; pointer-events:none; }
#d2c-root .d2c-dot { width:5px !important; min-width:5px !important; height:5px !important; min-height:5px !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:999px; background:rgba(255,255,255,.82); box-shadow:0 1px 3px rgba(15,23,42,.22); cursor:pointer; transition:width .18s, background .18s; line-height:0 !important; pointer-events:auto; }
#d2c-root .d2c-dot.active { width:14px !important; min-width:14px !important; background:#2563eb; }
.d2c-filters { padding:14px 16px; margin-bottom:20px; }
.d2c-search { position:relative; }
.d2c-search i { position:absolute; top:50%; left:15px; transform:translateY(-50%); color:#94a3b8; }
.d2c-search input { width:100%; padding:12px 14px 12px 41px; border:1px solid #dbe2ea; background:#f8fafc; border-radius:12px; outline:none; }
.d2c-search input:focus { border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.12); background:#fff; }
.d2c-filter-row { display:flex; align-items:flex-start; gap:10px; overflow:visible; padding-top:11px; margin-top:11px; border-top:1px solid #f1f5f9; }
.d2c-filter-label { flex:0 0 92px; padding-top:6px; color:#64748b; font-size:10px; line-height:1.25; font-weight:900; text-transform:uppercase; letter-spacing:.035em; }
.d2c-filter-actions { flex:1 1 auto; min-width:0; display:flex; flex-wrap:wrap; align-items:center; gap:7px; white-space:normal; }
.d2c-filter-btn { min-height:30px; border:1px solid #dfe5ec; border-radius:999px; background:#fff; color:#475569; padding:5px 10px; font-size:11.5px; line-height:1.15; cursor:pointer; box-shadow:0 1px 2px rgba(15,23,42,.03); white-space:nowrap; }
.d2c-filter-btn:hover { background:#f8fafc; }
.d2c-filter-btn.active.blue { background:#2563eb; border-color:#2563eb; color:#fff; font-weight:700; }
.d2c-filter-btn.active.amber { background:#f59e0b; border-color:#f59e0b; color:#fff; font-weight:700; }
.d2c-filter-btn.active.green { background:#059669; border-color:#059669; color:#fff; font-weight:700; }
.d2c-brand-all { min-width:62px; height:38px; }
.d2c-brand-filter-btn { width:88px; height:38px; padding:4px 7px; border:1px solid #dfe5ec; border-radius:10px; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; cursor:pointer; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:border-color .18s, box-shadow .18s, background .18s; }
.d2c-brand-filter-btn:hover { border-color:#93c5fd; background:#f8fbff; }
.d2c-brand-filter-btn.active { border:2px solid #2563eb; background:#eff6ff; box-shadow:0 0 0 2px rgba(37,99,235,.10); }
.d2c-brand-filter-btn img { display:block; width:100%; height:100%; object-fit:contain; }
.d2c-brand-filter-fallback { display:none; max-width:100%; color:#334155; font-size:10px; line-height:1.1; font-weight:900; text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d2c-brand-filter-fallback.visible { display:block; }
.d2c-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.d2c-card { position:relative; overflow:hidden; display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid #edf1f5; border-radius:18px; box-shadow:0 2px 10px rgba(15,23,42,.04); transition:transform .2s, box-shadow .2s; }
.d2c-card:hover { transform:translateY(-2px); box-shadow:0 12px 26px rgba(15,23,42,.09); }
.d2c-card-image-wrap { position:relative; aspect-ratio:1/1; background:#f3f4f6; overflow:hidden; border-bottom:1px solid #f1f5f9; }
.d2c-card-image { width:100%; height:100%; display:block; object-fit:contain; padding:8px; background:#f8fafc; transition:transform .35s; }
.d2c-card:hover .d2c-card-image { transform:scale(1.035); }
.d2c-sale { position:absolute; top:9px; left:9px; z-index:2; border-radius:7px; padding:4px 7px; color:#fff; background:#ef4444; font-size:10px; font-weight:800; }
.d2c-highlight { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:16px; text-align:center; color:#fff; background:rgba(15,23,42,.88); opacity:0; visibility:hidden; transition:.25s; font-size:12px; overflow:auto; }
.d2c-card:hover .d2c-highlight { opacity:1; visibility:visible; }
.d2c-card-body { padding:13px; display:flex; flex:1; flex-direction:column; min-width:0; font-family:Arial, Helvetica, 'Segoe UI', sans-serif !important; }
.d2c-brand-line { min-height:18px; display:flex; align-items:center; justify-content:space-between; gap:8px; line-height:1.15; }
.d2c-brand-name { min-width:0; color:#2563eb; font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.025em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.d2c-brand-origin { flex:0 0 auto; color:#059669; font-size:10.5px; font-weight:800; text-align:right; white-space:nowrap; }
.d2c-name { min-height:55px; margin:5px 0 2px; color:#111827; font-family:Arial, Helvetica, 'Segoe UI', sans-serif !important; font-size:13.5px; line-height:1.35; font-weight:800; letter-spacing:normal !important; text-transform:none !important; display:block; overflow:visible; white-space:normal; overflow-wrap:anywhere; word-break:normal; }
.d2c-weight { min-height:18px; color:#059669; font-size:11px; font-weight:800; text-align:right; }
.d2c-option { width:100%; margin-top:8px; padding:8px 32px 8px 10px; border:1px solid #cbd5e1; border-radius:9px; background-color:#f8fafc; color:#1e293b; font-size:12px; font-weight:700; outline:none; cursor:pointer; }
.d2c-option:hover { border-color:#94a3b8; background-color:#fff; }
.d2c-option:focus { border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.1); background-color:#fff; }
.d2c-price-row { margin-top:auto; padding-top:12px; display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.d2c-old { color:#7c8da3; font-size:14px; line-height:1.15; font-weight:700; text-decoration:line-through; text-decoration-thickness:1.5px; }
.d2c-discount { display:inline-block; margin-top:5px; padding:3px 7px; color:#dc2626; background:#fff1f2; border:1px solid #fecdd3; border-radius:6px; font-size:13px; line-height:1; font-weight:900; }
.d2c-price { color:#2563eb; font-size:18px; line-height:1; font-weight:900; text-align:right; white-space:nowrap; }
.d2c-gift { margin-top:11px; padding:8px; border:1px solid #ffe4e6; border-radius:9px; background:#fff1f2; color:#e11d48; font-size:11px; line-height:1.35; }
.d2c-add { width:100%; margin-top:12px; padding:10px 9px; border:0; border-radius:11px; background:#111827; color:#fff; font-size:12px; font-weight:800; cursor:pointer; }
.d2c-add:hover { background:#000; }
.d2c-qty { height:37px; margin-top:12px; display:flex; align-items:center; justify-content:space-between; overflow:hidden; border:1px solid #bfdbfe; border-radius:11px; background:#eff6ff; }
.d2c-qty button { width:38px; height:100%; border:0; background:transparent; color:#2563eb; cursor:pointer; font-weight:900; }
.d2c-qty button:hover { background:#dbeafe; }
.d2c-qty span { color:#1d4ed8; font-size:13px; font-weight:900; }
.d2c-empty { padding:60px 20px; text-align:center; color:#64748b; }
.d2c-cart-title { margin:0 0 18px; color:#111827; font-size:21px; font-weight:900; }
.d2c-cart-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr); gap:24px; }
.d2c-cart-list { display:flex; flex-direction:column; gap:12px; }
.d2c-cart-item { display:flex; align-items:center; gap:14px; padding:13px; }
.d2c-cart-img { width:90px; height:90px; flex:0 0 90px; object-fit:contain; background:#f8fafc; border:1px solid #edf1f5; border-radius:12px; }
.d2c-cart-info { min-width:0; flex:1; }
.d2c-cart-name { margin:0 0 5px; color:#111827; font-size:13px; font-weight:800; }
.d2c-cart-unit { color:#2563eb; font-size:14px; font-weight:900; }
.d2c-cart-bottom { margin-top:10px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.d2c-remove { border:0; background:#f8fafc; color:#94a3b8; width:31px; height:31px; border-radius:8px; cursor:pointer; }
.d2c-remove:hover { color:#ef4444; background:#fff1f2; }
.d2c-summary { position:sticky; top:82px; padding:20px; }
.d2c-summary h3 { margin:0 0 14px; padding-bottom:12px; border-bottom:1px solid #eef2f7; color:#111827; font-size:13px; text-transform:uppercase; letter-spacing:.04em; }
.d2c-summary-line { display:flex; justify-content:space-between; gap:12px; margin:10px 0; color:#64748b; font-size:13px; }
.d2c-summary-line strong { color:#111827; }
.d2c-milestone { margin:14px 0; padding:10px; border:1px solid #a7f3d0; border-radius:11px; background:#ecfdf5; color:#047857; font-size:12px; font-weight:700; }
.d2c-total { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin:16px 0 20px; padding-top:16px; border-top:1px solid #eef2f7; color:#111827; font-weight:800; }
.d2c-total strong { color:#2563eb; font-size:22px; }
.d2c-form-title { margin:0 0 10px; color:#111827; font-size:13px; font-weight:800; text-transform:uppercase; }
.d2c-form { display:grid; gap:9px; }
.d2c-form input, .d2c-form textarea { width:100%; padding:11px 12px; border:1px solid #dfe5ec; border-radius:11px; background:#f8fafc; outline:none; font-size:13px; }
.d2c-form input:focus, .d2c-form textarea:focus { border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.1); background:#fff; }
.d2c-submit { width:100%; margin-top:13px; padding:13px; border:0; border-radius:12px; background:#2563eb; color:#fff; font-weight:900; cursor:pointer; }
.d2c-submit:disabled { background:#94a3b8; cursor:not-allowed; }
.d2c-checkout-error { display:none; margin-top:10px; padding:8px; border-radius:8px; background:#fff1f2; color:#dc2626; font-size:12px; font-weight:700; text-align:center; }
.d2c-success { max-width:680px; margin:20px auto; padding:70px 24px; text-align:center; }
.d2c-success-icon { width:80px; height:80px; margin:0 auto 18px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#ecfdf5; color:#10b981; font-size:36px; }
.d2c-success h2 { margin:0 0 8px; font-size:27px; color:#111827; }
.d2c-success button { margin-top:20px; padding:11px 24px; border:0; border-radius:11px; background:#111827; color:#fff; font-weight:800; cursor:pointer; }
.d2c-chat-button { position:fixed; right:22px; bottom:22px; z-index:55; width:56px; height:56px; border:0; border-radius:50%; background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; box-shadow:0 12px 28px rgba(37,99,235,.35); cursor:pointer; font-size:21px; }
.d2c-chat { position:fixed; right:22px; bottom:88px; z-index:54; width:390px; max-width:calc(100vw - 28px); height:510px; max-height:calc(100vh - 115px); display:none; flex-direction:column; overflow:hidden; border:1px solid #dfe5ec; border-radius:18px; background:#fff; box-shadow:0 24px 60px rgba(15,23,42,.22); }
.d2c-chat.open { display:flex; }
.d2c-chat-head { display:flex; align-items:center; justify-content:space-between; padding:13px 15px; background:#2563eb; color:#fff; }
.d2c-chat-head strong { font-size:14px; }
.d2c-chat-head button { border:0; background:transparent; color:#fff; cursor:pointer; font-size:18px; }
.d2c-chat-messages { flex:1; overflow:auto; padding:13px; background:#f8fafc; }
.d2c-msg { max-width:82%; margin-bottom:9px; padding:9px 12px; border-radius:14px; font-size:13px; white-space:pre-wrap; }
.d2c-msg.model { background:#fff; border:1px solid #e5e7eb; color:#334155; border-top-left-radius:4px; }
.d2c-msg.user { margin-left:auto; background:#2563eb; color:#fff; border-top-right-radius:4px; }
.d2c-chat-input { display:flex; gap:8px; padding:11px; border-top:1px solid #e5e7eb; }
.d2c-chat-input textarea { flex:1; min-height:42px; max-height:90px; resize:none; padding:9px 10px; border:1px solid #dfe5ec; border-radius:11px; outline:none; font-size:13px; }
.d2c-chat-input button { width:42px; border:0; border-radius:11px; background:#2563eb; color:#fff; cursor:pointer; }
.d2c-hidden { display:none !important; }
@media (min-width:768px) { .d2c-shell { padding-left:24px; padding-right:24px; } .d2c-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; } }
@media (min-width:1100px) { .d2c-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:820px) { .d2c-cart-layout { grid-template-columns:1fr; } .d2c-summary { position:static; } .d2c-hero { height:210px; } }
@media (max-width:620px) { .d2c-header-inner { height:44px; min-height:44px; } .d2c-logo { height:34px; max-width:105px; } .d2c-nav { gap:12px; } .d2c-tab { font-size:12px; gap:4px; } .d2c-main { padding-top:10px; } .d2c-filters { padding:11px; } .d2c-filter-row { display:block; } .d2c-filter-label { width:auto; padding:0 0 7px; } .d2c-filter-actions { gap:6px; } .d2c-filter-btn { min-height:28px; padding:4px 8px; font-size:10.5px; } .d2c-brand-all { height:34px; min-width:54px; } .d2c-brand-filter-btn { width:72px; height:34px; padding:3px 5px; } .d2c-shell { padding-left:12px; padding-right:12px; } .d2c-grid { gap:11px; } .d2c-card-body { padding:10px; } .d2c-brand-name { font-size:10px; } .d2c-brand-origin { font-size:9.5px; } .d2c-name { font-size:12px; min-height:49px; } .d2c-old { font-size:12px; } .d2c-discount { font-size:11.5px; } .d2c-price { font-size:16px; } .d2c-hero { height:160px; border-radius:15px; } .d2c-cart-item { align-items:flex-start; } .d2c-cart-img { width:76px; height:76px; flex-basis:76px; } .d2c-chat { right:14px; bottom:82px; } .d2c-chat-button { right:14px; bottom:16px; } }

/* Trang Quà tặng - V4.5 */
.d2c-gift-intro { margin:2px 0 20px; padding:18px 20px; border:1px solid #fed7aa; border-radius:18px; background:linear-gradient(135deg,#fff7ed,#fff); box-shadow:0 2px 10px rgba(234,88,12,.05); text-align:center; }
.d2c-gift-title { margin:0; color:#ea580c !important; font-size:24px; line-height:1.25; font-weight:900 !important; }
.d2c-gift-subtitle { max-width:900px; margin:8px auto 0; color:#64748b; font-size:14px; line-height:1.55; }
.d2c-gifts-grid { margin-bottom:20px; }
.d2c-gift-card { border-color:#ffedd5; }
.d2c-gift-card.selected { border:2px solid #f97316; box-shadow:0 0 0 3px rgba(249,115,22,.12),0 14px 30px rgba(234,88,12,.12); transform:translateY(-2px); }
.d2c-free-price { margin-top:10px; padding:8px 9px; border:1px solid #bbf7d0; border-radius:9px; background:#f0fdf4; color:#047857; font-size:11px; line-height:1.35; }
.d2c-free-price strong { font-size:13px; font-weight:900; }
.d2c-gift-select { width:100%; margin-top:11px; padding:10px 9px; border:1px solid #fb923c; border-radius:11px; background:#fff7ed; color:#c2410c; font-size:12px; font-weight:900; cursor:pointer; transition:.18s; }
.d2c-gift-select:hover { background:#ffedd5; }
.d2c-gift-select.selected { border-color:#f97316; background:#f97316; color:#fff; }
.d2c-gift-footer { max-width:760px; margin:24px auto 0; text-align:center; }
.d2c-gift-continue { width:100%; padding:14px 18px; border:0; border-radius:13px; background:linear-gradient(135deg,#f97316,#ef4444); color:#fff; font-size:14px; font-weight:900; cursor:pointer; box-shadow:0 8px 22px rgba(239,68,68,.20); }
.d2c-gift-continue:hover:not(:disabled) { filter:brightness(.96); transform:translateY(-1px); }
.d2c-gift-continue:disabled { background:#cbd5e1; box-shadow:none; cursor:not-allowed; }
.d2c-gift-select-note { margin-top:8px; color:#dc2626; font-size:11.5px; font-weight:700; }
.d2c-gift-select-note.selected { color:#059669; }
.d2c-cart-gift-item { border-color:#fed7aa; background:linear-gradient(135deg,#fff7ed,#fff); }
.d2c-cart-gift-label { display:inline-flex; align-items:center; gap:5px; margin-top:2px; padding:4px 8px; border-radius:999px; background:#ffedd5; color:#c2410c; font-size:11px; font-weight:900; }
.d2c-cart-gift-qty { color:#64748b; font-size:12px; font-weight:700; }
.d2c-cart-free-total { color:#059669; font-size:16px; font-weight:900; }

@media (max-width:620px) {
  .d2c-header-inner { gap:7px; }
  .d2c-logo { height:31px; max-width:78px; }
  .d2c-nav { gap:7px; flex:1; justify-content:flex-end; }
  .d2c-tab { padding:0 1px; font-size:10.5px; gap:3px; white-space:nowrap; }
  .d2c-tab i { font-size:10px; }
  .d2c-gift-intro { padding:14px 13px; margin-bottom:14px; }
  .d2c-gift-title { font-size:19px; }
  .d2c-gift-subtitle { font-size:12.5px; }
  .d2c-gift-continue { font-size:12.5px; padding:12px 13px; }
}

.d2c-cart-milestone-gift-item { border-color:#a7f3d0; background:linear-gradient(135deg,#ecfdf5,#f7fff9); }
.d2c-cart-milestone-label { display:inline-flex; align-items:center; gap:5px; margin-top:2px; padding:4px 8px; border-radius:999px; background:#d1fae5; color:#047857; font-size:11px; font-weight:900; }
.d2c-cart-milestone-gift-item .d2c-cart-unit { color:#047857; font-weight:800; }