/* ============================================================
   Storefront Fluent — polished RTL storefront
   Neutralizes legacy WebTheme floats / absolute / fixed header
   ============================================================ */

/* Lock the whole storefront to light palette — OS dark mode must not recolor UI */
html {
  color-scheme: light only;
}

body.store-fluent {
  font-family: var(--fluent-font) !important;
  font-feature-settings: "ss01" 1 !important;
  background: #F4F5F7 !important;
  color: var(--fluent-text);
  direction: rtl;
  color-scheme: light only;
  -webkit-font-smoothing: antialiased;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

/* Legacy theme sets `header { float:left }` — never let that break page content */
body.store-fluent main header,
body.store-fluent .store-main header,
body.store-fluent .store-info-hero {
  float: none !important;
  width: 100% !important;
  box-shadow: none;
}

body.store-fluent input,
body.store-fluent textarea,
body.store-fluent select,
body.store-fluent button {
  color-scheme: light;
}

body.store-fluent *,
body.store-fluent *::before,
body.store-fluent *::after {
  box-sizing: border-box;
}

body.store-fluent a {
  color: inherit;
  text-decoration: none;
}

/* ============================================================
   Storefront scrollbars — match Admin panel (thin, soft gray)
   ============================================================ */
html:has(body.store-fluent),
body.store-fluent,
body.store-fluent * {
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.28) transparent;
}

html:has(body.store-fluent)::-webkit-scrollbar,
body.store-fluent::-webkit-scrollbar,
body.store-fluent *::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

html:has(body.store-fluent)::-webkit-scrollbar-track,
body.store-fluent::-webkit-scrollbar-track,
body.store-fluent *::-webkit-scrollbar-track {
  background: transparent;
}

html:has(body.store-fluent)::-webkit-scrollbar-thumb,
body.store-fluent::-webkit-scrollbar-thumb,
body.store-fluent *::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.22);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

html:has(body.store-fluent)::-webkit-scrollbar-thumb:hover,
body.store-fluent::-webkit-scrollbar-thumb:hover,
body.store-fluent *::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.38);
  border: 2px solid transparent;
  background-clip: padding-box;
}

html:has(body.store-fluent)::-webkit-scrollbar-corner,
body.store-fluent::-webkit-scrollbar-corner,
body.store-fluent *::-webkit-scrollbar-corner {
  background: transparent;
}

/* Kill default black focus rings site-wide (buttons, inputs, links) */
body.store-fluent *:focus,
body.store-fluent *:focus-visible,
body.store-fluent *:active:focus {
  outline: none !important;
  outline-offset: 0 !important;
}

body.store-fluent button:focus,
body.store-fluent button:focus-visible,
body.store-fluent button:active,
body.store-fluent a:focus,
body.store-fluent a:focus-visible,
body.store-fluent .btn:focus,
body.store-fluent .btn:active:focus,
body.store-fluent .btn.focus,
body.store-fluent input:focus,
body.store-fluent select:focus,
body.store-fluent textarea:focus {
  outline: none !important;
  box-shadow: none !important;
}

body.store-fluent img {
  max-width: 100%;
}

/* Keep MDI icons on the icon font — never inherit page fonts */
body.store-fluent .mdi,
body.store-fluent .mdi::before,
body.store-fluent [class^="mdi-"]::before,
body.store-fluent [class*=" mdi-"]::before {
  font-family: "Material Design Icons" !important;
  font-weight: normal !important;
  font-style: normal !important;
  line-height: 1 !important;
  display: inline-block;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Kill bootstrap float helpers inside store chrome */
body.store-fluent .store-header .pull-right,
body.store-fluent .store-header .pull-left,
body.store-fluent .store-header .col-lg-8,
body.store-fluent .store-header .col-lg-4,
body.store-fluent .store-header .col-md-8,
body.store-fluent .store-header .col-md-4,
body.store-fluent .store-header .col-xs-12,
body.store-fluent .store-footer .col-12,
body.store-fluent .store-footer .col-lg-6,
body.store-fluent .store-footer .col-lg-4,
body.store-fluent .store-footer .pull-right,
body.store-fluent .store-footer .pull-left {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
}

.store-container {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 1.25rem;
}

/* ---------- Header ---------- */
body.store-fluent .header-main-page.store-header,
body.store-fluent .header-main-page.store-header.fixed {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  float: none !important;
  z-index: 1100 !important;
  background: #fff !important;
  border-bottom: 1px solid #E8E8EA;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  isolation: isolate;
}

.store-header-bar {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  grid-template-areas: "logo search actions";
  align-items: center;
  column-gap: 1.25rem;
  row-gap: 0.75rem;
  min-height: 64px;
  padding: 0.7rem 0;
  position: relative !important;
  z-index: 2;
}

.store-logo {
  grid-area: logo;
  display: inline-flex !important;
  align-items: center;
  justify-self: start;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: right !important;
  border: 0 !important;
  width: auto !important;
  max-width: 140px;
}

.store-logo img {
  height: 34px !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 140px !important;
  object-fit: contain;
  display: block;
}

.store-search {
  grid-area: search;
  width: 100% !important;
  max-width: 520px;
  margin: 0 auto !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  height: auto !important;
  justify-self: stretch;
  z-index: 40 !important;
  transform: none !important;
}

.store-search-field {
  display: flex !important;
  align-items: center;
  width: 100%;
  height: 42px;
  margin: 0;
  background: #F3F3F3 !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  overflow: hidden;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.store-search-field:focus-within {
  background: #fff !important;
  border-color: rgba(0, 120, 212, 0.45) !important;
  box-shadow: 0 0 0 3px rgba(0, 120, 212, 0.12);
}

.store-search .header-search-input,
body.store-fluent .store-search input {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 1rem !important;
  margin: 0 !important;
  font-size: 0.9rem !important;
  color: var(--fluent-text) !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  float: none !important;
}

.store-search .header-search-input::-webkit-search-decoration,
.store-search .header-search-input::-webkit-search-cancel-button,
.store-search .header-search-input::-webkit-search-results-button,
.store-search .header-search-input::-webkit-search-results-decoration {
  display: none !important;
  -webkit-appearance: none !important;
}

.store-search .header-search-input::placeholder {
  color: #8A8886;
  text-indent: 0 !important;
  opacity: 1 !important;
  transition: none !important;
}

.store-search .header-search-input:focus::placeholder,
.store-search .header-search-input:focus::-webkit-input-placeholder,
.store-search .header-search-input:focus::-moz-placeholder,
.store-search .header-search-input:focus:-ms-input-placeholder,
body.store-fluent .store-search input:focus::placeholder,
body.store-fluent .store-search input:focus::-webkit-input-placeholder,
body.store-fluent .store-search input:focus::-moz-placeholder,
body.store-fluent .store-search input:focus:-ms-input-placeholder,
body.store-fluent [placeholder]:focus::-webkit-input-placeholder {
  text-indent: 0 !important;
  color: #8A8886 !important;
  opacity: 1 !important;
  transition: none !important;
}

.store-search .btn-search {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 42px !important;
  border: 0 !important;
  background: transparent !important;
  color: #605E5C !important;
  font-size: 1.25rem !important;
  cursor: pointer;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  position: static !important;
  float: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.store-search-field:focus-within .btn-search,
.store-search .btn-search:hover {
  color: #0078D4 !important;
}

/* Live results panel — same pattern as admin search */
.store-search-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  left: 0;
  z-index: 1100;
  max-height: min(70vh, 520px);
  overflow: auto;
  background: #fff;
  border: 1px solid var(--fluent-border, #EDEBE9);
  border-radius: 12px;
  box-shadow: var(--fluent-shadow-3, 0 8px 24px rgba(15, 23, 42, 0.12));
  padding: 0.5rem 0;
  direction: rtl;
  text-align: right;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.28) transparent;
}

.store-search-panel::-webkit-scrollbar {
  width: 8px;
}

.store-search-panel::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.28);
  border-radius: 999px;
}

.store-search-status {
  padding: 0.85rem 1rem;
  color: var(--fluent-text-secondary, #605E5C);
  font-size: 0.86rem;
}

.store-search-group + .store-search-group {
  border-top: 1px solid #EDEBE9;
  margin-top: 0.25rem;
  padding-top: 0.25rem;
}

.store-search-group-title {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 1rem 0.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--fluent-text-secondary, #605E5C);
  letter-spacing: 0.01em;
}

.store-search-group-title .mdi {
  font-size: 1rem;
  color: #0078D4;
}

.store-search-item {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.55rem 1rem;
  text-decoration: none !important;
  color: var(--fluent-text, #323130) !important;
  transition: background 120ms ease;
}

.store-search-item:hover,
.store-search-item.is-active {
  background: rgba(0, 120, 212, 0.08);
}

.store-search-item-title {
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.35;
}

.store-search-item-sub {
  font-size: 0.78rem;
  color: var(--fluent-text-secondary, #605E5C);
  line-height: 1.3;
}

.store-actions,
body.store-fluent .store-header .header-left {
  grid-area: actions;
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 0.25rem;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  float: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  position: relative !important;
  justify-self: end;
  z-index: 5;
}

body.store-fluent .store-header .mini-cart-header,
body.store-fluent .store-header .btn-login,
body.store-fluent .store-header .store-action {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  position: relative !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1 !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: inherit !important;
}

body.store-fluent .store-header .mini-cart-header {
  width: auto !important;
  height: auto !important;
}

body.store-fluent .store-header .btn-login::before,
body.store-fluent .store-header .mini-cart-header::before {
  display: none !important;
  content: none !important;
}

body.store-fluent .store-header .mini-cart-header > a,
body.store-fluent .store-header .btn-login,
body.store-fluent .store-header .store-action {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 12px !important;
  color: #323130 !important;
  background: #F5F5F5 !important;
  border: 1px solid #EAEAEA !important;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
  overflow: visible !important;
  cursor: pointer;
  text-decoration: none !important;
  position: relative !important;
}

/* Soft tinted chips — higher specificity than mini-cart/btn-login base */
body.store-fluent .store-header a.store-action--cart,
body.store-fluent .store-header .mini-cart-header > a.store-action--cart {
  background: rgba(0, 120, 212, 0.1) !important;
  border-color: rgba(0, 120, 212, 0.2) !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header a.store-action--admin {
  background: rgba(16, 124, 16, 0.1) !important;
  border-color: rgba(16, 124, 16, 0.2) !important;
  color: #0B6A0B !important;
}

body.store-fluent .store-header .store-action--account,
body.store-fluent .store-header .btn-login.store-action--account {
  background: rgba(196, 109, 0, 0.11) !important;
  border-color: rgba(196, 109, 0, 0.22) !important;
  color: #B35C00 !important;
}

body.store-fluent .store-header .store-action-glyph {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

body.store-fluent .store-header .btn-login > .mdi,
body.store-fluent .store-header .store-action > .mdi,
body.store-fluent .store-header .mini-cart-header > a > .mdi,
body.store-fluent .store-header .store-action-glyph > .mdi {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: inherit !important;
  font-size: 1.4rem !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  pointer-events: none;
}

body.store-fluent .store-header .store-action--cart .store-action-glyph > .mdi,
body.store-fluent .store-header .mini-cart-header > a.store-action--cart .store-action-glyph > .mdi {
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-action--admin .store-action-glyph > .mdi {
  color: #0B6A0B !important;
}

body.store-fluent .store-header .store-action--account .store-action-glyph > .mdi,
body.store-fluent .store-header .btn-login.store-action--account .store-action-glyph > .mdi {
  color: #B35C00 !important;
}

body.store-fluent .store-header .mini-cart-header > a:hover,
body.store-fluent .store-header .btn-login:hover,
body.store-fluent .store-header .store-action:hover,
body.store-fluent .store-header .btn-login:focus-within {
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

body.store-fluent .store-header a.store-action--cart:hover,
body.store-fluent .store-header .mini-cart-header > a.store-action--cart:hover {
  background: rgba(0, 120, 212, 0.16) !important;
  border-color: rgba(0, 120, 212, 0.32) !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header a.store-action--admin:hover {
  background: rgba(16, 124, 16, 0.16) !important;
  border-color: rgba(16, 124, 16, 0.35) !important;
  color: #0B6A0B !important;
}

body.store-fluent .store-header .store-action--account:hover,
body.store-fluent .store-header .btn-login.store-action--account:hover,
body.store-fluent .store-header .btn-login.store-action--account:focus-within {
  background: rgba(196, 109, 0, 0.17) !important;
  border-color: rgba(196, 109, 0, 0.34) !important;
  color: #B35C00 !important;
}

body.store-fluent .store-header .mini-cart-header > a.store-action--cart:hover .store-action-glyph > .mdi,
body.store-fluent .store-header a.store-action--cart:hover .store-action-glyph > .mdi {
  color: #0078D4 !important;
}

body.store-fluent .store-header a.store-action--admin:hover .store-action-glyph > .mdi {
  color: #0B6A0B !important;
}

body.store-fluent .store-header .btn-login.store-action--account:hover .store-action-glyph > .mdi,
body.store-fluent .store-header .store-action--account:hover .store-action-glyph > .mdi {
  color: #B35C00 !important;
}

body.store-fluent .store-header .store-cart-badge {
  position: absolute !important;
  top: -5px !important;
  left: -5px !important;
  right: auto !important;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: #0078D4 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  text-align: center;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(0, 120, 212, 0.35);
  z-index: 2;
}

body.store-fluent .store-header .mdi {
  font-size: 1.28rem !important;
  line-height: 1 !important;
}

/* Hamburger: only mobile, never absolute over logo */
body.store-fluent .store-header .nav-btn {
  display: none !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  float: none !important;
  width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
}

body.store-fluent .store-header .nav-btn:hover {
  background: #F3F2F1;
  border-color: #E1DFDD;
}

body.store-fluent .store-header .nav-btn span.linee1,
body.store-fluent .store-header .nav-btn span.linee2,
body.store-fluent .store-header .nav-btn span.linee3 {
  position: static !important;
  right: auto !important;
  top: auto !important;
  width: 16px !important;
  height: 2px !important;
  background: #323130 !important;
  border-radius: 2px;
  display: block !important;
}

/* Desktop nav — never absolute / never overlap search */
.store-nav-wrap {
  border-top: 1px solid #F0F0F0;
  background: #fff;
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible;
  z-index: 1;
  clear: both;
}

body.store-fluent .store-header nav.main-menu,
body.store-fluent .store-header nav.main-menu.hidden-nav-main,
body.store-fluent .store-header nav.main-menu.NavFix,
body.store-fluent .store-header nav.main-menu.is-active {
  max-width: 1180px;
  margin: 0 auto !important;
  padding: 0 1.25rem !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  -webkit-transform: none !important;
  background: transparent !important;
  box-shadow: none !important;
  z-index: auto !important;
}

body.store-fluent .store-header nav.main-menu.hidden-nav-main,
body.store-fluent .store-header nav.main-menu[style*="display: none"] {
  display: block !important;
}

body.store-fluent .store-header ul.new-list-menu {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.1rem;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.35rem 0 !important;
  float: none !important;
  width: 100% !important;
}

body.store-fluent .store-header li.item-list-menu {
  float: none !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
}

body.store-fluent .store-header a.list-category.first {
  display: inline-flex !important;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem 0.8rem !important;
  margin: 0 !important;
  border-radius: 8px !important;
  font-family: var(--fluent-font) !important;
  font-size: 0.86rem !important;
  font-weight: 600 !important;
  color: #323130 !important;
  background: transparent !important;
  white-space: nowrap;
}

body.store-fluent .store-header a.list-category.first::before,
body.store-fluent .store-header a.list-category.first::after,
body.store-fluent .store-header li.category::before {
  display: none !important;
  content: none !important;
}

body.store-fluent .store-header a.list-category.first:hover {
  background: #F3F2F1 !important;
  color: #0078D4 !important;
}

/* Kill legacy teal (#1ca2bd) on storefront menus */
body.store-fluent .store-header .main-menu a,
body.store-fluent .store-header .list-category-menu-2,
body.store-fluent .store-header .list-menu-level-2 a,
body.store-fluent .store-header .list-category-megamenu-3,
body.store-fluent .sidebar a {
  --store-menu-accent: #0078D4;
}

body.store-fluent .main-menu ul.new-list-menu > li.item-list-menu > ul.list-menu-level-2 > li.active > a,
body.store-fluent .main-menu ul.new-list-menu > li.item-list-menu > ul.list-menu-level-2 > li.active > a.list-category-menu-2,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.active > .list-category-menu-2,
body.store-fluent .store-header .list-menu-level-2 a:hover,
body.store-fluent .store-header .list-category-megamenu-3:hover {
  color: #0078D4 !important;
}

body.store-fluent .store-header a.list-category.first .mdi,
body.store-fluent .store-header a.list-category.first .mdi.text-info,
body.store-fluent .store-header a.list-category.first i {
  color: #0078D4 !important;
  font-size: 1.05rem !important;
  line-height: 1 !important;
  font-style: normal !important;
}

/* Submenu — JS-controlled exclusive open (.is-open) */
body.store-fluent .store-header .list-menu-level-2 {
  display: none !important;
  position: absolute !important;
  top: 100% !important;
  right: 0 !important;
  left: auto !important;
  width: 240px !important;
  min-width: 220px !important;
  margin: 0 !important;
  padding: 0.35rem 0 !important;
  list-style: none !important;
  background: #fff !important;
  border: 1px solid var(--fluent-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--fluent-shadow-3) !important;
  z-index: 1400 !important;
  overflow: visible !important;
  float: none !important;
}

/* Hit-area bridge: closes the dead gap between trigger and panel */
body.store-fluent .store-header .list-menu-level-2::before {
  content: "";
  position: absolute;
  top: -12px;
  right: 0;
  left: 0;
  height: 12px;
  background: transparent;
}

body.store-fluent .store-header li.item-list-menu {
  position: relative !important;
}

/* Kill CSS hover/focus multi-open — only .is-open shows a menu */
body.store-fluent .store-header li.item-list-menu:hover > .list-menu-level-2,
body.store-fluent .store-header li.item-list-menu:focus-within > .list-menu-level-2 {
  display: none !important;
}

body.store-fluent .store-header li.item-list-menu.is-open > .list-menu-level-2 {
  display: block !important;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2 {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  line-height: 1.4 !important;
  /* Shared by nested submenu — match visible parent text (legacy * sets span to normal) */
  --store-menu-font-family: var(--fluent-font);
  --store-menu-font-size: 0.88rem;
  --store-menu-font-weight: 400;
  --store-menu-line-height: 1.4;
}

body.store-fluent .store-header .list-menu-level-2 .list-category-menu-2,
body.store-fluent .store-header .list-menu-level-3 .list-category-menu-3,
body.store-fluent .store-header .list-menu-level-3 a,
body.store-fluent .store-header .list-menu-level-4 .list-category-menu-4,
body.store-fluent .store-header .list-menu-level-4 a {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  width: 100% !important;
  padding: 0.7rem 0.95rem !important;
  margin: 0 !important;
  font-family: var(--store-menu-font-family, var(--fluent-font)) !important;
  font-size: var(--store-menu-font-size, 0.88rem) !important;
  font-weight: var(--store-menu-font-weight, 400) !important;
  line-height: var(--store-menu-line-height, 1.4) !important;
  letter-spacing: normal !important;
  font-style: normal !important;
  color: #323130 !important;
  background: transparent !important;
  text-decoration: none !important;
  white-space: nowrap;
  box-sizing: border-box !important;
}

/* Force inner text nodes' wrappers to follow the link (overrides style.css `* { font-weight:normal }`) */
body.store-fluent .store-header .list-menu-level-2 a > span,
body.store-fluent .store-header .list-menu-level-3 a > span,
body.store-fluent .store-header .list-menu-level-4 a > span {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  font-style: inherit !important;
}

/* Nested items keep the same tokens as their parent row */
body.store-fluent .store-header .list-menu-level-3 .item-menu-3 {
  --store-menu-font-family: inherit;
  --store-menu-font-size: inherit;
  --store-menu-font-weight: inherit;
  --store-menu-line-height: inherit;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2.active > .list-category-menu-2,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.active > a {
  color: #0078D4 !important;
  background: #F0F6FC !important;
}

body.store-fluent .store-header .list-menu-level-2 .list-category-menu-2 .mdi,
body.store-fluent .store-header .list-menu-level-2 .list-category-menu-2 .store-menu-more,
body.store-fluent .store-header .list-category-menu-3 .mdi,
body.store-fluent .store-header .list-category-menu-3 .store-menu-more,
body.store-fluent .store-header .list-category-menu-4 .mdi,
body.store-fluent .store-header .list-category-menu-4 .store-menu-more {
  color: #A19F9D !important;
  font-size: 1rem !important;
  margin: 0 !important;
  flex: 0 0 auto;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2.is-sub-open > .list-category-menu-2 {
  background: #F0F6FC !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2.is-sub-open > .list-category-menu-2 .store-menu-more {
  color: #0078D4 !important;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2:hover > .list-category-menu-2 {
  background: #F0F6FC !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header .list-menu-level-2 .item-menu-2:hover > .list-category-menu-2 .store-menu-more {
  color: #0078D4 !important;
}

/* Nested desktop submenus — same card as level-2; items open opposite parent row */
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.has-sub,
body.store-fluent .store-header .list-menu-level-3 .item-menu-3.has-sub {
  position: relative !important;
}

body.store-fluent .store-header .list-menu-level-3,
body.store-fluent .store-header .list-menu-level-4 {
  display: none !important;
  position: absolute !important;
  /* Offset panel padding so first item lines up with parent row */
  top: -0.35rem !important;
  bottom: auto !important;
  /* Flush to parent (overlap 1px borders so no visible gap) */
  right: calc(100% - 1px) !important;
  left: auto !important;
  width: 240px !important;
  min-width: 220px !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0.35rem 0 !important;
  list-style: none !important;
  background: #fff !important;
  border: 1px solid var(--fluent-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--fluent-shadow-3) !important;
  z-index: 1410 !important;
  overflow: visible !important;
  float: none !important;
  transform: none !important;
  box-sizing: border-box !important;
}

/* Open nested panel toward page center if near left edge */
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.has-sub.is-flip > .list-menu-level-3,
body.store-fluent .store-header .list-menu-level-3 .item-menu-3.has-sub.is-flip > .list-menu-level-4 {
  right: auto !important;
  left: calc(100% - 1px) !important;
}

body.store-fluent .store-header .list-menu-level-3::before,
body.store-fluent .store-header .list-menu-level-4::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -2px;
  width: 4px;
  background: transparent;
}

body.store-fluent .store-header .item-menu-2.has-sub.is-flip > .list-menu-level-3::before,
body.store-fluent .store-header .item-menu-3.has-sub.is-flip > .list-menu-level-4::before {
  right: auto;
  left: -2px;
}

/* Nested panels: kill legacy megamenu "li.active ul { display:flex }" which opens ALL nested levels */
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 li.active ul,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 li.active > ul,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 .item-menu-2.active ul,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 .item-menu-2.active .list-menu-level-3,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 .item-menu-2.active .list-menu-level-4,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2:hover > .list-menu-level-3,
body.store-fluent .store-header .list-menu-level-3 .item-menu-3:hover > .list-menu-level-4,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.has-sub:hover > ul.list-menu-level-3,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.active:hover > ul.list-menu-level-3 {
  display: none !important;
  flex-direction: unset !important;
}

/* Only the explicitly opened branch (.is-sub-open) may show its direct child panel */
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 li.is-sub-open > ul.list-menu-level-3,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 li.is-sub-open > .list-menu-level-3,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 li.active.is-sub-open > ul.list-menu-level-3,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 .item-menu-3.is-sub-open > ul.list-menu-level-4,
body.store-fluent .store-header .main-menu ul.new-list-menu li.item-list-menu ul.list-menu-level-2 .item-menu-3.is-sub-open > .list-menu-level-4,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.is-sub-open > .list-menu-level-3,
body.store-fluent .store-header .list-menu-level-3 .item-menu-3.is-sub-open > .list-menu-level-4,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.has-sub.is-sub-open > ul.list-menu-level-3,
body.store-fluent .store-header .list-menu-level-2 .item-menu-2.active.is-sub-open > ul.list-menu-level-3 {
  display: block !important;
  background: #fff !important;
  flex-direction: unset !important;
}

body.store-fluent .store-header .list-menu-level-3 .item-menu-3,
body.store-fluent .store-header .list-menu-level-4 .item-menu-4 {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  line-height: 1.4 !important;
}

body.store-fluent .store-header .list-category-menu-3:hover,
body.store-fluent .store-header .list-category-menu-4:hover,
body.store-fluent .store-header .item-menu-3.is-sub-open > .list-category-menu-3 {
  background: #F0F6FC !important;
  color: #0078D4 !important;
}

/* Legacy mega panel replaced by nested flyouts */
body.store-fluent .store-header .megamenu-level-3 {
  display: none !important;
}

body.store-fluent .store-header .dropdown-menu-login,
body.store-fluent .store-header .mini-cart-dropdown {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: auto !important;
  width: 268px !important;
  min-width: 268px !important;
  max-width: min(268px, calc(100vw - 24px)) !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 14px !important;
  border: 1px solid #E1DFDD !important;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12) !important;
  background: #fff !important;
  z-index: 1500 !important;
  overflow: visible !important;
  float: none !important;
  text-align: right !important;
  font-family: var(--fluent-font) !important;
  cursor: default !important;
}

body.store-fluent .store-header .dropdown-menu-login a,
body.store-fluent .store-header .mini-cart-dropdown a,
body.store-fluent .store-header .dropdown-menu-login button,
body.store-fluent .store-header .mini-cart-dropdown button {
  cursor: pointer !important;
}

body.store-fluent .store-header .dropdown-menu-login .store-flyout-head,
body.store-fluent .store-header .mini-cart-dropdown .store-flyout-head,
body.store-fluent .store-header .dropdown-menu-login .store-flyout-head *,
body.store-fluent .store-header .mini-cart-dropdown .store-flyout-head *:not(a),
body.store-fluent .store-header .dropdown-menu-login .store-account-menu,
body.store-fluent .store-header .mini-cart-dropdown .store-flyout-foot {
  cursor: default !important;
}

body.store-fluent .store-header .dropdown-menu-login::before,
body.store-fluent .store-header .mini-cart-dropdown::before {
  content: "";
  position: absolute;
  top: -12px;
  right: 0;
  left: 0;
  height: 12px;
  background: transparent;
}

/* Exclusive open via .is-open — never CSS hover multi-open */
body.store-fluent .store-header .btn-login:hover .dropdown-menu-login,
body.store-fluent .store-header .btn-login:focus-within .dropdown-menu-login,
body.store-fluent .store-header .mini-cart-header:hover .mini-cart-dropdown,
body.store-fluent .store-header .mini-cart-header:focus-within .mini-cart-dropdown {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

body.store-fluent .store-header .btn-login.is-open .dropdown-menu-login,
body.store-fluent .store-header .mini-cart-header.is-open .mini-cart-dropdown {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Keep account/cart flyouts above the search row on tablet/mobile */
body.store-fluent .store-header .btn-login.is-open,
body.store-fluent .store-header .mini-cart-header.is-open,
body.store-fluent .store-header .store-flyout-root.is-open {
  z-index: 30 !important;
}

/* Kill legacy floats / chevrons / scroll chrome inside flyouts */
body.store-fluent .store-header .dropdown-menu-login *,
body.store-fluent .store-header .mini-cart-dropdown * {
  float: none !important;
}

body.store-fluent .store-header .dropdown-menu-login a::before,
body.store-fluent .store-header .dropdown-menu-login a::after,
body.store-fluent .store-header .mini-cart-dropdown a::before,
body.store-fluent .store-header .mini-cart-dropdown a::after,
body.store-fluent .store-header .header-profile-dropdown-user-profile-link::before {
  content: none !important;
  display: none !important;
}

body.store-fluent .store-header .store-flyout-head {
  display: flex !important;
  align-items: center;
  gap: 0.6rem;
  padding: 0.75rem 0.85rem !important;
  background: linear-gradient(180deg, #F8FAFC 0%, #fff 100%) !important;
  border-bottom: 1px solid #F0F0F0 !important;
  border-radius: 14px 14px 0 0 !important;
}

body.store-fluent .store-header .store-flyout-head--account {
  gap: 0.55rem;
}

body.store-fluent .store-header .store-flyout-head-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
  flex: 1 1 auto;
}

body.store-fluent .store-header .store-flyout-kicker {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #605E5C !important;
  letter-spacing: 0.01em;
  line-height: 1.3 !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-flyout-kicker,
body.store-fluent .store-header .dropdown-menu-login .store-flyout-kicker {
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-flyout-title {
  display: block;
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1B1B1B !important;
  line-height: 1.35 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.store-fluent .store-header .store-flyout-head-icon {
  font-size: 1.1rem !important;
  color: #0078D4 !important;
  line-height: 1 !important;
}

body.store-fluent .store-header .store-flyout-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #EBF3FC !important;
  color: #0078D4 !important;
  flex-shrink: 0;
}

body.store-fluent .store-header .store-flyout-avatar .mdi {
  font-size: 1rem !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-account-menu {
  display: flex;
  flex-direction: column;
  padding: 0.3rem !important;
  gap: 0.1rem;
}

body.store-fluent .store-header .store-account-link {
  display: flex !important;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.6rem !important;
  border-radius: 8px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #323130 !important;
  text-decoration: none !important;
  background: transparent !important;
  white-space: nowrap !important;
  line-height: 1.3 !important;
}

body.store-fluent .store-header .store-account-link > .mdi:first-child {
  font-size: 1rem !important;
  color: #0078D4 !important;
  line-height: 1 !important;
}

body.store-fluent .store-header .store-account-link > span {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
}

/* Legacy theme forces .btn-login span { font-size: 25px } — kill it in flyouts */
body.store-fluent .store-header .btn-login > span,
body.store-fluent .store-header .dropdown-menu-login span,
body.store-fluent .store-header .dropdown-menu-login strong,
body.store-fluent .store-header .mini-cart-dropdown span,
body.store-fluent .store-header .mini-cart-dropdown strong,
body.store-fluent .store-header .mini-cart-dropdown p {
  font-size: inherit !important;
}

body.store-fluent .store-header .dropdown-menu-login .store-flyout-kicker,
body.store-fluent .store-header .mini-cart-dropdown .store-flyout-kicker {
  font-size: 12px !important;
}

body.store-fluent .store-header .dropdown-menu-login .store-flyout-title,
body.store-fluent .store-header .mini-cart-dropdown .store-flyout-title {
  font-size: 14px !important;
  font-weight: 650 !important;
}

body.store-fluent .store-header .dropdown-menu-login .store-account-link,
body.store-fluent .store-header .dropdown-menu-login a.store-account-link {
  font-size: 12.5px !important;
  font-weight: 500 !important;
}

body.store-fluent .store-header .dropdown-menu-login .store-account-link span {
  font-size: 12.5px !important;
  font-weight: 500 !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-flyout-cta,
body.store-fluent .store-header .mini-cart-dropdown a.store-flyout-cta {
  font-size: 12.5px !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-cart-empty-title {
  font-size: 13px !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-cart-empty-desc {
  font-size: 11.5px !important;
}

body.store-fluent .store-header .store-account-chevron {
  font-size: 0.9rem !important;
  color: #A19F9D !important;
  margin-right: auto;
}

body.store-fluent .store-header .store-account-link:hover {
  background: #F0F6FC !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-account-link:hover > .mdi:first-child,
body.store-fluent .store-header .store-account-link:hover .store-account-chevron {
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-account-link--danger {
  color: #A4262C !important;
}

body.store-fluent .store-header .store-account-link--danger > .mdi:first-child {
  color: #A4262C !important;
}

body.store-fluent .store-header .store-account-link--danger:hover {
  background: #FDE7E9 !important;
  color: #A4262C !important;
}

body.store-fluent .store-header .store-account-link--danger:hover > .mdi:first-child,
body.store-fluent .store-header .store-account-link--danger:hover .store-account-chevron {
  color: #A4262C !important;
}

body.store-fluent .store-header .store-cart-body {
  padding: 0.85rem 1rem 0.35rem !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

body.store-fluent .store-header .store-cart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
  padding: 0.85rem 0.5rem 1rem !important;
}

body.store-fluent .store-header .store-cart-empty-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #F0F6FC !important;
  margin-bottom: 0.2rem;
}

body.store-fluent .store-header .store-cart-empty-icon .mdi {
  font-size: 1.3rem !important;
  color: #0078D4 !important;
}

body.store-fluent .store-header .store-cart-empty-title {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #323130 !important;
}

body.store-fluent .store-header .store-cart-empty-desc {
  margin: 0 !important;
  font-size: 11.5px !important;
  line-height: 1.55 !important;
  color: #605E5C !important;
  max-width: 210px;
}

body.store-fluent .store-header .store-cart-list:empty,
body.store-fluent .store-header .store-cart-list[hidden] {
  display: none !important;
}

body.store-fluent .store-header .store-cart-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 0.55rem !important;
  max-height: 280px;
  overflow-y: auto;
}

body.store-fluent .store-header .store-mini-item {
  margin: 0 !important;
  padding: 0 !important;
}

body.store-fluent .store-header .store-mini-link {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  gap: 0.65rem !important;
  align-items: center !important;
  padding: 0.45rem !important;
  border: 1px solid #EDEBE9 !important;
  border-radius: 10px !important;
  background: #FAFBFC !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: border-color 160ms ease, background 160ms ease;
}

body.store-fluent .store-header .store-mini-link:hover {
  border-color: rgba(0, 120, 212, 0.35) !important;
  background: #fff !important;
}

body.store-fluent .store-header .store-mini-img {
  width: 52px !important;
  height: 52px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  background: #fff !important;
  display: block !important;
}

body.store-fluent .store-header .store-mini-meta {
  display: grid !important;
  gap: 0.25rem !important;
  min-width: 0 !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-mini-title,
body.store-fluent .store-header .mini-cart-dropdown span.store-mini-title {
  font-size: 12px !important;
  font-weight: 650 !important;
  color: #1B1B1B !important;
  line-height: 1.35 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.store-fluent .store-header .mini-cart-dropdown .store-mini-row,
body.store-fluent .store-header .mini-cart-dropdown span.store-mini-row {
  display: flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  flex-wrap: wrap !important;
  font-size: 11px !important;
  color: #605E5C !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-mini-row strong,
body.store-fluent .store-header .mini-cart-dropdown span.store-mini-row strong {
  margin-right: auto !important;
  color: #0078D4 !important;
  font-weight: 700 !important;
  font-size: 12px !important;
}

body.store-fluent .store-header .mini-cart-dropdown .store-mini-row strong small {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #8A8886 !important;
}

body.store-fluent .store-header .store-mini-swatch {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  display: inline-block;
  flex-shrink: 0;
}

body.store-fluent .store-header .store-flyout-foot {
  padding: 0.7rem 0.85rem 0.9rem !important;
  border-top: 1px solid #F0F0F0 !important;
  background: #FAFAFA !important;
  border-radius: 0 0 14px 14px !important;
}

body.store-fluent .store-header .store-flyout-cta {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  width: 100% !important;
  padding: 0.55rem 0.75rem !important;
  border-radius: 9px !important;
  background: #0078D4 !important;
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: 0 !important;
  transition: background 160ms ease;
}

body.store-fluent .store-header .store-flyout-cta .mdi {
  font-size: 1.05rem !important;
  color: #fff !important;
}

body.store-fluent .store-header .store-flyout-cta:hover {
  background: #106EBE !important;
  color: #fff !important;
}

/* Legacy cart chrome — neutralize leftover markup if any */
body.store-fluent .store-header .mini-cart-dropdown .wrapper,
body.store-fluent .store-header .mini-cart-dropdown .scrollbar,
body.store-fluent .store-header .mini-cart-dropdown .force-overflow,
body.store-fluent .store-header .mini-cart-dropdown .header-cart-info-header,
body.store-fluent .store-header .mini-cart-dropdown .header-cart-info-footer {
  all: unset;
  display: contents;
}

body.store-fluent .store-header .mini-cart-dropdown .scrollbar,
body.store-fluent .store-header .mini-cart-dropdown #style-1 {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

/* Off-canvas responsive menu — closed by default, never steal layout */
body.store-fluent .sidebar {
  position: fixed !important;
  top: 0 !important;
  right: -280px !important;
  left: auto !important;
  width: 280px !important;
  max-width: 86vw !important;
  height: 100% !important;
  z-index: 1300 !important;
  background: #fff !important;
  transform: none !important;
  visibility: hidden;
  pointer-events: none;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  transition: right 220ms ease, visibility 220ms ease;
}

body.store-fluent .sidebar.open {
  right: 0 !important;
  visibility: visible;
  pointer-events: auto;
  box-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);
}

@media (min-width: 992px) {
  body.store-fluent .sidebar,
  body.store-fluent .sidebar.open {
    right: -300px !important;
    visibility: hidden !important;
    pointer-events: none !important;
    display: block !important;
  }

  body.store-fluent .overlay,
  body.store-fluent .overlay.active,
  body.store-fluent .overlay.show {
    display: none !important;
  }
}

body.store-fluent .sidebar .nav-categories,
body.store-fluent .sidebar .ul-base {
  display: block !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.75rem 0.85rem 1.75rem !important;
  width: 100% !important;
  float: none !important;
}

body.store-fluent .sidebar .nav-categories > li,
body.store-fluent .sidebar .ul-base > li,
body.store-fluent .sidebar li.has-sub {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 0.35rem !important;
  padding: 0 !important;
  font-family: var(--fluent-font);
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.4;
}

body.store-fluent .sidebar .store-side-parent-row {
  display: flex;
  align-items: stretch;
  gap: 0.4rem;
  width: 100%;
}

body.store-fluent .sidebar .store-side-parent-row > a.list-category.first {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
}

body.store-fluent .sidebar .store-side-expand {
  flex: 0 0 44px;
  width: 44px;
  border: 1px solid #E6E8EC;
  border-radius: 12px;
  background: #F7F8FA;
  color: #605E5C;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

body.store-fluent .sidebar .store-side-expand .mdi {
  font-size: 1.25rem;
  line-height: 1;
  transition: transform 180ms ease;
}

body.store-fluent .sidebar .store-side-parent.open > .store-side-parent-row .store-side-expand {
  background: #F0F6FC;
  border-color: rgba(0, 120, 212, 0.28);
  color: #0078D4;
}

body.store-fluent .sidebar .store-side-parent.open > .store-side-parent-row .store-side-expand .mdi {
  transform: rotate(180deg);
}

body.store-fluent .sidebar .nav-categories > li > a,
body.store-fluent .sidebar .list-category.first,
body.store-fluent .sidebar li > a {
  display: flex !important;
  align-items: center;
  gap: 0.75rem;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0.85rem 0.95rem !important;
  border-radius: 12px !important;
  font-family: var(--fluent-font) !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  color: #323130 !important;
  background: #F7F8FA !important;
  border: 1px solid #ECEEF2 !important;
  float: none !important;
  box-sizing: border-box !important;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}

body.store-fluent .sidebar .nav-categories > li > a .mdi,
body.store-fluent .sidebar .list-category.first .mdi,
body.store-fluent .sidebar li > a .mdi {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
  font-size: 1.15rem !important;
  line-height: 1 !important;
  flex: 0 0 34px;
}

body.store-fluent .sidebar .nav-categories > li > a:hover,
body.store-fluent .sidebar .nav-categories > li > a:focus,
body.store-fluent .sidebar .list-category.first:hover,
body.store-fluent .sidebar li > a:hover,
body.store-fluent .sidebar li.open > a,
body.store-fluent .sidebar .store-side-parent.open > .store-side-parent-row > a {
  background: #F0F6FC !important;
  border-color: rgba(0, 120, 212, 0.28) !important;
  color: #0078D4 !important;
  width: 100% !important;
}

body.store-fluent .sidebar ul ul {
  list-style: none !important;
  margin: 0.4rem 0 0.55rem !important;
  padding: 0.4rem !important;
  background: #FAFBFC !important;
  border-radius: 12px !important;
  border: 1px solid #EEEFEF;
  display: none;
}

body.store-fluent .sidebar li.open > ul,
body.store-fluent .sidebar .store-side-parent.open > ul {
  display: block !important;
}

body.store-fluent .sidebar ul ul a {
  margin: 0.15rem 0 !important;
  padding: 0.65rem 0.8rem !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  border-radius: 10px !important;
  background: #fff !important;
  width: 100% !important;
}

body.store-fluent .sidebar ul ul a .mdi {
  width: auto;
  height: auto;
  background: transparent;
  font-size: 1rem !important;
}

body.store-fluent .sidebar .nav-header {
  height: auto !important;
  padding: 1.15rem 1.1rem 0.9rem !important;
  border-bottom: 1px solid #EEEFEF;
  background: #fff;
}

body.store-fluent .sidebar .nav-header .logo-wrap {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: right !important;
}

body.store-fluent .sidebar .nav-header .logo-wrap img {
  width: auto !important;
  max-width: 132px !important;
  height: 34px !important;
  object-fit: contain;
}

body.store-fluent .sidebar .header-cover {
  pointer-events: none;
  display: none !important;
}

body.store-fluent .overlay {
  z-index: 1250 !important;
  display: none;
  background: rgba(15, 23, 42, 0.42) !important;
}

body.store-fluent .overlay.active,
body.store-fluent .overlay.show {
  display: block;
}

@media (max-width: 991.98px) {
  .store-header-bar {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "logo actions"
      "search search";
    column-gap: 0.5rem;
    row-gap: 0.65rem;
    min-height: 0;
    padding: 0.65rem 0 0.75rem;
  }

  .store-logo {
    max-width: 120px;
  }

  .store-logo img {
    height: 30px !important;
    max-width: 120px !important;
  }

  .store-search {
    max-width: none;
    z-index: 40 !important;
  }

  .store-actions,
  body.store-fluent .store-header .header-left {
    z-index: 6;
  }

  body.store-fluent .store-header .dropdown-menu-login,
  body.store-fluent .store-header .mini-cart-dropdown {
    z-index: 40 !important;
  }

  .store-search-field {
    height: 40px;
    border-radius: 10px !important;
  }

  .store-search .header-search-input,
  body.store-fluent .store-search input,
  .store-search .btn-search {
    height: 40px !important;
  }

  body.store-fluent .store-header .nav-btn {
    display: inline-flex !important;
  }

  .store-nav-wrap,
  body.store-fluent .store-header nav.main-menu,
  body.store-fluent .store-header nav.main-menu.hidden-nav-main,
  body.store-fluent .store-header nav.main-menu.NavFix {
    display: none !important;
  }
}

@media (max-width: 575.98px) {
  .store-container {
    padding: 0 1rem;
  }

  body.store-fluent .store-header .mini-cart-header > a,
  body.store-fluent .store-header .btn-login,
  body.store-fluent .store-header .store-action,
  body.store-fluent .store-header .nav-btn {
    width: 38px !important;
    height: 38px !important;
  }
}

/* ---------- Main ---------- */
.store-main {
  padding: 1.35rem 0 2.75rem !important;
  position: relative !important;
  top: auto !important;
  width: 100% !important;
  display: block !important;
  float: none !important;
}

.store-section {
  margin-bottom: 1.6rem;
}

.store-section-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.9rem;
  text-align: right;
}

.store-section-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: #1B1B1B;
  text-align: right;
  width: auto;
  flex: 1 1 auto;
}

.store-section-link {
  font-size: 0.84rem;
  font-weight: 600;
  color: #0078D4 !important;
  white-space: nowrap;
}

.store-section-link:hover {
  color: #106EBE !important;
  text-decoration: underline;
}

/* ---------- Hero ---------- */
.store-hero {
  margin-bottom: 1.35rem;
}

.store-hero .carousel {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.07);
  background: #ECEDEF;
}

.store-hero .carousel-inner {
  border-radius: 14px;
}

.store-hero .carousel-item {
  aspect-ratio: 21 / 9;
  min-height: 280px;
  max-height: 480px;
  background: #ECEDEF;
}

.store-hero .carousel-item.active {
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.store-hero .carousel-item img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.store-hero .carousel-indicators {
  bottom: 0.85rem;
  margin-bottom: 0;
}

.store-hero .carousel-indicators li {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.55) !important;
  border: 0 !important;
  opacity: 1 !important;
  margin: 0 3px !important;
  text-indent: -999px !important;
  transition: width 180ms ease, background 180ms ease;
}

.store-hero .carousel-indicators li.active {
  width: 22px !important;
  background: #fff !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25) !important;
}

.store-hero .carousel-control-prev,
.store-hero .carousel-control-next {
  width: 40px;
  height: 40px;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  opacity: 1;
  background: rgba(255, 255, 255, 0.92);
  color: #1B1B1B;
  border-radius: 50%;
  margin: 0 0.85rem;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
}

.store-hero .carousel-control-prev .mdi,
.store-hero .carousel-control-next .mdi {
  font-size: 1.3rem;
}

@media (max-width: 767.98px) {
  .store-hero .carousel {
    border-radius: 12px;
  }

  .store-hero .carousel-item {
    aspect-ratio: 16 / 10;
  }

  .store-hero .carousel-control-prev,
  .store-hero .carousel-control-next {
    display: none;
  }
}

/* ---------- Categories ---------- */
.store-categories {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0.85rem 0.65rem;
  align-items: start;
}

.store-category-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  padding: 0.35rem 0.2rem 0.15rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  text-align: center;
  text-decoration: none !important;
  color: inherit;
  transition: transform 180ms ease, color 180ms ease;
}

.store-category-tile:hover,
.store-category-tile:focus-visible {
  transform: translateY(-3px);
  color: #0078D4;
  outline: none;
}

.store-category-media {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1;
  max-width: 104px;
  margin-inline: auto;
  padding: 0.35rem;
  border-radius: 22px;
  background:
    linear-gradient(160deg, #ffffff 0%, #f4f6f8 100%);
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 8px 20px rgba(15, 23, 42, 0.06);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.store-category-tile:hover .store-category-media,
.store-category-tile:focus-visible .store-category-media {
  border-color: rgba(0, 120, 212, 0.28);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 12px 26px rgba(0, 120, 212, 0.12);
}

.store-category-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
  background: #eef1f4;
  display: block;
  transition: transform 220ms ease;
}

.store-category-tile:hover .store-category-media img,
.store-category-tile:focus-visible .store-category-media img {
  transform: scale(1.04);
}

.store-category-tile span,
.store-category-name {
  font-family: var(--fluent-font);
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.35;
  color: #252423;
  text-align: center;
  width: 100%;
  max-width: 7.5rem;
  margin-inline: auto;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 180ms ease;
}

.store-category-tile:hover .store-category-name,
.store-category-tile:focus-visible .store-category-name {
  color: #0078D4;
}

@media (max-width: 1199.98px) {
  .store-categories {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .store-categories {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem 0.55rem;
  }

  .store-category-media {
    max-width: 96px;
    border-radius: 20px;
  }
}

@media (max-width: 575.98px) {
  .store-categories {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem 0.4rem;
  }

  .store-category-media {
    max-width: 86px;
    padding: 0.28rem;
    border-radius: 18px;
  }

  .store-category-media img {
    border-radius: 14px;
  }

  .store-category-name {
    font-size: 0.78rem;
  }
}

/* ---------- Product rail ---------- */
.store-rail {
  background: #fff;
  border: 1px solid #EAEAEA;
  border-radius: 14px;
  padding: 1rem 1rem 1.1rem;
}

.store-rail--accent {
  background:
    linear-gradient(180deg, rgba(0, 120, 212, 0.06) 0%, #fff 42%);
  border-color: rgba(0, 120, 212, 0.18);
}

.store-rail-toolbar {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

.store-rail-toolbar .store-section-head {
  margin: 0;
  min-width: 0;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.store-rail-toolbar .store-section-title {
  text-align: right;
}

.store-rail-nav {
  display: inline-flex;
  gap: 0.35rem;
  flex-shrink: 0;
}

.store-rail-btn {
  width: 34px;
  height: 34px;
  border: 1px solid #E1DFDD;
  border-radius: 9px;
  background: #FAFAFA;
  color: #323130;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, opacity 160ms ease;
}

.store-rail-btn:hover:not(:disabled) {
  background: #F0F6FC;
  border-color: rgba(0, 120, 212, 0.35);
  color: #0078D4;
}

.store-rail-btn:focus,
.store-rail-btn:focus-visible,
.store-rail-btn:active {
  outline: none !important;
  box-shadow: none !important;
  border-color: #E1DFDD !important;
}

.store-rail-btn:hover:not(:disabled):focus,
.store-rail-btn:hover:not(:disabled):active {
  border-color: rgba(0, 120, 212, 0.35) !important;
}

.store-rail-btn:disabled,
.store-rail-btn[aria-disabled="true"] {
  opacity: 0.42;
  cursor: not-allowed !important;
  background: #F3F2F1 !important;
  color: #A19F9D !important;
  border-color: #EDEBE9 !important;
  pointer-events: auto;
}

.store-rail-track {
  display: flex;
  gap: 0.8rem;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0.1rem 0.05rem 0.4rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.18) transparent;
  justify-content: flex-start;
}

.store-rail-track::-webkit-scrollbar {
  height: 5px;
}

.store-rail-track::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18);
  border-radius: 999px;
}

.store-product-card {
  flex: 0 0 220px;
  width: 220px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #E8E8EA;
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.store-product-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 120, 212, 0.28);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.1);
  color: inherit;
}

.store-product-card:focus-visible {
  outline: 2px solid rgba(0, 120, 212, 0.55);
  outline-offset: 2px;
}

.store-product-media {
  position: relative;
  aspect-ratio: 1 / 1;
  background:
    radial-gradient(120% 80% at 50% 0%, #F8FAFC 0%, #F3F4F6 55%, #EEF0F3 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.85rem;
  overflow: hidden;
}

.store-product-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 280ms ease;
  pointer-events: none;
}

.store-product-card:hover .store-product-media img {
  transform: scale(1.04);
}

.store-product-badge {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  z-index: 1;
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: #D13438;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 4px 12px rgba(209, 52, 56, 0.28);
}

.store-product-body {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  padding: 0.85rem 0.9rem 1rem;
  flex: 1 1 auto;
  text-align: right;
}

.store-product-title {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.55;
  color: #1B1B1B;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.7em;
  text-align: right;
  width: 100%;
}

.store-product-price {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  text-align: right;
}

.store-product-price-main {
  font-size: 1rem;
  font-weight: 800;
  color: #111827;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.store-product-price-main small {
  font-size: 0.72rem;
  font-weight: 650;
  color: #605E5C;
  margin-right: 0.2rem;
}

.store-product-price-old {
  font-size: 0.74rem;
  color: #A19F9D;
  text-decoration: line-through;
}

.store-product-price-total {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
  width: 100%;
  margin-top: 0.15rem;
  padding: 0.5rem 0.65rem;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.1) 0%, rgba(0, 120, 212, 0.04) 100%);
  border: 1px solid rgba(0, 120, 212, 0.16);
  color: #0B5A9E;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
  animation: storeProductTotalIn 220ms ease;
}

.store-product-price-total[hidden] {
  display: none !important;
  animation: none;
}

.store-product-price-total-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  flex: 0 0 auto;
  font-size: 0.72rem;
  font-weight: 700;
  color: #0078D4;
  white-space: nowrap;
}

.store-product-price-total-label .mdi {
  font-size: 0.95rem;
  line-height: 1;
}

.store-product-price-total .js-product-total-value {
  flex: 1 1 auto;
  min-width: 0;
  text-align: center !important;
  font-size: 0.95rem;
  font-weight: 800;
  color: #0F172A;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.store-product-price-total-unit {
  flex: 0 0 auto;
  font-size: 0.68rem;
  font-weight: 650;
  color: #605E5C;
  white-space: nowrap;
}

@keyframes storeProductTotalIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.store-product-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.45rem;
  margin-top: 0.15rem;
}

.store-product-qty {
  display: inline-flex;
  align-items: center;
  width: 100%;
  border: 1px solid #E1DFDD;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

.store-product-qty-btn {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  border: 0;
  background: #F5F5F5;
  color: #323130;
  font-size: 1.1rem;
  font-weight: 700;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  transition: background 140ms ease, color 140ms ease;
}

.store-product-qty-btn:hover {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
}

.store-product-qty-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  color: #A19F9D;
  background: #F3F2F1;
}

.store-product-qty .js-product-qty {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  height: 36px;
  border: 0;
  border-inline: 1px solid #E1DFDD;
  padding: 0 0.25rem;
  font-family: inherit;
  font-weight: 700;
  font-size: 0.9rem;
  text-align: center !important;
  direction: ltr !important;
  background: #fff;
  color: #1B1B1B;
  -moz-appearance: textfield;
}

.store-product-qty .js-product-qty::-webkit-outer-spin-button,
.store-product-qty .js-product-qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.store-product-qty .js-product-qty:focus {
  outline: none;
  background: rgba(0, 120, 212, 0.04);
}

.store-product-cta {
  margin-top: 0.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  width: 100%;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: transparent;
  color: #0078D4 !important;
  font-size: 0.82rem;
  font-weight: 700;
  border: 1px solid rgba(0, 120, 212, 0.35);
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
  pointer-events: none;
}

.store-product-card:hover .store-product-cta {
  background: #0078D4;
  border-color: #0078D4;
  color: #fff !important;
}

@media (max-width: 575.98px) {
  .store-product-card {
    flex-basis: 176px;
    width: 176px;
    border-radius: 14px;
  }

  .store-product-body {
    padding: 0.7rem 0.7rem 0.85rem;
    gap: 0.45rem;
  }

  .store-product-title {
    font-size: 0.82rem;
    min-height: 2.5em;
  }

  .store-product-price-main {
    font-size: 0.92rem;
  }

  .store-product-qty-btn,
  .store-product-qty .js-product-qty {
    height: 34px;
  }

  .store-product-qty-btn {
    flex-basis: 32px;
    width: 32px;
  }

  .store-rail {
    padding: 0.85rem 0.75rem 0.95rem;
    border-radius: 12px;
  }

  .store-section-title {
    font-size: 1.05rem;
  }
}

/* ---------- Promo ---------- */
.store-promo {
  display: block;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #EAEAEA;
  background: #fff;
}

.store-promo img {
  width: 100%;
  height: auto;
  max-height: 280px;
  object-fit: cover;
  display: block;
}

/* ---------- Footer ---------- */
body.store-fluent footer.store-footer,
.store-footer {
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 1.5rem 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  position: relative !important;
  line-height: 1.6 !important;
  overflow: visible !important;
  text-align: right !important;
  color: var(--fluent-text);
  font-family: var(--fluent-font);
}

.store-footer-top {
  background: linear-gradient(180deg, #F0F4F8 0%, #F7F9FC 55%, #EEF2F7 100%);
  padding: 0.5rem 0 1.75rem;
  text-align: right;
  float: none;
  overflow: visible;
  width: 100%;
}

.store-footer .store-container {
  float: none !important;
  width: 100% !important;
  max-width: var(--store-container-max, 1180px);
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: right;
}

.store-footer-jump {
  display: flex;
  justify-content: center;
  padding: 0.85rem 0 1.1rem;
}

.store-footer-jump a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.42rem 1.1rem;
  border-radius: 999px;
  background: #E3EFFA;
  border: 0;
  font-size: 0.82rem;
  font-weight: 650;
  color: #1B4F8A;
  text-decoration: none;
  transition: background 160ms ease, color 160ms ease;
}

.store-footer-jump a:hover {
  background: #D0E6F8;
  color: #0078D4;
}

.store-footer-jump .mdi {
  font-size: 1.05rem;
}

.store-footer-badges {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  padding: 0 0 1.25rem;
}

.store-footer-badge-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  text-align: center;
  padding: 1.15rem 0.7rem 1.05rem;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 10px rgba(15, 35, 70, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.9);
}

.store-footer-badge-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}

.store-footer-badge-icon .mdi {
  font-size: 1.55rem;
}

.store-footer-badge-icon--blue {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
}

.store-footer-badge-icon--green {
  background: rgba(16, 124, 16, 0.12);
  color: #107C10;
}

.store-footer-badge-icon--purple {
  background: rgba(136, 84, 208, 0.12);
  color: #8764B8;
}

.store-footer-badge-card strong {
  font-size: 0.86rem;
  font-weight: 700;
  color: #1B1B1B;
  line-height: 1.45;
}

.store-footer-badge-card > span:last-child {
  font-size: 0.75rem;
  font-weight: 500;
  color: #8A8886;
  line-height: 1.45;
}

.store-footer-mid {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 1rem;
  align-items: stretch;
}

.store-footer-guide,
.store-footer-news {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(15, 35, 70, 0.06);
  padding: 1.25rem 1.35rem;
}

.store-footer-guide-title {
  margin: 0 0 0.85rem;
  font-size: 1rem;
  font-weight: 750;
  color: #1B1B1B;
}

.store-footer-guide-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.store-footer-guide-list li + li {
  border-top: 1px solid #F0F2F5;
}

.store-footer-guide-list a {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.72rem 0.15rem;
  font-size: 0.88rem;
  font-weight: 550;
  color: #323130;
  text-decoration: none;
  transition: color 160ms ease;
}

.store-footer-guide-list a:hover {
  color: #0078D4;
}

.store-footer-guide-ico {
  color: #0078D4;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.store-footer-guide-list a span {
  flex: 1 1 auto;
}

.store-footer-guide-chevron {
  color: #C8C6C4;
  font-size: 1.15rem;
  flex-shrink: 0;
}

.store-footer-news {
  display: block;
}

.store-footer-news-art {
  display: none !important;
}

.store-footer-news-body {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
}

.store-footer-news-label {
  display: block;
  font-size: 0.9rem;
  font-weight: 650;
  color: #252423;
  margin-bottom: 0.75rem;
  line-height: 1.55;
}

.store-footer-news-form {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
  align-items: stretch;
}

.store-footer-news-input-wrap {
  flex: 1 1 auto;
  position: relative;
  min-width: 0;
}

.store-footer-news-input-wrap .mdi {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: #A19F9D;
  font-size: 1.15rem;
  pointer-events: none;
}

.store-footer-news-form .input-footer {
  width: 100%;
  border: 1px solid #E1DFDD;
  border-radius: 12px;
  padding: 0.65rem 2.4rem 0.65rem 0.85rem;
  background: #F8F9FA;
  outline: none;
  font-size: 0.86rem;
  font-family: inherit;
  color: #1B1B1B;
}

.store-footer-news-form .input-footer:focus {
  border-color: #0078D4;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0, 120, 212, 0.12);
}

.store-footer-news-form .btn-footer-post {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 0;
  border-radius: 12px;
  background: #0078D4;
  color: #fff;
  font-weight: 650;
  font-size: 0.88rem;
  font-family: inherit;
  padding: 0.65rem 1.15rem;
  cursor: pointer;
  white-space: nowrap;
  transition: background 160ms ease;
}

.store-footer-news-form .btn-footer-post:hover {
  background: #106EBE;
}

.store-footer-news-form .btn-footer-post .mdi {
  font-size: 1rem;
}

.store-footer-news-social-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 0.85rem;
}

.store-footer-news-social-label {
  font-size: 0.84rem;
  font-weight: 600;
  color: #605E5C;
}

.store-footer-social {
  display: flex;
  gap: 0.5rem;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  float: none !important;
}

.store-footer-social a {
  width: 38px !important;
  height: 38px !important;
  border-radius: 11px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  border: 1px solid #E6E8EC !important;
  background: #F5F6F8 !important;
  color: #605E5C !important;
  box-shadow: none !important;
  transition: transform 160ms ease, background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.store-footer-social a:hover {
  transform: translateY(-1px);
  opacity: 1 !important;
  filter: none !important;
}

.store-footer-social a .fa,
.store-footer-social a .mdi {
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1 !important;
}

.store-footer-social--telegram {
  background: rgba(42, 171, 238, 0.1) !important;
  border-color: rgba(42, 171, 238, 0.22) !important;
  color: #1A8BB8 !important;
}

.store-footer-social--telegram:hover {
  background: rgba(42, 171, 238, 0.16) !important;
  color: #147BA5 !important;
}

.store-footer-social--instagram {
  background: rgba(193, 53, 132, 0.08) !important;
  border-color: rgba(193, 53, 132, 0.18) !important;
  color: #B83280 !important;
}

.store-footer-social--instagram:hover {
  background: rgba(193, 53, 132, 0.14) !important;
  color: #9B2A6C !important;
}

.store-footer-bottom {
  background:
    linear-gradient(180deg, rgba(0, 120, 212, 0.045) 0%, transparent 42%),
    #F7F8FA;
  color: #323130;
  padding: 2.15rem 0 0;
  float: none;
  width: 100%;
  overflow: visible;
  text-align: right;
  border-top: 1px solid #E6E8EC;
}

.store-footer-bottom-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr 0.9fr 0.95fr;
  gap: 1.35rem;
  padding-bottom: 1.65rem;
  align-items: start;
}

.store-footer-brand,
.store-footer-col {
  background: #fff;
  border: 1px solid #ECEEF2;
  border-radius: 18px;
  padding: 1.25rem 1.2rem 1.3rem;
  box-shadow: 0 2px 10px rgba(15, 35, 70, 0.035);
  min-height: 100%;
}

.store-footer-brand-mark {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin-bottom: 1.1rem;
}

.store-footer-brand-logo {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: linear-gradient(145deg, #E8F4FC 0%, #D6EBFA 100%);
  color: #0078D4 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid rgba(0, 120, 212, 0.12);
}

.store-footer-brand-logo .mdi,
.store-footer-brand-logo .mdi::before {
  font-family: "Material Design Icons" !important;
  font-size: 1.55rem !important;
  line-height: 1 !important;
  color: #0078D4 !important;
  display: inline-block;
}

.store-footer-brand-text {
  min-width: 0;
  flex: 1 1 auto;
}

.store-footer-brand-title {
  margin: 0.15rem 0 0.4rem;
  font-size: 1.12rem;
  font-weight: 750;
  color: #1B1B1B;
  letter-spacing: -0.01em;
}

.store-footer-brand-desc {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.75;
  color: #605E5C;
}

.store-footer-brand-social {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.store-footer-brand-social a {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  text-decoration: none !important;
  border: 1px solid #E6E8EC !important;
  background: #F5F6F8 !important;
  color: #605E5C !important;
  box-shadow: none !important;
  transition: transform 160ms ease, background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.store-footer-brand-social a:hover {
  transform: translateY(-1px);
  filter: none !important;
  box-shadow: none !important;
}

.store-footer-brand-social a .fa,
.store-footer-brand-social a .mdi,
.store-footer-brand-social a .mdi::before {
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1 !important;
}

.store-footer-brand-social--telegram {
  background: rgba(42, 171, 238, 0.1) !important;
  border-color: rgba(42, 171, 238, 0.22) !important;
  color: #1A8BB8 !important;
}

.store-footer-brand-social--telegram:hover {
  background: rgba(42, 171, 238, 0.16) !important;
  color: #147BA5 !important;
}

.store-footer-brand-social--instagram {
  background: rgba(193, 53, 132, 0.08) !important;
  border-color: rgba(193, 53, 132, 0.18) !important;
  color: #B83280 !important;
}

.store-footer-brand-social--instagram:hover {
  background: rgba(193, 53, 132, 0.14) !important;
  color: #9B2A6C !important;
}

.store-footer-brand-social--whatsapp {
  background: rgba(37, 211, 102, 0.1) !important;
  border-color: rgba(37, 211, 102, 0.22) !important;
  color: #1FA855 !important;
}

.store-footer-brand-social--whatsapp:hover {
  background: rgba(37, 211, 102, 0.16) !important;
  color: #178A45 !important;
}

.store-footer-brand-social--web {
  background: rgba(0, 120, 212, 0.1) !important;
  border-color: rgba(0, 120, 212, 0.2) !important;
  color: #0078D4 !important;
}

.store-footer-brand-social--web:hover {
  background: rgba(0, 120, 212, 0.16) !important;
  color: #106EBE !important;
}

body.store-fluent .store-footer-social a .fa,
body.store-fluent .store-footer-brand-social a .fa {
  font-family: FontAwesome !important;
  color: inherit !important;
}

body.store-fluent .store-footer-brand-logo .mdi::before {
  content: "\F00EC";
}

.store-footer-col-title {
  margin: 0 0 0.95rem;
  font-size: 0.92rem;
  font-weight: 750;
  color: #1B1B1B;
  position: relative;
  padding-bottom: 0.55rem;
}

.store-footer-col-title::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 3px;
  border-radius: 999px;
  background: #0078D4;
}

.store-footer-col-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.store-footer-col-list li {
  margin-bottom: 0.55rem;
  font-size: 0.86rem;
  line-height: 1.55;
  color: #605E5C;
}

.store-footer-col-list li:last-child {
  margin-bottom: 0;
}

.store-footer-col-list a {
  color: #323130;
  text-decoration: none;
  transition: color 160ms ease;
}

.store-footer-col-list a:hover {
  color: #0078D4;
}

.store-footer-col-list--contact li,
.store-footer-col-list--support li {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.55rem 0.6rem;
  border-radius: 12px;
  background: #F8F9FB;
  border: 1px solid #F0F2F5;
  margin-bottom: 0.45rem;
}

.store-footer-col-ico {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
}

.store-footer-col-ico .mdi {
  font-size: 1.05rem;
  line-height: 1;
}

.store-footer-col-ico--soft {
  background: #EEF6FC;
}

.store-footer-col-list--links a {
  display: flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.42rem 0.15rem;
  font-weight: 550;
  border-radius: 8px;
  transition: color 160ms ease, background 160ms ease, padding-right 160ms ease;
}

.store-footer-col-list--links a:hover {
  color: #0078D4;
  background: rgba(0, 120, 212, 0.06);
  padding-right: 0.35rem;
}

.store-footer-col-list--links .mdi {
  color: #0078D4;
  font-size: 1.05rem;
  opacity: 0.75;
}

.store-footer-enamad {
  margin-top: 0.95rem;
  padding-top: 0.85rem;
  border-top: 1px dashed #E6E8EC;
}

.store-footer-enamad img {
  width: 72px;
  height: auto;
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  border: 1px solid #ECEEF2;
  box-shadow: 0 2px 8px rgba(15, 35, 70, 0.05);
  cursor: pointer;
}

.store-footer-copy {
  border-top: 1px solid #E6E8EC;
  padding: 1.05rem 0 1.35rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem 1.25rem;
  font-size: 0.78rem;
  color: #8A8886;
  line-height: 1.7;
}

.store-footer-copy-version {
  flex-shrink: 0;
  color: #A19F9D;
  background: #EEF0F3;
  border-radius: 999px;
  padding: 0.2rem 0.7rem;
  font-size: 0.74rem;
  font-weight: 600;
}

.store-footer-copy-text {
  margin: 0;
  flex: 1 1 auto;
  text-align: left;
}

.store-footer-copy a {
  color: #0078D4;
  font-weight: 650;
  text-decoration: none;
}

.store-footer-copy a:hover {
  color: #106EBE;
  text-decoration: underline;
}

.store-footer-copy-heart {
  color: #E81123;
  font-size: 0.9rem;
  vertical-align: middle;
  margin-right: 0.15rem;
}

@media (max-width: 991.98px) {
  .store-footer-badges {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .store-footer-mid {
    grid-template-columns: 1fr;
  }

  .store-footer-bottom-grid {
    grid-template-columns: 1fr 1fr;
  }

  .store-footer-brand {
    grid-column: 1 / -1;
  }

  .store-footer-news-form {
    flex-direction: column;
  }

  .store-footer-news-form .btn-footer-post {
    width: 100%;
    justify-content: center;
  }

  .store-footer-copy {
    flex-direction: column;
    align-items: flex-start;
  }

  .store-footer-copy-text {
    text-align: right;
  }
}

@media (max-width: 575.98px) {
  .store-footer-badges {
    grid-template-columns: 1fr;
  }

  .store-footer-bottom-grid {
    grid-template-columns: 1fr;
  }

  .store-footer-news {
    text-align: center;
  }

  .store-footer-news-social-row {
    justify-content: center;
  }

  .store-footer-brand-desc {
    max-width: none;
  }
}

/* Soften leftover legacy widgets if any remain — scoped, never global .card-header */
body.store-fluent .widget.widget-product.card,
body.store-fluent .widget.widget-product .card-header {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
  top: auto !important;
}

body.store-fluent .contentM {
  top: auto !important;
}

/* ============================================================
   Auth pages — Login / Register / Verify / Recovery
   Light Fluent shell aligned with storefront chrome
   ============================================================ */
body.store-fluent.store-account .store-main.store-auth {
  padding: 0 !important;
  min-height: calc(100vh - 9rem);
}

.store-auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 0;
  min-height: calc(100vh - 9rem);
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(0, 120, 212, 0.08) 0%, transparent 55%),
    radial-gradient(90% 60% at 0% 100%, rgba(0, 120, 212, 0.05) 0%, transparent 50%),
    #F4F5F7;
  animation: storeAuthShellIn 420ms ease both;
}

.store-auth-shell--compact {
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  padding: 2rem 1rem 2.75rem;
}

@keyframes storeAuthShellIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.store-auth-aside {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 2.25rem;
  overflow: hidden;
  background:
    linear-gradient(155deg, #E8F4FC 0%, #F7FBFE 48%, #FFFFFF 100%);
  border-left: 1px solid rgba(0, 120, 212, 0.1);
}

.store-auth-aside-glow {
  position: absolute;
  inset: auto -20% -30% auto;
  width: 70%;
  height: 70%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 120, 212, 0.18) 0%, transparent 70%);
  pointer-events: none;
  animation: storeAuthGlow 6s ease-in-out infinite alternate;
}

@keyframes storeAuthGlow {
  from { transform: translate(0, 0) scale(1); opacity: 0.7; }
  to { transform: translate(-8%, -6%) scale(1.08); opacity: 1; }
}

.store-auth-aside-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 420px;
  text-align: right;
  animation: storeAuthRise 480ms 80ms ease both;
}

@keyframes storeAuthRise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.store-auth-brand-link {
  display: inline-flex;
  margin-bottom: 1.35rem;
}

.store-auth-brand-logo {
  max-width: 148px;
  max-height: 56px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.store-auth-kicker {
  margin: 0 0 0.35rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #0078D4;
}

.store-auth-brand-name {
  margin: 0 0 0.75rem;
  font-size: clamp(1.75rem, 2.6vw, 2.35rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: #0F172A;
}

.store-auth-aside-lead {
  margin: 0 0 1.5rem;
  font-size: 0.95rem;
  line-height: 1.8;
  color: #605E5C;
  white-space: nowrap;
}

.store-auth-perks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.store-auth-perks li {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.7rem 0.8rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(0, 120, 212, 0.1);
  box-shadow: 0 2px 8px rgba(15, 35, 70, 0.04);
  font-size: 0.88rem;
  font-weight: 600;
  color: #323130;
}

.store-auth-perk-ico {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
}

.store-auth-perk-ico .mdi {
  font-size: 1.15rem;
  line-height: 1;
}

.store-auth-main {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.5rem 2.5rem;
}

.store-auth-main--solo {
  width: 100%;
  max-width: 460px;
  padding: 0;
}

.store-auth-card {
  width: 100%;
  max-width: 440px;
  background: #fff !important;
  color: #1B1B1B !important;
  border: 1px solid #E6E8EC;
  border-radius: 20px;
  box-shadow:
    0 1px 2px rgba(15, 35, 70, 0.04),
    0 16px 40px rgba(15, 35, 70, 0.07);
  padding: 1.65rem 1.55rem 1.4rem;
  animation: storeAuthRise 480ms 140ms ease both;
  /* Contain any leftover legacy floats from theme CSS */
  display: flow-root;
}

.store-auth-card--success {
  text-align: center;
  padding-top: 1.85rem;
}

/* Kill legacy WebTheme `header {}` / `footer {}` rules inside auth card */
.store-auth-card-head,
.store-auth-card-foot {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  position: static !important;
  overflow: visible !important;
  z-index: auto !important;
  text-align: right !important;
  line-height: inherit !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.store-auth-card-foot {
  padding-top: 1.1rem !important;
  padding-bottom: 0 !important;
  margin-top: 1.25rem !important;
}

.store-auth-success-ico {
  width: 64px;
  height: 64px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(16, 124, 16, 0.1);
  color: #107C10;
}

.store-auth-success-ico .mdi {
  font-size: 2rem;
  line-height: 1;
}

.store-auth-card-head {
  margin-bottom: 1.25rem;
  text-align: right;
}

.store-auth-card--success .store-auth-card-head {
  text-align: center;
}

.store-auth-mini-logo {
  display: inline-flex;
  margin-bottom: 1rem;
}

.store-auth-mini-logo img {
  max-height: 42px;
  max-width: 130px;
  object-fit: contain;
}

.store-auth-card-title {
  margin: 0 0 0.4rem;
  font-size: 1.28rem;
  font-weight: 800;
  color: #0F172A;
  letter-spacing: -0.015em;
}

.store-auth-card-sub {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.7;
  color: #605E5C;
}

.store-auth-phone {
  color: #0078D4;
  font-weight: 750;
}

.store-auth-note {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-bottom: 1.1rem;
  padding: 0.75rem 0.85rem;
  border-radius: 12px;
  background: #F0F7FC;
  border: 1px solid rgba(0, 120, 212, 0.14);
  color: #0B5A9E;
  font-size: 0.8rem;
  line-height: 1.65;
}

.store-auth-note .mdi {
  font-size: 1.1rem;
  margin-top: 0.1rem;
  flex-shrink: 0;
}

.store-auth-form {
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
  width: 100%;
  clear: both;
  float: none !important;
  min-width: 0;
}

.store-auth-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  width: 100%;
}

.store-auth-submit {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 50px;
  margin-top: 0.25rem;
  border: 0;
  border-radius: 12px;
  background: #0078D4 !important;
  color: #fff !important;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(0, 120, 212, 0.28);
  transition: background 160ms ease, transform 160ms ease, box-shadow 160ms ease;
  float: none !important;
  position: relative;
  overflow: visible;
  padding: 0 1rem;
  white-space: normal;
  line-height: 1.3;
}

.store-auth-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.store-auth-label {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: #323130;
}

.store-auth-text-link,
.store-auth-inline-link {
  color: #0078D4;
  font-size: 0.8rem;
  font-weight: 650;
  text-decoration: none;
  transition: color 160ms ease;
}

.store-auth-text-link:hover,
.store-auth-inline-link:hover {
  color: #106EBE;
  text-decoration: underline;
}

.store-auth-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.store-auth-input-ico {
  position: absolute;
  right: 0.85rem;
  top: 50%;
  transform: translateY(-50%);
  color: #A19F9D !important;
  font-size: 1.2rem;
  pointer-events: none;
  transition: color 160ms ease;
}

.store-auth-input-ico.mdi::before {
  color: inherit !important;
}

.store-auth-input {
  width: 100%;
  height: 48px;
  border: 1px solid #E1DFDD !important;
  border-radius: 12px;
  background: #F8F9FA !important;
  padding: 0 2.55rem 0 0.95rem;
  font-family: inherit;
  font-size: 0.92rem;
  color: #1B1B1B !important;
  outline: none;
  transition:
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease;
}

.store-auth-input::placeholder {
  color: #A19F9D;
}

.store-auth-input:hover {
  border-color: #C8C6C4;
  background: #fff;
}

.store-auth-input:focus {
  border-color: #0078D4;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0, 120, 212, 0.14);
}

.store-auth-input-wrap:focus-within .store-auth-input-ico {
  color: #0078D4;
}

.store-auth-input--code {
  letter-spacing: 0.35em;
  font-weight: 750;
  text-align: center;
  padding-left: 2.55rem;
  font-size: 1.15rem;
}

.store-auth-error {
  display: block;
  font-size: 0.76rem;
  color: #C42B1C;
  min-height: 0;
}

.store-auth-error:empty {
  display: none;
}

.store-auth-check {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  cursor: pointer;
  user-select: none;
  margin: 0.1rem 0 0.15rem;
}

.store-auth-check-input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.store-auth-check-box {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1.5px solid #C8C6C4 !important;
  background: #fff !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 0.1rem;
  color: #fff !important;
  transition: background 140ms ease, border-color 140ms ease;
}

.store-auth-check-box .mdi,
.store-auth-check-box .mdi::before {
  font-size: 0.85rem !important;
  line-height: 1 !important;
  color: #fff !important;
  opacity: 0;
  transition: opacity 140ms ease;
}

.store-auth-check-input:checked + .store-auth-check-box {
  background: #0078D4 !important;
  border-color: #0078D4 !important;
  color: #fff !important;
}

.store-auth-check-input:checked + .store-auth-check-box .mdi,
.store-auth-check-input:checked + .store-auth-check-box .mdi::before {
  color: #fff !important;
  opacity: 1;
}

.store-auth-check-input:focus-visible + .store-auth-check-box {
  box-shadow: 0 0 0 3px rgba(0, 120, 212, 0.18);
}

.store-auth-check-text {
  font-size: 0.82rem;
  line-height: 1.65;
  color: #605E5C !important;
}

.store-auth-check--rules .store-auth-check-text {
  font-size: 0.78rem;
}

.store-auth-submit:hover {
  background: #106EBE !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0, 120, 212, 0.32);
}

.store-auth-submit:active {
  transform: translateY(0);
}

.store-auth-submit .mdi {
  font-size: 1.15rem;
  line-height: 1;
}

.store-auth-submit--link {
  display: inline-flex !important;
}

.store-auth-actions {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.store-auth-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  border-radius: 12px;
  border: 1px solid #E1DFDD;
  background: #fff;
  color: #323130;
  font-size: 0.9rem;
  font-weight: 650;
  text-decoration: none;
  transition: border-color 160ms ease, color 160ms ease, background 160ms ease;
}

.store-auth-secondary:hover {
  border-color: #0078D4;
  color: #0078D4;
  background: #F5FAFE;
}

.store-auth-card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.4rem 0.55rem;
  margin-top: 1.25rem;
  padding-top: 1.1rem;
  border-top: 1px solid #F0F2F5;
  font-size: 0.84rem;
  color: #605E5C;
  text-align: center;
}

.store-auth-switch {
  color: #0078D4;
  font-weight: 750;
  text-decoration: none;
  transition: color 160ms ease;
}

.store-auth-switch:hover {
  color: #106EBE;
  text-decoration: underline;
}

/* Kill leftover legacy floats if any old classes remain */
body.store-fluent.store-account .store-account-wrap,
body.store-fluent.store-account .account-box {
  float: none !important;
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

@media (max-width: 991.98px) {
  .store-auth-shell {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .store-auth-aside {
    display: none !important;
  }

  .store-auth-main {
    padding: 1.35rem 1rem 2.25rem;
  }

  .store-auth-card {
    max-width: 480px;
    margin: 0 auto;
  }
}

@media (max-width: 575.98px) {
  .store-auth-card {
    padding: 1.35rem 1.1rem 1.2rem;
    border-radius: 16px;
  }

  .store-auth-shell--compact {
    padding: 1.35rem 0.85rem 2rem;
  }
}

/* ============================================================
   User account shell — CSS Grid, zero floats
   Prevents legacy pull-* / col-* from collapsing layout
   ============================================================ */
body.store-fluent.store-user .store-main.contentM,
body.store-fluent.store-user main.contentM {
  display: block !important;
  float: none !important;
  width: 100% !important;
  top: auto !important;
  padding-top: 1.25rem !important;
  padding-bottom: 2rem !important;
}

body.store-fluent.store-user .user-account.store-container,
body.store-fluent.store-user .store-container.user-account {
  display: grid !important;
  grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: stretch;
  width: 100% !important;
  max-width: 1180px;
  height: auto !important;
  min-height: 0 !important;
  float: none !important;
  clear: both !important;
}

body.store-fluent.store-user .user-account-nav,
body.store-fluent.store-user .user-account-main {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  left: auto !important;
  right: auto !important;
}

body.store-fluent.store-user .user-account-main {
  position: static !important;
  top: auto !important;
}

/* Sticky account sidebar: sticks under header, stops with content bottom */
body.store-fluent.store-user .user-account-nav {
  position: relative !important;
  top: auto !important;
  height: 100%;
}

body.store-fluent.store-user .user-account-nav .sidebar-wrapper {
  position: sticky !important;
  top: calc(6.75rem + 0.82rem);
  z-index: 20;
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
}

/* Kill leftover Bootstrap/legacy float columns inside account pages */
body.store-fluent.store-user .user-account .pull-left,
body.store-fluent.store-user .user-account .pull-right,
body.store-fluent.store-user .user-account [class*="col-lg-"],
body.store-fluent.store-user .user-account [class*="col-md-"],
body.store-fluent.store-user .user-account [class*="col-xs-"],
body.store-fluent.store-user .user-account [class*="col-sm-"],
body.store-fluent.store-user .user-account [class*="col-12"],
body.store-fluent.store-user .user-account [class*="col-6"] {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.store-fluent.store-user .user-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

body.store-fluent.store-user .sidebar-wrapper {
  width: 100% !important;
  float: none !important;
  margin: 0 0 0.25rem !important;
}

@media (max-width: 991.98px) {
  body.store-fluent.store-user .user-account.store-container,
  body.store-fluent.store-user .store-container.user-account {
    grid-template-columns: 1fr !important;
  }

  body.store-fluent.store-user .user-account-nav .sidebar-wrapper {
    position: static !important;
    top: auto !important;
  }
}

/* ---------- User Orders (self-contained Material / Fluent) ---------- */
body.store-fluent.store-user .user-orders {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
  margin: 0;
  text-align: right;
  animation: user-orders-in 0.4s ease both;
}

@keyframes user-orders-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

body.store-fluent.store-user .user-orders-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.2rem 1.3rem 1.15rem;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.11) 0%, rgba(255, 255, 255, 0.98) 52%),
    #fff;
  border: 1px solid var(--fluent-border);
  border-top: 3px solid var(--fluent-accent);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  overflow: hidden;
}

body.store-fluent.store-user .user-orders-hero::after {
  content: "";
  position: absolute;
  inset-inline-end: -40px;
  top: -40px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 120, 212, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

body.store-fluent.store-user .user-orders-kicker {
  margin: 0 0 0.2rem;
  font-size: 0.75rem;
  font-weight: 650;
  color: var(--fluent-accent);
}

body.store-fluent.store-user .user-orders-title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 750;
  color: var(--fluent-text);
  letter-spacing: -0.02em;
}

body.store-fluent.store-user .user-orders-subtitle {
  margin: 0.35rem 0 0;
  font-size: 0.86rem;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-orders-hero-action {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.95rem;
  border-radius: 9px;
  background: var(--fluent-accent);
  color: #fff !important;
  font-size: 0.86rem;
  font-weight: 650;
  text-decoration: none !important;
  transition: background var(--fluent-transition), transform var(--fluent-transition);
}

body.store-fluent.store-user .user-orders-hero-action:hover {
  background: var(--fluent-accent-hover);
  color: #fff !important;
  transform: translateY(-1px);
}

body.store-fluent.store-user .user-orders-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
  width: 100%;
}

body.store-fluent.store-user .user-orders-kpi {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.95rem 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
  border: 1px solid var(--fluent-border);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  min-height: 78px;
  min-width: 0;
  text-align: right;
  transition: transform var(--fluent-transition), box-shadow var(--fluent-transition), border-color var(--fluent-transition);
}

body.store-fluent.store-user .user-orders-kpi:hover {
  transform: translateY(-2px);
  box-shadow: var(--fluent-shadow-3);
  border-color: rgba(0, 120, 212, 0.28);
}

body.store-fluent.store-user .user-orders-kpi-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

body.store-fluent.store-user .user-orders-kpi-icon .mdi {
  font-size: 1.25rem;
  line-height: 1;
}

body.store-fluent.store-user .user-orders-kpi-icon--blue,
body.store-fluent.store-user .user-orders-kpi-icon--info {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
}

body.store-fluent.store-user .user-orders-kpi-icon--warning {
  background: rgba(255, 185, 0, 0.18);
  color: #8A6D00;
}

body.store-fluent.store-user .user-orders-kpi-icon--success {
  background: rgba(16, 124, 16, 0.12);
  color: #107C10;
}

body.store-fluent.store-user .user-orders-kpi-icon--danger {
  background: rgba(196, 43, 28, 0.12);
  color: #C42B1C;
}

body.store-fluent.store-user .user-orders-kpi-label {
  display: block;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--fluent-text-secondary);
  margin-bottom: 0.15rem;
}

body.store-fluent.store-user .user-orders-kpi-value {
  display: block;
  font-size: 1.2rem;
  font-weight: 750;
  color: var(--fluent-text);
  line-height: 1.1;
}

body.store-fluent.store-user .user-orders-panel {
  background: #fff;
  border: 1px solid var(--fluent-border);
  border-top: 3px solid var(--fluent-accent);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  overflow: hidden;
  width: 100%;
  text-align: right;
}

body.store-fluent.store-user .user-orders-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 54px;
  padding: 0.85rem 1.1rem;
  background: linear-gradient(180deg, #FAFBFC 0%, #fff 100%);
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent.store-user .user-orders-panel-title {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-orders-count-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  font-size: 0.78rem;
  font-weight: 650;
  white-space: nowrap;
}

body.store-fluent.store-user .user-orders-table-wrap {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body.store-fluent.store-user .user-orders-table {
  width: 100%;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  text-align: center;
}

body.store-fluent.store-user .user-orders-table thead th {
  padding: 0.85rem 1rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--fluent-text-secondary);
  background: #F8F9FA;
  border: 0;
  border-bottom: 1px solid var(--fluent-border);
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
}

body.store-fluent.store-user .user-orders-table tbody td {
  padding: 0.95rem 1rem;
  font-size: 0.88rem;
  color: var(--fluent-text);
  border: 0;
  border-bottom: 1px solid #F0F0F0;
  vertical-align: middle;
  background: #fff;
  text-align: center;
}

body.store-fluent.store-user .user-orders-table tbody tr:last-child td {
  border-bottom: 0;
}

body.store-fluent.store-user .user-orders-table tbody tr:hover td {
  background: #F7FAFC;
}

body.store-fluent.store-user .user-orders-index {
  color: var(--fluent-text-secondary);
  font-weight: 600;
}

body.store-fluent.store-user .user-orders-code {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 700;
  color: #0078D4;
  letter-spacing: 0.01em;
}

body.store-fluent.store-user .user-orders-date {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: var(--fluent-text-secondary);
  white-space: nowrap;
}

body.store-fluent.store-user .user-orders-price {
  font-weight: 750;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-orders-currency {
  margin-right: 0.25rem;
  font-size: 0.75rem;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-order-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 650;
  white-space: nowrap;
  line-height: 1.2;
}

body.store-fluent.store-user .user-order-badge .mdi {
  font-size: 0.95rem;
  line-height: 1;
}

body.store-fluent.store-user .user-order-badge--success {
  background: rgba(16, 124, 16, 0.12);
  color: #0B6A0B;
}

body.store-fluent.store-user .user-order-badge--info {
  background: rgba(0, 120, 212, 0.12);
  color: #006CBD;
}

body.store-fluent.store-user .user-order-badge--warning {
  background: rgba(255, 185, 0, 0.18);
  color: #8A6D00;
}

body.store-fluent.store-user .user-order-badge--danger {
  background: rgba(196, 43, 28, 0.12);
  color: #A4262C;
}

body.store-fluent.store-user .user-order-badge--neutral {
  background: #F3F2F1;
  color: #605E5C;
}

body.store-fluent.store-user .user-orders-detail-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.4rem 0.75rem;
  border-radius: 8px;
  border: 1px solid rgba(0, 120, 212, 0.25);
  background: #F0F6FC;
  color: #0078D4 !important;
  font-size: 0.8rem;
  font-weight: 650;
  text-decoration: none !important;
  transition: background var(--fluent-transition), border-color var(--fluent-transition);
  white-space: nowrap;
}

body.store-fluent.store-user .user-orders-detail-btn:hover {
  background: #E3F0FB;
  border-color: rgba(0, 120, 212, 0.45);
  color: #005A9E !important;
}

body.store-fluent.store-user .user-orders-detail-btn--block {
  width: 100%;
  justify-content: center;
  margin-top: 0.65rem;
}

body.store-fluent.store-user .user-orders-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
  padding: 2.5rem 1.25rem;
}

body.store-fluent.store-user .user-orders-empty-icon {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  margin-bottom: 0.35rem;
}

body.store-fluent.store-user .user-orders-empty-icon .mdi {
  font-size: 1.75rem;
}

body.store-fluent.store-user .user-orders-empty h3 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-orders-empty p {
  margin: 0;
  max-width: 320px;
  font-size: 0.86rem;
  color: var(--fluent-text-secondary);
  line-height: 1.6;
}

body.store-fluent.store-user .user-orders-empty-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.75rem;
  padding: 0.6rem 1rem;
  border-radius: 9px;
  background: var(--fluent-accent);
  color: #fff !important;
  font-size: 0.86rem;
  font-weight: 650;
  text-decoration: none !important;
}

body.store-fluent.store-user .user-orders-empty-btn:hover {
  background: var(--fluent-accent-hover);
  color: #fff !important;
}

body.store-fluent.store-user .user-orders-mobile-list {
  display: none;
  padding: 0.75rem;
  gap: 0.7rem;
}

body.store-fluent.store-user .user-orders-mobile-card {
  background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
  border: 1px solid #EDEDED;
  border-radius: 12px;
  padding: 0.95rem;
  box-shadow: var(--fluent-shadow-1);
  text-align: right;
  transition: border-color var(--fluent-transition), box-shadow var(--fluent-transition);
}

body.store-fluent.store-user .user-orders-mobile-card:hover {
  border-color: rgba(0, 120, 212, 0.28);
  box-shadow: var(--fluent-shadow-3);
}

body.store-fluent.store-user .user-orders-mobile-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.65rem;
}

body.store-fluent.store-user .user-orders-mobile-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
  font-size: 0.84rem;
  color: var(--fluent-text-secondary);
}

/* User sidebar — Material polish */
body.store-fluent.store-user .box-sidebar {
  background: #fff !important;
  border: 1px solid var(--fluent-border) !important;
  border-radius: var(--fluent-radius-lg) !important;
  box-shadow: var(--fluent-shadow-1) !important;
  overflow: hidden !important;
  float: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.store-fluent.store-user .profile-box {
  padding: 1rem 1rem 0.85rem !important;
  background: linear-gradient(180deg, #F7FAFC 0%, #fff 100%);
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent.store-user .profile-box-content {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

body.store-fluent.store-user .profile-box-nameuser {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: var(--fluent-text) !important;
}

body.store-fluent.store-user .profile-box-phone {
  font-size: 0.8rem !important;
  color: var(--fluent-text-secondary) !important;
  word-break: break-all;
}

body.store-fluent.store-user .profile-menu-items {
  list-style: none !important;
  margin: 0 !important;
  padding: 0.45rem !important;
  float: none !important;
  width: 100% !important;
}

body.store-fluent.store-user .profile-menu-items li {
  margin: 0 !important;
  float: none !important;
  width: 100% !important;
}

body.store-fluent.store-user .profile-menu-url {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 0.75rem !important;
  border-radius: 10px !important;
  color: #323130 !important;
  font-size: 0.86rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  float: none !important;
  width: 100% !important;
  transition: background var(--fluent-transition), color var(--fluent-transition);
}

body.store-fluent.store-user .profile-menu-url .mdi {
  color: #0078D4 !important;
  font-size: 1.1rem !important;
}

body.store-fluent.store-user .profile-menu-url:hover,
body.store-fluent.store-user .profile-menu-url.active-profile {
  background: #F0F6FC !important;
  color: #0078D4 !important;
}

@media (max-width: 1199.98px) {
  body.store-fluent.store-user .user-orders-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  body.store-fluent.store-user .user-orders-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.store-fluent.store-user .user-orders-table-wrap {
    display: none;
  }

  body.store-fluent.store-user .user-orders-mobile-list {
    display: grid;
  }

  body.store-fluent.store-user .user-orders-hero {
    padding: 1rem;
  }

  body.store-fluent.store-user .user-orders-title {
    font-size: 1.15rem;
  }
}

@media (max-width: 420px) {
  body.store-fluent.store-user .user-orders-kpis {
    grid-template-columns: 1fr;
  }
}


/* ============================================================
   Shared User Account UI (Dashboard / Address / OrderDetail)
   Self-contained — no legacy .card / float dependence
   ============================================================ */
body.store-fluent.store-user .user-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 1.2rem 1.3rem 1.15rem;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.11) 0%, rgba(255, 255, 255, 0.98) 52%),
    #fff;
  border: 1px solid var(--fluent-border);
  border-top: 3px solid var(--fluent-accent);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  overflow: hidden;
}

body.store-fluent.store-user .user-hero-kicker {
  margin: 0 0 0.2rem;
  font-size: 0.75rem;
  font-weight: 650;
  color: var(--fluent-accent);
}

body.store-fluent.store-user .user-hero-title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 750;
  color: var(--fluent-text);
  letter-spacing: -0.02em;
}

body.store-fluent.store-user .user-hero-subtitle {
  margin: 0.35rem 0 0;
  font-size: 0.86rem;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-hero-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}

body.store-fluent.store-user .user-hero-action,
body.store-fluent.store-user button.user-hero-action {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.95rem;
  border: 0;
  border-radius: 9px;
  background: var(--fluent-accent);
  color: #fff !important;
  font-size: 0.86rem;
  font-weight: 650;
  font-family: inherit;
  text-decoration: none !important;
  cursor: pointer;
  transition: background var(--fluent-transition), transform var(--fluent-transition);
}

body.store-fluent.store-user .user-hero-action:hover,
body.store-fluent.store-user button.user-hero-action:hover {
  background: var(--fluent-accent-hover);
  color: #fff !important;
  transform: translateY(-1px);
}

body.store-fluent.store-user .user-hero-action:focus,
body.store-fluent.store-user button.user-hero-action:focus,
body.store-fluent.store-user .user-hero-action:focus-visible,
body.store-fluent.store-user button.user-hero-action:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

body.store-fluent.store-user .user-panel {
  background: #fff;
  border: 1px solid var(--fluent-border);
  border-top: 3px solid var(--fluent-accent);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  overflow: hidden;
  width: 100%;
  text-align: right;
}

body.store-fluent.store-user .user-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 54px;
  padding: 0.85rem 1.1rem;
  background: linear-gradient(180deg, #FAFBFC 0%, #fff 100%);
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent.store-user .user-panel-title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-panel-title .mdi {
  color: #0078D4;
  font-size: 1.15rem;
}

body.store-fluent.store-user .user-count-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  font-size: 0.78rem;
  font-weight: 650;
  white-space: nowrap;
}

body.store-fluent.store-user .user-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 1rem 1.1rem 1.15rem;
}

body.store-fluent.store-user .user-info-grid--detail {
  background: #fff;
  border: 1px solid var(--fluent-border);
  border-radius: var(--fluent-radius-lg);
  box-shadow: var(--fluent-shadow-1);
  margin: 0;
}

body.store-fluent.store-user .user-info-item {
  padding: 0.75rem 0.85rem;
  background: #FAFBFC;
  border: 1px solid #F0F0F0;
  border-radius: 10px;
  min-width: 0;
}

body.store-fluent.store-user .user-info-item--wide {
  grid-column: 1 / -1;
}

body.store-fluent.store-user .user-info-label {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-info-value {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--fluent-text);
  word-break: break-word;
}

body.store-fluent.store-user .user-info-value--accent {
  color: #0078D4;
}

body.store-fluent.store-user .user-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  padding: 0.45rem 0.85rem;
  border-radius: 8px;
  border: 1px solid transparent;
  font-size: 0.82rem;
  font-weight: 650;
  font-family: inherit;
  text-decoration: none !important;
  cursor: pointer;
  transition: background var(--fluent-transition), border-color var(--fluent-transition), color var(--fluent-transition);
  white-space: nowrap;
  outline: none !important;
  -webkit-tap-highlight-color: transparent;
}

body.store-fluent.store-user .user-btn:focus,
body.store-fluent.store-user .user-btn:focus-visible,
body.store-fluent.store-user .user-btn:active {
  outline: none !important;
  box-shadow: none !important;
}

body.store-fluent.store-user .user-btn--primary {
  background: var(--fluent-accent);
  color: #fff !important;
}

body.store-fluent.store-user .user-btn--primary:hover {
  background: var(--fluent-accent-hover);
  color: #fff !important;
}

body.store-fluent.store-user .user-btn--soft {
  border-color: rgba(0, 120, 212, 0.25);
  background: #F0F6FC;
  color: #0078D4 !important;
}

body.store-fluent.store-user .user-btn--soft:hover {
  background: #E3F0FB;
  border-color: rgba(0, 120, 212, 0.45);
  color: #005A9E !important;
}

body.store-fluent.store-user .user-btn--ghost {
  background: #fff;
  border-color: var(--fluent-border);
  color: var(--fluent-text) !important;
}

body.store-fluent.store-user .user-btn--ghost:hover {
  background: #F7FAFC;
  color: #0078D4 !important;
}

body.store-fluent.store-user .user-btn--danger-ghost {
  background: rgba(196, 43, 28, 0.12);
  border-color: transparent;
  border: 0;
  color: #A4262C !important;
}

body.store-fluent.store-user .user-btn--danger-ghost:hover {
  background: rgba(196, 43, 28, 0.18);
}

body.store-fluent.store-user .user-btn--block {
  width: 100%;
  margin-top: 0.55rem;
}

body.store-fluent.store-user .user-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 650;
  white-space: nowrap;
  line-height: 1.2;
}

body.store-fluent.store-user .user-badge--success {
  background: rgba(16, 124, 16, 0.12);
  color: #0B6A0B;
}

body.store-fluent.store-user .user-badge--info {
  background: rgba(0, 120, 212, 0.12);
  color: #006CBD;
}

body.store-fluent.store-user .user-badge--warning {
  background: rgba(255, 185, 0, 0.18);
  color: #8A6D00;
}

body.store-fluent.store-user .user-badge--danger {
  background: rgba(196, 43, 28, 0.12);
  color: #A4262C;
}

body.store-fluent.store-user .user-badge--neutral {
  background: #F3F2F1;
  color: #605E5C;
}

body.store-fluent.store-user .user-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
  padding: 2.5rem 1.25rem;
}

body.store-fluent.store-user .user-empty--compact {
  padding: 1.75rem 1.1rem;
}

body.store-fluent.store-user .user-empty-icon {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  margin-bottom: 0.35rem;
  flex-shrink: 0;
}

body.store-fluent.store-user .user-empty-icon .mdi {
  display: inline-block;
  font-family: "Material Design Icons" !important;
  font-size: 1.75rem !important;
  line-height: 1 !important;
  width: 1.75rem !important;
  height: 1.75rem !important;
  color: #0078D4 !important;
}

body.store-fluent.store-user .user-empty-icon .mdi::before {
  font-family: "Material Design Icons" !important;
  font-size: 1.75rem !important;
  line-height: 1 !important;
  color: inherit;
}

body.store-fluent.store-user .user-empty h3 {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-empty p {
  margin: 0;
  max-width: 320px;
  font-size: 0.86rem;
  color: var(--fluent-text-secondary);
  line-height: 1.6;
}

body.store-fluent.store-user .user-table-wrap {
  display: block;
  width: 100%;
  overflow-x: auto;
}

body.store-fluent.store-user .user-table {
  width: 100%;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  text-align: center;
}

body.store-fluent.store-user .user-table thead th {
  padding: 0.85rem 1rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--fluent-text-secondary);
  background: #F8F9FA;
  border: 0;
  border-bottom: 1px solid var(--fluent-border);
  white-space: nowrap;
  text-align: center;
}

body.store-fluent.store-user .user-table tbody td {
  padding: 0.95rem 1rem;
  font-size: 0.88rem;
  color: var(--fluent-text);
  border: 0;
  border-bottom: 1px solid #F0F0F0;
  vertical-align: middle;
  background: #fff;
  text-align: center;
}

body.store-fluent.store-user .user-table tbody tr:last-child td {
  border-bottom: 0;
}

body.store-fluent.store-user .user-table tbody tr:hover td {
  background: #F7FAFC;
}

body.store-fluent.store-user .user-table-index {
  color: var(--fluent-text-secondary);
  font-weight: 600;
}

body.store-fluent.store-user .user-code {
  font-weight: 700;
  color: #0078D4;
}

body.store-fluent.store-user .user-muted {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-currency {
  margin-right: 0.2rem;
  font-size: 0.75rem;
  color: var(--fluent-text-secondary);
}

body.store-fluent.store-user .user-link {
  display: inline-block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  font-weight: 650;
  color: #0078D4 !important;
}

body.store-fluent.store-user .user-mobile-list {
  display: none;
  padding: 0.75rem;
  gap: 0.7rem;
}

body.store-fluent.store-user .user-mobile-card {
  background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
  border: 1px solid #EDEDED;
  border-radius: 12px;
  padding: 0.95rem;
  box-shadow: var(--fluent-shadow-1);
}

body.store-fluent.store-user .user-mobile-top,
body.store-fluent.store-user .user-mobile-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  flex-wrap: wrap;
}

body.store-fluent.store-user .user-mobile-top {
  margin-bottom: 0.65rem;
}

body.store-fluent.store-user .user-mobile-meta {
  font-size: 0.84rem;
  color: var(--fluent-text-secondary);
}

/* Dashboard */
body.store-fluent.store-user .user-dash {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

body.store-fluent.store-user .user-dash-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

body.store-fluent.store-user .user-dash-card .user-info-grid {
  padding-top: 0.85rem;
}

body.store-fluent.store-user .user-fav-list {
  display: flex;
  flex-direction: column;
  padding: 0.55rem;
  gap: 0.35rem;
}

body.store-fluent.store-user .user-fav-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.7rem;
  border-radius: 10px;
  text-decoration: none !important;
  color: inherit !important;
  transition: background var(--fluent-transition);
}

body.store-fluent.store-user .user-fav-item:hover {
  background: #F0F6FC;
}

body.store-fluent.store-user .user-fav-img {
  width: 52px;
  height: 52px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #EEE;
  flex-shrink: 0;
  background: #FAFAFA;
}

body.store-fluent.store-user .user-fav-meta {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

body.store-fluent.store-user .user-fav-title {
  font-size: 0.88rem;
  font-weight: 650;
  color: var(--fluent-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.store-fluent.store-user .user-fav-price {
  font-size: 0.8rem;
  color: #0078D4;
  font-weight: 650;
}

body.store-fluent.store-user .user-fav-chevron {
  color: #0078D4;
  font-size: 1.2rem;
}

/* Addresses */
body.store-fluent.store-user .user-addresses {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

body.store-fluent.store-user .user-address-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
  padding: 0.95rem;
}

body.store-fluent.store-user .user-address-card {
  background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
  border: 1px solid #EDEDED;
  border-radius: 12px;
  padding: 1rem;
  box-shadow: var(--fluent-shadow-1);
  transition: border-color var(--fluent-transition), box-shadow var(--fluent-transition);
}

body.store-fluent.store-user .user-address-card:hover {
  border-color: rgba(0, 120, 212, 0.28);
  box-shadow: var(--fluent-shadow-3);
}

body.store-fluent.store-user .user-address-card--active {
  border-color: rgba(16, 124, 16, 0.35);
  box-shadow: 0 0 0 1px rgba(16, 124, 16, 0.12), var(--fluent-shadow-1);
}

body.store-fluent.store-user .user-address-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

body.store-fluent.store-user .user-address-city {
  margin: 0 0 0.4rem;
  font-size: 1rem;
  font-weight: 750;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-address-meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

body.store-fluent.store-user .user-address-meta li {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  font-size: 0.86rem;
  color: var(--fluent-text-secondary);
  line-height: 1.55;
}

body.store-fluent.store-user .user-address-meta .mdi {
  color: #0078D4;
  font-size: 1.05rem;
  margin-top: 0.1rem;
  flex-shrink: 0;
}

/* Order detail */
body.store-fluent.store-user .user-order-detail {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

body.store-fluent.store-user .user-steps {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.45rem;
  padding: 1rem;
}

body.store-fluent.store-user .user-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.45rem;
  padding: 0.65rem 0.35rem;
  border-radius: 12px;
  background: #FAFBFC;
  border: 1px solid #F0F0F0;
  opacity: 0.55;
}

body.store-fluent.store-user .user-step--active {
  opacity: 1;
  background: rgba(0, 120, 212, 0.08);
  border-color: rgba(0, 120, 212, 0.28);
}

body.store-fluent.store-user .user-step-icon {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: #605E5C;
  border: 1px solid #EEE;
}

body.store-fluent.store-user .user-step--active .user-step-icon {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
  border-color: rgba(0, 120, 212, 0.2);
}

body.store-fluent.store-user .user-step-icon .mdi {
  font-size: 1.2rem;
}

body.store-fluent.store-user .user-step-label {
  font-size: 0.72rem;
  font-weight: 650;
  color: var(--fluent-text);
  line-height: 1.35;
}

body.store-fluent.store-user .user-shipment-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 0 1rem 1.1rem;
}

body.store-fluent.store-user .user-shipment-meta-item {
  padding: 0.75rem 0.85rem;
  background: #FAFBFC;
  border: 1px solid #F0F0F0;
  border-radius: 10px;
}

body.store-fluent.store-user .user-shipment-meta-item strong {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.9rem;
  color: var(--fluent-text);
}

body.store-fluent.store-user .user-orders-table td .user-orders-code,
body.store-fluent.store-user .user-orders-table td .user-orders-date,
body.store-fluent.store-user .user-orders-table td .user-order-badge,
body.store-fluent.store-user .user-orders-table td .user-orders-detail-btn,
body.store-fluent.store-user .user-table td .user-code,
body.store-fluent.store-user .user-table td .user-muted,
body.store-fluent.store-user .user-table td .user-badge,
body.store-fluent.store-user .user-table td .user-btn {
  margin-left: auto;
  margin-right: auto;
}

body.store-fluent.store-user .user-product-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  text-align: center;
}

body.store-fluent.store-user .user-product-cell img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #EEE;
  flex-shrink: 0;
}

body.store-fluent.store-user .user-product-cards {
  display: none;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding: 0.85rem;
}

body.store-fluent.store-user .user-product-card {
  position: relative;
  background: #fff;
  border: 1px solid #EDEDED;
  border-radius: 12px;
  padding: 0.9rem;
  text-align: center;
}

body.store-fluent.store-user .user-product-card img {
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: 12px;
  margin: 0.35rem auto;
  border: 1px solid #EEE;
}

body.store-fluent.store-user .user-product-card h3 {
  margin: 0.35rem 0;
  font-size: 0.92rem;
  font-weight: 700;
}

body.store-fluent.store-user .user-product-count {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  min-width: 26px;
  height: 26px;
  padding: 0 0.35rem;
  border-radius: 999px;
  background: #0078D4;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Modal — New Address (open only with .is-open — never force display) */
body.store-fluent .modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1400 !important;
  align-items: center;
  justify-content: center;
  padding: 1.25rem !important;
  overflow: hidden !important;
  background-color: rgba(0, 0, 0, 0.45);
}

body.store-fluent .modal.is-open {
  display: flex !important;
}

body.store-fluent .modal,
body.store-fluent .modal-box,
body.store-fluent .modal .user-modal-box,
body.store-fluent .modal-box.user-modal-box {
  z-index: 1400 !important;
}

body.store-fluent .modal-sandbox {
  z-index: 1390 !important;
}

body.store-fluent .modal .user-modal-box,
body.store-fluent .modal-box.user-modal-box {
  max-width: 460px !important;
  width: min(94vw, 460px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18) !important;
  border: 1px solid var(--fluent-border);
  max-height: calc(100vh - 2.5rem);
  overflow-x: hidden !important;
  overflow-y: auto !important;
  flex-shrink: 0;
  animation: none !important;
  box-sizing: border-box;
}

body.store-fluent .modal-box.user-modal-box .modal-header {
  display: none !important;
}

body.store-fluent .modal-box.user-modal-box .modal-body {
  padding: 0 !important;
  background: #fff !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

body.store-fluent .user-modal-input:focus,
body.store-fluent .user-modal-select:focus,
body.store-fluent .user-modal-textarea:focus {
  border-color: rgba(0, 120, 212, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(0, 120, 212, 0.12) !important;
  outline: none !important;
}

body.store-fluent .user-modal-form {
  padding: 0;
  margin: 0;
  width: 100% !important;
  max-width: 100% !important;
  text-align: right;
  box-sizing: border-box;
}

body.store-fluent .user-modal-headline {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  padding: 0.9rem 1rem;
  font-size: 1.02rem;
  font-weight: 750;
  color: var(--fluent-text);
  background: linear-gradient(180deg, #FAFBFC 0%, #fff 100%);
  border-bottom: 1px solid #F0F0F0;
  border-top: 3px solid var(--fluent-accent);
}

body.store-fluent .user-modal-headline .mdi {
  color: #0078D4;
  font-size: 1.25rem;
}

body.store-fluent .user-modal-fields {
  padding: 0.85rem 1rem 0.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  width: 100%;
  box-sizing: border-box;
}

body.store-fluent .user-modal-label {
  display: block;
  margin: 0.3rem 0 0.2rem;
  font-size: 0.82rem;
  font-weight: 650;
  color: var(--fluent-text);
}

body.store-fluent .user-req {
  color: #C42B1C;
}

body.store-fluent .user-modal-input,
body.store-fluent .user-modal-select,
body.store-fluent .user-modal-textarea {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  padding: 0.65rem 0.8rem;
  border: 1px solid var(--fluent-border);
  border-radius: 9px;
  background: #fff;
  font-size: 0.88rem;
  font-family: inherit;
  color: var(--fluent-text);
  outline: none;
  transition: border-color var(--fluent-transition), box-shadow var(--fluent-transition);
}

body.store-fluent .user-modal-input--ltr {
  direction: ltr;
  text-align: left;
}

body.store-fluent .user-modal-textarea {
  resize: vertical;
  min-height: 88px;
}

body.store-fluent .user-modal-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
  width: 100%;
}

body.store-fluent .user-modal-row > div {
  min-width: 0;
  width: 100%;
}

body.store-fluent .user-modal-check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0.65rem 0 0.25rem;
  font-size: 0.86rem;
  color: var(--fluent-text);
  cursor: pointer;
}

body.store-fluent .user-modal-error {
  display: block;
  color: #C42B1C;
  font-size: 0.78rem;
}

body.store-fluent .user-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #F0F0F0;
  background: #FAFBFC;
  width: 100%;
  box-sizing: border-box;
}

body.store-fluent .user-modal-form .user-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.55rem 1rem;
  border-radius: 9px;
  border: 1px solid transparent;
  font-family: inherit;
  font-size: 0.88rem;
  font-weight: 650;
  cursor: pointer;
  text-decoration: none !important;
  transition: background 140ms ease, border-color 140ms ease, color 140ms ease;
}

body.store-fluent .user-modal-form .user-btn--primary {
  background: #0078D4;
  color: #fff !important;
}

body.store-fluent .user-modal-form .user-btn--primary:hover {
  background: #106EBE;
  color: #fff !important;
}

body.store-fluent .user-modal-form .user-btn--ghost,
body.store-fluent .user-modal-form button.user-btn--ghost.modal-close {
  background: #fff !important;
  color: #323130 !important;
  border-color: #E1DFDD !important;
  padding: 0.55rem 1rem !important;
  border-radius: 9px !important;
}

body.store-fluent .user-modal-form .user-btn--ghost:hover,
body.store-fluent .user-modal-form button.user-btn--ghost.modal-close:hover {
  background: #F3F2F1 !important;
  color: #201F1E !important;
}

@media (max-width: 991.98px) {
  body.store-fluent.store-user .user-dash-grid,
  body.store-fluent.store-user .user-address-grid {
    grid-template-columns: 1fr;
  }

  body.store-fluent.store-user .user-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  body.store-fluent.store-user .user-info-grid,
  body.store-fluent.store-user .user-shipment-meta,
  body.store-fluent .user-modal-row {
    grid-template-columns: 1fr;
  }

  body.store-fluent.store-user .user-table-wrap {
    display: none;
  }

  body.store-fluent.store-user .user-mobile-list,
  body.store-fluent.store-user .user-product-cards {
    display: grid;
  }

  body.store-fluent.store-user .user-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.store-fluent.store-user .user-hero-title {
    font-size: 1.15rem;
  }

  body.store-fluent .modal-box.user-modal-box {
    width: 94vw !important;
    max-width: 94vw !important;
  }
}

/* ============================================================
   Product Detail / Cart / Shopping (storefront Fluent)
   ============================================================ */

body.store-fluent.store-product-page .store-main,
body.store-fluent.store-cart-page .store-main,
body.store-fluent.store-shopping-page .store-main {
  padding: 1.25rem 0 2.75rem !important;
  position: relative !important;
  top: auto !important;
  float: none !important;
  width: 100% !important;
  display: block !important;
  clear: both !important;
}

body.store-fluent.store-product-page .store-container,
body.store-fluent.store-cart-page .store-container,
body.store-fluent.store-shopping-page .store-container {
  float: none !important;
  width: 100% !important;
  max-width: 1180px;
  clear: both;
  overflow: visible;
}

body.store-fluent.store-product-page .store-product,
body.store-fluent.store-cart-page .store-cart,
body.store-fluent.store-shopping-page .store-shopping {
  float: none !important;
  width: 100% !important;
}

body.store-fluent.store-product-page .store-product [class*="col-"],
body.store-fluent.store-cart-page .store-cart [class*="col-"],
body.store-fluent.store-shopping-page .store-shopping [class*="col-"],
body.store-fluent.store-product-page .store-product .pull-right,
body.store-fluent.store-product-page .store-product .pull-left,
body.store-fluent.store-cart-page .store-cart .pull-right,
body.store-fluent.store-cart-page .store-cart .pull-left,
body.store-fluent.store-shopping-page .store-shopping .pull-right,
body.store-fluent.store-shopping-page .store-shopping .pull-left {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
}

/* ---------- Shared checkout chrome ---------- */
body.store-fluent.store-product-page header,
body.store-fluent.store-cart-page header,
body.store-fluent.store-shopping-page header {
  float: none !important;
  width: auto !important;
  box-shadow: none !important;
  background: transparent !important;
  position: static !important;
  z-index: auto !important;
}

body.store-fluent .store-ck-hero {
  display: flex !important;
  float: none !important;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  width: 100% !important;
  padding: 1.2rem 1.3rem 1.15rem;
  margin-bottom: 1rem;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.11) 0%, rgba(255, 255, 255, 0.98) 52%),
    #fff !important;
  border: 1px solid #E8E8EA;
  border-top: 3px solid #0078D4;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
  position: relative !important;
  z-index: 1 !important;
}

body.store-fluent .store-ck-kicker {
  margin: 0 0 0.15rem;
  font-size: 11px !important;
  font-weight: 650;
  color: #0078D4;
}

body.store-fluent .store-ck-title,
body.store-fluent h1.store-ck-title {
  margin: 0;
  font-size: 18px !important;
  font-weight: 750;
  color: #1B1B1B;
  letter-spacing: -0.02em;
  line-height: 1.3 !important;
}

body.store-fluent .store-ck-subtitle {
  margin: 0.25rem 0 0;
  font-size: 12.5px !important;
  color: #605E5C;
  line-height: 1.45 !important;
}

body.store-fluent .store-ck-hero-action {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.95rem;
  border-radius: 9px;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
  font-size: 0.86rem;
  font-weight: 650;
  text-decoration: none !important;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  transition: background 160ms ease, transform 160ms ease, color 160ms ease;
}

body.store-fluent .store-ck-hero-action:hover {
  background: rgba(0, 120, 212, 0.16);
  color: #0078D4 !important;
  transform: translateY(-1px);
}

body.store-fluent .store-ck-hero-action--soft {
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
}

body.store-fluent .store-ck-hero-action--soft:hover {
  background: rgba(0, 120, 212, 0.16);
  color: #0078D4 !important;
}

body.store-fluent .store-ck-steps {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

body.store-fluent .store-ck-step {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  background: #F3F2F1;
  color: #605E5C !important;
  font-size: 0.78rem;
  font-weight: 650;
  text-decoration: none !important;
  transition: background 160ms ease, color 160ms ease, transform 160ms ease;
}

body.store-fluent a.store-ck-step:hover {
  background: #EDEBE9;
  color: #0078D4 !important;
  transform: translateY(-1px);
}

body.store-fluent .store-ck-step--active {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4 !important;
  cursor: default;
  pointer-events: none;
  user-select: none;
}

body.store-fluent a.store-ck-step--active:hover {
  background: rgba(0, 120, 212, 0.18);
  color: #0078D4 !important;
}

body.store-fluent .store-ck-step--disabled,
body.store-fluent span.store-ck-step--disabled {
  background: #F3F2F1 !important;
  color: #A19F9D !important;
  opacity: 0.65;
  cursor: not-allowed !important;
  pointer-events: auto;
  user-select: none;
  transform: none !important;
}

body.store-fluent .store-ck-step--disabled:hover,
body.store-fluent span.store-ck-step--disabled:hover {
  background: #F3F2F1 !important;
  color: #A19F9D !important;
  transform: none !important;
  cursor: not-allowed !important;
}

body.store-fluent .store-ck-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 1rem;
  align-items: start;
  width: 100% !important;
  float: none !important;
  clear: both;
}

body.store-fluent .store-ck-main-col {
  display: grid;
  gap: 1rem;
}

body.store-fluent .store-ck-panel {
  background: #fff;
  border: 1px solid #E8E8EA;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
  overflow: hidden;
  min-width: 0;
  width: 100%;
}

body.store-fluent .store-ck-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.95rem 1.1rem;
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent .store-ck-panel-title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 1.02rem;
  font-weight: 700;
  color: #1B1B1B;
}

body.store-fluent .store-ck-panel-title .mdi {
  color: #0078D4;
  font-size: 1.2rem;
}

body.store-fluent .store-ck-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.28rem 0.65rem;
  border-radius: 999px;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  font-size: 0.78rem;
  font-weight: 650;
}

body.store-fluent .store-ck-chip--info {
  background: rgba(0, 120, 212, 0.08);
}

body.store-fluent .store-ck-ship-banner {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin: 0.85rem 1.1rem 0;
  padding: 0.85rem 1rem;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.08) 0%, rgba(0, 120, 212, 0.02) 55%, #fff 100%);
  border: 1px solid rgba(0, 120, 212, 0.14);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
  color: #252423;
}

body.store-fluent .store-ck-ship-banner--free {
  background:
    linear-gradient(135deg, rgba(16, 124, 16, 0.1) 0%, rgba(16, 124, 16, 0.03) 55%, #fff 100%);
  border-color: rgba(16, 124, 16, 0.18);
}

body.store-fluent .store-ck-ship-banner-icon {
  flex: 0 0 auto;
  width: 2.55rem;
  height: 2.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
  font-size: 1.35rem;
}

body.store-fluent .store-ck-ship-banner--free .store-ck-ship-banner-icon {
  background: rgba(16, 124, 16, 0.14);
  color: #107C10;
}

body.store-fluent .store-ck-ship-banner-body {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
  flex: 1 1 auto;
}

body.store-fluent .store-ck-ship-banner-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #8A8886;
  letter-spacing: 0.01em;
}

body.store-fluent .store-ck-ship-banner-value {
  font-size: 0.98rem;
  font-weight: 750;
  color: #201F1E;
  line-height: 1.2;
}

body.store-fluent .store-ck-ship-banner--free .store-ck-ship-banner-value {
  color: #0B6A0B;
}

body.store-fluent .store-ck-ship-banner-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding: 0.32rem 0.7rem;
  border-radius: 999px;
  background: rgba(16, 124, 16, 0.12);
  color: #0B6A0B;
  font-size: 0.74rem;
  font-weight: 700;
  white-space: nowrap;
}

body.store-fluent .store-ck-ship-banner-hint {
  flex: 0 1 auto;
  max-width: none;
  font-size: 0.74rem;
  line-height: 1.4;
  color: #605E5C;
  white-space: nowrap;
}

@media (max-width: 720px) {
  body.store-fluent .store-ck-ship-banner {
    flex-wrap: wrap;
  }

  body.store-fluent .store-ck-ship-banner-hint,
  body.store-fluent .store-ck-ship-banner-badge {
    width: 100%;
    margin-inline-start: 3.4rem;
    text-align: right;
    white-space: normal;
  }
}

body.store-fluent .store-ck-ship-banner .mdi {
  font-size: inherit;
  color: inherit;
}

body.store-fluent .store-ck-muted {
  color: #8A8886;
}

body.store-fluent .store-ck-items {
  display: grid;
  gap: 0.75rem;
  padding: 0.95rem 1.1rem 1.15rem;
}

body.store-fluent .store-ck-item {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 0.85rem;
  padding: 0.9rem;
  border: 1px solid #EDEBE9;
  border-radius: 12px;
  background: #FAFBFC;
  width: 100%;
  min-width: 0;
}

body.store-fluent .store-ck-remove {
  position: absolute;
  top: 0.55rem;
  left: 0.55rem;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 8px;
  background: rgba(164, 38, 44, 0.08);
  color: #A4262C;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.store-fluent .store-ck-remove:hover {
  background: rgba(164, 38, 44, 0.14);
}

body.store-fluent .store-ck-thumb {
  display: block;
  width: 92px;
  height: 92px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #EDEBE9;
}

body.store-fluent .store-ck-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

body.store-fluent .store-ck-item-body {
  min-width: 0;
  padding-left: 1.5rem;
}

body.store-fluent .store-ck-item-title {
  display: block;
  margin: 0 0 0.45rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: #1B1B1B !important;
  text-decoration: none !important;
  line-height: 1.45;
}

body.store-fluent .store-ck-item-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
  font-size: 0.8rem;
  color: #605E5C;
  margin-bottom: 0.65rem;
}

body.store-fluent .store-ck-swatch {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  display: inline-block;
}

body.store-fluent .store-ck-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #C8C6C4;
}

body.store-fluent .store-ck-item-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}

body.store-fluent .store-ck-qty {
  display: inline-flex;
  align-items: center;
  gap: 0;
  border: 1px solid #E1DFDD;
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

body.store-fluent .store-ck-qty-readonly {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.75rem;
  border-radius: 9px;
  background: rgba(0, 120, 212, 0.08);
  color: #0078D4;
  font-size: 0.88rem;
  font-weight: 700;
}

body.store-fluent .store-ck-qty-btn {
  width: 36px;
  height: 36px;
  border: 0;
  background: #F5F5F5;
  color: #323130;
  font-size: 1.15rem;
  font-weight: 700;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  transition: background 140ms ease, color 140ms ease;
}

body.store-fluent .store-ck-qty-btn:hover {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
}

body.store-fluent .store-ck-qty-btn:disabled,
body.store-fluent .store-ck-qty-btn--disabled {
  opacity: 0.45;
  color: #A19F9D;
  background: #F3F2F1;
  cursor: not-allowed !important;
}

body.store-fluent .store-ck-qty-btn:disabled:hover,
body.store-fluent .store-ck-qty-btn--disabled:hover {
  background: #F3F2F1;
  color: #A19F9D;
  cursor: not-allowed !important;
}

body.store-fluent .store-ck-qty input {
  width: 52px;
  height: 36px;
  border: 0;
  border-inline: 1px solid #E1DFDD;
  padding: 0 0.25rem;
  font-family: inherit;
  font-weight: 700;
  text-align: center;
  background: #fff;
  -moz-appearance: textfield;
}

body.store-fluent .store-ck-qty input::-webkit-outer-spin-button,
body.store-fluent .store-ck-qty input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

body.store-fluent .store-ck-qty input:focus {
  outline: none;
  background: rgba(0, 120, 212, 0.04);
}

body.store-fluent .store-ck-item-price {
  font-size: 1.05rem;
  font-weight: 750;
  color: #1B1B1B;
}

body.store-fluent .store-ck-item-price small {
  font-size: 0.75rem;
  font-weight: 600;
  color: #8A8886;
  margin-right: 0.2rem;
}

body.store-fluent .store-ck-msg {
  margin: 0.55rem 0 0;
  padding: 0.45rem 0.65rem;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 600;
}

body.store-fluent .store-ck-msg--danger {
  background: rgba(164, 38, 44, 0.08);
  color: #A4262C;
}

body.store-fluent .store-ck-msg--success {
  background: rgba(16, 124, 16, 0.08);
  color: #107C10;
}

body.store-fluent .store-ck-aside {
  position: sticky;
  top: calc(6.75rem + 0.75rem);
}

body.store-fluent .store-ck-summary {
  padding: 1.05rem 1.1rem 1.15rem;
  background: #fff;
  border: 1px solid #E8E8EA;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

body.store-fluent .store-ck-summary-title {
  margin: 0 0 0.85rem;
  font-size: 1rem;
  font-weight: 700;
  color: #1B1B1B;
}

body.store-fluent .store-ck-summary-list {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}

body.store-fluent .store-ck-summary-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.86rem;
  color: #605E5C;
}

body.store-fluent .store-ck-summary-list strong {
  color: #1B1B1B;
  font-weight: 700;
  white-space: nowrap;
}

body.store-fluent .store-ck-summary-total {
  padding-top: 0.65rem;
  border-top: 1px dashed #EDEBE9;
  font-weight: 700;
  color: #1B1B1B !important;
}

body.store-fluent .store-ck-summary-total strong {
  color: #0078D4;
  font-size: 1.05rem;
}

body.store-fluent .store-ck-summary-note {
  margin: 0.75rem 0 0;
  font-size: 0.75rem;
  color: #8A8886;
  line-height: 1.5;
}

body.store-fluent .store-ck-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.6rem 0.95rem;
  border: 0;
  border-radius: 9px;
  font-family: inherit;
  font-size: 0.88rem;
  font-weight: 650;
  cursor: pointer;
  text-decoration: none !important;
  transition: background 160ms ease, transform 160ms ease, color 160ms ease;
}

body.store-fluent .store-ck-btn--primary {
  background: #0078D4;
  color: #fff !important;
}

body.store-fluent .store-ck-btn--primary:hover {
  background: #106EBE;
  color: #fff !important;
  transform: translateY(-1px);
}

body.store-fluent .store-ck-btn--disabled,
body.store-fluent .store-ck-btn:disabled,
body.store-fluent button.store-ck-btn--disabled {
  background: #C8C6C4 !important;
  color: #605E5C !important;
  opacity: 0.75;
  cursor: not-allowed !important;
  transform: none !important;
  pointer-events: auto;
}

body.store-fluent .store-ck-btn--disabled:hover,
body.store-fluent .store-ck-btn:disabled:hover,
body.store-fluent button.store-ck-btn--disabled:hover {
  background: #C8C6C4 !important;
  color: #605E5C !important;
  transform: none !important;
  cursor: not-allowed !important;
}

body.store-fluent .store-ck-btn--soft {
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
}

body.store-fluent .store-ck-btn--soft:hover {
  background: rgba(0, 120, 212, 0.16);
}

body.store-fluent .store-ck-btn--danger-ghost {
  background: rgba(164, 38, 44, 0.1);
  color: #A4262C !important;
  border: 0;
}

body.store-fluent .store-ck-btn--danger-ghost:hover {
  background: rgba(164, 38, 44, 0.16);
}

body.store-fluent .store-ck-btn--block {
  width: 100%;
}

body.store-fluent .store-ck-alert {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(0, 120, 212, 0.08) 0%, rgba(0, 120, 212, 0.02) 55%, #fff 100%);
  border: 1px solid rgba(0, 120, 212, 0.14);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
  color: #252423;
}

body.store-fluent .store-ck-alert--address {
  background:
    linear-gradient(135deg, rgba(255, 185, 0, 0.14) 0%, rgba(255, 185, 0, 0.03) 55%, #fff 100%);
  border-color: rgba(255, 185, 0, 0.35);
}

body.store-fluent .store-ck-alert-icon {
  flex: 0 0 auto;
  width: 2.55rem;
  height: 2.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
  font-size: 1.35rem;
}

body.store-fluent .store-ck-alert--address .store-ck-alert-icon {
  background: rgba(255, 185, 0, 0.22);
  color: #8A6116;
}

body.store-fluent .store-ck-alert-body {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
  flex: 1 1 auto;
}

body.store-fluent .store-ck-alert-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #8A8886;
  letter-spacing: 0.01em;
}

body.store-fluent .store-ck-alert-value {
  font-size: 0.95rem;
  font-weight: 750;
  color: #201F1E;
  line-height: 1.35;
}

body.store-fluent .store-ck-alert--address .store-ck-alert-value {
  color: #8A6116;
}

body.store-fluent .store-ck-alert .store-ck-btn,
body.store-fluent .store-ck-alert .store-ck-hero-action {
  flex: 0 0 auto;
  white-space: nowrap;
}

body.store-fluent .store-ck-alert-text {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.45rem;
  color: #8A6116;
  font-size: 0.88rem;
  font-weight: 600;
}

@media (max-width: 560px) {
  body.store-fluent .store-ck-alert .store-ck-btn,
  body.store-fluent .store-ck-alert .store-ck-hero-action {
    width: 100%;
    margin-inline-start: 3.4rem;
  }
}

body.store-fluent .store-ck-empty {
  text-align: center;
  padding: 2.75rem 1.25rem;
}

body.store-fluent .store-ck-empty-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 0.75rem;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
}

body.store-fluent .store-ck-empty-icon .mdi {
  font-size: 1.75rem;
  line-height: 1;
}

body.store-fluent .store-ck-empty h2 {
  margin: 0 0 0.35rem;
  font-size: 1.1rem;
  font-weight: 750;
  color: #1B1B1B;
}

body.store-fluent .store-ck-empty p {
  margin: 0 0 1rem;
  color: #605E5C;
  font-size: 0.88rem;
}

/* Shopping address / pack */
body.store-fluent .store-ck-address {
  padding: 1rem 1.1rem 1.15rem;
}

body.store-fluent .store-ck-address-hint {
  margin: 0 0 0.75rem;
  color: #605E5C;
  font-size: 0.86rem;
}

body.store-fluent .store-ck-address-list {
  display: grid;
  gap: 0.7rem;
}

body.store-fluent .store-ck-address-option {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: start;
  padding: 0.9rem 1rem;
  border: 1px solid #E1DFDD;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

body.store-fluent .store-ck-address-option:hover {
  border-color: rgba(0, 120, 212, 0.35);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

body.store-fluent .store-ck-address-option.is-selected {
  border-color: rgba(0, 120, 212, 0.35);
  background:
    linear-gradient(180deg, rgba(0, 120, 212, 0.06) 0%, #fff 60%);
  box-shadow: 0 0 0 1px rgba(0, 120, 212, 0.12);
}

body.store-fluent .store-ck-address-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.store-fluent .store-ck-address-option-check {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1.5px solid #C8C6C4;
  background: #fff;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.15rem;
  flex-shrink: 0;
  transition: background 160ms ease, border-color 160ms ease;
}

body.store-fluent .store-ck-address-option-check .mdi,
body.store-fluent .store-ck-address-option-check .mdi::before {
  color: #fff !important;
  opacity: 0;
}

body.store-fluent .store-ck-address-option.is-selected .store-ck-address-option-check {
  background: #107C10;
  border-color: #107C10;
  color: #fff;
}

body.store-fluent .store-ck-address-option.is-selected .store-ck-address-option-check .mdi,
body.store-fluent .store-ck-address-option.is-selected .store-ck-address-option-check .mdi::before {
  color: #fff !important;
  opacity: 1;
}

body.store-fluent .store-ck-address-option-body {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

body.store-fluent .store-ck-address-option-top {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

body.store-fluent .store-ck-address-option-top strong {
  font-size: 0.95rem;
  color: #252423;
}

body.store-fluent .store-ck-address-selected-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  background: rgba(16, 124, 16, 0.12);
  color: #0B6A0B;
  font-size: 0.72rem;
  font-weight: 700;
}

body.store-fluent .store-ck-address-option .store-ck-address-phone,
body.store-fluent .store-ck-address-option .store-ck-address-line {
  display: block;
  margin: 0;
  font-size: 0.84rem;
  color: #605E5C;
  line-height: 1.5;
}

body.store-fluent .store-ck-address-option .store-ck-address-line {
  color: #252423;
}

body.store-fluent .store-ck-address-delete {
  align-self: start;
  flex-shrink: 0;
}

body.store-fluent .store-ck-address-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85rem;
  padding: 1rem;
  border: 1px solid rgba(0, 120, 212, 0.22);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(0, 120, 212, 0.05) 0%, #fff 55%);
}

body.store-fluent .store-ck-address-badge {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #107C10;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

body.store-fluent .store-ck-address-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.45rem;
}

body.store-fluent .store-ck-address-top p {
  margin: 0;
  font-size: 0.9rem;
  color: #605E5C;
}

body.store-fluent .store-ck-address-actions {
  display: inline-flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

body.store-fluent .store-ck-address-phone,
body.store-fluent .store-ck-address-line {
  margin: 0.25rem 0 0;
  font-size: 0.86rem;
  color: #252423;
  line-height: 1.55;
}

body.store-fluent .store-ck-table-form {
  display: grid;
  gap: 0.45rem;
  max-width: 420px;
}

body.store-fluent .store-ck-field-label {
  font-size: 0.86rem;
  font-weight: 650;
  color: #252423;
}

body.store-fluent .store-ck-select {
  height: 42px;
  border: 1px solid #E1DFDD;
  border-radius: 9px;
  padding: 0 0.75rem;
  font-family: inherit;
  background: #fff;
}

body.store-fluent .store-ck-select:focus {
  outline: none;
  border-color: #0078D4;
  box-shadow: 0 0 0 2px rgba(0, 120, 212, 0.2);
}

body.store-fluent .store-ck-pack-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0.85rem 1.1rem 0;
  padding: 0.4rem 0.7rem;
  border-radius: 8px;
  background: #F3F2F1;
  color: #605E5C;
  font-size: 0.8rem;
  font-weight: 650;
}

body.store-fluent .store-ck-pack-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.75rem;
  padding: 0.85rem 1.1rem 1.15rem;
}

body.store-fluent .store-ck-pack-item {
  display: grid;
  gap: 0.4rem;
  padding: 0.65rem;
  border: 1px solid #EDEBE9;
  border-radius: 12px;
  background: #FAFBFC;
  text-decoration: none !important;
  color: inherit !important;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.store-fluent .store-ck-pack-item:hover {
  border-color: rgba(0, 120, 212, 0.35);
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.06);
}

body.store-fluent .store-ck-pack-item img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 9px;
  background: #fff;
}

body.store-fluent .store-ck-pack-title {
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.4;
  color: #1B1B1B;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.store-fluent .store-ck-pack-count {
  font-size: 0.75rem;
  color: #0078D4;
  font-weight: 700;
}

/* Checkout modals on storefront pages */
body.store-fluent.store-cart-page .modal.is-open,
body.store-fluent.store-shopping-page .modal.is-open {
  display: flex !important;
  align-items: center;
  justify-content: center;
  z-index: 1400;
}

body.store-fluent.store-cart-page .modal-box.user-modal-box,
body.store-fluent.store-shopping-page .modal-box.user-modal-box {
  border-radius: 14px;
  overflow: hidden;
  max-height: calc(100vh - 2.5rem);
}

/* ---------- Product detail ---------- */
body.store-fluent.store-product-page .store-pd-breadcrumb {
  margin-bottom: 0.85rem;
}

body.store-fluent.store-product-page .store-pd-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.8rem;
  color: #8A8886;
}

body.store-fluent.store-product-page .store-pd-breadcrumb li:not(:last-child)::after {
  content: "/";
  margin-right: 0.35rem;
  color: #C8C6C4;
}

body.store-fluent.store-product-page .store-pd-breadcrumb a {
  color: #605E5C !important;
  text-decoration: none !important;
}

body.store-fluent.store-product-page .store-pd-breadcrumb a:hover {
  color: #0078D4 !important;
}

body.store-fluent.store-product-page .store-pd-layout {
  display: grid !important;
  grid-template-columns: minmax(260px, 400px) minmax(0, 1fr);
  gap: 1.15rem;
  margin-bottom: 1rem;
  align-items: start;
  width: 100% !important;
  float: none !important;
  clear: both;
}

body.store-fluent.store-product-page .store-pd-gallery,
body.store-fluent.store-product-page .store-pd-info,
body.store-fluent.store-product-page .store-pd-panel {
  background: #fff;
  border: 1px solid #E8E8EA;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

body.store-fluent.store-product-page .store-pd-gallery {
  padding: 1rem;
  position: relative;
  z-index: 1;
}

body.store-fluent.store-product-page .store-pd-gallery-main {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background: #F7F7F7;
  border: 1px solid #EDEBE9;
  aspect-ratio: 1;
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Kill elevateZoom leftovers if any script still injects them */
body.store-fluent.store-product-page .ZoomContainer,
body.store-fluent.store-product-page .zoomWindowContainer,
body.store-fluent.store-product-page .zoomWindow,
body.store-fluent.store-product-page .zoomLens {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.store-fluent.store-product-page .zoomWrapper {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  overflow: hidden !important;
}

body.store-fluent.store-product-page .store-pd-gallery-main img,
body.store-fluent.store-product-page .store-pd-main-img,
body.store-fluent.store-product-page #store-pd-main-img,
body.store-fluent.store-product-page #img-product-zoom {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

body.store-fluent.store-product-page .store-pd-thumbs-wrap {
  margin-top: 0.75rem;
  width: 100% !important;
  float: none !important;
}

body.store-fluent.store-product-page .store-pd-thumbs {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  gap: 0.5rem;
}

body.store-fluent.store-product-page .store-pd-thumb {
  display: block;
  width: 100%;
  padding: 0;
  border: 1px solid #EDEBE9;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  cursor: pointer;
}

body.store-fluent.store-product-page .store-pd-thumb.is-active {
  border-color: #0078D4;
  box-shadow: 0 0 0 1px #0078D4;
}

body.store-fluent.store-product-page .store-pd-thumb img {
  width: 100% !important;
  height: 72px !important;
  object-fit: cover;
  display: block;
}

body.store-fluent.store-product-page .store-pd-gallery-actions {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin-top: 0.85rem;
}

body.store-fluent.store-product-page .store-pd-icon-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.45rem 0.7rem;
  border: 1px solid #E1DFDD;
  border-radius: 9px;
  background: #fff;
  color: #252423 !important;
  font-size: 0.8rem;
  font-weight: 650;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none !important;
}

body.store-fluent.store-product-page .store-pd-icon-btn:hover {
  border-color: #0078D4;
  color: #0078D4 !important;
}

body.store-fluent.store-product-page .store-pd-icon-btn .mdi.text-danger {
  color: #A4262C !important;
}

body.store-fluent.store-product-page .store-pd-info {
  padding: 1.15rem 1.2rem 1.25rem;
  display: grid;
  gap: 0.85rem;
}

body.store-fluent.store-product-page .store-pd-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  font-size: 0.8rem;
  color: #8A8886;
}

body.store-fluent.store-product-page .store-pd-meta a {
  color: #0078D4 !important;
  text-decoration: none !important;
  font-weight: 650;
}

body.store-fluent.store-product-page .store-pd-title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 750;
  color: #1B1B1B;
  letter-spacing: -0.02em;
  line-height: 1.4;
}

body.store-fluent.store-product-page .store-pd-title-en {
  margin: 0;
  font-size: 0.86rem;
  color: #8A8886;
}

body.store-fluent.store-product-page .store-pd-variants {
  display: grid;
  gap: 0.85rem;
  padding: 0.85rem 0;
  border-top: 1px solid #F0F0F0;
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent.store-product-page .store-pd-variant-label {
  display: block;
  margin-bottom: 0.45rem;
  font-size: 0.84rem;
  font-weight: 700;
  color: #252423;
}

body.store-fluent.store-product-page .store-pd-colors,
body.store-fluent.store-product-page .store-pd-sizes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

body.store-fluent.store-product-page .store-pd-color {
  position: relative;
  display: inline-flex;
  cursor: pointer;
}

body.store-fluent.store-product-page .store-pd-color input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.store-fluent.store-product-page .store-pd-color .ui-variant-shape {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px #E1DFDD;
  display: block;
}

body.store-fluent.store-product-page .store-pd-color input:checked + .ui-variant-check,
body.store-fluent.store-product-page .store-pd-color input:checked ~ .ui-variant-shape,
body.store-fluent.store-product-page .store-pd-color:has(input:checked) .ui-variant-shape {
  box-shadow: 0 0 0 2px #0078D4;
}

body.store-fluent.store-product-page .store-pd-color .ui-variant-check {
  display: none;
}

body.store-fluent.store-product-page .size-option {
  cursor: pointer;
}

body.store-fluent.store-product-page .size-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.store-fluent.store-product-page .size-option span {
  display: inline-flex;
  min-width: 44px;
  align-items: center;
  justify-content: center;
  padding: 0.4rem 0.7rem;
  border: 1px solid #E1DFDD;
  border-radius: 9px;
  background: #fff;
  font-size: 0.84rem;
  font-weight: 650;
  color: #252423;
}

body.store-fluent.store-product-page .size-option input:checked + span {
  border-color: #0078D4;
  background: rgba(0, 120, 212, 0.08);
  color: #0078D4;
}

body.store-fluent.store-product-page .store-pd-buy {
  margin-top: 0.25rem;
  padding: 1rem;
  border-radius: 12px;
  border: 1px solid rgba(0, 120, 212, 0.2);
  background:
    linear-gradient(180deg, rgba(0, 120, 212, 0.06) 0%, #fff 48%);
}

body.store-fluent.store-product-page .store-pd-buy-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.55rem;
  font-size: 0.86rem;
  color: #252423;
}

body.store-fluent.store-product-page .store-pd-buy-row .mdi {
  color: #0078D4;
  font-size: 1.05rem;
}

body.store-fluent.store-product-page .store-pd-buy-label {
  color: #8A8886;
  font-size: 0.78rem;
  font-weight: 650;
  width: 100%;
}

body.store-fluent.store-product-page .store-pd-buy-link {
  margin-right: auto;
  color: #0078D4 !important;
  font-size: 0.78rem;
  font-weight: 650;
  text-decoration: none !important;
}

body.store-fluent.store-product-page .store-pd-chip {
  margin-right: auto;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  background: rgba(16, 124, 16, 0.1);
  color: #107C10;
  font-size: 0.72rem;
  font-weight: 700;
}

body.store-fluent.store-product-page .store-pd-price-block {
  margin: 0.75rem 0 0.85rem;
}

body.store-fluent.store-product-page .store-pd-price {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  font-size: 1.55rem;
  font-weight: 750;
  color: #1B1B1B;
}

body.store-fluent.store-product-page .store-pd-price small {
  font-size: 0.8rem;
  font-weight: 650;
  color: #8A8886;
}

body.store-fluent.store-product-page .store-pd-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
  margin-top: 0.45rem;
  padding: 0.7rem 1rem;
  border: 0;
  border-radius: 10px;
  background: #0078D4;
  color: #fff !important;
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 700;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 160ms ease, transform 160ms ease;
}

body.store-fluent.store-product-page .store-pd-cta:hover {
  background: #106EBE;
  color: #fff !important;
  transform: translateY(-1px);
}

body.store-fluent.store-product-page .store-pd-cta--soft {
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
}

body.store-fluent.store-product-page .store-pd-cta--soft:hover {
  background: rgba(0, 120, 212, 0.16);
  color: #0078D4 !important;
}

body.store-fluent.store-product-page .store-pd-cta--sm {
  width: auto;
  margin: 0;
  padding: 0.45rem 0.75rem;
  font-size: 0.8rem;
  border-radius: 8px;
}

body.store-fluent.store-product-page .store-pd-panel {
  margin-bottom: 1rem;
  overflow: hidden;
}

body.store-fluent.store-product-page .store-pd-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.95rem 1.1rem;
  border-bottom: 1px solid #F0F0F0;
}

body.store-fluent.store-product-page .store-pd-panel-title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.02rem;
  font-weight: 700;
  color: #1B1B1B;
}

body.store-fluent.store-product-page .store-pd-panel-title .mdi {
  color: #0078D4;
}

body.store-fluent.store-product-page .store-seller-list {
  display: grid;
  gap: 0.65rem;
  padding: 0.95rem 1.1rem;
}

body.store-fluent.store-product-page .store-seller-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr auto;
  gap: 0.65rem;
  align-items: center;
  padding: 0.85rem 0.95rem;
  border: 1px solid #EDEBE9;
  border-radius: 12px;
  background: #FAFBFC;
}

body.store-fluent.store-product-page .store-seller-row--active {
  border-color: rgba(0, 120, 212, 0.35);
  background: rgba(0, 120, 212, 0.04);
}

body.store-fluent.store-product-page .store-seller-cell {
  font-size: 0.84rem;
  color: #252423;
}

body.store-fluent.store-product-page .store-seller-cell--name a {
  color: #1B1B1B !important;
  font-weight: 700;
  text-decoration: none !important;
}

body.store-fluent.store-product-page .store-seller-cell--price {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
}

body.store-fluent.store-product-page .store-seller-cell--price strong {
  font-size: 0.95rem;
}

body.store-fluent.store-product-page .store-seller-cell--price small {
  color: #8A8886;
  font-size: 0.72rem;
}

body.store-fluent.store-product-page .store-seller-more {
  padding: 0 1.1rem 1rem;
  font-size: 0.84rem;
}

body.store-fluent.store-product-page .store-seller-more a {
  color: #0078D4 !important;
  font-weight: 650;
  text-decoration: none !important;
}

body.store-fluent.store-product-page .store-pd-tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin: 0;
  padding: 0.75rem 1rem 0;
  border-bottom: 1px solid #F0F0F0 !important;
  list-style: none;
}

body.store-fluent.store-product-page .store-pd-tablist .nav-link {
  border: 0 !important;
  border-radius: 9px 9px 0 0 !important;
  padding: 0.65rem 0.95rem !important;
  color: #605E5C !important;
  font-weight: 650;
  background: transparent !important;
}

body.store-fluent.store-product-page .store-pd-tablist .nav-link.active {
  color: #0078D4 !important;
  background: rgba(0, 120, 212, 0.08) !important;
  box-shadow: inset 0 -2px 0 #0078D4;
}

body.store-fluent.store-product-page .store-pd-tabcontent {
  padding: 1.1rem;
}

body.store-fluent.store-product-page .store-pd-section-title {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  font-weight: 700;
  color: #1B1B1B;
}

body.store-fluent.store-product-page .store-pd-section-title span {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.82rem;
  font-weight: 500;
  color: #8A8886;
}

body.store-fluent.store-product-page .store-pd-review {
  font-size: 0.92rem;
  line-height: 1.75;
  color: #252423;
}

body.store-fluent.store-product-page .store-pd-review .mask-handler {
  color: #0078D4 !important;
  font-weight: 650;
}

@media (max-width: 991.98px) {
  body.store-fluent .store-ck-layout,
  body.store-fluent.store-product-page .store-pd-layout {
    grid-template-columns: 1fr;
  }

  body.store-fluent .store-ck-aside {
    position: static;
  }

  body.store-fluent.store-product-page .store-seller-row {
    grid-template-columns: 1fr 1fr;
  }

  body.store-fluent.store-product-page .store-seller-cell--action {
    grid-column: 1 / -1;
  }
}

@media (max-width: 575.98px) {
  body.store-fluent .store-ck-item {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  body.store-fluent .store-ck-thumb {
    width: 72px;
    height: 72px;
  }

  body.store-fluent.store-product-page .store-seller-row {
    grid-template-columns: 1fr;
  }
}

body.store-fluent .store-ck-fulfillment-panel {
  border-top: 1px solid #F0F0F0;
}

body.store-fluent .store-ck-panel-head--sub {
  border-bottom: 0;
  padding-bottom: 0;
}

body.store-fluent .store-ck-panel-head--sub .store-ck-panel-title {
  font-size: 0.95rem;
}

/* ---------- Selectable method cards (payment / address) ---------- */
body.store-fluent .store-pay-methods {
  display: grid;
  gap: 0.75rem;
  padding: 1rem 1.1rem 1.15rem;
}

body.store-fluent .store-pay-method {
  position: relative;
  display: block;
  cursor: pointer;
  margin: 0;
}

body.store-fluent .store-pay-method input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

body.store-fluent .store-pay-method-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: center;
  padding: 0.95rem 1rem;
  border: 1px solid #EDEBE9;
  border-radius: 12px;
  background: #FAFBFC;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

body.store-fluent .store-pay-method:hover .store-pay-method-card {
  border-color: rgba(0, 120, 212, 0.35);
}

body.store-fluent .store-pay-method input:checked + .store-pay-method-card {
  border-color: rgba(0, 120, 212, 0.45);
  background: linear-gradient(180deg, rgba(0, 120, 212, 0.07) 0%, #fff 55%);
  box-shadow: 0 0 0 1px rgba(0, 120, 212, 0.2);
}

body.store-fluent .store-pay-method-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  flex-shrink: 0;
}

body.store-fluent .store-pay-method-icon .mdi {
  font-size: 1.35rem;
  line-height: 1;
}

body.store-fluent .store-pay-method-icon--credit {
  background: rgba(16, 124, 16, 0.1);
  color: #107C10;
}

body.store-fluent .store-pay-method-body {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

body.store-fluent .store-pay-method-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #1B1B1B;
  line-height: 1.4;
}

body.store-fluent .store-pay-method-desc {
  font-size: 0.8rem;
  color: #605E5C;
  line-height: 1.45;
}

body.store-fluent .store-pay-method-check {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.35rem;
  height: 1.35rem;
  color: #C8C6C4 !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.store-fluent .store-pay-method-check .mdi,
body.store-fluent .store-pay-method-check .mdi::before {
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  margin: 0 !important;
}

body.store-fluent .store-pay-method input:checked + .store-pay-method-card .store-pay-method-check {
  color: #0078D4 !important;
}

body.store-fluent .store-pay-method input:checked + .store-pay-method-card .store-pay-method-check .mdi,
body.store-fluent .store-pay-method input:checked + .store-pay-method-card .store-pay-method-check .mdi::before {
  color: inherit !important;
}

body.store-fluent .store-pay-method-remove-link {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  margin-top: 0.2rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #A19F9D;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 650;
  cursor: pointer;
  width: fit-content;
}

body.store-fluent .store-pay-method-remove-link:hover {
  color: #D13438;
}

body.store-fluent .store-pay-method-remove-link .mdi {
  font-size: 0.95rem;
  line-height: 1;
}

body.store-fluent.store-pay-page .store-ck-items--readonly .store-ck-item {
  padding-inline-start: 0.9rem;
}

@media (max-width: 575.98px) {
  body.store-fluent .store-pay-method-card {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
  }

  /* Keep check icon identical to desktop (color + size + no background chrome) */
  body.store-fluent .store-pay-method-check {
    display: inline-flex !important;
    width: 1.35rem !important;
    height: 1.35rem !important;
    font-size: 1.35rem !important;
    color: #C8C6C4 !important;
    background: transparent !important;
  }

  body.store-fluent .store-pay-method input:checked + .store-pay-method-card .store-pay-method-check {
    color: #0078D4 !important;
  }
}

/* ---------- Store toast notifications ---------- */
body.store-fluent .store-toast-container {
  z-index: 12000 !important;
}

body.store-fluent .swal2-container.store-toast-container {
  padding: 1rem !important;
}

body.store-fluent .store-toast.swal2-popup,
body.store-fluent .swal2-popup.store-toast {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: min(420px, calc(100vw - 1.5rem)) !important;
  max-width: 420px !important;
  padding: 0 !important;
  margin: 0.5rem auto 0 !important;
  border-radius: 14px !important;
  border: 1px solid #E8E8EA !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14) !important;
  overflow: hidden;
  font-family: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
}

body.store-fluent .store-toast.swal2-toast {
  flex-direction: column !important;
}

body.store-fluent .store-toast .swal2-header,
body.store-fluent .store-toast .swal2-title,
body.store-fluent .store-toast .swal2-icon,
body.store-fluent .store-toast .swal2-image,
body.store-fluent .store-toast .swal2-actions,
body.store-fluent .store-toast .swal2-footer {
  display: none !important;
}

body.store-fluent .store-toast .swal2-html-container,
body.store-fluent .store-toast-content {
  margin: 0 !important;
  padding: 0 !important;
  width: 100%;
  display: block !important;
  text-align: right !important;
  color: inherit !important;
}

body.store-fluent .store-toast-inner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85rem;
  align-items: center;
  padding: 0.95rem 1.1rem 1.05rem;
}

body.store-fluent .store-toast-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

body.store-fluent .store-toast-icon .mdi {
  font-size: 1.4rem;
  line-height: 1;
}

body.store-fluent .store-toast-text {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
  padding-left: 1.5rem;
}

body.store-fluent .store-toast-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.3;
}

body.store-fluent .store-toast-message {
  font-size: 0.95rem;
  font-weight: 650;
  color: #252423;
  line-height: 1.45;
}

body.store-fluent .store-toast .store-toast-close,
body.store-fluent .store-toast .swal2-close {
  top: 0.45rem !important;
  left: 0.45rem !important;
  right: auto !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  font-size: 1.25rem !important;
  color: #8A8886 !important;
  box-shadow: none !important;
}

body.store-fluent .store-toast .store-toast-close:hover,
body.store-fluent .store-toast .swal2-close:hover {
  background: #F3F2F1 !important;
  color: #323130 !important;
}

body.store-fluent .store-toast .store-toast-progress,
body.store-fluent .store-toast .swal2-timer-progress-bar {
  height: 3px !important;
  background: currentColor !important;
  opacity: 0.35;
}

body.store-fluent .store-toast--success {
  border-color: rgba(16, 124, 16, 0.28) !important;
}

body.store-fluent .store-toast--success .store-toast-icon {
  background: rgba(16, 124, 16, 0.12);
  color: #107C10;
}

body.store-fluent .store-toast--success .store-toast-label,
body.store-fluent .store-toast--success .store-toast-progress,
body.store-fluent .store-toast--success .swal2-timer-progress-bar {
  color: #107C10;
}

body.store-fluent .store-toast--error {
  border-color: rgba(209, 52, 56, 0.28) !important;
}

body.store-fluent .store-toast--error .store-toast-icon {
  background: rgba(209, 52, 56, 0.12);
  color: #D13438;
}

body.store-fluent .store-toast--error .store-toast-label,
body.store-fluent .store-toast--error .store-toast-progress,
body.store-fluent .store-toast--error .swal2-timer-progress-bar {
  color: #D13438;
}

body.store-fluent .store-toast--warning {
  border-color: rgba(255, 185, 0, 0.45) !important;
}

body.store-fluent .store-toast--warning .store-toast-icon {
  background: rgba(255, 185, 0, 0.16);
  color: #8A6116;
}

body.store-fluent .store-toast--warning .store-toast-label,
body.store-fluent .store-toast--warning .store-toast-progress,
body.store-fluent .store-toast--warning .swal2-timer-progress-bar {
  color: #8A6116;
}

body.store-fluent .store-toast--info {
  border-color: rgba(0, 120, 212, 0.28) !important;
}

body.store-fluent .store-toast--info .store-toast-icon {
  background: rgba(0, 120, 212, 0.12);
  color: #0078D4;
}

body.store-fluent .store-toast--info .store-toast-label,
body.store-fluent .store-toast--info .store-toast-progress,
body.store-fluent .store-toast--info .swal2-timer-progress-bar {
  color: #0078D4;
}

@keyframes store-toast-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes store-toast-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-8px); }
}

body.store-fluent .store-toast.store-toast-in {
  animation: store-toast-in 220ms ease both;
}

body.store-fluent .store-toast.store-toast-out {
  animation: store-toast-out 160ms ease both;
}

/* ---------- Payment result (verification / nocomplate) ---------- */
body.store-fluent.store-verify-page .store-verify {
  padding-bottom: 2.5rem;
}

body.store-fluent .store-verify-card {
  max-width: 640px;
  margin: 0 auto;
  padding: 2rem 1.5rem 1.75rem;
  text-align: center;
  background: #fff;
  border: 1px solid #E8E8EA;
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.06);
  border-top: 3px solid #0078D4;
}

body.store-fluent .store-verify-card--success {
  border-top-color: #107C10;
}

body.store-fluent .store-verify-card--danger {
  border-top-color: #C42B1C;
}

body.store-fluent .store-verify-icon {
  width: 4.25rem;
  height: 4.25rem;
  margin: 0 auto 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  background: rgba(16, 124, 16, 0.12);
  color: #0B6A0B;
  font-size: 2.35rem;
  line-height: 1;
}

body.store-fluent .store-verify-card--danger .store-verify-icon {
  background: rgba(196, 43, 28, 0.12);
  color: #A4262C;
}

body.store-fluent .store-verify-title {
  margin: 0 0 0.45rem;
  font-size: 1.2rem;
  font-weight: 750;
  color: #1B1B1B;
}

body.store-fluent .store-verify-lead {
  margin: 0 0 0.55rem;
  font-size: 0.95rem;
  font-weight: 650;
  color: #323130;
  line-height: 1.6;
}

body.store-fluent .store-verify-desc {
  margin: 0 auto 1.15rem;
  max-width: 34rem;
  font-size: 0.86rem;
  color: #605E5C;
  line-height: 1.7;
}

body.store-fluent .store-verify-desc strong {
  color: #0078D4;
  font-weight: 700;
}

body.store-fluent .store-verify-note {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  text-align: right;
  margin: 0 auto 1.35rem;
  max-width: 34rem;
  padding: 0.85rem 1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(0, 120, 212, 0.08) 0%, rgba(0, 120, 212, 0.02) 55%, #fff 100%);
  border: 1px solid rgba(0, 120, 212, 0.14);
  color: #323130;
  font-size: 0.84rem;
  line-height: 1.6;
}

body.store-fluent .store-verify-note .mdi {
  flex: 0 0 auto;
  margin-top: 0.1rem;
  color: #0078D4;
  font-size: 1.2rem;
}

body.store-fluent .store-verify-note--warn {
  background: linear-gradient(135deg, rgba(255, 185, 0, 0.14) 0%, rgba(255, 185, 0, 0.03) 55%, #fff 100%);
  border-color: rgba(255, 185, 0, 0.35);
}

body.store-fluent .store-verify-note--warn .mdi {
  color: #8A6116;
}

body.store-fluent .store-verify-error {
  margin: 0 auto 1rem;
  max-width: 34rem;
  padding: 0.7rem 0.9rem;
  border-radius: 10px;
  background: rgba(196, 43, 28, 0.08);
  color: #A4262C;
  font-size: 0.8rem;
  text-align: left;
  word-break: break-word;
}

body.store-fluent .store-verify-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.65rem;
}

@media (max-width: 560px) {
  body.store-fluent .store-verify-card {
    padding: 1.5rem 1rem 1.35rem;
  }

  body.store-fluent .store-verify-actions {
    flex-direction: column;
  }

  body.store-fluent .store-verify-actions .store-ck-btn,
  body.store-fluent .store-verify-actions .store-ck-hero-action {
    width: 100%;
    justify-content: center;
  }
}

/* ============================================================
   Form UX — labels, LTR credentials / phone fields
   ============================================================ */
body.store-fluent label,
body.store-fluent .store-auth-label,
body.store-fluent .user-modal-label,
body.store-fluent .form-group > label,
body.store-fluent label.control-label {
  cursor: pointer;
}

body.store-fluent input[type="password"],
body.store-fluent input[type="tel"],
body.store-fluent input[type="email"],
body.store-fluent input[inputmode="tel"],
body.store-fluent input[inputmode="numeric"]:not(.js-product-qty),
body.store-fluent input[autocomplete="username"],
body.store-fluent input[autocomplete="tel"],
body.store-fluent input[autocomplete="email"],
body.store-fluent input[autocomplete="current-password"],
body.store-fluent input[autocomplete="new-password"],
body.store-fluent input[autocomplete="one-time-code"],
body.store-fluent input[name*="Phone" i],
body.store-fluent input[name*="Password" i],
body.store-fluent input[name*="Email" i],
body.store-fluent input[name*="Mobile" i],
body.store-fluent input[name*="Postal" i],
body.store-fluent input[id*="Phone" i],
body.store-fluent input[id*="Password" i],
body.store-fluent input[id*="Email" i],
body.store-fluent input[id*="password" i],
body.store-fluent input[id*="email-phone" i],
body.store-fluent .store-auth-input--code,
body.store-fluent .user-modal-input--ltr {
  direction: ltr !important;
  text-align: left !important;
  unicode-bidi: isolate;
}

body.store-fluent .store-product-qty .js-product-qty {
  direction: ltr !important;
  text-align: center !important;
  unicode-bidi: isolate;
}

body.store-fluent .store-product-price-total .js-product-total-value {
  text-align: center !important;
}

/* ============================================================
   Info pages — FAQ / Rules / About / Contact (Fluent)
   ============================================================ */
body.store-fluent.store-info-page .store-main.store-info {
  padding: 1.5rem 0 3rem;
  background:
    linear-gradient(180deg, #EAF3FB 0%, #F4F5F7 28%, #F4F5F7 100%);
  min-height: 50vh;
}

body.store-fluent .store-info-hero {
  position: relative;
  display: grid;
  gap: 0.55rem;
  padding: 1.55rem 1.45rem 1.4rem;
  margin-bottom: 1.25rem;
  background:
    linear-gradient(145deg, rgba(0, 120, 212, 0.12) 0%, rgba(255, 255, 255, 0.98) 48%),
    #fff;
  border: 1px solid #E6E8EC;
  border-top: 3px solid #0078D4;
  border-radius: 18px;
  box-shadow:
    0 1px 2px rgba(15, 35, 70, 0.04),
    0 14px 36px rgba(15, 35, 70, 0.06);
  overflow: hidden;
  animation: storeInfoIn 420ms ease both;
}

body.store-fluent .store-info-hero::after {
  content: "";
  position: absolute;
  inset-inline-end: -48px;
  top: -48px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 120, 212, 0.14) 0%, transparent 70%);
  pointer-events: none;
}

@keyframes storeInfoIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

body.store-fluent .store-info-kicker {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  color: #0078D4;
  letter-spacing: 0.02em;
}

body.store-fluent .store-info-title {
  margin: 0;
  font-size: clamp(1.45rem, 2.4vw, 1.85rem);
  font-weight: 800;
  color: #0F172A;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

body.store-fluent .store-info-lead {
  margin: 0;
  max-width: none;
  font-size: 0.92rem;
  line-height: 1.75;
  color: #605E5C;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 575.98px) {
  body.store-fluent .store-info-lead {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }
}

body.store-fluent .store-info-stack {
  display: grid;
  gap: 0.9rem;
}

body.store-fluent .store-info-card {
  background: #fff;
  border: 1px solid #E6E8EC;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(15, 35, 70, 0.04);
  padding: 1.15rem 1.2rem 1.1rem;
  animation: storeInfoIn 480ms ease both;
}

body.store-fluent .store-info-card-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

body.store-fluent .store-info-card-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  font-size: 1.25rem;
}

body.store-fluent .store-info-card-ico--green {
  background: rgba(16, 124, 16, 0.1);
  color: #0B6A0B;
}

body.store-fluent .store-info-card-ico--amber {
  background: rgba(138, 109, 0, 0.12);
  color: #8A6D00;
}

body.store-fluent .store-info-card-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 750;
  color: #1B1B1B;
  line-height: 1.25;
  display: flex;
  align-items: center;
  min-height: 40px;
}

body.store-fluent .store-info-card-body {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.9;
  color: #323130;
  white-space: pre-wrap;
  word-break: break-word;
}

body.store-fluent .store-info-card-body p {
  margin: 0 0 0.75rem;
}

body.store-fluent .store-info-card-body p:last-child {
  margin-bottom: 0;
}

/* FAQ accordion */
body.store-fluent .store-faq-list {
  display: grid;
  gap: 0.65rem;
}

body.store-fluent .store-faq-item {
  background: #fff;
  border: 1px solid #E6E8EC;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 35, 70, 0.03);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.store-fluent .store-faq-item[open] {
  border-color: rgba(0, 120, 212, 0.35);
  box-shadow: 0 6px 20px rgba(0, 120, 212, 0.08);
}

body.store-fluent .store-faq-item summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.1rem;
  font-size: 0.95rem;
  font-weight: 650;
  color: #1B1B1B;
  line-height: 1.5;
  user-select: none;
}

body.store-fluent .store-faq-item summary::-webkit-details-marker {
  display: none;
}

body.store-fluent .store-faq-item summary::marker {
  content: "";
}

body.store-fluent .store-faq-q-num {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  font-weight: 700;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
}

body.store-fluent .store-faq-q-text {
  flex: 1;
  min-width: 0;
}

body.store-fluent .store-faq-chevron {
  color: #A19F9D;
  font-size: 1.15rem;
  transition: transform 180ms ease, color 180ms ease;
}

body.store-fluent .store-faq-item[open] .store-faq-chevron {
  transform: rotate(-90deg);
  color: #0078D4;
}

body.store-fluent .store-faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 300ms ease;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
}

body.store-fluent .store-faq-item[open] .store-faq-answer {
  grid-template-rows: 1fr;
}

@supports (interpolate-size: allow-keywords) {
  body.store-fluent.store-info-page {
    interpolate-size: allow-keywords;
  }
}

body.store-fluent .store-faq-answer-inner {
  overflow: hidden;
  min-height: 0;
}

body.store-fluent .store-faq-answer-body {
  padding: 0.85rem 1.1rem 1.05rem;
  padding-inline-start: calc(1.1rem + 28px + 0.75rem);
  font-size: 0.88rem;
  line-height: 1.85;
  color: #605E5C;
  border-top: 1px solid #F3F2F1;
}

body.store-fluent .store-info-cta-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 0.35rem;
}

body.store-fluent .store-info-cta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.05rem;
  background: #fff;
  border: 1px solid #E6E8EC;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

body.store-fluent .store-info-cta:hover {
  border-color: rgba(0, 120, 212, 0.35);
  box-shadow: 0 8px 22px rgba(0, 120, 212, 0.1);
  transform: translateY(-1px);
  color: inherit;
  text-decoration: none;
}

body.store-fluent .store-info-cta-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4 !important;
  font-size: 1.3rem;
  flex-shrink: 0;
  margin: 0 !important;
  direction: inherit !important;
  text-align: center !important;
}

body.store-fluent .store-info-cta-ico .mdi,
body.store-fluent .store-info-cta-ico .mdi::before {
  color: inherit !important;
  font-size: 1.3rem !important;
  line-height: 1 !important;
}

body.store-fluent .store-info-cta-ico--green {
  background: rgba(16, 124, 16, 0.1);
  color: #0B6A0B !important;
}

body.store-fluent .store-info-cta-copy {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}

body.store-fluent .store-info-cta strong {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: #1B1B1B;
}

body.store-fluent .store-info-cta-copy em {
  display: block;
  font-style: normal;
  font-size: 0.8rem;
  color: #605E5C;
  direction: ltr;
  text-align: right;
  unicode-bidi: isolate;
}

/* About layout */
body.store-fluent .store-about-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 1.1rem;
  align-items: start;
}

body.store-fluent .store-about-media {
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #E6E8EC;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 35, 70, 0.04);
}

body.store-fluent .store-about-media img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 420px;
  object-fit: cover;
}

/* Contact layout */
body.store-fluent .store-contact-channels {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1rem;
}

body.store-fluent .store-contact-channel {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1.05rem 1rem;
  background: #fff;
  border: 1px solid #E6E8EC;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.store-fluent .store-contact-channel:hover {
  border-color: rgba(0, 120, 212, 0.35);
  box-shadow: 0 8px 22px rgba(0, 120, 212, 0.1);
  color: inherit;
  text-decoration: none;
}

body.store-fluent .store-contact-channel .mdi {
  font-size: 1.4rem;
  color: #0078D4;
  margin-bottom: 0.2rem;
}

body.store-fluent .store-contact-channel strong {
  font-size: 0.9rem;
  color: #1B1B1B;
}

body.store-fluent .store-contact-channel span {
  font-size: 0.82rem;
  color: #605E5C;
  word-break: break-word;
  direction: ltr;
  text-align: right;
  unicode-bidi: isolate;
}

body.store-fluent .store-branch-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

body.store-fluent .store-branch-card {
  background: #fff;
  border: 1px solid #E6E8EC;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(15, 35, 70, 0.04);
}

body.store-fluent .store-branch-card img {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
  background: #F3F2F1;
}

body.store-fluent .store-branch-body {
  padding: 1rem 1.05rem 1.1rem;
  display: grid;
  gap: 0.35rem;
}

body.store-fluent .store-branch-body strong {
  font-size: 1rem;
  color: #1B1B1B;
}

body.store-fluent .store-branch-body p {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.7;
  color: #605E5C;
}

@media (max-width: 991.98px) {
  body.store-fluent .store-about-grid,
  body.store-fluent .store-branch-grid {
    grid-template-columns: 1fr;
  }

  body.store-fluent .store-contact-channels {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.store-fluent .store-info-cta-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  body.store-fluent.store-info-page .store-main.store-info {
    padding: 1rem 0 2.25rem;
  }

  body.store-fluent .store-info-hero {
    padding: 1.2rem 1.1rem 1.15rem;
    border-radius: 14px;
  }

  body.store-fluent .store-contact-channels {
    grid-template-columns: 1fr;
  }

  body.store-fluent .store-faq-answer-body {
    padding-inline-start: 1.1rem;
  }
}

/* ---------- Search page ---------- */
body.store-fluent.store-search-page .store-search-main {
  padding-top: 1.1rem;
}

body.store-fluent .store-search-hero {
  margin-bottom: 1.35rem;
}

body.store-fluent .store-category-tile.is-active .store-category-media {
  border-color: rgba(0, 120, 212, 0.42);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.95) inset,
    0 12px 26px rgba(0, 120, 212, 0.14);
}

body.store-fluent .store-category-tile.is-active .store-category-name {
  color: #0078D4;
}

body.store-fluent .store-search-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.85rem;
}

body.store-fluent .store-search-count {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 650;
  color: #605E5C;
}

body.store-fluent .store-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1rem;
}

body.store-fluent .store-product-grid .store-product-card {
  flex: none;
  width: 100%;
  max-width: none;
  scroll-snap-align: unset;
}

body.store-fluent .store-search-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.35rem;
  padding: 2.4rem 1.2rem;
  border: 1px dashed #E1E1E1;
  border-radius: 16px;
  background: #FAFAFA;
}

body.store-fluent .store-search-empty-ico {
  display: grid;
  place-items: center;
  width: 3.1rem;
  height: 3.1rem;
  margin-bottom: 0.35rem;
  border-radius: 14px;
  background: rgba(0, 120, 212, 0.1);
  color: #0078D4;
  font-size: 1.45rem;
}

body.store-fluent .store-search-empty-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #252423;
}

body.store-fluent .store-search-empty-desc {
  margin: 0;
  font-size: 0.86rem;
  color: #8A8886;
  max-width: 22rem;
}

body.store-fluent #store-search-products.is-loading {
  opacity: 0.55;
  pointer-events: none;
  transition: opacity 160ms ease;
}

@media (max-width: 575.98px) {
  body.store-fluent .store-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
  }
}