/*
 * LS Vita - OPC040084 compatibility layer for OpenCart 4.1.0.4
 * v31
 *
 * Goal: bring the legacy TemplateMela OPC040084 visual language to the
 * OpenCart 4 storefront without copying legacy PHP/TPL/JavaScript internals.
 *
 * Intentionally preserved from the NEW storefront:
 *   - Header/minicart button and dropdown styling
 *   - Product add-to-cart button styling
 *   - Bootstrap menu dropdown structure and dropdown styling
 *
 * Menu change is intentionally limited to the TOP BAR colors and top-level
 * hover treatment. .dropdown-menu is not restyled here.
 */

:root {
  --opc040084-text: #7f7355;
  --opc040084-orange: #ff8106;
  --opc040084-orange-hover: #ff8a00;
  --opc040084-green-top: #a1ce41;
  --opc040084-green-bottom: #6aad38;
  --opc040084-green-border: #6b9f32;
  --opc040084-green-dark: #385b0b;
  --opc040084-warm-bg: #f7f4ed;
  --opc040084-warm-bg-2: #f4f1e7;
  --opc040084-border: #d7d2c2;
}

/* ---------- Legacy OPC040084 typography / palette ---------- */
.lsvita-opc040084 {
  color: var(--opc040084-text);
  font-family: 'Marcellus', Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 1.45;
  background: #fff;
}

.lsvita-opc040084 a {
  color: var(--opc040084-text);
  text-decoration: none;
}

.lsvita-opc040084 a:hover,
.lsvita-opc040084 a:focus {
  color: var(--opc040084-orange-hover);
  text-decoration: none;
}

.lsvita-opc040084 h1,
.lsvita-opc040084 h2,
.lsvita-opc040084 h3,
.lsvita-opc040084 h4,
.lsvita-opc040084 h5,
.lsvita-opc040084 h6 {
  color: var(--opc040084-text);
  font-family: 'Della Respira', Georgia, 'Times New Roman', serif;
  font-weight: 400;
}

.lsvita-opc040084 h1 {
  color: var(--opc040084-orange);
}

/* ---------- Top utility bar ---------- */
.lsvita-opc040084 #top {
  background: var(--opc040084-warm-bg);
  border-bottom: 1px solid #ece8d9;
  margin-bottom: 0;
  padding: 0;
}

.lsvita-opc040084 #top .list-inline-item > a,
.lsvita-opc040084 #top .list-inline-item .dropdown > a,
.lsvita-opc040084 #top .list-inline-item .dropdown > span {
  color: var(--opc040084-text);
}

.lsvita-opc040084 #top .list-inline-item > a:hover,
.lsvita-opc040084 #top .list-inline-item .dropdown > a:hover,
.lsvita-opc040084 #top .list-inline-item .dropdown > span:hover {
  color: var(--opc040084-orange-hover);
}

/* Keep account dropdown itself Bootstrap/OpenCart 4 style. */

/* ---------- Header shell, logo and search ---------- */
.lsvita-opc040084 header {
  padding-top: 12px;
  padding-bottom: 12px;
  background:
    linear-gradient(to bottom, #f7f4ed 0%, #ffffff 37%, #f8f5ee 77%, #f4f1e7 77%, #f4f1e7 100%);
  border-bottom: 1px solid #ece8d9;
}

.lsvita-opc040084 #logo {
  margin: 0;
  min-height: 104px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.lsvita-opc040084 #logo a {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
}

/* Requirement 4: larger than the OpenCart 4 default max-width:200px. */
.lsvita-opc040084 #logo img {
  width: auto;
  max-width: min(270px, 100%);
  max-height: 108px;
  height: auto;
}

/* Recreate the old green search treatment using the current OC4 form markup. */
.lsvita-opc040084 header #search {
  margin-top: 24px;
  margin-bottom: 10px;
}

.lsvita-opc040084 header #search form {
  margin: 0;
  padding: 9px;
  border: 1px solid #8fbe39;
  border-radius: 5px;
  background: linear-gradient(to bottom, var(--opc040084-green-top) 0%, var(--opc040084-green-bottom) 100%);
}

.lsvita-opc040084 header #search .form-control-lg {
  border-color: #eee;
  border-radius: 3px 0 0 3px;
  background: #fff;
  color: var(--opc040084-text);
  box-shadow: none;
}

.lsvita-opc040084 header #search .btn-lg {
  border-color: #ff9630;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(to bottom, #ffa145 0%, #fe8b1a 100%);
  color: #fff;
  text-shadow: none;
}

.lsvita-opc040084 header #search .btn-lg:hover,
.lsvita-opc040084 header #search .btn-lg:focus {
  border-color: #ff8a00;
  background: linear-gradient(to bottom, #ffad5d 0%, #ff8106 100%);
  color: #fff;
}

/*
 * Requirement 2: DO NOT style #cart .btn-lg here.
 * The new OpenCart 4 cart button/dropdown remains exactly on its existing CSS.
 */
.lsvita-opc040084 header #cart {
  margin-top: 24px;
}

/* ---------- Main menu ---------- */
/*
 * Requirement 3: only recolor the menu bar. Dropdown shape/layout remains
 * controlled by the existing OpenCart 4 stylesheet and common/menu.twig.
 */
.lsvita-opc040084 #menu {
  background-color: var(--opc040084-green-bottom);
  background-image: linear-gradient(to bottom, var(--opc040084-green-top) 0%, var(--opc040084-green-bottom) 100%);
  border-color: #a0ce41 var(--opc040084-green-border) #5c8e2a;
  box-shadow: inset 0 1px 0 #c8e861;
}

.lsvita-opc040084 #menu .navbar-nav > li > a {
  color: #fff;
  font-family: 'Della Respira', Georgia, serif;
  text-transform: uppercase;
  text-shadow: none;
}

.lsvita-opc040084 #menu .navbar-nav > li > a:hover,
.lsvita-opc040084 #menu .navbar-nav > li.show > a,
.lsvita-opc040084 #menu .navbar-nav > li > a:focus {
  color: var(--opc040084-green-dark);
  background-color: rgba(255, 255, 255, 0.08);
}

/* Keep no-children items readable because OC4 uses dropdown-item for them. */
.lsvita-opc040084 #menu .navbar-nav > li > a.dropdown-item {
  color: #fff;
}

.lsvita-opc040084 #menu .navbar-nav > li > a.dropdown-item:hover,
.lsvita-opc040084 #menu .navbar-nav > li > a.dropdown-item:focus {
  color: var(--opc040084-green-dark);
  background-color: rgba(255, 255, 255, 0.08);
}

/* IMPORTANT: no .dropdown-menu / .dropdown-inner appearance overrides. */

/* ---------- Content accents from the old theme ---------- */
.lsvita-opc040084 .breadcrumb {
  --bs-breadcrumb-divider-color: #a39982;
  --bs-breadcrumb-item-active-color: #7f7355;
}

.lsvita-opc040084 .breadcrumb a:hover {
  color: var(--opc040084-orange-hover);
}

.lsvita-opc040084 .card,
.lsvita-opc040084 .list-group,
.lsvita-opc040084 .table,
.lsvita-opc040084 .form-control,
.lsvita-opc040084 .form-select {
  --bs-border-color: #ded8ca;
}

.lsvita-opc040084 .form-control:focus,
.lsvita-opc040084 .form-select:focus {
  border-color: #a1ce41;
  box-shadow: 0 0 0 .2rem rgba(161, 206, 65, .16);
}

.lsvita-opc040084 .product-thumb {
  border-color: #e3ded2;
  border-radius: 5px;
  background: #fff;
  box-shadow: none;
}

.lsvita-opc040084 .product-thumb .description h4 a {
  color: var(--opc040084-text);
}

.lsvita-opc040084 .product-thumb .description h4 a:hover {
  color: var(--opc040084-orange-hover);
}

/* Do not restyle .product-thumb .button: keep the new storefront buttons. */

.lsvita-opc040084 .price-new {
  color: #5f8f2f;
}

.lsvita-opc040084 .price-old {
  color: #c96f45;
}

/* ---------- Existing migrated TemplateMela footer ---------- */
/* v27/v28 already ports the original footer; this only harmonizes typography. */
.lsvita-opc040084 .lsvita-legacy-footer {
  color: var(--opc040084-text);
  font-family: 'Marcellus', Arial, Helvetica, sans-serif;
}

/* ---------- Responsive tuning ---------- */
@media (max-width: 991.98px) {
  .lsvita-opc040084 #logo {
    justify-content: center;
    min-height: auto;
    margin-bottom: 8px;
  }

  .lsvita-opc040084 #logo img {
    max-width: min(240px, 100%);
    max-height: 96px;
  }

  .lsvita-opc040084 header #search,
  .lsvita-opc040084 header #cart {
    margin-top: 10px;
  }
}

@media (max-width: 767.98px) {
  .lsvita-opc040084 header {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .lsvita-opc040084 #logo img {
    max-width: min(225px, 85vw);
  }

  .lsvita-opc040084 #menu .navbar-nav > li > a {
    text-transform: none;
  }
}

/* ========================================================================== */
/* LS Vita v32 refinements - 2026-10-06                                      */
/* ========================================================================== */

/* 1) Search and NEW cart button: vertically line up without restyling cart. */
.lsvita-opc040084 header .lsvita-header-row {
  align-items: center !important;
}

.lsvita-opc040084 header #search,
.lsvita-opc040084 header #cart {
  margin-top: 0;
  margin-bottom: 0 !important;
}

.lsvita-opc040084 header #search form {
  margin-bottom: 0 !important;
}

/* The legacy OPC040084 search treatment now targets the real #search wrapper. */
.lsvita-opc040084 header #search form {
  padding: 9px;
  border: 1px solid #8fbe39;
  border-radius: 5px;
  background: linear-gradient(to bottom, var(--opc040084-green-top) 0%, var(--opc040084-green-bottom) 100%);
}

.lsvita-opc040084 header #search .form-control-lg,
.lsvita-opc040084 header #search .btn-lg {
  min-height: 46px;
}

/* 2) Currency label spacing. */
.lsvita-opc040084 .lsvita-currency-label {
  white-space: nowrap;
}

/* 3) Compare button: same neutral grey family as Sort/Limit controls. */
.lsvita-opc040084 #compare-total {
  background: var(--bs-tertiary-bg, #f8f9fa) !important;
  border: 1px solid var(--bs-border-color, #dee2e6) !important;
  color: #444 !important;
  box-shadow: none !important;
  font-family: inherit;
  font-weight: 400;
}

.lsvita-opc040084 #compare-total i,
.lsvita-opc040084 #compare-total span {
  color: #444 !important;
}

.lsvita-opc040084 #compare-total:hover,
.lsvita-opc040084 #compare-total:focus {
  background: #e9ecef !important;
  border-color: #ced4da !important;
  color: #333 !important;
}

/* 4) Slightly smaller category heading and product title text. */
.lsvita-opc040084 #product-category #content > h1 {
  font-size: 28px;
  line-height: 1.25;
  margin-bottom: 16px;
}

.lsvita-opc040084 #product-category .product-thumb .description h4 {
  font-size: 17px;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 8px;
}

/* 5) Make product-grid currency/price easier to read. */
.lsvita-opc040084 #product-category .product-thumb .price,
.lsvita-opc040084 #product-category .product-thumb .price-new {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 600;
}

/* 6) Left category module: reproduce the old OPC040084 '商品目錄' box. */
.lsvita-opc040084 .lsvita-category-box {
  border: 1px solid #f4f1e7;
  border-radius: 5px;
  background: #fff;
  padding: 5px;
  overflow: hidden;
}

.lsvita-opc040084 .lsvita-category-heading {
  margin: 0 0 5px;
  padding: 7px 8px;
  border-radius: 4px;
  background: linear-gradient(to bottom, #faf8f3 0%, #f4f1e7 100%);
  color: var(--opc040084-orange);
  font-family: 'Marcellus', Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1.4;
}

.lsvita-opc040084 .lsvita-category-heading i {
  margin-right: 7px;
  color: #ffa145;
}

.lsvita-opc040084 .lsvita-category-content {
  padding: 3px 9px 8px;
}

.lsvita-opc040084 .lsvita-category-tree,
.lsvita-opc040084 .lsvita-category-tree ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lsvita-opc040084 .lsvita-category-tree > li {
  padding: 3px 0;
}

.lsvita-opc040084 .lsvita-category-tree a {
  display: block;
  padding: 3px 0;
  border: 0;
  background: transparent;
  color: var(--opc040084-text);
  font-size: 14px;
  line-height: 1.35;
}

.lsvita-opc040084 .lsvita-category-tree > li > a.active,
.lsvita-opc040084 .lsvita-category-tree > li.is-active > a {
  color: var(--opc040084-orange);
  font-weight: 400;
}

.lsvita-opc040084 .lsvita-category-tree a:hover,
.lsvita-opc040084 .lsvita-category-tree a:focus,
.lsvita-opc040084 .lsvita-category-tree ul a.active {
  color: var(--opc040084-orange-hover);
  background: transparent;
}

.lsvita-opc040084 .lsvita-root-arrow {
  display: inline-block;
  width: 14px;
  color: var(--opc040084-orange);
  font-family: Arial, sans-serif;
}

.lsvita-opc040084 .lsvita-category-tree ul {
  margin-left: 14px;
  padding-top: 2px;
}

.lsvita-opc040084 .lsvita-category-tree ul li {
  padding: 1px 0;
}

.lsvita-opc040084 .lsvita-child-bullet {
  display: inline-block;
  width: 14px;
  color: #b5a47d;
  font-family: Arial, sans-serif;
  font-size: 12px;
  vertical-align: 1px;
}

/* Remove Bootstrap list-group panel appearance if an old cached module view remains. */
.lsvita-opc040084 #column-left .list-group {
  border: 1px solid #f4f1e7;
  border-radius: 5px;
  padding: 7px 10px;
  background: #fff;
}

.lsvita-opc040084 #column-left .list-group-item {
  border: 0 !important;
  padding: 5px 2px;
  background: transparent !important;
  color: var(--opc040084-text) !important;
}

.lsvita-opc040084 #column-left .list-group-item.active {
  color: var(--opc040084-orange) !important;
  font-weight: 400;
}

@media (max-width: 991.98px) {
  .lsvita-opc040084 header #search,
  .lsvita-opc040084 header #cart {
    margin-top: 8px;
  }

  .lsvita-opc040084 #product-category #content > h1 {
    font-size: 25px;
  }
}

/* ========================================================================== */
/* LS Vita v33 refinements - 2026-10-06                                      */
/* ========================================================================== */

/* 1) Left product directory: restore the boxed OPC040084 look. */
.lsvita-opc040084 .lsvita-category-box {
  margin-bottom: 12px !important;
  padding: 5px !important;
  border: 1px solid #ded8ca !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden;
}

.lsvita-opc040084 .lsvita-category-heading {
  margin: 0 !important;
  padding: 7px 8px 7px 8px !important;
  border-radius: 4px 4px 0 0 !important;
  border-bottom: 1px solid #f0ece2;
  background: linear-gradient(to bottom, #fbfaf6 0%, #f5f2ea 100%) !important;
  color: var(--opc040084-orange) !important;
  font-size: 15px !important;
  line-height: 1.4;
}

.lsvita-opc040084 .lsvita-category-content {
  margin: 0 !important;
  padding: 6px 8px 7px !important;
  background: #fff;
}

.lsvita-opc040084 .lsvita-category-tree > li {
  padding: 2px 0 !important;
}

.lsvita-opc040084 .lsvita-category-tree > li > a {
  position: relative;
  padding: 3px 20px 3px 0 !important;
  color: var(--opc040084-text) !important;
  background: transparent !important;
}

.lsvita-opc040084 .lsvita-category-tree > li > a.active,
.lsvita-opc040084 .lsvita-category-tree > li.is-active > a {
  color: var(--opc040084-orange) !important;
}

.lsvita-opc040084 .lsvita-root-arrow {
  width: 14px !important;
  color: var(--opc040084-orange) !important;
}

.lsvita-opc040084 .lsvita-tree-state {
  position: absolute;
  right: 2px;
  top: 3px;
  color: #a99f88;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  line-height: 1;
}

.lsvita-opc040084 .lsvita-category-tree ul {
  margin-left: 15px !important;
  padding-top: 1px !important;
}

.lsvita-opc040084 .lsvita-category-tree ul li {
  padding: 1px 0 !important;
}

.lsvita-opc040084 .lsvita-category-tree ul a {
  padding: 2px 0 !important;
  color: var(--opc040084-text) !important;
  background: transparent !important;
}

.lsvita-opc040084 .lsvita-category-tree ul a:hover,
.lsvita-opc040084 .lsvita-category-tree ul a.active {
  color: var(--opc040084-orange-hover) !important;
}

/* 2) Restore the original green/orange search look, center it on the page,
      and make its outer height exactly match the stock OC4 cart button (48px). */
.lsvita-opc040084 header .lsvita-header-row {
  align-items: center !important;
}

.lsvita-opc040084 header #search {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

.lsvita-opc040084 header #search form {
  width: 285px;
  max-width: 100%;
  height: 48px;
  margin: 0 !important;
  padding: 3px !important;
  border: 1px solid #8fbe39 !important;
  border-radius: 5px !important;
  background: linear-gradient(to bottom, #a1ce41 0%, #6aad38 100%) !important;
  box-sizing: border-box;
}

.lsvita-opc040084 header #search .form-control-lg {
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 10px !important;
  border: 1px solid #eee !important;
  border-right: 0 !important;
  border-radius: 3px 0 0 3px !important;
  background: #fff !important;
  color: var(--opc040084-text) !important;
  font-size: 12px !important;
  line-height: 20px !important;
  box-shadow: none !important;
}

.lsvita-opc040084 header #search .btn-lg {
  width: 42px;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border: 1px solid #ff9630 !important;
  border-radius: 0 5px 5px 0 !important;
  background: linear-gradient(to bottom, #ffa145 0%, #fe8b1a 100%) !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 38px !important;
  text-shadow: none !important;
}

.lsvita-opc040084 header #search .btn-lg:hover,
.lsvita-opc040084 header #search .btn-lg:focus {
  border-color: #ff8a00 !important;
  background: linear-gradient(to bottom, #ffad5d 0%, #ff8106 100%) !important;
  color: #fff !important;
}

/* Keep the new cart button appearance; only position its wrapper. */
.lsvita-opc040084 header #cart {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  margin: 0 !important;
}

.lsvita-opc040084 header #cart > .dropdown {
  width: 307px;
  max-width: 100%;
}

/* 4/5) Legacy category-page heading, banner and visual subcategory tiles. */
.lsvita-opc040084 #product-category #content > h1.lsvita-category-title {
  margin: 0 0 15px !important;
  color: var(--opc040084-orange) !important;
  font-size: 17px !important;
  line-height: 1.3 !important;
  font-weight: 400 !important;
}

.lsvita-opc040084 #product-category .lsvita-category-info {
  margin-bottom: 14px;
  overflow: hidden;
}

.lsvita-opc040084 #product-category .lsvita-category-banner {
  width: 530px;
  max-width: 100%;
  margin: 0 0 10px;
  padding: 0;
  background: #fff;
  border: 0;
}

.lsvita-opc040084 #product-category .lsvita-category-banner img {
  display: block;
  width: 530px;
  max-width: 100%;
  height: auto;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.lsvita-opc040084 #product-category .lsvita-category-description {
  margin-bottom: 8px;
}

.lsvita-opc040084 #product-category .lsvita-refine-title {
  margin: 0 0 10px !important;
  color: var(--opc040084-text) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(105px, 1fr));
  gap: 8px;
  width: 100%;
  max-width: 500px;
  margin: 0 0 18px;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  color: var(--opc040084-text) !important;
  text-align: center;
  text-decoration: none !important;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-image {
  display: flex;
  width: 100%;
  max-width: 117px;
  height: 117px;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  border: 1px solid #e6dfcf;
  background: #fff;
  overflow: hidden;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-image img {
  display: block;
  max-width: 115px;
  max-height: 115px;
  width: auto;
  height: auto;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-name {
  display: block;
  color: var(--opc040084-text);
  font-size: 14px;
  line-height: 1.35;
}

.lsvita-opc040084 #product-category .lsvita-subcategory-card:hover .lsvita-subcategory-name {
  color: var(--opc040084-orange-hover);
}

@media (max-width: 991.98px) {
  .lsvita-opc040084 header #search,
  .lsvita-opc040084 header #cart {
    margin-top: 0 !important;
  }

  .lsvita-opc040084 #product-category .lsvita-subcategory-grid {
    grid-template-columns: repeat(3, minmax(100px, 1fr));
  }
}

@media (max-width: 767.98px) {
  .lsvita-opc040084 header #search,
  .lsvita-opc040084 header #cart {
    justify-content: center !important;
    margin-top: 8px !important;
  }

  .lsvita-opc040084 header #search form,
  .lsvita-opc040084 header #cart > .dropdown {
    width: 100%;
  }

  .lsvita-opc040084 #product-category .lsvita-subcategory-grid {
    grid-template-columns: repeat(2, minmax(100px, 1fr));
    max-width: none;
  }
}


/* ========================================================================== */
/* LS Vita v34 - Compare button neutral style                                 */
/* ========================================================================== */
/*
 * Force the category "compare products" control to use the same neutral
 * Bootstrap family as the sort/list controls, overriding .btn-primary.
 * Intentionally does not alter add-to-cart or the header cart button.
 */
#compare-total.lsvita-compare-neutral,
#compare-total.lsvita-compare-neutral.btn,
a#compare-total.lsvita-compare-neutral {
  --bs-btn-color: #495057 !important;
  --bs-btn-bg: #f8f9fa !important;
  --bs-btn-border-color: #dee2e6 !important;
  --bs-btn-hover-color: #343a40 !important;
  --bs-btn-hover-bg: #e9ecef !important;
  --bs-btn-hover-border-color: #ced4da !important;
  --bs-btn-active-color: #343a40 !important;
  --bs-btn-active-bg: #e2e6ea !important;
  --bs-btn-active-border-color: #ced4da !important;
  --bs-btn-disabled-color: #6c757d !important;
  --bs-btn-disabled-bg: #f8f9fa !important;
  --bs-btn-disabled-border-color: #dee2e6 !important;

  color: #495057 !important;
  background-color: #f8f9fa !important;
  background-image: none !important;
  border: 1px solid #dee2e6 !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-weight: 400 !important;
}

#compare-total.lsvita-compare-neutral i,
#compare-total.lsvita-compare-neutral span {
  color: #495057 !important;
}

#compare-total.lsvita-compare-neutral:hover,
#compare-total.lsvita-compare-neutral:focus,
#compare-total.lsvita-compare-neutral:active {
  color: #343a40 !important;
  background-color: #e9ecef !important;
  background-image: none !important;
  border-color: #ced4da !important;
  box-shadow: none !important;
}

#compare-total.lsvita-compare-neutral:hover i,
#compare-total.lsvita-compare-neutral:hover span,
#compare-total.lsvita-compare-neutral:focus i,
#compare-total.lsvita-compare-neutral:focus span {
  color: #343a40 !important;
}


/* ========================================================================== */
/* LS Vita v35 - Search bar compact / original neutral border                 */
/* ========================================================================== */
/*
 * Remove the v33 green outer search shell.
 * Restore the clean OpenCart 4-style white/neutral search appearance.
 * Keep the search centered in the middle header column and vertically centered
 * against the current cart button.
 */

.lsvita-opc040084 header #search {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

/* No colored outer frame/background. */
.lsvita-opc040084 header #search form {
  width: 285px !important;
  max-width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

/* Original clean neutral input border. */
.lsvita-opc040084 header #search .form-control-lg {
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 12px !important;
  border: 1px solid #dee2e6 !important;
  border-right: 0 !important;
  border-radius: 5px 0 0 5px !important;
  background: #fff !important;
  background-image: none !important;
  color: var(--opc040084-text) !important;
  font-size: 14px !important;
  line-height: 38px !important;
  box-shadow: none !important;
}

/* Search button: same neutral frame, no green/orange treatment. */
.lsvita-opc040084 header #search .btn-lg {
  width: 48px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 0 5px 5px 0 !important;
  background: #f8f9fa !important;
  background-image: none !important;
  color: #111 !important;
  font-size: 16px !important;
  line-height: 38px !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

.lsvita-opc040084 header #search .btn-lg i {
  color: #111 !important;
}

.lsvita-opc040084 header #search .btn-lg:hover,
.lsvita-opc040084 header #search .btn-lg:focus {
  border-color: #ced4da !important;
  background: #e9ecef !important;
  background-image: none !important;
  color: #111 !important;
  box-shadow: none !important;
}

/* Keep both controls centered on the same horizontal axis. */
.lsvita-opc040084 header .lsvita-header-row {
  align-items: center !important;
}

.lsvita-opc040084 header #cart {
  align-items: center !important;
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  .lsvita-opc040084 header #search form {
    width: 100% !important;
  }
}


/* ========================================================================== */
/* LS Vita v36 - definitive header/category/compare/price refinements          */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* 1) SEARCH: completely remove the green outer shell.                         */
/* New filename opc040084-v36.css also cache-busts browser/CDN stale CSS.      */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 header #search,
body.lsvita-opc040084 header div#search {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 header #search form,
body.lsvita-opc040084 header #search form.input-group {
  width: 320px !important;
  max-width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* Same clean neutral border family as the original non-green search field. */
body.lsvita-opc040084 header #search input.form-control,
body.lsvita-opc040084 header #search input.form-control-lg {
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  border: 1px solid #d9d5cc !important;
  border-right: 0 !important;
  border-radius: 5px 0 0 5px !important;
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  color: var(--opc040084-text) !important;
  font-size: 13px !important;
  line-height: 36px !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Neutral search button; no green/orange outer treatment. */
body.lsvita-opc040084 header #search button.btn,
body.lsvita-opc040084 header #search button.btn-lg {
  width: 48px !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #d9d5cc !important;
  border-radius: 0 5px 5px 0 !important;
  background: #f7f7f7 !important;
  background-color: #f7f7f7 !important;
  background-image: none !important;
  color: #222 !important;
  font-size: 15px !important;
  line-height: 36px !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 header #search button.btn i,
body.lsvita-opc040084 header #search button.btn-lg i {
  color: #222 !important;
}

body.lsvita-opc040084 header #search button.btn:hover,
body.lsvita-opc040084 header #search button.btn:focus,
body.lsvita-opc040084 header #search button.btn-lg:hover,
body.lsvita-opc040084 header #search button.btn-lg:focus {
  border-color: #c9c4ba !important;
  background: #eeeeee !important;
  background-image: none !important;
  color: #222 !important;
  box-shadow: none !important;
}

/* Keep the search exactly in the center column and aligned with cart. */
body.lsvita-opc040084 header .lsvita-header-row {
  align-items: center !important;
}
body.lsvita-opc040084 header #cart {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  margin: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* 2) LEFT CATEGORY DIRECTORY: restore the original boxed OPC040084 treatment. */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 #column-left .lsvita-category-box,
body.lsvita-opc040084 .lsvita-category-box {
  margin: 0 0 14px !important;
  padding: 6px !important;
  border: 1px solid #e3ded2 !important;
  border-radius: 5px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.lsvita-opc040084 #column-left .lsvita-category-heading,
body.lsvita-opc040084 .lsvita-category-heading {
  margin: 0 0 7px !important;
  padding: 7px 9px !important;
  border: 1px solid #ece6d9 !important;
  border-radius: 5px !important;
  background: linear-gradient(to bottom, #fbfaf6 0%, #f4f1e8 100%) !important;
  color: var(--opc040084-orange) !important;
  font-family: 'Marcellus', Arial, Helvetica, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 .lsvita-category-heading i {
  color: #ff9a33 !important;
  margin-right: 6px !important;
}

body.lsvita-opc040084 #column-left .lsvita-category-content,
body.lsvita-opc040084 .lsvita-category-content {
  margin: 0 !important;
  padding: 0 9px 8px !important;
  border: 0 !important;
  background: #fff !important;
}

body.lsvita-opc040084 .lsvita-category-tree,
body.lsvita-opc040084 .lsvita-category-tree ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.lsvita-opc040084 .lsvita-category-tree > li {
  padding: 1px 0 !important;
}

body.lsvita-opc040084 .lsvita-category-tree > li > a {
  position: relative !important;
  display: block !important;
  padding: 3px 18px 3px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--opc040084-text) !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 .lsvita-category-tree ul {
  margin-left: 15px !important;
}

body.lsvita-opc040084 .lsvita-category-tree ul li {
  padding: 0 !important;
}

body.lsvita-opc040084 .lsvita-category-tree ul a {
  display: block !important;
  padding: 2px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--opc040084-text) !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 .lsvita-root-arrow {
  display: inline-block !important;
  width: 14px !important;
  color: var(--opc040084-orange) !important;
}

body.lsvita-opc040084 .lsvita-child-bullet {
  display: inline-block !important;
  width: 14px !important;
  color: #b09c70 !important;
}

body.lsvita-opc040084 .lsvita-tree-state {
  position: absolute !important;
  right: 1px !important;
  top: 3px !important;
  color: #9f957e !important;
}

body.lsvita-opc040084 .lsvita-category-tree a:hover,
body.lsvita-opc040084 .lsvita-category-tree a:focus,
body.lsvita-opc040084 .lsvita-category-tree a.active {
  background: transparent !important;
  color: var(--opc040084-orange-hover) !important;
}

/* -------------------------------------------------------------------------- */
/* 3) COMPARE: normal is neutral grey; hover text/arrows must be WHITE.        */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral {
  color: #495057 !important;
  background: #d7d9db !important;
  background-image: none !important;
  border-color: #ced1d4 !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral span {
  color: #495057 !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active {
  color: #ffffff !important;
  background: #8f9499 !important;
  background-image: none !important;
  border-color: #858a8f !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active span {
  color: #ffffff !important;
}

/* -------------------------------------------------------------------------- */
/* 4) PRODUCT GRID PRICE: larger and easier to scan.                           */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 #product-category .product-thumb .price,
body.lsvita-opc040084 #product-category .product-thumb .price-new,
body.lsvita-opc040084 #product-category .product-thumb .price > span {
  font-size: 20px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
}

body.lsvita-opc040084 #product-category .product-thumb .price {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
  color: #5f8f2f !important;
}

/* Preserve smaller old-price/tax text when present. */
body.lsvita-opc040084 #product-category .product-thumb .price-old {
  font-size: 15px !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 #product-category .product-thumb .price-tax {
  font-size: 13px !important;
  font-weight: 400 !important;
}

/* Mobile: let search use the available width. */
@media (max-width: 767.98px) {
  body.lsvita-opc040084 header #search form,
  body.lsvita-opc040084 header #search form.input-group {
    width: 100% !important;
  }
}


/* ========================================================================== */
/* LS Vita v37 - wider centered search bar                                    */
/* ========================================================================== */
/*
 * The previous height correction (38px) is kept.
 * Only the desktop width is increased so the field is easier to use while
 * remaining centered between logo and cart.
 */
@media (min-width: 992px) {
  body.lsvita-opc040084 header #search form,
  body.lsvita-opc040084 header #search form.input-group {
    width: 420px !important;
    max-width: 100% !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  body.lsvita-opc040084 header #search form,
  body.lsvita-opc040084 header #search form.input-group {
    width: 340px !important;
    max-width: 100% !important;
  }
}


/* ========================================================================== */
/* LS Vita v38 - global neutral buttons + member welcome                      */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* ALL STOREFRONT BLUE PRIMARY BUTTONS                                        */
/* Same palette requested for the Compare Products control.                   */
/* Normal: neutral grey + dark text/icons                                     */
/* Hover/focus/active: darker grey + WHITE text/icons                         */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 .btn-primary,
body.lsvita-opc040084 a.btn-primary,
body.lsvita-opc040084 button.btn-primary,
body.lsvita-opc040084 input.btn-primary,
body.lsvita-opc040084 .btn-info,
body.lsvita-opc040084 a.btn-info,
body.lsvita-opc040084 button.btn-info,
body.lsvita-opc040084 .btn-outline-primary {
  --bs-btn-color: #495057 !important;
  --bs-btn-bg: #d7d9db !important;
  --bs-btn-border-color: #ced1d4 !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: #8f9499 !important;
  --bs-btn-hover-border-color: #858a8f !important;
  --bs-btn-focus-shadow-rgb: 143, 148, 153 !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: #81868b !important;
  --bs-btn-active-border-color: #787d82 !important;
  --bs-btn-disabled-color: #6c757d !important;
  --bs-btn-disabled-bg: #e2e3e5 !important;
  --bs-btn-disabled-border-color: #d6d8db !important;

  color: #495057 !important;
  background-color: #d7d9db !important;
  background-image: none !important;
  border-color: #ced1d4 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary i,
body.lsvita-opc040084 .btn-primary span,
body.lsvita-opc040084 .btn-info i,
body.lsvita-opc040084 .btn-info span,
body.lsvita-opc040084 .btn-outline-primary i,
body.lsvita-opc040084 .btn-outline-primary span {
  color: #495057 !important;
}

body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-primary.active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-info.active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 .btn-outline-primary.active {
  color: #ffffff !important;
  background-color: #8f9499 !important;
  background-image: none !important;
  border-color: #858a8f !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary:hover i,
body.lsvita-opc040084 .btn-primary:hover span,
body.lsvita-opc040084 .btn-primary:focus i,
body.lsvita-opc040084 .btn-primary:focus span,
body.lsvita-opc040084 .btn-primary:active i,
body.lsvita-opc040084 .btn-primary:active span,
body.lsvita-opc040084 .btn-info:hover i,
body.lsvita-opc040084 .btn-info:hover span,
body.lsvita-opc040084 .btn-info:focus i,
body.lsvita-opc040084 .btn-info:focus span,
body.lsvita-opc040084 .btn-info:active i,
body.lsvita-opc040084 .btn-info:active span,
body.lsvita-opc040084 .btn-outline-primary:hover i,
body.lsvita-opc040084 .btn-outline-primary:hover span,
body.lsvita-opc040084 .btn-outline-primary:focus i,
body.lsvita-opc040084 .btn-outline-primary:focus span,
body.lsvita-opc040084 .btn-outline-primary:active i,
body.lsvita-opc040084 .btn-outline-primary:active span {
  color: #ffffff !important;
}

/* Preserve the dark current-generation header cart button. */
body.lsvita-opc040084 #cart .btn-dark,
body.lsvita-opc040084 #cart button.btn-dark {
  color: var(--bs-btn-color) !important;
  background-color: var(--bs-btn-bg) !important;
  border-color: var(--bs-btn-border-color) !important;
}

/* -------------------------------------------------------------------------- */
/* LOGGED-IN MEMBER WELCOME ABOVE CART                                        */
/* Mirrors the old OPC040084 wording, minus the Logout link.                  */
/* -------------------------------------------------------------------------- */

body.lsvita-opc040084 header .lsvita-cart-column {
  position: relative !important;
  min-height: 92px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome {
  position: absolute !important;
  top: 2px !important;
  right: 0 !important;
  z-index: 3 !important;
  max-width: 100% !important;
  font-family: 'Marcellus', Arial, Helvetica, sans-serif !important;
  font-size: 13px !important;
  line-height: 20px !important;
  font-weight: 400 !important;
  text-align: right !important;
  white-space: nowrap !important;
  color: var(--opc040084-text) !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-accent {
  color: #ff8b22 !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-name,
body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-group {
  color: var(--opc040084-text) !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-name {
  text-decoration: none !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-name:hover {
  color: var(--opc040084-orange-hover) !important;
}

body.lsvita-opc040084 header .lsvita-cart-slot {
  width: 100% !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* Keep the existing cart button centered on the same horizontal axis as search. */
body.lsvita-opc040084 header .lsvita-cart-slot > .dropdown {
  width: 100% !important;
  max-width: 306px !important;
}

/* Smaller desktop widths: allow the greeting to wrap instead of colliding. */
@media (max-width: 1199.98px) {
  body.lsvita-opc040084 header .lsvita-member-welcome {
    font-size: 12px !important;
    white-space: normal !important;
    line-height: 16px !important;
  }
}

@media (max-width: 767.98px) {
  body.lsvita-opc040084 header .lsvita-cart-column {
    min-height: auto !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    position: static !important;
    margin: 4px 0 8px !important;
    text-align: center !important;
    white-space: normal !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot {
    justify-content: center !important;
  }
}


/* ========================================================================== */
/* LS Vita v39 - greeting alignment, larger neutral buttons, footer/cart text */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* Member / guest welcome: right edge exactly matches the cart button.         */
/* Keep a deliberate gap above the cart.                                      */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 header .lsvita-cart-column {
  min-height: 104px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome {
  position: static !important;
  width: 100% !important;
  max-width: 306px !important;
  margin: 0 0 11px auto !important;
  padding: 0 !important;
  text-align: right !important;
  white-space: normal !important;
  font-size: 13px !important;
  line-height: 18px !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-action {
  color: var(--opc040084-orange-hover) !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-action:hover {
  color: #e56f00 !important;
  text-decoration: underline !important;
}

body.lsvita-opc040084 header .lsvita-cart-slot {
  width: 100% !important;
  max-width: 306px !important;
  margin: 0 0 0 auto !important;
  justify-content: flex-end !important;
}

body.lsvita-opc040084 header .lsvita-cart-slot > .dropdown {
  width: 100% !important;
  max-width: 306px !important;
}

/* -------------------------------------------------------------------------- */
/* Neutral buttons - tuned to the requested light grey / dark grey states.    */
/* All affected blue-style storefront buttons are also slightly larger.       */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 .btn-primary,
body.lsvita-opc040084 a.btn-primary,
body.lsvita-opc040084 button.btn-primary,
body.lsvita-opc040084 input.btn-primary,
body.lsvita-opc040084 .btn-info,
body.lsvita-opc040084 a.btn-info,
body.lsvita-opc040084 button.btn-info,
body.lsvita-opc040084 .btn-outline-primary {
  --bs-btn-color: #585d61 !important;
  --bs-btn-bg: #d4d6d8 !important;
  --bs-btn-border-color: #c9cccf !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: #8e9397 !important;
  --bs-btn-hover-border-color: #858a8e !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: #83888c !important;
  --bs-btn-active-border-color: #7d8286 !important;

  min-height: 42px !important;
  padding: 9px 18px !important;
  border-radius: 4px !important;
  color: #585d61 !important;
  background-color: #d4d6d8 !important;
  background-image: none !important;
  border-color: #c9cccf !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary i,
body.lsvita-opc040084 .btn-primary span,
body.lsvita-opc040084 .btn-info i,
body.lsvita-opc040084 .btn-info span,
body.lsvita-opc040084 .btn-outline-primary i,
body.lsvita-opc040084 .btn-outline-primary span {
  color: #585d61 !important;
}

body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-primary.active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-info.active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 .btn-outline-primary.active {
  color: #ffffff !important;
  background-color: #8e9397 !important;
  background-image: none !important;
  border-color: #858a8e !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary:hover i,
body.lsvita-opc040084 .btn-primary:hover span,
body.lsvita-opc040084 .btn-primary:focus i,
body.lsvita-opc040084 .btn-primary:focus span,
body.lsvita-opc040084 .btn-primary:active i,
body.lsvita-opc040084 .btn-primary:active span,
body.lsvita-opc040084 .btn-info:hover i,
body.lsvita-opc040084 .btn-info:hover span,
body.lsvita-opc040084 .btn-info:focus i,
body.lsvita-opc040084 .btn-info:focus span,
body.lsvita-opc040084 .btn-info:active i,
body.lsvita-opc040084 .btn-info:active span,
body.lsvita-opc040084 .btn-outline-primary:hover i,
body.lsvita-opc040084 .btn-outline-primary:hover span,
body.lsvita-opc040084 .btn-outline-primary:focus i,
body.lsvita-opc040084 .btn-outline-primary:focus span,
body.lsvita-opc040084 .btn-outline-primary:active i,
body.lsvita-opc040084 .btn-outline-primary:active span {
  color: #ffffff !important;
}

/* Keep header cart button at its current design/size despite the global rules. */
body.lsvita-opc040084 #cart .btn-dark,
body.lsvita-opc040084 #cart button.btn-dark {
  min-height: initial !important;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x) !important;
  border-radius: var(--bs-btn-border-radius) !important;
  font-size: var(--bs-btn-font-size) !important;
  line-height: var(--bs-btn-line-height) !important;
}

/* -------------------------------------------------------------------------- */
/* Cart page: smaller orange title, no product-weight suffix in Twig.          */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 #checkout-cart .lsvita-cart-title,
body.lsvita-opc040084 #shopping-cart .lsvita-cart-title {
  margin: 0 0 16px !important;
  font-size: 24px !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
}

/* -------------------------------------------------------------------------- */
/* Footer readability: reinforce the larger sizes even if another stylesheet  */
/* tries to reduce them.                                                      */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 footer.tm-footer #footer h3,
body.lsvita-opc040084 footer.tm-footer #footer h5,
body.lsvita-opc040084 footer.tm-footer .title_block {
  font-size: 16px !important;
  line-height: 1.45 !important;
}

body.lsvita-opc040084 footer.tm-footer #footer p,
body.lsvita-opc040084 footer.tm-footer #footer li,
body.lsvita-opc040084 footer.tm-footer #footer a,
body.lsvita-opc040084 footer.tm-footer #footer .about_footer {
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.lsvita-opc040084 footer.tm-footer #bottomfooter li,
body.lsvita-opc040084 footer.tm-footer #bottomfooter a,
body.lsvita-opc040084 footer.tm-footer .copyright-container,
body.lsvita-opc040084 footer.tm-footer #powered {
  font-size: 13px !important;
  line-height: 1.4 !important;
}

@media (max-width: 767.98px) {
  body.lsvita-opc040084 header .lsvita-cart-column {
    min-height: auto !important;
    align-items: stretch !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome,
  body.lsvita-opc040084 header .lsvita-cart-slot {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    text-align: center !important;
  }
}


/* ========================================================================== */
/* LS Vita v40 - make all previously-restyled buttons match "繼續購物"       */
/* ========================================================================== */
/*
 * The cart template's "繼續購物" button uses Bootstrap's .btn-light.
 * These rules make the previously changed primary/info/outline-primary buttons
 * use the SAME btn-light color palette in normal, hover, focus and active states.
 * Button sizing from v39 is intentionally retained.
 */

body.lsvita-opc040084 .btn-primary,
body.lsvita-opc040084 a.btn-primary,
body.lsvita-opc040084 button.btn-primary,
body.lsvita-opc040084 input.btn-primary,
body.lsvita-opc040084 .btn-info,
body.lsvita-opc040084 a.btn-info,
body.lsvita-opc040084 button.btn-info,
body.lsvita-opc040084 .btn-outline-primary,
body.lsvita-opc040084 a.btn-outline-primary,
body.lsvita-opc040084 button.btn-outline-primary {
  --bs-btn-color: #000000 !important;
  --bs-btn-bg: #f8f9fa !important;
  --bs-btn-border-color: #f8f9fa !important;
  --bs-btn-hover-color: #000000 !important;
  --bs-btn-hover-bg: #d3d4d5 !important;
  --bs-btn-hover-border-color: #c6c7c8 !important;
  --bs-btn-focus-shadow-rgb: 211, 212, 213 !important;
  --bs-btn-active-color: #000000 !important;
  --bs-btn-active-bg: #c6c7c8 !important;
  --bs-btn-active-border-color: #babbbc !important;
  --bs-btn-disabled-color: #000000 !important;
  --bs-btn-disabled-bg: #f8f9fa !important;
  --bs-btn-disabled-border-color: #f8f9fa !important;

  color: #000000 !important;
  background-color: #f8f9fa !important;
  background-image: none !important;
  border-color: #f8f9fa !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Icons/text follow the btn-light foreground too. */
body.lsvita-opc040084 .btn-primary i,
body.lsvita-opc040084 .btn-primary span,
body.lsvita-opc040084 .btn-info i,
body.lsvita-opc040084 .btn-info span,
body.lsvita-opc040084 .btn-outline-primary i,
body.lsvita-opc040084 .btn-outline-primary span {
  color: #000000 !important;
}

/* Same hover/focus/active palette as .btn-light. */
body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-primary.active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-info.active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 .btn-outline-primary.active {
  color: #000000 !important;
  background-color: #d3d4d5 !important;
  background-image: none !important;
  border-color: #c6c7c8 !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary:hover i,
body.lsvita-opc040084 .btn-primary:hover span,
body.lsvita-opc040084 .btn-primary:focus i,
body.lsvita-opc040084 .btn-primary:focus span,
body.lsvita-opc040084 .btn-primary:active i,
body.lsvita-opc040084 .btn-primary:active span,
body.lsvita-opc040084 .btn-info:hover i,
body.lsvita-opc040084 .btn-info:hover span,
body.lsvita-opc040084 .btn-info:focus i,
body.lsvita-opc040084 .btn-info:focus span,
body.lsvita-opc040084 .btn-info:active i,
body.lsvita-opc040084 .btn-info:active span,
body.lsvita-opc040084 .btn-outline-primary:hover i,
body.lsvita-opc040084 .btn-outline-primary:hover span,
body.lsvita-opc040084 .btn-outline-primary:focus i,
body.lsvita-opc040084 .btn-outline-primary:focus span,
body.lsvita-opc040084 .btn-outline-primary:active i,
body.lsvita-opc040084 .btn-outline-primary:active span {
  color: #000000 !important;
}

/* Compare button was given a custom class earlier. Match it too. */
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral {
  color: #000000 !important;
  background-color: #f8f9fa !important;
  background-image: none !important;
  border-color: #f8f9fa !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral span {
  color: #000000 !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active {
  color: #000000 !important;
  background-color: #d3d4d5 !important;
  background-image: none !important;
  border-color: #c6c7c8 !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active span {
  color: #000000 !important;
}

/* Preserve the current black header cart button. */
body.lsvita-opc040084 #cart .btn-dark,
body.lsvita-opc040084 #cart button.btn-dark {
  color: var(--bs-btn-color) !important;
  background-color: var(--bs-btn-bg) !important;
  border-color: var(--bs-btn-border-color) !important;
}


/* ========================================================================== */
/* LS Vita v41 - button hover text/icon orange                                */
/* ========================================================================== */
/*
 * Keep the v40 btn-light background colors.
 * Correct hover/focus/active foreground to the OPC040084 orange requested.
 */

body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-primary.active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-info.active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 .btn-outline-primary.active {
  color: #ff7f00 !important;
}

body.lsvita-opc040084 .btn-primary:hover i,
body.lsvita-opc040084 .btn-primary:hover span,
body.lsvita-opc040084 .btn-primary:focus i,
body.lsvita-opc040084 .btn-primary:focus span,
body.lsvita-opc040084 .btn-primary:active i,
body.lsvita-opc040084 .btn-primary:active span,
body.lsvita-opc040084 .btn-info:hover i,
body.lsvita-opc040084 .btn-info:hover span,
body.lsvita-opc040084 .btn-info:focus i,
body.lsvita-opc040084 .btn-info:focus span,
body.lsvita-opc040084 .btn-info:active i,
body.lsvita-opc040084 .btn-info:active span,
body.lsvita-opc040084 .btn-outline-primary:hover i,
body.lsvita-opc040084 .btn-outline-primary:hover span,
body.lsvita-opc040084 .btn-outline-primary:focus i,
body.lsvita-opc040084 .btn-outline-primary:focus span,
body.lsvita-opc040084 .btn-outline-primary:active i,
body.lsvita-opc040084 .btn-outline-primary:active span {
  color: #ff7f00 !important;
}

/* Compare button follows the same hover text/icon color. */
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active {
  color: #ff7f00 !important;
}

body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active span {
  color: #ff7f00 !important;
}


/* ========================================================================== */
/* LS Vita v42 - clearer dark border around neutral buttons                   */
/* ========================================================================== */

body.lsvita-opc040084 .btn-primary,
body.lsvita-opc040084 a.btn-primary,
body.lsvita-opc040084 button.btn-primary,
body.lsvita-opc040084 input.btn-primary,
body.lsvita-opc040084 .btn-info,
body.lsvita-opc040084 a.btn-info,
body.lsvita-opc040084 button.btn-info,
body.lsvita-opc040084 .btn-outline-primary,
body.lsvita-opc040084 a.btn-outline-primary,
body.lsvita-opc040084 button.btn-outline-primary,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral {
  border: 1px solid #aeb2b6 !important;
}

/* Slightly stronger border on hover/focus for clearer feedback. */
body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active {
  border-color: #969b9f !important;
}

/* Keep the current dark header cart button untouched. */
body.lsvita-opc040084 #cart .btn-dark,
body.lsvita-opc040084 #cart button.btn-dark {
  border-color: var(--bs-btn-border-color) !important;
}


/* ========================================================================== */
/* LS Vita v43 - orange hover buttons, compact cart actions, wider greeting   */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* 1/2) Storefront action buttons + Continue Shopping                         */
/* Normal: light neutral + visible border                                     */
/* Hover/focus/active: ORANGE background + WHITE text/icons                   */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 .btn-primary,
body.lsvita-opc040084 a.btn-primary,
body.lsvita-opc040084 button.btn-primary,
body.lsvita-opc040084 input.btn-primary,
body.lsvita-opc040084 .btn-info,
body.lsvita-opc040084 a.btn-info,
body.lsvita-opc040084 button.btn-info,
body.lsvita-opc040084 .btn-outline-primary,
body.lsvita-opc040084 a.btn-outline-primary,
body.lsvita-opc040084 button.btn-outline-primary,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral {
  --bs-btn-color: #585d61 !important;
  --bs-btn-bg: #f8f9fa !important;
  --bs-btn-border-color: #aeb2b6 !important;
  --bs-btn-hover-color: #ffffff !important;
  --bs-btn-hover-bg: #ff8106 !important;
  --bs-btn-hover-border-color: #e97400 !important;
  --bs-btn-active-color: #ffffff !important;
  --bs-btn-active-bg: #ee7700 !important;
  --bs-btn-active-border-color: #d96c00 !important;

  min-height: 42px !important;
  padding: 9px 18px !important;
  border: 1px solid #aeb2b6 !important;
  border-radius: 4px !important;
  color: #585d61 !important;
  background: #f8f9fa !important;
  background-image: none !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary i,
body.lsvita-opc040084 .btn-primary span,
body.lsvita-opc040084 .btn-info i,
body.lsvita-opc040084 .btn-info span,
body.lsvita-opc040084 .btn-outline-primary i,
body.lsvita-opc040084 .btn-outline-primary span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral span {
  color: #585d61 !important;
}

body.lsvita-opc040084 .btn-primary:hover,
body.lsvita-opc040084 .btn-primary:focus,
body.lsvita-opc040084 .btn-primary:active,
body.lsvita-opc040084 .btn-primary.active,
body.lsvita-opc040084 .btn-info:hover,
body.lsvita-opc040084 .btn-info:focus,
body.lsvita-opc040084 .btn-info:active,
body.lsvita-opc040084 .btn-info.active,
body.lsvita-opc040084 .btn-outline-primary:hover,
body.lsvita-opc040084 .btn-outline-primary:focus,
body.lsvita-opc040084 .btn-outline-primary:active,
body.lsvita-opc040084 .btn-outline-primary.active,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active {
  color: #ffffff !important;
  background: #ff8106 !important;
  background-image: none !important;
  border-color: #e97400 !important;
  box-shadow: none !important;
}

body.lsvita-opc040084 .btn-primary:hover i,
body.lsvita-opc040084 .btn-primary:hover span,
body.lsvita-opc040084 .btn-primary:focus i,
body.lsvita-opc040084 .btn-primary:focus span,
body.lsvita-opc040084 .btn-primary:active i,
body.lsvita-opc040084 .btn-primary:active span,
body.lsvita-opc040084 .btn-info:hover i,
body.lsvita-opc040084 .btn-info:hover span,
body.lsvita-opc040084 .btn-info:focus i,
body.lsvita-opc040084 .btn-info:focus span,
body.lsvita-opc040084 .btn-info:active i,
body.lsvita-opc040084 .btn-info:active span,
body.lsvita-opc040084 .btn-outline-primary:hover i,
body.lsvita-opc040084 .btn-outline-primary:hover span,
body.lsvita-opc040084 .btn-outline-primary:focus i,
body.lsvita-opc040084 .btn-outline-primary:focus span,
body.lsvita-opc040084 .btn-outline-primary:active i,
body.lsvita-opc040084 .btn-outline-primary:active span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:hover span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:focus span,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active i,
body.lsvita-opc040084 #compare-total.lsvita-compare-neutral:active span {
  color: #ffffff !important;
}

/* Keep the current black header cart button untouched. */
body.lsvita-opc040084 #cart .btn-dark,
body.lsvita-opc040084 #cart button.btn-dark {
  min-height: initial !important;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x) !important;
  border-color: var(--bs-btn-border-color) !important;
  color: var(--bs-btn-color) !important;
  background-color: var(--bs-btn-bg) !important;
  font-size: var(--bs-btn-font-size) !important;
  line-height: var(--bs-btn-line-height) !important;
}

/* -------------------------------------------------------------------------- */
/* 3/4) Cart quantity controls: update/remove same size and side-by-side       */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 .lsvita-cart-quantity-form {
  margin: 0 !important;
}

body.lsvita-opc040084 .lsvita-cart-quantity-controls {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  min-width: 138px !important;
}

body.lsvita-opc040084 .lsvita-cart-quantity-input {
  flex: 0 0 54px !important;
  width: 54px !important;
  min-width: 54px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 5px 8px !important;
  text-align: center !important;
}

body.lsvita-opc040084 .lsvita-cart-mini-action,
body.lsvita-opc040084 .btn-primary.lsvita-cart-mini-action,
body.lsvita-opc040084 .btn-danger.lsvita-cart-mini-action {
  flex: 0 0 36px !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 4px !important;
  line-height: 1 !important;
  font-size: 14px !important;
}

/* Update button: compact light style; orange/white on hover. */
body.lsvita-opc040084 .btn-primary.lsvita-cart-update {
  color: #585d61 !important;
  background: #f8f9fa !important;
  border-color: #aeb2b6 !important;
}
body.lsvita-opc040084 .btn-primary.lsvita-cart-update i {
  color: #585d61 !important;
}
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:hover,
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:focus,
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:active {
  color: #ffffff !important;
  background: #ff8106 !important;
  border-color: #e97400 !important;
}
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:hover i,
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:focus i,
body.lsvita-opc040084 .btn-primary.lsvita-cart-update:active i {
  color: #ffffff !important;
}

/* Remove stays danger/red, but the center icon is always bright white. */
body.lsvita-opc040084 .btn-danger.lsvita-cart-remove,
body.lsvita-opc040084 .btn-danger.lsvita-cart-remove i {
  color: #ffffff !important;
}
body.lsvita-opc040084 .btn-danger.lsvita-cart-remove {
  background: #dc4f4f !important;
  border-color: #c94444 !important;
}
body.lsvita-opc040084 .btn-danger.lsvita-cart-remove:hover,
body.lsvita-opc040084 .btn-danger.lsvita-cart-remove:focus {
  background: #c94343 !important;
  border-color: #b63838 !important;
}

/* -------------------------------------------------------------------------- */
/* 5/6) Logged-in / guest welcome line                                         */
/* Right edge follows cart; left side may extend over the search area.         */
/* -------------------------------------------------------------------------- */
body.lsvita-opc040084 header .lsvita-cart-column {
  position: relative !important;
  min-height: 108px !important;
  overflow: visible !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome {
  position: absolute !important;
  top: 3px !important;
  right: 0 !important;
  width: max-content !important;
  max-width: 760px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 8 !important;
  text-align: right !important;
  white-space: nowrap !important;
  font-size: 16px !important;
  line-height: 22px !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 header .lsvita-cart-slot {
  width: 100% !important;
  max-width: 306px !important;
  margin: 36px 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* Guest Login/Register links use the same normal color as Contact Us. */
body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-action {
  color: var(--opc040084-text) !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}

body.lsvita-opc040084 header .lsvita-member-welcome .lsvita-member-action:hover {
  color: var(--opc040084-orange-hover) !important;
  text-decoration: none !important;
}

@media (max-width: 991.98px) {
  body.lsvita-opc040084 header .lsvita-member-welcome {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 19px !important;
  }
}

@media (max-width: 767.98px) {
  body.lsvita-opc040084 header .lsvita-cart-column {
    min-height: auto !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    position: static !important;
    width: 100% !important;
    margin: 5px 0 10px !important;
    text-align: center !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot {
    max-width: 100% !important;
    margin: 0 !important;
    justify-content: center !important;
  }
}


/* ========================================================================== */
/* LS Vita v44 - align header cart vertically with search                     */
/* ========================================================================== */
/*
 * The member/guest welcome stays absolutely positioned above the cart.
 * The cart itself is no longer pushed downward by margin-top.
 * Search and cart now share the same vertical center line.
 */

body.lsvita-opc040084 header .lsvita-header-row {
  align-items: center !important;
}

body.lsvita-opc040084 header .lsvita-cart-column {
  position: relative !important;
  min-height: 108px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
  overflow: visible !important;
}

body.lsvita-opc040084 header .lsvita-cart-slot {
  width: 100% !important;
  max-width: 306px !important;
  margin: 0 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* Keep the greeting above without affecting cart vertical position. */
body.lsvita-opc040084 header .lsvita-member-welcome {
  position: absolute !important;
  top: 3px !important;
  right: 0 !important;
}

/* Make sure the actual cart dropdown/button itself is centered. */
body.lsvita-opc040084 header .lsvita-cart-slot > .dropdown {
  width: 100% !important;
  max-width: 306px !important;
  margin: 0 !important;
}

@media (max-width: 767.98px) {
  body.lsvita-opc040084 header .lsvita-cart-column {
    min-height: auto !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    position: static !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot {
    max-width: 100% !important;
    margin: 0 !important;
    justify-content: center !important;
  }
}


/* ========================================================================== */
/* LS Vita v45 - hard-align cart with search + compact mobile header          */
/* ========================================================================== */

/*
 * Desktop/tablet:
 * The search sits on the Bootstrap row's vertical center.
 * Position the cart slot on that SAME 50% center line explicitly.
 * This avoids the welcome-line/cart flex layout pushing the cart downward.
 */
@media (min-width: 768px) {
  body.lsvita-opc040084 header .lsvita-header-row {
    position: relative !important;
    align-items: center !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-column {
    position: relative !important;
    min-height: 108px !important;
    height: 108px !important;
    display: block !important;
    overflow: visible !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    position: absolute !important;
    top: 3px !important;
    right: 0 !important;
    margin: 0 !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot {
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    left: auto !important;
    width: 290px !important;
    max-width: 290px !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot > .dropdown {
    width: 100% !important;
    max-width: 290px !important;
    margin: 0 !important;
  }

  /* Slightly reduce the cart button overall size while preserving its dark style. */
  body.lsvita-opc040084 header #cart .btn-dark,
  body.lsvita-opc040084 header #cart button.btn-dark {
    min-height: 44px !important;
    padding: 8px 14px !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Mobile: narrower search and a more compact cart button                     */
/* -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  body.lsvita-opc040084 header #search {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.lsvita-opc040084 header #search form,
  body.lsvita-opc040084 header #search form.input-group {
    width: 250px !important;
    max-width: calc(100vw - 42px) !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 auto !important;
  }

  body.lsvita-opc040084 header #search input.form-control,
  body.lsvita-opc040084 header #search input.form-control-lg,
  body.lsvita-opc040084 header #search button.btn,
  body.lsvita-opc040084 header #search button.btn-lg {
    height: 36px !important;
    min-height: 36px !important;
  }

  body.lsvita-opc040084 header #search input.form-control,
  body.lsvita-opc040084 header #search input.form-control-lg {
    font-size: 13px !important;
  }

  body.lsvita-opc040084 header #search button.btn,
  body.lsvita-opc040084 header #search button.btn-lg {
    width: 42px !important;
    font-size: 14px !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-column {
    position: relative !important;
    min-height: auto !important;
    height: auto !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-member-welcome {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px 0 9px !important;
    text-align: center !important;
    font-size: 13px !important;
    line-height: 18px !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot {
    position: static !important;
    width: 235px !important;
    max-width: calc(100vw - 52px) !important;
    margin: 0 auto !important;
    transform: none !important;
    display: block !important;
  }

  body.lsvita-opc040084 header .lsvita-cart-slot > .dropdown {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.lsvita-opc040084 header #cart .btn-dark,
  body.lsvita-opc040084 header #cart button.btn-dark {
    min-height: 40px !important;
    padding: 7px 10px !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
  }
}