/* ==========================================================================
   Nhà thuốc Hay - giao diện mới theo thiết kế "Prototype Nhà thuốc Hay"
   Nạp SAU main.min.css / mypha.css để ghi đè giao diện cũ.
   ========================================================================== */
:root {
  --hay-ground: #F5F8F8;
  --hay-ink: #16282B;
  --hay-muted: #4E6366;
  --hay-teal: #18454B;
  --hay-teal-dark: #0F2F33;
  --hay-teal-mid: #41767D;
  --hay-teal-soft: #EAF3F4;
  --hay-teal-pale: #C8E0E3;
  --hay-orange: #F2A62A;
  --hay-line: #DCE6E7;
  --hay-white: #FFFFFF;
  --hay-font-body: 'Be Vietnam Pro', 'Segoe UI', system-ui, sans-serif;
  --hay-font-display: Lexend, 'Be Vietnam Pro', system-ui, sans-serif;
}

html, body { background: var(--hay-ground); }
body { color: var(--hay-ink); font-family: var(--hay-font-body); }
h1, h2, h3, h4, h5, h6 { font-family: var(--hay-font-display); color: var(--hay-ink); }
a { color: var(--hay-teal); }
a:hover { color: var(--hay-teal-dark); }
:focus-visible { outline: 3px solid var(--hay-orange); outline-offset: 2px; }
input[type=checkbox], input[type=radio] { accent-color: var(--hay-teal); }

/* Thiết kế: nội dung rộng 1280px + padding 32px mỗi bên (content-box) => 1344px khi dùng border-box */
.hay-container { max-width: 1344px; margin: 0 auto; padding-left: 32px; padding-right: 32px; box-sizing: border-box; }
/* Các trang cũ dùng .container của Bootstrap: canh cùng độ rộng nội dung 1280px với thiết kế */
@media (min-width: 1400px) { .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { max-width: 1304px; } }
.hay-section { padding-top: 56px; }
.hay-section--first { padding-top: 28px; }
.hay-section--tight { padding-top: 24px; }
.hay-section--last { padding-bottom: 64px; }
.hay-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.hay-h2 { margin: 0; font-family: var(--hay-font-display); font-size: 28px; font-weight: 600; color: var(--hay-teal); line-height: 1.25; }
.hay-link-more { font-size: 15px; font-weight: 600; text-decoration: none; color: var(--hay-teal); }
.hay-link-more:hover { text-decoration: underline; }
.hay-muted { color: var(--hay-muted); }
.hay-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Buttons ---------- */
.hay-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 52px; padding: 0 28px; border-radius: 999px; font-family: var(--hay-font-body); font-weight: 600; font-size: 16px; text-decoration: none; border: 0; cursor: pointer; box-sizing: border-box; transition: background .15s, color .15s, border-color .15s; }
.hay-btn svg { flex: none; }
.hay-btn--primary { background: var(--hay-teal); color: #fff; }
.hay-btn--primary:hover { background: var(--hay-teal-dark); color: #fff; }
.hay-btn--accent { background: var(--hay-orange); color: var(--hay-ink); font-weight: 700; }
.hay-btn--accent:hover { background: #E09312; color: var(--hay-ink); }
.hay-btn--ghost-light { border: 1.5px solid rgba(255,255,255,.6); color: #fff; padding: 0 24px; }
.hay-btn--ghost-light:hover { background: rgba(255,255,255,.1); color: #fff; }
.hay-btn--outline { border: 1.5px solid var(--hay-teal); color: var(--hay-teal); background: #fff; }
.hay-btn--outline:hover { background: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-btn--sm { height: 42px; padding: 0 18px; font-size: 14px; }

/* ==========================================================================
   HEADER
   ========================================================================== */
/* Header bám dính: thanh topbar (36px) cuộn đi, phần logo/tìm kiếm + danh mục giữ lại */
.hay-header { width: 100%; background: #fff; border-bottom: 1px solid var(--hay-line); font-family: var(--hay-font-body); color: var(--hay-ink); position: sticky; top: -36px; z-index: 1000; transition: box-shadow .2s; }
.hay-header.is-stuck { box-shadow: 0 6px 20px rgba(16,40,44,.10); }
.hay-header.is-stuck .hay-header__main { padding-top: 10px; padding-bottom: 10px; }
.hay-header__main { transition: padding .2s; }
.hay-header a { text-decoration: none; }
.hay-topbar { background: var(--hay-teal); color: #E3EFF0; font-size: 13px; }
.hay-topbar__inner { height: 36px; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-topbar__note { display: flex; align-items: center; gap: 8px; }
.hay-topbar__nav { display: flex; align-items: center; gap: 24px; }
.hay-topbar__nav a { display: flex; align-items: center; gap: 6px; color: #E3EFF0; }
.hay-topbar__nav a:hover { color: #fff; }
.hay-topbar__hotline { display: flex; align-items: center; gap: 6px; font-weight: 600; color: #fff !important; }

.hay-header__main { padding-top: 18px; padding-bottom: 18px; display: flex; align-items: center; gap: 32px; }
.hay-header__logo { display: block; flex: none; }
.hay-header__logo img { display: block; height: 46px; width: auto; }

.hay-search-wrap { flex: 1 1 420px; position: relative; min-width: 320px; }
.hay-search { display: flex; align-items: center; height: 50px; border: 1.5px solid var(--hay-teal); border-radius: 999px; background: #fff; padding: 4px 4px 4px 20px; box-sizing: border-box; gap: 8px; margin: 0; }
.hay-search .input_search { flex: 1; min-width: 0; border: 0; outline: none; font: inherit; font-size: 15px; color: var(--hay-ink); background: transparent; height: 100%; padding: 0; }
.hay-search .input_search::placeholder { color: #7A8C8E; }
.hay-search .clear-search-container { display: none; align-items: center; }
.hay-search .clear-search { cursor: pointer; color: var(--hay-muted); padding: 0 6px; }
.hay-search .clear-search-container .divider { display: none; }
.hay-search__type { flex: none; border: 0; background: var(--hay-teal-soft); color: var(--hay-teal); font: inherit; font-size: 13px; font-weight: 600; height: 32px; border-radius: 999px; padding: 0 10px; cursor: pointer; }
/* main.js biến mọi <select> thành .nice-select */
.hay-search .nice-select { flex: none; float: none; height: 32px; line-height: 30px; border: 0; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); font-size: 13px; font-weight: 600; padding-left: 12px; padding-right: 28px; }
.hay-search .nice-select:after { border-color: var(--hay-teal); }
.hay-search .nice-select .list { border-radius: 12px; border: 1px solid var(--hay-line); box-shadow: 0 12px 30px rgba(16,40,44,.16); z-index: 140; height: auto !important; max-height: none !important; overflow: visible !important; min-width: 140px; padding: 6px 0; }
.hay-search .nice-select .option { color: var(--hay-ink); font-weight: 500; }
.hay-search .icon-search { display: flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 20px; border-radius: 999px; background: var(--hay-teal); color: #fff; font-weight: 600; font-size: 15px; border: 0; cursor: pointer; flex: none; }
.hay-search .icon-search:hover { background: var(--hay-teal-dark); }
/* Ẩn nút xóa mặc định của input[type=search] (đã có nút xóa riêng) */
.hay-search .input_search::-webkit-search-cancel-button,
.hay-search .input_search::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
.hay-search .input_search::-ms-clear { display: none; }
.hay-search .clear-search { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border-radius: 50%; color: var(--hay-muted); }
.hay-search .clear-search:hover { background: var(--hay-teal-soft); color: var(--hay-teal); }

/* Hộp lịch sử tìm kiếm (desktop) hiển thị ngay dưới ô tìm kiếm */
.hay-header .container-search-mobile.un-show { display: none; }
.hay-header .container-search-mobile.history-search-desktop { position: absolute; inset: auto; top: calc(100% + 8px); left: 0; right: 0; width: auto; height: auto; display: block; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; box-shadow: 0 16px 40px rgba(16,40,44,.16); padding: 0; z-index: 120; overflow: hidden; }
.hay-header .container-search-mobile.history-search-desktop .overlay-search { min-height: 0; max-height: min(460px, 70vh); overflow-y: auto; background: #fff; }
.hay-header .container-search-mobile.history-search-desktop .group-input-search,
.hay-header .container-search-mobile.history-search-desktop .filter-search { display: none; }
.hay-header .history-search-desktop .history-search { padding: 8px 0 14px; }
.hay-header .history-search-desktop .history-search .label { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px 6px; margin: 0; }
.hay-header .history-search-desktop .history-search .label div { font-family: var(--hay-font-display); font-size: 13px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: var(--hay-muted); }
.hay-header .history-search-desktop .history-search .label a { font-size: 13px; font-weight: 500; color: var(--hay-teal-mid); cursor: pointer; }
.hay-header .history-search-desktop .history-search .label a:hover { color: var(--hay-teal); text-decoration: underline; }
.hay-header .history-search-desktop .history-searchs { list-style: none; margin: 0; padding: 0 8px; }
.hay-header .history-search-desktop .history-searchs li { display: flex; align-items: center; gap: 4px; padding: 0; border-radius: 10px; }
.hay-header .history-search-desktop .history-searchs li:hover { background: var(--hay-teal-soft); }
.hay-header .history-search-desktop .history-searchs li a { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 9px 12px; color: var(--hay-ink); font-size: 14px; cursor: pointer; }
.hay-header .history-search-desktop .history-searchs li a i { color: #8FA3A5; font-size: 14px; }
.hay-header .history-search-desktop .history-searchs .search-history-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hay-header .history-search-desktop .search-history-remove { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-right: 6px; border-radius: 50%; color: #8FA3A5; cursor: pointer; }
.hay-header .history-search-desktop .search-history-remove:hover { background: #fff; color: #C2410C; }
.hay-header .history-search-desktop .button-seemore { padding: 4px 20px 0; text-align: left !important; }
.hay-header .history-search-desktop .button-seemore a { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: var(--hay-teal-mid); cursor: pointer; }
.hay-header .history-search-desktop #historyRecent + #historyMost { border-top: 1px solid var(--hay-line); margin-top: 10px; padding-top: 4px; }
.hay-header .history-search-desktop #historyRecent[style*="none"] + #historyMost { border-top: 0; margin-top: 0; padding-top: 0; }
.hay-header .history-search-desktop .most-search-list { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 20px 0; }
.hay-header .history-search-desktop .most-search-list a { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); font-size: 13px; font-weight: 500; cursor: pointer; transition: background .15s, color .15s; }
.hay-header .history-search-desktop .most-search-list a:hover { background: var(--hay-teal); color: #fff; }

.hay-header__actions { display: flex; align-items: center; gap: 8px; flex: none; }
.hay-action { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 12px; color: var(--hay-ink); min-height: 44px; position: relative; }
.hay-action:hover { background: var(--hay-teal-soft); color: var(--hay-ink); }
.hay-action__text { font-size: 13px; line-height: 1.3; }
.hay-action__text b { font-size: 14px; display: block; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hay-action__avatar { width: 28px; height: 28px; border-radius: 999px; object-fit: cover; }
.hay-account { position: relative; }
.hay-account__menu { display: none; position: absolute; top: 100%; right: 0; min-width: 220px; background: #fff; border: 1px solid var(--hay-line); border-radius: 14px; box-shadow: 0 16px 40px rgba(16,40,44,.16); padding: 8px; margin: 0; list-style: none; z-index: 130; }
.hay-account:hover .hay-account__menu, .hay-account:focus-within .hay-account__menu { display: block; }
.hay-account__menu a { display: block; padding: 9px 12px; border-radius: 10px; color: var(--hay-ink); font-size: 14px; }
.hay-account__menu a:hover { background: var(--hay-teal-soft); }
.hay-cart-btn { position: relative; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 20px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal) !important; font-weight: 600; font-size: 15px; }
.hay-cart-btn:hover { background: #DCEBED; }
.hay-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px; box-sizing: border-box; border-radius: 999px; background: var(--hay-orange); color: var(--hay-ink); font-size: 12px; font-weight: 700; line-height: 1; }
.hay-icon-btn { position: relative; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 999px; color: var(--hay-teal); }
.hay-icon-btn:hover { background: var(--hay-teal-soft); }
.hay-icon-btn .hay-badge { position: absolute; top: 0; right: -2px; min-width: 18px; height: 18px; font-size: 11px; padding: 0 4px; }
.hay-hamburger { display: none; border: 0; background: var(--hay-teal-soft); color: var(--hay-teal); width: 44px; height: 44px; border-radius: 12px; align-items: center; justify-content: center; }

.hay-catnav { border-top: 1px solid #E6EEEF; }
.hay-catnav__inner { padding-top: 8px; padding-bottom: 8px; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.hay-catnav__link { display: flex; align-items: center; height: 38px; padding: 0 14px; border-radius: 999px; color: var(--hay-ink); font-weight: 500; font-size: 15px; }
.hay-catnav__link:hover, .hay-catnav__link.is-active { background: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-catmenu { position: relative; margin-right: 12px; }
.hay-catmenu__btn { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 999px; background: var(--hay-teal); color: #fff !important; font-weight: 600; font-size: 14px; border: 0; cursor: pointer; }
.hay-catmenu__panel { display: none; position: absolute; top: 100%; left: 0; padding-top: 8px; z-index: 130; }
.hay-catmenu:hover .hay-catmenu__panel, .hay-catmenu:focus-within .hay-catmenu__panel { display: block; }
.hay-catmenu__list { list-style: none; margin: 0; padding: 8px; width: 280px; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; box-shadow: 0 16px 40px rgba(16,40,44,.16); }
.hay-catmenu__list { position: relative; }
.hay-catmenu__list > li { position: static; }
.hay-catmenu__list a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; color: var(--hay-ink); font-size: 14px; font-weight: 500; }
.hay-catmenu__list a i { width: 18px; text-align: center; color: var(--hay-teal-mid); }
.hay-catmenu__list > li:hover > a { background: var(--hay-teal-soft); color: var(--hay-teal); }
/* Menu cấp con: trải ngang thành lưới 3 cột, luôn canh đỉnh với khung danh mục cha */
.hay-catmenu__sub { display: none; position: absolute; left: 100%; top: -1px; min-height: calc(100% + 2px); box-sizing: border-box; list-style: none; margin: 0 0 0 6px; padding: 12px; width: 760px; max-width: calc(100vw - 280px - 80px); background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; box-shadow: 0 16px 40px rgba(16,40,44,.16); grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 8px; row-gap: 2px; align-content: start; }
/* Cầu nối vô hình để rê chuột qua khe hở không bị đóng menu */
.hay-catmenu__sub::before { content: ""; position: absolute; top: 0; bottom: 0; left: -8px; width: 8px; }
.hay-catmenu__list > li:hover > .hay-catmenu__sub { display: grid; }
.hay-catmenu__sub a { align-items: flex-start; line-height: 1.4; }
.hay-catmenu__sub a i:not([class]), .hay-catmenu__sub a i[class=""], .hay-catmenu__sub a i[class=" "] { display: none; }
.hay-catmenu__sub a:hover { background: var(--hay-teal-soft); color: var(--hay-teal); }
@media (max-width: 1199px) { .hay-catmenu__sub { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 1199px) {
  .hay-action--consult, .hay-action__text { display: none; }
}
@media (max-width: 991px) {
  .hay-topbar__note { display: none; }
  .hay-header__main { gap: 12px; flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  .hay-header__logo img { height: 38px; }
  .hay-search-wrap { order: 3; flex-basis: 100%; min-width: 0; }
  .hay-header__actions { margin-left: auto; }
  .hay-cart-btn { padding: 0 14px; }
  .hay-cart-btn__label { display: none; }
  .hay-hamburger { display: flex; }
  .hay-catnav { display: none; }
}
@media (max-width: 575px) {
  .hay-container { padding-left: 16px; padding-right: 16px; }
  .hay-topbar__nav { gap: 14px; }
  .hay-topbar__nav .hay-topbar__optional { display: none; }
  .hay-search .hay-search__type, .hay-search .nice-select, .hay-search .icon-search span { display: none; }
  .hay-search .icon-search { padding: 0 14px; }
}

/* ==========================================================================
   TRUST STRIP + FOOTER
   ========================================================================== */
.hay-trust { background: var(--hay-teal-soft); }
.hay-trust__grid { padding-top: 28px; padding-bottom: 28px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 24px; }
.hay-trust__item { display: flex; align-items: center; gap: 14px; }
.hay-trust__icon { flex: none; width: 48px; height: 48px; border-radius: 999px; background: #fff; color: var(--hay-teal); display: flex; align-items: center; justify-content: center; }
.hay-trust__title { font-weight: 600; font-size: 15px; }
.hay-trust__desc { font-size: 13px; color: var(--hay-muted); }

.hay-footer { width: 100%; background: var(--hay-teal); color: #D4E6E8; font-family: var(--hay-font-body); }
.hay-footer a { color: #D4E6E8; text-decoration: none; font-size: 14px; }
.hay-footer a:hover { color: #fff; text-decoration: underline; }
.hay-footer__top { padding-top: 48px; padding-bottom: 32px; display: flex; flex-wrap: wrap; gap: 40px; }
.hay-footer__brand { flex: 1 1 300px; display: flex; flex-direction: column; gap: 16px; }
.hay-footer__brand img { display: block; height: 44px; width: auto; align-self: flex-start; }
.hay-footer__contact { display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 1.5; }
.hay-footer__contact span.k { color: #9FC0C4; margin-right: 4px; }
.hay-footer__contact b { color: #fff; }
.hay-footer__col { flex: 1 1 160px; display: flex; flex-direction: column; gap: 12px; }
.hay-footer__heading { font-family: var(--hay-font-display); font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hay-orange); }
.hay-footer__bottom { border-top: 1px solid rgba(255,255,255,.14); }
.hay-footer__bottom-inner { padding-top: 24px; padding-bottom: 32px; display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; align-items: flex-start; }
.hay-footer__legal { flex: 1 1 640px; display: flex; flex-direction: column; gap: 6px; font-size: 13px; line-height: 1.55; color: #B9D2D5; }
.hay-footer__qr { flex: none; display: flex; align-items: center; gap: 12px; font-size: 12px; color: #B9D2D5; }
.hay-footer__qr img { width: 72px; height: 72px; border-radius: 8px; background: #fff; padding: 4px; }

/* ==========================================================================
   HOME
   ========================================================================== */
.hay-hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(500px, 100%), 1fr)); gap: 24px; }
.hay-hero__panel { background: var(--hay-teal); color: #fff; border-radius: 24px; padding: 56px 48px; min-height: 440px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; gap: 22px; }
.hay-hero__eyebrow { align-self: flex-start; background: rgba(255,255,255,.12); color: var(--hay-teal-pale); font-size: 13px; font-weight: 500; padding: 6px 14px; border-radius: 999px; }
.hay-hero__title { margin: 0; font-family: var(--hay-font-display); font-size: 44px; line-height: 1.15; font-weight: 600; letter-spacing: -.01em; color: #fff; text-wrap: balance; }
.hay-hero__lead { margin: 0; font-size: 17px; line-height: 1.6; color: var(--hay-teal-pale); max-width: 520px; }
.hay-hero__ctas { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.hay-hero__facts { display: flex; gap: 24px; flex-wrap: wrap; font-size: 14px; color: var(--hay-teal-pale); margin-top: 8px; }
.hay-hero__facts span { display: flex; align-items: center; gap: 8px; }
.hay-hero__media { position: relative; border-radius: 24px; overflow: hidden; min-height: 440px; background: var(--hay-teal-pale); }
.hay-hero__media > img, .hay-hero__media .hay-hero__slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.hay-hero__media .hay-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s; }
.hay-hero__media .hay-hero__slide.is-active { opacity: 1; }
.hay-hero__find { position: absolute; left: 20px; bottom: 20px; display: flex; align-items: center; gap: 14px; background: #fff; color: var(--hay-ink); text-decoration: none; padding: 14px 18px; border-radius: 16px; box-shadow: 0 8px 24px rgba(16,40,44,.18); z-index: 2; }
.hay-hero__find:hover { color: var(--hay-ink); }

.hay-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 16px; }
.hay-tile { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; padding: 18px 20px; color: var(--hay-ink); text-decoration: none; transition: border-color .15s, box-shadow .15s; }
.hay-tile:hover { color: var(--hay-ink); border-color: var(--hay-teal-pale); box-shadow: 0 6px 18px rgba(16,40,44,.08); }
.hay-tile__icon { flex: none; width: 48px; height: 48px; border-radius: 14px; background: var(--hay-teal-soft); color: var(--hay-teal); display: flex; align-items: center; justify-content: center; }
.hay-tile__icon--round { border-radius: 999px; width: 40px; height: 40px; }
.hay-tile__text { display: flex; flex-direction: column; gap: 2px; }
.hay-tile__text b { font-size: 15px; }
.hay-tile__text span { font-size: 13px; color: var(--hay-muted); }

.hay-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(136px, 100%), 1fr)); gap: 12px; }
.hay-cat { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 20px 12px; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; color: var(--hay-ink); text-decoration: none; text-align: center; transition: border-color .15s; }
.hay-cat:hover { color: var(--hay-teal); border-color: var(--hay-teal-pale); }
.hay-cat__icon { width: 56px; height: 56px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); display: flex; align-items: center; justify-content: center; overflow: hidden; font-size: 24px; }
.hay-cat__icon img { width: 36px; height: 36px; object-fit: contain; }
.hay-cat__name { font-size: 14px; font-weight: 600; line-height: 1.35; }
.hay-cat__count { font-size: 12px; color: var(--hay-muted); margin-top: -8px; }

.hay-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.hay-tab { height: 40px; padding: 0 18px; border-radius: 999px; border: 1.5px solid var(--hay-line); background: #fff; color: var(--hay-ink); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.hay-tab[aria-selected="true"] { border-color: var(--hay-teal); background: var(--hay-teal); color: #fff; }
.hay-tabpanel[hidden] { display: none; }

.hay-product-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: 16px; }

.hay-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(270px, 100%), 1fr)); gap: 16px; }
.hay-group { border-radius: 20px; padding: 28px 24px; display: flex; flex-direction: column; gap: 14px; min-height: 220px; box-sizing: border-box; }
.hay-group h3 { margin: 0; font-family: var(--hay-font-display); font-size: 21px; font-weight: 600; }
.hay-group__links { display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.hay-group__links a { color: var(--hay-ink); text-decoration: none; }
.hay-group__links a:hover { color: var(--hay-teal); text-decoration: underline; }
.hay-group__more { margin-top: auto; font-weight: 600; font-size: 14px; color: var(--hay-teal); text-decoration: none; }

.hay-posts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 20px; }
.hay-post { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--hay-line); border-radius: 18px; overflow: hidden; color: var(--hay-ink); text-decoration: none; transition: box-shadow .15s; }
.hay-post:hover { color: var(--hay-ink); box-shadow: 0 8px 24px rgba(16,40,44,.1); }
.hay-post__img { display: block; height: 180px; background: var(--hay-teal-soft); overflow: hidden; }
.hay-post__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hay-post__body { display: flex; flex-direction: column; gap: 8px; padding: 20px; }
.hay-post__cat { font-size: 12px; font-weight: 600; color: var(--hay-teal-mid); text-transform: uppercase; letter-spacing: .05em; }
.hay-post__title { font-family: var(--hay-font-display); font-size: 19px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hay-post__meta { font-size: 13px; color: var(--hay-muted); }

.hay-cta { background: var(--hay-teal-pale); border-radius: 24px; padding: 40px 48px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.hay-cta__text { display: flex; flex-direction: column; gap: 8px; flex: 1 1 420px; }
.hay-cta__text p { margin: 0; font-size: 16px; line-height: 1.6; color: #24403F; }

.hay-banner-strip img { width: 100%; border-radius: 20px; display: block; }

@media (max-width: 720px) {
  .hay-hero__panel { padding: 32px 20px; min-height: 0; }
  .hay-hero__title { font-size: 32px; }
  .hay-hero__media { min-height: 260px; }
  .hay-cta { padding: 32px 20px; }
  .hay-h2 { font-size: 23px; }
  .hay-section { padding-top: 40px; }
}

/* ==========================================================================
   PRODUCT CARD (Views/Shared/ProductItem.cshtml) - giữ nguyên markup/JS,
   chỉ đổi giao diện theo thẻ sản phẩm của thiết kế.
   ========================================================================== */
.product-item, .product-item.vertical { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; padding: 12px; box-shadow: none; overflow: hidden; height: 100%; box-sizing: border-box; }
.product-item:hover { box-shadow: 0 8px 24px rgba(16,40,44,.1); border-color: var(--hay-teal-pale); }
.product-item .thumb { border-radius: 12px; background: #EEF5F6; overflow: hidden; }
.product-item .thumb .image { width: 100%; display: flex; align-items: center; justify-content: center; }
.product-item .thumb .image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.product-item .thumb .promotion-percent-bg::before { border-left-color: var(--hay-orange); }
.product-item .thumb .promotion-percent { color: var(--hay-ink); font-size: 13px; font-weight: 700; }
.product-item .thumb .favorite-product a { color: var(--hay-teal); box-shadow: 0 2px 8px rgba(16,40,44,.12); }
.product-item .thumb .favorite-product a:hover { background: var(--hay-teal); color: #fff !important; }
.product-item .thumb .tag-sale .tag-sale1 { background: var(--hay-orange); color: var(--hay-ink); border-top-right-radius: 8px; font-weight: 700; }
.product-item .thumb .tag-sale .tag-sale1::after { border-bottom-color: var(--hay-orange); }
.product-item .thumb .tag-sale .tag-sale2, .product-item .thumb .tag-sale .tag-sale2::before { background: var(--hay-teal); }
.product-item .thumb .tag-sale .tag-sale2::after { border-bottom-color: var(--hay-teal); }
.product-item .wrap { height: auto; flex: 1; display: flex; flex-direction: column; gap: 10px; padding-top: 10px; }
.product-item .content { padding: 0 4px; background: transparent; flex: 1; }
.product-item .name { height: auto; min-height: 42px; padding-top: 0 !important; font-size: 15px; font-weight: 600; line-height: 1.4; letter-spacing: 0; }
.product-item .name a { color: var(--hay-ink); }
.product-item .name a:hover { color: var(--hay-teal); }
.product-item .price { padding-top: 6px !important; }
.product-item .new-price { color: var(--hay-teal); font-size: 18px; font-weight: 700; }
.product-item .old-price { color: #8A9B9D; font-size: 13px; margin-left: 4px; }
.product-item .price .unit { display: inline; margin: 0; font-size: 13px; color: var(--hay-muted); }
.product-item .add-cart { position: relative; width: 100%; left: auto; right: auto; bottom: auto; padding: 0; background: #fff; border: 1.5px solid var(--hay-teal); border-radius: 999px; overflow: hidden; height: 42px; }
.product-item .add-cart .quantity-control { height: 39px; }
.product-item .add-cart .quantity-control a:first-child, .product-item .add-cart .quantity-control a:last-child { height: 39px; line-height: 39px; color: var(--hay-teal); }
.product-item .add-cart .quantity-control input { height: 39px; color: var(--hay-ink); font-weight: 600; text-align: center; }
.product-item .add-cart .mask { top: 0; left: 0; height: 100%; line-height: 39px; background: #fff; color: var(--hay-teal); border-radius: 999px; font-size: 14px; font-weight: 600; }
.product-item .add-cart .mask:hover { background: var(--hay-teal); color: #fff; }
.product-item .add-cart .mask.isSoldOut { background: #EEF2F2; color: #8A9B9D; }
.product-item.horizontal { flex-direction: row; height: auto; gap: 12px; }
.product-item.horizontal .thumb { flex: 0 0 42%; }
.product-item.horizontal .wrap { height: auto; padding-top: 0; }

/* Tiêu đề khối cũ (.title-mypha) trên các trang chưa làm lại */
.title-mypha_seo__section-title h2 { font-family: var(--hay-font-display); color: var(--hay-teal); text-transform: none; font-weight: 600; }
.title-mypha_seo__section-title h2 span { color: var(--hay-teal); }
.btn-seemore .see-more { color: var(--hay-teal); font-weight: 600; }

/* ==========================================================================
   TRANG CON DÙNG CHUNG (tiêu đề trang, chip, phân trang, thẻ, breadcrumb)
   ========================================================================== */
.hay-page { padding-top: 32px; padding-bottom: 64px; display: flex; flex-direction: column; gap: 24px; }
.hay-page--article { padding-top: 20px; gap: 0; }
.hay-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.hay-page-head__text { display: flex; flex-direction: column; gap: 8px; max-width: 680px; }
.hay-page-title { margin: 0; font-family: var(--hay-font-display); font-size: 38px; font-weight: 600; color: var(--hay-teal); line-height: 1.2; }
.hay-page-lead { margin: 0; font-size: 16px; line-height: 1.6; color: #33494C; }
.hay-h2--sm { font-size: 24px; margin-top: 12px; }
.hay-field-search { flex: 0 1 360px; display: flex; align-items: center; gap: 8px; height: 48px; border: 1.5px solid var(--hay-line); border-radius: 999px; padding: 0 18px; background: #fff; color: var(--hay-muted); box-sizing: border-box; margin: 0; }
.hay-field-search:focus-within { border-color: var(--hay-teal); }
.hay-field-search input { flex: 1; min-width: 0; border: 0; outline: none; font: inherit; font-size: 15px; background: transparent; color: var(--hay-ink); height: 100%; padding: 0; }

.hay-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.hay-chip { display: inline-flex; align-items: center; height: 40px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--hay-line); background: #fff; color: var(--hay-ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.hay-chip:hover { border-color: var(--hay-teal); color: var(--hay-teal); }
.hay-chip.is-active { border-color: var(--hay-teal); background: var(--hay-teal); color: #fff; }

.hay-featured { display: flex; flex-wrap: wrap; gap: 20px; }
.hay-featured__main { flex: 2 1 560px; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--hay-line); border-radius: 22px; overflow: hidden; color: var(--hay-ink); text-decoration: none; }
.hay-featured__main:hover { color: var(--hay-ink); box-shadow: 0 8px 24px rgba(16,40,44,.1); }
.hay-featured__img { display: block; height: 300px; background: var(--hay-teal-pale); overflow: hidden; }
.hay-featured__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hay-featured__body { display: flex; flex-direction: column; gap: 10px; padding: 24px 28px; }
.hay-featured__title { font-family: var(--hay-font-display); font-size: 28px; line-height: 1.3; font-weight: 600; }
.hay-featured__desc { font-size: 15px; line-height: 1.6; color: #33494C; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hay-featured__side { flex: 1 1 320px; display: flex; flex-direction: column; gap: 20px; }
.hay-featured__card { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; border-radius: 22px; padding: 24px; text-decoration: none; min-height: 200px; box-sizing: border-box; }
.hay-featured__card.is-warm { background: #FBE9C8; color: var(--hay-ink); }
.hay-featured__card.is-warm .hay-featured__cat { color: #6B4A10; }
.hay-featured__card.is-warm .hay-featured__date { color: #4E4433; }
.hay-featured__card.is-dark { background: var(--hay-teal); color: #fff; }
.hay-featured__card.is-dark .hay-featured__cat, .hay-featured__card.is-dark .hay-featured__date { color: var(--hay-teal-pale); }
.hay-featured__card:hover { filter: brightness(.97); }
.hay-featured__card.is-warm:hover { color: var(--hay-ink); }
.hay-featured__card.is-dark:hover { color: #fff; }
.hay-featured__cat { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.hay-featured__card-title { font-family: var(--hay-font-display); font-size: 20px; line-height: 1.35; font-weight: 600; }
.hay-featured__date { font-size: 13px; }

.hay-posts--grid { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); }
.hay-posts--grid .hay-post__img { height: 170px; }
.hay-posts--grid .hay-post__title { font-size: 18px; line-height: 1.4; }

.hay-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 48px 24px; background: #fff; border: 1px dashed var(--hay-line); border-radius: 20px; text-align: center; color: var(--hay-muted); }
.hay-empty b { color: var(--hay-ink); font-size: 17px; }

.hay-pagination { display: flex; justify-content: center; margin-top: 8px; }
.hay-pagination ul { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; justify-content: center; }
.hay-pagination li a, .hay-pagination li span { display: flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 999px; border: 1.5px solid var(--hay-line); background: #fff; color: var(--hay-ink); font-weight: 600; font-size: 14px; text-decoration: none; box-sizing: border-box; }
.hay-pagination li a:hover { border-color: var(--hay-teal); color: var(--hay-teal); }
.hay-pagination li.active a { background: var(--hay-teal); border-color: var(--hay-teal); color: #fff; }

.hay-seo-text { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; padding: 24px 28px; }

.hay-breadcrumb { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--hay-muted); flex-wrap: wrap; }
.hay-breadcrumb a { text-decoration: none; color: var(--hay-teal); }
.hay-breadcrumb a:hover { text-decoration: underline; }

.hay-card { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.hay-card > b { font-size: 15px; color: var(--hay-teal); }
.hay-card--dark { background: var(--hay-teal); border-color: var(--hay-teal); color: #fff; }
.hay-card--dark span { font-size: 14px; line-height: 1.55; color: var(--hay-teal-pale); }
.hay-card--dark .hay-btn { align-self: flex-start; margin-top: 4px; }
.hay-card__title { font-family: var(--hay-font-display); font-size: 18px; font-weight: 600; }
.hay-card .sidebar__widget { margin: 0 !important; }

/* Bài viết */
.hay-article-layout { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; margin-top: 20px; }
.hay-article { flex: 999 1 560px; min-width: 0; max-width: 820px; background: #fff; border: 1px solid var(--hay-line); border-radius: 24px; padding: 44px 48px; box-sizing: border-box; display: flex; flex-direction: column; gap: 22px; font-size: 17px; line-height: 1.75; color: #24393C; }
.hay-article__head { display: flex; flex-direction: column; gap: 14px; }
.hay-article__title { margin: 0; font-family: var(--hay-font-display); font-size: 38px; line-height: 1.25; font-weight: 600; color: var(--hay-ink); }
.hay-article__meta { display: flex; gap: 12px; align-items: center; font-size: 14px; line-height: 1.5; color: var(--hay-muted); }
.hay-article__avatar { flex: none; width: 40px; height: 40px; border-radius: 999px; background: var(--hay-teal-pale); color: var(--hay-teal); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }
.hay-article__summary { background: var(--hay-teal-soft); border-radius: 18px; padding: 20px 24px; font-size: 16px; line-height: 1.65; }
.hay-article__summary b { color: var(--hay-teal); }
.hay-article__summary p { margin: 8px 0 0; }
.hay-article__content.ql-editor { padding: 0; height: auto; overflow: visible; font-size: 17px; line-height: 1.75; color: #24393C; font-family: var(--hay-font-body); }
.hay-article__content h2, .hay-article__content h3 { font-family: var(--hay-font-display); color: var(--hay-teal); font-weight: 600; line-height: 1.35; margin: 1.2em 0 .5em; scroll-margin-top: calc(var(--hay-header-h, 0px) + 24px); }
.hay-article__content h2 { font-size: 25px; }
.hay-article__content h3 { font-size: 20px; }
.hay-article__content p { margin: 0 0 1em; }
.hay-article__content img { max-width: 100%; height: auto; border-radius: 14px; }
.hay-article__note { display: flex; gap: 12px; align-items: flex-start; border-top: 1px solid #E6EEEF; padding-top: 18px; font-size: 14px; line-height: 1.6; color: var(--hay-muted); }
.hay-article__note svg { flex: none; margin-top: 2px; }
.hay-article-aside { flex: 1 1 300px; display: flex; flex-direction: column; gap: 16px; }
.hay-toc ol { margin: 4px 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.5; }
.hay-toc a { text-decoration: none; }
.hay-toc a:hover { text-decoration: underline; }

@media (max-width: 720px) {
  .hay-page-title, .hay-article__title { font-size: 28px; }
  .hay-article { padding: 28px 20px; font-size: 16px; }
  .hay-featured__title { font-size: 22px; }
  .hay-featured__img { height: 200px; }
}

/* ==========================================================================
   DANH MỤC & BỘ LỌC / KẾT QUẢ TÌM KIẾM (Views/Product/Index.cshtml)
   ========================================================================== */
.hay-shop { padding-top: 20px; padding-bottom: 64px; }
.hay-breadcrumb__current { color: var(--hay-ink); font-weight: 500; }
.hay-shop__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 16px 0 20px; flex-wrap: wrap; }
.hay-page-title--md { font-size: 34px; }
.hay-h2--xs { font-size: 20px; margin: 0; }
.hay-chips--soft { gap: 10px; margin-bottom: 28px; }
.hay-chips--soft .hay-chip { border-width: 1px; font-weight: 500; }
.hay-shop__layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }

.hay-filter { flex: 1 1 260px; max-width: 100%; background: #fff; border: 1px solid var(--hay-line); border-radius: 18px; padding: 8px 20px 20px; box-sizing: border-box; }
.hay-filter__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid #E6EEEF; }
.hay-filter__title { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 16px; color: var(--hay-teal); }
.hay-filter__clear { font-size: 13px; color: var(--hay-teal-mid); font-weight: 600; text-decoration: none; }
.hay-filter__group { padding: 16px 0; border-bottom: 1px solid #E6EEEF; }
.hay-filter__group:last-child { border-bottom: 0; padding-bottom: 0; }
.hay-filter__group > summary { font-weight: 600; font-size: 15px; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.hay-filter__group > summary::-webkit-details-marker { display: none; }
.hay-filter__group > summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--hay-teal-mid); border-bottom: 2px solid var(--hay-teal-mid); transform: rotate(45deg); margin-right: 4px; transition: transform .15s; }
.hay-filter__group[open] > summary::after { transform: rotate(-135deg); }
.hay-filter__body { margin-top: 12px; max-height: 320px; overflow-y: auto; }
.hay-filter ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hay-filter li a { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--hay-ink); position: relative; padding: 0; background: none; }
.hay-filter label { margin: 0; cursor: pointer; font-size: 14px; color: var(--hay-ink); }
.hay-filter input[type=checkbox] { width: 18px; height: 18px; flex: none; }
.hay-filter .accordion-item { background: transparent; border: 0; }
.hay-filter .accordion-button { font-size: 14px; font-weight: 600; color: var(--hay-ink); padding: 8px 0 !important; background: transparent !important; box-shadow: none !important; gap: 8px; }
.hay-filter .accordion-button:not(.collapsed) { color: var(--hay-teal); }
.hay-filter .accordion-button img { width: 22px; height: 22px; object-fit: contain; }
.hay-filter .accordion-button::after { width: 14px; height: 14px; background-size: 14px; }
.hay-filter .category_child { padding: 4px 0 8px 10px; gap: 8px; }
.hay-filter .seletedKhac { background: var(--hay-teal-soft) !important; border-radius: 8px; }

.hay-shop__list { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.hay-sortbar { background: #fff; border: 1px solid var(--hay-line); border-radius: 14px; padding: 10px 14px; }
.hay-sortbar__list { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; }
.hay-sortbar__label { font-size: 14px; color: var(--hay-muted); margin-right: 4px; }
.hay-sortbar .groupform { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--hay-line); background: #fff; color: var(--hay-ink); font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; user-select: none; }
.hay-sortbar .groupform:hover { border-color: var(--hay-teal); color: var(--hay-teal); }
.hay-sortbar .groupform.active { background: var(--hay-teal); border-color: var(--hay-teal); color: #fff; }

/* Partial SearhData trả về các cột Bootstrap: bỏ cột, dùng lưới của thiết kế */
.hay-shop .loadItems { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); gap: 16px; margin: 0; }
.hay-shop .loadItems > [class*="col-"] { width: auto; max-width: none; flex: none; padding: 0; margin: 0 !important; }
.hay-pagination .pagination-list { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; justify-content: center; }
.hay-pagination li.active span { background: var(--hay-teal); border-color: var(--hay-teal); color: #fff; }
.hay-pagination li.disabled span { opacity: .45; }

.hay-card--note { margin-top: 24px; padding: 28px 32px; gap: 10px; }
.hay-card--note p { margin: 0; font-size: 15px; line-height: 1.7; color: #33494C; }
.hay-card--note .hay-link-more { align-self: flex-start; }

@media (max-width: 720px) {
  .hay-page-title--md { font-size: 26px; }
  .hay-filter { flex-basis: 100%; }
}

/* ==========================================================================
   CHI TIẾT SẢN PHẨM (Views/Product/Detail.cshtml)
   ========================================================================== */
.hay-pdp { padding-top: 20px; padding-bottom: 64px; }
.hay-pdp__top { margin-top: 16px; background: #fff; border: 1px solid var(--hay-line); border-radius: 22px; padding: 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); gap: 40px; }
.hay-pdp__gallery { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.hay-pdp__main-img { position: relative; aspect-ratio: 1 / 1; border-radius: 18px; background: #EEF5F6; overflow: hidden; width: 100%; }
.hay-pdp__main-img .swiper-slide { display: flex; align-items: center; justify-content: center; }
.hay-pdp__main-img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.hay-pdp__sale { position: absolute; top: 14px; left: 14px; z-index: 2; background: var(--hay-orange); color: var(--hay-ink); font-weight: 700; font-size: 14px; padding: 4px 12px; border-radius: 999px; }
.hay-pdp__thumbs { width: 100%; }
.hay-pdp__thumbs .swiper-slide { aspect-ratio: 1 / 1; height: auto; max-width: 84px; border-radius: 12px; background: #EEF5F6; border: 2px solid transparent; overflow: hidden; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.hay-pdp__thumbs .swiper-slide-thumb-active { border-color: var(--hay-teal); }
.hay-pdp__thumbs img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.hay-pdp__hint { margin: 0; font-size: 13px; color: var(--hay-muted); }

.hay-pdp__info { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.hay-pdp__tags { display: flex; gap: 10px 16px; flex-wrap: wrap; align-items: center; font-size: 14px; color: var(--hay-muted); }
.hay-pdp__tags a { text-decoration: none; }
.hay-pill { display: inline-flex; align-items: center; background: var(--hay-teal-soft); color: var(--hay-teal); font-weight: 600; font-size: 13px; padding: 4px 12px; border-radius: 999px; text-decoration: none; }
.hay-pdp__title { margin: 0; font-family: var(--hay-font-display); font-size: 30px; line-height: 1.3; font-weight: 600; color: var(--hay-ink); }
.hay-pdp__meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 14px; color: var(--hay-muted); }
.hay-pdp__price { background: var(--hay-ground); border-radius: 16px; padding: 18px 22px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.hay-pdp__price b { font-family: var(--hay-font-display); font-size: 34px; font-weight: 600; color: var(--hay-teal); }
.hay-pdp__price span { font-size: 16px; color: var(--hay-muted); }
.hay-pdp__price del { font-size: 16px; color: #8A9B9D; margin-left: 8px; }

.hay-pdp__row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.hay-pdp__label { width: 92px; font-size: 15px; color: var(--hay-muted); }
.hay-pdp__buy { display: flex; align-items: center; gap: 12px; flex: 1; flex-wrap: wrap; margin: 0 !important; }
.hay-qty form { display: flex; align-items: center; border: 1.5px solid var(--hay-line); border-radius: 999px; height: 48px; overflow: hidden; margin: 0; background: #fff; }
.hay-qty button { width: 44px; height: 46px; border: 0; background: #fff; font: inherit; font-size: 20px; color: var(--hay-teal); cursor: pointer; padding: 0; }
.hay-qty button:hover { background: var(--hay-teal-soft); }
.hay-qty input { width: 52px; height: 46px; border: 0; text-align: center; font-weight: 700; font-size: 16px; color: var(--hay-ink); padding: 0; -moz-appearance: textfield; }
.hay-qty input::-webkit-outer-spin-button, .hay-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hay-pdp__add { flex: 1 1 220px; height: 54px; }
.hay-pdp__add.isSholdOut { background: #EEF2F2; color: #8A9B9D; cursor: not-allowed; }
.hay-pdp__actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hay-pdp__actions .hay-btn { flex: 1 1 160px; height: 54px; }
.hay-pdp__actions .like_btn i { font-size: 18px; }

.hay-pdp__service { border: 1px solid var(--hay-teal-pale); border-radius: 16px; display: flex; flex-direction: column; }
.hay-pdp__service-item { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; font-size: 14px; line-height: 1.5; }
.hay-pdp__service-item + .hay-pdp__service-item { border-top: 1px solid #E6EEEF; }
.hay-pdp__service-item svg { flex: none; margin-top: 1px; }
.hay-linkbtn { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--hay-teal); cursor: pointer; }
.hay-linkbtn:hover { text-decoration: underline; }
.hay-pdp__warning { display: flex; gap: 10px; align-items: center; font-size: 13px; color: #33494C; background: #FDF5E6; border-radius: 12px; padding: 12px 14px; }
.hay-pdp__warning svg { flex: none; }

.hay-pdp__combo, .hay-pdp__promos { display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--hay-line); border-radius: 16px; padding: 16px 18px; }
.hay-pdp__combo > b, .hay-pdp__promos > b { color: var(--hay-teal); font-size: 15px; }
.hay-mini-product { display: flex; gap: 12px; align-items: center; color: var(--hay-ink); text-decoration: none; }
.hay-mini-product:hover { color: var(--hay-teal); }
.hay-mini-product img { flex: none; width: 56px; height: 56px; border-radius: 10px; background: #EEF5F6; object-fit: contain; }
.hay-mini-product > span { display: flex; flex-direction: column; gap: 2px; font-size: 14px; line-height: 1.45; min-width: 0; }
.hay-mini-product b { font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hay-mini-product__price { color: var(--hay-teal); font-weight: 600; }
.hay-mini-product__gift { color: #B5791A; font-weight: 600; }
.hay-promo { display: flex; gap: 12px; align-items: flex-start; padding: 12px; border-radius: 12px; background: #FFFBF3; color: var(--hay-ink); text-decoration: none; }
.hay-promo:hover { color: var(--hay-ink); background: #FDF1DC; }
.hay-promo img { flex: none; width: 44px; height: 44px; border-radius: 10px; object-fit: cover; }
.hay-promo > span { display: flex; flex-direction: column; gap: 2px; font-size: 14px; }
.hay-promo ul { margin: 4px 0 0; padding-left: 18px; font-size: 13px; color: #33494C; }

.hay-pdp__body { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; margin-top: 24px; }
.hay-pdp__content { flex: 999 1 560px; min-width: 0; background: #fff; border: 1px solid var(--hay-line); border-radius: 22px; overflow: hidden; }
.hay-pdp__toc { display: flex; gap: 4px; flex-wrap: wrap; padding: 10px 16px; border-bottom: 1px solid #E6EEEF; background: #FBFDFD; position: sticky; top: var(--hay-header-h, 0px); z-index: 5; }
.hay-pdp__toc a { display: flex; align-items: center; height: 40px; padding: 0 14px; border-radius: 999px; color: var(--hay-ink); font-size: 14px; font-weight: 500; text-decoration: none; }
.hay-pdp__toc a:hover { background: var(--hay-teal-soft); }
.hay-pdp__toc a.is-active { background: var(--hay-teal); color: #fff; font-weight: 600; }
.hay-pdp__sections { padding: 28px 32px; display: flex; flex-direction: column; gap: 28px; font-size: 15px; line-height: 1.7; color: #24393C; }
.hay-pdp__sections section { display: flex; flex-direction: column; gap: 10px; scroll-margin-top: calc(var(--hay-header-h, 0px) + 72px); }
.hay-pdp__sections h2 { margin: 0; font-family: var(--hay-font-display); font-size: 21px; font-weight: 600; color: var(--hay-teal); }
.hay-pdp__sections .ql-editor { padding: 0; height: auto; overflow: visible; font-family: var(--hay-font-body); font-size: 15px; line-height: 1.7; color: #24393C; }
.hay-pdp__sections .ql-editor img { max-width: 100%; height: auto; border-radius: 12px; }
.hay-pdp__sections table { width: 100%; border-collapse: collapse; }
.hay-pdp__sections th, .hay-pdp__sections td { padding: 10px 14px; border-bottom: 1px solid #E6EEEF; text-align: left; }
.hay-pdp__sections th { background: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-pdp__instr { display: flex; flex-direction: column; gap: 4px; }
.hay-pdp__ask { background: var(--hay-teal-soft); border-radius: 16px; padding: 20px 22px; }
.hay-pdp__ask p { margin: 0; color: #33494C; }
.hay-pdp__ask-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.hay-pdp__aside { flex: 1 1 300px; display: flex; flex-direction: column; gap: 16px; }
.hay-card__heading { margin: 0 0 4px; font-family: var(--hay-font-body); font-size: 17px; font-weight: 700; color: var(--hay-teal); }
.hay-dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px 12px; font-size: 14px; }
.hay-dl dt { color: var(--hay-muted); font-weight: 400; }
.hay-dl dd { margin: 0; }
.hay-dl a { text-decoration: none; }
.hay-card--soft { background: var(--hay-teal-soft); border-color: var(--hay-teal-soft); }
.hay-pharmacist { flex-direction: row; gap: 14px; align-items: flex-start; }
.hay-pharmacist .hay-article__avatar { width: 48px; height: 48px; }
.hay-pharmacist > div { display: flex; flex-direction: column; gap: 4px; font-size: 14px; line-height: 1.5; }
.hay-pharmacist .hay-link-more { font-size: 14px; }

@media (max-width: 720px) {
  .hay-pdp__top { padding: 18px; gap: 24px; }
  .hay-pdp__title { font-size: 23px; }
  .hay-pdp__price b { font-size: 28px; }
  .hay-pdp__sections { padding: 20px; }
  .hay-pdp__label { width: auto; }
}

/* ==========================================================================
   GIỎ HÀNG (Views/Cart/MyCart.cshtml)
   ========================================================================== */
.hay-cart { padding-top: 28px; gap: 20px; }
.hay-cart__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-page-title--sm { font-size: 30px; }
.hay-page-title--sm span { font-size: 18px; color: var(--hay-muted); font-weight: 500; }
.hay-notice { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--hay-teal-pale); border-radius: 16px; padding: 14px 18px; font-size: 14px; line-height: 1.5; }
.hay-notice .hay-tile__icon { flex: none; }

.hay-cart__layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.hay-cart__items { flex: 999 1 560px; min-width: 0; background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; overflow: hidden; }
.hay-cart__row { display: flex; align-items: center; gap: 12px; padding: 18px 22px; border-bottom: 1px solid #E6EEEF; flex-wrap: wrap; margin: 0; }
.hay-cart__row--head { padding: 16px 22px; font-size: 14px; color: var(--hay-muted); }
.hay-cart__check-all { display: flex; align-items: center; gap: 12px; flex: 1; color: var(--hay-ink); font-weight: 600; margin: 0; cursor: pointer; }
.hay-cart__col-qty { width: 132px; display: flex; justify-content: center; text-align: center; }
.hay-cart__col-total { width: 120px; text-align: right; }
.hay-cart__col-total b { font-size: 16px; color: var(--hay-teal); }
.hay-cart__col-total .total-p-save-price { font-size: 12px; color: #B5791A; }
.hay-cart__col-del { width: 40px; display: flex; justify-content: center; }
.hay-cart__product { display: flex; align-items: center; gap: 14px; flex: 1 1 300px; min-width: 0; }
.hay-cart__img { flex: none; width: 84px; height: 84px; border-radius: 12px; background: #EEF5F6; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hay-cart__img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.hay-cart__info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hay-cart__name { color: var(--hay-ink); text-decoration: none; font-weight: 600; font-size: 15px; line-height: 1.4; }
.hay-cart__name:hover { color: var(--hay-teal); }
.hay-cart__unit { font-size: 13px; color: var(--hay-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hay-icon-del { width: 40px; height: 40px; border-radius: 999px; color: var(--hay-muted); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.hay-icon-del:hover { background: #FDECEC; color: #B42318; }

.hay-qty.product-quantity-form { display: flex; align-items: center; border: 1.5px solid var(--hay-line); border-radius: 999px; height: 40px; overflow: hidden; background: #fff; width: auto; margin: 0; }
.hay-qty.product-quantity-form a { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--hay-teal); cursor: pointer; text-decoration: none; user-select: none; }
.hay-qty.product-quantity-form a:hover { background: var(--hay-teal-soft); }
.hay-qty.product-quantity-form input[type=number] { width: 40px; height: 38px; border: 0; text-align: center; font-weight: 700; padding: 0; background: transparent; -moz-appearance: textfield; }
.hay-qty.product-quantity-form input::-webkit-outer-spin-button, .hay-qty.product-quantity-form input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.hay-cart__client { display: flex; align-items: center; gap: 12px; padding: 12px 22px; background: #FBFDFD; border-bottom: 1px solid #E6EEEF; }
.hay-cart__client-name { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--hay-ink); text-decoration: none; flex: none; }
.hay-cart__client-name img { width: 32px; height: 32px; border-radius: 8px; object-fit: contain; background: #fff; border: 1px solid var(--hay-line); }
.hay-cart__client-note { flex: 1; font-size: 13px; color: var(--hay-muted); min-width: 0; }
.hay-cart__client-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 22px; border-bottom: 1px solid #E6EEEF; flex-wrap: wrap; font-size: 14px; }
.hay-cart__client-foot.is-hidden { display: none; }

.hay-cart__aside { flex: 1 1 340px; display: flex; flex-direction: column; gap: 16px; position: sticky; top: calc(var(--hay-header-h, 0px) + 16px); }
.hay-cart__promo { flex-direction: row; align-items: center; justify-content: space-between; color: var(--hay-ink); text-decoration: none; font-size: 14px; }
.hay-cart__promo:hover { color: var(--hay-ink); border-color: var(--hay-teal); }
.hay-summary { gap: 12px; font-size: 15px; }
.hay-summary__row { display: flex; justify-content: space-between; gap: 12px; }
.hay-summary__row > span:first-child { color: var(--hay-muted); }
.hay-summary__row > span:last-child { text-align: right; }
.hay-summary__row--save > span:last-child { color: #2F7A3E; font-weight: 600; }
.hay-summary__divider { border-top: 1px dashed var(--hay-teal-pale); margin: 6px 0; }
.hay-summary__total { display: flex; justify-content: space-between; align-items: baseline; }
.hay-summary__total b:last-child { font-family: var(--hay-font-display); font-size: 26px; color: var(--hay-teal); font-weight: 600; }
.hay-summary .hay-btn { height: 54px; margin-top: 6px; width: 100%; }
.hay-summary__note { margin: 0; font-size: 13px; line-height: 1.5; color: var(--hay-muted); text-align: center; }

.hay-cart__empty { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 56px 24px; text-align: center; }
.hay-cart__empty b { font-size: 18px; }
.hay-cart__empty-icon { width: 72px; height: 72px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); display: flex; align-items: center; justify-content: center; }

@media (max-width: 720px) {
  .hay-cart__row { padding: 14px 16px; }
  .hay-cart__row--head .hay-cart__col-qty, .hay-cart__row--head .hay-cart__col-total, .hay-cart__row--head .hay-cart__col-del { display: none; }
  .hay-cart__product { flex-basis: 100%; }
  .hay-cart__col-qty { width: auto; margin-left: 50px; }
  .hay-cart__col-total { flex: 1; }
  .hay-cart__aside { position: static; }
  .hay-page-title--sm { font-size: 24px; }
}

/* ==========================================================================
   THANH TOÁN (Views/Cart/Index.cshtml) - giữ markup + JS cũ, đổi giao diện
   ========================================================================== */
.hay-steps-wrap { padding-top: 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-steps { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--hay-muted); }
.hay-steps li { display: flex; align-items: center; gap: 8px; }
.hay-steps a { text-decoration: none; }
.hay-steps__dot { width: 28px; height: 28px; border-radius: 999px; background: #E4ECED; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.hay-steps .is-done { color: var(--hay-teal); font-weight: 600; }
.hay-steps .is-done .hay-steps__dot { background: var(--hay-teal); color: #fff; }
.hay-steps .is-current { color: var(--hay-teal); font-weight: 700; }
.hay-steps .is-current .hay-steps__dot { background: var(--hay-orange); color: var(--hay-ink); }
.hay-steps__line { width: 48px; height: 2px; background: var(--hay-teal-pale); }
.hay-steps__line.is-done { background: var(--hay-teal); }
.hay-steps__secure { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--hay-muted); }
.hay-steps__secure b { color: var(--hay-teal); }

.hay-checkout.checkout-area { background: transparent; padding: 24px 0 64px; }
.hay-checkout .nth-checkout-main { gap: 24px; margin: 0; grid-template-columns: minmax(0, 1fr) 360px; }
.hay-checkout .nth-checkout-main > .col-lg-12 { margin: 0 !important; }

/* Khối nội dung */
.hay-checkout .box-cart-item, .hay-checkout .your-order #loadOrderDetail > * { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; box-shadow: none; }
.hay-checkout .box-cart-item { padding: 24px 28px; display: flex; flex-direction: column; gap: 16px; }
.hay-checkout .box-cart-header { padding: 0; border: 0; background: transparent; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hay-checkout .box-cart-header.pt-0 { display: none; }
.hay-checkout .box-cart-header-title { display: flex; align-items: center; gap: 10px; }
.hay-checkout .box-cart-header-title i { display: none; }
.hay-checkout .cart-title-name { font-family: var(--hay-font-display); font-size: 20px; font-weight: 600; color: var(--hay-teal); margin: 0; }
.hay-checkout .box-cart-header-action a { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--hay-teal); text-decoration: none; }
.hay-checkout .box-cart-body { padding: 0; border: 0; }

/* Tab hình thức nhận hàng -> thẻ radio */
.hay-checkout .guest-receive-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 12px; margin: 0 0 4px; }
.hay-checkout .delivery-method-tab { display: flex; align-items: center; gap: 12px; text-align: left; padding: 16px 18px; border-radius: 14px; border: 2px solid var(--hay-line); background: #fff; font: inherit; font-size: 15px; font-weight: 700; color: var(--hay-ink); cursor: pointer; }
.hay-checkout .delivery-method-tab::before { content: ""; flex: none; width: 20px; height: 20px; border-radius: 999px; border: 2px solid var(--hay-teal); box-sizing: border-box; background: #fff; }
.hay-checkout .delivery-method-tab.active { border-color: var(--hay-teal); background: #F5FAFA; color: var(--hay-ink); }
.hay-checkout .delivery-method-tab.active::before { background: radial-gradient(circle, var(--hay-teal) 0 5px, #fff 6px); }

/* Ô nhập */
.hay-checkout .guest-form-grid { gap: 14px; }
.hay-checkout .guest-field, .hay-checkout .nth-note-textarea, .hay-checkout textarea { height: 46px; line-height: normal; border: 1.5px solid var(--hay-line); border-radius: 10px; padding: 0 14px; font: inherit; font-size: 15px; background: #fff; color: var(--hay-ink); }
.hay-checkout .guest-field:focus, .hay-checkout textarea:focus { border-color: var(--hay-teal); }
.hay-checkout .guest-field-note, .hay-checkout textarea { height: auto; min-height: 90px; padding: 12px 14px; resize: vertical; width: 100%; }
.hay-checkout .nice-select.guest-field { height: 46px; line-height: 43px; float: none; width: 100%; }
.hay-checkout .order-notes label { font-size: 14px; font-weight: 500; margin: 12px 0 6px; display: block; }
.hay-checkout .showAddress { background: var(--hay-teal-soft); border-radius: 12px; padding: 14px 16px; font-size: 14px; line-height: 1.55; }
.hay-checkout .showAddress .NameAddress { font-size: 15px; }
.hay-checkout .delivery-pharmacy-list { display: flex; flex-direction: column; gap: 10px; }
.hay-checkout .delivery-pharmacy-empty { font-size: 14px; color: var(--hay-muted); background: var(--hay-ground); border-radius: 12px; padding: 14px 16px; }
.hay-checkout .messageAddress { border-radius: 12px; margin: 0; }

/* Hóa đơn */
.hay-checkout .infoTax-body, .hay-checkout .infoTax-no-body { font-size: 14px; line-height: 1.7; color: #33494C; }
.hay-checkout #IsInvoice { width: 18px; height: 18px; accent-color: var(--hay-teal); }

/* Phương thức thanh toán -> thẻ radio */
.hay-checkout .PaymentChannel { list-style: none; margin: 0; padding: 0; }
.hay-checkout .PaymentChannel li { display: flex; flex-direction: column; gap: 10px; }
.hay-checkout .PaymentChannel label { display: flex; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 12px; border: 1.5px solid var(--hay-line); background: #fff; font-size: 15px; font-weight: 600; color: var(--hay-ink); cursor: pointer; margin: 0; }
.hay-checkout .PaymentChannel label:has(input:checked) { border-color: var(--hay-teal); background: #F5FAFA; }
.hay-checkout .PaymentChannel input[type=radio] { width: 20px; height: 20px; accent-color: var(--hay-teal); margin: 0; }
.hay-checkout .PaymentChannel img { width: 28px; height: 28px; object-fit: contain; }
.hay-checkout #btnCreateOrder { display: none; }

/* Danh sách sản phẩm của đơn (partial CheckProductOrderDetail) */
.hay-checkout #loadOrderDetail > * { padding: 18px 22px; }
.hay-checkout #loadOrderDetail .nth-order-header { font-size: 14px; color: var(--hay-muted); border-bottom: 1px solid #E6EEEF; padding-bottom: 10px; margin: 0 0 6px; }
.hay-checkout #loadOrderDetail .cart-area { align-items: center; padding: 10px 0; border-bottom: 1px solid #F0F4F4; margin: 0; }
.hay-checkout #loadOrderDetail .image_product_cart img { width: 64px; height: 64px; object-fit: contain; border-radius: 10px; background: #EEF5F6; }
.hay-checkout #loadOrderDetail .cart-name-product, .hay-checkout #loadOrderDetail .cart-name-product a { font-weight: 600; color: var(--hay-ink); font-size: 14px; }

/* Cột tóm tắt */
.hay-checkout .nth-summary-sidebar { top: calc(var(--hay-header-h, 0px) + 16px); }
.hay-checkout .nth-summary-card { border-radius: 20px; border: 1px solid var(--hay-line); box-shadow: none; padding: 24px; display: flex; flex-direction: column; gap: 12px; font-size: 15px; }
.hay-checkout .nth-promo-link { min-height: 48px; padding: 0 14px; margin: 0 0 4px; border-radius: 12px; background: var(--hay-teal-soft); color: var(--hay-teal); font-weight: 600; font-size: 14px; text-decoration: none; }
/* Ưu đãi đang áp dụng (khung tóm tắt đơn hàng) */
.hay-applied-promos { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 6px; }
.hay-applied-promos[hidden] { display: none; }
.hay-applied-promo { display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 12px; border: 1px dashed var(--hay-teal-mid); border-radius: 12px; background: #fff; }
.hay-applied-promo__icon { flex: none; width: 30px; height: 30px; border-radius: 8px; background: #FFF4E0; color: #C77A06; display: inline-flex; align-items: center; justify-content: center; }
.hay-applied-promo__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hay-applied-promo__name { font-size: 13px; font-weight: 600; color: var(--hay-ink); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hay-applied-promo__value { font-size: 12px; font-weight: 600; color: #1F7A3A; line-height: 1.35; }
.hay-applied-promo__remove { flex: none; width: 28px; height: 28px; border: 0; border-radius: 50%; background: transparent; color: #8FA3A5; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.hay-applied-promo__remove:hover { background: var(--hay-teal-soft); color: #C2410C; }
.hay-checkout .nth-summary-row { display: flex; justify-content: space-between; gap: 12px; margin: 0; }
.hay-checkout .nth-summary-row > span:first-child { color: var(--hay-muted); }
.hay-checkout .nth-summary-row.saving > span:last-child { color: #2F7A3E; font-weight: 600; }
.hay-checkout .nth-summary-total { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px dashed var(--hay-teal-pale); padding-top: 14px; margin-top: 4px; }
.hay-checkout .nth-summary-total span:first-child { font-weight: 700; }
.hay-checkout .nth-summary-total .total_bill { font-family: var(--hay-font-display); font-size: 26px; color: var(--hay-teal); font-weight: 600; }
.hay-checkout .nth-sidebar-submit { display: flex; align-items: center; justify-content: center; width: 100%; height: 54px; border-radius: 999px; background: var(--hay-orange); color: var(--hay-ink); font-weight: 700; font-size: 16px; border: 0; margin-top: 6px; }
.hay-checkout .nth-sidebar-submit:hover { background: #E09312; color: var(--hay-ink); }
.hay-checkout .nth-terms { margin: 0; font-size: 13px; line-height: 1.5; color: var(--hay-muted); text-align: center; }

/* Modal ưu đãi */
.hay-checkout .nth-cart-modal .modal-content { border-radius: 20px; border: 0; }
.hay-checkout .nth-modal-action { border-radius: 999px; }

/* Popup "Ưu đãi & mã giảm giá" */
.hay-promo-modal .modal-content { border: 0; border-radius: 20px; overflow: hidden; font-family: var(--hay-font-body); color: var(--hay-ink); }
.hay-promo-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 24px; border-bottom: 1px solid #E6EEEF; }
.hay-promo-modal__title { display: flex; align-items: center; gap: 10px; margin: 0; font-family: var(--hay-font-display); font-size: 20px; font-weight: 600; color: var(--hay-teal); }
.hay-promo-modal__close { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--hay-teal-soft); color: var(--hay-teal); cursor: pointer; }
.hay-promo-modal__close:hover { background: var(--hay-teal-pale); }
.hay-promo-modal__body { display: flex; flex-direction: column; gap: 16px; padding: 20px 24px; background: var(--hay-ground); }
.hay-promo-modal__foot { display: flex; justify-content: center; padding: 14px 24px; border-top: 1px solid #E6EEEF; }
.hay-promo-modal__foot .hay-btn { height: 46px; min-width: 160px; }
.hay-promo-code { display: flex; gap: 10px; }
.hay-promo-code__input { flex: 1; min-width: 0; height: 48px; padding: 0 18px; border: 1.5px solid var(--hay-line); border-radius: 999px; background: #fff; font: inherit; font-size: 15px; color: var(--hay-ink); text-transform: uppercase; outline: none; }
.hay-promo-code__input::placeholder { text-transform: none; color: #8A9A9C; }
.hay-promo-code__input:focus { border-color: var(--hay-teal); }
.hay-promo-code .hay-btn { height: 48px; padding: 0 24px; flex: none; }
.hay-promo-list { display: flex; flex-direction: column; gap: 10px; }
.hay-promo { display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: #fff; border: 1px solid var(--hay-line); border-radius: 16px; }
.hay-promo.is-applied { border-color: var(--hay-teal); box-shadow: inset 4px 0 0 var(--hay-teal); }
.hay-promo.is-locked { background: #FAFCFC; }
.hay-promo.is-locked .hay-promo__icon { background: #F0F4F4; color: #8A9A9C; }
.hay-promo__icon { flex: none; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: #FEF3DC; color: #B4730A; }
.hay-promo__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; font-size: 13px; line-height: 1.45; }
.hay-promo__name { font-size: 15px; font-weight: 600; color: var(--hay-ink); text-decoration: none; }
.hay-promo__name:hover { color: var(--hay-teal); }
.hay-promo__value { color: var(--hay-muted); }
.hay-promo.is-applied .hay-promo__value { color: #2F7A3E; font-weight: 600; }
.hay-promo__value p { margin: 0; }
.hay-promo__date { color: #8A9A9C; font-size: 12px; }
.hay-promo__date.is-soon { color: #B42318; font-weight: 600; }
.hay-promo__action { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.hay-promo__action .hay-btn { height: 36px; padding: 0 16px; font-size: 13px; }
.hay-promo__badge { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); white-space: nowrap; }
.hay-promo__badge.is-muted { background: #F0F4F4; color: #8A9A9C; }
.hay-promo__auto { font-size: 12px; color: var(--hay-muted); white-space: nowrap; }
.hay-promo-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; background: #fff; border: 1px dashed var(--hay-teal-pale); border-radius: 16px; text-align: center; font-size: 14px; color: var(--hay-muted); }
.hay-promo-empty b { color: var(--hay-ink); font-size: 15px; }
.hay-promo-empty .hay-promo__icon { margin-bottom: 4px; }

@media (max-width: 575px) {
  .hay-promo-modal__head, .hay-promo-modal__body, .hay-promo-modal__foot { padding-left: 16px; padding-right: 16px; }
  .hay-promo { flex-wrap: wrap; }
  .hay-promo__action { flex-direction: row; align-items: center; width: 100%; justify-content: flex-end; }
}

@media (max-width: 991px) {
  .hay-checkout .nth-checkout-main { grid-template-columns: 1fr; }
  .hay-checkout .box-cart-item { padding: 20px; }
}

/* ==========================================================================
   ĐĂNG NHẬP / ĐĂNG KÝ
   ========================================================================== */
.hay-auth { max-width: 1104px; padding-top: 48px; padding-bottom: 64px; }
.hay-auth__card { display: flex; flex-wrap: wrap; background: #fff; border: 1px solid var(--hay-line); border-radius: 24px; overflow: hidden; }
.hay-auth__intro { flex: 1 1 380px; background: var(--hay-teal); color: #fff; padding: 48px 44px; display: flex; flex-direction: column; gap: 24px; box-sizing: border-box; }
.hay-auth__intro img { display: block; height: 40px; width: auto; align-self: flex-start; }
.hay-auth__intro h2 { margin: 0; font-family: var(--hay-font-display); font-size: 28px; line-height: 1.3; font-weight: 600; color: #fff; }
.hay-auth__intro ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; font-size: 15px; color: #D4E6E8; }
.hay-auth__intro li { display: flex; gap: 12px; align-items: center; }
.hay-auth__form { flex: 1 1 420px; padding: 48px 44px; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; }
.hay-form { display: flex; flex-direction: column; gap: 18px; margin: 0; }
.hay-form__head { display: flex; flex-direction: column; gap: 6px; }
.hay-form__head h1 { margin: 0; font-family: var(--hay-font-display); font-size: 28px; font-weight: 600; color: var(--hay-teal); }
.hay-form__head p { margin: 0; font-size: 15px; color: var(--hay-muted); }
.hay-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 14px; }
.hay-field { display: flex; flex-direction: column; gap: 8px; font-size: 14px; font-weight: 600; margin: 0; color: var(--hay-ink); }
.hay-field input, .hay-field select, .hay-field textarea { height: 52px; border: 1.5px solid var(--hay-line); border-radius: 12px; padding: 0 16px; font: inherit; font-size: 16px; font-weight: 400; color: var(--hay-ink); background: #fff; width: 100%; box-sizing: border-box; }
.hay-field textarea { height: auto; min-height: 110px; padding: 12px 16px; resize: vertical; }
.hay-field input:focus, .hay-field select:focus, .hay-field textarea:focus { border-color: var(--hay-teal); outline: none; }
.hay-field .required { color: #B42318; font-weight: 600; }
.hay-field__pass { position: relative; display: block; }
.hay-field__pass input { padding-right: 48px; }
.hay-field__pass i { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--hay-muted); cursor: pointer; }
.hay-form__forgot { align-self: flex-end; font-size: 14px; font-weight: 600; text-decoration: none; margin-top: -8px; }
.hay-form .hay-btn { height: 52px; width: 100%; font-weight: 700; }
.hay-form__terms { margin: 0; font-size: 13px; line-height: 1.55; color: var(--hay-muted); }
.hay-check { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; margin: 0; cursor: pointer; }
.hay-check input { margin-top: 2px; flex: none; }
.hay-auth .spinner { display: none; }

/* ==========================================================================
   TÀI KHOẢN (layout + menu + đơn hàng)
   ========================================================================== */
.hay-account-layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; padding-top: 28px; padding-bottom: 64px; }
.hay-account-nav { flex: 1 1 260px; position: sticky; top: calc(var(--hay-header-h, 0px) + 16px); }
.hay-account-main { flex: 999 1 560px; min-width: 0; }
.hay-account-card { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; overflow: hidden; }
.hay-account-card__user { display: flex; align-items: center; gap: 14px; padding: 22px; background: var(--hay-teal-soft); }
.hay-account-card__avatar { flex: none; width: 52px; height: 52px; border-radius: 999px; background: var(--hay-teal); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; object-fit: cover; }
.hay-account-card__name { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.hay-account-card__name b { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hay-account-card__name span { font-size: 13px; color: var(--hay-muted); }
.hay-account-card__nav { display: flex; flex-direction: column; padding: 10px; }
.hay-account-card__nav a { display: flex; align-items: center; gap: 12px; height: 46px; padding: 0 14px; border-radius: 12px; color: var(--hay-ink); text-decoration: none; font-size: 15px; }
.hay-account-card__nav a svg { color: var(--hay-teal-mid); flex: none; }
.hay-account-card__nav a:hover { background: var(--hay-teal-soft); }
.hay-account-card__nav a.is-active { background: var(--hay-teal); color: #fff; font-weight: 600; }
.hay-account-card__nav a.is-active svg { color: #fff; }
.hay-account-card__nav a.is-muted { color: var(--hay-muted); }

.hay-account-page { display: flex; flex-direction: column; gap: 16px; }
.hay-account-page__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-segment { display: flex; gap: 4px; flex-wrap: wrap; background: #fff; border: 1px solid var(--hay-line); border-radius: 14px; padding: 6px; }
.hay-segment a { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 6px; height: 40px; padding: 0 16px; border-radius: 10px; color: var(--hay-ink); font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.hay-segment a:hover { background: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-segment a.list_cart_active { background: var(--hay-teal); color: #fff; }
.hay-segment .order-count-menu { font-size: 12px; font-weight: 700; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); display: inline-flex; align-items: center; justify-content: center; }
.hay-segment a.list_cart_active .order-count-menu { background: var(--hay-orange); color: var(--hay-ink); }

.hay-orders { display: flex; flex-direction: column; gap: 16px; }
.hay-order { background: #fff; border: 1px solid var(--hay-line); border-radius: 18px; overflow: hidden; }
.hay-order__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 14px 20px; border-bottom: 1px solid #E6EEEF; font-size: 14px; color: var(--hay-muted); }
.hay-order__head b { color: var(--hay-ink); }
.hay-status { font-size: 13px; font-weight: 600; padding: 4px 12px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-status.status-999 { background: #FDECEC; color: #B42318; }
.hay-order__body { display: flex; align-items: center; gap: 16px; padding: 16px 20px; }
.hay-order__icon { flex: none; width: 56px; height: 56px; border-radius: 12px; background: #EEF5F6; color: var(--hay-teal); display: flex; align-items: center; justify-content: center; }
.hay-order__info { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--hay-muted); }
.hay-order__info b { font-size: 15px; color: var(--hay-ink); }
.hay-order__foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 14px 20px; background: #FBFDFD; border-top: 1px solid #E6EEEF; font-size: 15px; }
.hay-order__foot b { font-size: 18px; color: var(--hay-teal); }
.hay-order__actions { display: flex; gap: 10px; }

/* Các trang tài khoản cũ còn lại: bọc nội dung thành thẻ */
.hay-account-main .box-order-account, .hay-account-main .account__info, .hay-account-main .box_account, .hay-account-main .order_detail .order-detail-info, .hay-account-main .order-detail-status { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; box-shadow: none; }
.hay-account-main .order_detail .order-detail-header { background: transparent; border: 0; padding: 0 0 12px; }
.hay-account-main .order-detail-header-identity-code { color: var(--hay-teal); font-weight: 700; }
.hay-account-main .progress-bar_order .is-complete::before, .hay-account-main .progress-bar_order .is-complete::after { background-color: var(--hay-teal) !important; border-color: var(--hay-teal) !important; }

/* Thông tin tài khoản / Đổi mật khẩu: đồng bộ thẻ, tab, ô nhập, nút theo thiết kế */
.hay-account-main .user_information { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; padding: 24px; }
.hay-account-main .user_information .tabs { left: auto; transform: none; min-width: 0; background: transparent; }
.hay-account-main .user_information .tabs ul { display: flex; flex-wrap: nowrap; gap: 4px; margin: 0; padding: 6px; background: var(--hay-teal-soft); border: 0; border-radius: 14px; }
.hay-account-main .user_information .tabs ul li { flex: 1 1 0; }
.hay-account-main .user_information .tabs ul li label { line-height: 40px; height: 40px; padding: 0 16px; border-radius: 10px; color: var(--hay-muted); font-size: 15px; font-weight: 600; background: transparent; }
.hay-account-main .user_information .tabs ul li label:hover { color: var(--hay-teal); }
.hay-account-main .user_information .tabs input[name=tab-control]:checked ~ .scroll-with-mobile > ul > li > label::before { content: none; display: none; }
.hay-account-main .user_information .tabs input[name=tab-control]:nth-of-type(1):checked ~ .scroll-with-mobile > ul > li:nth-child(1) > label,
.hay-account-main .user_information .tabs input[name=tab-control]:nth-of-type(2):checked ~ .scroll-with-mobile > ul > li:nth-child(2) > label { background: #fff; color: var(--hay-teal); box-shadow: 0 1px 3px rgba(16,40,44,.12); }
.hay-account-main .user_information .tabs .content { margin-top: 24px; }
.hay-account-main .user_information .checkbox-form.mt-32 { margin-top: 0; }
.hay-account-main .user_information .mt-20 { margin-top: 0 !important; }
.hay-account-main .user_information .mb-30 { margin-bottom: 0 !important; }
.hay-account-main .user_information .checkout-form-list { margin-bottom: 20px; }
.hay-account-main .user_information .checkout-form-list > label { display: block; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--hay-ink); }
.hay-account-main .user_information .required { color: #B42318 !important; font-style: normal; font-weight: 600; }
.hay-account-main .user_information .checkout-form-list input[type=text],
.hay-account-main .user_information .checkout-form-list input[type=password],
.hay-account-main .user_information .checkout-form-list input[type=email] { height: 52px; line-height: normal; padding: 0 16px; border: 1.5px solid var(--hay-line); border-radius: 12px; font-family: inherit; font-size: 16px; color: var(--hay-ink); background: #fff; box-sizing: border-box; }
.hay-account-main .user_information .checkout-form-list input:focus { border-color: var(--hay-teal); outline: none; }
.hay-account-main .user_information .checkout-form-list input:disabled { background: var(--hay-ground) !important; color: var(--hay-muted); cursor: not-allowed; }
.hay-account-main .user_information .checkout-form-list input::placeholder { color: #8A9A9C; opacity: 1; font-size: 15px; }
.hay-account-main .user_information .nice-select { float: none; width: 100%; height: 52px; line-height: 49px; padding-left: 16px; border: 1.5px solid var(--hay-line); border-radius: 12px; font-size: 16px; color: var(--hay-ink); background: #fff; }
.hay-account-main .user_information .nice-select.open, .hay-account-main .user_information .nice-select:focus { border-color: var(--hay-teal); }
.hay-account-main .user_information .nice-select:after { border-color: var(--hay-muted); right: 18px; }
.hay-account-main .user_information .nice-select .list { width: 100%; max-height: 280px; overflow-y: auto; border-radius: 12px; border: 1px solid var(--hay-line); box-shadow: 0 12px 30px rgba(16,40,44,.16); }
.hay-account-main .user_information .nice-select .option { line-height: 40px; min-height: 40px; }
.hay-account-main .user_information .nice-select .option.selected { color: var(--hay-teal); }
.hay-account-main .user_information .btn-Images { margin-top: 2px; }
.hay-account-main .user_information .btn-Images i { margin: 0 !important; }
.hay-account-main .user_information .avatar_user { width: 96px; height: 96px; border-radius: 999px; overflow: hidden; }
.hay-account-main .user_information .avatar_upload { border-radius: 999px; object-fit: cover; background: var(--hay-teal-soft); }
.hay-account-main .user_information .btn_save_address { text-align: left !important; margin-top: 4px; }
.hay-account-main .user_information label.error { color: #B42318; font-size: 13px; font-weight: 400; font-style: normal; }
@media (max-width: 575px) {
  .hay-account-main .user_information { padding: 16px; }
  .hay-account-main .user_information .tabs ul li label { font-size: 14px; padding: 0 10px; }
  .hay-account-main .user_information .btn_save_address .hay-btn { width: 100%; }
}

/* Đặt hàng thành công */
.hay-success { background: #fff; border: 1px solid var(--hay-line); border-radius: 24px; padding: 40px 40px 32px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; margin-bottom: 20px; }
.hay-success__icon { width: 88px; height: 88px; border-radius: 999px; background: var(--hay-teal-soft); color: var(--hay-teal); display: flex; align-items: center; justify-content: center; }
.hay-success__text { display: flex; flex-direction: column; gap: 10px; }
.hay-success__text h1 { margin: 0; font-family: var(--hay-font-display); font-size: 34px; font-weight: 600; color: var(--hay-teal); }
.hay-success__text p { margin: 0; font-size: 16px; line-height: 1.6; color: #33494C; }
.hay-success__text b { color: var(--hay-teal); }
.hay-success__tips { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; text-align: left; }
.hay-success__tips > div { display: flex; gap: 14px; align-items: flex-start; background: var(--hay-teal-soft); border-radius: 18px; padding: 18px 20px; font-size: 14px; line-height: 1.55; color: #33494C; }
.hay-success__tips > div.is-warm { background: #FDF5E6; }
.hay-success__tips svg { flex: none; }
.hay-success__tips b { color: var(--hay-ink); }
.hay-success__actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }

@media (max-width: 991px) {
  .hay-account-nav { position: static; flex-basis: 100%; }
  .hay-account-card__nav { flex-direction: row; overflow-x: auto; gap: 4px; }
  .hay-account-card__nav a { flex: none; }
}
@media (max-width: 720px) {
  .hay-auth { padding-top: 24px; }
  .hay-auth__intro, .hay-auth__form { padding: 28px 20px; }
  .hay-auth__intro ul { display: none; }
  .hay-success { padding: 28px 20px; }
  .hay-success__text h1 { font-size: 26px; }
}

/* ==========================================================================
   TRA CỨU ĐƠN HÀNG
   ========================================================================== */
.hay-narrow { max-width: 1184px; }
.hay-lookup { flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 14px; padding: 22px 24px; }
.hay-lookup .hay-field { flex: 1 1 260px; }
.hay-lookup .hay-field input { height: 48px; }
.hay-lookup .hay-btn { height: 48px; padding: 0 28px; }
.hay-lookup-result { background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; overflow: hidden; }
.hay-lookup-result .hay-order__head { padding: 18px 24px; font-size: 15px; }
.hay-lookup-result__body { display: flex; flex-wrap: wrap; }
.hay-lookup-result__col { flex: 1 1 360px; padding: 24px; display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.5; }
.hay-lookup-result__col + .hay-lookup-result__col { border-left: 1px solid #E6EEEF; }
.hay-lookup-result__col p { margin: 0; }
.hay-lookup-result__col .hay-pill { align-self: flex-start; }
.hay-lookup-result__total { border-top: 1px dashed var(--hay-teal-pale); padding-top: 10px; }
.hay-lookup-result__total b:last-child { font-size: 17px !important; }
.hay-lookup-result + .hay-lookup-result { margin-top: 16px; }

/* Hành trình đơn hàng (Tra cứu đơn / Chi tiết đơn của tôi) */
.hay-journey { list-style: none; margin: 4px 0 0; padding: 0; }
.hay-journey__step { position: relative; display: flex; gap: 14px; padding-bottom: 20px; }
.hay-journey__step:last-child { padding-bottom: 0; }
.hay-journey__step:not(:last-child)::before { content: ""; position: absolute; left: 14px; top: 30px; bottom: 0; width: 2px; background: var(--hay-teal); }
.hay-journey__step.is-current:not(:last-child)::before, .hay-journey__step.is-todo:not(:last-child)::before { background: var(--hay-line); }
.hay-journey__dot { flex: none; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--hay-teal); color: #fff; font-size: 13px; font-weight: 700; }
.hay-journey__step.is-current .hay-journey__dot { background: var(--hay-orange); color: var(--hay-ink); }
.hay-journey__step.is-todo .hay-journey__dot { background: var(--hay-teal-soft); color: var(--hay-muted); }
.hay-journey__step.is-cancel .hay-journey__dot { background: #FDECEC; color: #B42318; }
.hay-journey__text { display: flex; flex-direction: column; gap: 2px; padding-top: 4px; font-size: 14px; color: var(--hay-muted); }
.hay-journey__text b { color: var(--hay-ink); font-size: 15px; }
.hay-journey__step.is-todo .hay-journey__text b { color: var(--hay-muted); font-weight: 600; }
.hay-journey__step.is-cancel .hay-journey__text b { color: #B42318; }
.hay-journey__sep { border-top: 1px solid #E6EEEF; margin: 6px 0; }
.hay-journey__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.hay-journey__actions .hay-btn { flex: 1 1 180px; }

/* ==========================================================================
   HỆ THỐNG NHÀ THUỐC
   ========================================================================== */
.hay-stores { padding-top: 28px; gap: 20px; }
.hay-stores__filter { display: flex; gap: 12px; flex-wrap: wrap; background: #fff; border: 1px solid var(--hay-line); border-radius: 18px; padding: 14px; align-items: center; }
.hay-select { flex: 1 1 200px; height: 46px; border: 1.5px solid var(--hay-line); border-radius: 12px; padding: 0 12px; font: inherit; font-size: 15px; background: #fff; color: var(--hay-ink); }
.hay-stores__filter .nice-select { flex: 1 1 200px; float: none; height: 46px; line-height: 43px; border: 1.5px solid var(--hay-line); border-radius: 12px; font-size: 15px; }
.hay-stores__search { flex: 2 1 280px; border-radius: 12px; height: 46px; }
.hay-stores__filter .hay-btn { height: 46px; border-radius: 12px; }
.hay-stores__layout { display: flex; flex-wrap: wrap; gap: 20px; align-items: stretch; }
.hay-stores__list { flex: 1 1 400px; max-height: 680px; overflow-y: auto; padding-right: 4px; }
.hay-stores__list ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.hay-store { background: #fff; border: 2px solid var(--hay-line); border-radius: 16px; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.hay-store.is-active { border-color: var(--hay-teal); }
.hay-store__main { display: flex; flex-direction: column; gap: 4px; text-align: left; border: 0; background: none; padding: 0; font: inherit; color: var(--hay-ink); cursor: pointer; }
.hay-store__main b { font-size: 16px; }
.hay-store__main span { font-size: 14px; color: #33494C; }
.hay-store__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.hay-store__btn { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--hay-line); color: var(--hay-ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.hay-store__btn.is-soft { background: var(--hay-teal-soft); border-color: var(--hay-teal-soft); color: var(--hay-teal); }
.hay-store__btn:hover { border-color: var(--hay-teal); color: var(--hay-teal); }
.hay-stores__map { flex: 999 1 560px; min-height: 640px; position: relative; border-radius: 20px; overflow: hidden; background: #E3EEEF; border: 1px solid var(--hay-line); }
.hay-stores__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.hay-stores__map-tag { position: absolute; right: 14px; top: 14px; font-size: 12px; font-weight: 600; color: var(--hay-muted); background: #fff; padding: 4px 10px; border-radius: 999px; pointer-events: none; }

/* ==========================================================================
   TƯ VẤN DƯỢC SĨ
   ========================================================================== */
.hay-consult { padding-top: 28px; }
.hay-consult__hero { background: var(--hay-teal); color: #fff; border-radius: 24px; padding: 48px; display: flex; flex-direction: column; gap: 28px; }
.hay-consult__intro { display: flex; flex-direction: column; gap: 10px; max-width: 720px; }
.hay-consult__intro h1 { margin: 0; font-family: var(--hay-font-display); font-size: 40px; line-height: 1.2; font-weight: 600; color: #fff; }
.hay-consult__intro p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--hay-teal-pale); }
.hay-consult__channels { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 16px; }
.hay-consult__channel { display: flex; gap: 14px; align-items: center; background: #fff; color: var(--hay-ink); border-radius: 18px; padding: 20px; text-decoration: none; }
.hay-consult__channel:hover { color: var(--hay-ink); box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.hay-consult__channel .hay-tile__icon { width: 52px; height: 52px; }
.hay-consult__channel b { font-size: 16px; }
.hay-consult__steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 16px; }
.hay-consult__steps li { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--hay-line); border-radius: 18px; padding: 20px; font-size: 15px; line-height: 1.5; }
.hay-consult__steps li > span:first-child { flex: none; font-family: var(--hay-font-display); font-size: 28px; font-weight: 600; color: var(--hay-orange); line-height: 1; }
.hay-consult__layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; scroll-margin-top: 20px; }
.hay-consult__form { flex: 999 1 560px; min-width: 0; padding: 32px; border-radius: 22px; }
.hay-consult__who { border: 0; margin: 0; padding: 0; }
.hay-consult__who legend { padding: 0; margin-bottom: 10px; font-size: 14px; font-weight: 600; float: none; width: auto; }
.hay-consult__who .hay-chip { height: 42px; cursor: pointer; margin: 0; }
.hay-consult__who .hay-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hay-chip:has(input:checked) { border-color: var(--hay-teal); background: var(--hay-teal); color: #fff; }
.hay-chip:has(input:focus-visible) { outline: 3px solid var(--hay-orange); outline-offset: 2px; }
.hay-consult__aside { flex: 1 1 320px; display: flex; flex-direction: column; gap: 16px; }
.hay-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; font-size: 15px; }
.hay-checklist li { display: flex; gap: 10px; align-items: flex-start; }
.hay-checklist li::before { content: ""; flex: none; width: 18px; height: 10px; margin-top: 4px; border-left: 2.2px solid var(--hay-teal); border-bottom: 2.2px solid var(--hay-teal); transform: rotate(-45deg) scale(.8); }
.hay-consult__note { font-size: 14px; line-height: 1.55; align-items: flex-start; border-radius: 18px; padding: 18px 20px; }

/* ==========================================================================
   CHÍNH SÁCH
   ========================================================================== */
.hay-policy { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; margin-top: 20px; }
.hay-policy__nav { flex: 1 1 260px; background: #fff; border: 1px solid var(--hay-line); border-radius: 20px; padding: 12px; position: sticky; top: calc(var(--hay-header-h, 0px) + 16px); }
.hay-policy__nav nav { display: flex; flex-direction: column; }
.hay-policy__group { padding: 16px 14px 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--hay-teal-mid); }
.hay-policy__group:first-child { padding-top: 10px; }
.hay-policy__nav a { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 12px; color: var(--hay-ink); text-decoration: none; font-size: 15px; }
.hay-policy__nav a:hover { background: var(--hay-teal-soft); }
.hay-policy__nav a.is-active { background: var(--hay-teal); color: #fff; font-weight: 600; }
.hay-policy__content { flex: 999 1 560px; min-width: 0; background: #fff; border: 1px solid var(--hay-line); border-radius: 24px; padding: 40px 48px; box-sizing: border-box; display: flex; flex-direction: column; gap: 24px; }
.hay-policy__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-policy__head h1 { margin: 0; font-family: var(--hay-font-display); font-size: 34px; font-weight: 600; color: var(--hay-teal); line-height: 1.25; }
.hay-policy__pdf { width: 100%; height: 900px; max-height: 80vh; border: 1px solid var(--hay-line); border-radius: 14px; background: var(--hay-ground); }
.hay-policy__help { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; justify-content: space-between; background: var(--hay-teal-soft); border-radius: 18px; padding: 20px 24px; font-size: 15px; }
.hay-policy__help b { color: var(--hay-teal); }

/* ==========================================================================
   404
   ========================================================================== */
.hay-404 { max-width: 944px; padding-top: 72px; padding-bottom: 80px; display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; }
.hay-404__art { position: relative; width: 300px; height: 150px; }
.hay-404__art span { position: absolute; border-radius: 999px; }
.hay-404__art .a { left: 0; top: 30px; width: 120px; height: 120px; background: var(--hay-teal); }
.hay-404__art .b { left: 36px; top: 66px; width: 48px; height: 48px; background: var(--hay-ground); }
.hay-404__art .c { left: 132px; top: 0; width: 36px; height: 36px; background: var(--hay-orange); }
.hay-404__art .d { left: 180px; top: 30px; width: 120px; height: 120px; background: var(--hay-teal-pale); }
.hay-404__art .e { left: 216px; top: 66px; width: 48px; height: 48px; background: var(--hay-ground); }
.hay-404__code { font-family: var(--hay-font-display); font-size: 15px; font-weight: 600; letter-spacing: .2em; color: var(--hay-teal-mid); }
.hay-404 h1 { margin: 0; font-family: var(--hay-font-display); font-size: 40px; line-height: 1.2; font-weight: 600; color: var(--hay-teal); }
.hay-404 > p { margin: 0; font-size: 17px; line-height: 1.6; color: #33494C; max-width: 560px; }
.hay-404__search { width: 100%; max-width: 560px; height: 54px; }
.hay-404__input { flex: 1; min-width: 0; border: 0; outline: none; font: inherit; font-size: 16px; background: transparent; color: var(--hay-ink); }
.hay-404__search .icon-search { height: 44px; padding: 0 22px; }
.hay-chips--center { justify-content: center; }
.hay-404__actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

@media (max-width: 720px) {
  .hay-consult__hero { padding: 28px 20px; }
  .hay-consult__intro h1 { font-size: 28px; }
  .hay-consult__form { padding: 20px; }
  .hay-policy__nav { position: static; }
  .hay-policy__content { padding: 24px 18px; }
  .hay-policy__head h1 { font-size: 24px; }
  .hay-lookup-result__col + .hay-lookup-result__col { border-left: 0; border-top: 1px solid #E6EEEF; }
  .hay-stores__map { min-height: 380px; }
  .hay-404 { padding-top: 40px; }
  .hay-404 h1 { font-size: 28px; }
}

/* Gợi ý tìm kiếm (jQuery UI) nằm trên header bám dính */
.ui-autocomplete { z-index: 1100 !important; }
.ui-autocomplete.hay-ac { box-sizing: border-box; max-height: min(480px, 70vh); overflow-y: auto; overflow-x: hidden; padding: 8px; background: #fff; border: 1px solid var(--hay-line) !important; border-radius: 16px; box-shadow: 0 16px 40px rgba(16,40,44,.16); font-family: var(--hay-font-body); }
.hay-ac .ui-menu-item { display: block; }
.hay-ac .ui-menu-item + .ui-menu-item { margin-top: 2px; }
.hay-ac .hay-ac__item.ui-menu-item-wrapper { display: flex; align-items: center; gap: 14px; padding: 8px 10px; margin: 0; border: 0; border-radius: 12px; color: var(--hay-ink); background: transparent; text-decoration: none; }
.hay-ac .hay-ac__item.ui-state-active,
.hay-ac .hay-ac__item:hover { background: var(--hay-teal-soft); border: 0; margin: 0; color: var(--hay-ink); }
.hay-ac .hay-ac__thumb { flex: none; width: 56px; height: 56px; border-radius: 10px; border: 1px solid var(--hay-line); background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hay-ac .hay-ac__thumb img { width: 100%; height: 100%; object-fit: contain; padding: 4px; box-sizing: border-box; }
.hay-ac .hay-ac__icon { flex: none; width: 36px; height: 36px; border-radius: 10px; background: var(--hay-teal-soft); color: var(--hay-teal); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.hay-ac .hay-ac__item.ui-state-active .hay-ac__icon { background: #fff; }
.hay-ac .hay-ac__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.hay-ac .ui-menu-item-wrapper span { line-height: 1.35; }
.hay-ac .hay-ac__body .name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; font-weight: 500; color: var(--hay-ink); }
.hay-ac .hay-ac__body .name strong { font-weight: 700; color: var(--hay-teal); }
.hay-ac .hay-ac__meta { display: flex; align-items: baseline; gap: 4px; }
.hay-ac .hay-ac__meta:empty { display: none; }
.hay-ac .ui-menu-item-wrapper span.price { color: var(--hay-teal); font-size: 14px; font-weight: 700; }
.hay-ac .ui-menu-item-wrapper span.unit { color: var(--hay-muted); font-size: 13px; font-style: normal; }
.hay-ac .ui-menu-item-wrapper span.price + span.unit::before { content: "/ "; }

/* Nút "Xem thêm sản phẩm" (thay cho phân trang ở trang danh mục) */
.hay-loadmore { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 8px; }
.hay-loadmore .hay-btn { height: 48px; padding: 0 28px; font-size: 15px; }
.hay-loadmore .hay-btn.is-loading { opacity: .7; cursor: wait; }
.hay-loadmore .hay-muted { font-size: 13px; }

/* Thiết kế không có nút Yêu thích trên header (vẫn vào được từ menu Tài khoản) */
.hay-header__actions .hay-icon-btn { display: none; }

/* Ẩn thanh cuộn trong bộ lọc (vẫn cuộn được bằng chuột / cảm ứng) */
.hay-filter, .hay-filter * { scrollbar-width: none; -ms-overflow-style: none; }
.hay-filter::-webkit-scrollbar, .hay-filter *::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* Trang chi tiết: "Số lượng" một hàng, [Thêm vào giỏ hàng][Mua ngay] xuống hàng dưới như thiết kế.
   .hay-pdp__buy dùng display: contents để giữ nguyên thứ tự .product-quantity-form -> .cart-btn_detail_product cho main.js */
.hay-pdp__row--buy { row-gap: 0; }
.hay-pdp__row--buy .hay-pdp__buy { display: contents; }
.hay-pdp__row--buy .hay-pdp__label { order: 1; }
.hay-pdp__row--buy .hay-qty { order: 2; }
.hay-pdp__row--buy::after { content: ""; order: 3; flex-basis: 100%; height: 0; }
.hay-pdp__row--buy .hay-pdp__add { order: 4; flex: 1 1 220px; margin-top: 18px; }
.hay-pdp__row--buy .hay-pdp__buynow { order: 5; flex: 1 1 160px; height: 54px; margin-top: 18px; }
.hay-pdp__row--buy .hay-pdp__add + .hay-pdp__buynow { margin-left: -4px; } /* gap hàng ngang 16px -> 12px như thiết kế */

/* Ẩn nút Yêu thích ở trang chi tiết sản phẩm (giữ markup, bỏ dòng này để hiện lại) */
.hay-pdp__actions { display: none; }

/* ==========================================================================
   THANH TOÁN v2 — bám thiết kế: header rút gọn, sản phẩm nằm trong cột "Đơn hàng"
   (main.min.css có nhiều !important cho .nth-checkout-page nên selector ở đây dài hơn)
   ========================================================================== */
.hay-slim-header { background: #fff; border-bottom: 1px solid var(--hay-line); }
.hay-slim-header__inner { padding-top: 16px; padding-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hay-slim-header__logo { display: block; height: 40px; width: auto; }
.hay-slim-header__meta { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; font-size: 14px; color: var(--hay-muted); }
.hay-slim-header__meta span { display: flex; align-items: center; gap: 6px; }
.hay-slim-header__meta a { font-weight: 700; color: var(--hay-teal); text-decoration: none; }
.hay-slim-footer { background: #fff; border-top: 1px solid var(--hay-line); }
.hay-slim-footer__inner { padding-top: 18px; padding-bottom: 18px; display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between; font-size: 13px; color: var(--hay-muted); }
.hay-slim-footer__inner nav { display: flex; gap: 16px; flex-wrap: wrap; }
.hay-slim-footer__inner a { color: var(--hay-muted); text-decoration: none; }
.hay-slim-footer__inner a:hover { color: var(--hay-teal); }

section.nth-checkout-page.checkout-area.hay-checkout { background: transparent !important; padding: 24px 0 64px; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main { grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; }
/* Khối input ẩn + nút cũ: không chiếm chỗ (trước đây hiện thành dải trắng trống ở đầu cột trái) */
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12:has(.order-button-payment) { order: 99; grid-column: 1; }
section.nth-checkout-page.checkout-area.hay-checkout .order-button-payment,
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12:has(.order-button-payment) > .your-order { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout .messageAddress.hide { display: none; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12 { display: flex; flex-direction: column; gap: 16px; }

/* Thẻ nội dung cột trái */
section.nth-checkout-page.checkout-area.hay-checkout .box-cart-item { border: 1px solid var(--hay-line) !important; border-radius: 20px !important; background: #fff !important; padding: 24px 28px; gap: 16px; overflow: visible; }
section.nth-checkout-page.checkout-area.hay-checkout .box-cart-header { min-height: 0; padding: 0 !important; border: 0 !important; background: transparent; }
section.nth-checkout-page.checkout-area.hay-checkout .box-cart-header-title i { display: none; }
section.nth-checkout-page.checkout-area.hay-checkout .box-cart-header-title .cart-title-name { font-family: var(--hay-font-display); font-size: 20px !important; font-weight: 600 !important; color: var(--hay-teal) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .box-cart-body { padding: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .box-cart-body { padding-top: 0 !important; display: flex; flex-direction: column; gap: 16px; }

/* Ô nhập */
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 14px; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .full { grid-column: 1 / -1; }
section.nth-checkout-page.checkout-area.hay-checkout .hay-field-label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; color: var(--hay-ink); margin: 0; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-field { height: 46px !important; line-height: normal !important; padding: 0 14px !important; border: 1.5px solid var(--hay-line) !important; border-radius: 10px !important; font-size: 15px; color: var(--hay-ink); }
section.nth-checkout-page.checkout-area.hay-checkout .guest-field:focus { border-color: var(--hay-teal) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .nice-select.guest-field { line-height: 43px !important; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-field-note, section.nth-checkout-page.checkout-area.hay-checkout .nth-note-textarea { height: auto !important; min-height: 90px !important; line-height: 1.5 !important; padding: 12px 14px !important; border: 1.5px solid var(--hay-line) !important; border-radius: 10px !important; }

/* Hình thức nhận hàng -> thẻ radio có mô tả */
section.nth-checkout-page.checkout-area.hay-checkout .guest-receive-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px; margin: 0 !important; padding: 0 !important; border: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-method-tab { align-items: flex-start; height: auto; padding: 16px 18px; border: 2px solid var(--hay-line) !important; border-radius: 14px !important; background: #fff !important; color: var(--hay-ink) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-method-tab::before { margin-top: 2px; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-method-tab.active { border-color: var(--hay-teal) !important; background: #F5FAFA !important; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-receive-tabs .delivery-method-tab span { height: auto; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; background: transparent !important; color: inherit !important; border: 0 !important; padding: 0; font-weight: 400; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-method-tab b { font-size: 15px; font-weight: 700; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-method-tab small { font-size: 13px; line-height: 1.45; color: var(--hay-muted); }

/* Phương thức thanh toán */
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li label { min-height: 52px; padding: 14px 16px !important; border: 1.5px solid var(--hay-line) !important; border-radius: 12px !important; background: #fff !important; color: var(--hay-ink) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li label:hover,
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li label:has(input:checked),
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannelSeleted { border-color: var(--hay-teal) !important; background: #F5FAFA !important; }

/* Cột "Đơn hàng" */
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-sidebar { top: 16px; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-card { padding: 24px !important; border: 1px solid var(--hay-line) !important; border-radius: 20px !important; gap: 14px; }
.hay-summary-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hay-summary-head h2 { margin: 0; font-size: 17px; font-weight: 700; color: var(--hay-teal); font-family: inherit; }
.hay-summary-head a { font-size: 14px; font-weight: 600; color: var(--hay-teal); text-decoration: none; }
.hay-summary-sep { border-top: 1px solid #E6EEEF; margin: 2px 0; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-promo-link { min-height: 44px; border-radius: 12px; background: var(--hay-teal-soft) !important; color: var(--hay-teal) !important; font-size: 14px; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row { margin: 0; font-size: 15px; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row span:first-child { color: var(--hay-muted); }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row span:last-child { color: var(--hay-ink) !important; font-weight: 500; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-total { margin-top: 2px; padding-top: 14px; border-top: 1px dashed var(--hay-teal-pale) !important; align-items: baseline; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-total .total_bill { font-family: var(--hay-font-display); font-size: 26px !important; font-weight: 600 !important; color: var(--hay-teal) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-sidebar-submit.bd-fill__btn { height: 54px !important; line-height: 54px !important; border: 0 !important; border-radius: 999px !important; background: var(--hay-orange) !important; color: var(--hay-ink) !important; font-size: 16px; margin-top: 4px; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-sidebar-submit.bd-fill__btn:hover { background: #E09312 !important; color: var(--hay-ink) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-terms { font-size: 13px; line-height: 1.5; color: #33494C !important; text-align: left; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-terms a { color: var(--hay-teal) !important; text-decoration: underline; }
.hay-summary-note { margin: 0; font-size: 13px; line-height: 1.5; color: var(--hay-muted); text-align: center; }

/* Sản phẩm trong cột "Đơn hàng" (partial CheckProductOrderDetail) */
section.nth-checkout-page.checkout-area.hay-checkout .hay-summary-items { border: 0 !important; border-radius: 0 !important; max-height: 360px; overflow-y: auto; scrollbar-width: thin; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail > * { padding: 0; border: 0; border-radius: 0; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .list-item { display: flex; flex-direction: column; gap: 12px; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .nth-order-header { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; grid-template-areas: "img name name" "img qty total"; gap: 4px 12px; align-items: center; margin: 0 !important; padding: 0 24px 0 0 !important; border: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > * { width: auto; max-width: none; padding: 0; text-align: left !important; }
/* dòng tên nhà cung cấp */
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area:has(.cart-client-info) { display: block; padding: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .cart-client-info { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--hay-muted); }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .cart-logo-client img { width: 22px; height: 22px; border-radius: 999px; object-fit: contain; }
/* cột 1 (ảnh + tên) tách ra 2 ô lưới */
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > div:nth-child(1):not(.cart-client-info) { display: contents; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .image_product_cart { grid-area: img; align-self: start; width: 52px !important; height: 52px !important; flex: none !important; padding: 4px !important; border: 0 !important; border-radius: 10px !important; background: #EEF5F6 !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .image_product_cart a img { max-width: 44px !important; max-height: 44px !important; mix-blend-mode: multiply; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .cart-name-product { grid-area: name; font-size: 14px; font-weight: 500; line-height: 1.4; color: var(--hay-ink); }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product_name_cart_unit { font-size: 13px; color: var(--hay-muted); font-weight: 400; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product_box_cart_price { display: none; }
/* đơn giá: ẩn; số lượng / thành tiền xuống dòng 2; nút xóa góc phải */
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > div:nth-child(2) { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > div:nth-child(3) { grid-area: qty; display: block !important; justify-self: start; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > div:nth-child(4) { grid-area: total; display: block !important; font-size: 14px; font-weight: 700; text-align: right !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area > div:nth-child(5) { position: absolute; right: 0; top: 0; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .btn-Delete-cart { color: #8A9B9D; font-size: 13px; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .btn-Delete-cart:hover { color: #C0392B; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .total-p-save-price { font-size: 12px; font-weight: 400; color: var(--hay-muted); text-decoration: line-through; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .note_ordersdetail { grid-column: 1 / -1; font-size: 12px; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product_cart_quantity { justify-content: flex-start !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product-quantity-form { margin: 0 !important; height: 30px; border: 1.5px solid var(--hay-line); border-radius: 999px; overflow: hidden; background: #fff; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product-quantity-form a { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; font-size: 11px; color: var(--hay-teal); cursor: pointer; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .product-quantity-form input { width: 34px; height: 28px; border: 0; padding: 0; font-size: 13px; font-weight: 700; -moz-appearance: textfield; }

@media (max-width: 991px) {
  section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main { grid-template-columns: 1fr; }
  section.nth-checkout-page.checkout-area.hay-checkout .box-cart-item { padding: 20px; }
  section.nth-checkout-page.checkout-area.hay-checkout .hay-summary-items { max-height: none; }
}

/* Thanh toán: thứ tự như thiết kế — Người nhận / Hình thức nhận hàng -> Phương thức thanh toán -> Ghi chú & hóa đơn */
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12:has(#ListPayment) { order: 4; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12:has(#IsInvoice) { order: 5; }
section.nth-checkout-page.checkout-area.hay-checkout .col-lg-12:has(#ListPayment) .box-cart-item > div:nth-child(n+3) { display: none !important; }
/* Thẻ "Ghi chú & hóa đơn": checkbox nhỏ, không phải tiêu đề lớn */
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice .box-cart-item { gap: 14px; }
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice .box-cart-header-title { gap: 10px; }
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice .box-cart-header-title .cart-title-name { font-family: inherit; font-size: 14px !important; font-weight: 500 !important; color: var(--hay-ink) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice #IsInvoice { width: 18px; height: 18px; margin: 0; accent-color: var(--hay-teal); }
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice .infoTax-body,
section.nth-checkout-page.checkout-area.hay-checkout .hay-note-invoice .infoTax-no-body { background: var(--hay-ground); border-radius: 12px; padding: 12px 14px; text-align: left !important; font-size: 14px; }
/* Cột tóm tắt: ẩn 2 dòng thiết kế không có */
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row.voucher,
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row.saving { display: none; }
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-row.discount span:last-child { color: var(--hay-ink) !important; }

/* Thanh toán: thẻ "Hình thức vận chuyển" cũ (.nth-hidden) phải ẩn — rule display:flex ở trên đã đè mất */
section.nth-checkout-page.checkout-area.hay-checkout .nth-checkout-main > .col-lg-12.nth-hidden { display: none !important; }
/* Cột "Đơn hàng" bám theo khi cuộn (main.min.css ép position: static) */
section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-sidebar { position: sticky !important; top: 16px; align-self: start; }
section.nth-checkout-page.checkout-area.hay-checkout,
section.nth-checkout-page.checkout-area.hay-checkout .hay-container,
section.nth-checkout-page.checkout-area.hay-checkout #form-checkout { overflow: visible !important; }
/* Chọn tỉnh / quận / phường chiếm đủ ô lưới */
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .nice-select { width: 100% !important; float: none; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .nice-select .list { width: 100%; max-height: 280px; overflow-y: auto; }
@media (max-width: 991px) {
  section.nth-checkout-page.checkout-area.hay-checkout .nth-summary-sidebar { position: static !important; }
}

/* Thanh toán: ô địa chỉ có nhãn, Tỉnh / Quận / Phường trên 1 hàng */
section.nth-checkout-page.checkout-area.hay-checkout .hay-field-cap { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 500; color: var(--hay-ink); }
section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .guest-form-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .guest-form-grid .checkout-form-list.full:has(#GuestIdWard) { grid-column: auto; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-panel .guest-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .nice-select { height: 46px !important; line-height: 43px !important; padding-left: 14px !important; border: 1.5px solid var(--hay-line) !important; border-radius: 10px !important; font-size: 15px; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .nice-select.open,
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .nice-select:focus { border-color: var(--hay-teal) !important; }

/* Danh sách nhà thuốc (Nhận tại nhà thuốc) -> thẻ radio như thiết kế, không khung cuộn riêng */
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-list { display: flex; flex-direction: column; gap: 10px; max-height: none !important; overflow: visible !important; padding: 0 !important; border: 0 !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-item { display: flex !important; gap: 12px; align-items: flex-start; width: 100%; margin: 0 !important; padding: 14px 16px !important; text-align: left; border: 1.5px solid var(--hay-line) !important; border-radius: 12px !important; background: #fff !important; box-shadow: none !important; font: inherit; color: var(--hay-ink); cursor: pointer; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-item:hover { border-color: var(--hay-teal-pale) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-item.active { border-color: var(--hay-teal) !important; background: #F5FAFA !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-radio { flex: none; width: 18px; height: 18px; margin-top: 2px; border-radius: 999px; border: 2px solid var(--hay-teal) !important; background: #fff !important; box-sizing: border-box; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-item.active .delivery-pharmacy-radio { background: radial-gradient(circle, var(--hay-teal) 0 4px, #fff 5px) !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-radio::before,
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-radio::after { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-content { display: flex; flex-direction: column; gap: 2px; font-size: 14px; line-height: 1.45; }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-content strong { font-size: 14px; font-weight: 700; color: var(--hay-ink); }
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-content small,
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-content em { font-size: 14px; font-style: normal; color: var(--hay-muted); }

/* Phương thức thanh toán: nút tròn bên trái + tiêu đề + mô tả; bỏ icon và dấu tích xanh cũ */
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li { display: flex; flex-direction: column; gap: 10px; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li label { gap: 14px; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li label::before,
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannelSeleted::before { display: none !important; content: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li img { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li input[type=radio] { display: block !important; flex: none; appearance: none; -webkit-appearance: none; width: 20px; height: 20px; margin: 0 !important; border-radius: 999px; border: 2px solid var(--hay-teal); background: #fff; cursor: pointer; }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li input[type=radio]:checked { background: radial-gradient(circle, var(--hay-teal) 0 4px, #fff 5px); }
section.nth-checkout-page.checkout-area.hay-checkout .PaymentChannel li input[type=radio]:focus-visible { outline: 3px solid var(--hay-orange); outline-offset: 2px; }
.hay-pay-text { display: flex; flex-direction: column; gap: 2px; }
.hay-pay-text b { font-size: 15px; font-weight: 700; color: var(--hay-ink); }
.hay-pay-text small { font-size: 13px; font-weight: 400; color: var(--hay-muted); }
@media (max-width: 720px) {
  section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .guest-form-grid,
  section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-panel .guest-form-grid { grid-template-columns: 1fr; }
}

/* Thanh toán: chỉ chọn Tỉnh -> Phường/Xã (Quận/Huyện ẩn, tự gán theo phường); dùng select gốc thay nice-select */
section.nth-checkout-page.checkout-area.hay-checkout .hay-hidden-district { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .guest-form-grid,
section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-panel .guest-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
section.nth-checkout-page.checkout-area.hay-checkout .guest-form-grid .checkout-form-list.full:has(#GuestIdWard) { grid-column: auto; }
section.nth-checkout-page.checkout-area.hay-checkout select.guest-field { display: block !important; width: 100%; appearance: none; -webkit-appearance: none; padding-right: 40px !important; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2318454B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center !important; }
section.nth-checkout-page.checkout-area.hay-checkout select.guest-field:invalid,
section.nth-checkout-page.checkout-area.hay-checkout select.guest-field option[disabled] { color: var(--hay-muted); }
@media (max-width: 720px) {
  section.nth-checkout-page.checkout-area.hay-checkout .guest-checkout-card .guest-form-grid,
  section.nth-checkout-page.checkout-area.hay-checkout .delivery-pharmacy-panel .guest-form-grid { grid-template-columns: 1fr; }
}

/* Thanh toán: nice-select có thể bị main.js gắn lại sau khi đã gỡ -> luôn ẩn bản giả, chỉ dùng select gốc */
section.nth-checkout-page.checkout-area.hay-checkout select.guest-field + .nice-select,
section.nth-checkout-page.checkout-area.hay-checkout div.nice-select.guest-field { display: none !important; }

/* Trang chi tiết: "Xem nhà thuốc còn hàng" là link chữ như thiết kế (main.min.css biến nó thành nút viền xanh dương) */
.product-detail .hay-pdp__service .btn-find-product-shop.hay-linkbtn,
.hay-pdp__service .btn-find-product-shop.hay-linkbtn { display: inline; min-height: 0; height: auto; padding: 0; margin: 0; border: 0 !important; border-radius: 0; background: none !important; box-shadow: none; color: var(--hay-teal) !important; font: inherit; font-size: 14px; font-weight: 600; line-height: 1.5; text-decoration: none; cursor: pointer; }
.product-detail .hay-pdp__service .btn-find-product-shop.hay-linkbtn:hover,
.hay-pdp__service .btn-find-product-shop.hay-linkbtn:hover { background: none !important; color: var(--hay-teal) !important; text-decoration: underline; }
.hay-pdp__service .btn-find-product-shop.hay-linkbtn:focus-visible { outline: 3px solid var(--hay-orange); outline-offset: 2px; border-radius: 4px; }

/* Web B2C: ẩn phần nhà cung cấp của nền B2B (dòng tên NCC + ghi chú + xóa theo NCC, dòng tổng theo NCC) */
.hay-cart .hay-cart__client,
.hay-cart .hay-cart__client-foot { display: none !important; }
section.nth-checkout-page.checkout-area.hay-checkout #loadOrderDetail .row.cart-area:has(.cart-client-info) { display: none !important; }
/* Ô chọn sản phẩm trong giỏ: main.min.css ẩn (opacity 0) -> hiện lại như thiết kế */
.hay-cart #Cartproducts .cart-product-select,
.hay-cart #Cartproducts .cart-select-all { position: static !important; opacity: 1 !important; pointer-events: auto !important; flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--hay-teal); cursor: pointer; }

/* Đăng nhập OTP: bước đang ẩn (thuộc tính hidden bị .hay-form display:flex đè) */
.hay-form[hidden] { display: none; }
.hay-linkbtn:disabled { color: var(--hay-muted); cursor: default; text-decoration: none; }