/* Native Figma header and footer. Interior page styles stay in style-v7.css. */

/* Headings are brand green site-wide, never black. Element-only, so any class rule (e.g. white on dark) still wins. */
h1, h2, h3, h4, h5, h6 { color: var(--nutri-green-700); }

body.nutri-design .nutri-site-header,
body.nutri-design .nutri-site-footer {
  --nutri-shell-green: var(--nutri-green-700);
  --nutri-shell-plum: #7a458b;
  --nutri-shell-forest: var(--nutri-green-900);
  font-family: 'Lato', 'Poppins', sans-serif;
  font-size: 14px;
  line-height: 1.5;
}
body.nutri-design .nutri-site-header *,
body.nutri-design .nutri-site-footer * { box-sizing: border-box; }
body.nutri-design .nutri-site-header .nutri-shell-container,
body.nutri-design .nutri-site-footer .nutri-shell-container {
  width: calc(100% - 48px);
  max-width: 1568px;
  padding: 0;
  margin: 0 auto;
}
body.nutri-design .nutri-site-header a,
body.nutri-design .nutri-site-footer a { text-decoration: none; }
body.nutri-design .nutri-site-header :is(button, input),
body.nutri-design .nutri-site-footer :is(button, input) { font: inherit; }
body.nutri-design .nutri-site-header :is(a, button, input):focus-visible,
body.nutri-design .nutri-site-footer :is(a, button, input):focus-visible {
  outline: 2px solid var(--nutri-green-500);
  outline-offset: 4px;
}
body.nutri-design .nutri-site-header .nutri-visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* 40px contact strip, 87px logo/search row, 56px primary navigation. */
body.nutri-design header#header { position: relative; z-index: 1000; }
body.nutri-design .nutri-site-header #TopBar {
  min-height: 40px; background: var(--nutri-green-100); border-radius: 0 0 10px 10px;
  color: #606060; font-family: 'Poppins', sans-serif;
}
body.nutri-design .nutri-site-header #HeaderContactInfo { min-height: 40px; }
body.nutri-design .nutri-site-header #TopBar .load-cont {
  min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 28px;
}
body.nutri-design .nutri-site-header #TopBar span {
  display: inline-flex; align-items: center; padding: 0; color: inherit;
  font-size: 14px; line-height: 20px; gap: 5px;
}
body.nutri-design .nutri-site-header #TopBar a { display: inline-flex; align-items: center; color: #606060; gap: 4px; font-family: inherit; }
body.nutri-design .nutri-site-header #TopBar img { display: block; object-fit: contain; }
body.nutri-design .nutri-site-header #TopBar a:hover { color: var(--nutri-green-700); }
body.nutri-design .nutri-site-header #MainHeader { background: #fff; }
body.nutri-design .nutri-site-header .MainHeaderCenter {
  min-height: 87px; padding: 0; display: grid;
  grid-template-columns: 1fr 552px 1fr; align-items: center; gap: 24px;
}
body.nutri-design .nutri-site-header .logo { position: static; margin: 0; display: flex; align-items: center; transform: none; z-index: auto; }
body.nutri-design .nutri-site-header .logo img { display: block; width: 135px; height: 52px; object-fit: contain; }
body.nutri-design .nutri-site-header .HeaderSearch {
  position: relative; width: 100%; margin: 0; left: auto; top: auto;
  bottom: auto; transform: none; z-index: 15;
}
body.nutri-design .nutri-site-header .HeaderSearch form {
  display: flex; align-items: center; width: 100%; height: 38px;
  background: #fbf9fd; border: 1px solid #7a458b2e; border-radius: 24px; overflow: hidden;
}
body.nutri-design .nutri-site-header .HeaderSearch input[type="text"] {
  float: none; flex: 1; width: 0; min-width: 0; height: 36px; padding: 0 18px 0 0;
  color: #555; border: 0; border-radius: 0; background: transparent; font-size: 14px;
}
body.nutri-design .nutri-site-header .HeaderSearch form:focus-within { border-color: var(--nutri-shell-plum); box-shadow: 0 0 0 2px #7a458b14; }
body.nutri-design .nutri-site-header .HeaderSearch input:focus { outline: 0; }
body.nutri-design .nutri-site-header .HeaderSearch button {
  float: none; display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 36px;
  padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--nutri-shell-plum);
}
body.nutri-design .nutri-site-header .HeaderSearch .auto_search {
  width: 100%; top: calc(100% + 8px); left: 0; max-height: 420px; overflow-y: auto;
  border-radius: 12px; background: #fff; box-shadow: 0 8px 30px #30233826;
}
body.nutri-design .nutri-site-header .cta-buttons { float: none; justify-content: flex-end; gap: 12px; }
body.nutri-design .nutri-site-header .nutri-consultation-link {
  min-height: 38px; padding: 5px 8px 5px 17px; border: 0; border-radius: 24px;
  background: var(--nutri-shell-plum); color: #fff; display: inline-flex; align-items: center;
  justify-content: space-between; gap: 13px; white-space: nowrap;
  box-shadow: 0 8px 18px #407a3526; font-size: 14px; font-weight: 500; cursor: pointer;
}
body.nutri-design .nutri-site-header .nutri-consultation-link:hover { background: #643474; }
body.nutri-design :is(.nutri-site-header, .nutri-site-footer) .nutri-shell-arrow {
  width: 24px; height: 24px; flex: 0 0 24px; display: grid; place-items: center;
  border: 1px solid currentColor; border-radius: 50%;
}
body.nutri-design :is(.nutri-site-header, .nutri-site-footer) .nutri-shell-arrow svg { display: block; width: 14px; height: 14px; }
body.nutri-design :is(.nutri-site-header, .nutri-site-footer) .nutri-shell-arrow path { stroke: currentColor; stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; }
body.nutri-design .nutri-site-header .nutri-consultation-link .nutri-shell-arrow { border-color: #ffffff88; }

body.nutri-design .nutri-site-header .navHeaderContainer { display: block; height: 56px; }
body.nutri-design .nutri-site-header .navHeader,
body.nutri-design header#header.darkHeader .navHeader {
  position: relative; top: auto; width: 100%; border-radius: 8px 8px 0 0; background: var(--nutri-green-700);
}
body.nutri-design .nutri-site-header .navHeader > .container { height: 56px; gap: 24px; }
body.nutri-design .nutri-site-header nav.nav_bar { position: static; width: auto; height: auto; background: transparent; flex: 1; }
body.nutri-design .nutri-site-header nav.nav_bar > ul { gap: 6px; flex-wrap: nowrap; padding: 0; }
body.nutri-design .nutri-site-header nav.nav_bar > ul > li { padding: 0; }
body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a {
  display: block; color: #fff; padding: 7px 9px; border-radius: 20px; text-transform: uppercase;
  font-size: 14px; font-family: 'Lato', sans-serif; white-space: nowrap;
  background: transparent; transition: background .2s ease;
}
body.nutri-design .nutri-site-header nav.nav_bar > ul > li.active > a { background: #ffffff16; }
body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a:hover { background: #ffffff22; }
/* Offers is promoted with a small % badge, not a fill, so it only looks active on /offers. */
body.nutri-design .nutri-site-header nav.nav_bar > ul > li.offers > a { display: inline-flex; align-items: center; gap: 6px; opacity: 1; }
body.nutri-design .nutri-site-header nav.nav_bar > ul > li.offers > a::after {
  content: "%"; display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; color: var(--nutri-green-700); font-size: 11px; font-weight: 800; line-height: 1;
}
body.nutri-design .nutri-site-header .nutri-header-tools { display: flex; align-items: center; gap: 23px; }
body.nutri-design .nutri-site-header .nutri-uae-badge { position: relative; display: block; width: 259px; height: 37px; flex: 0 0 259px; }
/* The native badge includes 27px of preserved SVG shadow padding. */
body.nutri-design .nutri-site-header .nutri-uae-badge img { position: absolute; max-width: none; width: 313px; height: 90px; inset-inline-start: -27px; top: -27px; pointer-events: none; }
body.nutri-design .nutri-site-header ul.header_icon { height: 56px; gap: 19px; margin: 0; padding: 0; }
body.nutri-design .nutri-site-header ul.header_icon > li { padding: 0; margin: 0; }
body.nutri-design .nutri-site-header ul.header_icon .li-cart > a { position: relative; display: flex; align-items: center; justify-content: center; min-width: 28px; min-height: 40px; }
body.nutri-design .nutri-site-header ul.header_icon .li-cart > a > .load-display { position: absolute; inset: 0; pointer-events: none; }
body.nutri-design .nutri-site-header .nutri-account-trigger { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 40px; padding: 0; background: transparent; border: 0; color: #fff; }
body.nutri-design .nutri-site-header li.user_dropdown img { margin: 0; object-fit: contain; }
body.nutri-design .nutri-site-header li.user_dropdown:hover { background: transparent; }
body.nutri-design .nutri-site-header .header-count.added_items_header { display: inline-grid; place-items: center; padding: 0; min-width: 17px; width: auto; height: 17px; top: 0; right: -6px; font-size: 11px; line-height: 1; }
body.nutri-design .nutri-site-header .cart_dropdown { padding-top: 8px; visibility: hidden; pointer-events: none; transition: opacity .2s; }
body.nutri-design .nutri-site-header .cart_dropdown ul { border: 1px solid #dce7d8; box-shadow: 0 12px 30px #1a3a1f1f; }
body.nutri-design .nutri-site-header .cart_dropdown li { background: #fff; padding: 10px 15px; }
body.nutri-design .nutri-site-header .cart_dropdown li:hover { background: var(--nutri-green-50); }
body.nutri-design .nutri-site-header .cart_dropdown li a { color: var(--nutri-green-700); font-size: 14px; }
body.nutri-design .nutri-site-header .cart_dropdown li a img { width: 18px; height: 18px; }
body.nutri-design .nutri-site-header li.user_dropdown:is(:hover, :focus-within) .cart_dropdown { visibility: visible; opacity: 1; z-index: 20; pointer-events: auto; }
body.nutri-design.user-no-login .nutri-site-header li.user_dropdown:focus-within .cart_dropdown.not-login,
body.nutri-design.user-login .nutri-site-header li.user_dropdown:focus-within .cart_dropdown.logged { display: block !important; }
body.nutri-design .nutri-site-header .delivery_all_menu { display: none; }
body.nutri-design .nutri-site-header .mob { display: none; }

/* Footer: brand, quick links, two meal-plan columns, address, hours, newsletter. */
body.nutri-design footer.nutri-site-footer {
  display: block; padding: 0; background: var(--nutri-shell-forest); color: var(--nutri-green-100); border-radius: 30px 30px 0 0;
}
body.nutri-design .nutri-site-footer .nutri-footer-main {
  display: grid; grid-template-columns: 268px 188px 448px minmax(0, 1fr);
  min-height: 416px; padding: 52px 0 24px;
}
body.nutri-design .nutri-site-footer .nutri-footer-brand { padding-inline-end: 36px; }
body.nutri-design .nutri-site-footer .footer-logo { width: auto; text-align: start; }
body.nutri-design .nutri-site-footer .footer-logo img { display: block; width: 198px; height: 76px; margin: 0; object-fit: contain; }
body.nutri-design .nutri-site-footer .nutri-footer-description { max-width: 235px; font-size: 14px; line-height: 21px; margin: 10px 0 4px; }
body.nutri-design .nutri-site-footer ul.footer-media { margin: 4px 0 18px; gap: 8px; padding: 0; justify-content: flex-start; }
body.nutri-design .nutri-site-footer ul.footer-media li { padding: 0; list-style: none; }
body.nutri-design .nutri-site-footer ul.footer-media li a { display: grid; place-items: center; width: 32px; height: 32px; background: #ffffff12; border-radius: 50%; }
body.nutri-design .nutri-site-footer ul.footer-media img { display: block; object-fit: contain; }
body.nutri-design .nutri-site-footer .nutri-footer-contact-button { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 160px; min-height: 38px; padding: 5px 8px 5px 16px; border-radius: 24px; color: var(--nutri-green-700); background: #fff; }
body.nutri-design .nutri-site-footer .nutri-footer-contact-button:hover { background: var(--nutri-green-50); }
body.nutri-design .nutri-site-footer .footer-nav { margin: 0; padding: 0 20px; border-inline-start: 1px solid #ffffff10; }
body.nutri-design .nutri-site-footer .footer-title { margin: 0 0 9px; padding: 0; color: var(--nutri-green-200); font-family: 'Lato', sans-serif; font-size: 14px; font-weight: 700; line-height: 20px; text-transform: uppercase; justify-content: flex-start; text-align: start; }
body.nutri-design .nutri-site-footer nav.footer-nav ul { padding: 0; margin: 0; list-style: none; text-align: start; }
body.nutri-design .nutri-site-footer nav.footer-nav li { width: auto; display: block; padding: 2px 0; }
body.nutri-design .nutri-site-footer nav.footer-nav li :is(a, button) { display: inline; padding: 0; border: 0; background: transparent; color: var(--nutri-green-100); font-size: 14px; line-height: 20px; text-align: start; cursor: pointer; }
body.nutri-design .nutri-site-footer nav.footer-nav li :is(a, button):hover { color: #fff; text-decoration: underline; }
body.nutri-design .nutri-site-footer .nutri-footer-meal-links ul { display: grid; grid-auto-flow: column; grid-template-rows: repeat(6, auto); grid-template-columns: 1fr 1fr; column-gap: 24px; }
body.nutri-design .nutri-site-footer .nutri-footer-contact { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 190px; gap: 20px; padding-inline-start: 20px; border-inline-start: 1px solid #ffffff10; }
body.nutri-design .nutri-site-footer #FooterContactInfo { padding-inline-start: 20px !important; }
body.nutri-design .nutri-site-footer .footer-address { text-align: start; margin: 0; min-width: 0; }
/* Contact lines: a fixed 16px icon column keeps every value on one text edge. */
body.nutri-design .nutri-site-footer .nutri-footer-contact-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
body.nutri-design .nutri-site-footer .nutri-footer-icon-line { display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: start; column-gap: 10px; font-size: 14px; line-height: 22px; }
body.nutri-design .nutri-site-footer .nutri-footer-icon { display: block; width: 16px; height: 16px; margin-top: 3px; color: #a7d79a; }
body.nutri-design .nutri-site-footer .footer-address :is(p, span, div) { color: var(--nutri-green-100); font-size: 14px; line-height: 22px; }
body.nutri-design .nutri-site-footer .footer-address p { margin: 0; }
body.nutri-design .nutri-site-footer .footer-address span { display: inline; margin: 0; }
body.nutri-design .nutri-site-footer .nutri-footer-icon-line a { justify-self: start; color: var(--nutri-green-100); overflow-wrap: anywhere; }
body.nutri-design .nutri-site-footer .nutri-footer-icon-line a:hover { color: #fff; text-decoration: underline; }
body.nutri-design .nutri-site-footer .nutri-footer-email { margin-bottom: 24px; }
body.nutri-design .nutri-site-footer .footer_newsletter { width: 100%; margin: 0; text-align: start; }
body.nutri-design .nutri-site-footer .footer_newsletter .footer-title { display: block; color: #fff; text-transform: none; margin-bottom: 12px; line-height: 19px; }
body.nutri-design .nutri-site-footer .subscribe_row { display: flex; flex-direction: column; align-items: stretch; gap: 14px; }
body.nutri-design .nutri-site-footer .subscribe_row input[type="email"] { width: 100%; min-width: 0; height: 38px; padding: 0 14px; background: #ffffff0b; border: 1px solid #ffffff2a; color: #fff; border-radius: 24px; font-size: 13px; }
body.nutri-design .nutri-site-footer .subscribe_row input::placeholder { color: var(--nutri-green-100); opacity: 1; }
body.nutri-design .nutri-site-footer .subscribe_row .btn_form { position: static; display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 36px; height: auto; padding: 5px 8px 5px 16px; color: var(--nutri-green-700); background: #fff; border: 0; border-radius: 24px; font-size: 13px; text-align: start; }
body.nutri-design .nutri-site-footer .subscribe_row .btn_form:disabled { opacity: .7; }
body.nutri-design .nutri-site-footer :is(.subscribe_row .btn_form, .nutri-footer-contact-button) .nutri-shell-arrow { color: var(--nutri-shell-plum); border-color: #baa8c9; background: #7a458b14; }
body.nutri-design .nutri-site-footer .footer_newsletter .messages { font-size: 13px; line-height: 20px; }
body.nutri-design .nutri-site-footer .footer_newsletter .messages p { font-size: 13px; color: inherit; font-weight: 400; padding: 0; }
/* forms-v4.js injects .success/.error boxes with pale fills; tint them for the dark footer so the white text stays legible. */
body.nutri-design .nutri-site-footer .footer_newsletter .messages :is(.success, .error) { margin: 0; border-radius: 12px; }
body.nutri-design .nutri-site-footer .footer_newsletter .messages .success { background-color: #b1e0a31f; border-color: #b1e0a366; color: var(--nutri-green-100); }
body.nutri-design .nutri-site-footer .footer_newsletter .messages .error { background-color: #ff8a7d1f; border-color: #ff8a7d66; color: #ffe1dd; }
body.nutri-design .nutri-site-footer .nutri-footer-bottom { background: #ffffff06; border-top: 1px solid #ffffff0c; }
body.nutri-design .nutri-site-footer .nutri-footer-bottom > .container { display: flex; align-items: center; justify-content: space-between; min-height: 44px; gap: 24px; }
body.nutri-design .nutri-site-footer .nutri-footer-policies { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; }
body.nutri-design .nutri-site-footer .footer-links { display: inline; margin: 0; color: var(--nutri-green-100); font-size: 13px; text-decoration: underline; text-underline-offset: 2px; }
body.nutri-design .nutri-site-footer .nutri-footer-copyright { margin: 0; color: var(--nutri-green-100); font-size: 13px; }
body.nutri-design .nutri-site-footer .footer-whatsapp { position: fixed; inset-inline-end: 20px; bottom: 20px; z-index: 80; display: block; width: 48px; height: 48px; }
body.nutri-design .nutri-site-footer .footer-whatsapp img { width: 48px; height: 48px; display: block; }

/* Keep the full plan action primary while making its menu easy to preview. */
body.nutri-design .menu-sample-link {
  display: inline-flex; align-items: center; justify-content: center; min-height: 36px;
  margin-block-start: 12px; color: var(--nutri-green-700); background: transparent; border: 0;
  font-size: 14px; font-weight: 600; line-height: 1.4; text-decoration: underline;
  text-decoration-thickness: 1px; text-underline-offset: 4px;
}
body.nutri-design .menu-sample-link:hover { color: var(--nutri-green-800); }
body.nutri-design .menu-sample-link:focus-visible { outline: 2px solid var(--nutri-green-700); outline-offset: 4px; }

@media (max-width: 1640px) {
  body.nutri-design .nutri-site-header .MainHeaderCenter { grid-template-columns: 1fr minmax(320px, 552px) 1fr; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul { gap: 0; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a { padding-inline: 8px; font-size: 13px; }
  body.nutri-design .nutri-site-header .nutri-header-tools { gap: 16px; }
  body.nutri-design .nutri-site-footer .nutri-footer-main { grid-template-columns: 230px 150px minmax(280px, .9fr) minmax(0, 1.5fr); }
  body.nutri-design .nutri-site-footer .nutri-footer-brand { padding-inline-end: 22px; }
  body.nutri-design .nutri-site-footer .nutri-footer-contact { grid-template-columns: minmax(0, 1fr) minmax(0, .85fr) minmax(150px, .95fr); gap: 18px; }
}
@media (max-width: 1280px) {
  body.nutri-design .nutri-site-header .MainHeaderCenter { grid-template-columns: 170px minmax(200px, 1fr) auto; }
  body.nutri-design .nutri-site-header .nutri-uae-badge { display: none; }
  body.nutri-design .nutri-site-header .navHeader > .container { gap: 14px; }
  body.nutri-design .nutri-site-footer .nutri-footer-main { grid-template-columns: 220px 160px minmax(0, 1fr); row-gap: 36px; min-height: 0; padding: 42px 0; }
  body.nutri-design .nutri-site-footer .nutri-footer-meal-links { padding-inline-end: 0; }
  body.nutri-design .nutri-site-footer .nutri-footer-contact { grid-column: 1 / -1; grid-template-columns: 1fr 1fr 240px; padding: 28px 0 0; border-inline-start: 0; border-top: 1px solid #ffffff15; gap: 30px; }
  body.nutri-design .nutri-site-footer #FooterContactInfo { padding-inline-start: 0 !important; }
}
@media (max-width: 991px) {
  body.nutri-design .nutri-site-header .nutri-shell-container,
  body.nutri-design .nutri-site-footer .nutri-shell-container { width: calc(100% - 40px); }
  body.nutri-design .nutri-site-header #TopBar { display: block; }
  body.nutri-design .nutri-site-header #TopBar .load-cont { gap: 14px; }
  body.nutri-design .nutri-site-header #TopBar span { font-size: 12px; gap: 4px; }
  body.nutri-design .nutri-site-header .MainHeaderCenter { min-height: 78px; display: flex; justify-content: space-between; }
  body.nutri-design .nutri-site-header .logo img { width: 120px; height: 47px; }
  body.nutri-design .nutri-site-header .web { display: none; }
  body.nutri-design .nutri-site-header .mob { display: block; }
  body.nutri-design .nutri-site-header .menu-icon { display: grid; place-items: center; width: 44px; height: 44px; padding: 8px; margin: 0; border: 0; background: #f7f3f9; border-radius: 50%; }
  body.nutri-design .nutri-site-header .menu-icon img { display: block; width: 24px; height: 24px; }
  body.nutri-design .nutri-site-header .HeaderSearch { position: absolute; display: none; inset-inline: 0; top: 20px; width: 100%; margin: 0; transform: none; }
  body.nutri-design.active_search .nutri-site-header .HeaderSearch { display: block; transform: none; }
  body.nutri-design.active_search .nutri-site-header :is(.logo, .cta-buttons) { visibility: hidden; opacity: 0; }
  body.nutri-design .nutri-site-header .navHeaderContainer { height: 48px; }
  body.nutri-design .nutri-site-header .navHeader > .container { height: 48px; }
  body.nutri-design .nutri-site-header .search-btn-mob { width: 40px; height: 40px; padding: 0; color: #fff; background: transparent; border: 0; border-radius: 50%; }
  body.nutri-design .nutri-site-header ul.header_icon { height: 48px; }
  body.nutri-design .nutri-site-header .nutri-header-tools { margin-inline-start: auto; }
  body.nutri-design .nutri-site-footer .nutri-footer-main { grid-template-columns: 200px 140px minmax(0, 1fr); }
  body.nutri-design .nutri-site-footer .footer-logo img { width: 175px; height: 68px; }
  body.nutri-design .nutri-site-footer .nutri-footer-contact { grid-template-columns: 1fr 1fr 220px; gap: 24px; }
}
@media (max-width: 700px) {
  body.nutri-design .nutri-site-header #TopBar .load-cont { flex-wrap: wrap; gap: 4px 10px; padding: 8px 0; }
  body.nutri-design .nutri-site-header #TopBar span { font-size: 11px; line-height: 16px; }
  body.nutri-design .nutri-site-footer { border-radius: 24px 24px 0 0; }
  body.nutri-design .nutri-site-footer .nutri-footer-main { grid-template-columns: 1fr 1fr; padding: 36px 0; gap: 30px 24px; }
  body.nutri-design .nutri-site-footer .nutri-footer-brand { grid-column: 1 / -1; padding: 0 0 28px; border-bottom: 1px solid #ffffff15; }
  body.nutri-design .nutri-site-footer .nutri-footer-description { max-width: 280px; }
  body.nutri-design .nutri-site-footer .footer-nav { border: 0; padding: 0; }
  body.nutri-design .nutri-site-footer .nutri-footer-meal-links ul { display: block; }
  body.nutri-design .nutri-site-footer .nutri-footer-contact { grid-template-columns: 1fr 1fr; gap: 30px 24px; padding-top: 28px; }
  body.nutri-design .nutri-site-footer .nutri-footer-subscribe { grid-column: 1 / -1; max-width: 360px; }
  body.nutri-design .nutri-site-footer .nutri-footer-email { margin-bottom: 18px; }
  body.nutri-design .nutri-site-footer .subscribe_row { flex-direction: row; gap: 10px; }
  body.nutri-design .nutri-site-footer .subscribe_row input[type="email"] { flex: 1; width: 0; }
  body.nutri-design .nutri-site-footer .subscribe_row .btn_form { width: 120px; flex-shrink: 0; }
  body.nutri-design .nutri-site-footer .nutri-footer-bottom > .container { align-items: flex-start; flex-direction: column; gap: 16px; padding-block: 20px; }
  body.nutri-design .nutri-site-footer .nutri-footer-policies { gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.nutri-design .nutri-site-header nav.nav_bar,
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a { transition: none; }
}

/* Pill buttons: every call-to-action button on the public site is pill shaped (Nov 2026). These classes
   came from a browser audit of all public pages; the homepage .nh-button pills are already round. */
body.nutri-design :is(.btn_form, .sign_btn, .signup_btn, .programs_btn, .cta_btn, .customize_btn, .other-packages-link, .product_box_cart, .cart_btm, .btn-big, .btn-free-trial) {
  border-radius: 999px;
}
/* .btn-big hover darkens one step instead of turning white (it vanished on white pages); opacity undoes
   style-v7's global a:hover fade. */
body.nutri-design .btn-big:not(:disabled):is(:hover, :focus-visible) {
  background-color: var(--nutri-green-800); color: #fff; text-decoration: none; opacity: 1;
}
body.nutri-design .btn-big:focus-visible { outline: 3px solid var(--nutri-green-300); outline-offset: 2px; }

/* Form fields: one look on every public page (Nov 2026, from the contact page design). Scoped to page
   content and popups, so the header search and the footer newsletter keep their own style; the product
   quantity stepper (name="qty-*") is left alone. */
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea) {
  box-sizing: border-box; width: 100%; height: auto; min-height: 56px; margin: 0; padding: 14px 18px;
  border: 1px solid var(--nutri-green-200); border-radius: 10px; background-color: #fff; color: #1f2a1f;
  font: 400 16px/1.4 'Lato', sans-serif; box-shadow: none; outline: none; transition: border-color .2s, box-shadow .2s;
}
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea)::placeholder { color: #8a9786; opacity: 1; }
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):hover { border-color: #b9d1b1; }
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):focus { border-color: var(--nutri-green-500); box-shadow: 0 0 0 3px rgba(99, 165, 79, .18); }
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):disabled { background-color: #f6f8f5; color: #7a8676; cursor: not-allowed; }
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):is(textarea) { min-height: 120px; resize: vertical; }
body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):is(select) {
  appearance: none; -webkit-appearance: none; padding-inline: 18px 46px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23407a35' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 18px center; background-size: 18px;
}
html[dir='rtl'] body.nutri-design :is(main, .home_popup_wrapper) :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="file"]):not([type="image"]):not([name^="qty"]):not([id^="qty"]):not([id^="cart-row"]), select, textarea):is(select) { background-position: left 18px center; }
body.nutri-design :is(main, .home_popup_wrapper) :is(.input_row, .form-group) { position: relative; }
/* Labels sit above the field (the legacy style-v7.css floats them on the top border). */
body.nutri-design :is(main, .home_popup_wrapper) .input_row label {
  position: static; inset: auto; z-index: auto; display: block; margin: 0 0 8px; padding: 0;
  border-radius: 0; background: none; color: var(--nutri-green-900); font: 500 15px/1.4 'Lato', sans-serif; text-align: start; text-transform: none;
}
body.nutri-design :is(main, .home_popup_wrapper) .input_row label :is(.asterisks, span[aria-hidden]) { color: inherit !important; } /* beats style-v7's red !important */
body.nutri-design :is(main, .home_popup_wrapper) .iti { display: block; width: 100%; }
/* A select still on its placeholder option ("Select emirate") reads like the other placeholders. */
body.nutri-design :is(main, .home_popup_wrapper) select:has(> option:checked:is([value=""], :not([value]))) { color: #8a9786 !important; } /* outranks the field rule's long selector */
body.nutri-design :is(main, .home_popup_wrapper) select option { color: #1f2a1f; }
/* Password eye: centred in the 56px field now that the label sits above it (style-v7 pinned it to the top). */
body.nutri-design :is(main, .home_popup_wrapper) .input_row .toggle-password { top: auto; bottom: 20px; }
/* The register page wraps its mobile field in .number_input, which style-v7 gives a dark border; the field has its own now. */
body.nutri-design :is(main, .home_popup_wrapper) .number_input { border: 0; border-radius: 0; }

/* Blog and media card links ("Read This Post", "View Event"): the same green pill with the circled arrow as the
   homepage blog cards (.nh-button), replacing style-v7's text link with a background-image arrow. */
body.nutri-design .read_post {
  display: inline-flex; align-items: center; gap: 14px; width: max-content; max-width: 100%; min-height: 42px;
  padding: 7px 10px 7px 18px; border: 0; border-radius: 999px; background: var(--nutri-green-700); color: #fff !important;
  font: 400 16px/1.3 'Lato', sans-serif; text-decoration: none; opacity: 1; box-shadow: 0 7px 16px #407a351a;
  transition: background .2s, transform .2s;
}
body.nutri-design .read_post:hover { background: var(--nutri-green-800); color: #fff !important; opacity: 1; transform: translateY(-2px); }
body.nutri-design .read_post:focus-visible { outline: 3px solid var(--nutri-olive); outline-offset: 4px; }
body.nutri-design .read_post .nh-button-arrow { display: block; width: 24px; height: 24px; flex: 0 0 24px; }
html[dir='rtl'] body.nutri-design .read_post .nh-button-arrow { transform: scaleX(-1); }
@media (prefers-reduced-motion: reduce) { body.nutri-design .read_post { transition: none; } body.nutri-design .read_post:hover { transform: none; } }

/* Price component (meal-plan and product cards): an optional label over a large amount, with the currency
   stacked over the unit beside it, on a soft panel. Colours keep WCAG AA contrast on the panel; on a
   highlighted (green) card the panel turns white instead of the text, so contrast holds there too. */
body.nutri-design .nutri-price {
  display: inline-flex; flex-direction: column; align-items: flex-start; gap: 7px; margin: 0; padding: 10px 14px 11px 12px;
  border-radius: 12px; background: var(--nutri-green-50); color: var(--nutri-green-800); transition: background .2s, box-shadow .2s;
}
body.nutri-design .nutri-price-label { color: #4f5e4b; font: 700 11px/1.1 'Lato', sans-serif; letter-spacing: .12em; text-transform: uppercase; }
body.nutri-design .nutri-price-row { display: flex; align-items: stretch; gap: 10px; }
body.nutri-design .nutri-price-amount { color: var(--nutri-green-800); font: 700 36px/.82 'Asap', sans-serif; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
body.nutri-design .nutri-price-meta { display: flex; flex-direction: column; justify-content: space-between; gap: 2px; padding-inline-start: 10px; border-inline-start: 2px solid var(--nutri-green-200); }
body.nutri-design .nutri-price-currency { color: var(--nutri-green-800); font: 700 13px/1 'Lato', sans-serif; letter-spacing: .06em; }
body.nutri-design .nutri-price-unit { color: #4f5e4b; font: 400 13px/1 'Lato', sans-serif; text-transform: lowercase; }
body.nutri-design .nh-plan-card:is(:hover, :focus-within) .nutri-price { background: #fff; box-shadow: 0 4px 14px rgba(26, 58, 31, .14); }
@media (prefers-reduced-motion: reduce) { body.nutri-design .nutri-price { transition: none; } }

/* Mobile navigation drawer (Nov 2026): a white panel with dark links; green only marks the current page and
   Offers; the plum Book Your Consultation is the one strong action; contact links at the bottom; a dimmed
   backdrop behind. Desktop navigation is unchanged. */
@media (max-width: 991px) {
  body.nutri-design .nutri-site-header nav.nav_bar {
    position: fixed; top: 0; right: -100%; left: auto; z-index: 1001; display: flex; flex-direction: column;
    width: min(360px, 88vw); height: 100dvh; min-height: 100vh; padding: 0; overflow-y: auto;
    background: #fff; box-shadow: -18px 0 48px rgba(26, 58, 31, .18); visibility: hidden; pointer-events: none; transition: right .25s ease;
  }
  body.nutri-design .nutri-site-header nav.nav_bar.active { right: 0; visibility: visible; pointer-events: auto; }
  body.nutri-design .nutri-site-header .nav-drawer-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 16px 24px; border-bottom: 1px solid #eef3eb; }
  body.nutri-design .nutri-site-header .nav-drawer-logo img { display: block; width: 110px; height: auto; }
  body.nutri-design .nutri-site-header nav.nav_bar .popup_close { position: static; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--nutri-green-50); color: var(--nutri-green-800); cursor: pointer; }
  body.nutri-design .nutri-site-header nav.nav_bar .popup_close:hover { background: var(--nutri-green-100); }
  body.nutri-design .nutri-site-header nav.nav_bar > ul { display: flex; flex-direction: column; align-items: stretch; gap: 2px; margin: 0; padding: 14px 14px 8px; text-align: start; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li { padding: 0 !important; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a {
    display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin: 0; padding: 12px 14px;
    border-radius: 12px; background: transparent; color: #1f2a1f; font: 600 16px/1.3 'Lato', sans-serif; text-transform: none; white-space: normal; opacity: 1;
  }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a::after { content: ""; width: 8px; height: 8px; border-top: 2px solid #b5c7af; border-right: 2px solid #b5c7af; transform: rotate(45deg); flex: none; }
  html[dir='rtl'] body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a::after { transform: rotate(-135deg); }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li > a:hover { background: var(--nutri-green-50); color: #1f2a1f; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li.active > a { background: var(--nutri-green-100); color: var(--nutri-green-800); }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li.active > a::after { border-color: var(--nutri-green-500); }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li.offers { margin-top: 8px; padding-top: 10px !important; border-top: 1px solid #eef3eb; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li.offers > a { display: flex; margin: 0; }
  body.nutri-design .nutri-site-header nav.nav_bar > ul > li.offers > a::after { content: "%"; display: block; width: auto; height: auto; padding: 2px 9px; border: 0; border-radius: 999px; background: var(--nutri-green-500); color: #fff; font-size: 13px; font-weight: 700; line-height: 1.3; transform: none; }
  body.nutri-design .nutri-site-header .nav-drawer-foot { display: flex; flex-direction: column; gap: 16px; margin-top: auto; padding: 20px 24px 28px; border-top: 1px solid #eef3eb; }
  body.nutri-design .nutri-site-header .nav-drawer-cta {
    display: inline-flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-height: 50px; padding: 10px 14px 10px 22px;
    border: 0; border-radius: 999px; background: #7a458b; color: #fff; font: 700 16px/1.2 'Lato', sans-serif; box-shadow: 0 10px 22px rgba(122, 69, 139, .22); cursor: pointer;
  }
  body.nutri-design .nutri-site-header .nav-drawer-cta:hover { background: #643474; }
  body.nutri-design .nutri-site-header .nav-drawer-cta .nutri-shell-arrow { width: 26px; height: 26px; border-color: #ffffff80; }
  body.nutri-design .nutri-site-header .nav-drawer-contact { display: flex; flex-direction: column; gap: 4px; }
  body.nutri-design .nutri-site-header .nav-drawer-contact a { display: flex; align-items: center; gap: 12px; min-height: 40px; color: #3f4d3b; font-size: 15px; text-decoration: none; }
  body.nutri-design .nutri-site-header .nav-drawer-contact a:hover { color: var(--nutri-green-800); }
  body.nutri-design .nutri-site-header .nav-drawer-contact img { width: 16px; height: 16px; }
  body.nutri-design .nutri-site-header .nav-backdrop { position: fixed; inset: 0; z-index: 1000; background: rgba(26, 58, 31, .45); opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s; }
  body.nutri-design .nutri-site-header .nav_bar.active + .nav-backdrop { opacity: 1; visibility: visible; }
  body.nutri-design .nutri-site-header nav.nav_bar :is(a, button):focus-visible { outline: 3px solid var(--nutri-olive); outline-offset: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  body.nutri-design .nutri-site-header .nav-backdrop { transition: none; }
}

/* Pill quantity stepper (Nov 2026): built on the product page, shared with the cart. Bootstrap's
   input-group wraps by default, which stacked the cart's minus and plus buttons on their own lines. */
:is(.product-details-page.mod, .my_cart_table) .product_qty {
  flex: none; flex-wrap: nowrap; width: max-content; height: 48px; padding: 4px;
  border: 1px solid var(--nutri-green-200); border-radius: 999px; background: #fff;
}
:is(.product-details-page.mod, .my_cart_table) .product_qty .btn {
  display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0;
  border: 0; border-radius: 999px; background: var(--nutri-green-50); box-shadow: none;
  transition: background-color 0.2s ease;
}
:is(.product-details-page.mod, .my_cart_table) .product_qty .btn i { color: var(--nutri-green-700); font-size: 0.8rem; }
:is(.product-details-page.mod, .my_cart_table) .product_qty .btn:hover:not(:disabled) { background: var(--nutri-green-100); }
:is(.product-details-page.mod, .my_cart_table) .product_qty .btn:disabled { opacity: 0.4; cursor: not-allowed; }
:is(.product-details-page.mod, .my_cart_table) .product_qty input.form-control {
  flex: none; width: 3rem; height: 38px; padding: 0; border: 0; background: transparent; box-shadow: none;
  font-size: 1rem; font-weight: 600; color: #1f2a1f;
}
.product-details-page.mod .product_qty { margin: 0; }
.my_cart_table .product_qty { margin-inline: auto; }
@media (prefers-reduced-motion: reduce) {
  :is(.product-details-page.mod, .my_cart_table) .product_qty .btn { transition: none; }
}

/* Toasts (Nov 2026): cart and account messages are fixed to the viewport so they are seen however far the
   visitor has scrolled. Top corner on desktop; on phones along the bottom, above the WhatsApp button.
   The message boxes keep their .success / .error / .warning look from style-v7.css; toast.js adds the close button. */
body.nutri-design .header-message {
  position: fixed; top: calc(16px + env(safe-area-inset-top, 0px)); bottom: auto;
  inset-inline-end: 16px; inset-inline-start: auto; z-index: 1100;
  width: min(400px, calc(100vw - 32px)); margin: 0; pointer-events: none;
}
body.nutri-design .header-message:empty { display: none; }
body.nutri-design .header-message > .nutri-toast {
  position: relative; display: block; width: 100%; margin: 0; padding: 14px 48px 14px 40px;
  border-radius: 12px; background-position: 14px 17px; box-shadow: 0 12px 32px rgba(26, 58, 31, .18);
  color: #1f2a1f; font-size: 15px; line-height: 1.45; text-align: start; pointer-events: auto;
  animation: nutri-toast-in .2s ease-out;
}
body.nutri-design .header-message > .nutri-toast + .nutri-toast { margin-block-start: 8px; }
body.nutri-design .nutri-toast-action { margin-inline-start: 4px; color: var(--nutri-green-800); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; white-space: nowrap; }
body.nutri-design .nutri-toast-action:hover { color: var(--nutri-green-900); opacity: 1; }
body.nutri-design .nutri-toast-close {
  position: absolute; top: 6px; inset-inline-end: 6px; display: grid; place-items: center; width: 36px; height: 36px;
  padding: 0; border: 0; border-radius: 50%; background: transparent; color: #4b5a47; font-size: 22px; line-height: 1; cursor: pointer;
}
body.nutri-design .nutri-toast-close:hover { background: rgba(26, 58, 31, .08); }
body.nutri-design :is(.nutri-toast-close, .nutri-toast-action):focus-visible { outline: 3px solid var(--nutri-green-300); outline-offset: 2px; }
@keyframes nutri-toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) {
  body.nutri-design .header-message {
    top: auto; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); inset-inline: 16px; width: auto;
  }
  @keyframes nutri-toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
}
@media (prefers-reduced-motion: reduce) {
  body.nutri-design .header-message > .nutri-toast { animation: none; }
}
