/* NG Home reference pass: restore the vivid iOS-glass widget language from the
   reference screen while preserving the orange/lime CTA palette. */
.home-screen-mode {
  --ng-orange-bright: #ffbd3d;
  --ng-orange-main: #ff9708;
  --ng-orange-deep: #f47700;
  --ng-orange-ink: #241303;
  --ng-lime-bright: #d5ff2c;
  --ng-lime-main: #a9ed00;
  --ng-lime-ink: #142000;
  --ng-icon-rim: rgba(255, 255, 255, .56);
}

/* Keep the photography visible and bring back the reference card accents. */
.home-screen-mode .home-dashboard-v2 > .home-plan-card,
.home-screen-mode .home-dashboard-v2 > .home-coach-card {
  border-color: rgba(183, 255, 0, .32);
}
.home-screen-mode .home-dashboard-v2 > .home-meals-card,
.home-screen-mode .home-dashboard-v2 > .home-recipe-card,
.home-screen-mode .home-dashboard-v2 > .fasting-home-widget {
  border-color: rgba(151, 218, 240, .3);
}
.home-screen-mode .home-dashboard-v2 > .home-workout-widget {
  border-color: rgba(255, 68, 190, .54);
}

/* Reference icon language: colored translucent well, two rims, top shine and
   a restrained colored halo. The pictogram is always above both rims. */
.home-screen-mode .home-stat-icon,
.home-screen-mode .home-workout-icon,
.home-screen-mode .home-recipe-action > i,
.home-screen-mode .home-meals-visual span,
.home-screen-mode .home-meals-visual > i,
.home-screen-mode .home-coach-capabilities li i,
.home-screen-mode .home-workout-action > i {
  position: relative;
  display: grid;
  place-items: center;
  overflow: visible;
  border: 1px solid var(--ng-icon-rim);
  background: linear-gradient(145deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .045));
  -webkit-backdrop-filter: blur(16px) saturate(155%);
  backdrop-filter: blur(16px) saturate(155%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), inset 0 -1px 0 rgba(0, 0, 0, .24), 0 8px 18px rgba(0, 0, 0, .2), 0 0 22px currentColor;
}

.home-screen-mode .home-stat-icon::after,
.home-screen-mode .home-workout-icon::after,
.home-screen-mode .home-recipe-action > i::after,
.home-screen-mode .home-meals-visual span::after,
.home-screen-mode .home-meals-visual > i::after,
.home-screen-mode .home-coach-capabilities li i::after,
.home-screen-mode .home-workout-action > i::after {
  position: absolute;
  inset: 5px;
  content: '';
  border: 1px solid currentColor;
  border-radius: inherit;
  opacity: .36;
  pointer-events: none;
}

.home-screen-mode .home-stat-icon i,
.home-screen-mode .home-workout-icon i,
.home-screen-mode .home-recipe-action > i,
.home-screen-mode .home-meals-visual span > i,
.home-screen-mode .home-meals-visual > i,
.home-screen-mode .home-coach-capabilities li i,
.home-screen-mode .home-workout-action > i {
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .28));
}

/* Keep the four metrics in the vivid pink / amber / cyan / violet rhythm. */
.home-screen-mode .home-today-card .home-stat-calories .home-stat-icon {
  border-color: rgba(255, 185, 222, .76);
  color: #ff91c5;
  background: linear-gradient(145deg, rgba(255, 89, 166, .44), rgba(112, 27, 82, .34));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38), 0 8px 18px rgba(0, 0, 0, .2), 0 0 23px rgba(255, 79, 154, .42);
}
.home-screen-mode .home-today-card .home-stat-calories-burned .home-stat-icon {
  border-color: rgba(255, 218, 169, .8);
  color: #ffd08e;
  background: linear-gradient(145deg, rgba(255, 171, 73, .48), rgba(130, 58, 24, .35));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38), 0 8px 18px rgba(0, 0, 0, .2), 0 0 23px rgba(255, 166, 76, .38);
}
.home-screen-mode .home-today-card .home-stat-water .home-stat-icon {
  border-color: rgba(178, 242, 255, .82);
  color: #9ceeff;
  background: linear-gradient(145deg, rgba(58, 210, 250, .44), rgba(11, 88, 120, .34));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38), 0 8px 18px rgba(0, 0, 0, .2), 0 0 23px rgba(69, 214, 255, .4);
}
.home-screen-mode .home-today-card .home-stat-steps .home-stat-icon {
  border-color: rgba(220, 209, 255, .84);
  color: #d1c2ff;
  background: linear-gradient(145deg, rgba(154, 119, 255, .5), rgba(61, 38, 133, .38));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .38), 0 8px 18px rgba(0, 0, 0, .2), 0 0 23px rgba(157, 126, 255, .42);
}
.home-screen-mode .home-today-card .home-stat-icon i { color: currentColor !important; }

/* Main workout icon follows the same nested-glass construction, with its
   existing fuchsia identity retained. */
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-icon {
  border-color: rgba(255, 205, 243, .72);
  color: #ffc1ed;
  background: linear-gradient(145deg, rgba(255, 61, 190, .34), rgba(117, 51, 161, .25));
  box-shadow: inset 0 1px 0 rgba(255, 240, 252, .38), inset 0 -1px 0 rgba(20, 4, 29, .3), 0 10px 24px rgba(0, 0, 0, .22), 0 0 24px rgba(255, 68, 190, .28);
}
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-icon i { color: #ffc1ed !important; }

/* Recipe actions keep their existing orange/lime surfaces, but their icon
   wells return to the reference cyan and violet treatment. */
.home-screen-mode .home-recipe-action {
  grid-template-columns: 64px minmax(0, 1fr);
  column-gap: 14px;
  align-items: center;
  min-height: 92px;
}
.home-screen-mode .home-recipe-action > i {
  width: 56px;
  height: 56px;
  margin: 0;
  justify-self: center;
  border-radius: 18px;
  color: #b9ecff !important;
  background: linear-gradient(145deg, rgba(81, 202, 255, .38), rgba(34, 91, 137, .2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .42), inset 0 -1px 0 rgba(0, 35, 58, .24), 0 8px 18px rgba(0, 0, 0, .2), 0 0 22px rgba(92, 207, 255, .34);
}
.home-screen-mode .home-recipe-actions .home-recipe-action:nth-child(2) > i {
  color: #e6c9ff !important;
  background: linear-gradient(145deg, rgba(173, 113, 255, .42), rgba(75, 45, 142, .22));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .42), inset 0 -1px 0 rgba(35, 10, 75, .24), 0 8px 18px rgba(0, 0, 0, .2), 0 0 22px rgba(174, 116, 255, .34);
}
.home-screen-mode .home-recipe-action > i::after { inset: 5px; border-radius: 12px; }
.home-screen-mode .home-recipe-action > i,
.home-screen-mode .home-recipe-action > i i { color: inherit !important; }

/* Small meal, coach and workout action icons use the same visual grammar at
   their native scale instead of becoming unrelated flat squares. */
.home-screen-mode .home-meals-visual { justify-content: center; gap: 10px; }
.home-screen-mode .home-meals-visual span,
.home-screen-mode .home-meals-visual > i {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  color: #ffb9e7;
  background: linear-gradient(145deg, rgba(255, 83, 174, .34), rgba(101, 31, 83, .2));
  font-size: 16px;
}
.home-screen-mode .home-meals-visual span:nth-child(2) {
  color: #ffd08d;
  background: linear-gradient(145deg, rgba(255, 174, 70, .34), rgba(113, 55, 20, .2));
}
.home-screen-mode .home-meals-visual span:nth-child(3) {
  color: #b8eaff;
  background: linear-gradient(145deg, rgba(81, 202, 255, .34), rgba(26, 77, 111, .2));
}
.home-screen-mode .home-meals-visual span > i {
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  font-size: inherit;
}
.home-screen-mode .home-meals-visual span > i::after { display: none; }
.home-screen-mode .home-meals-visual > i { color: #ffd08d; }

.home-screen-mode .home-coach-capabilities li i {
  width: 26px;
  height: 26px;
  flex-basis: 26px;
  border-radius: 9px;
  color: #cfff72;
  background: linear-gradient(145deg, rgba(183, 255, 0, .3), rgba(54, 92, 10, .2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), 0 5px 12px rgba(0, 0, 0, .18), 0 0 13px rgba(183, 255, 0, .2);
}
.home-screen-mode .home-plan-meta i,
.home-screen-mode .home-coach-context > i,
.home-screen-mode .home-coach-example i { color: #bfff35 !important; }

.home-screen-mode .home-workout-action > i {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  color: #ffc4ee !important;
  background: linear-gradient(145deg, rgba(255, 81, 192, .3), rgba(102, 35, 139, .2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .32), 0 5px 12px rgba(0, 0, 0, .18), 0 0 13px rgba(255, 68, 190, .24);
}
.home-screen-mode .home-workout-action-create > i {
  color: var(--ng-lime-ink) !important;
  background: rgba(255, 255, 255, .28);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .52), 0 5px 12px rgba(53, 95, 0, .15);
}

/* Keep the two action surfaces from the previous request: orange primary and
   vivid lime AI secondary, with ink chosen for reliable contrast. */
.home-screen-mode .home-plan-button,
.home-screen-mode .home-meals-cta,
.home-screen-mode .home-coach-action,
.home-screen-mode .home-recipe-actions .home-recipe-action:first-child,
.home-screen-mode .home-workout-action-add,
.home-screen-mode .fasting-cta,
.home-screen-mode .fasting-link,
.home-screen-mode .fasting-outline-button,
.home-screen-mode .food-scan-sticky,
.home-screen-mode .tracker-fab {
  border-color: rgba(255, 222, 164, .82);
  color: var(--ng-orange-ink) !important;
  background: linear-gradient(135deg, var(--ng-orange-bright) 0%, var(--ng-orange-main) 52%, var(--ng-orange-deep) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .48), inset 0 -1px 0 rgba(100, 39, 0, .24), 0 12px 28px rgba(255, 126, 0, .28);
  text-shadow: none;
}
.home-screen-mode .home-workout-action-create,
.home-screen-mode .home-recipe-actions .home-recipe-action:nth-child(2) {
  border-color: rgba(224, 255, 137, .95);
  color: var(--ng-lime-ink) !important;
  background: linear-gradient(135deg, var(--ng-lime-bright) 0%, var(--ng-lime-main) 58%, #8bd900 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .52), inset 0 -1px 0 rgba(45, 91, 0, .24), 0 12px 28px rgba(157, 238, 0, .2);
  text-shadow: none;
}
.home-screen-mode .home-plan-button > i,
.home-screen-mode .home-meals-cta > i,
.home-screen-mode .home-coach-action > i,
.home-screen-mode .home-workout-action-add > i,
.home-screen-mode .fasting-cta > i,
.home-screen-mode .fasting-link > i,
.home-screen-mode .fasting-outline-button > i,
.home-screen-mode .food-scan-sticky > i,
.home-screen-mode .tracker-fab > i { color: var(--ng-orange-ink) !important; }
.home-screen-mode .home-workout-action-create > i,
.home-screen-mode .home-recipe-actions .home-recipe-action:nth-child(2) > i { color: #e6c9ff !important; }
.home-screen-mode .home-recipe-action strong,
.home-screen-mode .home-recipe-action span,
.home-screen-mode .home-workout-action span { text-shadow: none; }
.home-screen-mode .home-recipe-actions .home-recipe-action:first-child strong,
.home-screen-mode .home-recipe-actions .home-recipe-action:first-child span,
.home-screen-mode .home-workout-action-add span { color: var(--ng-orange-ink) !important; }
.home-screen-mode .home-recipe-actions .home-recipe-action:nth-child(2) strong,
.home-screen-mode .home-recipe-actions .home-recipe-action:nth-child(2) span,
.home-screen-mode .home-workout-action-create span { color: var(--ng-lime-ink) !important; }

@media (max-width: 600px) {
  .home-screen-mode .home-recipe-action {
    grid-template-columns: 64px minmax(0, 1fr);
    min-height: 88px;
  }
  .home-screen-mode .home-recipe-action > i {
    width: 54px;
    height: 54px;
  }
}

@media (max-width: 390px) {
  .home-screen-mode .home-recipe-action { grid-template-columns: 58px minmax(0, 1fr); column-gap: 10px; }
  .home-screen-mode .home-recipe-action > i { width: 50px; height: 50px; border-radius: 16px; }
  .home-screen-mode .home-meals-visual span,
  .home-screen-mode .home-meals-visual > i { width: 38px; height: 38px; border-radius: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-screen-mode .home-stat-icon,
  .home-screen-mode .home-workout-icon,
  .home-screen-mode .home-recipe-action > i,
  .home-screen-mode .home-meals-visual span,
  .home-screen-mode .home-meals-visual > i,
  .home-screen-mode .home-coach-capabilities li i,
  .home-screen-mode .home-workout-action > i { transition: none; }
}

/* Activity widget: use the same vivid cyan as the Activity icon in the
   bottom navigation (#12baf5), while preserving the liquid-glass depth. */
.home-screen-mode .home-dashboard-v2 > .home-workout-widget {
  border-color: rgba(18, 186, 245, .72) !important;
  background-image:
    linear-gradient(112deg, rgba(3, 13, 22, .96), rgba(4, 43, 61, .82)),
    url("https://nutriguru.cloud/active1.jpg");
  box-shadow:
    inset 0 1px 0 rgba(190, 244, 255, .2),
    0 12px 30px rgba(0, 0, 0, .24),
    0 0 24px rgba(18, 186, 245, .14);
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget::before {
  border-color: rgba(111, 226, 255, .3) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-eyebrow {
  color: #12baf5 !important;
  text-shadow: 0 0 14px rgba(18, 186, 245, .34);
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-icon {
  border-color: rgba(156, 239, 255, .82) !important;
  color: #9ceeff !important;
  background: linear-gradient(145deg, rgba(18, 186, 245, .42), rgba(10, 82, 125, .28)) !important;
  box-shadow:
    inset 0 1px 0 rgba(232, 251, 255, .48),
    inset 0 -1px 0 rgba(0, 28, 47, .32),
    0 10px 24px rgba(0, 0, 0, .22),
    0 0 24px rgba(18, 186, 245, .34) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-icon::after {
  border-color: rgba(197, 246, 255, .38) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-icon i {
  color: #b8f3ff !important;
  filter: drop-shadow(0 0 7px rgba(18, 186, 245, .42)) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add,
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create {
  border-color: rgba(87, 212, 255, .7) !important;
  color: #e9fbff !important;
  background: linear-gradient(145deg, rgba(18, 186, 245, .48), rgba(5, 103, 153, .3)) !important;
  box-shadow:
    inset 0 1px 0 rgba(232, 251, 255, .34),
    0 9px 25px rgba(0, 0, 0, .2),
    0 0 18px rgba(18, 186, 245, .16) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add span,
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create span {
  color: #e9fbff !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action i {
  border-color: rgba(197, 246, 255, .52) !important;
  color: #d3f8ff !important;
  background: rgba(18, 186, 245, .22) !important;
}

/* The workout card now has one primary action: match the shared orange CTA. */
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create {
  border-color: rgba(255, 205, 128, .88) !important;
  color: #241403 !important;
  background: linear-gradient(135deg, #ffad32, #ff8a00) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .42),
    inset 0 -1px 0 rgba(116, 48, 0, .22),
    0 10px 24px rgba(0, 0, 0, .22),
    0 0 18px rgba(255, 151, 8, .16) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create span {
  color: #241403 !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create i {
  border-color: rgba(116, 48, 0, .28) !important;
  color: #241403 !important;
  background: rgba(255, 255, 255, .22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .34) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create:hover,
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-create:focus-visible {
  border-color: rgba(255, 235, 194, .98) !important;
  background: linear-gradient(135deg, rgba(255, 190, 76, .98), rgba(255, 138, 0, .86)) !important;
}

/* The added ready-workout action uses the same orange CTA treatment. */
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add {
  border-color: rgba(255, 205, 128, .88) !important;
  color: #241403 !important;
  background: linear-gradient(135deg, #ffad32, #ff8a00) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .42),
    inset 0 -1px 0 rgba(116, 48, 0, .22),
    0 10px 24px rgba(0, 0, 0, .22),
    0 0 18px rgba(255, 151, 8, .16) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add span {
  color: #241403 !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add i {
  border-color: rgba(116, 48, 0, .28) !important;
  color: #241403 !important;
  background: rgba(255, 255, 255, .22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .34) !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add:hover,
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-workout-action-add:focus-visible {
  border-color: rgba(255, 235, 194, .98) !important;
  background: linear-gradient(135deg, rgba(255, 190, 76, .98), rgba(255, 138, 0, .86)) !important;
}

/* Workout copy hierarchy: the movement prompt is the main heading, while
   the motivational line becomes a compact cyan kicker beneath it. */
.home-screen-mode .home-dashboard-v2 > .home-workout-widget .home-eyebrow {
  color: #f8fafc !important;
  font-size: 22px !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

.home-screen-mode .home-dashboard-v2 > .home-workout-widget h2 {
  margin-top: 5px !important;
  color: #12baf5 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
}