/* Stable mobile navigation and touch feedback. Loaded last on purpose. */
.route-header,.screen-header,.simple-header{
  box-sizing:border-box!important;
  height:calc(var(--safe-top) + 64px)!important;
  min-height:calc(var(--safe-top) + 64px)!important;
  padding:var(--safe-top) 16px 0!important;
  overflow:visible!important;
}
.route-header{
  grid-template-columns:48px minmax(0,1fr) 48px!important;
  align-items:center!important;
  border-bottom:1px solid #dbe1e6!important;
}
.route-content{top:calc(var(--safe-top) + 64px)!important;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
.route-view[data-route="product-scanner"]{overflow:hidden!important}
.route-view[data-route="product-scanner"] .route-header{grid-template-columns:minmax(0,1fr)!important;padding-left:20px!important;padding-right:20px!important;overflow:hidden!important}
.route-view[data-route="product-scanner"] .route-header h1{grid-column:1!important;width:100%!important;padding:0!important;text-align:center!important;overflow:visible!important;text-overflow:clip!important}
.route-view[data-route="product-scanner"] .route-header>button{display:none!important}
.route-view[data-route="product-scanner"] .route-content{width:100%!important;max-width:100vw!important;overflow-x:hidden!important;overscroll-behavior-x:none!important;touch-action:pan-y;padding-bottom:calc(112px + var(--safe-bottom))!important}
.route-view[data-route="product-scanner"] .scanner-panel,.route-view[data-route="product-scanner"] .scanner-camera-window,.route-view[data-route="product-scanner"] [data-product-result],.route-view[data-route="product-scanner"] .nutrition-result,.route-view[data-route="product-scanner"] .scanner-history{width:100%!important;max-width:100%!important;min-width:0!important}
.route-view[data-route="product-scanner"] .nutrition-result{box-sizing:border-box!important;overflow:hidden!important}
.route-view[data-route="product-scanner"] .nutrition-result>*,.route-view[data-route="product-scanner"] .nutrition-result dl,.route-view[data-route="product-scanner"] .nutrition-result dl>div,.route-view[data-route="product-scanner"] .bf360-food-assessment,.route-view[data-route="product-scanner"] .bf360-food-assessment>*{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
.route-view[data-route="product-scanner"] .nutrition-result dl{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.route-view[data-route="product-scanner"] .nutrition-result dd{overflow-wrap:anywhere!important;font-size:clamp(.92rem,4vw,1.08rem)!important;line-height:1.2!important}
.route-view[data-route="product-scanner"] .bf360-food-assessment{width:100%!important;margin-left:0!important;margin-right:0!important;overflow:hidden!important}
.route-view[data-route="product-scanner"] .bf360-food-assessment header>div:last-child{overflow-wrap:anywhere!important}
.route-view[data-route="product-scanner"] .assessment-components{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.route-view[data-route="product-scanner"] .assessment-components span{min-width:0!important;overflow-wrap:anywhere!important}
.route-view[data-route="product-scanner"].scanner-result-open:has([data-product-result] .nutrition-result) .scanner-panel,.route-view[data-route="product-scanner"].scanner-result-open:has([data-product-result] .nutrition-result) .scanner-history,.route-view[data-route="product-scanner"].scanner-result-open:has([data-product-result] .nutrition-result)>.route-content>.nutrition-attribution{display:none!important}
.route-view[data-route="product-scanner"].scanner-result-open [data-product-result]{display:block!important}
.product-result-close{position:sticky!important;top:0!important;z-index:5!important;width:52px!important;height:52px!important;min-width:52px!important;min-height:52px!important;margin:0 0 18px 0!important;padding:0!important;display:grid!important;place-items:center!important;border:1px solid #dce3e8!important;border-radius:50%!important;background:#f3f6f8!important;color:#172631!important;box-shadow:0 7px 20px rgba(18,59,97,.09)!important}
.product-result-close i{font-size:1.55rem!important}.product-result-close:active{transform:scale(.97)!important}
.training-content{top:calc(var(--safe-top) + 64px)!important}
#view-manual .manual-grid,#view-more .more-list{top:calc(var(--safe-top) + 64px)!important}
#view-messages .messages{top:calc(var(--safe-top) + 64px)!important}
.screen-header>.icon-button,.simple-header>.icon-button{
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  width:44px!important;
  height:44px!important;
  margin:0!important;
  align-self:center!important;
  flex:none!important;
}
.route-header button{
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  width:44px!important;
  height:44px!important;
  margin:0!important;
  border-radius:14px!important;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.route-header>button:first-child,
.screen-header>.icon-button:first-child,
.simple-header>.icon-button:first-child{
  width:46px!important;
  height:46px!important;
  border:1px solid #d8e0e6!important;
  border-radius:50%!important;
  background:linear-gradient(145deg,#fff 0%,#f1f5f7 100%)!important;
  color:#17212a!important;
  box-shadow:0 3px 10px rgba(22,34,45,.09)!important;
}
.route-header>button:first-child i,
.screen-header>.icon-button:first-child i,
.simple-header>.icon-button:first-child i{font-size:1.45rem!important;line-height:1!important}
.route-header>button:first-child:active,
.screen-header>.icon-button:first-child:active,
.simple-header>.icon-button:first-child:active{
  transform:scale(.94)!important;
  background:#e8eef2!important;
  box-shadow:0 1px 4px rgba(22,34,45,.12)!important;
}
.route-header h1{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 8px}
.route-content .day-summary{background:#f3f7f8!important;border-color:#d6e0e5!important;box-shadow:0 8px 22px rgba(29,55,69,.07)!important}
.route-content .day-summary small{color:#677681!important}
.route-content .day-summary b{color:#17232d!important}
.route-content .day-summary strong{color:#087f85!important;font-weight:750!important}
.route-content .day-summary .ring{color:#17232d!important;background:#fff!important;border-color:#efb9bd!important}

/* Todas las superficies funcionales reutilizadas deben respetar el tema claro. */
.app-shell .history-summary,
.app-shell .workout-log,
.app-shell .set-history-row,
.app-shell .offline-card,
.app-shell .superset-help,
.app-shell .route-calendar-note,
.app-shell .notice-card,
.app-shell .metric-section,
.app-shell .stats-grid article,
.app-shell .account-note,
.app-shell .nutrition-summary{
  background:#f5f8f9!important;
  border-color:#d6e0e5!important;
  color:#17232d!important;
  box-shadow:0 6px 18px rgba(29,55,69,.05)!important;
}
.app-shell .history-summary small,
.app-shell .workout-log p,
.app-shell .set-history-row small,
.app-shell .offline-card p,
.app-shell .offline-card small,
.app-shell .superset-help,
.app-shell .route-calendar-note,
.app-shell .notice-card p,
.app-shell .nutrition-summary p{color:#65747e!important}
.app-shell .history-summary b,
.app-shell .notice-card b,
.app-shell .metric-section h2,
.app-shell .stats-grid h3,
.app-shell .nutrition-summary h2{color:#17232d!important}
.route-row,.more-list>button,.exercise-row,.supplement-picker-row,[data-route]{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.app-shell .route-row:active,.app-shell [data-route]:active{background:transparent!important;color:inherit!important}
.app-shell .route-row:active span,.app-shell .route-row:active span small{color:inherit!important}
.app-shell .route-row.route-tap-active,.app-shell [data-route].route-tap-active{background:#edf3f6!important}
.route-row,.exercise-row,.supplement-picker-row,.recipe-ready-card{content-visibility:auto;contain-intrinsic-size:auto 72px}
@media (max-width:700px){.bottom-nav,.screen-header,.simple-header,.route-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}
@media (prefers-reduced-motion:reduce){.app-shell *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
.route-view .route-header{position:relative;z-index:220!important;pointer-events:auto!important}
.route-view #routeBack{position:relative;z-index:230!important;pointer-events:auto!important;touch-action:manipulation!important}
