/* Scoped layout overrides preserve the existing activity data and actions. */
body[data-page="activity"]:is([data-activity-section="routine"], [data-activity-section="workouts"], [data-activity-section="food"], [data-activity-section="plans"]),
body[data-page="plans"] { background: #141619 !important; }

:is(#routine, #workouts, #food, #plans) {
    --sx-radius: 8px;
    background: #141619 !important;
    padding-top: 88px !important;
    color: #f2f3f5;
}
:is(#routine, #workouts, #food, #plans) .sec-container {
    width: 100%;
    max-width: 1120px !important;
    margin-inline: auto;
    padding: 0 24px 130px !important;
}
:is(#routine, #workouts, #food, #plans) .sec-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    text-align: left !important;
    padding: 8px 0 20px !important;
    margin: 0 !important;
    min-height: 0 !important;
    opacity: 1;
    transform: none;
}
:is(#routine, #workouts, #food, #plans) .sec-header h2 {
    font-size: 28px !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    color: #f2f3f5 !important;
    margin: 0 !important;
    text-shadow: none !important;
}
:is(#routine, #workouts, #food, #plans) .sec-header p,
:is(#routine, #workouts, #food, #plans) .sec-header::after,
:is(#routine, #workouts, #food, #plans) .wave-div { display: none !important; }
:is(#routine, #workouts, #food, #plans) .sec-header-top-row { margin: 0; min-width: 0; flex: 1; justify-content: flex-start; text-align: left; }
:is(#routine, #workouts, #food, #plans) :is(button, input, h3, .stat-val, .stat-label) { letter-spacing: 0 !important; }
:is(#routine, #workouts, #food, #plans) button { touch-action: manipulation; }
:is(#routine, #workouts, #food, #plans) :is(button, input, select):focus-visible {
    outline: 2px solid #f3c54d;
    outline-offset: 3px;
}
:is(#routine, #workouts, #food, #plans) :is(.rtn-tabs, .wkt-icon-tabs, .fnt-tabs, .pln-tab-bar) {
    margin: 0 0 20px;
    gap: 0;
    border-bottom: 1px solid #393c43;
}
:is(#routine, #workouts, #food, #plans) :is(.rtn-tab, .wkt-icon-tab, .fnt-tab, .pln-tab) {
    min-height: 48px;
    min-width: 0;
    font-size: 14px;
}
:is(#routine, #workouts, #food) :is(.rtn-tab-label, .wkt-tab-label, .fnt-tab-label) {
    min-height: 44px;
    font-size: inherit;
    padding-inline: 6px;
}
#workouts #wktTodayEmpty {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 0 20px;
}
#workouts .wkt-today-empty-msg { text-align: left; margin: 0; font-size: 15px; }
#workouts .wkt-today-cta-row { margin: 0; flex: 0 0 auto; }
#workouts .wkt-cta-primary { min-height: 44px; border-radius: 8px !important; padding: 10px 20px !important; }
:is(#routine, #workouts, #food) .routine-search-wrap { margin: 0 0 16px; }
:is(#routine, #workouts, #food) .rtn-search-add-row { display: flex; gap: 10px; }
:is(#routine, #workouts, #food) .routine-search-inner { min-width: 0; flex: 1; border-radius: 8px !important; }
:is(#routine, #workouts, #food) .routine-search-input { min-width: 0; font-size: 16px !important; min-height: 44px; }
:is(#routine, #workouts, #food) .rtn-add-lib-btn-inline { flex: 0 0 76px !important; min-height: 44px; }
:is(#workouts, #food, #plans) :is(.new-workout-grid, .new-food-grid, .new-plan-grid) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}
:is(#workouts, #food, #plans) :is(.wo-card, .fo-card, .pln-goal-card) {
    min-width: 0;
    border: 1px solid #393c43 !important;
    border-radius: 8px !important;
    background: #202328 !important;
    box-shadow: none !important;
    color: #f2f3f5;
    overflow-wrap: anywhere;
}
:is(#workouts, #food) :is(.wo-card, .fo-card):hover { transform: none; }
:is(#workouts, #food) :is(.wo-card:not(.wo-has-image), .fo-card:not(.fo-has-image)) { padding: 18px; text-align: left; }
#workouts .wo-card h3 { font-size: 17px; }
#workouts .wo-card ul li { font-size: 14px; line-height: 1.6; }
#plans .pln-hero { background: none; border: 0; border-radius: 0; padding: 0 0 20px; }
#plans #plnGoalList { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
#plans .pln-goal-card { margin: 0; }
#food .fnt-cal-summary { border-radius: 8px; background: #202328; }
#food .fnt-food-del { min-width: 44px; min-height: 44px; }
#food .fnt-food-name { white-space: normal; overflow-wrap: anywhere; }
#routine .new-timeline { max-width: 880px; margin-inline: auto; }
#routine .tl-content { background: #202328 !important; border: 1px solid #393c43 !important; border-radius: 8px !important; box-shadow: none !important; }

@media (max-width: 850px) {
    :is(#workouts, #food, #plans) :is(.new-workout-grid, .new-food-grid, .new-plan-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 540px) {
    :is(#routine, #workouts, #food, #plans) { padding-top: 80px !important; }
    :is(#routine, #workouts, #food, #plans) .sec-container { padding-inline: 16px !important; }
    :is(#routine, #workouts, #food, #plans) .sec-header { padding-bottom: 12px !important; }
    :is(#routine, #workouts, #food, #plans) .sec-header h2 { font-size: 24px !important; }
    :is(#routine, #workouts, #food, #plans) :is(.rtn-tab, .wkt-icon-tab, .fnt-tab, .pln-tab) { font-size: 12px; }
    :is(#workouts, #food, #plans) :is(.new-workout-grid, .new-food-grid, .new-plan-grid), #plans #plnGoalList { grid-template-columns: minmax(0, 1fr); }
    #workouts #wktTodayEmpty { align-items: stretch; flex-direction: column; gap: 10px; }
    #workouts .wkt-cta-primary { width: 100%; }
}

/* Keep the page title on the same 54px row as the fixed navigation buttons.
   Explicit page specificity also overrides the older inline mobile header rules. */
body[data-page] :is(#routine, #workouts, #food, #plans).full-section {
    padding-top: 10px !important;
}
body[data-page] :is(#routine, #workouts, #food, #plans).full-section > .sec-container > .sec-header {
    min-height: 54px !important;
    padding: 0 clamp(0px, calc(72px - (100vw - 1120px) / 2), 64px) !important;
    margin-bottom: 20px !important;
}
@media (max-width: 768px) {
    body[data-page] :is(#routine, #workouts, #food, #plans).full-section {
        padding-top: 0 !important;
    }
    body[data-page] :is(#routine, #workouts, #food, #plans).full-section > .sec-container > .sec-header {
        padding: 0 64px !important;
        margin-bottom: 16px !important;
    }
}