/* BRAND RUNTIME R1: additive T01/P02/G08 foundations. Business tokens stay unchanged. */
:root {
  --ce-r1-bg: #F5F7F3;
  --ce-r1-surface: #FFFEFA;
  --ce-r1-surface-alt: #E5EEF0;
  --ce-r1-text: #213A3B;
  --ce-r1-muted: #526567;
  --ce-r1-primary: #DCE9E6;
  --ce-r1-primary-strong: #315D55;
  --ce-r1-secondary: #F4D8C8;
  --ce-r1-accent: #A94D36;
  --ce-r1-border: #75898A;
  --ce-r1-success: #2E684C;
  --ce-r1-warning: #725300;
  --ce-r1-danger: #9F3433;
  --ce-r1-on-primary: #FFFFFF;
  --ce-r1-focus: #315D55;
  --ce-r1-disabled-bg: #E5EEF0;
  --ce-r1-disabled-text: #526567;
  --ce-r1-disabled-border: #75898A;
  --ce-r1-reverse-surface: #213A3B;
  --ce-r1-reverse-text: #FFFEFA;
  --ce-r1-reverse-muted: #DCE9E6;
  --ce-r1-reverse-focus: #FFFEFA;
  /* Paints below belong only to the master, never to UI states. */
  --ce-r1-mark-peach: #FBB99B;
  --ce-r1-mark-blue: #B5D4DC;
  --ce-r1-mark-teal: #80ACAC;
  --ce-r1-wordmark-link: #C55D45;
  --ce-r1-font-heading: "Aptos Display", "Segoe UI Variable", "Segoe UI", sans-serif;
  --ce-r1-font-body: "Aptos", "Segoe UI", sans-serif;
  --ce-r1-font-ui: "Aptos", "Segoe UI", sans-serif;
  --ce-r1-type-hero: 48px;
  --ce-r1-type-title: 34px;
  --ce-r1-type-section: 24px;
  --ce-r1-type-label: 18px;
  --ce-r1-type-body: 16px;
  --ce-r1-weight-heading: 650;
  --ce-r1-weight-emphasis: 750;
  --ce-r1-weight-body: 400;
  --ce-r1-weight-ui: 600;
  --ce-r1-leading-hero: 1.08;
  --ce-r1-leading-title: 1.15;
  --ce-r1-leading-ui: 1.25;
  --ce-r1-leading-body: 1.58;
  --ce-r1-tracking-heading: -0.02em;
  --ce-r1-radius-card: 10px;
  --ce-r1-radius-button: 8px;
  --ce-r1-border-width: 1px;
  --ce-r1-shadow: 0 2px 8px rgb(33 58 59 / 6%);
  --ce-r1-rhythm: 1.4;
}

/* Both shells consume these rules and the exact same static files. */
.ce-brand-shell {
  --ce-color-ink: var(--ce-r1-text);
  --ce-color-ink-muted: var(--ce-r1-muted);
  --ce-color-surface: var(--ce-r1-surface);
  --ce-color-border: var(--ce-r1-border);
  --ce-color-border-strong: var(--ce-r1-border);
  --ce-color-primary: var(--ce-r1-primary-strong);
  --ce-color-primary-hover: var(--ce-r1-primary-strong);
  --ce-color-on-primary: var(--ce-r1-on-primary);
  --ce-color-focus: var(--ce-r1-focus);
  --ce-radius-md: var(--ce-r1-radius-card);
  --ce-shadow-raised: var(--ce-r1-shadow);
  font-family: var(--ce-r1-font-ui);
  font-size: var(--ce-r1-type-body);
  line-height: var(--ce-r1-leading-body);
}
.ce-brand-lockup {
  display: inline-flex;
  flex: 0 1 auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  max-width: 100%;
  vertical-align: middle;
}
.ce-brand-mark {
  --ce-mark-height: 32px;
  display: inline-flex;
  box-sizing: content-box;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: calc(var(--ce-mark-height) * 1897 / 632);
  height: var(--ce-mark-height);
  padding: calc(var(--ce-mark-height) * .25);
}
.ce-brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  aspect-ratio: 1897 / 632;
  object-fit: contain;
}
.ce-brand-mark--large { --ce-mark-height: 40px; }
.ce-brand-mark__fallback { font: 600 12px/1.25 var(--ce-r1-font-ui); }
.ce-brand-wordmark {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  font-family: "Aptos Display", "Segoe UI", sans-serif;
  font-size: 24px;
  font-weight: 670;
  letter-spacing: -1px;
  line-height: 1;
  white-space: nowrap;
}
.ce-brand-wordmark__link {
  position: absolute;
  left: 52%;
  bottom: -.24em;
  width: 20%;
  height: .28em;
  overflow: visible;
  pointer-events: none;
}
.ce-brand-icon {
  display: inline-block;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background-color: currentColor;
  mask: var(--ce-icon-source) center / contain no-repeat;
  vertical-align: middle;
}
.ce-brand-icon--recipes { --ce-icon-source: url('cookeat-icon-recipes-BR1A0108.svg'); }
.ce-brand-icon--instants { --ce-icon-source: url('cookeat-icon-instants-BR1A0108.svg'); }
.ce-brand-icon--fridge { --ce-icon-source: url('cookeat-icon-fridge-BR1A0108.svg'); }
.ce-brand-icon--settings { --ce-icon-source: url('cookeat-icon-settings-BR1A0108.svg'); }
.ce-brand-icon--profile { --ce-icon-source: url('cookeat-icon-profile-BR1A0108.svg'); }
.ce-brand-icon--add { --ce-icon-source: url('cookeat-icon-add-BR1A0108.svg'); }
.ce-brand-shell app-brand-icon { display: inline-flex; align-items: center; }
.ce-brand-shell :is(a, button):focus-visible,
.ce-brand-shell :is(a, button):focus {
  outline: 3px solid var(--ce-r1-focus) !important;
  outline-offset: 3px;
}
.ce-brand-shell button:disabled {
  background: var(--ce-r1-disabled-bg);
  color: var(--ce-r1-disabled-text);
  border-color: var(--ce-r1-disabled-border);
  cursor: not-allowed;
  opacity: 1;
}
.ce-brand-shell nav a, .ce-brand-shell nav button {
  gap: 8px;
  font-family: var(--ce-r1-font-ui);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
}
.ce-brand-shell--reverse {
  --ce-r1-focus: var(--ce-r1-reverse-focus);
  color: var(--ce-r1-reverse-text);
  background: var(--ce-r1-reverse-surface);
}

/* The legacy bridge below touches only the four active shell includes. */
.cookeat-legacy > header.ce-brand-shell {
  background: var(--ce-r1-surface);
  box-shadow: var(--ce-r1-shadow);
  border-bottom: 1px solid var(--ce-r1-border);
}
.cookeat-legacy .ce-brand-shell .legacy-brand-link {
  min-height: 72px;
  margin-right: 12px;
  color: var(--ce-r1-text);
}
.cookeat-legacy .ce-brand-shell .ce-brand-mark img { width: 100%; height: 100%; }
.cookeat-legacy .ce-brand-shell .navbar-nav > li > a,
.cookeat-legacy .ce-brand-shell .dropdown-menu > li > a,
.cookeat-legacy .ce-brand-shell .legacy-account-menu__action {
  color: var(--ce-r1-muted);
  font: 600 16px/1.25 var(--ce-r1-font-ui);
}
.cookeat-legacy .ce-brand-shell .navbar-nav > li > .menu-icon {
  display: flex;
  min-width: 72px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding-inline: 8px;
}
.cookeat-legacy .ce-brand-shell .navbar-nav > .active > a,
.cookeat-legacy .ce-brand-shell .navbar-nav > .open > a {
  color: var(--ce-r1-primary-strong);
  background: var(--ce-r1-primary);
  box-shadow: inset 0 -2px 0 var(--ce-r1-primary-strong);
}
.cookeat-legacy .ce-brand-shell .navbar-toggle,
.cookeat-legacy .ce-brand-shell .btn { border-radius: var(--ce-r1-radius-button); }
.cookeat-legacy .ce-brand-shell .dropdown-menu { border-radius: var(--ce-r1-radius-card); }
.cookeat-legacy .ce-brand-shell .header-profile-image--fallback { background: var(--ce-r1-primary); }
.cookeat-legacy > footer.ce-brand-shell { background: var(--ce-r1-reverse-surface); }
.cookeat-legacy .ce-brand-shell .legacy-footer__lockup { color: var(--ce-r1-reverse-text); }
.cookeat-legacy .ce-brand-shell .legacy-footer__brand { float: none; }
.cookeat-legacy .ce-brand-shell .legacy-footer__inner::before,
.cookeat-legacy .ce-brand-shell .legacy-footer__inner::after { display: none; }
.cookeat-legacy .ce-brand-shell .legacy-footer__brand p,
.cookeat-legacy .ce-brand-shell .legacy-footer__copyright,
.cookeat-legacy .ce-brand-shell .legacy-footer__version { color: var(--ce-r1-reverse-muted); }
.cookeat-legacy .ce-brand-shell .legacy-trust-links a { color: var(--ce-r1-reverse-text); font-weight: 600; }
.cookeat-legacy .ce-brand-shell .legacy-mobile-footer__navigation > a {
  color: var(--ce-r1-reverse-muted);
  font: 600 16px/1.25 var(--ce-r1-font-ui);
}
.cookeat-legacy .ce-brand-shell .legacy-mobile-footer__navigation > a.active {
  color: var(--ce-r1-text);
  background: var(--ce-r1-primary);
  box-shadow: inset 0 3px 0 var(--ce-r1-border);
}
.legacy-skip-link { background: var(--ce-r1-primary-strong); border-radius: var(--ce-r1-radius-button); }
@media (min-width: 1200px) {
  .ce-brand-lockup .ce-brand-mark { --ce-mark-height: 40px; }
  .ce-brand-wordmark { font-size: 28px; }
}
@media (max-width: 767px) {
  .cookeat-legacy .ce-brand-shell .legacy-brand-link--mark { flex: 0 0 auto; margin-right: 0; }
  .cookeat-legacy .ce-brand-shell .legacy-route-title { display: none; }
  .cookeat-legacy .ce-brand-shell .navbar-toggle { order: 2; margin-left: auto; }
  .cookeat-legacy .ce-brand-shell .legacy-mobile-header__inner { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .ce-brand-shell *, .ce-brand-shell *::before, .ce-brand-shell *::after { transition: none !important; animation: none !important; }
}
@media (forced-colors: active) {
  .ce-brand-shell { --ce-r1-focus: Highlight; }
  .ce-brand-icon { forced-color-adjust: none; background-color: CanvasText; }
  .ce-brand-wordmark__link path { stroke: CanvasText; }
  .ce-brand-shell [aria-current='page'] { outline: 1px solid CanvasText; }
}
