/* Baseline Food Approach — Diet Log */

#diet-log .grid{ grid-template-columns:1fr; }
#dietLogApp{ min-height:0; }

.diet-log-app,
.diet-log-stack,
.diet-log-main,
.diet-log-side{
  display:grid;
  gap:16px;
}

.diet-log-shell{
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap:16px;
  align-items:start;
}

.diet-log-panel{
  border:1px solid rgba(200,100,50,0.18);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,210,106,0.40), rgba(240,138,36,0.14));
  box-shadow:0 14px 26px -26px rgba(200,100,50,0.18);
  padding:16px;
}

.diet-log-panel-header{ display:grid; gap:10px; margin-bottom:12px; }
.diet-log-panel-header h3,
.diet-entry-group-head h4,
.diet-food-row h4,
.diet-selected-card h4,
.diet-entry-card h5{ margin:0; }

.diet-log-toolbar{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 220px auto;
  gap:10px;
  align-items:end;
}
.diet-log-toolbar--header{ grid-template-columns:180px minmax(0, 1fr); }

.diet-log-view-nav{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.diet-view[hidden]{ display:none !important; }

.diet-field{ display:grid; gap:6px; min-width:0; }
.diet-field--wide{ min-width:0; }
.diet-field label{ font-size:16px; font-weight:850; color:var(--muted); }
.diet-field input,
.diet-field select,
.diet-field textarea,
.diet-static-value{
  width:100%;
  min-width:0;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(122,74,58,0.14);
  font:inherit;
  font-size:16px;
  color:var(--ink);
  background:rgba(255,210,106,0.30);
  outline:none;
}
.diet-field textarea{ resize:vertical; min-height:120px; }
.diet-field input:focus,
.diet-field select:focus,
.diet-field textarea:focus{ box-shadow:0 0 0 4px var(--ring); border-color:rgba(200,100,50,0.28); }

.diet-log-helper-row,
.diet-total-meta,
.diet-entry-group-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.diet-log-helper-row--right{ justify-content:flex-end; }

.diet-inline-note,
.diet-food-copy,
.diet-entry-copy,
.diet-source-line,
.diet-serving-line,
.diet-measure-note{ color:var(--muted); }

.diet-food-list,
.diet-entry-list{ display:grid; gap:12px; }

.diet-food-row,
.diet-entry-card,
.diet-selected-card,
.diet-kpi-card,
.diet-mini-stat{
  border:1px solid rgba(200,100,50,0.18);
  border-radius:16px;
  background:rgba(255,255,255,0.18);
  padding:14px;
  box-shadow:0 12px 22px -22px rgba(35,23,19,0.20);
}

.diet-food-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  align-items:start;
}
.diet-food-row.is-selected{ border-color:rgba(90,12,21,0.42); box-shadow:0 18px 36px -28px rgba(90,12,21,0.28); }
.diet-food-row-copy{ min-width:0; display:grid; gap:8px; }
.diet-food-row-meta{ display:grid; gap:8px; justify-items:end; }

.diet-selected-head,
.diet-entry-main{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}

.diet-food-kicker{ font-size:15px; font-weight:800; color:var(--accent-2); }

.diet-entry-macros,
.diet-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.diet-inline-note,
.diet-entry-macros span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  border:1px solid rgba(200,100,50,0.18);
  background:rgba(255,255,255,0.22);
  font-size:15px;
}

.diet-field-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  margin:12px 0;
}
.diet-field-grid--health{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
.diet-field-grid--recipe-readd{ grid-template-columns:repeat(3, minmax(0, 1fr)); }

.diet-mini-stat-grid,
.diet-kpi-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  margin:12px 0;
}
.diet-mini-stat,
.diet-kpi-card{ display:grid; gap:4px; }
.diet-mini-stat span,
.diet-kpi-card span{ color:var(--muted); font-size:15px; font-weight:760; }
.diet-mini-stat strong,
.diet-kpi-card strong{ font-size:18px; }
.diet-kpi-card small{ color:var(--muted); font-size:14px; }

.diet-nutrient-table-wrap{ overflow:auto; margin-top:12px; }
.diet-nutrient-table{ width:100%; border-collapse:collapse; min-width:460px; }
.diet-nutrient-table th,
.diet-nutrient-table td{ padding:10px 12px; border-bottom:1px solid rgba(200,100,50,0.16); text-align:left; vertical-align:top; }
.diet-nutrient-table th{ color:var(--accent-2); font-size:15px; font-weight:850; }

.diet-recipe-status{ min-height:1.3em; color:var(--accent-2); font-size:15px; font-weight:760; }
.diet-entry-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }

@media (max-width: 1100px){
  .diet-log-shell,
  .diet-log-toolbar,
  .diet-log-toolbar--header{ grid-template-columns:1fr; }
  .diet-log-toolbar--header{ align-items:start; }
}

@media (max-width: 820px){
  .diet-field-grid,
  .diet-field-grid--health,
  .diet-field-grid--recipe-readd,
  .diet-mini-stat-grid,
  .diet-kpi-grid,
  .diet-food-row{ grid-template-columns:1fr; }
  .diet-food-row-meta{ justify-items:start; }
  .diet-selected-head,
  .diet-entry-main{ display:grid; }
}


/* BASELINE-SOLID-SURFACE-CONTRACT-20260527
   Page gradients stay on the page/banner. Cards, recipe controls, account fields,
   panel controls, and sliders use solid opaque colours sampled from each page palette. */
body[data-app="home"]{
  --bl-surface-card-solid:#3d3d43;
  --bl-surface-panel-solid:#47474d;
  --bl-surface-control-solid:#56565f;
  --bl-surface-input-solid:#4f4f58;
  --bl-surface-active-solid:#6a6a74;
  --bl-surface-ink:#f4efe7;
  --bl-slider-track-solid:#47474d;
  --bl-slider-thumb-solid:#9b9baa;
  --bl-slider-border-solid:#2b2b30;
  --bl-home-account-gradient:linear-gradient(90deg,#2f3035 0%,#50515a 30%,#757680 50%,#50515a 70%,#2f3035 100%);
}
body[data-app="food"]{
  --bl-surface-card-solid:#f5b84a;
  --bl-surface-recipe-card-solid:#ffc04d;
  --bl-surface-panel-solid:#e98225;
  --bl-surface-control-solid:#ee942d;
  --bl-surface-input-solid:#ffb13b;
  --bl-surface-active-solid:#c92727;
  --bl-surface-ink:#1b0b09;
  --bl-slider-track-solid:#b11226;
  --bl-slider-thumb-solid:#ffb000;
  --bl-slider-border-solid:#7a1a21;
}
body[data-app="skin"]{
  --bl-surface-card-solid:#d99a82;
  --bl-surface-recipe-card-solid:#d89178;
  --bl-surface-panel-solid:#c87962;
  --bl-surface-control-solid:#cf8167;
  --bl-surface-input-solid:#e0aa94;
  --bl-surface-active-solid:#b8644d;
  --bl-surface-ink:#2b2b28;
  --bl-slider-track-solid:#b8644d;
  --bl-slider-thumb-solid:#edd2c4;
  --bl-slider-border-solid:#7a4a3a;
}
body[data-app="massage"]{
  --bl-surface-card-solid:#aa7854;
  --bl-surface-recipe-card-solid:#b98159;
  --bl-surface-panel-solid:#b7855f;
  --bl-surface-control-solid:#b98159;
  --bl-surface-input-solid:#875d40;
  --bl-surface-active-solid:#c58d62;
  --bl-surface-ink:#24140b;
  --bl-slider-track-solid:#775036;
  --bl-slider-thumb-solid:#d2a078;
  --bl-slider-border-solid:#2f1a0e;
}
body[data-app="fitness"]{
  --bl-surface-card-solid:#130b10;
  --bl-surface-recipe-card-solid:#1d1016;
  --bl-surface-panel-solid:#1d1016;
  --bl-surface-control-solid:#701725;
  --bl-surface-input-solid:#2a1118;
  --bl-surface-active-solid:#9b1a2d;
  --bl-surface-ink:#f6eaf0;
  --bl-slider-track-solid:#2a1118;
  --bl-slider-thumb-solid:#9b1a2d;
  --bl-slider-border-solid:#f6eaf0;
}
body[data-app="badminton"]{
  --bl-surface-card-solid:#efdcfb;
  --bl-surface-recipe-card-solid:#e7cff6;
  --bl-surface-panel-solid:#e1c4f4;
  --bl-surface-control-solid:#d7b7ee;
  --bl-surface-input-solid:#efdcfb;
  --bl-surface-active-solid:#c29cff;
  --bl-surface-ink:#2c123f;
  --bl-slider-track-solid:#6a1fb3;
  --bl-slider-thumb-solid:#f08b2f;
  --bl-slider-border-solid:#2c123f;
}
body[data-app="games"]{
  --bl-surface-card-solid:#a5714d;
  --bl-surface-recipe-card-solid:#b9825c;
  --bl-surface-panel-solid:#b9825c;
  --bl-surface-control-solid:#bd875f;
  --bl-surface-input-solid:#7f5538;
  --bl-surface-active-solid:#d1a67e;
  --bl-surface-ink:#24140b;
  --bl-slider-track-solid:#623f28;
  --bl-slider-thumb-solid:#d8af86;
  --bl-slider-border-solid:#24140b;
}

/* Index header Account button: deliberately grey-gradient, tied to the grey header, with clear white text. */
body[data-app="home"] #bl-auth-toggle{
  background:var(--bl-home-account-gradient)!important;
  background-image:var(--bl-home-account-gradient)!important;
  background-color:#50515a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border-color:#9a9aa6!important;
  box-shadow:0 14px 28px -22px rgba(0,0,0,.55)!important;
}
body[data-app="home"] #bl-auth-toggle .bl-btn-label,
body[data-app="home"] #bl-auth-toggle .bl-btn-icon{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;}

/* Cards and panels: solid opaque surfaces on system pages, never translucent or gradient-filled. */
body:not([data-app="home"]) .card,
body:not([data-app="home"]) .method-card,
body:not([data-app="home"]) .logic-card,
body:not([data-app="home"]) .session-card,
body:not([data-app="home"]) .summary-box,
body:not([data-app="home"]) .progress-shell,
body:not([data-app="home"]) .empty-box,
body:not([data-app="home"]) .skill-item,
body:not([data-app="home"]) .game-summary-details,
body:not([data-app="home"]) .game-summary-body,
body:not([data-app="home"]) .formula-box,
body:not([data-app="home"]) .word-box,
body:not([data-app="home"]) .ninja-box,
body:not([data-app="home"]) .trackcoin-stat-card,
body:not([data-app="home"]) .realm-window,
body:not([data-app="home"]) .realm-drawer,
body:not([data-app="home"]) .realm-spirit-card,
body:not([data-app="home"]) .realm-stat-chip,
body:not([data-app="home"]) .realm-manage-card,
body:not([data-app="home"]) .system-section-card,
body:not([data-app="home"]) .system-panel,
body:not([data-app="home"]) .court-card,
body:not([data-app="home"]) .status-box,
body:not([data-app="home"]) .diet-log-panel,
body:not([data-app="home"]) .diet-food-row,
body:not([data-app="home"]) .diet-entry-card,
body:not([data-app="home"]) .diet-selected-card,
body:not([data-app="home"]) .diet-kpi-card,
body:not([data-app="home"]) .diet-mini-stat{
  background-image:none!important;
  background-color:var(--bl-surface-card-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* Recipe area: warmer/deeper solid cards and solid controls, no internal gradients. */
body[data-app] #recipes .card,
body[data-app] #recipes .recipe.card,
body[data-app] #recipes-landing.card,
body[data-app] #recipes .recipe-page,
body[data-app] #recipes .side-recipe-nav,
body[data-app] #recipes .scale-tools,
body[data-app] .recipe.card{
  background-image:none!important;
  background-color:var(--bl-surface-recipe-card-solid,var(--bl-surface-card-solid))!important;
  opacity:1!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body[data-app] #recipes .multiplier,
body[data-app] #recipes .filter-bar,
body[data-app] #recipes .glide-controller,
body[data-app] #recipes .scale-block,
body[data-app] #recipes .variant-switcher,
body[data-app] #recipes .recipe-controls{
  background-image:none!important;
  background-color:var(--bl-surface-panel-solid)!important;
  border-color:var(--border,var(--showall-border,rgba(0,0,0,.18)))!important;
  opacity:1!important;
  box-shadow:none!important;
}
body[data-app] #recipes .back-btn,
body[data-app] #recipes .print-btn,
body[data-app] #recipes .scale-toggle,
body[data-app] #recipes .scale-apply,
body[data-app] #recipes .multiplier button,
body[data-app] #recipes .ingredient-recipe-link a,
body[data-app] #recipes .action,
body[data-app] #recipes button,
body[data-app] #recipes .bl-number-stepper .bl-step,
body[data-app] #recipes .bl-select-btn,
body[data-app] #recipes .bl-select-menu [role="option"]{
  background-image:none!important;
  background-color:var(--bl-surface-control-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:var(--showall-border,var(--border,rgba(0,0,0,.18)))!important;
  opacity:1!important;
  box-shadow:none!important;
}
body[data-app] #recipes input:not([type="range"]),
body[data-app] #recipes select,
body[data-app] #recipes textarea,
body[data-app] #recipes .scale-tools input,
body[data-app] #recipes .scale-tools select,
body[data-app] #recipes .multiplier input,
body[data-app] #recipes .multiplier select{
  background-image:none!important;
  background-color:var(--bl-surface-input-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:var(--border-2,var(--border,rgba(0,0,0,.18)))!important;
  opacity:1!important;
  box-shadow:none!important;
}
body[data-app] #recipes .bl-select-menu,
body[data-app] #recipes .scale-tools{
  background-image:none!important;
  background-color:var(--bl-surface-panel-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
}

/* Account + Binaural flyouts: solid panels and solid fields/buttons from current page palette. */
body[data-app] #bl-auth-flyout .card,
body[data-app] #bl-beats-flyout .card,
body[data-app] .bl-flyout .card{
  background-image:none!important;
  background-color:var(--bl-surface-card-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  opacity:1!important;
  mix-blend-mode:normal!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body[data-app] #bl-auth-flyout .bl-auth-input-shell,
body[data-app] #bl-auth-flyout input:not([type="range"]),
body[data-app] #bl-auth-flyout select,
body[data-app] #bl-auth-flyout textarea,
body[data-app] #bl-beats-flyout input:not([type="range"]),
body[data-app] #bl-beats-flyout select,
body[data-app] #bl-beats-flyout textarea,
body[data-app] .bl-flyout input:not([type="range"]),
body[data-app] .bl-flyout select,
body[data-app] .bl-flyout textarea{
  background-image:none!important;
  background-color:var(--bl-surface-input-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  caret-color:currentColor!important;
  border-color:var(--border-2,var(--border,rgba(0,0,0,.18)))!important;
  opacity:1!important;
  box-shadow:none!important;
}
body[data-app] #bl-auth-flyout .bl-auth-input-shell > input,
body[data-app] #bl-auth-flyout .bl-auth-input-shell > input:not([type="range"]){
  background:transparent!important;
  background-image:none!important;
  background-color:transparent!important;
}
body[data-app] #bl-auth-flyout .bl-mini-btn,
body[data-app] #bl-auth-flyout button,
body[data-app] #bl-beats-flyout .bl-mini-btn,
body[data-app] #bl-beats-flyout button,
body[data-app] .bl-flyout .bl-select-btn,
body[data-app] .bl-flyout .bl-select-menu [role="option"]{
  background-image:none!important;
  background-color:var(--bl-surface-control-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:var(--showall-border,var(--border,rgba(0,0,0,.18)))!important;
  opacity:1!important;
  box-shadow:none!important;
}
body[data-app] .bl-flyout .bl-select-menu{
  background-image:none!important;
  background-color:var(--bl-surface-panel-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
}

/* General page controls: solid tones from the page palette, not gradients. */
body:not([data-app="home"]) input:not([type="range"]),
body:not([data-app="home"]) select,
body:not([data-app="home"]) textarea,
body:not([data-app="home"]) .text-input,
body:not([data-app="home"]) .diet-static-value{
  background-image:none!important;
  background-color:var(--bl-surface-input-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:var(--border-2,var(--border,rgba(0,0,0,.18)))!important;
}
body:not([data-app="home"]) .action,
body:not([data-app="home"]) button.action,
body:not([data-app="home"]) .tab,
body:not([data-app="home"]) .game-toggle-btn,
body:not([data-app="home"]) .tier-btn,
body:not([data-app="home"]) .stat-pill,
body:not([data-app="home"]) .trait-chip,
body:not([data-app="home"]) .solution-box,
body:not([data-app="home"]) .clue-bar,
body:not([data-app="home"]) .number-chip,
body:not([data-app="home"]) .letter-cell,
body:not([data-app="home"]) .metric-chip,
body:not([data-app="home"]) .gameplan-subtab,
body:not([data-app="home"]) .diet-inline-note,
body:not([data-app="home"]) .diet-entry-macros span{
  background-image:none!important;
  background-color:var(--bl-surface-control-solid)!important;
  color:var(--ink,var(--bl-surface-ink,#111))!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:var(--showall-border,var(--border,rgba(0,0,0,.18)))!important;
}
body:not([data-app="home"]) .tab[aria-selected="true"],
body:not([data-app="home"]) .game-toggle-btn.is-active,
body:not([data-app="home"]) .tier-btn.active,
body:not([data-app="home"]) .gameplan-subtab[aria-selected="true"]{
  background-image:none!important;
  background-color:var(--bl-surface-active-solid)!important;
}

/* Sliders: remove browser blue/white defaults and use page-local solid colours. */
body[data-app] input[type="range"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:100%!important;
  height:24px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  background-image:none!important;
  color:var(--bl-slider-thumb-solid)!important;
  accent-color:var(--bl-slider-thumb-solid)!important;
  cursor:pointer!important;
}
body[data-app] input[type="range"]::-webkit-slider-runnable-track{
  height:12px!important;
  border-radius:999px!important;
  background:var(--bl-slider-track-solid)!important;
  border:1px solid var(--bl-slider-border-solid)!important;
  box-shadow:none!important;
}
body[data-app] input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:24px!important;
  height:24px!important;
  margin-top:-7px!important;
  border-radius:50%!important;
  border:2px solid var(--bl-slider-border-solid)!important;
  background:var(--bl-slider-thumb-solid)!important;
  box-shadow:none!important;
}
body[data-app] input[type="range"]::-moz-range-track{
  height:12px!important;
  border-radius:999px!important;
  background:var(--bl-slider-track-solid)!important;
  border:1px solid var(--bl-slider-border-solid)!important;
  box-shadow:none!important;
}
body[data-app] input[type="range"]::-moz-range-thumb{
  width:24px!important;
  height:24px!important;
  border-radius:50%!important;
  border:2px solid var(--bl-slider-border-solid)!important;
  background:var(--bl-slider-thumb-solid)!important;
  box-shadow:none!important;
}
body[data-app] input[type="range"]::-moz-range-progress{
  height:12px!important;
  border-radius:999px!important;
  background:var(--bl-surface-active-solid)!important;
}
body[data-app] input::placeholder,
body[data-app] textarea::placeholder{
  color:color-mix(in srgb, var(--ink,var(--bl-surface-ink,#111)) 70%, transparent)!important;
  -webkit-text-fill-color:color-mix(in srgb, var(--ink,var(--bl-surface-ink,#111)) 70%, transparent)!important;
  opacity:1!important;
}
body[data-app] input:-webkit-autofill,
body[data-app] input:-webkit-autofill:hover,
body[data-app] input:-webkit-autofill:focus,
body[data-app] textarea:-webkit-autofill,
body[data-app] select:-webkit-autofill{
  -webkit-text-fill-color:var(--ink,var(--bl-surface-ink,#111))!important;
  box-shadow:0 0 0 1000px var(--bl-surface-input-solid) inset!important;
  transition:background-color 99999s ease-out 0s!important;
}
/* END BASELINE-SOLID-SURFACE-CONTRACT-20260527 */

