/* Esskompass Theme v3 UI layer.
   Visual-only overrides for the active esskompass_v3 theme. */

:root {
  --ess-orange: #f58220;
  --ess-orange-hover: #e26f12;
  --ess-green: #49a942;
  --ess-green-soft: #eaf7e8;
  --ess-text: #222222;
  --ess-muted: #666666;
  --ess-border: #ececec;
  --ess-bg: #f8f9fa;
  --ess-white: #ffffff;
  --ess-radius-sm: 12px;
  --ess-radius-md: 16px;
  --ess-shadow-sm: 0 8px 24px rgba(18, 24, 40, 0.08);
  --ess-shadow-md: 0 14px 36px rgba(18, 24, 40, 0.12);
  --ess-transition: 160ms ease;
  --ess-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

html,
body {
  color: var(--ess-text);
  background: var(--ess-bg);
  font-family: var(--ess-font);
  letter-spacing: 0;
}

body,
p,
a,
button,
input,
select,
textarea {
  font-family: var(--ess-font);
}

a,
a:hover {
  color: var(--ess-orange);
}

.page-grey {
  background: var(--ess-bg);
}

.container,
.container-fluid {
  max-width: 1280px;
}

/* Header */
#top-navigation {
  min-height: 76px;
  margin: 0;
  padding: 14px 18px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--ess-border);
  border-radius: 0 0 var(--ess-radius-md) var(--ess-radius-md);
  box-shadow: var(--ess-shadow-sm);
  backdrop-filter: saturate(140%) blur(12px);
}

#top-navigation .top-logo img,
.top-logo img {
  max-height: 42px;
  width: auto;
}

#vue-widget-nav .form-control,
#vue-widget-nav input,
#vue-widget-nav .select2-selection,
#vue-widget-nav .el-input__inner,
#main-search-banner input,
.mobile-home-banner input {
  min-height: 44px;
  border-color: var(--ess-border) !important;
  border-radius: var(--ess-radius-sm) !important;
  box-shadow: none !important;
}

#vue-widget-nav .form-control:focus,
#vue-widget-nav input:focus,
#main-search-banner input:focus,
.mobile-home-banner input:focus {
  border-color: rgba(245, 130, 32, 0.45) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.12) !important;
}

/* Buttons */
.btn,
.el-button,
button {
  border-radius: var(--ess-radius-sm);
  transition: background-color var(--ess-transition), border-color var(--ess-transition), box-shadow var(--ess-transition), transform var(--ess-transition);
}

.btn-green,
.btn-green:focus,
.btn-green-line:hover,
.el-button--success,
.el-button.is-round[style*="rgb(62, 207, 142)"],
.el-button[style*="#3ecf8e"] {
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 8px 18px rgba(245, 130, 32, 0.22);
}

.btn-green:hover,
.el-button--success:hover,
.el-button[style*="#3ecf8e"]:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
  color: var(--ess-white) !important;
  transform: translateY(-1px);
}

.btn-grey,
.btn-green-line,
.el-button.is-plain {
  background: var(--ess-white) !important;
  border-color: var(--ess-border) !important;
  color: var(--ess-text) !important;
}

.btn-grey:hover,
.btn-green-line:hover,
.el-button.is-plain:hover {
  border-color: var(--ess-orange) !important;
  color: var(--ess-orange) !important;
  box-shadow: var(--ess-shadow-sm);
}

/* Home hero */
#main-search-banner,
.mobile-home-banner {
  overflow: hidden;
  background-color: var(--ess-white);
  border-radius: 0 0 28px 28px;
  box-shadow: var(--ess-shadow-sm);
}

#main-search-banner {
  min-height: 430px;
  margin-bottom: 32px;
}

#main-search-banner:after {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.96) 0%, rgba(255, 255, 255, 0.82) 46%, rgba(255, 255, 255, 0.18) 100%);
}

#main-search-banner .banner-center {
  max-width: 640px;
  padding: 54px 24px;
}

#main-search-banner .banner-center h2 {
  max-width: 560px;
  color: var(--ess-text);
  font-size: clamp(36px, 5vw, 58px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: 0;
}

#main-search-banner .ess-home-kicker {
  color: var(--ess-orange);
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

#main-search-banner .ess-home-subtitle {
  max-width: 500px;
  color: var(--ess-muted);
  font-size: 18px;
  line-height: 1.55;
}

#main-search-banner .banner-center .btn,
#main-search-banner .banner-center button {
  min-height: 48px;
  padding: 0 24px;
  font-weight: 700;
}

#main-search-banner .search-geocomplete,
#main-search-banner .location-search,
#main-search-banner .form-control {
  min-height: 54px;
  border-radius: var(--ess-radius-sm);
  font-size: 15px;
}

/* Section rhythm */
#vue-home-widgets {
  padding-top: 8px;
  padding-bottom: 48px;
}

#vue-home-widgets .swiperOutsideContainer {
  margin-bottom: 42px;
}

#vue-home-widgets .swiperOutsideContainer h3,
.menu-center h4,
.menu-center h5 {
  color: var(--ess-text);
  font-weight: 800 !important;
  letter-spacing: 0;
}

/* Cuisine chips */
.swiperCuisine .swiperSlide {
  width: 118px;
  min-height: 112px;
  padding: 16px 10px;
  background: var(--ess-white);
  border: 1px solid var(--ess-border);
  border-radius: var(--ess-radius-md);
  box-shadow: 0 6px 18px rgba(18, 24, 40, 0.05);
}

.swiperCuisine .swiperSlide:hover {
  border-color: rgba(245, 130, 32, 0.35);
  box-shadow: var(--ess-shadow-sm);
  transform: translateY(-2px);
}

.swiperCuisine .swiperSlide img {
  width: 56px;
  height: 56px;
  padding: 10px;
  background: #fff4ea;
  object-fit: cover;
}

.swiperCuisine .swiperSlide .truncate {
  margin-top: 10px;
  color: var(--ess-text);
  font-weight: 600;
}

/* Restaurant and featured cards */
.swiperResto .swiperSlide,
.section-results .items,
.list-items,
.restaurants-list .items {
  overflow: hidden;
  background: var(--ess-white);
  border: 1px solid var(--ess-border);
  border-radius: var(--ess-radius-md);
  box-shadow: 0 8px 24px rgba(18, 24, 40, 0.07);
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), border-color var(--ess-transition);
}

.swiperResto .swiperSlide:hover,
.section-results .items:hover,
.list-items:hover {
  border-color: rgba(245, 130, 32, 0.26);
  box-shadow: var(--ess-shadow-md);
  transform: translateY(-3px);
}

.swiperResto .swiperSlide img {
  height: 178px;
  width: 100%;
  object-fit: cover;
}

.swiperResto .swiperSlide .p-2 {
  padding: 16px !important;
}

.swiperResto .swiperSlide .font-weight-bold,
.swiperResto .swiperSlide h6 {
  color: var(--ess-text);
  font-size: 16px;
  font-weight: 800 !important;
}

.swiperResto .swiperSlide .font-weight-light,
.swiperResto .swiperSlide .row {
  color: var(--ess-muted);
  font-size: 13px;
}

.gold-color,
.fas.fa-star {
  color: var(--ess-orange) !important;
}

.featured-item-price {
  color: var(--ess-text);
  font-weight: 800;
}

.swiper-button-next .el-button,
.swiper-button-prev .el-button {
  width: 44px;
  height: 44px;
  border: 1px solid var(--ess-border);
  background: var(--ess-white);
  box-shadow: var(--ess-shadow-sm);
}

/* Restaurant detail */
.merchant-top-header,
.top-merchant-details {
  overflow: hidden;
  background: var(--ess-white);
  border: 1px solid var(--ess-border);
  border-radius: 24px;
  box-shadow: var(--ess-shadow-sm);
}

.menu-category a {
  border-radius: 999px;
  color: var(--ess-muted);
  font-weight: 700;
}

.menu-category li.active a,
.menu-category li a.active,
#menu-category .col a.active {
  background: var(--ess-orange) !important;
  color: var(--ess-white) !important;
}

.list-item-rows {
  border: 1px solid var(--ess-border);
  border-radius: var(--ess-radius-md);
  box-shadow: 0 6px 18px rgba(18, 24, 40, 0.05);
}

.list-item-rows:hover {
  border-color: rgba(245, 130, 32, 0.28);
  box-shadow: var(--ess-shadow-sm);
}

.list-item-rows img,
.item-image-preview img,
.item-image-preview .el-image {
  border-radius: var(--ess-radius-sm);
  object-fit: cover;
}

/* Cart and checkout surfaces */
.sticky-cart,
.section-cart,
.card,
.checkout-section,
.order-summary {
  border-color: var(--ess-border) !important;
  border-radius: var(--ess-radius-md) !important;
  box-shadow: 0 8px 24px rgba(18, 24, 40, 0.06);
}

.section-cart h5,
.section-cart h6 {
  color: var(--ess-text);
  font-weight: 800;
}

.qty-btn,
.item-remove {
  border-color: var(--ess-border);
  background: var(--ess-white);
}

.qty-btn:hover,
.item-remove:hover {
  border-color: var(--ess-orange);
  color: var(--ess-orange);
}

/* Footer */
footer {
  margin-top: 48px;
  padding: 32px 0;
  background: #171717;
  color: rgba(255, 255, 255, 0.78);
}

footer a {
  color: var(--ess-white);
}

footer .container {
  max-width: 1180px;
}

/* Mobile */
@media (max-width: 991.98px) {
  body {
    background: var(--ess-white);
  }

  #top-navigation {
    min-height: 64px;
    padding: 10px 14px;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }

  #top-navigation .top-logo img,
  .top-logo img {
    max-height: 34px;
  }

  #main-search-banner,
  .mobile-home-banner {
    border-radius: 0 0 24px 24px;
    box-shadow: none;
  }

  #main-search-banner {
    min-height: 360px;
    margin-bottom: 22px;
  }

  #main-search-banner .banner-center {
    padding: 34px 18px;
  }

  #main-search-banner .banner-center h2 {
    font-size: 34px;
    line-height: 1.08;
  }

  #main-search-banner .ess-home-subtitle {
    font-size: 15px;
  }

  .swiperResto .swiperSlide img {
    height: 150px;
  }

  .swiperCuisine .swiperSlide {
    width: 92px;
    min-height: 98px;
    padding: 12px 8px;
  }

  .swiperCuisine .swiperSlide img {
    width: 48px;
    height: 48px;
  }

  .merchant-top-header,
  .top-merchant-details,
  .list-item-rows,
  .sticky-cart,
  .section-cart,
  .card {
    border-radius: 16px !important;
  }
}

/* Phase 3: small template hooks for a more native Esskompass v3 surface. */
.ess-top-shell {
  background: #fff;
  border-bottom: 1px solid var(--ess-border);
  position: sticky;
  top: 0;
  z-index: 1020;
}

.ess-top-nav-v3 {
  min-height: 74px;
  max-width: 1280px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 18px;
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

.ess-top-logo-col .top-logo img,
.ess-top-logo-col img {
  max-height: 46px;
  width: auto;
}

.ess-top-search-col {
  padding-left: 22px;
  padding-right: 22px;
}

.ess-top-search-wrap {
  width: 100%;
  gap: 12px;
}

.ess-top-search-wrap > * {
  max-width: 100%;
}

.ess-top-actions-col .top-menu {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin-bottom: 0;
}

.ess-top-actions-col .top-menu > li {
  margin: 0 !important;
  padding: 0 !important;
}

.ess-top-actions-col .top-menu a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
}

.ess-top-actions-col .line-left {
  border-left: 0 !important;
}

.ess-top-actions-col .line-left a {
  padding: 0 15px;
  border: 1px solid var(--ess-border);
  background: #fff;
}

.ess-top-actions-col .cart-handle {
  width: 44px;
  height: 44px;
  justify-content: center;
  background: var(--ess-bg);
  border: 1px solid var(--ess-border);
}

.ess-top-actions-col .cart-handle img {
  max-width: 22px;
}

.ess-home-v3 {
  background: linear-gradient(180deg, #fff 0%, var(--ess-bg) 100%);
}

.ess-hero-v3 {
  min-height: 430px !important;
  position: relative;
  overflow: hidden;
}

.ess-hero-v3:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 74% 36%, rgba(73, 169, 66, 0.13), transparent 25%),
    radial-gradient(circle at 85% 12%, rgba(245, 130, 32, 0.13), transparent 20%);
  pointer-events: none;
}

.ess-hero-content {
  position: relative;
  z-index: 1;
  max-width: 760px;
  width: 100%;
  padding: 54px 22px !important;
}

.ess-hero-content h2 {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  font-size: clamp(38px, 5vw, 64px) !important;
  line-height: 1.02 !important;
}

.ess-hero-content .ess-home-subtitle {
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
  font-size: 18px !important;
  line-height: 1.6;
}

.ess-hero-search {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 18px !important;
  box-shadow: 0 22px 60px rgba(17, 24, 39, 0.10) !important;
}

.ess-home-pills {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.ess-home-pills span {
  background: #fff;
  border: 1px solid var(--ess-border);
  color: var(--ess-muted);
  border-radius: 999px;
  padding: 8px 13px;
  font-size: 13px;
  font-weight: 700;
}

.ess-home-content-v3 {
  max-width: 1280px;
}

.ess-section-carousel {
  margin-top: 26px;
  margin-bottom: 34px;
}

.ess-section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.ess-section-heading h3 {
  margin: 0;
  font-size: 25px;
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

.ess-restaurant-carousel .swiper-container,
.ess-featured-carousel .swiper-container {
  overflow: visible;
}

.ess-restaurant-card-v3,
.ess-featured-card-v3 {
  border: 1px solid var(--ess-border) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.08) !important;
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.ess-restaurant-card-v3:hover,
.ess-featured-card-v3:hover {
  transform: translateY(-3px);
  border-color: rgba(245, 130, 32, 0.25) !important;
  box-shadow: 0 18px 44px rgba(17, 24, 39, 0.12) !important;
}

.ess-restaurant-card-media,
.ess-featured-card-media {
  background: var(--ess-bg);
  overflow: hidden;
}

.ess-restaurant-card-v3 img,
.ess-featured-card-v3 img {
  width: 100%;
  object-fit: cover;
  transition: transform 0.22s ease;
}

.ess-restaurant-card-v3:hover img,
.ess-featured-card-v3:hover img {
  transform: scale(1.025);
}

.ess-restaurant-card-body,
.ess-featured-card-body {
  padding: 14px 15px 15px !important;
}

.ess-restaurant-card-title,
.ess-featured-card-title {
  color: var(--ess-text) !important;
  font-size: 16px;
  font-weight: 800 !important;
}

.ess-restaurant-card-cuisine,
.ess-featured-card-description {
  color: var(--ess-muted) !important;
  font-size: 13px;
  line-height: 1.45;
}

.ess-restaurant-card-meta {
  color: var(--ess-muted);
  font-size: 12px;
  font-weight: 600;
}

.ess-restaurant-card-meta .gold-color {
  color: var(--ess-orange) !important;
}

.ess-featured-card-footer {
  margin-top: 12px;
}

.ess-featured-card-v3 .featured-item-price {
  color: var(--ess-text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
}

.ess-featured-card-v3 .el-button {
  min-width: 44px;
  min-height: 38px;
  border-radius: 12px !important;
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
}

.ess-featured-card-v3 .el-button:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
}

.swiper-button-next .el-button,
.swiper-button-prev .el-button {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  color: var(--ess-text) !important;
  box-shadow: var(--ess-shadow-sm) !important;
}

@media (max-width: 991.98px) {
  .ess-top-shell {
    position: sticky;
  }

  .ess-top-nav-v3 {
    min-height: 66px;
    padding: 0 12px;
  }

  .ess-top-logo-col .top-logo img,
  .ess-top-logo-col img {
    max-height: 38px;
  }

  .ess-top-actions-col .top-menu {
    gap: 8px;
  }

  .ess-hero-v3 {
    min-height: 350px !important;
    border-radius: 0 0 24px 24px !important;
  }

  .ess-hero-content {
    padding: 38px 14px !important;
  }

  .ess-hero-content h2 {
    font-size: 34px !important;
  }

  .ess-hero-content .ess-home-subtitle {
    font-size: 15px !important;
  }

  .ess-hero-search {
    border-radius: 16px !important;
  }

  .ess-section-heading h3 {
    font-size: 22px;
  }

  .ess-restaurant-card-body,
  .ess-featured-card-body {
    padding: 13px !important;
  }
}

@media (max-width: 430px) {
  .ess-top-actions-col .line-left {
    display: none !important;
  }

  .ess-home-pills {
    gap: 8px;
  }

  .ess-home-pills span {
    font-size: 12px;
    padding: 7px 10px;
  }

  .ess-restaurant-card-title,
  .ess-featured-card-title {
    font-size: 15px;
  }
}

/* Milestone 2 / Phase 2.3: restaurant feed, filters and list skeletons */
.ess-feed-page {
  padding-top: 18px;
  padding-bottom: 28px;
}

.ess-feed-layout {
  align-items: flex-start;
}

.ess-feed-filter-column {
  position: sticky;
  top: 96px;
  align-self: flex-start;
}

.ess-feed-results-head h4,
.ess-feed-mobile-title h4,
.ess-section-heading h3 {
  color: var(--ess-text);
  font-weight: 800 !important;
  letter-spacing: 0;
}

.ess-feed-results-head h6,
.ess-section-heading h5 {
  margin-top: 6px !important;
  color: var(--ess-muted);
  font-size: 14px;
  line-height: 1.45;
}

.ess-filter-card {
  padding: 18px;
  border: 1px solid var(--ess-border) !important;
  border-radius: 22px;
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--ess-shadow-sm);
}

.ess-filter-row {
  border-bottom-color: rgba(236, 236, 236, .9) !important;
}

.ess-filter-row:last-child {
  border-bottom: 0 !important;
}

.ess-filter-row h5 {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
}

.ess-filter-row h5 a {
  position: relative;
  padding: 10px 28px 10px 0;
  color: var(--ess-text) !important;
  text-decoration: none !important;
}

.ess-filter-row h5 a:after {
  content: "+";
  position: absolute;
  right: 0;
  top: 9px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: var(--ess-orange);
  background: rgba(245, 130, 32, .10);
  font-weight: 800;
  line-height: 1;
}

.ess-filter-row h5 a[aria-expanded="true"]:after {
  content: "-";
}

.ess-filter-card .custom-control-label {
  color: var(--ess-muted);
  font-size: 14px;
  line-height: 1.35;
}

.ess-filter-card .custom-control-input:checked ~ .custom-control-label,
.ess-filter-card .custom-radio .custom-control-input:checked ~ .custom-control-label {
  color: var(--ess-text);
  font-weight: 700;
}

.ess-filter-card .btn-group-toggle {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.ess-filter-card .btn-group-toggle .btn,
.ess-filter-card .input-group-small .btn {
  min-height: 38px;
  padding: 7px 10px !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 12px !important;
  color: var(--ess-muted) !important;
  background: #fff !important;
  box-shadow: none !important;
}

.ess-filter-card .btn-group-toggle .btn.active,
.ess-filter-card .input-group-small .btn.active {
  color: var(--ess-orange) !important;
  border-color: rgba(245, 130, 32, .35) !important;
  background: rgba(245, 130, 32, .10) !important;
}

.ess-filter-chip-col {
  margin-bottom: 10px !important;
}

.ess-filter-card .more-cuisine,
.ess-filter-card .link {
  color: var(--ess-orange) !important;
  font-weight: 800;
}

.ess-feed-mobile-search-card {
  padding: 10px;
  border: 1px solid var(--ess-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--ess-shadow-sm);
}

.ess-feed-mobile-search input,
#feed-search-mobile input {
  min-height: 46px;
  border: 1px solid var(--ess-border) !important;
  border-radius: 14px !important;
  background: var(--ess-bg) !important;
}

.ess-feed-mobile-search .filter_wrap .btn,
#feed-search-mobile .filter_wrap .btn {
  border-radius: 12px !important;
  background-color: var(--ess-orange) !important;
}

.ess-feed-card-grid,
.ess-restaurant-card-grid {
  margin-left: -10px !important;
  margin-right: -10px !important;
}

.ess-feed-card-col,
.ess-restaurant-card-col {
  padding: 10px !important;
}

.ess-feed-card,
.ess-restaurant-card {
  overflow: hidden;
  height: 100%;
  border: 1px solid var(--ess-border);
  border-radius: 20px !important;
  background: #fff;
  box-shadow: 0 10px 28px rgba(17, 24, 39, .08);
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), border-color var(--ess-transition);
}

.ess-feed-card:hover,
.ess-restaurant-card:hover {
  transform: translateY(-3px);
  border-color: rgba(245, 130, 32, .22);
  box-shadow: 0 18px 42px rgba(17, 24, 39, .13);
}

.ess-feed-card-media,
.ess-restaurant-card-media {
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--ess-bg);
}

.ess-feed-card-media .el-image,
.ess-restaurant-card-media .el-image,
.ess-feed-card-media img,
.ess-restaurant-card-media img {
  width: 100%;
  height: 100%;
  min-height: 0 !important;
  object-fit: cover;
  transition: transform 240ms ease;
}

.ess-feed-card:hover .ess-feed-card-media .el-image,
.ess-restaurant-card:hover .ess-restaurant-card-media .el-image {
  transform: scale(1.035);
}

.ess-feed-card-body,
.ess-restaurant-card-body {
  padding: 14px !important;
}

.ess-feed-card-title,
.ess-restaurant-card-title {
  margin-bottom: 5px !important;
  color: var(--ess-text);
  font-size: 17px;
  line-height: 1.25;
  font-weight: 800;
}

.ess-feed-card-cuisines,
.ess-restaurant-card-cuisines {
  color: var(--ess-muted) !important;
  font-size: 13px;
}

.ess-feed-meta-row,
.ess-restaurant-card-meta {
  gap: 8px;
  margin-top: 12px;
  color: var(--ess-muted);
  font-size: 12px;
}

.ess-feed-meta-item {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.ess-feed-meta-item .d-flex {
  align-items: center;
  min-width: 0;
}

.ess-feed-meta-row .gold-color,
.ess-restaurant-card-meta .gold-color {
  color: var(--ess-orange) !important;
}

.ess-feed-promo-row {
  margin-top: 10px;
  padding: 7px 9px;
  border-radius: 999px;
  color: var(--ess-green);
  background: var(--ess-green-soft);
  font-size: 12px;
  font-weight: 700;
}

.ess-feed-card .with-promo,
.ess-restaurant-card .with-promo {
  top: 10px;
  left: 10px;
  border-radius: 999px;
  background: var(--ess-orange);
  box-shadow: 0 8px 18px rgba(245, 130, 32, .24);
}

.ess-feed-card .fav-floating,
.ess-restaurant-card .fav-floating {
  top: 10px;
  right: 10px;
}

.ess-feed-card .layer-content p,
.ess-restaurant-card .layer-content p {
  max-width: 80%;
  padding: 8px 12px;
  border-radius: 999px;
  color: #fff;
  background: rgba(17, 24, 39, .72);
}

.ess-feed-empty {
  max-width: 720px;
  margin-top: 24px;
}

.ess-feed-empty .ess-empty-card {
  justify-content: flex-start;
  min-height: 170px;
}

.ess-feed-skeleton-grid,
.ess-restaurant-skeleton-row {
  margin-left: -10px;
  margin-right: -10px;
}

.ess-feed-skeleton-card,
.ess-restaurant-skeleton-item {
  overflow: hidden;
  padding: 12px;
  border: 1px solid var(--ess-border);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--ess-shadow-sm);
}

.ess-feed-skeleton-card .el-skeleton__image,
.ess-feed-skeleton-card .el-skeleton__item[style*="height: 170px"],
.ess-restaurant-skeleton-item .el-skeleton__item[style*="height: 180px"] {
  border-radius: 16px;
}

.ess-feed-load-more .btn {
  width: auto !important;
  min-width: 170px;
  border-radius: 14px !important;
}

@media (max-width: 991px) {
  .ess-feed-page {
    padding-top: 10px;
  }

  .ess-feed-results-column {
    padding-left: 0;
    padding-right: 0;
  }

  .ess-feed-card-col,
  .ess-restaurant-card-col {
    padding: 8px !important;
  }
}

@media (max-width: 768px) {
  .ess-feed-card-grid,
  .ess-restaurant-card-grid {
    margin-left: -6px !important;
    margin-right: -6px !important;
  }

  .ess-feed-card-col,
  .ess-restaurant-card-col {
    padding: 6px !important;
  }

  .ess-feed-card-title,
  .ess-restaurant-card-title {
    font-size: 16px;
  }

  .ess-feed-meta-row {
    flex-wrap: wrap;
    justify-content: flex-start !important;
  }

  .ess-feed-empty .ess-empty-card {
    justify-content: center;
  }
}

@media (max-width: 430px) {
  .ess-feed-mobile-search-card {
    padding: 8px;
  }

  .ess-feed-card,
  .ess-restaurant-card {
    border-radius: 18px !important;
  }

  .ess-feed-card-body,
  .ess-restaurant-card-body {
    padding: 12px !important;
  }

  .ess-feed-skeleton-card {
    padding: 10px;
  }
}

/* Milestone 2 / Phase 2.2: premium empty states and auth polish */
.ess-empty-state {
  width: 100%;
  max-width: 820px;
  margin: 48px auto;
  padding: 0 16px;
}

.ess-empty-card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  min-height: 260px;
  padding: 34px;
  border: 1px solid var(--ess-border);
  border-radius: 24px;
  background:
    radial-gradient(circle at 16% 10%, rgba(245, 130, 32, .12), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(73, 169, 66, .10), transparent 26%),
    #fff;
  box-shadow: var(--ess-shadow-md);
}

.ess-empty-media {
  flex: 0 0 auto;
  margin: 0 !important;
}

.ess-empty-media img {
  max-width: 230px;
  filter: drop-shadow(0 14px 24px rgba(17, 24, 39, .08));
}

.ess-empty-content {
  max-width: 440px;
  text-align: left;
}

.ess-empty-content h3,
.ess-empty-content h4 {
  margin: 0 0 10px;
  color: var(--ess-text);
  font-weight: 800;
  letter-spacing: 0;
}

.ess-empty-content h3 {
  font-size: 30px;
  line-height: 1.15;
}

.ess-empty-content h4 {
  font-size: 24px;
  line-height: 1.18;
}

.ess-empty-content p {
  margin: 0 0 22px;
  color: var(--ess-muted);
  font-size: 16px;
  line-height: 1.65;
}

.ess-empty-action {
  width: auto !important;
  min-width: 150px;
  padding-left: 22px !important;
  padding-right: 22px !important;
  border-radius: 14px !important;
}

.ess-empty-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  border-radius: 18px;
  color: var(--ess-orange);
  font-size: 25px;
  font-weight: 800;
  background: rgba(245, 130, 32, .12);
  border: 1px solid rgba(245, 130, 32, .18);
}

.ess-menu-search-empty {
  max-width: 680px;
  margin: 22px auto 30px;
}

.ess-menu-search-empty .ess-empty-card {
  justify-content: flex-start;
  min-height: 150px;
  padding: 24px;
}

.ess-menu-search-empty .ess-empty-content p {
  margin-bottom: 0;
}

.ess-auth-page {
  min-height: 70vh;
}

.ess-auth-shell {
  width: min(100%, 520px) !important;
  max-width: 520px;
}

.ess-auth-header {
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

.ess-auth-kicker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 10px;
  padding: 7px 12px;
  border-radius: 999px;
  color: var(--ess-green);
  background: var(--ess-light-green);
  font-size: 13px;
  font-weight: 700;
}

.ess-auth-header h5 {
  margin: 0 0 10px !important;
  color: var(--ess-text);
  font-size: 32px;
  line-height: 1.12;
  font-weight: 800;
}

.ess-auth-header p {
  margin: 0;
  color: var(--ess-muted);
  font-size: 15px;
  line-height: 1.55;
}

.ess-auth-card {
  position: relative;
  width: 100%;
  padding: 28px !important;
  border: 1px solid var(--ess-border);
  border-radius: 24px;
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--ess-shadow-md);
}

.ess-auth-card .form-label-group {
  margin-bottom: 16px;
}

.ess-auth-card .form-control,
.ess-auth-card .form-control-text,
.ess-auth-card input {
  border-radius: 14px !important;
  background: #fff !important;
}

.ess-auth-card .btn-green {
  border-radius: 14px !important;
  min-height: 50px;
  font-weight: 800 !important;
}

.ess-auth-switch {
  padding-top: 16px;
  border-top: 1px solid var(--ess-border);
}

.ess-auth-switch p {
  color: var(--ess-muted);
  font-size: 14px;
}

.ess-auth-switch .btn-white {
  color: var(--ess-orange) !important;
  font-weight: 800 !important;
}

.ess-auth-guest .btn-light {
  border: 1px solid var(--ess-border) !important;
  border-radius: 14px !important;
  background: var(--ess-bg) !important;
  font-weight: 700;
}

.ess-auth-social {
  display: flex;
  justify-content: center;
}

.ess-auth-trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.ess-auth-trust span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 8px;
  border-radius: 12px;
  color: var(--ess-muted);
  background: var(--ess-bg);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
}

@media (max-width: 768px) {
  .ess-empty-state {
    margin: 28px auto;
  }

  .ess-empty-card {
    flex-direction: column;
    min-height: auto;
    padding: 26px 20px;
    gap: 18px;
    text-align: center;
  }

  .ess-empty-content {
    text-align: center;
  }

  .ess-empty-content h3 {
    font-size: 25px;
  }

  .ess-empty-content h4 {
    font-size: 22px;
  }

  .ess-empty-content p {
    font-size: 14px;
  }

  .ess-empty-media img {
    max-width: 190px;
  }

  .ess-auth-shell {
    padding-top: 28px !important;
    padding-bottom: 32px !important;
  }

  .ess-auth-header h5 {
    font-size: 28px;
  }

  .ess-auth-card {
    padding: 22px !important;
    border-radius: 20px;
  }
}

@media (max-width: 430px) {
  .ess-empty-state {
    padding: 0 10px;
    margin-top: 20px;
    margin-bottom: 24px;
  }

  .ess-empty-card {
    border-radius: 20px;
    padding: 22px 16px;
  }

  .ess-empty-media img {
    max-width: 150px;
  }

  .ess-empty-action {
    width: 100% !important;
  }

  .ess-auth-card {
    padding: 18px !important;
  }

  .ess-auth-trust {
    grid-template-columns: 1fr;
  }

  .ess-auth-header p {
    font-size: 14px;
  }
}

@media (max-width: 430px) {
  .container,
  .container-fluid {
    padding-left: 14px;
    padding-right: 14px;
  }

  #main-search-banner .banner-center h2 {
    font-size: 30px;
  }

  #vue-home-widgets .swiperOutsideContainer h3 {
    font-size: 21px;
  }

  .swiperResto .swiperSlide {
    border-radius: 16px;
  }

  .swiperResto .swiperSlide img {
    height: 140px;
  }

  .btn-green,
  .btn-grey,
  .btn-green-line {
    min-height: 46px;
    font-weight: 700;
  }
}

/* Phase 2: final visual polish. This file is loaded after the base theme CSS. */
html,
body {
  background: var(--ess-bg) !important;
  color: var(--ess-text) !important;
  overflow-x: hidden;
}

body,
button,
input,
select,
textarea {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

a {
  color: var(--ess-orange);
}

a:hover {
  color: var(--ess-orange-hover);
}

/* Hero and homepage */
#main-search-banner,
.mobile-home-banner {
  background-color: #fff !important;
  border-bottom: 1px solid rgba(236, 236, 236, 0.9);
}

#main-search-banner .banner-center h2,
.mobile-home-banner h2,
.section-title h3,
#vue-home-widgets h3 {
  color: var(--ess-text) !important;
  letter-spacing: 0;
}

#main-search-banner .banner-center h2,
.mobile-home-banner h2 {
  font-weight: 800 !important;
}

#main-search-banner .banner-center p,
.mobile-home-banner p,
.section-title p {
  color: var(--ess-muted) !important;
}

#main-search-banner .search-wrap,
.search-geocomplete-wrap,
.mobile-home-banner .search-wrap {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ess-shadow-sm) !important;
}

/* Header */
#top-navigation,
.top-menu,
.header-nav {
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid var(--ess-border) !important;
  box-shadow: 0 8px 24px rgba(17, 24, 39, 0.04) !important;
}

#top-navigation .nav-link,
#top-navigation a,
.top-menu a {
  color: var(--ess-text) !important;
  font-weight: 600;
}

#top-navigation .btn,
.top-menu .btn {
  border-radius: 12px !important;
}

/* Buttons */
.btn,
button,
input[type="submit"],
.btn-green,
.btn-black,
.btn-orange {
  border-radius: 12px !important;
  letter-spacing: 0 !important;
}

.btn-green,
.btn-orange,
.btn-primary,
button[type="submit"],
input[type="submit"] {
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(245, 130, 32, 0.22) !important;
}

.btn-green:hover,
.btn-orange:hover,
.btn-primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
}

.btn-green-line,
.btn-white,
.btn-light {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  color: var(--ess-text) !important;
  box-shadow: none !important;
}

/* Forms and search fields */
.form-control,
input.form-control,
textarea.form-control,
select.form-control,
.custom-select,
.select2-container .select2-selection,
.el-input__inner {
  min-height: 48px;
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 12px !important;
  color: var(--ess-text) !important;
  box-shadow: none !important;
}

.form-control:focus,
input.form-control:focus,
textarea.form-control:focus,
.custom-select:focus,
.select2-container--focus .select2-selection,
.el-input__inner:focus {
  border-color: var(--ess-orange) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.12) !important;
}

label,
.form-label {
  color: var(--ess-text) !important;
  font-weight: 600;
}

/* Restaurant cards and listing */
.swiperResto .swiperSlide,
.restaurant-card,
.list-item-rows,
.merchant-list-item,
.items-row,
.card {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ess-shadow-sm) !important;
  overflow: hidden;
}

.swiperResto .swiperSlide:hover,
.restaurant-card:hover,
.list-item-rows:hover,
.merchant-list-item:hover {
  transform: translateY(-2px);
  box-shadow: var(--ess-shadow-md) !important;
}

.swiperResto .swiperSlide img,
.restaurant-card img,
.merchant-list-item img {
  border-radius: 16px 16px 0 0 !important;
}

.swiperResto h5,
.restaurant-card h5,
.merchant-list-item h5,
.items-row h5 {
  color: var(--ess-text) !important;
  font-weight: 700 !important;
}

.swiperResto p,
.restaurant-card p,
.merchant-list-item p,
.items-row p,
.text-muted {
  color: var(--ess-muted) !important;
}

.badge,
.badge-success,
.open-status,
.tag-success {
  border-radius: 999px !important;
  font-weight: 700 !important;
}

.badge-success,
.open-status,
.tag-success {
  background: var(--ess-light-green) !important;
  color: var(--ess-green) !important;
}

/* Restaurant detail and menu */
.merchant-top-header,
.top-merchant-details,
.merchant-detail-header {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 20px !important;
  box-shadow: var(--ess-shadow-sm) !important;
}

#menu-category a,
.menu-category a,
.category-list a,
.category-carousel a {
  border-radius: 999px !important;
  color: var(--ess-muted) !important;
}

#menu-category a.active,
#menu-category a:hover,
.menu-category a.active,
.category-list a.active,
.category-carousel a.active {
  background: var(--ess-orange) !important;
  color: #fff !important;
}

.menu-item,
.item-row,
.items-row {
  border-radius: 16px !important;
}

.menu-item .price,
.item-row .price,
.items-row .price {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

/* Cart and checkout, visual only */
.sticky-cart,
.section-cart,
.cart-summary,
.checkout-section,
.payment-option,
.delivery-option {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ess-shadow-sm) !important;
}

.sticky-cart h5,
.section-cart h5,
.checkout-section h5,
.checkout-section h4 {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

.cart-total,
.summary-total,
.checkout-total {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

/* Login / register */
.action-login .page-content,
.action-signup .page-content,
.action-signup_less .page-content,
.action-forgot_password .page-content {
  background: var(--ess-bg) !important;
}

.action-login form,
.action-signup form,
.action-signup_less form,
.action-forgot_password form {
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 24px !important;
  box-shadow: var(--ess-shadow-md) !important;
  padding: 28px !important;
}

.action-login h3,
.action-signup h3,
.action-signup_less h3,
.action-forgot_password h3 {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

/* Footer */
footer,
.footer-section,
#footer {
  background: #171717 !important;
  border-top: 0 !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

footer h5,
footer h6,
.footer-section h5,
.footer-section h6,
#footer h5,
#footer h6 {
  color: #fff !important;
  font-weight: 800 !important;
}

footer a,
.footer-section a,
#footer a {
  color: rgba(255, 255, 255, 0.74) !important;
}

footer a:hover,
.footer-section a:hover,
#footer a:hover {
  color: #fff !important;
}

footer .form-control,
.footer-section .form-control,
#footer .form-control {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #fff !important;
}

@media (max-width: 991.98px) {
  body {
    background: #fff !important;
  }

  #top-navigation,
  .top-menu,
  .mobile-header {
    box-shadow: none !important;
  }

  .merchant-top-header,
  .top-merchant-details,
  .merchant-detail-header {
    border-radius: 0 0 20px 20px !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }

  #menu-category,
  .menu-category,
  .category-carousel {
    background: #fff !important;
    border-bottom: 1px solid var(--ess-border) !important;
  }

  #menu-category a,
  .menu-category a,
  .category-carousel a {
    background: #fff !important;
    border: 1px solid var(--ess-border) !important;
    padding: 9px 14px !important;
    white-space: nowrap;
  }

  .section-cart,
  .sticky-cart,
  .checkout-section,
  .payment-option,
  .delivery-option {
    border-radius: 14px !important;
    box-shadow: none !important;
  }
}

/* Phase 4: restaurant detail and mobile refinement */
.ess-merchant-hero {
  border: 0 !important;
  border-radius: 0 0 28px 28px !important;
  box-shadow: none !important;
  background: #fff !important;
}

.ess-merchant-breadcrumb {
  color: var(--ess-muted);
  font-size: 13px;
}

.ess-merchant-hero-row {
  align-items: stretch;
  min-height: 230px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--ess-border);
  border-radius: 24px;
  background: linear-gradient(135deg, #fff 0%, #fff8f1 52%, #f1fbef 100%);
  box-shadow: var(--ess-shadow-sm);
}

.ess-merchant-info-card {
  display: flex;
  align-items: center;
  padding: 28px !important;
}

.ess-merchant-logo-wrap {
  flex: 0 0 auto;
}

.ess-merchant-logo {
  width: 118px !important;
  min-width: 118px !important;
  height: 118px !important;
  min-height: 118px !important;
  max-height: 118px !important;
  padding: 10px !important;
  border: 1px solid rgba(245, 130, 32, 0.16) !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 10px 28px rgba(18, 24, 40, 0.08) !important;
}

.ess-merchant-copy {
  min-width: 0 !important;
}

.ess-merchant-copy ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  line-height: 1.35;
}

.ess-merchant-copy li {
  color: var(--ess-muted);
}

.ess-merchant-title {
  margin: 4px 0 10px;
  color: var(--ess-text) !important;
  font-size: 30px;
  font-weight: 800;
  line-height: 1.08;
}

.ess-merchant-media-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 230px;
  padding: 0 !important;
  border-radius: 0 !important;
  background: radial-gradient(circle at 65% 42%, rgba(245, 130, 32, 0.14), transparent 35%),
    linear-gradient(135deg, rgba(73, 169, 66, 0.08), rgba(245, 130, 32, 0.08));
}

.ess-merchant-header-image {
  display: block;
  width: 100% !important;
  height: 230px !important;
  max-height: 230px !important;
  overflow: hidden;
}

.ess-mobile-merchant-summary {
  background: #fff;
  border-bottom: 1px solid var(--ess-border);
}

.ess-mobile-merchant-summary h5 {
  color: var(--ess-text);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.15;
}

.ess-mobile-merchant-meta {
  color: var(--ess-muted) !important;
  margin-top: 6px;
}

.ess-mobile-service-tabs {
  margin-top: 10px;
}

.ess-menu-section {
  background: var(--ess-bg);
  padding: 28px 0 44px;
}

.ess-menu-left .sticky-sidebar {
  padding: 18px;
  border: 1px solid var(--ess-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--ess-shadow-sm);
}

.ess-menu-left .sticky-sidebar h5 {
  margin-bottom: 12px;
  color: var(--ess-text);
  font-size: 18px;
  font-weight: 800;
}

.ess-menu-search-wrap input,
.ess-menu-search-wrap .form-control,
.ess-menu-search-wrap .el-input__inner {
  min-height: 56px !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: var(--ess-shadow-sm) !important;
  font-size: 16px !important;
}

.ess-menu-category-section {
  display: block;
  margin-bottom: 28px;
  scroll-margin-top: 110px;
}

.ess-menu-category-title {
  margin-bottom: 8px;
  color: var(--ess-text) !important;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.16;
}

.ess-menu-category-description {
  max-width: 760px;
  margin-bottom: 16px;
  color: var(--ess-muted) !important;
}

.ess-menu-item-card {
  margin-bottom: 16px !important;
  overflow: hidden;
  border: 1px solid var(--ess-border) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: var(--ess-shadow-sm) !important;
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), border-color var(--ess-transition);
}

.ess-menu-item-card:hover {
  transform: translateY(-2px);
  border-color: rgba(245, 130, 32, 0.22) !important;
  box-shadow: var(--ess-shadow-md) !important;
}

.ess-menu-item-media {
  padding: 10px !important;
}

.ess-menu-item-media .item-image-preview,
.ess-menu-item-media .el-image,
.ess-menu-item-media img {
  overflow: hidden;
  border-radius: 14px !important;
}

.ess-menu-item-media .el-image {
  height: 148px !important;
}

.ess-menu-item-content {
  padding: 12px 14px 12px 4px !important;
}

.ess-menu-item-title {
  color: var(--ess-text) !important;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
}

.ess-menu-item-description {
  margin: 8px 0 10px;
  color: var(--ess-muted) !important;
  line-height: 1.45;
}

.ess-menu-item-price,
.ess-menu-item-card .prices {
  color: var(--ess-text) !important;
  font-size: 16px;
  font-weight: 800 !important;
}

.ess-menu-add-button,
.quantity-add-cart.ess-menu-add-button,
.xget-item-details.ess-menu-add-button {
  min-height: 44px;
  padding: 11px 18px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--ess-orange) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(245, 130, 32, 0.22) !important;
  font-weight: 800 !important;
}

.ess-menu-add-button:hover,
.quantity-add-cart.ess-menu-add-button:hover,
.xget-item-details.ess-menu-add-button:hover {
  background: var(--ess-orange-hover) !important;
  color: #fff !important;
}

@media (max-width: 991.98px) {
  .ess-hero-v3 {
    min-height: auto !important;
    padding: 20px 14px 24px !important;
    border-radius: 0 0 24px 24px !important;
  }

  .ess-hero-content {
    max-width: 100% !important;
    padding: 0 !important;
  }

  .ess-hero-content h2,
  .ess-hero-content h1 {
    margin-bottom: 12px !important;
    font-size: 34px !important;
    line-height: 1.04 !important;
  }

  .ess-hero-content p,
  .ess-home-subtitle {
    margin-bottom: 16px !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  .ess-hero-search {
    max-width: 100% !important;
    padding: 8px !important;
    gap: 8px !important;
    border-radius: 16px !important;
  }

  .ess-hero-search input,
  .ess-hero-search .form-control,
  .ess-hero-search .el-input__inner {
    min-height: 46px !important;
    font-size: 14px !important;
  }

  .ess-hero-search .btn,
  .ess-hero-search button,
  .ess-hero-search .el-button {
    min-height: 48px !important;
    border-radius: 12px !important;
  }

  .ess-mobile-merchant-hero {
    min-height: 96px !important;
    max-height: 126px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 0 22px 22px !important;
    box-shadow: none !important;
  }

  .ess-mobile-merchant-sub .container {
    padding: 16px 18px !important;
  }

  .ess-mobile-merchant-summary {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }

  .ess-mobile-service-tabs .pt-2 {
    padding-top: 10px !important;
  }

  .ess-menu-section {
    padding-top: 12px;
    padding-bottom: 80px;
  }

  .ess-menu-center {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  .ess-menu-search-wrap {
    margin-bottom: 16px !important;
  }

  .ess-menu-category-section {
    margin-bottom: 22px;
    scroll-margin-top: 96px;
  }

  .ess-menu-category-title {
    font-size: 22px;
  }

  .ess-menu-category-description {
    font-size: 14px;
  }

  .ess-menu-item-card {
    border-radius: 16px !important;
    box-shadow: 0 8px 22px rgba(18, 24, 40, 0.07) !important;
  }

  .ess-menu-item-media {
    padding: 8px !important;
  }

  .ess-menu-item-media .el-image {
    height: 118px !important;
  }

  .ess-menu-item-content {
    padding: 10px 10px 10px 2px !important;
  }

  .ess-menu-item-content .fixed-height {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .ess-menu-item-title {
    font-size: 16px;
  }

  .ess-menu-item-description {
    font-size: 13px;
  }

  .ess-menu-add-button,
  .quantity-add-cart.ess-menu-add-button,
  .xget-item-details.ess-menu-add-button {
    min-height: 40px;
    padding: 9px 14px !important;
    font-size: 14px;
  }
}

@media (max-width: 430px) {
  .ess-hero-content h2,
  .ess-hero-content h1 {
    font-size: 31px !important;
  }

  .ess-mobile-merchant-hero {
    min-height: 82px !important;
    max-height: 108px !important;
  }

  .ess-mobile-merchant-summary h5 {
    font-size: 20px;
  }

  .ess-menu-item-media .el-image {
    height: 104px !important;
  }

  .ess-menu-item-card .row {
    align-items: stretch;
  }
}

/* Milestone 2 / Phase 2.1: premium UX polish, CSS-only */
:root {
  --ess-focus: 0 0 0 4px rgba(245, 130, 32, 0.16);
  --ess-shadow-hover: 0 18px 44px rgba(17, 24, 39, 0.13);
  --ess-surface-strong: #ffffff;
}

a,
button,
.btn,
.qty-btn,
.quantity-add-cart,
.chevron-section,
.payment-option,
.delivery-option,
.restaurant-card,
.merchant-list-item,
.ess-restaurant-card-v3,
.ess-featured-card-v3,
.ess-menu-item-card {
  transition:
    background-color .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    transform .18s ease,
    opacity .18s ease;
}

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.qty-btn:focus-visible,
.quantity-add-cart:focus-visible,
.chevron-section:focus-visible,
.payment-option:focus-visible,
.delivery-option:focus-visible,
.ess-menu-add-button:focus-visible,
.form-control:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 0 !important;
  box-shadow: var(--ess-focus) !important;
}

button:active,
.btn:active,
.quantity-add-cart:active,
.ess-menu-add-button:active {
  transform: translateY(0) scale(.985);
}

button:disabled,
.btn.disabled,
.btn:disabled,
input[type="submit"]:disabled,
.quantity-add-cart.disabled,
.qty-btn.disabled,
.disabled {
  opacity: .55 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

.btn-green,
.btn-orange,
.btn-primary,
button[type="submit"],
input[type="submit"],
.quantity-add-cart,
.ess-menu-add-button {
  min-height: 44px;
  font-weight: 800 !important;
}

.btn-green:hover,
.btn-orange:hover,
.btn-primary:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
.quantity-add-cart:hover,
.ess-menu-add-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(245, 130, 32, .25) !important;
}

.btn-green-line:hover,
.btn-white:hover,
.btn-light:hover,
.btn-grey:hover {
  border-color: rgba(245, 130, 32, .38) !important;
  color: var(--ess-orange) !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, .08) !important;
}

.restaurant-card:hover,
.merchant-list-item:hover,
.ess-restaurant-card-v3:hover,
.ess-featured-card-v3:hover,
.ess-menu-item-card:hover {
  border-color: rgba(245, 130, 32, .24) !important;
  box-shadow: var(--ess-shadow-hover) !important;
}

.ess-menu-item-card:hover .ess-menu-item-title,
.ess-featured-card-v3:hover h5,
.ess-restaurant-card-v3:hover h5 {
  color: var(--ess-orange) !important;
}

/* Cart polish */
.sticky-cart,
.section-cart {
  border-radius: 20px !important;
  box-shadow: 0 16px 42px rgba(17, 24, 39, .08) !important;
}

.section-cart {
  padding: 16px !important;
}

.section-cart .items {
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--ess-border) !important;
}

.section-cart .items:last-child {
  border-bottom: 0 !important;
}

.cart-image-preview img,
.section-cart .cart-image-preview img {
  border-radius: 14px !important;
  box-shadow: 0 8px 18px rgba(17, 24, 39, .08);
}

.section-cart .quantity,
.quantity-parent .quantity {
  min-height: 38px;
  padding: 3px;
  background: var(--ess-bg);
  border: 1px solid var(--ess-border);
  border-radius: 999px;
}

.qty-btn,
.section-cart .qty-btn,
.quantity-parent .qty-btn {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  color: var(--ess-text) !important;
  box-shadow: 0 4px 10px rgba(17, 24, 39, .06) !important;
}

.qty-btn:hover,
.section-cart .qty-btn:hover,
.quantity-parent .qty-btn:hover {
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  color: #fff !important;
}

.section-cart .qty,
.quantity-parent .qty {
  min-width: 28px;
  text-align: center;
  color: var(--ess-text);
  font-weight: 800;
}

.cart-summary {
  margin-top: 16px !important;
  padding: 14px 16px !important;
  background: linear-gradient(180deg, #fff 0%, #fffaf6 100%) !important;
  border-radius: 18px !important;
  border: 1px solid rgba(245, 130, 32, .14) !important;
  box-shadow: 0 10px 26px rgba(17, 24, 39, .06) !important;
}

.cart-summary .d-flex,
.cart-summary .flexrow {
  gap: 10px;
}

.cart-summary p,
.cart-summary span {
  color: var(--ess-muted) !important;
}

.cart-summary .font-weight-bold,
.cart-summary strong,
.cart-summary .summary-total,
.cart-summary .cart-total {
  color: var(--ess-text) !important;
  font-weight: 900 !important;
}

.section-cart a[href*="checkout"],
.section-cart .btn-green,
.sticky-cart .btn-green,
#vue-cart .btn-green {
  min-height: 50px;
  border-radius: 14px !important;
  font-size: 16px;
  box-shadow: 0 16px 34px rgba(245, 130, 32, .28) !important;
}

.cart-empty {
  padding: 34px 18px !important;
  background: linear-gradient(180deg, #fff 0%, #fff9f4 100%);
  border: 1px solid rgba(245, 130, 32, .13);
  border-radius: 20px;
}

.cart-empty h6 {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

.cart-empty p,
.cart-empty .text-muted {
  color: var(--ess-muted) !important;
}

.floating-cart {
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  width: auto !important;
  border-radius: 18px !important;
  background: rgba(34, 34, 34, .94) !important;
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 18px 38px rgba(17, 24, 39, .24) !important;
  backdrop-filter: blur(14px);
}

.floating-cart a,
.floating-cart .btn,
.floating-cart count {
  color: #fff !important;
}

/* Checkout polish */
.checkout-section,
#vue-checkout .border.rounded,
#vue-checkout-booking .border.rounded,
#vue-payment-list .border.rounded,
#vue-wallet .border.rounded,
#vue-cart .card-body {
  background: var(--ess-surface-strong) !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .06) !important;
}

#vue-checkout .border.rounded,
#vue-checkout-booking .border.rounded,
#vue-payment-list .border.rounded,
#vue-wallet .border.rounded {
  padding: 16px !important;
}

.chevron-section.medium,
a.chevron-section.medium,
.payment-option,
.delivery-option {
  min-height: 64px;
  padding: 12px 14px !important;
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 20px rgba(17, 24, 39, .04) !important;
}

.chevron-section.medium:hover,
a.chevron-section.medium:hover,
.payment-option:hover,
.delivery-option:hover {
  border-color: rgba(245, 130, 32, .34) !important;
  box-shadow: 0 14px 30px rgba(17, 24, 39, .08) !important;
  transform: translateY(-1px);
}

.chevron-section.selected,
.chevron-section.medium.selected,
.payment-option.selected,
.delivery-option.selected {
  background: #fffaf6 !important;
  border-color: rgba(245, 130, 32, .55) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, .1), 0 14px 30px rgba(17, 24, 39, .08) !important;
}

.payment-logo-wrap,
.payment-logo-wrap img,
.payment-logo-wrap i {
  border-radius: 12px !important;
}

#vue-cart button[type="submit"],
#vue-cart .btn-green,
#vue-checkout button[type="submit"],
#vue-checkout .btn-green {
  width: 100%;
  min-height: 52px;
  border-radius: 14px !important;
}

/* Skeleton and loading states */
.el-skeleton,
.skeleton-placeholder {
  border-radius: 18px !important;
}

.el-skeleton__item,
.el-skeleton__image,
.el-skeleton__p,
.el-skeleton__text,
.el-skeleton__h3,
.el-skeleton__caption,
.skeleton-placeholder {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #f2f3f5 0%, #fbfbfc 45%, #f2f3f5 100%) !important;
  background-size: 220% 100% !important;
  border-radius: 14px !important;
  animation: ess-shimmer 1.35s ease-in-out infinite;
}

.el-skeleton__image {
  border-radius: 18px !important;
  box-shadow: 0 12px 28px rgba(17, 24, 39, .06);
}

.el-skeleton.is-animated .el-skeleton__item {
  background-size: 220% 100% !important;
}

@keyframes ess-shimmer {
  0% {
    background-position: 120% 0;
  }
  100% {
    background-position: -120% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Mobile spacing refinements */
@media (max-width: 768px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .ess-hero-v3 {
    padding-top: 18px !important;
    padding-bottom: 22px !important;
  }

  .ess-hero-search,
  #main-search-banner .search-wrap,
  .mobile-home-banner .search-wrap {
    border-radius: 14px !important;
    box-shadow: 0 8px 20px rgba(17, 24, 39, .07) !important;
  }

  .ess-hero-search .form-control,
  .ess-hero-search input,
  .mobile-home-banner input,
  #main-search-banner input,
  .form-control,
  .el-input__inner {
    min-height: 44px !important;
    font-size: 15px !important;
  }

  .btn,
  button,
  input[type="submit"],
  .btn-green,
  .btn-orange,
  .btn-primary,
  .quantity-add-cart,
  .ess-menu-add-button {
    min-height: 42px;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }

  .section-cart {
    padding: 12px !important;
  }

  .cart-summary {
    padding: 12px 14px !important;
    border-radius: 16px !important;
  }

  .chevron-section.medium,
  a.chevron-section.medium {
    min-height: 58px;
    border-radius: 14px !important;
  }
}

@media (max-width: 430px) {
  .ess-hero-v3 {
    padding-top: 14px !important;
    padding-bottom: 18px !important;
  }

  .ess-hero-content h1,
  .ess-hero-content h2 {
    font-size: 28px !important;
    line-height: 1.08 !important;
  }

  .ess-hero-content p {
    font-size: 14px !important;
  }

  .ess-home-pills,
  .swiper-container,
  .swiper {
    max-width: 100%;
  }

  .ess-menu-item-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .qty-btn,
  .section-cart .qty-btn,
  .quantity-parent .qty-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px;
  }
}

/* Milestone 2 / Phase 2.4: restaurant detail, menu cards and cart */
.ess-restaurant-detail-shell {
  padding-top: 26px;
  padding-bottom: 42px;
  background:
    radial-gradient(circle at top left, rgba(245, 130, 32, .08), transparent 34%),
    linear-gradient(180deg, #fff 0%, var(--ess-bg) 100%);
}

.ess-merchant-hero {
  padding: 24px 0 10px;
  background:
    radial-gradient(circle at 86% 8%, rgba(73, 169, 66, .12), transparent 32%),
    linear-gradient(180deg, #fff 0%, #fff8f2 100%);
}

.ess-merchant-breadcrumb,
.ess-merchant-breadcrumb a {
  color: var(--ess-muted) !important;
  font-size: 14px;
}

.ess-merchant-hero-row {
  gap: 18px;
  align-items: stretch;
}

.ess-merchant-info-card,
.ess-merchant-media-card {
  overflow: hidden;
  background: rgba(255, 255, 255, .92);
  border: 1px solid var(--ess-border);
  border-radius: 24px !important;
  box-shadow: 0 18px 44px rgba(17, 24, 39, .09);
}

.ess-merchant-info-card {
  flex: 1 1 calc(50% - 9px);
  max-width: calc(50% - 9px);
}

.ess-merchant-media-card {
  flex: 1 1 calc(50% - 9px);
  max-width: calc(50% - 9px);
  min-height: 252px;
}

.ess-merchant-logo-wrap {
  flex: 0 0 auto;
}

.ess-merchant-logo {
  width: 118px !important;
  height: 118px !important;
  object-fit: cover;
  border: 1px solid var(--ess-border) !important;
  border-radius: 22px !important;
  box-shadow: 0 12px 26px rgba(17, 24, 39, .08);
}

.ess-merchant-title {
  color: var(--ess-text);
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 800;
  line-height: 1.08;
}

.ess-merchant-copy .text-muted,
.ess-merchant-copy p,
.ess-merchant-copy small {
  color: var(--ess-muted) !important;
}

.ess-merchant-header-image {
  height: 100%;
  min-height: 252px;
  max-height: 330px !important;
  object-fit: cover;
}

.ess-menu-left .sticky-sidebar {
  padding: 18px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid var(--ess-border);
  border-radius: 22px;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .06);
}

.ess-menu-sidebar-title {
  margin-bottom: 14px;
  color: var(--ess-text);
  font-size: 18px;
  font-weight: 800;
}

.ess-menu-category-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ess-menu-category-list a,
.ess-menu-category-list .nav-link {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 9px 12px !important;
  color: var(--ess-muted) !important;
  border: 1px solid transparent;
  border-radius: 999px;
  transition: all var(--ess-transition);
}

.ess-menu-category-list a:hover,
.ess-menu-category-list .nav-link:hover,
.ess-menu-category-list .active > a,
.ess-menu-category-list a.active {
  color: var(--ess-orange) !important;
  background: #fff7ef;
  border-color: rgba(245, 130, 32, .22);
}

.ess-menu-center {
  padding-left: 22px;
  padding-right: 22px;
}

.ess-menu-search-wrap .form-control,
.ess-menu-search-wrap input,
.ess-menu-search-wrap .el-input__inner {
  min-height: 52px !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, .05) !important;
}

.ess-menu-category-section {
  margin-bottom: 30px;
}

.ess-menu-category-title {
  margin-bottom: 6px !important;
  color: var(--ess-text);
  font-size: 24px;
  font-weight: 800 !important;
  line-height: 1.15;
}

.ess-menu-category-description {
  max-width: 760px;
  color: var(--ess-muted);
  font-size: 15px;
  line-height: 1.55;
}

.ess-menu-card-grid {
  margin-left: -8px;
  margin-right: -8px;
}

.ess-menu-card-col {
  padding-left: 8px;
  padding-right: 8px;
}

.ess-menu-item-card {
  overflow: hidden;
  margin-bottom: 14px;
  background: #fff !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .06) !important;
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), border-color var(--ess-transition);
}

.ess-menu-item-card:hover {
  border-color: rgba(245, 130, 32, .26) !important;
  box-shadow: 0 18px 42px rgba(17, 24, 39, .1) !important;
  transform: translateY(-2px);
}

.ess-menu-item-card .row {
  min-height: 150px;
}

.ess-menu-item-media {
  overflow: hidden;
  min-height: 136px;
  background: #f4f5f7;
  border-radius: 18px;
}

.ess-menu-item-media .item-image-preview,
.ess-menu-item-media .el-image,
.ess-menu-item-image {
  width: 100%;
  height: 100% !important;
  min-height: 136px;
  object-fit: cover;
  border-radius: 18px !important;
}

.ess-menu-item-card-two-column .ess-menu-item-image,
.ess-menu-item-card-column .ess-menu-item-image {
  min-height: 176px;
  max-height: 210px;
}

.ess-menu-item-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 18px !important;
}

.ess-menu-item-title {
  color: var(--ess-text);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
}

.ess-menu-item-description {
  color: var(--ess-muted);
  font-size: 14px;
  line-height: 1.5;
}

.ess-menu-item-price,
.ess-menu-item-price h5,
.ess-menu-item-price p {
  color: var(--ess-text) !important;
  font-size: 17px;
  font-weight: 800;
}

.ess-menu-add-button,
.quantity-add-cart {
  min-width: 46px;
  min-height: 42px;
  padding: 10px 16px !important;
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  border-radius: 14px !important;
  color: #fff !important;
  font-weight: 800;
  box-shadow: 0 10px 22px rgba(245, 130, 32, .24);
}

.ess-menu-add-button:hover,
.quantity-add-cart:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
}

.ess-menu-skeleton-card,
.ess-cart-skeleton-row {
  padding: 14px;
  margin-bottom: 14px !important;
  background: #fff;
  border: 1px solid var(--ess-border);
  border-radius: 20px;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .05);
}

.ess-menu-skeleton-media,
.ess-cart-skeleton-media {
  overflow: hidden;
  border-radius: 18px;
}

.ess-menu-skeleton-copy,
.ess-cart-skeleton-copy {
  padding-left: 16px !important;
}

.ess-menu-cart .sticky-cart,
.ess-cart-panel {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--ess-border);
  border-radius: 24px;
  box-shadow: 0 18px 44px rgba(17, 24, 39, .1);
}

.ess-cart-header {
  padding: 18px 18px 10px;
  border-bottom: 1px solid var(--ess-border);
}

.ess-cart-summary-head h5,
.ess-cart-empty-title {
  color: var(--ess-text);
  font-weight: 800;
}

.ess-cart-clear {
  color: var(--ess-muted) !important;
  font-size: 13px;
}

.ess-cart-clear:hover {
  color: var(--ess-orange) !important;
}

.ess-cart-empty {
  padding: 26px 18px 30px;
  color: var(--ess-muted);
}

.ess-cart-empty-icon {
  margin-bottom: 14px !important;
  opacity: .8;
}

.ess-cart-body {
  padding: 14px !important;
}

.ess-cart-item {
  padding: 12px 0;
  border-bottom: 1px solid rgba(236, 236, 236, .85);
}

.ess-cart-item:last-child {
  border-bottom: 0;
}

.ess-cart-line-item {
  align-items: flex-start;
}

.ess-cart-item-media {
  overflow: hidden;
  width: 58px;
  height: 58px;
  border-radius: 16px;
  background: #f4f5f7;
}

.ess-cart-item-copy {
  padding-left: 12px !important;
}

.ess-cart-item-title {
  color: var(--ess-text);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
}

.ess-cart-item-price,
.ess-cart-item-total {
  color: var(--ess-muted);
}

.ess-cart-qty,
.quantity {
  gap: 8px;
  align-items: center;
}

.ess-cart-qty .qty-btn,
.quantity .qty-btn,
.section-cart .qty-btn {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  border: 1px solid var(--ess-border) !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: var(--ess-text) !important;
  box-shadow: 0 6px 14px rgba(17, 24, 39, .06);
}

.ess-cart-qty .qty-btn:hover,
.quantity .qty-btn:hover,
.section-cart .qty-btn:hover {
  border-color: var(--ess-orange) !important;
  color: var(--ess-orange) !important;
}

.ess-cart-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: #fff4f4 !important;
  color: #d83a45 !important;
}

.ess-cart-summary {
  padding: 16px !important;
  background: #fffaf6 !important;
  border: 1px solid rgba(245, 130, 32, .18) !important;
  border-radius: 18px !important;
}

.ess-cart-summary-row {
  color: var(--ess-muted);
  font-size: 14px;
}

.ess-cart-summary-total {
  padding-top: 12px;
  margin-top: 8px;
  color: var(--ess-text);
  font-size: 18px;
  font-weight: 900;
  border-top: 1px solid rgba(245, 130, 32, .18);
}

.ess-cart-cta {
  min-height: 52px;
  margin-top: 10px;
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  border-radius: 16px !important;
  color: #fff !important;
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 14px 30px rgba(245, 130, 32, .25);
}

.ess-cart-cta:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
  transform: translateY(-1px);
}

.ess-floating-cart {
  pointer-events: none;
}

.ess-floating-cart-button {
  pointer-events: auto;
  min-height: 58px;
  padding: 10px 18px !important;
  border-radius: 18px !important;
  background: rgba(34, 34, 34, .96) !important;
  box-shadow: 0 18px 42px rgba(17, 24, 39, .24) !important;
}

@media (max-width: 991px) {
  .ess-restaurant-detail-shell {
    padding-top: 16px;
  }

  .ess-menu-center {
    padding-left: 12px;
    padding-right: 12px;
  }

  .ess-menu-left .sticky-sidebar {
    position: relative !important;
    top: auto !important;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 12px;
    border-radius: 18px;
  }

  .ess-menu-category-list {
    flex-direction: row;
    width: max-content;
    min-width: 100%;
  }

  .ess-menu-sidebar-title {
    display: none;
  }

  .ess-menu-item-card .row {
    min-height: 0;
  }

  .ess-menu-item-content {
    padding: 14px !important;
  }
}

@media (max-width: 768px) {
  .ess-merchant-hero,
  .merchant-top-header {
    padding-top: 14px;
  }

  .ess-mobile-merchant-hero,
  .mobile-merchant-info {
    border-radius: 22px !important;
    box-shadow: 0 12px 30px rgba(17, 24, 39, .08);
  }

  .ess-menu-category-title {
    font-size: 21px;
  }

  .ess-menu-item-card {
    border-radius: 18px !important;
  }

  .ess-menu-item-media,
  .ess-menu-item-media .item-image-preview,
  .ess-menu-item-media .el-image,
  .ess-menu-item-image {
    min-height: 118px;
    border-radius: 16px !important;
  }

  .ess-menu-item-title {
    font-size: 16px;
  }

  .ess-cart-summary {
    border-radius: 16px !important;
  }
}

@media (max-width: 430px) {
  .ess-restaurant-detail-shell {
    padding-left: 0;
    padding-right: 0;
  }

  .ess-menu-search-wrap .form-control,
  .ess-menu-search-wrap input,
  .ess-menu-search-wrap .el-input__inner {
    min-height: 46px !important;
  }

  .ess-menu-item-card {
    margin-bottom: 12px;
  }

  .ess-menu-item-card .row {
    display: flex;
    flex-wrap: nowrap;
  }

  .ess-menu-item-card .col-3,
  .ess-menu-item-card .ess-menu-item-media {
    flex: 0 0 108px;
    max-width: 108px;
  }

  .ess-menu-item-card .col-9,
  .ess-menu-item-card .ess-menu-item-content {
    flex: 1 1 auto;
    max-width: calc(100% - 108px);
  }

  .ess-menu-item-media,
  .ess-menu-item-media .item-image-preview,
  .ess-menu-item-media .el-image,
  .ess-menu-item-image {
    min-height: 108px;
  }

  .ess-cart-panel {
    border-radius: 20px;
  }

  .ess-floating-cart {
    left: 12px !important;
    right: 12px !important;
    bottom: 14px !important;
  }
}

/* Milestone 3 / Phase A: Homepage as a standalone Esskompass premium surface. */
.ess-top-shell {
  width: 100% !important;
  max-width: none !important;
  padding: 0 18px;
  background: rgba(255, 255, 255, .92);
  border-bottom: 1px solid rgba(236, 236, 236, .92);
  box-shadow: 0 10px 30px rgba(17, 24, 39, .06);
  backdrop-filter: blur(16px) saturate(150%);
}

#top-navigation.ess-top-nav-v3 {
  display: grid;
  grid-template-columns: minmax(170px, 220px) minmax(360px, 1fr) auto;
  align-items: center;
  gap: 24px;
  width: 100%;
  max-width: 1280px !important;
  min-height: 76px;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ess-top-logo-col,
.ess-top-actions-col,
.ess-top-search-col {
  min-width: 0;
}

.ess-top-logo-col {
  display: flex;
  align-items: center;
}

.ess-top-search-col {
  display: flex;
  justify-content: center;
}

.ess-top-search-wrap {
  width: min(100%, 680px);
  padding: 6px;
  border: 1px solid var(--ess-border);
  border-radius: 999px;
  background: var(--ess-bg);
}

.ess-top-search-wrap .btn,
.ess-top-search-wrap button,
.ess-top-search-wrap .el-button {
  border-radius: 999px !important;
}

.ess-top-search-wrap input,
.ess-top-search-wrap .form-control,
.ess-top-search-wrap .el-input__inner {
  min-height: 42px !important;
  border-radius: 999px !important;
  background: #fff !important;
}

.ess-top-actions-col {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.ess-top-actions-col .top-menu a,
.ess-top-actions-col .dropdown-toggle,
.ess-top-actions-col .cart-handle {
  min-height: 44px;
  border-radius: 999px !important;
}

.ess-home-v3 {
  overflow-x: clip;
  background:
    radial-gradient(circle at 10% 10%, rgba(245, 130, 32, .08), transparent 28%),
    linear-gradient(180deg, #fff 0%, #fff 34%, var(--ess-bg) 100%);
}

#main-search-banner.ess-home-hero-v3 {
  position: relative;
  min-height: 520px !important;
  margin: 0 auto 26px !important;
  padding: 0 18px;
  border-radius: 0 0 34px 34px !important;
  border: 0 !important;
  background:
    radial-gradient(circle at 76% 24%, rgba(73, 169, 66, .16), transparent 27%),
    radial-gradient(circle at 58% 72%, rgba(245, 130, 32, .10), transparent 28%),
    #fff !important;
  box-shadow: 0 18px 50px rgba(17, 24, 39, .07) !important;
}

#main-search-banner.ess-home-hero-v3:before,
#main-search-banner.ess-home-hero-v3:after {
  content: none !important;
}

.ess-home-hero-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 540px);
  align-items: center;
  gap: 52px;
  width: 100%;
  max-width: 1280px;
  min-height: 520px;
  margin: 0 auto;
}

.ess-home-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 640px;
  padding: 62px 0;
}

.ess-home-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  padding: 8px 13px;
  border-radius: 999px;
  color: var(--ess-orange);
  background: rgba(245, 130, 32, .10);
  font-size: 13px;
  font-weight: 800;
}

.ess-home-kicker:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 99px;
  background: var(--ess-green);
  box-shadow: 0 0 0 5px rgba(73, 169, 66, .14);
}

.ess-home-hero-copy h1 {
  margin: 0;
  color: #111827;
  font-size: clamp(42px, 5.6vw, 76px);
  line-height: .98;
  font-weight: 850;
  letter-spacing: 0;
}

.ess-home-hero-copy .ess-home-subtitle {
  max-width: 540px;
  margin: 20px 0 0;
  color: var(--ess-muted);
  font-size: 19px;
  line-height: 1.6;
}

.ess-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

.ess-home-primary-action,
.ess-home-secondary-action {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 22px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none !important;
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), background-color var(--ess-transition), border-color var(--ess-transition);
}

.ess-home-primary-action {
  color: #fff !important;
  background: linear-gradient(135deg, var(--ess-orange), #ff9a3f);
  box-shadow: 0 14px 24px rgba(245, 130, 32, .24);
}

.ess-home-primary-action:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, var(--ess-orange-hover), var(--ess-orange));
  box-shadow: 0 18px 32px rgba(245, 130, 32, .30);
}

.ess-home-secondary-action {
  color: var(--ess-orange) !important;
  border: 1px solid rgba(245, 130, 32, .42);
  background: #fff;
}

.ess-home-secondary-action:hover {
  transform: translateY(-2px);
  border-color: var(--ess-orange);
  box-shadow: var(--ess-shadow-sm);
}

.ess-hero-search {
  max-width: 640px !important;
  margin: 28px 0 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(236, 236, 236, .95);
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 24px 70px rgba(17, 24, 39, .14) !important;
}

.ess-hero-search input,
.ess-hero-search .form-control,
.ess-hero-search .el-input__inner {
  min-height: 54px !important;
  border-radius: 14px !important;
  font-size: 15px !important;
}

.ess-home-pills {
  justify-content: flex-start !important;
  margin-top: 18px !important;
}

.ess-home-pills span {
  padding: 9px 14px !important;
  border-color: rgba(236, 236, 236, .92) !important;
  background: rgba(255, 255, 255, .82) !important;
  box-shadow: 0 8px 20px rgba(17, 24, 39, .04);
}

.ess-home-hero-media {
  position: relative;
  min-height: 430px;
}

.ess-hero-image-card {
  position: absolute;
  inset: 28px 0 22px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 34px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .30), rgba(255, 255, 255, .04)),
    #f4fbf2;
  box-shadow: 0 28px 80px rgba(17, 24, 39, .13);
}

.ess-hero-image-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ess-hero-floating-card {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(236, 236, 236, .96);
  border-radius: 999px;
  color: var(--ess-text);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 18px 42px rgba(17, 24, 39, .12);
  font-weight: 800;
}

.ess-hero-floating-card-one {
  left: -8px;
  bottom: 74px;
}

.ess-hero-floating-card-two {
  right: 8px;
  top: 72px;
  color: var(--ess-green);
}

.ess-home-sections-v3 {
  padding: 34px 0 28px;
}

.ess-home-content-v3 {
  max-width: 1280px !important;
}

.ess-home-section {
  margin-bottom: 54px;
}

.ess-home-section .swiperOutsideContainer {
  margin-bottom: 0 !important;
}

.ess-section-heading {
  margin: 0 0 22px !important;
}

.ess-section-eyebrow {
  display: block;
  margin-bottom: 6px;
  color: var(--ess-orange);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.ess-section-heading h3 {
  font-size: clamp(24px, 2.6vw, 34px) !important;
  line-height: 1.15;
}

.ess-cuisine-carousel .swiper-container,
.ess-restaurant-carousel .swiper-container,
.ess-featured-carousel .swiper-container,
.ess-join-v3 .swiper-container {
  overflow: visible;
}

.ess-cuisine-card-v3,
.swiperCuisine .ess-cuisine-card-v3 {
  width: 120px !important;
  min-height: 126px !important;
  padding: 14px 10px !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .07) !important;
}

.ess-cuisine-card-v3 .el-links {
  width: 100%;
  display: grid;
  justify-items: center;
  gap: 10px;
  color: var(--ess-text) !important;
}

.ess-cuisine-icon {
  display: grid;
  place-items: center;
  width: 66px;
  height: 66px;
  border-radius: 999px;
  background: #fff4ea;
}

.ess-cuisine-card-v3 img {
  width: 46px !important;
  height: 46px !important;
  padding: 0 !important;
  background: transparent !important;
}

.ess-cuisine-name {
  color: var(--ess-text) !important;
  font-weight: 800 !important;
}

.ess-restaurant-card-v3,
.ess-featured-card-v3,
.ess-join-card {
  border-radius: 24px !important;
  box-shadow: 0 16px 38px rgba(17, 24, 39, .10) !important;
}

.ess-restaurant-card-media,
.ess-featured-card-media {
  aspect-ratio: 16 / 9;
}

.ess-restaurant-card-v3 img,
.ess-featured-card-v3 img {
  height: 100% !important;
}

.ess-restaurant-card-body,
.ess-featured-card-body {
  padding: 16px !important;
}

.ess-restaurant-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 7px;
}

.ess-restaurant-card-title,
.ess-featured-card-title {
  min-width: 0;
  margin-bottom: 0 !important;
  font-size: 17px !important;
}

.ess-open-badge {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--ess-green);
  background: var(--ess-green-soft);
  font-size: 11px;
  font-weight: 850;
}

.ess-restaurant-card-cuisine,
.ess-featured-card-description {
  min-height: 38px;
}

.ess-featured-card-footer {
  padding-top: 8px;
}

.ess-featured-add {
  min-width: 92px !important;
  min-height: 42px !important;
  font-weight: 800 !important;
}

.ess-join-v3 {
  padding: 36px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 8% 16%, rgba(245, 130, 32, .12), transparent 25%),
    linear-gradient(135deg, #ffffff, #fff7ef);
  box-shadow: 0 18px 44px rgba(17, 24, 39, .08);
}

.ess-join-heading h3 span {
  color: var(--ess-orange);
  font-weight: 850;
}

.ess-join-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--ess-border);
}

.ess-join-card img {
  width: 100%;
  height: 210px;
  object-fit: cover;
}

.ess-join-card .content {
  padding: 18px;
}

.ess-footer-v3 {
  margin-top: 34px;
  padding: 0;
  background: #151515;
  color: rgba(255, 255, 255, .78);
}

.ess-footer-shell {
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(420px, 1.7fr);
  gap: 56px;
  max-width: 1280px !important;
  padding: 54px 18px 26px;
}

.ess-footer-logo img {
  max-width: 178px;
  height: auto;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, .20));
}

.ess-footer-brand p {
  max-width: 360px;
  margin: 18px 0 20px;
  line-height: 1.65;
}

.ess-footer-store-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ess-footer-store-links img {
  max-height: 42px;
  width: auto;
}

.ess-footer-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.ess-footer-links h6 {
  margin-bottom: 14px;
  color: #fff;
  font-size: 14px;
  font-weight: 850;
}

.ess-footer-links a {
  display: block;
  margin-bottom: 10px;
  color: rgba(255, 255, 255, .72) !important;
  text-decoration: none !important;
}

.ess-footer-links a:hover {
  color: #fff !important;
}

.ess-footer-bottom {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding-top: 26px;
  border-top: 1px solid rgba(255, 255, 255, .10);
  color: rgba(255, 255, 255, .58);
  font-size: 13px;
}

@media (max-width: 991.98px) {
  .ess-top-shell {
    padding: 0 14px;
  }

  #top-navigation.ess-top-nav-v3 {
    grid-template-columns: 1fr auto;
    min-height: 66px;
  }

  .ess-top-search-col {
    display: none !important;
  }

  .ess-home-hero-v3#main-search-banner {
    min-height: auto !important;
    padding: 0 14px 24px;
    border-radius: 0 0 28px 28px !important;
  }

  .ess-home-hero-shell {
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 18px;
  }

  .ess-home-hero-copy {
    max-width: none;
    padding: 34px 0 0;
  }

  .ess-home-hero-copy h1 {
    font-size: clamp(34px, 10vw, 48px);
  }

  .ess-home-hero-copy .ess-home-subtitle {
    font-size: 16px;
  }

  .ess-home-actions {
    margin-top: 22px;
  }

  .ess-home-primary-action,
  .ess-home-secondary-action {
    flex: 1 1 160px;
  }

  .ess-hero-search {
    max-width: none !important;
  }

  .ess-home-hero-media {
    min-height: 240px;
  }

  .ess-hero-image-card {
    inset: 0;
    border-radius: 28px;
  }

  .ess-hero-floating-card {
    display: none;
  }

  .ess-home-sections-v3 {
    padding-top: 24px;
  }

  .ess-home-section {
    margin-bottom: 38px;
  }

  .ess-join-v3 {
    padding: 24px 16px;
  }

  .ess-footer-shell {
    grid-template-columns: 1fr;
    gap: 34px;
    padding-top: 42px;
  }
}

@media (max-width: 575.98px) {
  .ess-top-shell {
    padding: 0 12px;
  }

  .ess-top-actions-col .line-left,
  .ess-top-actions-col .top-menu li:not(:last-child) {
    display: none !important;
  }

  .ess-home-hero-copy {
    padding-top: 26px;
  }

  .ess-home-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ess-home-primary-action,
  .ess-home-secondary-action {
    width: 100%;
  }

  .ess-home-pills {
    overflow-x: auto;
    flex-wrap: nowrap;
    justify-content: flex-start !important;
    padding-bottom: 4px;
  }

  .ess-home-pills span {
    flex: 0 0 auto;
  }

  .ess-home-hero-media {
    min-height: 210px;
  }

  .ess-section-heading h3 {
    font-size: 24px !important;
  }

  .ess-cuisine-card-v3,
  .swiperCuisine .ess-cuisine-card-v3 {
    width: 104px !important;
    min-height: 112px !important;
  }

  .ess-cuisine-icon {
    width: 58px;
    height: 58px;
  }

  .ess-restaurant-card-v3,
  .ess-featured-card-v3 {
    border-radius: 20px !important;
  }

  .ess-footer-links {
    grid-template-columns: 1fr;
  }

  .ess-footer-bottom {
    flex-direction: column;
  }
}

/* Milestone 3 / Phase A final: homepage closer to approved Esskompass mockup. */
.ess-top-shell {
  position: sticky;
  top: 0;
  z-index: 1020;
  padding: 0 24px !important;
  background: rgba(255, 255, 255, .96) !important;
}

#top-navigation.ess-top-nav-v3 {
  grid-template-columns: minmax(190px, 246px) minmax(520px, 1fr) auto;
  min-height: 86px;
  gap: 30px;
}

.ess-top-logo-col .top-logo img,
.ess-top-logo-col img {
  max-height: 50px !important;
  width: auto !important;
}

.ess-top-search-wrap {
  width: min(100%, 720px);
  padding: 7px !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 12px 34px rgba(17, 24, 39, .08);
}

.ess-top-search-fallback {
  display: grid;
  grid-template-columns: minmax(156px, auto) minmax(220px, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  color: var(--ess-text) !important;
  text-decoration: none !important;
}

.ess-top-location-fallback,
.ess-top-query-fallback {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--ess-border);
  border-radius: 13px;
  color: var(--ess-text);
  background: #fff;
  font-size: 14px;
  font-weight: 700;
}

.ess-top-location-fallback:before {
  content: "⌖";
  margin-right: 8px;
  color: var(--ess-orange);
  font-weight: 900;
}

.ess-top-query-fallback {
  color: var(--ess-muted);
  font-weight: 600;
}

.ess-top-query-fallback:before {
  content: "⌕";
  margin-right: 8px;
  color: #9ca3af;
  font-size: 16px;
}

.ess-top-search-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 20px;
  border-radius: 13px;
  color: #fff;
  background: linear-gradient(135deg, var(--ess-orange), #ff9b3f);
  box-shadow: 0 10px 20px rgba(245, 130, 32, .20);
  font-size: 14px;
  font-weight: 850;
}

.ess-top-actions-col {
  gap: 14px;
}

.ess-top-actions-col .top-menu a,
.ess-top-actions-col .dropdown-toggle,
.ess-top-actions-col .cart-handle,
.ess-top-actions-col a {
  font-weight: 800;
}

#main-search-banner.ess-home-hero-v3 {
  min-height: 560px !important;
  margin-bottom: 0 !important;
  border-radius: 0 0 38px 38px !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .96) 43%, rgba(255, 255, 255, .82) 56%, rgba(255, 255, 255, .06) 100%),
    #fff !important;
}

.ess-home-hero-shell {
  grid-template-columns: minmax(0, 560px) minmax(540px, 1fr);
  min-height: 560px;
  gap: 48px;
}

.ess-home-hero-copy {
  padding: 74px 0 68px;
}

.ess-home-kicker {
  margin-bottom: 18px;
  background: #fff4ea;
  box-shadow: 0 10px 24px rgba(245, 130, 32, .08);
}

.ess-home-hero-copy h1 {
  color: #0f172a;
  font-size: clamp(50px, 5.2vw, 78px);
  line-height: .96;
  letter-spacing: -.01em;
}

.ess-home-hero-copy .ess-home-subtitle {
  max-width: 500px;
  margin-top: 22px;
  color: #3f3f46;
  font-size: 20px;
  line-height: 1.55;
}

.ess-home-actions {
  margin-top: 30px;
}

.ess-home-primary-action,
.ess-home-secondary-action {
  min-height: 54px;
  border-radius: 15px;
  padding: 0 26px;
}

.ess-hero-search-card {
  display: grid;
  grid-template-columns: minmax(150px, auto) minmax(260px, 1fr) auto;
  align-items: center;
  gap: 8px;
  max-width: 720px;
  margin-top: 34px;
  padding: 8px;
  border: 1px solid rgba(236, 236, 236, .95);
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 24px 70px rgba(17, 24, 39, .13);
}

.ess-hero-location-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 50px;
  padding: 0 16px;
  border: 1px solid var(--ess-border);
  border-radius: 14px;
  color: var(--ess-text);
  background: #fff;
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}

.ess-hero-location-icon {
  color: var(--ess-orange);
  font-size: 17px;
  line-height: 1;
}

.ess-hero-search-card .ess-hero-search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ess-hero-search-card .ess-hero-search input,
.ess-hero-search-card .ess-hero-search .form-control,
.ess-hero-search-card .ess-hero-search .el-input__inner {
  min-height: 50px !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
}

.ess-hero-search-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 24px;
  border-radius: 14px;
  color: #fff !important;
  background: linear-gradient(135deg, var(--ess-orange), #ff9b3f);
  box-shadow: 0 12px 24px rgba(245, 130, 32, .24);
  font-weight: 850;
  text-decoration: none !important;
  transition: transform var(--ess-transition), box-shadow var(--ess-transition), background-color var(--ess-transition);
}

.ess-hero-search-submit:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, var(--ess-orange-hover), var(--ess-orange));
  box-shadow: 0 16px 30px rgba(245, 130, 32, .28);
}

.ess-home-hero-media {
  position: absolute;
  inset: 0 0 0 43%;
  min-height: 560px;
  pointer-events: none;
}

.ess-hero-image-card {
  inset: 0 !important;
  border-radius: 0 0 38px 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ess-hero-image-card:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .98) 0%, rgba(255, 255, 255, .72) 17%, rgba(255, 255, 255, .14) 44%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .20), rgba(255, 255, 255, 0));
}

.ess-hero-image-card img {
  object-position: center right;
}

.ess-hero-floating-card {
  min-height: 48px;
  border: 1px solid rgba(255, 255, 255, .72);
  background: rgba(255, 255, 255, .88);
  backdrop-filter: blur(12px);
}

.ess-hero-floating-card-one {
  left: 6%;
  bottom: 74px;
}

.ess-hero-floating-card-two {
  right: 7%;
  top: 86px;
}

.ess-home-pills span {
  background: rgba(255, 255, 255, .92) !important;
}

.ess-home-sections-v3 {
  padding-top: 44px;
}

.ess-cuisine-card-v3,
.swiperCuisine .ess-cuisine-card-v3 {
  box-shadow: none !important;
  border: 0 !important;
  background: transparent !important;
}

.ess-cuisine-icon {
  border: 1px solid rgba(245, 130, 32, .18);
  background: #fff4ea;
  box-shadow: 0 10px 28px rgba(245, 130, 32, .10);
}

.ess-footer-v3 {
  margin-top: 50px;
  background:
    radial-gradient(circle at 8% 8%, rgba(73, 169, 66, .18), transparent 24%),
    radial-gradient(circle at 92% 18%, rgba(245, 130, 32, .14), transparent 24%),
    #181818 !important;
}

.ess-footer-shell {
  grid-template-columns: minmax(280px, .95fr) minmax(560px, 1.7fr);
  padding: 64px 18px 28px;
}

.ess-footer-links {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ess-footer-social {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}

.ess-footer-social a {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  color: #fff !important;
  background: rgba(255, 255, 255, .06);
  text-decoration: none !important;
  font-weight: 850;
}

.ess-footer-social a:hover {
  border-color: rgba(245, 130, 32, .65);
  background: rgba(245, 130, 32, .18);
}

@media (max-width: 1199.98px) {
  #top-navigation.ess-top-nav-v3 {
    grid-template-columns: minmax(160px, 210px) minmax(420px, 1fr) auto;
  }

  .ess-home-hero-shell {
    grid-template-columns: minmax(0, 520px) minmax(440px, 1fr);
  }

  .ess-home-hero-media {
    left: 45%;
  }
}

@media (max-width: 991.98px) {
  .ess-top-shell {
    position: sticky;
    padding: 0 14px !important;
  }

  #top-navigation.ess-top-nav-v3 {
    min-height: 70px;
    grid-template-columns: 1fr auto;
  }

  .ess-top-logo-col .top-logo img,
  .ess-top-logo-col img {
    max-height: 42px !important;
  }

  .ess-home-hero-v3#main-search-banner {
    padding: 0 16px 28px !important;
  }

  .ess-home-hero-shell {
    display: block;
    min-height: auto;
  }

  .ess-home-hero-media {
    position: relative;
    inset: auto;
    min-height: 320px;
    margin: 18px 0 0;
  }

  .ess-hero-image-card {
    border-radius: 28px !important;
  }

  .ess-hero-image-card:after {
    background: linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, 0));
  }

  .ess-home-hero-copy {
    padding: 42px 0 0;
  }

  .ess-home-hero-copy h1 {
    max-width: 680px;
    font-size: clamp(40px, 8vw, 58px);
  }

  .ess-hero-search-card {
    grid-template-columns: 1fr;
    max-width: 680px;
  }

  .ess-hero-location-pill,
  .ess-hero-search-submit {
    width: 100%;
  }

  .ess-footer-shell {
    grid-template-columns: 1fr;
  }

  .ess-footer-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .ess-top-shell {
    padding: 0 12px !important;
  }

  .ess-home-hero-v3#main-search-banner {
    padding-bottom: 22px !important;
    border-radius: 0 0 26px 26px !important;
  }

  .ess-home-kicker {
    display: none;
  }

  .ess-home-hero-copy h1 {
    font-size: clamp(34px, 11vw, 44px);
  }

  .ess-home-hero-copy .ess-home-subtitle {
    font-size: 15px;
    line-height: 1.5;
  }

  .ess-home-actions {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .ess-home-primary-action,
  .ess-home-secondary-action {
    min-height: 48px;
    padding: 0 12px;
    font-size: 13px;
  }

  .ess-hero-search-card {
    margin-top: 22px;
    border-radius: 16px;
    box-shadow: 0 16px 44px rgba(17, 24, 39, .11);
  }

  .ess-home-hero-media {
    min-height: 230px;
  }

  .ess-hero-image-card {
    border-radius: 22px !important;
  }

  .ess-footer-links {
    grid-template-columns: 1fr;
  }
}

/* Phase A tuning: balance hero proportions after first live visual QA. */
.ess-top-shell {
  padding: 0 22px !important;
}

#top-navigation.ess-top-nav-v3 {
  min-height: 76px;
  grid-template-columns: minmax(180px, 232px) minmax(500px, 1fr) auto;
  gap: 24px;
}

.ess-top-logo-col .top-logo img,
.ess-top-logo-col img {
  max-height: 46px !important;
}

.ess-top-search-wrap {
  width: min(100%, 680px);
  padding: 6px !important;
  border-radius: 17px !important;
}

.ess-top-search-fallback {
  min-height: 42px;
}

.ess-top-location-fallback,
.ess-top-query-fallback,
.ess-top-search-button {
  min-height: 40px;
  border-radius: 12px;
}

#main-search-banner.ess-home-hero-v3 {
  min-height: 510px !important;
}

.ess-home-hero-shell {
  min-height: 510px;
  grid-template-columns: minmax(0, 540px) minmax(560px, 1fr);
}

.ess-home-hero-copy {
  padding: 56px 0 54px;
}

.ess-home-hero-copy h1 {
  max-width: 620px;
  font-size: clamp(46px, 4.55vw, 66px);
  line-height: .99;
}

.ess-home-hero-copy .ess-home-subtitle {
  max-width: 520px;
  margin-top: 20px;
  font-size: 18px;
}

.ess-home-actions {
  margin-top: 26px;
}

.ess-home-primary-action,
.ess-home-secondary-action {
  min-height: 50px;
  padding: 0 24px;
}

.ess-hero-search-card {
  max-width: 690px;
  margin-top: 28px;
  padding: 7px;
  box-shadow: 0 18px 54px rgba(17, 24, 39, .12);
}

.ess-hero-location-pill,
.ess-hero-search-card .ess-hero-search input,
.ess-hero-search-card .ess-hero-search .form-control,
.ess-hero-search-card .ess-hero-search .el-input__inner,
.ess-hero-search-submit {
  min-height: 46px !important;
}

.ess-home-hero-media {
  inset: 0 -4% 0 46%;
  min-height: 510px;
}

.ess-hero-image-card:after {
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .99) 0%, rgba(255, 255, 255, .78) 20%, rgba(255, 255, 255, .20) 47%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, 0));
}

.ess-hero-image-card img {
  object-position: center right;
}

.ess-hero-floating-card-one {
  left: 3%;
  bottom: 58px;
}

.ess-hero-floating-card-two {
  right: 8%;
  top: 76px;
}

@media (max-width: 1199.98px) {
  #top-navigation.ess-top-nav-v3 {
    grid-template-columns: minmax(150px, 200px) minmax(390px, 1fr) auto;
    gap: 18px;
  }

  .ess-home-hero-copy h1 {
    font-size: clamp(42px, 5vw, 58px);
  }

  .ess-home-hero-media {
    inset: 0 -8% 0 47%;
  }
}

@media (max-width: 991.98px) {
  #top-navigation.ess-top-nav-v3 {
    min-height: 66px;
  }

  .ess-home-hero-v3#main-search-banner {
    min-height: auto !important;
  }

  .ess-home-hero-shell {
    min-height: auto;
  }

  .ess-home-hero-copy {
    padding: 36px 0 0;
  }

  .ess-home-hero-copy h1 {
    font-size: clamp(36px, 7vw, 52px);
  }

  .ess-home-hero-media {
    inset: auto;
    min-height: 280px;
  }

  .ess-hero-search-card {
    margin-top: 22px;
  }
}

@media (max-width: 575.98px) {
  .ess-home-hero-copy h1 {
    font-size: clamp(32px, 10vw, 40px);
  }

  .ess-home-hero-copy {
    padding-top: 28px;
  }

  .ess-home-hero-media {
    min-height: 210px;
  }
}

/* Phase A final pixel polish: homepage search, hero balance and premium header. */
body.front-page .ess-top-search-col {
  display: none !important;
}

body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 78px;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 28px;
}

body.front-page .ess-top-shell {
  padding: 0 28px !important;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  max-height: 52px !important;
}

body.front-page .ess-top-actions-col {
  justify-self: end;
  gap: 14px;
}

body.front-page .ess-top-actions-col .line-left,
body.front-page .ess-top-actions-col .dropdown,
body.front-page .ess-top-actions-col .cart-handle,
body.front-page .ess-top-actions-col .rounded-pill {
  filter: drop-shadow(0 10px 24px rgba(17, 24, 39, .06));
}

body.front-page #main-search-banner.ess-home-hero-v3 {
  min-height: 535px !important;
  background:
    linear-gradient(90deg, #fff 0%, #fff 32%, rgba(255, 255, 255, .88) 48%, rgba(255, 255, 255, .28) 69%, rgba(255, 255, 255, 0) 100%),
    radial-gradient(circle at 24% 22%, rgba(245, 130, 32, .08), transparent 34%),
    #fff !important;
}

body.front-page .ess-home-hero-shell {
  min-height: 535px;
  grid-template-columns: minmax(0, 570px) minmax(620px, 1fr);
}

body.front-page .ess-home-hero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 54px 0 50px;
}

body.front-page .ess-home-kicker {
  order: 1;
  margin-bottom: 17px;
}

body.front-page .ess-home-hero-copy h1 {
  order: 2;
  max-width: 590px;
  font-size: clamp(43px, 4.25vw, 61px);
  font-weight: 780;
  line-height: 1.025;
  letter-spacing: 0;
}

body.front-page .ess-home-hero-copy .ess-home-subtitle {
  order: 3;
  max-width: 555px;
  margin-top: 18px;
  color: #585858;
  font-size: 17px;
  line-height: 1.62;
}

body.front-page .ess-hero-search-card {
  order: 4;
  width: min(100%, 720px);
  max-width: 720px;
  margin-top: 24px;
  padding: 7px;
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(17, 24, 39, .13);
  transform: translateY(0);
  z-index: 4;
}

body.front-page .ess-home-actions {
  order: 5;
  margin-top: 22px;
  gap: 14px;
}

body.front-page .ess-home-pills {
  order: 6;
  margin-top: 21px;
}

body.front-page .ess-home-primary-action,
body.front-page .ess-home-secondary-action,
body.front-page .ess-hero-search-submit {
  min-height: 50px;
  border-radius: 14px;
  font-weight: 800;
  letter-spacing: 0;
}

body.front-page .ess-home-secondary-action {
  background: rgba(255, 255, 255, .86);
}

body.front-page .ess-home-hero-media {
  inset: 0 -8% 0 40%;
  min-height: 535px;
}

body.front-page .ess-hero-image-card {
  filter: saturate(1.04) contrast(1.02);
}

body.front-page .ess-hero-image-card:after {
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .95) 15%, rgba(255, 255, 255, .62) 35%, rgba(255, 255, 255, .13) 58%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 58%, rgba(255, 255, 255, .18) 100%);
}

body.front-page .ess-hero-image-card img {
  object-position: center right;
  transform: scale(1.012);
}

body.front-page .ess-hero-floating-card-one {
  left: 6%;
  bottom: 70px;
}

body.front-page .ess-hero-floating-card-two {
  right: 11%;
  top: 92px;
}

@media (max-width: 1199.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    grid-template-columns: minmax(190px, 1fr) auto;
    min-height: 74px;
  }

  body.front-page .ess-home-hero-shell {
    grid-template-columns: minmax(0, 515px) minmax(520px, 1fr);
  }

  body.front-page .ess-home-hero-copy h1 {
    font-size: clamp(40px, 4.8vw, 56px);
  }

  body.front-page .ess-home-hero-media {
    inset: 0 -10% 0 42%;
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 68px;
    grid-template-columns: 1fr auto;
  }

  body.front-page .ess-top-shell {
    padding: 0 16px !important;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 46px !important;
  }

  body.front-page #main-search-banner.ess-home-hero-v3 {
    min-height: auto !important;
  }

  body.front-page .ess-home-hero-shell {
    display: flex;
    min-height: auto;
    flex-direction: column;
  }

  body.front-page .ess-home-hero-copy {
    padding: 34px 0 0;
  }

  body.front-page .ess-home-hero-copy h1 {
    max-width: 100%;
    font-size: clamp(34px, 7.2vw, 48px);
    line-height: 1.05;
  }

  body.front-page .ess-hero-search-card {
    width: 100%;
    max-width: 100%;
    margin-top: 22px;
  }

  body.front-page .ess-home-hero-media {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 260px;
    margin-top: 22px;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-actions-col {
    gap: 8px;
  }

  body.front-page .ess-home-hero-copy {
    padding-top: 28px;
  }

  body.front-page .ess-home-hero-copy h1 {
    font-size: clamp(31px, 9.4vw, 38px);
  }

  body.front-page .ess-home-hero-copy .ess-home-subtitle {
    font-size: 15px;
  }

  body.front-page .ess-hero-search-card {
    grid-template-columns: 1fr;
    padding: 9px;
    border-radius: 18px;
  }

  body.front-page .ess-home-actions {
    width: 100%;
    grid-template-columns: 1fr;
  }

  body.front-page .ess-home-primary-action,
  body.front-page .ess-home-secondary-action {
    width: 100%;
  }

  body.front-page .ess-home-hero-media {
    min-height: 220px;
  }
}

/* Phase A homepage final: pixel-perfect composition pass against the approved mockup. */
body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 82px;
  grid-template-columns: minmax(250px, 1fr) auto;
  gap: 34px;
}

body.front-page .ess-top-shell {
  padding: 0 clamp(28px, 4vw, 54px) !important;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  max-height: 60px !important;
  transform: translateY(1px);
}

body.front-page .ess-top-actions-col {
  gap: 18px;
  align-items: center;
}

body.front-page .ess-top-actions-col .line-left,
body.front-page .ess-top-actions-col .dropdown,
body.front-page .ess-top-actions-col .cart-handle,
body.front-page .ess-top-actions-col .rounded-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.front-page .ess-top-actions-col .cart-handle,
body.front-page .ess-top-actions-col .rounded-pill,
body.front-page .ess-top-actions-col a[href*="login"],
body.front-page .ess-top-actions-col a[href*="account"] {
  border-radius: 999px !important;
  box-shadow: 0 12px 30px rgba(17, 24, 39, .07);
}

body.front-page #main-search-banner.ess-home-hero-v3 {
  min-height: 482px !important;
  overflow: hidden;
  background:
    linear-gradient(90deg, #fff 0%, #fff 34%, rgba(255, 255, 255, .93) 49%, rgba(255, 255, 255, .40) 68%, rgba(255, 255, 255, 0) 100%),
    radial-gradient(circle at 30% 18%, rgba(245, 130, 32, .07), transparent 28%),
    #fff !important;
}

body.front-page .ess-home-hero-shell {
  min-height: 482px;
  grid-template-columns: minmax(0, 650px) minmax(560px, 1fr);
}

body.front-page .ess-home-hero-copy {
  padding: 42px 0 42px clamp(76px, 6.2vw, 118px);
}

body.front-page .ess-home-kicker {
  margin-bottom: 14px;
  padding: 9px 16px;
  font-size: 15px;
}

body.front-page .ess-home-hero-copy h1 {
  max-width: 600px;
  color: #1A2233;
  font-size: clamp(40px, 3.95vw, 57px);
  font-weight: 780;
  line-height: 1.045;
  letter-spacing: 0;
}

body.front-page .ess-home-hero-copy .ess-home-subtitle {
  max-width: 540px;
  margin-top: 16px;
  font-size: 16.5px;
  line-height: 1.58;
}

body.front-page .ess-hero-search-card {
  width: min(100%, 680px);
  max-width: 680px;
  grid-template-columns: minmax(178px, .58fr) minmax(250px, 1fr) minmax(116px, auto);
  gap: 8px;
  margin-top: 22px;
  padding: 6px;
  border-radius: 18px;
  box-shadow: 0 20px 58px rgba(17, 24, 39, .12);
}

body.front-page .ess-hero-location-pill,
body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner,
body.front-page .ess-hero-search-submit {
  min-height: 43px !important;
  border-radius: 13px !important;
}

body.front-page .ess-hero-search-submit {
  padding: 0 22px !important;
}

body.front-page .ess-home-actions {
  margin-top: 20px;
}

body.front-page .ess-home-primary-action,
body.front-page .ess-home-secondary-action {
  min-height: 48px;
  padding: 0 24px;
  border-radius: 14px;
  box-shadow: 0 13px 34px rgba(245, 130, 32, .20);
}

body.front-page .ess-home-secondary-action {
  box-shadow: 0 11px 26px rgba(17, 24, 39, .05);
}

body.front-page .ess-home-pills {
  gap: 9px;
  margin-top: 18px;
}

body.front-page .ess-home-pill {
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 13px;
}

body.front-page .ess-home-pill i,
body.front-page .ess-home-pill svg {
  transform: scale(.9);
}

body.front-page .ess-home-hero-media {
  inset: 0 -13% 0 45%;
  min-height: 482px;
}

body.front-page .ess-hero-image-card img {
  object-position: 63% 43%;
  transform: scale(.985);
}

body.front-page .ess-hero-image-card:after {
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .98) 13%, rgba(255, 255, 255, .70) 32%, rgba(255, 255, 255, .18) 58%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .06) 0%, rgba(255, 255, 255, 0) 54%, rgba(255, 255, 255, .22) 100%);
}

body.front-page .ess-hero-floating-card-one {
  left: 11%;
  bottom: 58px;
}

body.front-page .ess-hero-floating-card-two {
  right: 9%;
  top: 72px;
}

@media (max-width: 1199.98px) {
  body.front-page .ess-home-hero-copy {
    padding-left: clamp(36px, 4.6vw, 72px);
  }

  body.front-page .ess-home-hero-shell {
    grid-template-columns: minmax(0, 560px) minmax(480px, 1fr);
  }

  body.front-page .ess-home-hero-media {
    inset: 0 -15% 0 45%;
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 70px;
    gap: 14px;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 48px !important;
  }

  body.front-page #main-search-banner.ess-home-hero-v3 {
    min-height: auto !important;
  }

  body.front-page .ess-home-hero-copy {
    padding: 30px 0 0;
  }

  body.front-page .ess-home-hero-copy h1 {
    font-size: clamp(34px, 7.1vw, 46px);
  }

  body.front-page .ess-home-hero-media {
    inset: auto;
    min-height: 248px;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-shell {
    padding: 0 14px !important;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 42px !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-top: 24px;
  }

  body.front-page .ess-home-kicker {
    padding: 8px 12px;
    font-size: 13px;
  }

  body.front-page .ess-home-hero-copy h1 {
    font-size: clamp(30px, 9vw, 36px);
  }

  body.front-page .ess-hero-search-card {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  body.front-page .ess-home-pills {
    gap: 7px;
  }

  body.front-page .ess-home-pill {
    min-height: 32px;
    font-size: 12px;
  }

body.front-page .ess-home-hero-media {
    min-height: 208px;
  }
}

/* Phase A sealed homepage: final reduction pass, search-first hero. */
body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 80px;
  grid-template-columns: minmax(270px, 1fr) auto;
  gap: 38px;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  max-height: 69px !important;
  transform: translateY(0);
}

body.front-page .ess-top-actions-col {
  gap: 20px;
}

body.front-page .ess-top-actions-col .cart-handle,
body.front-page .ess-top-actions-col .rounded-pill,
body.front-page .ess-top-actions-col a[href*="login"],
body.front-page .ess-top-actions-col a[href*="account"] {
  min-height: 48px;
  border: 1px solid rgba(236, 236, 236, .95) !important;
  background: rgba(255, 255, 255, .88) !important;
  box-shadow: 0 12px 34px rgba(17, 24, 39, .065);
}

body.front-page #main-search-banner.ess-home-hero-v3 {
  min-height: 455px !important;
  background:
    linear-gradient(90deg, #fff 0%, #fff 37%, rgba(255, 255, 255, .96) 52%, rgba(255, 255, 255, .47) 70%, rgba(255, 255, 255, 0) 100%),
    radial-gradient(circle at 34% 20%, rgba(245, 130, 32, .055), transparent 26%),
    #fff !important;
}

body.front-page .ess-home-hero-shell {
  min-height: 455px;
  grid-template-columns: minmax(0, 690px) minmax(520px, 1fr);
}

body.front-page .ess-home-hero-copy {
  padding: 36px 0 36px clamp(108px, 7.4vw, 154px);
}

body.front-page .ess-home-hero-copy h1 {
  max-width: 590px;
  color: #1A2233;
  font-size: clamp(39px, 3.75vw, 55px);
  font-weight: 780;
  line-height: 1.04;
  letter-spacing: 0;
}

body.front-page .ess-home-hero-copy .ess-home-subtitle {
  max-width: 548px;
  margin-top: 14px;
}

body.front-page .ess-home-actions,
body.front-page .ess-hero-floating-card-one,
body.front-page .ess-hero-floating-card-two {
  display: none !important;
}

body.front-page .ess-hero-search-card {
  width: min(100%, 705px);
  max-width: 705px;
  grid-template-columns: minmax(205px, .7fr) minmax(280px, 1fr) minmax(108px, auto);
  gap: 7px;
  margin-top: 20px;
  padding: 6px;
  border-radius: 18px;
}

body.front-page .ess-hero-location-pill {
  justify-content: flex-start;
  padding-inline: 16px !important;
}

body.front-page .ess-hero-search-submit {
  min-width: 106px;
  padding: 0 20px !important;
}

body.front-page .ess-hero-search-card .btn:not(.ess-hero-search-submit),
body.front-page .ess-hero-search-card button:not(.ess-hero-search-submit) {
  width: 38px !important;
  min-width: 38px !important;
  padding-inline: 0 !important;
  opacity: .74;
  box-shadow: none !important;
}

body.front-page .ess-hero-search-card .btn:not(.ess-hero-search-submit):empty,
body.front-page .ess-hero-search-card button:not(.ess-hero-search-submit):empty {
  display: none !important;
}

body.front-page .ess-home-pills {
  margin-top: 14px;
  gap: 8px;
}

body.front-page .ess-home-pill {
  min-height: 32px;
  padding: 6px 11px;
  font-size: 12.5px;
}

body.front-page .ess-home-hero-media {
  inset: 0 -16% 0 49%;
  min-height: 455px;
}

body.front-page .ess-hero-image-card img {
  object-position: 68% 40%;
  transform: scale(.96);
}

body.front-page .ess-hero-image-card:after {
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .99) 15%, rgba(255, 255, 255, .78) 35%, rgba(255, 255, 255, .24) 60%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .08) 0%, rgba(255, 255, 255, 0) 52%, rgba(255, 255, 255, .24) 100%);
}

@media (max-width: 1199.98px) {
  body.front-page .ess-home-hero-copy {
    padding-left: clamp(58px, 5vw, 92px);
  }

  body.front-page .ess-home-hero-shell {
    grid-template-columns: minmax(0, 590px) minmax(450px, 1fr);
  }

  body.front-page .ess-home-hero-media {
    inset: 0 -18% 0 49%;
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 68px;
    grid-template-columns: 1fr auto;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 50px !important;
  }

  body.front-page #main-search-banner.ess-home-hero-v3 {
    min-height: auto !important;
  }

  body.front-page .ess-home-hero-copy {
    padding: 28px 0 0;
  }

  body.front-page .ess-hero-search-card {
    width: 100%;
    grid-template-columns: 1fr;
  }

  body.front-page .ess-home-pills {
    margin-top: 12px;
  }

  body.front-page .ess-home-hero-media {
    inset: auto;
    min-height: 236px;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 44px !important;
  }

  body.front-page .ess-home-hero-copy h1 {
    font-size: clamp(30px, 8.8vw, 35px);
  }

body.front-page .ess-home-hero-media {
    min-height: 200px;
  }
}

/* Phase A final-final: last pixel corrections for logo, search and hero image balance. */
body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 86px;
}

body.front-page .ess-top-logo-col {
  display: flex;
  align-items: center;
}

body.front-page .ess-top-logo-col .top-logo,
body.front-page .ess-top-logo-col a {
  display: inline-flex;
  align-items: center;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  max-height: 79px !important;
  width: auto;
  transform: translateY(0);
}

body.front-page .ess-home-hero-copy {
  padding-left: clamp(100px, 7vw, 142px);
}

body.front-page .ess-hero-search-card {
  width: min(100%, 735px);
  max-width: 735px;
  grid-template-columns: minmax(178px, .52fr) minmax(345px, 1.18fr) minmax(108px, auto);
  align-items: center;
}

body.front-page .ess-hero-search-card .ess-hero-search,
body.front-page .ess-hero-search-card .ess-hero-search > *,
body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  min-width: 0;
}

body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  font-size: 14px !important;
  text-overflow: clip;
}

body.front-page .ess-hero-location-pill {
  padding-inline: 14px !important;
}

body.front-page .ess-home-hero-media {
  inset: 0 -13% 0 43%;
}

body.front-page .ess-hero-image-card img {
  object-position: 60% 40%;
  transform: scale(.955);
}

body.front-page .ess-hero-image-card:after {
  background:
    linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .985) 12%, rgba(255, 255, 255, .66) 29%, rgba(255, 255, 255, .16) 55%, rgba(255, 255, 255, 0) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .08) 0%, rgba(255, 255, 255, 0) 52%, rgba(255, 255, 255, .24) 100%);
}

@media (max-width: 1199.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 68px !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-left: clamp(52px, 4.8vw, 86px);
  }

  body.front-page .ess-home-hero-media {
    inset: 0 -15% 0 43%;
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 70px;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 52px !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-left: 0;
  }

  body.front-page .ess-home-hero-media {
    inset: auto;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 45px !important;
  }

  body.front-page .ess-hero-search-card {
    width: 100%;
    max-width: 100%;
  }
}

/* Phase A homepage final fixes: clean header cart seam and make hero search location-first. */
body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 88px;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  max-height: 91px !important;
}

body.front-page .ess-top-actions-col,
body.front-page .ess-top-actions-col * {
  border-left-color: transparent !important;
  border-right-color: transparent !important;
}

body.front-page .ess-top-actions-col .line-left {
  border-left: 0 !important;
  padding-left: 0 !important;
}

body.front-page .ess-top-actions-col .line-left:before,
body.front-page .ess-top-actions-col .line-left:after,
body.front-page .ess-top-actions-col .cart-handle:before,
body.front-page .ess-top-actions-col .cart-handle:after,
body.front-page .ess-top-actions-col .rounded-pill:before,
body.front-page .ess-top-actions-col .rounded-pill:after {
  display: none !important;
  content: none !important;
}

body.front-page .ess-top-actions-col .cart-handle {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 52px;
  min-width: 52px;
  height: 52px;
  padding: 0 !important;
  overflow: visible;
}

body.front-page .ess-top-actions-col .cart-handle img,
body.front-page .ess-top-actions-col .cart-handle i,
body.front-page .ess-top-actions-col .cart-handle svg {
  margin: auto;
}

body.front-page .ess-top-actions-col .badge,
body.front-page .ess-top-actions-col .cart_count,
body.front-page .ess-top-actions-col .cart-count {
  top: -6px !important;
  right: -4px !important;
}

body.front-page .ess-hero-search-card {
  width: min(100%, 724px);
  max-width: 724px;
  grid-template-columns: minmax(176px, .42fr) minmax(390px, 1fr) 42px;
  gap: 10px;
}

body.front-page .ess-hero-search-submit,
body.front-page .ess-hero-search-card .ess-hero-search-submit,
body.front-page .ess-hero-search-card button[type="submit"].ess-hero-search-submit {
  display: none !important;
}

body.front-page .ess-hero-search-card .btn:not(.ess-hero-search-submit),
body.front-page .ess-hero-search-card button:not(.ess-hero-search-submit) {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  border-radius: 12px !important;
  opacity: .68;
  box-shadow: none !important;
}

body.front-page .ess-hero-location-pill,
body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  min-height: 43px !important;
  height: 43px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search input::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .form-control::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner::placeholder {
  font-size: 13.5px;
  opacity: .74;
}

body.front-page .ess-home-hero-media {
  inset: 0 -14% 0 42%;
}

body.front-page .ess-hero-image-card img {
  object-position: 58% 40%;
  transform: scale(.95);
}

@media (max-width: 1199.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 78px !important;
  }

  body.front-page .ess-hero-search-card {
    width: min(100%, 690px);
    max-width: 690px;
    grid-template-columns: minmax(166px, .42fr) minmax(340px, 1fr) 42px;
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 70px;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 58px !important;
  }

  body.front-page .ess-top-actions-col .cart-handle {
    width: 46px;
    min-width: 46px;
    height: 46px;
  }

  body.front-page .ess-hero-search-card {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 100%;
  }

  body.front-page .ess-hero-search-card .btn:not(.ess-hero-search-submit),
  body.front-page .ess-hero-search-card button:not(.ess-hero-search-submit) {
    justify-self: end;
  }

  body.front-page .ess-home-hero-media {
    inset: auto;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 50px !important;
  }

  body.front-page .ess-hero-search-card {
    gap: 8px;
  }

  body.front-page .ess-hero-location-pill,
  body.front-page .ess-hero-search-card .ess-hero-search input,
  body.front-page .ess-hero-search-card .ess-hero-search .form-control,
  body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
    min-height: 42px !important;
    height: 42px !important;
  }
}

/* Phase A final header/search correction: cart badge, hero search button and hero image balance. */
body.front-page #top-navigation.ess-top-nav-v3 {
  min-height: 92px;
  overflow: visible;
}

body.front-page .ess-top-logo-col {
  display: flex;
  align-items: center;
  min-width: 310px;
}

body.front-page .ess-top-logo-col .top-logo,
body.front-page .ess-top-logo-col .top-logo a,
body.front-page .ess-top-logo-col a {
  display: inline-flex;
  align-items: center;
}

body.front-page .ess-top-logo-col .top-logo img,
body.front-page .ess-top-logo-col img {
  width: auto !important;
  max-height: 104px !important;
  object-fit: contain;
}

body.front-page .ess-top-actions-col {
  overflow: visible;
}

body.front-page .ess-top-actions-col .cart-handle {
  position: relative;
  isolation: isolate;
  width: 56px;
  min-width: 56px;
  height: 56px;
  min-height: 56px;
  border: 1px solid rgba(236, 236, 236, .96) !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, .075) !important;
}

body.front-page .ess-top-actions-col .cart-handle .badge,
body.front-page .ess-top-actions-col .cart-handle .small.badge,
body.front-page .ess-top-actions-col .cart-handle .badge.rounded-pill {
  position: absolute !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  top: 2px !important;
  right: 2px !important;
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #1A2233 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
  opacity: 1 !important;
  transform: none !important;
  box-shadow: 0 5px 12px rgba(17, 24, 39, .18) !important;
  overflow: hidden !important;
  z-index: 3;
}

body.front-page .ess-top-actions-col .cart-handle .badge:empty,
body.front-page .ess-top-actions-col .cart-handle .badge::before,
body.front-page .ess-top-actions-col .cart-handle .badge::after {
  display: none !important;
  content: none !important;
}

body.front-page .ess-hero-search-card {
  width: min(100%, 770px);
  max-width: 770px;
  grid-template-columns: minmax(170px, .35fr) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

body.front-page .ess-hero-location-pill,
body.front-page .ess-hero-search-card .ess-hero-search,
body.front-page .ess-hero-search-card .ess-hero-search > *,
body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  min-height: 46px !important;
  height: 46px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  text-overflow: ellipsis;
}

body.front-page .ess-hero-search-card .ess-hero-search input::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .form-control::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner::placeholder {
  font-size: 14px;
  opacity: .72;
}

body.front-page .ess-hero-search-submit,
body.front-page .ess-hero-search-card .ess-hero-search-submit,
body.front-page .ess-hero-search-card a.ess-hero-search-submit,
body.front-page .ess-hero-search-card button[type="submit"].ess-hero-search-submit {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 7px 0 0 !important;
  border: 1px solid rgba(236, 236, 236, .98) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72) !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  height: 38px !important;
  min-height: 38px !important;
  margin-left: 6px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .twitter-typeahead {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-link,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-link {
  flex: 0 0 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  margin: 0 5px 0 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  color: #666 !important;
  background: #F8F9FA !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green {
  flex: 0 0 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #F58220 !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(245, 130, 32, .22) !important;
  opacity: 1 !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green:hover,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green:hover {
  background: #E26F12 !important;
  box-shadow: 0 15px 28px rgba(226, 111, 18, .26) !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green i,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  line-height: 1 !important;
  color: #fff !important;
  transform: none !important;
}

body.front-page .ess-home-hero-media {
  inset: 0 -10% 0 39%;
}

body.front-page .ess-hero-image-card img {
  object-position: 54% 40%;
  transform: scale(.95);
}

@media (max-width: 1199.98px) {
  body.front-page .ess-top-logo-col {
    min-width: 260px;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 88px !important;
  }

  body.front-page .ess-hero-search-card {
    width: min(100%, 720px);
    max-width: 720px;
    grid-template-columns: minmax(150px, .34fr) minmax(0, 1fr);
  }
}

@media (max-width: 991.98px) {
  body.front-page #top-navigation.ess-top-nav-v3 {
    min-height: 72px;
  }

  body.front-page .ess-top-logo-col {
    min-width: 0;
  }

  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 62px !important;
  }

  body.front-page .ess-top-actions-col .cart-handle {
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
  }

  body.front-page .ess-hero-search-card {
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 100%;
  }

  body.front-page .ess-hero-location-pill {
    grid-column: 1 / -1;
  }

  body.front-page .ess-hero-search-card .ess-hero-search {
    grid-column: 1 / -1;
  }
}

@media (max-width: 575.98px) {
  body.front-page .ess-top-logo-col .top-logo img,
  body.front-page .ess-top-logo-col img {
    max-height: 55px !important;
  }

  body.front-page .ess-hero-search-card {
    gap: 9px;
  }
}

/* Phase A final: smooth the hero location search into one calm component. */
body.front-page .ess-hero-search-card {
  align-items: stretch !important;
}

body.front-page .ess-hero-search-card .ess-hero-search {
  overflow: visible !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
  display: flex !important;
  align-items: center !important;
  min-height: 46px !important;
  height: 46px !important;
  width: 100% !important;
  padding: 0 7px 0 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .twitter-typeahead {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 46px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search input,
body.front-page .ess-hero-search-card .ess-hero-search .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner {
  height: 46px !important;
  min-height: 46px !important;
  padding: 0 8px !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.front-page .ess-hero-search-card .ess-hero-search input:focus,
body.front-page .ess-hero-search-card .ess-hero-search .form-control:focus,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner:focus {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body.front-page .ess-hero-search-card .ess-hero-search input::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .form-control::placeholder,
body.front-page .ess-hero-search-card .ess-hero-search .el-input__inner::placeholder {
  color: #666 !important;
  opacity: .72 !important;
  font-size: 14px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
  height: 38px !important;
  min-height: 38px !important;
  gap: 7px !important;
  margin-left: 7px !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-link,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-link {
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  border: 1px solid #ECECEC !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #666 !important;
  box-shadow: none !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green {
  width: 46px !important;
  min-width: 46px !important;
  height: 38px !important;
  min-height: 38px !important;
  border: 1px solid #ECECEC !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #1A2233 !important;
  box-shadow: 0 6px 16px rgba(17, 24, 39, .06) !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green:hover,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green:hover {
  border-color: #E0E0E0 !important;
  background: #F8F9FA !important;
  color: #1A2233 !important;
  box-shadow: 0 8px 18px rgba(17, 24, 39, .08) !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green i,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green i {
  color: #1A2233 !important;
  width: 18px !important;
  height: 18px !important;
  line-height: 1 !important;
}

.pac-container,
.tt-menu,
.twitter-typeahead .tt-menu,
body.front-page .pac-container,
body.front-page .twitter-typeahead .tt-menu {
  margin-top: 10px !important;
  border: 1px solid #ECECEC !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(17, 24, 39, .14) !important;
  overflow: hidden !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.pac-item,
.tt-suggestion,
body.front-page .pac-item,
body.front-page .tt-suggestion {
  min-height: 44px !important;
  padding: 11px 16px !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(236, 236, 236, .75) !important;
  color: #222 !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.pac-item:hover,
.pac-item-selected,
.tt-suggestion:hover,
.tt-suggestion.tt-cursor,
body.front-page .pac-item:hover,
body.front-page .pac-item-selected,
body.front-page .tt-suggestion:hover,
body.front-page .tt-suggestion.tt-cursor {
  background: #F8F9FA !important;
}

.pac-item:last-child,
.tt-suggestion:last-child {
  border-bottom: 0 !important;
}

@media (max-width: 575.98px) {
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
    padding-left: 12px !important;
    padding-right: 6px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
    gap: 5px !important;
    margin-left: 5px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-link,
  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-link {
    width: 36px !important;
    min-width: 36px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green,
  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green {
    width: 42px !important;
    min-width: 42px !important;
  }
}
/* Customer page alignment with Esskompass v3 homepage */
.ess-customer-page { background: #F8F9FA; color: #222222; }
.ess-checkout-page { padding: 32px 0 56px; }
.ess-checkout-container { max-width: 1180px; }
.ess-checkout-main-card,
.ess-checkout-cart-card,
.ess-checkout-page .card {
  border: 1px solid #ECECEC !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 18px 48px rgba(17, 24, 39, .08) !important;
}
.ess-checkout-page .chevron-section {
  border: 1px solid #ECECEC !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: none !important;
}
.ess-checkout-page .section-title,
.ess-checkout-page h5,
.ess-checkout-page h4 {
  color: #1A2233;
  font-weight: 750;
  letter-spacing: 0;
}
.ess-checkout-page .btn-green,
.ess-checkout-page .btn-primary {
  border-color: #F58220 !important;
  border-radius: 14px !important;
  background: #F58220 !important;
  box-shadow: 0 12px 28px rgba(245, 130, 32, .22) !important;
}
.ess-checkout-page .btn-green:hover,
.ess-checkout-page .btn-primary:hover {
  border-color: #E26F12 !important;
  background: #E26F12 !important;
  transform: translateY(-1px);
}
.ess-checkout-cart { top: 96px; }
.ess-system-page { padding: 56px 0 72px; }
.ess-page-message-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 42px 34px;
  border: 1px solid #ECECEC;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 24px 64px rgba(17, 24, 39, .10);
}
.ess-page-message-media img { max-height: 260px; object-fit: contain; }
.ess-page-kicker {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 7px 12px;
  border-radius: 999px;
  background: #EAF7E8;
  color: #49A942;
  font-size: 13px;
  font-weight: 800;
}
.ess-page-message-content h3 {
  color: #1A2233;
  font-size: 34px;
  font-weight: 800;
  letter-spacing: 0;
}
.ess-page-message-content p {
  max-width: 520px;
  margin: 0 auto 24px;
  color: #666666;
  font-size: 16px;
  line-height: 1.65;
}
.ess-page-message-action {
  min-width: 160px;
  height: 48px;
  border-color: #F58220 !important;
  border-radius: 14px !important;
  background: #F58220 !important;
}
.ess-menu-categorytop-section {
  padding: 28px 0 64px;
  background: #F8F9FA;
}
.ess-merchant-summary-mini {
  margin-top: 18px;
  margin-bottom: 14px;
  border: 1px solid #ECECEC;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(17, 24, 39, .07);
}
.ess-merchant-menu-v3 .menu-center,
.ess-menu-center { border-radius: 24px; }
.ess-menu-section-noimage { margin-bottom: 32px; }
.ess-menu-section-title {
  margin-bottom: 8px;
  color: #1A2233;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0;
}
.ess-menu-section-description { color: #666666; font-size: 15px; line-height: 1.6; }
.ess-menu-card-noimage {
  margin-bottom: 14px !important;
  padding: 18px !important;
  border: 1px solid #ECECEC !important;
  border-radius: 20px !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, .06) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ess-menu-card-noimage:hover {
  border-color: rgba(245, 130, 32, .28) !important;
  box-shadow: 0 18px 42px rgba(17, 24, 39, .10) !important;
  transform: translateY(-2px);
}
.ess-menu-add-button {
  min-height: 40px;
  border-color: #F58220 !important;
  border-radius: 999px !important;
  background: #F58220 !important;
  color: #fff !important;
  font-weight: 700 !important;
}
.ess-menu-add-button:hover {
  border-color: #E26F12 !important;
  background: #E26F12 !important;
}
.ess-legacy-restaurant-page {
  padding: 24px 0 56px;
  background: #F8F9FA;
}
.ess-legacy-restaurant-page .card,
.ess-legacy-restaurant-page .list-items,
.ess-legacy-restaurant-page .feed-card {
  overflow: hidden;
  border: 1px solid #ECECEC !important;
  border-radius: 22px !important;
  box-shadow: 0 16px 42px rgba(17, 24, 39, .07) !important;
}
.ess-legacy-restaurant-page input,
.ess-legacy-restaurant-page select {
  min-height: 46px;
  border-color: #ECECEC !important;
  border-radius: 14px !important;
}
@media (max-width: 767.98px) {
  .ess-checkout-page { padding: 18px 0 36px; }
  .ess-checkout-main-card,
  .ess-checkout-cart-card,
  .ess-checkout-page .card { border-radius: 18px !important; }
  .ess-checkout-cart { position: relative !important; top: auto !important; }
  .ess-page-message-card { padding: 30px 20px; border-radius: 22px; }
  .ess-page-message-content h3 { font-size: 28px; }
  .ess-merchant-summary-mini { margin-right: 12px; margin-left: 12px; border-radius: 18px; }
  .ess-menu-card-noimage { padding: 16px !important; border-radius: 18px !important; }
}
@media (max-width: 575.98px) {
  .ess-checkout-container,
  .ess-system-page { max-width: 100%; overflow-x: hidden; }
  .ess-page-message-media img { max-height: 210px; }
}

/* Esskompass v3: public customer header parity with final homepage header. */
#top-navigation.ess-top-nav-v3 {
  grid-template-columns: minmax(260px, 1fr) auto !important;
  min-height: 104px;
  align-items: center;
}

#top-navigation.ess-top-nav-v3 .ess-top-search-col {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

#top-navigation.ess-top-nav-v3 .ess-top-logo-col {
  min-width: 260px;
  display: flex;
  align-items: center;
}

#top-navigation.ess-top-nav-v3 .ess-top-logo-col .top-logo,
#top-navigation.ess-top-nav-v3 .ess-top-logo-col a {
  display: inline-flex;
  align-items: center;
}

#top-navigation.ess-top-nav-v3 .ess-top-logo-col .top-logo img,
#top-navigation.ess-top-nav-v3 .ess-top-logo-col img {
  max-height: 84px !important;
  width: auto !important;
  object-fit: contain;
}

#top-navigation.ess-top-nav-v3 .ess-top-actions-col {
  justify-self: end;
  margin-left: auto;
  display: flex;
  align-items: center;
}

@media (max-width: 767px) {
  #top-navigation.ess-top-nav-v3 {
    grid-template-columns: minmax(150px, 1fr) auto !important;
    min-height: 78px;
    padding: 12px 18px;
  }

  #top-navigation.ess-top-nav-v3 .ess-top-logo-col {
    min-width: 150px;
  }

  #top-navigation.ess-top-nav-v3 .ess-top-logo-col .top-logo img,
  #top-navigation.ess-top-nav-v3 .ess-top-logo-col img {
    max-height: 56px !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  #top-navigation.ess-top-nav-v3 {
    grid-template-columns: minmax(190px, 1fr) auto !important;
    min-height: 88px;
  }

  #top-navigation.ess-top-nav-v3 .ess-top-logo-col {
    min-width: 190px;
  }

  #top-navigation.ess-top-nav-v3 .ess-top-logo-col .top-logo img,
  #top-navigation.ess-top-nav-v3 .ess-top-logo-col img {
    max-height: 68px !important;
  }
}

/* Phase 1 Design System: EssButton + EssRestaurantCard
   Central visual layer only. Keeps existing handlers, URLs and Vue state intact. */
:root {
  --ess-btn-height-sm: 40px;
  --ess-btn-height-md: 46px;
  --ess-btn-height-lg: 50px;
  --ess-btn-radius: 14px;
  --ess-btn-radius-pill: 999px;
  --ess-card-radius: 20px;
  --ess-card-radius-mobile: 18px;
  --ess-card-shadow: 0 14px 34px rgba(17, 24, 39, 0.08);
  --ess-card-shadow-hover: 0 18px 44px rgba(17, 24, 39, 0.12);
}

.btn,
.el-button {
  min-height: var(--ess-btn-height-md);
  border-radius: var(--ess-btn-radius) !important;
  font-family: var(--ess-font);
  font-weight: 750 !important;
  letter-spacing: 0;
  transition:
    background-color var(--ess-transition),
    border-color var(--ess-transition),
    color var(--ess-transition),
    box-shadow var(--ess-transition),
    transform var(--ess-transition);
}

.btn:not(.btn-circle):not(.rounded-pill):not(.btn-link):not(.btn-white):not(.btn-sm):not(.small),
.el-button:not(.is-circle):not(.is-round) {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.btn-green,
.btn-primary,
.restaurants-filter,
.ess-button-primary,
.el-button--success,
.el-button[style*="#3ecf8e"],
.el-button[style*="rgb(62, 207, 142)"],
.el-button[style*="--el-button-bg-color: #3ecf8e"],
.el-button[style*="--el-button-border-color: #3ecf8e"] {
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.22) !important;
}

.btn-green:hover,
.btn-primary:hover,
.restaurants-filter:hover,
.ess-button-primary:hover,
.el-button--success:hover,
.el-button[style*="#3ecf8e"]:hover,
.el-button[style*="rgb(62, 207, 142)"]:hover {
  background: var(--ess-orange-hover) !important;
  border-color: var(--ess-orange-hover) !important;
  color: var(--ess-white) !important;
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(245, 130, 32, 0.26) !important;
}

.btn-grey,
.btn-green-line,
.btn-white,
.ess-button-secondary,
.el-button.is-plain {
  background: var(--ess-white) !important;
  border: 1px solid var(--ess-border) !important;
  color: var(--ess-text) !important;
  box-shadow: none !important;
}

.btn-grey:hover,
.btn-green-line:hover,
.btn-white:hover,
.ess-button-secondary:hover,
.el-button.is-plain:hover {
  border-color: rgba(245, 130, 32, 0.42) !important;
  color: var(--ess-orange) !important;
  box-shadow: var(--ess-shadow-sm) !important;
  transform: translateY(-1px);
}

.btn-link,
.ess-button-ghost,
.el-button.is-link,
.el-button--primary.is-link {
  min-height: 0;
  border: 0 !important;
  border-radius: var(--ess-btn-radius-pill) !important;
  background: transparent !important;
  color: var(--ess-orange) !important;
  box-shadow: none !important;
  font-weight: 750 !important;
}

.btn-link:hover,
.ess-button-ghost:hover,
.el-button.is-link:hover,
.el-button--primary.is-link:hover {
  color: var(--ess-orange-hover) !important;
  background: rgba(245, 130, 32, 0.08) !important;
}

.btn-black,
.ess-button-contrast {
  background: var(--ess-text) !important;
  border-color: var(--ess-text) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.18) !important;
}

.btn-black:hover,
.ess-button-contrast:hover {
  background: #111827 !important;
  border-color: #111827 !important;
  color: var(--ess-white) !important;
  transform: translateY(-1px);
}

.btn-danger,
.ess-button-danger,
.el-button--danger {
  background: #d93025 !important;
  border-color: #d93025 !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(217, 48, 37, 0.16) !important;
}

.btn-danger:hover,
.ess-button-danger:hover,
.el-button--danger:hover {
  background: #b42318 !important;
  border-color: #b42318 !important;
}

.ess-button-success,
.el-button--success.is-plain {
  background: var(--ess-green-soft) !important;
  border-color: rgba(73, 169, 66, 0.28) !important;
  color: var(--ess-green) !important;
  box-shadow: none !important;
}

.btn-circle,
.btn-green-circle,
.el-button.is-circle,
.ess-button-icon,
.rounded-button-icon,
.qty-btn,
.item-remove {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: var(--ess-btn-radius-pill) !important;
}

.btn-green-circle {
  background: var(--ess-orange) !important;
  border-color: var(--ess-orange) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.18) !important;
}

.btn-green-circle:hover {
  background: var(--ess-orange-strong) !important;
  border-color: var(--ess-orange-strong) !important;
  color: var(--ess-white) !important;
}

.floating-cart .btn,
.ess-floating-cart-button,
.ess-button-floating {
  min-height: 54px;
  border-radius: 18px !important;
  background: var(--ess-text) !important;
  border-color: var(--ess-text) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 18px 42px rgba(17, 24, 39, 0.22) !important;
}

.btn:disabled,
.btn.disabled,
.el-button.is-disabled,
.el-button:disabled,
.ess-button-disabled {
  opacity: 0.58 !important;
  transform: none !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

.w25 {
  width: auto !important;
  min-width: 156px;
}

.ess-restaurant-card,
.ess-feed-card,
.ess-restaurant-card-v3,
.ess-search-restaurant-card {
  overflow: hidden;
  height: 100%;
  min-height: var(--ess-restaurant-card-height, 336px);
  border: 1px solid var(--ess-border) !important;
  border-radius: var(--ess-card-radius, 16px) !important;
  background: var(--ess-white) !important;
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.075) !important;
  color: var(--ess-text) !important;
  display: flex !important;
  flex-direction: column;
  transition:
    transform 160ms ease,
    box-shadow 160ms ease,
    border-color 160ms ease;
}

.ess-restaurant-card:hover,
.ess-feed-card:hover,
.ess-restaurant-card-v3:hover,
.ess-search-restaurant-card:hover {
  transform: translateY(-1px);
  border-color: rgba(245, 130, 32, 0.22) !important;
  box-shadow: 0 16px 34px rgba(17, 24, 39, 0.11) !important;
}

.ess-restaurant-card-link,
.ess-restaurant-card-link:hover {
  display: block;
  height: 100%;
  color: inherit !important;
  text-decoration: none !important;
}

.ess-restaurant-card-link .el-link__inner {
  display: block;
  width: 100%;
  height: 100%;
}

.ess-search-restaurant-card .el-card__body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.ess-restaurant-card-media,
.ess-feed-card-media,
.ess-featured-card-media {
  aspect-ratio: 4 / 3;
  height: var(--ess-restaurant-card-media-height, 188px);
  min-height: var(--ess-restaurant-card-media-height, 188px);
  flex: 0 0 var(--ess-restaurant-card-media-height, 188px);
  overflow: hidden;
  background: var(--ess-bg);
}

.ess-restaurant-card-media img,
.ess-restaurant-card-media .el-image,
.ess-restaurant-card-media .el-image__inner,
.ess-feed-card-media img,
.ess-feed-card-media .el-image,
.ess-feed-card-media .el-image__inner,
.ess-restaurant-card-v3 img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover;
  object-position: center;
  transition: transform 260ms ease;
}

.ess-restaurant-card:hover .ess-restaurant-card-media img,
.ess-restaurant-card:hover .ess-restaurant-card-media .el-image__inner,
.ess-feed-card:hover .ess-feed-card-media img,
.ess-feed-card:hover .ess-feed-card-media .el-image__inner,
.ess-restaurant-card-v3:hover img {
  transform: scale(1.018);
}

.ess-restaurant-card-body,
.ess-feed-card-body {
  padding: 13px 15px 14px !important;
  min-height: var(--ess-restaurant-card-body-height, 148px);
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.ess-restaurant-card-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  min-height: 40px;
  min-width: 0;
}

.ess-restaurant-card-title,
.ess-feed-card-title {
  margin: 0 !important;
  color: var(--ess-text) !important;
  font-size: 16px !important;
  line-height: 1.22;
  font-weight: 850 !important;
  letter-spacing: 0;
  min-width: 0;
  overflow: hidden;
  white-space: normal !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ess-restaurant-card-cuisine,
.ess-restaurant-card-cuisines,
.ess-feed-card-cuisines {
  display: block;
  max-width: 100% !important;
  margin: 5px 0 0;
  color: var(--ess-muted) !important;
  font-size: 13px !important;
  line-height: 1.38;
  min-height: 36px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ess-restaurant-card-meta,
.ess-feed-meta-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap;
  gap: 5px 10px;
  margin-top: auto;
  min-height: 24px;
  color: var(--ess-muted) !important;
  font-size: 12px !important;
  font-weight: 600;
  line-height: 1.35;
}

.ess-restaurant-card-meta > *,
.ess-feed-meta-item {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100%;
  min-width: 0;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.ess-restaurant-card-meta .col,
.ess-restaurant-card-meta .col-5 {
  flex: 0 1 auto !important;
  width: auto !important;
  max-width: 100%;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.ess-restaurant-card-meta i,
.ess-feed-meta-row i {
  color: #9ca3af;
  font-size: 12px;
}

.ess-open-badge,
.ess-restaurant-card .el-tag,
.ess-feed-card .el-tag {
  border-radius: var(--ess-btn-radius-pill) !important;
  font-weight: 750 !important;
  letter-spacing: 0;
}

.ess-open-badge {
  flex: 0 0 auto;
  max-width: 84px;
  padding: 3px 7px;
  background: rgba(73, 169, 66, 0.1);
  color: #2f7d32;
  font-size: 10.5px;
  line-height: 1.1;
  text-transform: none;
  box-shadow: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ess-open-badge-placeholder {
  visibility: hidden;
}

.ess-restaurant-card .position-absolute.p-2,
.ess-restaurant-card-v3 .position-absolute.p-2 {
  display: flex;
  flex-direction: column;
  gap: 5px;
  max-width: calc(100% - 20px);
  padding: 9px !important;
}

.ess-restaurant-card .el-tag,
.ess-feed-card .el-tag,
.with-promo {
  min-height: 22px;
  max-width: 100%;
  padding: 4px 8px !important;
  border: 0 !important;
  border-radius: var(--ess-btn-radius-pill) !important;
  background: rgba(17, 24, 39, 0.72) !important;
  color: var(--ess-white) !important;
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  font-weight: 750 !important;
  box-shadow: 0 8px 18px rgba(17, 24, 39, 0.12);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.with-promo {
  position: absolute;
  z-index: 9;
  top: 10px;
  left: 10px;
}

.fav-floating {
  z-index: 10;
}

.ess-feed-promo-row {
  display: none !important;
}

.ess-restaurant-card-grid,
.ess-feed-card-grid {
  margin-left: -10px !important;
  margin-right: -10px !important;
}

.ess-restaurant-card-col,
.ess-feed-card-col {
  padding: 10px !important;
}

.ess-search-page .demo-tabs .el-tabs__item.is-active,
.ess-search-page .demo-tabs .el-tabs__item:hover {
  color: var(--ess-orange) !important;
}

.ess-search-page .demo-tabs .el-tabs__active-bar {
  background-color: var(--ess-orange) !important;
}

@media (max-width: 767.98px) {
  .btn,
  .el-button {
    min-height: var(--ess-btn-height-md);
  }

  .btn:not(.btn-circle):not(.rounded-pill):not(.btn-link):not(.btn-white):not(.btn-sm):not(.small),
  .el-button:not(.is-circle):not(.is-round) {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .w25 {
    width: 100% !important;
    min-width: 0;
  }

  .ess-restaurant-card,
  .ess-feed-card,
  .ess-restaurant-card-v3,
  .ess-search-restaurant-card {
    min-height: var(--ess-restaurant-card-mobile-height, 324px);
    border-radius: var(--ess-card-radius-mobile) !important;
  }

  .ess-restaurant-card-media,
  .ess-feed-card-media,
  .ess-featured-card-media {
    height: var(--ess-restaurant-card-mobile-media-height, 176px);
    min-height: var(--ess-restaurant-card-mobile-media-height, 176px);
    flex-basis: var(--ess-restaurant-card-mobile-media-height, 176px);
  }

  .ess-restaurant-card-grid,
  .ess-feed-card-grid {
    margin-left: -6px !important;
    margin-right: -6px !important;
  }

  .ess-restaurant-card-col,
  .ess-feed-card-col {
    padding: 6px !important;
  }

  .ess-restaurant-card-body,
  .ess-feed-card-body {
    min-height: 148px;
    padding: 12px 13px 13px !important;
  }

  .ess-restaurant-card-title,
  .ess-feed-card-title {
    font-size: 15px !important;
    line-height: 1.24;
  }

  .ess-restaurant-card-meta,
  .ess-feed-meta-row {
    gap: 5px 8px;
  }
}

/* Food Card V3 final + Cart visual alignment
   Theme-only visual layer. Keeps item/cart/checkout behaviour untouched. */
.ess-food-card,
.ess-featured-card-v3 {
  overflow: hidden;
  height: 100%;
  min-height: 298px;
  display: flex !important;
  flex-direction: column;
  border: 1px solid var(--ess-border) !important;
  border-radius: var(--ess-card-radius, 16px) !important;
  background: var(--ess-white) !important;
  box-shadow: 0 10px 26px rgba(17, 24, 39, 0.07) !important;
  color: var(--ess-text) !important;
  transition: transform 150ms ease, box-shadow 150ms ease, border-color 150ms ease;
}

.ess-food-card:hover,
.ess-featured-card-v3:hover {
  transform: translateY(-1px);
  border-color: rgba(245, 130, 32, 0.2) !important;
  box-shadow: 0 15px 32px rgba(17, 24, 39, 0.1) !important;
}

.ess-food-card .el-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  height: 100%;
}

.ess-food-card-media,
.ess-featured-card-media {
  width: 100% !important;
  height: 140px !important;
  min-height: 140px !important;
  flex: 0 0 140px;
  overflow: hidden;
  background: var(--ess-bg);
}

.ess-food-card-media img,
.ess-food-card-media .el-image__inner,
.ess-featured-card-media img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover;
  object-position: center;
  transform: scale(1.035);
  transition: transform 220ms ease;
}

.ess-food-card:hover .ess-food-card-media img,
.ess-food-card:hover .ess-food-card-media .el-image__inner,
.ess-featured-card-v3:hover .ess-featured-card-media img {
  transform: scale(1.05);
}

.ess-food-card-body,
.ess-featured-card-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 158px;
  padding: 12px 14px 13px !important;
}

.ess-food-card-title-row {
  min-height: 22px;
  gap: 6px;
}

.ess-food-card-title,
.ess-featured-card-title,
.ess-menu-item-title {
  margin: 0 !important;
  color: var(--ess-text) !important;
  font-size: 15.5px !important;
  line-height: 1.24;
  font-weight: 850 !important;
  letter-spacing: 0;
}

.ess-food-card-title,
.ess-featured-card-title {
  overflow: hidden;
  white-space: normal !important;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ess-food-card-description,
.ess-featured-card-description,
.ess-menu-item-description {
  display: -webkit-box !important;
  max-width: 100% !important;
  min-height: 38px;
  margin: 5px 0 9px !important;
  overflow: hidden;
  color: var(--ess-muted) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  white-space: normal !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ess-food-card-footer,
.ess-featured-card-footer {
  margin-top: auto;
  gap: 10px;
  min-height: 38px;
}

.ess-food-card-price,
.featured-item-price,
.ess-menu-item-price,
.ess-menu-item-price h5,
.ess-menu-item-price p {
  color: var(--ess-text) !important;
  font-size: 16px !important;
  line-height: 1.2;
  font-weight: 850 !important;
}

.ess-food-card-add,
.ess-featured-add,
.ess-menu-add-button,
.quantity-add-cart.ess-menu-add-button,
.xget-item-details.ess-menu-add-button {
  min-width: 86px;
  min-height: 38px !important;
  height: 38px;
  padding: 8px 18px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 0 !important;
  border-radius: var(--ess-btn-radius, 14px) !important;
  background: var(--ess-orange) !important;
  color: var(--ess-white) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 850 !important;
  box-shadow: 0 8px 18px rgba(245, 130, 32, 0.19) !important;
}

.ess-food-card-add:hover,
.ess-featured-add:hover,
.ess-menu-add-button:hover,
.quantity-add-cart.ess-menu-add-button:hover,
.xget-item-details.ess-menu-add-button:hover {
  background: var(--ess-orange-strong, var(--ess-orange-hover)) !important;
  color: var(--ess-white) !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.22) !important;
}

.ess-food-card-add.is-disabled,
.ess-food-card-add:disabled,
.ess-featured-add.is-disabled,
.ess-featured-add:disabled {
  opacity: 0.62 !important;
  box-shadow: none !important;
}

.ess-menu-item-card {
  border-radius: var(--ess-card-radius, 16px) !important;
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.065) !important;
}

.ess-menu-item-content {
  padding: 12px 14px 12px 16px !important;
}

.ess-menu-item-media .item-image-preview {
  height: 150px;
  overflow: hidden;
  border-radius: 14px;
}

.ess-menu-item-media .el-image,
.ess-menu-item-media .el-image__inner {
  width: 100% !important;
  height: 150px !important;
  object-fit: cover;
  object-position: center;
}

.ess-menu-item-title + .ml-2,
.ess-menu-item-title-row .ml-2 {
  margin-left: 6px !important;
}

.ess-menu-item-card .el-button.is-link,
.ess-menu-item-card .el-button--plain,
.ess-menu-item-card .el-button[type="plain"] {
  min-height: 24px !important;
  height: 24px;
  padding: 0 2px !important;
  color: #9ca3af !important;
}

.ess-menu-item-card .zmdi-info-outline {
  color: #9ca3af !important;
  font-size: 18px !important;
  line-height: 1;
}

.ess-cart-panel {
  overflow: hidden;
  background: var(--ess-white) !important;
  border: 1px solid var(--ess-border) !important;
  border-radius: var(--ess-card-radius, 16px) !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.08) !important;
}

.ess-cart-header {
  padding: 22px 18px 12px !important;
  border-bottom: 1px solid var(--ess-border);
}

.ess-cart-header > h5,
.ess-cart-empty-title {
  margin: 0 0 12px !important;
  padding: 0 18px;
  color: var(--ess-text) !important;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 850 !important;
}

.ess-cart-header > h5 {
  padding: 0;
}

.ess-cart-summary-head {
  padding: 0;
}

.ess-cart-empty-title {
  padding-top: 22px;
}

.ess-cart-empty {
  min-height: 260px;
  padding: 18px 22px 34px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ess-muted);
  background: linear-gradient(180deg, #fff 0%, #fffaf6 100%);
}

.ess-cart-empty > .mt-5 {
  margin-top: 0 !important;
}

.ess-cart-empty-icon {
  width: 74px;
  height: 74px;
  margin-bottom: 16px !important;
  opacity: 0.72;
  filter: saturate(0.92);
}

.ess-cart-empty h6 {
  color: var(--ess-text) !important;
  font-size: 15px;
  line-height: 1.35;
  font-weight: 800 !important;
}

.ess-cart-empty p {
  margin-top: 5px;
  color: var(--ess-muted) !important;
  font-size: 13px;
  line-height: 1.45;
}

.ess-cart-body {
  padding: 14px 16px 16px !important;
}

@media (max-width: 767.98px) {
  .ess-food-card,
  .ess-featured-card-v3 {
    min-height: 288px;
  }

  .ess-food-card-media,
  .ess-featured-card-media {
    height: 136px !important;
    min-height: 136px !important;
    flex-basis: 136px;
  }

  .ess-food-card-body,
  .ess-featured-card-body {
    min-height: 152px;
    padding: 11px 13px 12px !important;
  }

  .ess-food-card-add,
  .ess-featured-add,
  .ess-menu-add-button,
  .quantity-add-cart.ess-menu-add-button,
  .xget-item-details.ess-menu-add-button {
    min-height: 37px !important;
    height: 37px;
    padding: 8px 16px !important;
  }

  .ess-menu-item-media .item-image-preview,
  .ess-menu-item-media .el-image,
  .ess-menu-item-media .el-image__inner {
    height: 132px !important;
  }

  .ess-cart-header {
    padding: 20px 16px 12px !important;
  }

  .ess-cart-empty-title {
    padding: 20px 16px 0;
  }
}

/* Homepage V3 final refinement
   Page rhythm and section polish only. Reuses EssRestaurantCard and EssFoodCard. */
.ess-home-v3,
.ess-home-sections-v3 {
  overflow-x: clip;
}

.ess-home-v3 {
  background:
    linear-gradient(180deg, #fff7ef 0%, #fff 72%);
}

#main-search-banner.ess-home-hero-v3 {
  min-height: 680px;
  padding: 54px 20px 62px;
  display: flex;
  align-items: center;
  background:
    radial-gradient(circle at 82% 18%, rgba(73, 169, 66, 0.11), transparent 30%),
    linear-gradient(135deg, #fffaf5 0%, #fff 58%, #f5fbf5 100%);
}

.ess-home-hero-shell {
  width: min(1180px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.88fr);
  align-items: center;
  gap: clamp(34px, 5vw, 78px);
}

.ess-home-hero-copy {
  max-width: 680px;
}

.ess-home-kicker {
  margin-bottom: 13px;
  color: var(--ess-orange);
  font-size: 13px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: 0.02em;
}

.ess-home-hero-copy h1 {
  max-width: 660px;
  margin: 0;
  color: var(--ess-text);
  font-size: clamp(44px, 5vw, 72px);
  line-height: 0.98;
  font-weight: 900;
  letter-spacing: 0;
}

.ess-home-hero-copy .ess-home-subtitle {
  max-width: 560px;
  margin: 20px 0 0;
  color: #5f6673;
  font-size: 18px;
  line-height: 1.58;
  font-weight: 500;
}

.ess-home-actions {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ess-home-primary-action,
.ess-home-secondary-action {
  min-height: 46px;
  padding: 13px 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ess-btn-radius, 14px);
  font-size: 14px;
  line-height: 1;
  font-weight: 850;
  text-decoration: none !important;
}

.ess-home-primary-action {
  background: var(--ess-orange);
  color: var(--ess-white) !important;
  box-shadow: 0 12px 28px rgba(245, 130, 32, 0.22);
}

.ess-home-secondary-action {
  border: 1px solid rgba(17, 24, 39, 0.1);
  background: rgba(255, 255, 255, 0.8);
  color: var(--ess-text) !important;
}

.ess-home-primary-action:hover,
.ess-home-secondary-action:hover {
  transform: translateY(-1px);
}

.ess-hero-search-card {
  width: min(100%, 650px);
  margin-top: 24px;
  padding: 10px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 22px 52px rgba(17, 24, 39, 0.1);
}

.ess-hero-location-pill,
.ess-hero-search-submit {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 800;
}

.ess-hero-location-pill {
  padding: 0 14px;
  gap: 8px;
  background: #f7f8fa;
  color: #4b5563;
}

.ess-hero-search-card .ess-hero-search {
  min-width: 0;
}

.ess-hero-search-card .ess-hero-search,
.ess-hero-search-card .ess-hero-search > *,
.ess-hero-search-card .ess-hero-search .el-input,
.ess-hero-search-card .ess-hero-search .twitter-typeahead,
.ess-hero-search-card .ess-hero-search .search-geocomplete {
  width: 100% !important;
}

.ess-hero-search-card .ess-hero-search input,
.ess-hero-search-card .ess-hero-search .form-control,
.ess-hero-search-card .ess-hero-search .el-input__inner {
  height: 48px !important;
  min-height: 48px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: #f7f8fa !important;
  color: var(--ess-text) !important;
  font-size: 15px !important;
  box-shadow: none !important;
}

.ess-hero-search-submit {
  padding: 0 22px;
  background: var(--ess-orange);
  color: var(--ess-white) !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(245, 130, 32, 0.2);
}

.ess-home-pills {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.ess-home-pills span {
  min-height: 32px;
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #667085;
  font-size: 12px;
  font-weight: 750;
}

.ess-home-hero-media {
  min-width: 0;
}

.ess-hero-image-card {
  overflow: hidden;
  border-radius: 28px;
  box-shadow: 0 24px 64px rgba(17, 24, 39, 0.13);
}

.ess-hero-image-card img {
  width: 100%;
  display: block;
}

.ess-hero-floating-card {
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--ess-text);
  font-size: 13px;
  font-weight: 850;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.12);
}

.ess-home-sections-v3 {
  padding: 52px 0 72px;
  background: #fff;
}

.ess-home-content-v3 {
  max-width: 1180px;
}

.ess-home-section {
  margin: 0 0 58px;
}

.ess-home-content-bottom .ess-home-section {
  margin-bottom: 0;
}

.ess-section-carousel {
  width: 100%;
}

.ess-section-heading {
  margin-bottom: 18px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}

.ess-section-eyebrow {
  margin-bottom: 6px;
  display: block;
  color: var(--ess-orange);
  font-size: 12px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: 0.03em;
}

.ess-section-heading h3 {
  margin: 0;
  color: var(--ess-text);
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: 0;
}

.ess-cuisine-carousel .swiper-container,
.ess-restaurant-carousel .swiper-container,
.ess-featured-carousel .swiper-container,
.ess-join-v3 .swiper-container {
  overflow: visible;
}

.ess-cuisine-card-v3,
.swiperCuisine .ess-cuisine-card-v3 {
  min-height: 138px;
  padding: 14px 12px;
  border: 1px solid var(--ess-border);
  border-radius: var(--ess-card-radius, 16px);
  background: var(--ess-white);
  box-shadow: 0 10px 26px rgba(17, 24, 39, 0.06);
  transition: transform 150ms ease, box-shadow 150ms ease, border-color 150ms ease;
}

.ess-cuisine-card-v3:hover {
  transform: translateY(-1px);
  border-color: rgba(245, 130, 32, 0.2);
  box-shadow: 0 14px 30px rgba(17, 24, 39, 0.09);
}

.ess-cuisine-card-v3 .el-links {
  height: 100%;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: inherit !important;
}

.ess-cuisine-icon {
  width: 68px;
  height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 50%;
  background: #fff7ef;
}

.ess-cuisine-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.ess-cuisine-name {
  max-width: 100%;
  color: var(--ess-text);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 850;
  text-align: center;
}

.ess-restaurant-carousel,
.ess-featured-carousel {
  padding-top: 2px;
}

.ess-join-v3 {
  padding: 30px;
  border: 1px solid rgba(245, 130, 32, 0.14);
  border-radius: 24px;
  background: linear-gradient(135deg, #fffaf6 0%, #fff 58%, #f6fbf5 100%);
}

.ess-join-card {
  overflow: hidden;
  border: 1px solid var(--ess-border);
  border-radius: var(--ess-card-radius, 16px);
  background: var(--ess-white);
  box-shadow: 0 10px 26px rgba(17, 24, 39, 0.06);
}

.ess-join-card img {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.ess-join-card .content {
  padding: 16px;
}

.ess-join-card .content p {
  color: var(--ess-muted);
  line-height: 1.45;
}

.section-mobileapp.section-newmobileapp {
  margin: 20px 0 64px;
  padding: 56px 0;
  background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
  color: #fff;
}

.section-mobileapp.section-newmobileapp h5,
.section-mobileapp.section-newmobileapp h1,
.section-mobileapp.section-newmobileapp p {
  color: #fff !important;
}

.section-mobileapp.section-newmobileapp p {
  opacity: 0.76;
}

@media (max-width: 991.98px) {
  #main-search-banner.ess-home-hero-v3 {
    min-height: auto;
    padding: 42px 16px 52px;
  }

  .ess-home-hero-shell {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .ess-home-hero-copy {
    max-width: 100%;
  }

  .ess-home-hero-copy h1 {
    font-size: clamp(40px, 7vw, 58px);
  }

  .ess-home-hero-media {
    max-width: 620px;
    margin: 0 auto;
  }

  .ess-home-section {
    margin-bottom: 46px;
  }
}

@media (max-width: 767.98px) {
  #main-search-banner.ess-home-hero-v3 {
    padding: 28px 14px 38px;
  }

  .ess-home-hero-copy {
    text-align: left;
  }

  .ess-home-kicker {
    margin-bottom: 10px;
    font-size: 12px;
  }

  .ess-home-hero-copy h1 {
    font-size: 38px;
    line-height: 1.02;
  }

  .ess-home-hero-copy .ess-home-subtitle {
    margin-top: 14px;
    font-size: 15.5px;
    line-height: 1.52;
  }

  .ess-home-actions {
    margin-top: 20px;
    gap: 9px;
  }

  .ess-home-primary-action,
  .ess-home-secondary-action {
    min-height: 42px;
    padding: 11px 14px;
    font-size: 13px;
  }

  .ess-hero-search-card {
    margin-top: 18px;
    padding: 9px;
    grid-template-columns: 1fr;
    border-radius: 18px;
  }

  .ess-hero-location-pill,
  .ess-hero-search-submit,
  .ess-hero-search-card .ess-hero-search input,
  .ess-hero-search-card .ess-hero-search .form-control,
  .ess-hero-search-card .ess-hero-search .el-input__inner {
    width: 100%;
    min-height: 44px !important;
    height: 44px !important;
  }

  .ess-home-pills {
    margin-top: 16px;
    gap: 7px;
  }

  .ess-home-pills span {
    min-height: 30px;
    padding: 7px 10px;
    font-size: 11.5px;
  }

  .ess-home-hero-media {
    display: block;
    max-width: 360px;
  }

  .ess-hero-image-card {
    border-radius: 22px;
  }

  .ess-hero-floating-card {
    display: none;
  }

  .ess-home-sections-v3 {
    padding: 34px 0 52px;
  }

  .ess-home-content-v3 {
    padding-left: 14px;
    padding-right: 14px;
  }

  .ess-home-section {
    margin-bottom: 38px;
  }

  .ess-section-heading {
    margin-bottom: 14px;
    align-items: flex-start;
  }

  .ess-section-heading h3 {
    font-size: 24px;
  }

  .ess-cuisine-carousel .swiper-container,
  .ess-restaurant-carousel .swiper-container,
  .ess-featured-carousel .swiper-container,
  .ess-join-v3 .swiper-container {
    overflow: hidden;
  }

  .ess-cuisine-card-v3,
  .swiperCuisine .ess-cuisine-card-v3 {
    min-height: 124px;
    padding: 12px 10px;
  }

  .ess-cuisine-icon {
    width: 58px;
    height: 58px;
  }

  .ess-cuisine-name {
    font-size: 13px;
  }

  .ess-join-v3 {
    padding: 20px 14px;
    border-radius: 20px;
  }

  .section-mobileapp.section-newmobileapp {
    margin: 8px 0 44px;
    padding: 38px 0 0;
  }
}

/* Restaurant detail V3 final refinement
   Layout and page chrome only. Reuses final EssFoodCard and Cart design. */
.ess-restaurant-detail-shell,
.ess-menu-categorytop-section {
  overflow-x: clip;
  padding: 34px 0 72px;
  background: linear-gradient(180deg, #fff 0%, #fafbfc 100%);
}

.ess-restaurant-detail-shell > .container,
.ess-menu-categorytop-section > .container,
#vue-booking-reservation,
#section-about,
#section-map,
#section-review {
  max-width: 1180px;
}

.merchant-top-header.ess-merchant-hero {
  padding: 20px 0 30px;
  background:
    radial-gradient(circle at 82% 0%, rgba(73, 169, 66, 0.11), transparent 32%),
    linear-gradient(135deg, #fffaf5 0%, #fff 58%, #f5fbf5 100%);
}

.ess-merchant-breadcrumb {
  margin-bottom: 12px;
  color: #6b7280;
  font-size: 13px;
}

.ess-merchant-breadcrumb a {
  color: #6b7280 !important;
}

.ess-merchant-hero-row {
  align-items: stretch;
  gap: 18px;
  margin-left: 0;
  margin-right: 0;
}

.ess-merchant-info-card,
.ess-merchant-media-card {
  border: 1px solid rgba(17, 24, 39, 0.08);
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 46px rgba(17, 24, 39, 0.08);
}

.ess-merchant-info-card {
  flex: 1 1 calc(52% - 9px);
  max-width: calc(52% - 9px);
  padding: 22px !important;
}

.ess-merchant-media-card {
  flex: 1 1 calc(48% - 9px);
  max-width: calc(48% - 9px);
  overflow: hidden;
  min-height: 250px;
  padding: 0 !important;
  background: #f5f6f8;
}

.ess-merchant-logo-wrap {
  flex: 0 0 112px;
}

.ess-merchant-logo {
  width: 112px !important;
  min-width: 112px !important;
  height: 112px !important;
  min-height: 112px !important;
  max-height: 112px !important;
  overflow: hidden;
  border: 1px solid var(--ess-border) !important;
  border-radius: 20px !important;
  background: #fff;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.08);
}

.ess-merchant-copy {
  min-width: 0 !important;
}

.ess-merchant-copy ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  color: #6b7280;
  font-size: 13px;
  line-height: 1.35;
}

.ess-merchant-copy li {
  display: inline-flex;
  align-items: center;
}

.ess-merchant-copy i {
  color: #9ca3af;
  font-size: 15px;
}

.ess-merchant-title {
  margin: 4px 0 10px !important;
  color: var(--ess-text) !important;
  font-size: clamp(26px, 2.2vw, 34px);
  line-height: 1.08;
  font-weight: 900 !important;
  letter-spacing: 0;
}

.ess-merchant-copy component-merchant-services,
.ess-merchant-copy components-location-estimation {
  display: block;
  margin-top: 10px;
}

.ess-merchant-header-image,
.ess-merchant-media-card .el-image,
.ess-merchant-media-card .el-image__inner {
  width: 100% !important;
  height: 100% !important;
  min-height: 250px;
  max-height: none !important;
  object-fit: cover !important;
}

.ess-merchant-media-card .fav-wrap {
  top: 14px;
  right: 14px;
}

.ess-mobile-merchant-summary {
  margin-top: -10px;
  padding: 18px 16px 16px !important;
  border-bottom: 1px solid var(--ess-border);
  background: #fff;
}

.ess-mobile-merchant-summary h5 {
  color: var(--ess-text);
  font-size: 22px;
  line-height: 1.16;
  font-weight: 900;
}

.ess-mobile-merchant-meta {
  margin-top: 8px;
  color: #6b7280 !important;
}

.ess-mobile-merchant-meta i {
  color: var(--ess-orange);
}

.ess-menu-left {
  padding-right: 12px !important;
}

.ess-menu-left .sticky-sidebar {
  top: 94px !important;
  padding: 16px;
  border: 1px solid var(--ess-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 12px 30px rgba(17, 24, 39, 0.07);
}

.ess-menu-sidebar-title {
  margin-bottom: 12px;
  color: var(--ess-text);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 900;
}

.ess-menu-category-list {
  gap: 6px;
}

.ess-menu-category-list a,
.ess-menu-category-list .nav-link,
.category-carousel a,
.category-carousel .nav-link {
  min-height: 38px;
  padding: 9px 12px !important;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #667085 !important;
  font-size: 13px;
  line-height: 1.15;
  font-weight: 750;
  text-decoration: none !important;
}

.ess-menu-category-list a:hover,
.ess-menu-category-list .nav-link:hover,
.ess-menu-category-list .active > a,
.ess-menu-category-list a.active,
.category-carousel a:hover,
.category-carousel a.active,
.category-carousel .active > a {
  border-color: rgba(245, 130, 32, 0.22);
  background: #fff7ef;
  color: var(--ess-orange) !important;
}

.ess-menu-center {
  padding-left: 18px;
  padding-right: 18px;
}

.ess-menu-search-wrap {
  margin-bottom: 26px !important;
}

.ess-menu-search-wrap input,
.ess-menu-search-wrap .form-control,
.ess-menu-search-wrap .el-input__inner {
  min-height: 50px !important;
  border-color: rgba(17, 24, 39, 0.09) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.05) !important;
}

.ess-menu-category-section,
.ess-menu-section-noimage,
.ess-menu-category-two-column {
  margin-bottom: 42px;
  scroll-margin-top: 112px;
}

.ess-menu-category-title,
.ess-menu-section-title {
  margin: 0 0 7px !important;
  color: var(--ess-text) !important;
  font-size: clamp(24px, 2.2vw, 30px);
  line-height: 1.1;
  font-weight: 900 !important;
  letter-spacing: 0;
}

.ess-menu-category-description,
.ess-menu-section-description {
  max-width: 720px;
  margin-bottom: 16px;
  color: #6b7280 !important;
  font-size: 14px;
  line-height: 1.55;
}

.ess-menu-item-card,
.ess-menu-card-noimage {
  margin-bottom: 16px !important;
  border-radius: var(--ess-card-radius, 16px) !important;
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.065) !important;
}

.ess-menu-item-card:hover,
.ess-menu-card-noimage:hover {
  transform: translateY(-1px);
  box-shadow: 0 15px 34px rgba(17, 24, 39, 0.095) !important;
}

.ess-menu-cart {
  padding-left: 12px !important;
}

.ess-menu-cart .sticky-cart,
.ess-menu-cart .ess-cart-panel {
  position: sticky;
  top: 94px;
}

.ess-menu-cart .ess-cart-panel {
  border-radius: var(--ess-card-radius, 16px) !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.08) !important;
}

.ess-floating-cart {
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
}

.ess-floating-cart-button {
  min-height: 56px !important;
  border-radius: 18px !important;
}

.ess-floating-cart-button p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 12px;
}

.ess-floating-cart-button h5 {
  max-width: calc(100% - 44px);
  overflow: hidden;
  color: #fff;
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 991.98px) {
  .ess-restaurant-detail-shell,
  .ess-menu-categorytop-section {
    padding: 22px 0 58px;
  }

  .ess-menu-left {
    padding-right: 12px !important;
  }

  .ess-menu-center {
    padding-left: 12px;
    padding-right: 12px;
  }

  .ess-menu-left .sticky-sidebar {
    top: auto !important;
  }

  .ess-menu-category-section,
  .ess-menu-section-noimage,
  .ess-menu-category-two-column {
    margin-bottom: 34px;
    scroll-margin-top: 86px;
  }
}

@media (max-width: 767.98px) {
  .ess-mobile-merchant-hero {
    min-height: 170px;
    overflow: hidden;
    border-radius: 0 0 24px 24px !important;
    background: linear-gradient(135deg, #fff7ef 0%, #f5fbf5 100%);
    box-shadow: 0 12px 30px rgba(17, 24, 39, 0.08);
  }

  .ess-mobile-merchant-summary {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .ess-mobile-service-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ess-restaurant-detail-shell > .container,
  .ess-menu-categorytop-section > .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .ess-menu-left {
    margin-bottom: 14px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .ess-menu-left .d-block.d-lg-none,
  .ess-menu-categorytop #vue-merchant-category {
    margin-left: -14px;
    margin-right: -14px;
    padding: 10px 14px;
    overflow-x: auto;
    border-top: 1px solid var(--ess-border);
    border-bottom: 1px solid var(--ess-border);
    background: rgba(255, 255, 255, 0.96);
    position: sticky;
    top: 0;
    z-index: 8;
  }

  .ess-menu-search-wrap {
    margin-bottom: 20px !important;
  }

  .ess-menu-category-title,
  .ess-menu-section-title {
    font-size: 23px;
  }

  .ess-menu-category-description,
  .ess-menu-section-description {
    margin-bottom: 13px;
    font-size: 13.5px;
  }

  .ess-menu-item-card,
  .ess-menu-card-noimage {
    margin-bottom: 12px !important;
  }

  .ess-menu-item-card:hover,
  .ess-menu-card-noimage:hover {
    transform: none;
  }
}

@media (max-width: 430px) {
  .ess-restaurant-detail-shell,
  .ess-menu-categorytop-section {
    padding-top: 18px;
  }

  .ess-menu-center {
    padding-left: 0;
    padding-right: 0;
  }

  .ess-menu-category-section,
  .ess-menu-section-noimage,
  .ess-menu-category-two-column {
    margin-bottom: 30px;
  }

  .ess-menu-search-wrap input,
  .ess-menu-search-wrap .form-control,
  .ess-menu-search-wrap .el-input__inner {
    min-height: 46px !important;
  }

  .ess-floating-cart {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
  }
}

/* Search / Restaurant List V3 final refinement
   Results-page chrome only. Reuses final EssRestaurantCard and EssFoodCard. */
.ess-feed-page,
.ess-search-page {
  overflow-x: clip;
  background: linear-gradient(180deg, #fffaf5 0%, #fff 220px, #fafbfc 100%);
}

.ess-feed-page {
  max-width: none !important;
  padding: 22px clamp(14px, 3vw, 28px) 72px !important;
}

.ess-feed-layout {
  max-width: 1180px;
  margin-left: auto !important;
  margin-right: auto !important;
  align-items: flex-start;
}

.ess-feed-filter-column {
  padding-right: 18px;
}

.ess-feed-results-column {
  min-width: 0;
  padding-left: 18px;
}

.ess-feed-results-head {
  min-height: 50px;
  padding: 0 2px;
}

.ess-feed-results-head h4,
.ess-feed-mobile-title h4 {
  color: var(--ess-text);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.12;
  font-weight: 900;
  letter-spacing: 0;
}

.ess-feed-results-head a,
.ess-feed-results-head p {
  color: var(--ess-muted) !important;
  font-size: 13px;
  font-weight: 750;
}

.ess-filter-card,
.ess-filter-card-legacy {
  overflow: hidden;
  padding: 16px;
  border: 1px solid var(--ess-border) !important;
  border-radius: var(--ess-card-radius, 16px) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.075) !important;
}

.ess-filter-row {
  padding: 15px 0 !important;
  border-bottom: 1px solid rgba(17, 24, 39, 0.07) !important;
}

.ess-filter-row:first-child {
  padding-top: 2px !important;
}

.ess-filter-row:last-child {
  border-bottom: 0 !important;
  padding-bottom: 2px !important;
}

.ess-filter-row h5 {
  margin: 0;
}

.ess-filter-row h5 a {
  color: var(--ess-text) !important;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 850;
  text-decoration: none !important;
}

.ess-filter-row h5 a:after {
  color: #9ca3af;
}

.ess-filter-card .custom-control,
.ess-filter-card-legacy .custom-control {
  min-height: 32px;
  display: flex;
  align-items: center;
}

.ess-filter-card .custom-control-label,
.ess-filter-card-legacy .custom-control-label {
  color: #5f6673 !important;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 700;
}

.ess-filter-card .custom-control-label:before,
.ess-filter-card-legacy .custom-control-label:before {
  border-color: rgba(17, 24, 39, 0.18);
  box-shadow: none !important;
}

.ess-filter-card .custom-control-input:checked ~ .custom-control-label,
.ess-filter-card-legacy .custom-control-input:checked ~ .custom-control-label {
  color: var(--ess-text) !important;
  font-weight: 850;
}

.ess-filter-card .custom-control-input:checked ~ .custom-control-label:before,
.ess-filter-card-legacy .custom-control-input:checked ~ .custom-control-label:before {
  border-color: var(--ess-orange) !important;
  background-color: var(--ess-orange) !important;
}

.ess-filter-card .btn-group-toggle,
.ess-filter-card .input-group-small,
.ess-filter-card-legacy .btn-group-toggle,
.ess-filter-card-legacy .input-group-small {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ess-filter-card .btn-group-toggle .btn,
.ess-filter-card .input-group-small .btn,
.ess-filter-card-legacy .btn-group-toggle .btn,
.ess-filter-card-legacy .input-group-small .btn {
  min-height: 34px;
  padding: 8px 12px !important;
  border: 1px solid rgba(17, 24, 39, 0.1) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #5f6673 !important;
  font-size: 13px;
  line-height: 1;
  font-weight: 800;
  box-shadow: none !important;
}

.ess-filter-card .btn-group-toggle .btn.active,
.ess-filter-card .input-group-small .btn.active,
.ess-filter-card-legacy .btn-group-toggle .btn.active,
.ess-filter-card-legacy .input-group-small .btn.active {
  border-color: rgba(245, 130, 32, 0.28) !important;
  background: #fff7ef !important;
  color: var(--ess-orange) !important;
}

.ess-filter-chip-col {
  margin-bottom: 10px !important;
  padding-left: 0;
}

.ess-filter-card .more-cuisine,
.ess-filter-card .link,
.ess-filter-card-legacy .more-cuisine,
.ess-filter-card-legacy .link {
  padding-left: 0 !important;
  color: var(--ess-orange) !important;
  font-size: 13px;
  font-weight: 850;
}

.ess-filter-card .custom-range,
.ess-filter-card-legacy .custom-range {
  accent-color: var(--ess-orange);
}

.restaurants-filter {
  min-height: 44px !important;
  border-radius: var(--ess-btn-radius, 14px) !important;
}

.ess-feed-mobile-search-card {
  padding: 8px;
  border: 1px solid var(--ess-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.07);
}

.ess-feed-mobile-search input {
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #f7f8fa !important;
  color: var(--ess-text) !important;
}

.ess-feed-mobile-search .filter_wrap .btn {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 14px !important;
  background-color: #fff7ef !important;
}

.ess-feed-results-column > .mb-4 {
  margin-bottom: 22px !important;
}

.ess-feed-results-column .swiperBanner,
.ess-feed-results-column .swiperBanner .el-image,
.ess-feed-results-column .swiperBanner img {
  overflow: hidden;
  border-radius: 20px;
}

.ess-feed-card-grid,
.ess-restaurant-card-grid,
.ess-search-restaurant-grid {
  margin-left: -9px !important;
  margin-right: -9px !important;
}

.ess-feed-card-col,
.ess-restaurant-card-col {
  padding: 9px !important;
  margin-bottom: 4px !important;
}

.ess-feed-load-more {
  margin-top: 34px !important;
}

.ess-feed-load-more .btn {
  min-width: 190px;
}

.ess-empty-state,
.ess-feed-empty,
.ess-empty-state-restaurants {
  padding: 28px 0;
}

.ess-empty-card {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px;
  border: 1px solid var(--ess-border);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
}

.ess-empty-icon {
  background: #fff7ef;
  color: var(--ess-orange);
  box-shadow: none;
}

.ess-empty-content h3,
.ess-empty-content h4 {
  color: var(--ess-text);
  font-weight: 900;
}

.ess-empty-content p {
  color: var(--ess-muted) !important;
  line-height: 1.55;
}

.ess-search-page {
  min-height: 70vh;
}

.ess-search-page .search-banner {
  padding: 46px 0 34px;
  background:
    radial-gradient(circle at 82% 0%, rgba(73, 169, 66, 0.11), transparent 32%),
    linear-gradient(135deg, #fffaf5 0%, #fff 64%, #f5fbf5 100%);
}

.ess-search-page .sub-header {
  height: auto !important;
  min-height: 190px;
}

.ess-search-page .sub-header > div {
  width: min(720px, 100%);
}

.ess-search-page h2 {
  color: var(--ess-text);
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.04;
  font-weight: 900;
  letter-spacing: 0;
}

.ess-search-page .container.pb-5.pt-4 {
  max-width: 1180px;
  padding-top: 34px !important;
}

.ess-search-page .demo-tabs {
  border: 1px solid var(--ess-border);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 24, 39, 0.06);
}

.ess-search-page .demo-tabs > .el-tabs__header {
  margin: 0;
  padding: 0 18px;
}

.ess-search-page .el-tabs__content {
  padding: 22px 18px 18px;
}

.ess-search-page .el-tab-pane h3 {
  margin-bottom: 16px;
  color: var(--ess-text);
  font-size: 24px;
  line-height: 1.14;
  font-weight: 900;
}

.ess-search-page .el-tab-pane > template + template,
.ess-search-page .el-tab-pane .d-flex[style*="min-height:200px"] {
  border-radius: 18px;
  background: #fff;
}

.section-fast-delivery,
.section-fast-delivery-mobile {
  overflow: hidden;
  border-radius: 24px;
  background: linear-gradient(135deg, #fffaf6 0%, #fff 58%, #f6fbf5 100%);
}

@media (max-width: 991.98px) {
  .ess-feed-page {
    padding: 14px 14px 56px !important;
  }

  .ess-feed-layout {
    margin-top: 16px !important;
  }

  .ess-feed-results-column {
    padding-left: 0;
    padding-right: 0;
  }

  .ess-feed-mobile-title {
    margin-bottom: 14px;
  }

  .ess-feed-mobile-title h4 {
    font-size: 24px;
  }

  .ess-feed-card-grid,
  .ess-restaurant-card-grid,
  .ess-search-restaurant-grid {
    margin-left: -7px !important;
    margin-right: -7px !important;
  }

  .ess-feed-card-col,
  .ess-restaurant-card-col {
    padding: 7px !important;
  }
}

@media (max-width: 767.98px) {
  .ess-search-page .search-banner {
    padding: 30px 0 24px;
  }

  .ess-search-page .sub-header {
    min-height: 150px;
    padding-left: 14px;
    padding-right: 14px;
  }

  .ess-search-page h2 {
    font-size: 34px;
  }

  .ess-search-page .container.pb-5.pt-4 {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 24px !important;
  }

  .ess-search-page .demo-tabs {
    border-radius: 18px;
  }

  .ess-search-page .demo-tabs > .el-tabs__header {
    padding: 0 12px;
  }

  .ess-search-page .el-tabs__content {
    padding: 18px 12px 14px;
  }

  .ess-empty-card {
    padding: 24px 18px;
    border-radius: 20px;
  }

  .ess-feed-load-more {
    margin-top: 24px !important;
  }
}

@media (max-width: 430px) {
  .ess-feed-page {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .ess-feed-card-grid,
  .ess-restaurant-card-grid,
  .ess-search-restaurant-grid {
    margin-left: -6px !important;
    margin-right: -6px !important;
  }

  .ess-feed-card-col,
  .ess-restaurant-card-col {
    padding: 6px !important;
  }
}

/* Checkout V3 final refinement
   Theme-only visual layer: no checkout, payment, Vue, form, ID or field changes. */
.ess-checkout-page {
  overflow-x: hidden;
  padding: 34px 0 64px;
  background:
    linear-gradient(180deg, rgba(245, 130, 32, 0.045), rgba(248, 249, 250, 0) 260px),
    var(--ess-bg, #F8F9FA);
}

.ess-checkout-container {
  max-width: 1168px;
}

.ess-checkout-grid {
  align-items: flex-start;
}

.ess-checkout-content,
.ess-checkout-cart-column {
  padding-right: 10px !important;
  padding-left: 10px !important;
}

.ess-checkout-main-card,
.ess-checkout-cart-card {
  overflow: hidden;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 22px !important;
  background: var(--ess-white, #fff) !important;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07) !important;
}

.ess-checkout-main-card > .card-body,
.ess-checkout-cart-card > .card-body {
  padding: 24px !important;
}

.ess-checkout-main-card .row.mb-3 {
  margin-bottom: 18px !important;
}

.ess-checkout-main-card .section-title,
.ess-checkout-main-card h4,
.ess-checkout-main-card h5,
.ess-checkout-cart-card h4,
.ess-checkout-cart-card h5 {
  margin-bottom: 12px;
  color: var(--ess-text, #1A2233) !important;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.22;
}

.ess-checkout-main-card .section-title {
  font-size: 20px;
}

.ess-checkout-main-card p,
.ess-checkout-main-card small,
.ess-checkout-cart-card p,
.ess-checkout-cart-card small {
  color: var(--ess-muted, #666666);
  line-height: 1.55;
}

.ess-checkout-page label,
.ess-checkout-page .form-label {
  margin-bottom: 7px;
  color: var(--ess-text, #1A2233);
  font-size: 14px;
  font-weight: 700;
}

.ess-checkout-page .form-control,
.ess-checkout-page input.form-control,
.ess-checkout-page textarea.form-control,
.ess-checkout-page select.form-control,
.ess-checkout-page .el-input__inner,
.ess-checkout-page .el-textarea__inner {
  min-height: 48px;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--ess-text, #1A2233) !important;
  box-shadow: none !important;
  font-size: 15px;
  transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}

.ess-checkout-page textarea.form-control,
.ess-checkout-page .el-textarea__inner {
  min-height: 96px;
  padding-top: 12px;
  line-height: 1.5;
}

.ess-checkout-page .form-control:focus,
.ess-checkout-page input.form-control:focus,
.ess-checkout-page textarea.form-control:focus,
.ess-checkout-page select.form-control:focus,
.ess-checkout-page .el-input__inner:focus,
.ess-checkout-page .el-textarea__inner:focus,
.ess-checkout-page .el-select .el-input.is-focus .el-input__inner {
  border-color: rgba(245, 130, 32, 0.68) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.12) !important;
  outline: none !important;
}

.ess-checkout-page .input-group {
  align-items: stretch;
}

.ess-checkout-page .input-group .btn,
.ess-checkout-page .input-group .btn-green {
  min-height: 48px;
  border-radius: 14px !important;
}

.ess-checkout-page .alert {
  border: 1px solid rgba(245, 130, 32, 0.2) !important;
  border-radius: 16px !important;
  background: rgba(245, 130, 32, 0.08) !important;
  color: #7A4A16 !important;
}

.ess-checkout-page .text-danger,
.ess-checkout-page .error,
.ess-checkout-page .invalid-feedback {
  color: #C2412D !important;
  font-size: 13px;
  font-weight: 650;
}

.ess-checkout-page .badge.badge-dark.rounded-pill {
  min-width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px !important;
  background: rgba(245, 130, 32, 0.12) !important;
  color: #D96513 !important;
  font-size: 13px;
  font-weight: 800;
}

.ess-checkout-page .chevron-section,
.ess-checkout-page .transaction-section,
.ess-checkout-page .promo-section {
  margin-bottom: 12px !important;
  padding: 16px 18px !important;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(17, 24, 39, 0.045) !important;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease, background-color 150ms ease;
}

.ess-checkout-page .chevron-section:hover {
  border-color: rgba(245, 130, 32, 0.24) !important;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.07) !important;
  transform: translateY(-1px);
}

.ess-checkout-page .chevron-section.selected,
.ess-checkout-page .chevron-section.active,
.ess-checkout-page .transaction-section.selected,
.ess-checkout-page .payment-option.selected {
  border-color: rgba(73, 169, 66, 0.42) !important;
  background: linear-gradient(180deg, rgba(73, 169, 66, 0.075), #fff 80%) !important;
  box-shadow: 0 12px 30px rgba(73, 169, 66, 0.11) !important;
}

.ess-checkout-page .payment-logo-wrap,
.ess-checkout-page .payment-logo {
  width: 46px;
  height: 46px;
  min-width: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 14px;
  background: var(--ess-bg, #F8F9FA);
}

.ess-checkout-page .payment-logo-wrap img,
.ess-checkout-page .payment-logo img {
  max-width: 72%;
  max-height: 72%;
  object-fit: contain;
}

.ess-checkout-page .btn-green,
.ess-checkout-page .btn-primary,
.ess-checkout-page .el-button--success {
  min-height: 46px;
  padding-right: 20px !important;
  padding-left: 20px !important;
  border-color: var(--ess-orange, #F58220) !important;
  border-radius: 14px !important;
  background: var(--ess-orange, #F58220) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.2) !important;
  font-weight: 800 !important;
}

.ess-checkout-page .btn-green:hover,
.ess-checkout-page .btn-primary:hover,
.ess-checkout-page .el-button--success:hover {
  border-color: #E26F12 !important;
  background: #E26F12 !important;
  box-shadow: 0 12px 26px rgba(245, 130, 32, 0.25) !important;
}

.ess-checkout-page .btn-light,
.ess-checkout-page .btn-white,
.ess-checkout-page .el-button {
  min-height: 44px;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--ess-text, #1A2233) !important;
  font-weight: 750;
}

.ess-checkout-page .btn-group-toggle,
.ess-checkout-page .input-group-small {
  gap: 8px;
  flex-wrap: wrap;
}

.ess-checkout-page .btn-group-toggle .btn,
.ess-checkout-page .input-group-small .btn {
  min-height: 42px;
  border-radius: 999px !important;
}

.ess-checkout-page .btn-group-toggle .btn.active {
  border-color: rgba(73, 169, 66, 0.45) !important;
  background: rgba(73, 169, 66, 0.1) !important;
  color: var(--ess-green, #49A942) !important;
}

.ess-checkout-cart {
  position: sticky;
  top: 96px;
}

.ess-checkout-cart-card {
  box-shadow: 0 16px 38px rgba(17, 24, 39, 0.08) !important;
}

.ess-checkout-cart-card .card-body {
  padding: 22px !important;
}

.ess-checkout-cart-card .section-cart,
.ess-checkout-cart-card .cart-body,
.ess-checkout-cart-card .cart-summary {
  border-radius: 18px;
}

.ess-checkout-cart-card .cart-items,
.ess-checkout-cart-card .cart-row {
  border-color: var(--ess-border, #ECECEC) !important;
}

.ess-checkout-cart-card .checkout-total,
.ess-checkout-cart-card .cart-total {
  color: var(--ess-text, #1A2233);
  font-weight: 850;
}

@media (max-width: 991.98px) {
  .ess-checkout-page {
    padding: 24px 0 48px;
  }

  .ess-checkout-container {
    max-width: 760px;
  }

  .ess-checkout-cart {
    position: relative !important;
    top: auto !important;
  }
}

@media (max-width: 767.98px) {
  .ess-checkout-page {
    padding: 16px 0 36px;
  }

  .ess-checkout-container {
    max-width: 100%;
    padding-right: 12px;
    padding-left: 12px;
    overflow-x: hidden;
  }

  .ess-checkout-content,
  .ess-checkout-cart-column {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .ess-checkout-main-card,
  .ess-checkout-cart-card {
    border-radius: 18px !important;
  }

  .ess-checkout-main-card > .card-body,
  .ess-checkout-cart-card > .card-body,
  .ess-checkout-cart-card .card-body {
    padding: 16px !important;
  }

  .ess-checkout-main-card .section-title {
    font-size: 18px;
  }

  .ess-checkout-page .chevron-section,
  .ess-checkout-page .transaction-section,
  .ess-checkout-page .promo-section {
    padding: 14px !important;
    border-radius: 16px !important;
  }

  .ess-checkout-page .form-control,
  .ess-checkout-page input.form-control,
  .ess-checkout-page textarea.form-control,
  .ess-checkout-page select.form-control,
  .ess-checkout-page .el-input__inner,
  .ess-checkout-page .el-textarea__inner {
    min-height: 46px;
    font-size: 16px;
  }

  .ess-checkout-page .btn-green,
  .ess-checkout-page .btn-primary,
  .ess-checkout-page .el-button--success {
    width: 100%;
    justify-content: center;
  }

  .ess-checkout-page .input-group .btn,
  .ess-checkout-page .input-group .btn-green {
    width: auto;
  }
}

/* Account/Login/Register V3 final refinement
   Theme-only visual layer: no login, register, password, account, session, Vue, API,
   form name, ID, hidden input or validation changes. */
.ess-auth-page,
.container > .login-container {
  overflow-x: hidden;
}

.ess-auth-page {
  padding-top: 8px;
  padding-bottom: 48px;
}

.login-container {
  width: min(100%, 540px) !important;
  max-width: 540px;
}

.ess-auth-shell,
.container > .login-container {
  border-radius: 0;
}

.ess-auth-card,
.container > .login-container > div[id^="vue-"],
.container > .login-container > form {
  position: relative;
  width: 100%;
  padding: 30px !important;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 16px 38px rgba(17, 24, 39, 0.08);
}

.ess-auth-card {
  box-shadow: 0 16px 38px rgba(17, 24, 39, 0.08) !important;
}

.container > .login-container > div[id^="vue-"] h5,
.container > .login-container > form h5,
.ess-auth-header h5 {
  color: var(--ess-text, #1A2233) !important;
  font-size: 30px;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.15;
}

.container > .login-container > div[id^="vue-"] p,
.container > .login-container > form p,
.ess-auth-header p {
  color: var(--ess-muted, #666666);
  line-height: 1.6;
}

.ess-auth-kicker {
  border: 1px solid rgba(73, 169, 66, 0.16);
  background: rgba(73, 169, 66, 0.1);
  color: var(--ess-green, #49A942);
  font-weight: 800;
}

.ess-auth-card .form-label-group,
.container > .login-container .form-label-group,
#vue-my-order .form-label-group,
#vue-my-address .form-label-group,
#vue-saved-store .form-label-group,
#vue-update-password .form-label-group,
#vue-manage-account .form-label-group,
#vue-account-information .form-label-group,
#vue-account-verification .form-label-group {
  margin-bottom: 16px;
}

.ess-auth-card label,
.container > .login-container label,
#vue-my-order label,
#vue-my-address label,
#vue-saved-store label,
#vue-update-password label,
#vue-manage-account label,
#vue-account-information label,
#vue-account-verification label {
  color: var(--ess-text, #1A2233);
  font-weight: 720;
}

.ess-auth-card .form-control,
.ess-auth-card .form-control-text,
.ess-auth-card input,
.container > .login-container .form-control,
.container > .login-container .form-control-text,
.container > .login-container input,
.container > .login-container textarea,
#vue-my-order .form-control,
#vue-my-address .form-control,
#vue-saved-store .form-control,
#vue-update-password .form-control,
#vue-manage-account .form-control,
#vue-account-information .form-control,
#vue-account-verification .form-control,
#vue-my-order .el-input__inner,
#vue-my-address .el-input__inner,
#vue-saved-store .el-input__inner,
#vue-update-password .el-input__inner,
#vue-manage-account .el-input__inner,
#vue-account-information .el-input__inner,
#vue-account-verification .el-input__inner {
  min-height: 48px;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--ess-text, #1A2233) !important;
  box-shadow: none !important;
  font-size: 15px;
  transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}

.ess-auth-card textarea,
.container > .login-container textarea,
#vue-my-address textarea,
#vue-manage-account textarea {
  min-height: 98px;
  padding-top: 12px;
}

.ess-auth-card .form-control:focus,
.ess-auth-card input:focus,
.container > .login-container .form-control:focus,
.container > .login-container input:focus,
.container > .login-container textarea:focus,
#vue-my-order .form-control:focus,
#vue-my-address .form-control:focus,
#vue-saved-store .form-control:focus,
#vue-update-password .form-control:focus,
#vue-manage-account .form-control:focus,
#vue-account-information .form-control:focus,
#vue-account-verification .form-control:focus,
#vue-my-order .el-input__inner:focus,
#vue-my-address .el-input__inner:focus,
#vue-saved-store .el-input__inner:focus,
#vue-update-password .el-input__inner:focus,
#vue-manage-account .el-input__inner:focus,
#vue-account-information .el-input__inner:focus,
#vue-account-verification .el-input__inner:focus {
  border-color: rgba(245, 130, 32, 0.68) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.12) !important;
  outline: none !important;
}

.change_field_password > a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--ess-muted, #666666) !important;
  transition: background-color 150ms ease, color 150ms ease;
}

.change_field_password > a:hover {
  background: rgba(245, 130, 32, 0.1);
  color: var(--ess-orange, #F58220) !important;
}

.ess-auth-card .alert,
.container > .login-container .alert,
#vue-my-order .alert,
#vue-my-address .alert,
#vue-saved-store .alert,
#vue-update-password .alert,
#vue-manage-account .alert,
#vue-account-information .alert,
#vue-account-verification .alert {
  border: 1px solid rgba(245, 130, 32, 0.2) !important;
  border-radius: 16px !important;
  background: rgba(245, 130, 32, 0.08) !important;
  color: #7A4A16 !important;
}

.ess-auth-card .alert-success,
.container > .login-container .alert-success,
#vue-my-order .alert-success,
#vue-my-address .alert-success,
#vue-saved-store .alert-success,
#vue-update-password .alert-success,
#vue-manage-account .alert-success {
  border-color: rgba(73, 169, 66, 0.24) !important;
  background: rgba(73, 169, 66, 0.1) !important;
  color: #2F7D2C !important;
}

.ess-auth-card .btn-green,
.container > .login-container .btn-green,
#vue-my-order .btn-green,
#vue-my-address .btn-green,
#vue-saved-store .btn-green,
#vue-update-password .btn-green,
#vue-manage-account .btn-green,
#vue-account-information .btn-green,
#vue-account-verification .btn-green {
  min-height: 46px;
  border-color: var(--ess-orange, #F58220) !important;
  border-radius: 14px !important;
  background: var(--ess-orange, #F58220) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.2) !important;
  font-weight: 800 !important;
}

.ess-auth-card .btn-green:hover,
.container > .login-container .btn-green:hover,
#vue-my-order .btn-green:hover,
#vue-my-address .btn-green:hover,
#vue-saved-store .btn-green:hover,
#vue-update-password .btn-green:hover,
#vue-manage-account .btn-green:hover {
  border-color: #E26F12 !important;
  background: #E26F12 !important;
  box-shadow: 0 12px 26px rgba(245, 130, 32, 0.25) !important;
}

.ess-auth-card .btn-white,
.container > .login-container .btn-white,
.ess-auth-card .btn-light,
.container > .login-container .btn-light,
#vue-my-order .btn.normal,
#vue-my-address .btn.normal,
#vue-saved-store .btn.normal,
#vue-update-password .btn.normal,
#vue-manage-account .btn.normal {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--ess-text, #1A2233) !important;
  font-weight: 780 !important;
}

.ess-auth-switch,
.ess-auth-guest,
.ess-auth-social {
  border-color: var(--ess-border, #ECECEC);
}

.ess-auth-switch a,
.container > .login-container a,
#vue-my-order a,
#vue-my-address a,
#vue-saved-store a,
#vue-update-password a,
#vue-manage-account a {
  color: var(--ess-orange, #F58220);
  font-weight: 750;
}

.ess-auth-trust span {
  border: 1px solid rgba(73, 169, 66, 0.12);
  background: rgba(73, 169, 66, 0.075);
  color: #477246;
}

.custom-control-label {
  color: var(--ess-muted, #666666) !important;
  font-size: 14px;
}

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: var(--ess-green, #49A942) !important;
  background-color: var(--ess-green, #49A942) !important;
}

#vue-profile-menu,
#upload-profile,
#vue-my-order,
#vue-my-address,
#vue-saved-store,
#vue-update-password,
#vue-manage-account,
#vue-account-information,
#vue-account-verification {
  color: var(--ess-text, #1A2233);
}

#upload-profile {
  padding: 18px;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 24, 39, 0.06);
}

#vue-my-order .card,
#vue-my-address .card,
#vue-saved-store .card,
#vue-update-password .card,
#vue-manage-account .card,
#vue-account-information .card,
#vue-account-verification .card {
  overflow: hidden;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(17, 24, 39, 0.06) !important;
}

#vue-my-order .grey-bg,
#vue-my-address .grey-bg,
#vue-saved-store .grey-bg {
  border: 1px solid rgba(245, 130, 32, 0.1);
  border-radius: 18px !important;
  background:
    linear-gradient(135deg, rgba(245, 130, 32, 0.075), rgba(73, 169, 66, 0.055)),
    #fff !important;
}

#vue-my-order h5,
#vue-my-address h5,
#vue-saved-store h5,
#vue-update-password h5,
#vue-manage-account h5,
#vue-account-information h5,
#vue-account-verification h5 {
  color: var(--ess-text, #1A2233);
  font-weight: 820;
  letter-spacing: 0;
}

#vue-my-order p,
#vue-my-address p,
#vue-saved-store p,
#vue-update-password p,
#vue-manage-account p,
#vue-account-information p,
#vue-account-verification p {
  color: var(--ess-muted, #666666);
  line-height: 1.55;
}

#vue-my-order .kmrs-row,
#vue-my-address .address-slot,
#vue-saved-store .list-items {
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 18px !important;
  background: #fff !important;
  box-shadow: 0 8px 22px rgba(17, 24, 39, 0.045) !important;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

#vue-my-order .kmrs-row:hover,
#vue-my-address .address-slot:hover,
#vue-saved-store .list-items:hover {
  border-color: rgba(245, 130, 32, 0.24) !important;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.07) !important;
  transform: translateY(-1px);
}

#vue-my-order .badge,
#vue-my-address .badge,
#vue-saved-store .badge {
  border-radius: 999px;
  padding: 6px 9px;
  font-size: 12px;
  font-weight: 800;
}

#vue-my-order .dropdown-actions,
#vue-my-address .dropdown-actions,
#vue-saved-store .dropdown-actions {
  overflow: hidden;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 16px;
  box-shadow: 0 18px 40px rgba(17, 24, 39, 0.12);
}

#vue-my-order .dropdown-item,
#vue-my-address .dropdown-item,
#vue-saved-store .dropdown-item {
  padding: 10px 14px;
  color: var(--ess-text, #1A2233);
  font-weight: 700;
}

#vue-my-order .dropdown-item:hover,
#vue-my-address .dropdown-item:hover,
#vue-saved-store .dropdown-item:hover {
  background: rgba(245, 130, 32, 0.08);
  color: var(--ess-orange, #F58220);
}

#vue-my-order .order-search-wrap .search-geocomplete {
  min-width: min(100%, 360px);
}

#vue-my-order .search-geocomplete .form-control {
  padding-left: 42px !important;
}

#vue-saved-store .list-items .el-image,
#vue-saved-store .list-items img {
  border-radius: 16px;
  background: var(--ess-bg, #F8F9FA);
}

@media (max-width: 991.98px) {
  .ess-auth-page {
    padding-bottom: 36px;
  }

  #vue-my-order .kmrs-row {
    display: block;
    padding: 16px !important;
  }

  #vue-my-order .kmrs-row > .col {
    width: 100%;
    max-width: 100%;
    padding-left: 0 !important;
    margin-bottom: 12px;
  }
}

@media (max-width: 767.98px) {
  .ess-auth-page,
  .container > .login-container {
    padding-right: 12px;
    padding-left: 12px;
  }

  .login-container {
    max-width: 100% !important;
    padding-top: 24px !important;
    padding-bottom: 32px !important;
  }

  .ess-auth-card,
  .container > .login-container > div[id^="vue-"],
  .container > .login-container > form {
    padding: 20px !important;
    border-radius: 18px;
  }

  .container > .login-container > div[id^="vue-"] h5,
  .container > .login-container > form h5,
  .ess-auth-header h5 {
    font-size: 27px;
  }

  .ess-auth-card .form-control,
  .ess-auth-card .form-control-text,
  .ess-auth-card input,
  .container > .login-container .form-control,
  .container > .login-container .form-control-text,
  .container > .login-container input,
  .container > .login-container textarea,
  #vue-my-order .form-control,
  #vue-my-address .form-control,
  #vue-saved-store .form-control,
  #vue-update-password .form-control,
  #vue-manage-account .form-control {
    min-height: 46px;
    font-size: 16px;
  }

  .ess-auth-card .btn-green,
  .container > .login-container .btn-green,
  #vue-my-order .btn-green,
  #vue-my-address .btn-green,
  #vue-saved-store .btn-green,
  #vue-update-password .btn-green,
  #vue-manage-account .btn-green {
    width: 100%;
    justify-content: center;
  }

  .ess-auth-trust {
    grid-template-columns: 1fr;
  }

  #vue-my-order .card,
  #vue-my-address .card,
  #vue-saved-store .card,
  #vue-update-password .card,
  #vue-manage-account .card {
    border-radius: 18px !important;
  }

  #vue-my-address .d-flex.justify-content-between,
  #vue-saved-store .d-flex.justify-content-between {
    gap: 12px;
    align-items: flex-start !important;
    flex-direction: column;
  }
}

/* Footer, static pages and system states V3 final refinement
   Theme-only visual layer: no API, Vue, routing, core, checkout, payment,
   session, form name, ID, validation or submit changes. */
.ess-footer-v3 {
  overflow-x: hidden;
  margin-top: 56px;
  background: #171717 !important;
  color: rgba(255, 255, 255, 0.76);
}

.ess-footer-shell {
  max-width: 1180px !important;
  display: grid;
  grid-template-columns: minmax(250px, 0.9fr) minmax(0, 1.6fr);
  gap: 48px;
  padding: 58px 18px 26px;
}

.ess-footer-brand {
  min-width: 0;
}

.ess-footer-logo {
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
}

.ess-footer-logo img {
  max-width: 168px;
  height: auto;
  filter: none;
}

.ess-footer-brand p {
  max-width: 390px;
  margin: 18px 0 22px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 15px;
  line-height: 1.7;
}

.ess-footer-store-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ess-footer-store-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border-radius: 12px;
  transition: transform 150ms ease, opacity 150ms ease;
}

.ess-footer-store-links a:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

.ess-footer-store-links img {
  max-height: 42px;
  width: auto;
}

.ess-footer-social {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.ess-footer-social a {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: #fff !important;
  text-decoration: none !important;
  font-size: 15px;
  font-weight: 850;
  transition: border-color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

.ess-footer-social a:hover {
  border-color: rgba(245, 130, 32, 0.72);
  background: rgba(245, 130, 32, 0.16);
  transform: translateY(-1px);
}

.ess-footer-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px;
}

.ess-footer-links > div {
  min-width: 0;
}

.ess-footer-links h6 {
  margin-bottom: 14px;
  color: #fff;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0;
}

.ess-footer-links a {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 9px;
  color: rgba(255, 255, 255, 0.68) !important;
  font-size: 14px;
  line-height: 1.45;
  text-decoration: none !important;
  transition: color 150ms ease, transform 150ms ease;
}

.ess-footer-links a:hover {
  color: #fff !important;
  transform: translateX(2px);
}

.ess-footer-bottom {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.56);
  font-size: 13px;
}

.page-content > .container.mt-5.mb-5 {
  max-width: 1120px;
  padding-top: 36px;
  padding-bottom: 44px;
}

.page-content > .container.mt-5.mb-5 > .row {
  justify-content: center;
}

.page-content > .container.mt-5.mb-5 > .row > .col-md-8.border-right {
  max-width: 820px;
  flex: 0 0 820px;
  padding: 34px !important;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
}

.page-content > .container.mt-5.mb-5 > .row > .col-md-4 {
  display: none;
}

.page-content > .container.mt-5.mb-5 h1,
.page-content > .container.mt-5.mb-5 h2,
.page-content > .container.mt-5.mb-5 h3,
.page-content > .container.mt-5.mb-5 h4,
.page-content > .container.mt-5.mb-5 h5 {
  color: var(--ess-text, #1A2233);
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1.22;
}

.page-content > .container.mt-5.mb-5 h3 {
  margin-bottom: 18px;
  font-size: 30px;
}

.page-content > .container.mt-5.mb-5 p,
.page-content > .container.mt-5.mb-5 li,
.page-content > .container.mt-5.mb-5 td,
.page-content > .container.mt-5.mb-5 div {
  line-height: 1.72;
}

.page-content > .container.mt-5.mb-5 p,
.page-content > .container.mt-5.mb-5 li {
  color: var(--ess-muted, #666666);
  font-size: 15px;
}

.page-content > .container.mt-5.mb-5 a {
  color: var(--ess-orange, #F58220);
  font-weight: 750;
}

.page-content > .container.mt-5.mb-5 .form-label-group {
  margin-bottom: 16px;
}

.page-content > .container.mt-5.mb-5 label {
  color: var(--ess-text, #1A2233);
  font-weight: 720;
}

.page-content > .container.mt-5.mb-5 .form-control,
.page-content > .container.mt-5.mb-5 .form-control-text,
.page-content > .container.mt-5.mb-5 input,
.page-content > .container.mt-5.mb-5 textarea,
.page-content > .container.mt-5.mb-5 select {
  min-height: 48px;
  border: 1px solid var(--ess-border, #ECECEC) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--ess-text, #1A2233) !important;
  box-shadow: none !important;
  font-size: 15px;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.page-content > .container.mt-5.mb-5 textarea {
  min-height: 132px;
  padding-top: 12px;
}

.page-content > .container.mt-5.mb-5 .form-control:focus,
.page-content > .container.mt-5.mb-5 input:focus,
.page-content > .container.mt-5.mb-5 textarea:focus,
.page-content > .container.mt-5.mb-5 select:focus {
  border-color: rgba(245, 130, 32, 0.68) !important;
  box-shadow: 0 0 0 4px rgba(245, 130, 32, 0.12) !important;
  outline: none !important;
}

.page-content > .container.mt-5.mb-5 .alert,
.ess-system-page .alert,
.pagenotfound-section + .text-center .alert {
  border: 1px solid rgba(245, 130, 32, 0.2) !important;
  border-radius: 16px !important;
  background: rgba(245, 130, 32, 0.08) !important;
  color: #7A4A16 !important;
}

.page-content > .container.mt-5.mb-5 .alert-success,
.ess-system-page .alert-success {
  border-color: rgba(73, 169, 66, 0.24) !important;
  background: rgba(73, 169, 66, 0.1) !important;
  color: #2F7D2C !important;
}

.page-content > .container.mt-5.mb-5 .alert-danger,
.ess-system-page .alert-danger {
  border-color: rgba(194, 65, 45, 0.22) !important;
  background: rgba(194, 65, 45, 0.08) !important;
  color: #A93424 !important;
}

.page-content > .container.mt-5.mb-5 .btn-green,
.ess-system-page .btn-green,
.pagenotfound-section + .text-center .btn-green {
  min-height: 46px;
  padding-right: 22px !important;
  padding-left: 22px !important;
  border-color: var(--ess-orange, #F58220) !important;
  border-radius: 14px !important;
  background: var(--ess-orange, #F58220) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px rgba(245, 130, 32, 0.2) !important;
  font-weight: 800 !important;
}

.page-content > .container.mt-5.mb-5 .btn-green:hover,
.ess-system-page .btn-green:hover,
.pagenotfound-section + .text-center .btn-green:hover {
  border-color: #E26F12 !important;
  background: #E26F12 !important;
}

.ess-system-page {
  max-width: 100%;
  padding: 58px 16px 74px;
  background: var(--ess-bg, #F8F9FA);
}

.ess-page-message-card {
  max-width: 760px;
  padding: 40px 34px;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 24px;
  box-shadow: 0 16px 38px rgba(17, 24, 39, 0.08);
}

.ess-page-message-media {
  margin-bottom: 20px;
}

.ess-page-message-media img {
  max-height: 230px;
}

.ess-page-kicker {
  border: 1px solid rgba(73, 169, 66, 0.16);
  background: rgba(73, 169, 66, 0.1);
}

.ess-page-message-content h3 {
  font-size: 32px;
  font-weight: 850;
}

.ess-page-message-content p {
  color: var(--ess-muted, #666666);
}

.page-content > .container.mt-3.mb-3 {
  max-width: 760px;
  padding-top: 48px;
  padding-bottom: 64px;
}

.page-content > .container.mt-3.mb-3 .pagenotfound-section,
.pagenotfound-section {
  margin-bottom: 20px !important;
  text-align: center;
}

.page-content > .container.mt-3.mb-3 .pagenotfound-section img,
.pagenotfound-section img {
  max-height: 230px;
  object-fit: contain;
}

.page-content > .container.mt-3.mb-3 > .text-center {
  padding: 34px;
  border: 1px solid var(--ess-border, #ECECEC);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.07);
}

.page-content > .container.mt-3.mb-3 h3 {
  color: var(--ess-text, #1A2233);
  font-size: 30px;
  font-weight: 850;
  letter-spacing: 0;
}

.page-content > .container.mt-3.mb-3 p {
  color: var(--ess-muted, #666666);
  line-height: 1.65;
}

@media (max-width: 991.98px) {
  .ess-footer-shell {
    grid-template-columns: 1fr;
    gap: 34px;
    padding-top: 46px;
  }

  .ess-footer-links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }

  .page-content > .container.mt-5.mb-5 > .row > .col-md-8.border-right {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

@media (max-width: 767.98px) {
  .ess-footer-v3 {
    margin-top: 38px;
  }

  .ess-footer-shell {
    padding: 38px 16px 24px;
  }

  .ess-footer-links {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .ess-footer-bottom {
    flex-direction: column;
    gap: 8px;
  }

  .ess-footer-brand p {
    font-size: 14px;
  }

  .page-content > .container.mt-5.mb-5 {
    padding: 22px 12px 34px;
    overflow-x: hidden;
  }

  .page-content > .container.mt-5.mb-5 > .row {
    margin-right: 0;
    margin-left: 0;
  }

  .page-content > .container.mt-5.mb-5 > .row > .col-md-8.border-right {
    min-width: 0;
    padding: 22px !important;
    border-radius: 18px;
  }

  .page-content > .container.mt-5.mb-5 > .row > .col-md-8.border-right * {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .page-content > .container.mt-5.mb-5 table {
    width: 100% !important;
    display: block;
    overflow-x: auto;
  }

  .page-content > .container.mt-5.mb-5 img,
  .page-content > .container.mt-5.mb-5 iframe {
    max-width: 100% !important;
    height: auto;
  }

  .page-content > .container.mt-5.mb-5 h3 {
    font-size: 26px;
  }

  .page-content > .container.mt-5.mb-5 .form-control,
  .page-content > .container.mt-5.mb-5 .form-control-text,
  .page-content > .container.mt-5.mb-5 input,
  .page-content > .container.mt-5.mb-5 textarea,
  .page-content > .container.mt-5.mb-5 select {
    min-height: 46px;
    font-size: 16px;
  }

  .page-content > .container.mt-5.mb-5 .btn-green,
  .ess-system-page .btn-green,
  .pagenotfound-section + .text-center .btn-green {
    width: 100%;
    justify-content: center;
  }

  .ess-system-page {
    padding: 34px 12px 48px;
  }

  .ess-page-message-card,
  .page-content > .container.mt-3.mb-3 > .text-center {
    padding: 24px 18px;
    border-radius: 18px;
  }

  .ess-page-message-content h3,
  .page-content > .container.mt-3.mb-3 h3 {
    font-size: 27px;
  }

  .ess-page-message-media img,
  .page-content > .container.mt-3.mb-3 .pagenotfound-section img,
  .pagenotfound-section img {
    max-height: 190px;
  }
}

/* Mobile Hero Bugfix: keep the V3 hero calm and align the location submit control.
   CSS-only: no search/location/form/JS/Vue/API/Core changes. */
body.front-page #main-search-banner.ess-home-hero-v3 {
  background:
    linear-gradient(180deg, rgba(245, 130, 32, 0.055), rgba(255, 255, 255, 0) 210px),
    #fff !important;
}

body.front-page .ess-home-hero-shell {
  grid-template-columns: minmax(0, 820px) !important;
  justify-content: start;
}

body.front-page .ess-home-hero-media,
body.front-page .ess-hero-image-card,
body.front-page .ess-hero-image-card img,
body.front-page .ess-hero-floating-card {
  display: none !important;
}

body.front-page .ess-home-hero-copy {
  max-width: 820px;
}

body.front-page .ess-hero-search-card {
  align-items: center !important;
}

body.front-page .ess-hero-search-submit {
  display: none !important;
}

body.front-page .ess-hero-search-card .ess-hero-search {
  min-width: 0 !important;
  margin: 0 !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
  position: relative !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  height: 46px !important;
  padding: 0 6px 0 12px !important;
  border: 1px solid #ECECEC !important;
  border-radius: 14px !important;
  background: #fff !important;
  overflow: hidden !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .twitter-typeahead,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete input,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .form-control,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input__inner {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  white-space: nowrap !important;
}

body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn,
body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete button,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn,
body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate button {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  flex-shrink: 0 !important;
}

@media (max-width: 991.98px) {
  body.front-page #main-search-banner.ess-home-hero-v3 {
    min-height: auto !important;
    padding-bottom: 28px !important;
  }

  body.front-page .ess-home-hero-shell {
    min-height: auto !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-top: 26px !important;
    padding-bottom: 0 !important;
  }
}

@media (max-width: 575.98px) {
  body.front-page #main-search-banner.ess-home-hero-v3 {
    padding-bottom: 24px !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-top: 22px !important;
  }

  body.front-page .ess-home-hero-copy h1 {
    margin-top: 0 !important;
    font-size: clamp(30px, 8.6vw, 35px) !important;
    line-height: 1.08 !important;
  }

  body.front-page .ess-hero-search-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    padding: 10px !important;
    overflow: visible !important;
  }

  body.front-page .ess-hero-location-pill {
    min-height: 40px !important;
    height: 40px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
    min-height: 46px !important;
    height: 46px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
    flex-direction: row !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 6px 0 12px !important;
    border: 1px solid #ECECEC !important;
    border-radius: 14px !important;
    background: #fff !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete input,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .form-control,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input__inner {
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 6px !important;
    font-size: 15px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: auto !important;
    height: 38px !important;
    min-height: 38px !important;
    gap: 5px !important;
    margin-left: 6px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-link,
  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-link {
    width: 34px !important;
    min-width: 34px !important;
    height: 36px !important;
    min-height: 36px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green,
  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green {
    width: 40px !important;
    min-width: 40px !important;
    height: 36px !important;
    min-height: 36px !important;
    border-radius: 12px !important;
  }

  body.front-page .ess-home-pills {
    position: relative !important;
    z-index: 1 !important;
    margin-top: 12px !important;
  }
}

/* Mobile Hero Search final polish
   CSS-only: no search/location/submit/form/JS/Vue/API/Core changes. */
@media (max-width: 767.98px) {
  body.front-page #main-search-banner.ess-home-hero-v3 {
    padding-bottom: 18px !important;
  }

  body.front-page .ess-home-hero-copy {
    padding-top: 18px !important;
  }

  body.front-page .ess-hero-search-card {
    margin-top: 18px !important;
    padding: 9px !important;
    gap: 8px !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 42px rgba(17, 24, 39, 0.09) !important;
  }

  body.front-page .ess-hero-location-pill {
    min-height: 38px !important;
    height: 38px !important;
    padding-inline: 12px !important;
    border-radius: 13px !important;
    font-size: 13px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search,
  body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
    min-height: 58px !important;
    height: 58px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
    gap: 0 !important;
    padding: 0 5px 0 13px !important;
    border: 1px solid #ECECEC !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete {
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .p-0,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-autocomplete,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input {
    height: 56px !important;
    min-height: 56px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete input,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .form-control,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .el-input__inner {
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 8px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 15px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
    align-self: stretch !important;
    height: 56px !important;
    min-height: 56px !important;
    gap: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-link,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-link {
    width: 38px !important;
    min-width: 38px !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 4px 2px 4px 0 !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: transparent !important;
    color: #5F6673 !important;
    box-shadow: none !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green {
    width: 56px !important;
    min-width: 56px !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 4px 0 !important;
    border: 0 !important;
    border-left: 1px solid rgba(236, 236, 236, 0.82) !important;
    border-radius: 14px !important;
    background: #F58220 !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(245, 130, 32, 0.20) !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green:hover,
  body.front-page .ess-hero-search-card .ess-hero-search .search-geocomplete .btn-green:hover {
    background: #E26F12 !important;
  }

  body.front-page .ess-home-pills {
    margin-top: 10px !important;
    gap: 6px !important;
  }

  body.front-page .ess-home-pills span {
    min-height: 30px !important;
    padding: 7px 10px !important;
    border-radius: 999px !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
  }

  body.front-page .ess-home-sections-v3 {
    padding-top: 26px !important;
  }

  body.front-page .ess-home-cuisine-section {
    overflow: hidden !important;
  }

  body.front-page .ess-home-cuisine-section .ess-section-carousel {
    margin-right: -6px !important;
    margin-left: -6px !important;
    padding-right: 6px !important;
    padding-left: 6px !important;
    overflow: hidden !important;
  }

  body.front-page .ess-home-cuisine-section .swiperCuisine {
    overflow: hidden !important;
    padding-right: 2px !important;
    padding-left: 2px !important;
  }

  body.front-page .ess-home-cuisine-section .swiper-wrapper {
    align-items: stretch;
  }

  body.front-page .ess-home-cuisine-section .swiper-slide {
    overflow: hidden !important;
  }

  body.front-page .ess-cuisine-card-v3,
  body.front-page .swiperCuisine .ess-cuisine-card-v3 {
    min-height: 118px !important;
    padding: 10px 8px !important;
    box-shadow: none !important;
  }

  body.front-page .ess-cuisine-icon {
    width: 54px !important;
    height: 54px !important;
  }

  body.front-page .ess-cuisine-name {
    font-size: 12.5px !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  body.front-page .ess-hero-search-card .ess-hero-search,
  body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
    min-height: 56px !important;
    height: 56px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search > .d-flex {
    padding: 0 6px 0 14px !important;
    border-radius: 16px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate {
    height: 54px !important;
    min-height: 54px !important;
  }

  body.front-page .ess-hero-search-card .ess-hero-search .flex-enabled-locate .btn-green {
    width: 56px !important;
    min-width: 56px !important;
    height: 46px !important;
    min-height: 46px !important;
  }
}