/* Same visual language as the Danh muc / San pham panel.
   This file loads after hosting_redesign.css, commerce.css and account_2fa.css. */
body.hm-body .hm-shell-main > main.hm-unified-page {
  width:100% !important; max-width:none !important; min-width:0;
  padding:12px 13px 15px !important;
  margin:0 0 12px !important;
  border:1px solid var(--hm-line,#e2eaf3);
  border-radius:12px;
  background:#fff;
  box-shadow:var(--hm-shadow,0 3px 15px rgba(31,64,104,.055));
  overflow:hidden;
}
/* Make the top edge level with Danh muc, and prevent inherited 12px blank space. */
body.hm-body .hm-shell-main > main.hm-public-info {
  padding-top:0 !important;
  padding-bottom:26px !important;
  margin-top:0 !important;
}
body.hm-body .hm-shell-main > main.hm-unified-page { padding-top:12px !important; }
.hm-body .hm-unified-head {
  display:flex; align-items:center; gap:12px;
  min-height:63px; min-width:0;
  margin:0 0 13px; padding:0 6px 11px;
  border-bottom:1px solid #eaf0f6;
  background:transparent;
}
.hm-body .hm-unified-head .hm-section-icon {flex:0 0 37px;width:37px;height:37px}
.hm-body .hm-unified-head-copy {flex:1;min-width:0}
.hm-body .hm-unified-head h1 {
  margin:0; color:#0b4d9e; font-size:18px;
  line-height:1.3; font-weight:800; text-transform:none;letter-spacing:0;
}
.hm-body .hm-unified-head p {
  margin:3px 0 0; font-size:11px;line-height:1.5;color:#657c95;
}
.hm-body .hm-unified-head > .button {flex-shrink:0; min-width:0}
/* Inner cards stay readable, but the outer rounded border is now the visual container. */
.hm-body .hm-unified-page .commerce-card {
  box-shadow:none; border-color:#e4edf7;
  background:#fcfdff; margin-bottom:12px;
}
.hm-body .hm-unified-page .commerce-grid {margin-bottom:0}
.hm-body .hm-unified-page .commerce-grid .commerce-card {margin-bottom:12px}
.hm-body .hm-unified-page > .commerce-card:last-child {margin-bottom:0}
/* Account: one continuous panel (no second outer rounded border). */
.hm-body .hm-shell-main .hm-unified-page.account-v2 .account-shell-single .account-forms {
  background:transparent; border:0;box-shadow:none;border-radius:0;overflow:visible;
}
.hm-body .hm-shell-main .hm-unified-page.account-v2 .account-summary-strip {
  border:1px solid #e2ecf6;border-radius:10px;
  margin:0 0 11px;background:#f4f9ff;overflow:hidden;
}
.hm-body .hm-shell-main .hm-unified-page.account-v2 .account-shell-single .account-panel {
  padding:19px 12px;
}
.hm-body .hm-shell-main .hm-unified-page.account-v2 .account-shell-single .account-panel:first-of-type {padding-top:12px}
.hm-body .hm-shell-main .hm-unified-page.account-v2 .account-shell-single .account-panel+.account-panel {
  border-top:1px solid #e7eef6;
}
/* Icon system: always SVG sprite, never character-glyph pseudoelements. */
.hm-body .hm-icon-button,
.hm-body .wallet-copy-button,
.hm-body .wallet-qr-open {
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  vertical-align:middle; text-align:center;
}
.hm-body .hm-icon-button .site-icon,
.hm-body .wallet-copy-button .site-icon,
.hm-body .wallet-qr-open .site-icon,
.hm-body .hm-row-buy .site-icon {
  width:16px;height:16px;flex:none;fill:none;stroke:currentColor;
}
.hm-body .hm-row-buy {gap:7px}
.hm-body .hm-side-buttons .site-icon{width:15px;height:15px}
.hm-body .wallet-copy-button .site-icon {width:14px;height:14px}
.hm-body .wallet-intent-link .site-icon {width:14px;height:14px}
.hm-body .hm-unified-head .button .site-icon {width:16px;height:16px}
.hm-body .wallet-qr-open{gap:6px}
.hm-body .hm-public-info .hm-support-action{gap:7px}
@media (max-width:650px) {
  body.hm-body .hm-shell-main > main.hm-unified-page {padding:9px !important}
  .hm-body .hm-unified-head{gap:9px;align-items:center; flex-wrap:wrap;padding:4px 3px 11px;margin-bottom:10px}
  .hm-body .hm-unified-head > .hm-section-icon{width:34px;height:34px;flex-basis:34px}
  .hm-body .hm-unified-head h1{font-size:16px}
  .hm-body .hm-unified-head p{font-size:10.5px}
  .hm-body .hm-unified-head > .button{margin-left:43px;max-width:calc(100% - 43px)}
  .hm-body .hm-unified-page .commerce-card{padding:13px}
  .hm-body .hm-shell-main .hm-unified-page.account-v2 .account-shell-single .account-panel{padding:16px 7px}
  .hm-body .hm-shell-main .hm-unified-page.account-v2 .account-summary-strip{margin:0 0 6px}
}

/* Three action slots assembled by fbclone_ui_v36.js */
.hm-body .hm-product-row .hm-v36-buttons > :is(a,button),
.hm-body .hm-product-row .hm-v36-buttons > form > :is(a,button){
 display:inline-flex!important;justify-content:center;align-items:center;gap:5px;
}
.hm-body .hm-product-row .hm-v36-buttons .site-icon{
 width:14px;height:14px;flex-shrink:0;
}
.hm-body .quantity-control button .site-icon {width:17px;height:17px}
