@import '_content/Fitly.Shared.Views/Fitly.Shared.Views.vu9b8bkdnj.bundle.scp.css';

/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
.settings-subpage[b-64wp70ybql] {
    width: 100%;
    max-width: none;
}

.settings-subpage > :not(.app-status-bar)[b-64wp70ybql] {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
}

[b-64wp70ybql] .settings-page-container {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
    padding: 0;
}
/* /Components/Layout/AppLayout.razor.rz.scp.css */
/* App Layout - Sidebar + Content */
.app-layout[b-1eqejd1mgh] {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
}

/* Sidebar */
.app-sidebar[b-1eqejd1mgh] {
    width: 240px;
    background: var(--bs-card-bg, #ffffff);
    border-right: 1px solid var(--bs-border-color, #dee2e6);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 100;
    overflow-y: auto;
}

.sidebar-header[b-1eqejd1mgh] {
    padding: 20px 16px;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.sidebar-logo[b-1eqejd1mgh] {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--bs-body-color, #212529);
    font-weight: 700;
    font-size: 20px;
}

.logo-icon[b-1eqejd1mgh] {
    font-size: 24px;
}

.sidebar-nav[b-1eqejd1mgh] {
    flex: 1;
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.sidebar-footer[b-1eqejd1mgh] {
    padding: 12px 8px;
    border-top: 1px solid var(--bs-border-color, #dee2e6);
}

[b-1eqejd1mgh] .nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--bs-secondary, #6c757d);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.15s ease;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}

[b-1eqejd1mgh] .nav-item:hover {
    background: var(--bs-secondary-bg, #f8f9fa);
    color: var(--bs-body-color, #212529);
}

[b-1eqejd1mgh] .nav-item.active {
    background: rgba(3, 169, 245, 0.1);
    color: var(--bs-primary, #03A9F5);
    font-weight: 600;
}

[b-1eqejd1mgh] .nav-item svg {
    flex-shrink: 0;
}

.sidebar-divider[b-1eqejd1mgh] {
    height: 1px;
    background: var(--bs-border-color, #dee2e6);
    margin: 8px 12px;
}

.nav-subsection[b-1eqejd1mgh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0 0 6px 0;
}

[b-1eqejd1mgh] .nav-subitem {
    margin-left: 12px;
    width: calc(100% - 12px);
    font-size: 13px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.logout-form[b-1eqejd1mgh] {
    margin: 0;
    padding: 0;
}

.logout-btn[b-1eqejd1mgh] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--bs-danger, #dc3545);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
    transition: all 0.15s ease;
}

.logout-btn:hover[b-1eqejd1mgh] {
    background: rgba(220, 53, 69, 0.08);
}

/* Exit Impersonation Button - Sidebar */
[b-1eqejd1mgh] .exit-impersonation-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    margin: 8px 12px;
    border-radius: 8px;
    background: var(--bs-danger, #dc3545);
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: none;
    width: calc(100% - 24px);
    text-align: left;
    transition: background 0.15s ease;
}

[b-1eqejd1mgh] .exit-impersonation-btn:hover {
    background: #bb2d3b;
}

/* Main Content */
.app-main[b-1eqejd1mgh] {
    flex: 1;
    margin-left: 240px;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--bs-secondary-bg, #f8f9fa);
    transition: margin-left 0.2s ease;
    max-width: 100%;
}

.app-content[b-1eqejd1mgh] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px 24px 24px;
    width: 100%;
}

/* Keep page app bars inside document flow on desktop web to avoid overlaying content/sidebar */
@media (min-width: 769px) {
    .app-main[b-1eqejd1mgh]  .app-status-bar {
        position: sticky;
        top: 0;
        left: auto;
        right: auto;
        width: 100%;
        background-color: var(--bs-card-bg, #ffffff);
        z-index: 20;
    }

    .app-main[b-1eqejd1mgh]  .app-status-bar-content {
        background-color: var(--bs-card-bg, #ffffff);
    }
}

/* Mobile Bottom Bar - hidden on desktop */
.app-bottom-bar[b-1eqejd1mgh] {
    display: none;
}

/* Tablet: narrower sidebar */
@media (max-width: 991px) {
    .app-sidebar[b-1eqejd1mgh] {
        width: 200px;
    }

    .app-main[b-1eqejd1mgh] {
        margin-left: 200px;
    }

    .app-content[b-1eqejd1mgh] {
        padding: 0 20px 20px 20px;
        width: 100%;
    }
}

/* Responsive: Switch from sidebar to bottom bar on phones and portrait touch tablets */
@media (max-width: 768px), (hover: none) and (pointer: coarse) and (orientation: portrait) {
    .app-sidebar[b-1eqejd1mgh] {
        display: none;
    }

    .app-bottom-bar[b-1eqejd1mgh] {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: var(--bs-card-bg, #ffffff);
        border-top: 1px solid var(--bs-border-color, #dee2e6);
        z-index: 100;
        justify-content: space-around;
        align-items: center;
        padding-left: 8px;
        padding-right: 8px;
    }

    [b-1eqejd1mgh] .bottom-bar-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 2px;
        padding: 6px 12px;
        border-radius: 8px;
        color: var(--fitly-text-muted, #868e96);
        text-decoration: none;
        font-size: 11px;
        font-weight: 500;
        transition: color 0.15s ease;
        border: none;
        background: none;
    }

    [b-1eqejd1mgh] .bottom-bar-item.active {
        color: var(--bs-primary, #03A9F5);
        font-weight: 600;
    }

    [b-1eqejd1mgh] .bottom-bar-item svg {
        flex-shrink: 0;
    }

    [b-1eqejd1mgh] .bottom-bar-exit {
        color: var(--bs-danger, #dc3545) !important;
        font-weight: 700 !important;
    }

    .app-main[b-1eqejd1mgh] {
        margin-left: 0;
        padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }

    .app-content[b-1eqejd1mgh] {
        padding: 0 16px 16px 16px;
        width: 100%;
    }
}

/* Impersonation Top Bar - fixed full-width bar above everything */
.impersonation-top-bar[b-1eqejd1mgh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 16px;
    background: var(--bs-danger, #dc3545);
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
}

.impersonation-top-bar-exit[b-1eqejd1mgh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding: 2px 10px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    background: transparent;
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}

.impersonation-top-bar-exit:hover[b-1eqejd1mgh] {
    background: rgba(255, 255, 255, 0.2);
}

/* Offset everything when impersonation bar is active */
.has-impersonation-bar .app-sidebar[b-1eqejd1mgh] {
    top: 36px;
    height: calc(100vh - 36px);
    height: calc(100dvh - 36px);
}

.has-impersonation-bar .app-main[b-1eqejd1mgh] {
    min-height: calc(100vh - 36px);
    min-height: calc(100dvh - 36px);
    padding-top: 36px;
}

@media (max-width: 768px), (hover: none) and (pointer: coarse) and (orientation: portrait) {
    .has-impersonation-bar .app-main[b-1eqejd1mgh] {
        padding-top: 36px;
    }

    .has-impersonation-bar .app-bottom-bar[b-1eqejd1mgh] {
        /* bottom bar stays at bottom, no offset needed */
    }
}

/*
 * Full-screen sub-pages on mobile viewports.
 * Mirrors mobile PopoverNavLayout: when a user navigates to a detail/sub-page
 * (contacts, messages, calendar, routines, exercises, etc.) the bottom tab bar
 * is hidden so the content fills the screen.
 * On desktop viewports these rules have no effect because the bottom bar
 * is already display:none.
 */
@media (max-width: 768px), (hover: none) and (pointer: coarse) and (orientation: portrait) {
    .has-fullscreen-page .app-bottom-bar[b-1eqejd1mgh] {
        display: none;
    }

    .has-fullscreen-page .app-main[b-1eqejd1mgh] {
        padding-bottom: 0;
        height: 100vh;
        height: 100dvh;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }

    .has-fullscreen-page .app-content[b-1eqejd1mgh] {
        flex: 1;
        min-height: 0;
        display: flex;
        flex-direction: column;
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 0;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
        width: 100%;
    }
}

/* AppStatusBar overrides for web layout */
/* Use sticky positioning so the bar stays within the main content area
   and does not overlap the sidebar. On desktop/tablet it looks like
   inline page content with a transparent background. */
[b-1eqejd1mgh] .app-status-bar {
    position: sticky;
    left: auto;
    right: auto;
    width: 100%;
    border-radius: 0;
    background: var(--bs-secondary-bg, #f8f9fa);
    margin-bottom: 8px;
    box-shadow: none;
    border-bottom: none;
}

/* On mobile breakpoints, revert to fixed top bar matching the mobile app */
@media (max-width: 768px), (hover: none) and (pointer: coarse) and (orientation: portrait) {
    [b-1eqejd1mgh] .app-status-bar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background-color: var(--bs-card-bg);
        box-shadow: var(--fitly-shadow-sm);
        border-bottom: 1px solid var(--fitly-border-light);
    }

    /* Push main content below the fixed status bar */
    .app-content[b-1eqejd1mgh] {
        padding-top: var(--fitly-header-height, 56px);
        width: 100%;
    }
}

/* Push content below the sticky AppStatusBar */
[b-1eqejd1mgh] .app-status-bar ~ * {
    /* No extra margin needed; sticky keeps document flow */
}

/* Message count badge on sidebar nav icon */
.nav-badge[b-1eqejd1mgh] {
    margin-left: auto;
    background: var(--bs-primary, #03A9F5);
    color: #fff;
    border-radius: 50px;
    font-size: 9px;
    font-weight: 700;
    min-width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 3px;
    line-height: 1;
    pointer-events: none;
    flex-shrink: 0;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Blazor Error UI - Apple-inspired */
#blazor-error-ui[b-7udcv76mny] {
  color-scheme: light dark;
  background: linear-gradient(135deg, #f44336 0%, #d32f2f 100%);
  bottom: 0;
  box-shadow: 0 -2px 16px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  display: none;
  left: 0;
  padding: 1rem 1.5rem;
  position: fixed;
  width: 100%;
  z-index: 2000;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

#blazor-error-ui .dismiss[b-7udcv76mny] {
  cursor: pointer;
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.2);
  border: none;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  color: white;
  font-size: 20px;
  line-height: 1;
}

#blazor-error-ui .dismiss:hover[b-7udcv76mny] {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-50%) scale(1.1);
}

/* Dark theme support */
[data-bs-theme="dark"] #blazor-error-ui[b-7udcv76mny] {
  background: linear-gradient(135deg, #d32f2f 0%, #b71c1c 100%);
  border-top-color: rgba(255, 255, 255, 0.15);
}

/* /Components/Pages/App/Body.razor.rz.scp.css */
/* Body Measurements Page - Web */

.body-page-web[b-phv3uahtry] {
    max-width: 900px;
}

.page-header[b-phv3uahtry] {
    margin-bottom: 24px;
}

.page-header h1[b-phv3uahtry] {
    font-size: 28px;
    font-weight: 700;
    color: var(--bs-body-color, #212529);
    margin: 0;
}

.page-subtitle[b-phv3uahtry] {
    color: var(--bs-secondary, #6c757d);
    font-size: 15px;
    margin: 4px 0 0;
}
/* /Components/Pages/App/Calendar.razor.rz.scp.css */
/* Calendar Page - Web */

.calendar-page-web[b-wry2zmdade] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

@media (max-width: 768px) {
    .calendar-page-web[b-wry2zmdade] {
        max-width: none;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* /Components/Pages/App/Chat.razor.rz.scp.css */
/* Chat Page */
.chat-page-web[b-hzasmoevcu] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 120px);
    height: calc(100dvh - 120px);
}

@media (max-width: 768px) {
    .chat-page-web[b-hzasmoevcu] {
        max-width: none;
        /* Fill remaining space below the fixed AppStatusBar */
        height: auto;
        flex: 1;
        overflow: hidden;
    }
}
/* /Components/Pages/App/CheckIns.razor.rz.scp.css */
.checkins-page-web[b-mestrkn8w2] { max-width: 800px; }
.page-header[b-mestrkn8w2] { margin-bottom: 24px; }
.page-header h1[b-mestrkn8w2] { font-size: 28px; font-weight: 700; color: var(--bs-body-color, #212529); margin: 0; }
.page-subtitle[b-mestrkn8w2] { color: var(--bs-secondary, #6c757d); font-size: 15px; margin: 4px 0 0; }
.page-header-row[b-mestrkn8w2] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.header-btn-group[b-mestrkn8w2] { display: flex; gap: 8px; flex-shrink: 0; }
.btn-create-routine[b-mestrkn8w2] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--bs-primary, #03A9F5); color: #fff; border: none; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s ease; white-space: nowrap; }
.btn-create-routine:hover[b-mestrkn8w2] { background: #0290d0; }

@media (max-width: 576px) {
    .page-header-row[b-mestrkn8w2] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .page-header h1[b-mestrkn8w2] {
        font-size: 22px;
    }

    .header-btn-group[b-mestrkn8w2] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/App/Contacts.razor.rz.scp.css */
/* Contacts Page - Web wrapper styles */
.contacts-page-web[b-p66syteu5u] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media (max-width: 768px) {
    .contacts-page-web[b-p66syteu5u] {
        max-width: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* /Components/Pages/App/ExerciseDetail.razor.rz.scp.css */
/* Styles moved to ExerciseDetailPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/Exercises.razor.rz.scp.css */
/* Exercises Page - Web Layout */

.exercises-page-web[b-93anyfmjkh] {
    max-width: 1000px;
}

.page-header[b-93anyfmjkh] {
    margin-bottom: 24px;
}

.page-header h1[b-93anyfmjkh] {
    font-size: 28px;
    font-weight: 700;
    color: var(--bs-body-color, #212529);
    margin: 0;
}

.page-subtitle[b-93anyfmjkh] {
    color: var(--bs-secondary, #6c757d);
    font-size: 15px;
    margin: 4px 0 0;
}

/* Search & Filters */
.search-filter-section[b-93anyfmjkh] {
    margin-bottom: 16px;
}

/* Exercise Grid */
.exercise-grid[b-93anyfmjkh] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
}

.exercise-card[b-93anyfmjkh] {
    background: var(--bs-card-bg, #ffffff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.15s ease;
}

.exercise-card:hover[b-93anyfmjkh] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.exercise-card-header[b-93anyfmjkh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}

.exercise-name[b-93anyfmjkh] {
    font-size: 16px;
    font-weight: 600;
    color: var(--bs-body-color, #212529);
    margin: 0;
    line-height: 1.3;
}

.exercise-level[b-93anyfmjkh] {
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

.badge-level-1[b-93anyfmjkh] {
    background: var(--fitly-success-light, #d4edda);
    color: var(--bs-success, #28a745);
}

.badge-level-2[b-93anyfmjkh] {
    background: var(--fitly-warning-light, #fff3cd);
    color: #856404;
}

.badge-level-3[b-93anyfmjkh] {
    background: var(--fitly-danger-light, #f8d7da);
    color: var(--bs-danger, #dc3545);
}

/* Muscle Tags */
.exercise-muscles[b-93anyfmjkh] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 8px;
}

.muscle-tag[b-93anyfmjkh] {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 12px;
    font-weight: 500;
}

.muscle-tag.primary[b-93anyfmjkh] {
    background: rgba(3, 169, 245, 0.12);
    color: var(--bs-primary, #03A9F5);
}

.muscle-tag.secondary[b-93anyfmjkh] {
    background: var(--bs-tertiary-bg, #e9ecef);
    color: var(--bs-secondary, #6c757d);
}

/* Equipment */
.exercise-equipment[b-93anyfmjkh] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--fitly-text-muted, #868e96);
    margin-bottom: 6px;
}

.exercise-description[b-93anyfmjkh] {
    font-size: 13px;
    color: var(--bs-secondary, #6c757d);
    margin: 0;
    line-height: 1.5;
}

/* Empty State */
.empty-state[b-93anyfmjkh] {
    text-align: center;
    padding: 60px 20px;
    color: var(--fitly-text-muted, #868e96);
}

.empty-state svg[b-93anyfmjkh] {
    margin-bottom: 16px;
    opacity: 0.4;
}

.empty-state h3[b-93anyfmjkh] {
    font-size: 18px;
    font-weight: 600;
    color: var(--bs-secondary, #6c757d);
    margin: 0 0 8px;
}

.empty-state p[b-93anyfmjkh] {
    font-size: 14px;
    margin: 0;
}

/* Back Button (select mode) */
.back-btn[b-93anyfmjkh] {
    display: inline-flex; align-items: center; gap: 4px;
    background: none; border: none; cursor: pointer;
    color: var(--bs-primary, #03A9F5); font-size: 14px; font-weight: 500;
    padding: 0; margin-bottom: 12px;
}
.back-btn:hover[b-93anyfmjkh] { text-decoration: underline; }

/* Results info row */
.results-info[b-93anyfmjkh] {
    font-size: 13px;
    color: var(--fitly-text-muted, #868e96);
    margin-bottom: 16px;
    padding: 0 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.clear-selection-btn[b-93anyfmjkh] {
    background: none; border: none; font-size: 12px; font-weight: 500;
    color: var(--bs-primary, #03A9F5); cursor: pointer; padding: 0;
}
.clear-selection-btn:hover[b-93anyfmjkh] { text-decoration: underline; }

/* Select mode card styles */
.exercise-card.selectable[b-93anyfmjkh] {
    position: relative;
    user-select: none;
}

.exercise-card.selected[b-93anyfmjkh] {
    border-color: var(--bs-primary, #03A9F5);
    background: rgba(3, 169, 245, 0.04);
    box-shadow: 0 0 0 2px rgba(3, 169, 245, 0.2);
}

/* Checkbox */
.selection-checkbox[b-93anyfmjkh] {
    width: 22px; height: 22px;
    border: 2px solid var(--bs-border-color, #dee2e6);
    border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    margin-bottom: 8px;
    transition: all 0.15s ease;
}

.selection-checkbox.checked[b-93anyfmjkh] {
    background: var(--bs-primary, #03A9F5);
    border-color: var(--bs-primary, #03A9F5);
    color: #fff;
}

.selection-checkbox.tracked[b-93anyfmjkh] {
    border-color: var(--fitly-text-muted, #868e96);
    color: var(--fitly-text-muted, #868e96);
}

/* Already-tracked card state */
.exercise-card.already-tracked[b-93anyfmjkh] {
    opacity: 0.55;
    cursor: default;
}

.exercise-card.already-tracked:hover[b-93anyfmjkh] {
    transform: none;
    box-shadow: none;
}

.tracked-badge[b-93anyfmjkh] {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    color: var(--fitly-text-muted, #868e96);
    margin-top: 4px;
}

/* Load More */
.load-more-section[b-93anyfmjkh] {
    text-align: center;
    padding: 24px 0;
}

.btn-load-more[b-93anyfmjkh] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 28px;
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    color: var(--bs-body-color, #212529);
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-load-more:hover:not(:disabled)[b-93anyfmjkh] {
    background: var(--bs-secondary-bg, #f8f9fa);
    border-color: var(--bs-primary, #03A9F5);
}

.btn-load-more:disabled[b-93anyfmjkh] {
    opacity: 0.6;
    cursor: not-allowed;
}

.spinner-sm[b-93anyfmjkh] {
    width: 16px;
    height: 16px;
    border: 2px solid var(--bs-border-color, #dee2e6);
    border-top-color: var(--bs-primary, #03A9F5);
    border-radius: 50%;
    animation: spin-b-93anyfmjkh 0.6s linear infinite;
}

@keyframes spin-b-93anyfmjkh {
    to { transform: rotate(360deg); }
}

/* Selection Confirm Bar */
.selection-bar[b-93anyfmjkh] {
    position: fixed; bottom: 0; left: 0; right: 0;
    background: var(--bs-card-bg, #fff);
    border-top: 1px solid var(--bs-border-color, #dee2e6);
    box-shadow: 0 -4px 16px rgba(0,0,0,0.08);
    padding: 14px 24px;
    display: flex; align-items: center; justify-content: space-between;
    z-index: 100;
}

.selection-count[b-93anyfmjkh] {
    font-size: 14px; font-weight: 500;
    color: var(--bs-body-color, #212529);
}

.btn-confirm-selection[b-93anyfmjkh] {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 10px 20px;
    background: var(--bs-primary, #03A9F5); color: #fff;
    border: none; border-radius: 8px;
    font-size: 14px; font-weight: 600;
    cursor: pointer; transition: all 0.15s ease;
}
.btn-confirm-selection:hover[b-93anyfmjkh] { background: #0290d0; }

/* Responsive */
@media (max-width: 768px) {
    .exercise-grid[b-93anyfmjkh] {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }

    .selection-bar[b-93anyfmjkh] {
        padding: 12px 16px;
    }
}

@media (max-width: 576px) {
    .exercise-grid[b-93anyfmjkh] {
        grid-template-columns: 1fr;
    }

    .page-header h1[b-93anyfmjkh] {
        font-size: 22px;
    }

    .exercise-card[b-93anyfmjkh] {
        padding: 14px;
    }

    .exercise-name[b-93anyfmjkh] {
        font-size: 15px;
    }

    .selection-bar[b-93anyfmjkh] {
        flex-direction: column;
        gap: 10px;
        padding: 12px 16px;
    }

    .btn-confirm-selection[b-93anyfmjkh] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/App/FoodManagement.razor.rz.scp.css */
/* Styles moved to FoodManagementPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/GymOwner.razor.rz.scp.css */
/* Styles moved to GymOwnerPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/HelpFaqs.razor.rz.scp.css */
/* Help FAQs Page - Web wrapper styles */
.help-faqs-page-web[b-1193y37pf2] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media (max-width: 768px) {
    .help-faqs-page-web[b-1193y37pf2] {
        max-width: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* /Components/Pages/App/HelpGuide.razor.rz.scp.css */
/* Help Guide Page - Web wrapper styles */
.help-guide-page-web[b-xd6u5qix82] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media (max-width: 768px) {
    .help-guide-page-web[b-xd6u5qix82] {
        max-width: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* /Components/Pages/App/HelpSupport.razor.rz.scp.css */
/* Help Support Page - Web wrapper styles */
.help-support-page-web[b-6elb2q96km] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media (max-width: 768px) {
    .help-support-page-web[b-6elb2q96km] {
        max-width: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* /Components/Pages/App/Home.razor.rz.scp.css */
/* App Home Dashboard - Web-specific styles */
/* Only header/welcome section styles remain here; dashboard body styles live in HomePageContent.razor.css */

.app-home[b-9rk18jh28s] {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
}

/* ── Date picker overlay ──────────────────────────────────────────────── */

.date-picker-overlay[b-9rk18jh28s] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 9000;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 56px;
}

.date-picker-panel[b-9rk18jh28s] {
    background: var(--bs-card-bg, #fff);
    border-radius: 16px;
    width: calc(100% - 32px);
    max-width: 380px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    overflow: hidden;
    animation: datepicker-slide-in-b-9rk18jh28s 0.2s ease;
}

@keyframes datepicker-slide-in-b-9rk18jh28s {
    from { opacity: 0; transform: translateY(-12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.date-picker-panel-header[b-9rk18jh28s] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}

.date-picker-panel-title[b-9rk18jh28s] {
    font-size: 14px;
    font-weight: 600;
    color: var(--bs-body-color, #212529);
}

.date-picker-panel-close[b-9rk18jh28s] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: var(--fitly-text-muted, #868e96);
    display: flex;
    align-items: center;
    border-radius: 6px;
}

.date-picker-panel-close:hover[b-9rk18jh28s] { color: var(--bs-body-color, #212529); }

[b-9rk18jh28s] .app-bar-icon-btn.active {
    color: var(--bs-primary, #03A9F5);
    background: rgba(3, 169, 245, 0.08);
    border-radius: 50%;
}

/* ── End date picker overlay ─────────────────────────────────────────── */

/* Welcome */
.welcome-section[b-9rk18jh28s] {
    margin-bottom: 24px;
}

.welcome-row[b-9rk18jh28s] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.welcome-section h1[b-9rk18jh28s] {
    font-size: 28px;
    font-weight: 700;
    color: var(--bs-body-color, #212529);
    margin: 0;
}

.welcome-subtitle[b-9rk18jh28s] {
    color: var(--bs-secondary, #6c757d);
    font-size: 15px;
    margin: 4px 0 0;
}

/* Header Action Icons */
.header-actions[b-9rk18jh28s] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.header-icon-btn[b-9rk18jh28s] {
    height: 36px;
    padding: 0 12px;
    border-radius: 10px;
    background: var(--bs-card-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--bs-secondary, #6c757d);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    transition: all 0.15s ease;
}

.header-icon-btn:hover[b-9rk18jh28s] {
    background: var(--bs-secondary-bg, #f8f9fa);
    color: var(--bs-primary, #03A9F5);
    border-color: var(--bs-primary, #03A9F5);
}

.badge-dot[b-9rk18jh28s] {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #dc3545;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

@media (max-width: 640px) {
    .welcome-row[b-9rk18jh28s] {
        flex-direction: column;
        gap: 12px;
    }

    .welcome-section h1[b-9rk18jh28s] {
        font-size: 24px;
    }

    .header-actions[b-9rk18jh28s] {
        width: 100%;
        flex-wrap: wrap;
    }

    .header-icon-btn span[b-9rk18jh28s] {
        display: none;
    }
}
@media (max-width: 576px) {
    .welcome-row[b-9rk18jh28s] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .welcome-section h1[b-9rk18jh28s] {
        font-size: 22px;
    }

    .header-actions[b-9rk18jh28s] {
        justify-content: flex-start;
    }

    .header-icon-btn[b-9rk18jh28s] {
        padding: 0 10px;
        font-size: 12px;
    }
}
/* /Components/Pages/App/Measurements.razor.rz.scp.css */
/* Styles moved to MeasurementsPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/Messages.razor.rz.scp.css */
/* Messages Page - Web wrapper styles */
.messages-page-web[b-u932qtzmzj] {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media (max-width: 768px) {
    .messages-page-web[b-u932qtzmzj] {
        max-width: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
}
/* /Components/Pages/App/More.razor.rz.scp.css */
.hub-section[b-5fu0zr8vol] {
    display: contents;
}

.hub-section-header[b-5fu0zr8vol] {
    grid-column: 1 / -1;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--fitly-text-muted, #8b95a5);
    padding: 8px 4px 0 4px;
    margin-top: 4px;
}

.hub-section-header:first-child[b-5fu0zr8vol] {
    margin-top: 0;
}

.sign-out-button[b-5fu0zr8vol] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 24px;
    background: none;
    border: 1px solid rgba(220, 53, 69, 0.3);
    border-radius: 12px;
    color: var(--bs-danger, #dc3545);
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}

.sign-out-button:hover[b-5fu0zr8vol] {
    background: rgba(220, 53, 69, 0.06);
    border-color: rgba(220, 53, 69, 0.5);
}

.sign-out-button:active[b-5fu0zr8vol] {
    transform: scale(0.98);
}

.sign-out-button:disabled[b-5fu0zr8vol] {
    opacity: 0.6;
    cursor: not-allowed;
}

.app-version-card[b-5fu0zr8vol] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    background: var(--bs-card-bg, #ffffff);
}

.app-version-label[b-5fu0zr8vol] {
    font-size: 0.9rem;
    color: var(--bs-secondary, #6c757d);
}

.app-version-value[b-5fu0zr8vol] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--bs-body-color, #212529);
}
/* /Components/Pages/App/Nutrition.razor.rz.scp.css */
/* Nutrition Page - web wrapper only.
   All nutrition content styles live in NutritionPageContent.razor.css (shared). */

.nutrition-page-web[b-p3kzvnllxt] {
    max-width: 800px;
}

.page-header[b-p3kzvnllxt] {
    margin-bottom: 24px;
}

.page-header h1[b-p3kzvnllxt] {
    font-size: 28px;
    font-weight: 700;
    color: var(--bs-body-color, #212529);
    margin: 0;
}

.page-subtitle[b-p3kzvnllxt] {
    color: var(--bs-secondary, #6c757d);
    font-size: 15px;
    margin: 4px 0 0;
}

.page-header-row[b-p3kzvnllxt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.page-header-actions[b-p3kzvnllxt] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    flex-wrap: wrap;
    align-items: center;
}

.header-link-btn[b-p3kzvnllxt] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--bs-body-color, #212529);
    text-decoration: none;
    background: var(--bs-card-bg, #fff);
    transition: all 0.15s ease;
    cursor: pointer;
}

.header-link-btn:hover[b-p3kzvnllxt] {
    background: var(--bs-secondary-bg, #f8f9fa);
    border-color: var(--bs-primary, #03A9F5);
    color: var(--bs-primary, #03A9F5);
}

.header-link-btn svg[b-p3kzvnllxt] {
    color: var(--fitly-text-muted, #868e96);
}

@media (max-width: 576px) {
    .page-header-row[b-p3kzvnllxt] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .page-header h1[b-p3kzvnllxt] {
        font-size: 22px;
    }

    .page-header-actions[b-p3kzvnllxt] {
        justify-content: flex-start;
    }
}
/* /Components/Pages/App/NutritionGoals.razor.rz.scp.css */
/* Styles moved to NutritionGoalsPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/PrivacySettings.razor.rz.scp.css */
/* Styles moved to PrivacySettingsPageContent.razor.css in Fitly.Shared.Views */
/* /Components/Pages/App/Progress.razor.rz.scp.css */
/* Progress Page - Web Layout */
.progress-page-web[b-mlpzu9ssk9] { max-width: 800px; }
.page-header[b-mlpzu9ssk9] { margin-bottom: 24px; }
.page-header h1[b-mlpzu9ssk9] { font-size: 28px; font-weight: 700; color: var(--bs-body-color, #212529); margin: 0; }
.page-subtitle[b-mlpzu9ssk9] { color: var(--bs-secondary, #6c757d); font-size: 15px; margin: 4px 0 0; }
/* /Components/Pages/App/RoutineDetails.razor.rz.scp.css */
/* Routine Detail Page - Web */

/* AppBar save/cancel buttons (shown only in responsive/mobile via AppStatusBar) */
.app-bar-save-btn[b-tfn4pi3ics] {
    color: var(--bs-success, #28a745) !important;
}

.app-bar-save-btn:disabled[b-tfn4pi3ics] {
    opacity: 0.5;
    cursor: not-allowed;
}

.app-bar-saving-text[b-tfn4pi3ics] {
    font-size: 14px;
    font-weight: 600;
}

.app-bar-cancel-btn[b-tfn4pi3ics] {
    color: var(--fitly-text-muted, #868e96) !important;
}

/*
 * On mobile, hide the inline routine-actions (Save/Cancel row) when edit mode
 * is active since those actions are in the AppStatusBar.
 */
@media (max-width: 768px) {
    [b-tfn4pi3ics] .routine-details-page-content {
        max-width: none;
        padding: 8px;
        overflow-y: auto;
        flex: 1;
    }

    [b-tfn4pi3ics] .routine-actions {
        display: none;
    }
}

/* Stats */
.stats-row[b-tfn4pi3ics] { display: flex; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.stat-card[b-tfn4pi3ics] {
    flex: 1; min-width: 100px; text-align: center;
    background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 12px; padding: 16px 12px;
}
.stat-value[b-tfn4pi3ics] { font-size: 22px; font-weight: 700; color: var(--bs-body-color, #212529); }
.stat-value.level-value[b-tfn4pi3ics] { font-size: 16px; text-transform: capitalize; }
.stat-label[b-tfn4pi3ics] { font-size: 12px; color: var(--fitly-text-muted, #868e96); margin-top: 2px; }

/* Meta Tags */
.routine-meta-tags[b-tfn4pi3ics] { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }
.meta-tag[b-tfn4pi3ics] { font-size: 12px; font-weight: 500; padding: 4px 12px; border-radius: 12px; }
.category-tag[b-tfn4pi3ics] { background: var(--bs-tertiary-bg, #e9ecef); color: var(--bs-secondary, #6c757d); }
.fitly-tag[b-tfn4pi3ics] { background: rgba(3, 169, 245, 0.12); color: var(--bs-primary, #03A9F5); }

/* Section */
.section-header-row[b-tfn4pi3ics] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.section-title[b-tfn4pi3ics] { font-size: 18px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0; }

/* Add Set / Add Exercise Buttons */
.btn-add-set[b-tfn4pi3ics] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--bs-primary, #03A9F5); color: #fff; border: none; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s ease; }
.btn-add-set:hover[b-tfn4pi3ics] { background: #0290d0; }
.btn-add-exercise[b-tfn4pi3ics] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; background: rgba(3,169,245,0.08); border: 1px dashed rgba(3,169,245,0.3); border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--bs-primary, #03A9F5); cursor: pointer; transition: all 0.15s ease; width: 100%; justify-content: center; margin-top: 10px; }
.btn-add-exercise:hover[b-tfn4pi3ics] { background: rgba(3,169,245,0.15); border-color: var(--bs-primary, #03A9F5); }

/* Exercise Set Cards */
.exercise-sets-section[b-tfn4pi3ics] { margin-top: 8px; }

.exercise-set-card[b-tfn4pi3ics] {
    background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 12px; padding: 16px; margin-bottom: 12px;
}
.exercise-set-card.editable[b-tfn4pi3ics] { border-color: rgba(3,169,245,0.3); }

.set-header[b-tfn4pi3ics] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--bs-border-color, #dee2e6);
}
.set-header h3[b-tfn4pi3ics] { font-size: 15px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0; }

/* Edit mode set header */
.set-name-input[b-tfn4pi3ics] { font-size: 15px; font-weight: 600; color: var(--bs-body-color, #212529); border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 6px; padding: 5px 10px; flex: 1; min-width: 120px; font-family: inherit; }
.set-name-input:focus[b-tfn4pi3ics] { outline: none; border-color: var(--bs-primary, #03A9F5); }
.set-edit-actions[b-tfn4pi3ics] { display: flex; align-items: center; gap: 8px; }
.rest-input-group[b-tfn4pi3ics] { display: flex; align-items: center; gap: 4px; }
.rest-input[b-tfn4pi3ics] { width: 60px; padding: 5px 6px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 6px; font-size: 13px; text-align: center; }
.rest-input:focus[b-tfn4pi3ics] { outline: none; border-color: var(--bs-primary, #03A9F5); }
.rest-label[b-tfn4pi3ics] { font-size: 11px; color: var(--fitly-text-muted, #868e96); }
.btn-icon-danger[b-tfn4pi3ics] { background: none; border: none; cursor: pointer; padding: 6px; border-radius: 6px; color: var(--fitly-text-muted, #868e96); transition: all 0.15s ease; display: flex; align-items: center; }
.btn-icon-danger:hover[b-tfn4pi3ics] { background: rgba(220,53,69,0.1); color: #dc3545; }

.rest-badge[b-tfn4pi3ics] {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 12px; color: var(--fitly-text-muted, #868e96);
    background: var(--bs-tertiary-bg, #e9ecef); padding: 3px 10px; border-radius: 10px;
}

/* Exercise Items */
.exercises-list[b-tfn4pi3ics] { display: flex; flex-direction: column; gap: 4px; }

.exercise-item[b-tfn4pi3ics] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 12px; border-radius: 8px; cursor: pointer;
    transition: background 0.15s ease;
}
.exercise-item:hover[b-tfn4pi3ics] { background: var(--bs-secondary-bg, #f8f9fa); }
.exercise-item svg[b-tfn4pi3ics] { color: var(--fitly-text-muted, #868e96); flex-shrink: 0; }

.exercise-item.editable[b-tfn4pi3ics] { cursor: default; padding: 10px 8px; border: 1px solid var(--fitly-border-light, #e9ecef); border-radius: 8px; margin-bottom: 4px; }
.exercise-item.editable:hover[b-tfn4pi3ics] { background: var(--bs-secondary-bg, #f8f9fa); }

.exercise-info[b-tfn4pi3ics] { flex: 1; min-width: 0; }
.exercise-name[b-tfn4pi3ics] { font-size: 14px; font-weight: 500; color: var(--bs-body-color, #212529); display: block; }

.exercise-detail-chips[b-tfn4pi3ics] { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }

.detail-chip[b-tfn4pi3ics] {
    font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 8px;
    background: var(--bs-tertiary-bg, #e9ecef); color: var(--bs-secondary, #6c757d);
}
.sets-chip[b-tfn4pi3ics] { background: rgba(3, 169, 245, 0.10); color: var(--bs-primary, #03A9F5); }
.reps-chip[b-tfn4pi3ics] { background: rgba(40, 167, 69, 0.10); color: #28a745; }
.weight-chip[b-tfn4pi3ics] { background: rgba(253, 126, 20, 0.10); color: #fd7e14; }
.duration-chip[b-tfn4pi3ics] { background: rgba(111, 66, 193, 0.10); color: #6f42c1; }

/* Inline edit fields for exercises */
.exercise-inline-edit[b-tfn4pi3ics] { display: flex; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.inline-field[b-tfn4pi3ics] { display: flex; flex-direction: column; gap: 2px; }
.inline-field label[b-tfn4pi3ics] { font-size: 10px; font-weight: 500; color: var(--fitly-text-muted, #868e96); text-transform: uppercase; }
.inline-field input[b-tfn4pi3ics] { width: 65px; padding: 4px 6px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 5px; font-size: 13px; text-align: center; }
.inline-field input:focus[b-tfn4pi3ics] { outline: none; border-color: var(--bs-primary, #03A9F5); }

/* Error & Empty States */
.error-state[b-tfn4pi3ics], .empty-state[b-tfn4pi3ics] { text-align: center; padding: 60px 20px; color: var(--fitly-text-muted, #868e96); }
.error-state svg[b-tfn4pi3ics], .empty-state svg[b-tfn4pi3ics] { opacity: 0.3; margin-bottom: 16px; }
.error-state h3[b-tfn4pi3ics], .empty-state h3[b-tfn4pi3ics] { font-size: 18px; font-weight: 600; color: var(--bs-secondary, #6c757d); margin: 0 0 8px; }
.error-state p[b-tfn4pi3ics], .empty-state p[b-tfn4pi3ics] { font-size: 14px; margin: 0 0 20px; }

.btn[b-tfn4pi3ics] { display: inline-flex; align-items: center; gap: 6px; border: none; border-radius: 8px; padding: 10px 20px; font-size: 14px; font-weight: 500; cursor: pointer; transition: background 0.15s ease; }
.btn-primary[b-tfn4pi3ics] { background: var(--bs-primary, #03A9F5); color: #fff; }
.btn-primary:hover[b-tfn4pi3ics] { background: #0290d0; }

@media (max-width: 640px) {
    .header-title-row[b-tfn4pi3ics] { flex-direction: column; align-items: flex-start; }
    .header-action-btns[b-tfn4pi3ics] { margin-left: 0; }
    .exercise-inline-edit[b-tfn4pi3ics] { gap: 6px; }
    .inline-field input[b-tfn4pi3ics] { width: 55px; }
    .confirm-dialog[b-tfn4pi3ics] { width: calc(100% - 32px); }
    .stats-row[b-tfn4pi3ics] { gap: 8px; }
    .stat-card[b-tfn4pi3ics] { min-width: 80px; padding: 12px 8px; }
    .stat-value[b-tfn4pi3ics] { font-size: 18px; }
    .stat-label[b-tfn4pi3ics] { font-size: 11px; }
    .page-header h1[b-tfn4pi3ics] { font-size: 22px; }
    .edit-title-input[b-tfn4pi3ics] { font-size: 20px; min-width: 0; width: 100%; }
    .edit-meta-row[b-tfn4pi3ics] { flex-direction: column; }
}

/* Drag and Drop */
.drag-handle[b-tfn4pi3ics] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 6px;
    cursor: grab;
    color: var(--fitly-text-muted, #868e96);
    flex-shrink: 0;
    border-radius: 4px;
    transition: color 0.15s ease;
}

.drag-handle:hover[b-tfn4pi3ics] { color: var(--bs-secondary, #6c757d); }
.drag-handle:active[b-tfn4pi3ics] { cursor: grabbing; }

.exercise-set-card[draggable="true"][b-tfn4pi3ics] { cursor: default; }
.exercise-set-card.dragging[b-tfn4pi3ics] { opacity: 0.4; }
.exercise-set-card.drag-over[b-tfn4pi3ics] {
    border-color: var(--bs-primary, #03A9F5);
    background: rgba(3, 169, 245, 0.05);
}

.exercise-item[draggable="true"][b-tfn4pi3ics] { cursor: default; }
.exercise-item.dragging[b-tfn4pi3ics] { opacity: 0.4; }
.exercise-item.drag-over[b-tfn4pi3ics] {
    border-color: var(--bs-primary, #03A9F5);
    background: rgba(3, 169, 245, 0.08);
}
/* /Components/Pages/App/Routines.razor.rz.scp.css */
/* Routines Page */
.routines-page-web[b-4gwo1p7fvq] {
    width: 100%;
    max-width: none;
}

.routines-page-web > :not(.app-status-bar)[b-4gwo1p7fvq] {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
}

[b-4gwo1p7fvq] .routines-page-content {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
    padding: 0;
}

.page-header[b-4gwo1p7fvq] { margin-bottom: 24px; }
.page-header h1[b-4gwo1p7fvq] { font-size: 28px; font-weight: 700; color: var(--bs-body-color, #212529); margin: 0; }
.page-subtitle[b-4gwo1p7fvq] { color: var(--bs-secondary, #6c757d); font-size: 15px; margin: 4px 0 0; }
.page-header-row[b-4gwo1p7fvq] { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.header-btn-group[b-4gwo1p7fvq] { display: flex; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }
.header-link-btn[b-4gwo1p7fvq] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--bs-body-color, #212529); text-decoration: none; background: var(--bs-card-bg, #fff); transition: all 0.15s ease; white-space: nowrap; }
.header-link-btn:hover[b-4gwo1p7fvq] { background: var(--bs-secondary-bg, #f8f9fa); border-color: var(--bs-primary, #03A9F5); color: var(--bs-primary, #03A9F5); }
.header-link-btn svg[b-4gwo1p7fvq] { color: var(--fitly-text-muted, #868e96); }

/* Create Routine Button */
.btn-create-routine[b-4gwo1p7fvq] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; background: var(--bs-primary, #03A9F5); color: #fff; border: none; border-radius: 8px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s ease; white-space: nowrap; }
.btn-create-routine:hover[b-4gwo1p7fvq] { background: #0290d0; }

/* Create Routine Modal */
.modal-overlay[b-4gwo1p7fvq] { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 1000; }
.modal-panel[b-4gwo1p7fvq] { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 480px; max-height: 80vh; overflow-y: auto; background: var(--bs-card-bg, #fff); border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,0.15); z-index: 1001; display: flex; flex-direction: column; }
.modal-panel-header[b-4gwo1p7fvq] { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px 0; }
.modal-panel-header h3[b-4gwo1p7fvq] { font-size: 18px; font-weight: 600; margin: 0; color: var(--bs-body-color, #212529); }
.modal-close-btn[b-4gwo1p7fvq] { background: none; border: none; font-size: 24px; cursor: pointer; color: var(--fitly-text-muted, #868e96); line-height: 1; padding: 0; }
.modal-panel-body[b-4gwo1p7fvq] { padding: 16px 24px; flex: 1; overflow-y: auto; }
.modal-panel-footer[b-4gwo1p7fvq] { display: flex; gap: 10px; justify-content: flex-end; padding: 16px 24px; border-top: 1px solid var(--bs-border-color, #dee2e6); }

.form-group[b-4gwo1p7fvq] { margin-bottom: 14px; }
.form-group label[b-4gwo1p7fvq] { display: block; font-size: 13px; font-weight: 500; color: var(--bs-secondary, #6c757d); margin-bottom: 4px; }
.form-input[b-4gwo1p7fvq] { width: 100%; padding: 10px 12px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 8px; font-size: 14px; font-family: inherit; box-sizing: border-box; }
.form-input:focus[b-4gwo1p7fvq] { outline: none; border-color: var(--bs-primary, #03A9F5); }
.form-row[b-4gwo1p7fvq] { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.alert[b-4gwo1p7fvq] { padding: 12px 16px; border-radius: 8px; font-size: 14px; margin-bottom: 12px; }
.alert-danger[b-4gwo1p7fvq] { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

.btn-cancel[b-4gwo1p7fvq] { padding: 10px 20px; background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 8px; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--bs-body-color, #212529); }
.btn-cancel:hover[b-4gwo1p7fvq] { background: var(--bs-secondary-bg, #f8f9fa); }
.btn-confirm[b-4gwo1p7fvq] { padding: 10px 20px; background: var(--bs-primary, #03A9F5); color: #fff; border: none; border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; transition: background 0.15s ease; }
.btn-confirm:hover:not(:disabled)[b-4gwo1p7fvq] { background: #0290d0; }
.btn-confirm:disabled[b-4gwo1p7fvq] { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 640px) { .modal-panel[b-4gwo1p7fvq] { width: 95%; } }

@media (max-width: 768px) {
    .page-header-row[b-4gwo1p7fvq] { flex-direction: column; align-items: stretch; gap: 12px; }
    .header-btn-group[b-4gwo1p7fvq] { justify-content: flex-start; }
    .form-row[b-4gwo1p7fvq] { grid-template-columns: 1fr; }
}

@media (max-width: 576px) {
    .page-header h1[b-4gwo1p7fvq] { font-size: 22px; }
    .routine-card[b-4gwo1p7fvq] { padding: 14px; }
    .routine-card-content h3[b-4gwo1p7fvq] { font-size: 15px; }
    .routine-meta[b-4gwo1p7fvq] { gap: 8px; }
}

.routine-list[b-4gwo1p7fvq] { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; }

.routine-card[b-4gwo1p7fvq] {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 12px; padding: 16px; cursor: pointer;
    transition: box-shadow 0.15s ease, transform 0.1s ease;
}
.routine-card:hover[b-4gwo1p7fvq] { box-shadow: 0 4px 12px rgba(0,0,0,0.06); transform: translateY(-1px); }
.routine-card svg[b-4gwo1p7fvq] { color: var(--fitly-text-muted, #868e96); flex-shrink: 0; }

.routine-card-content[b-4gwo1p7fvq] { flex: 1; min-width: 0; }
.routine-card-content h3[b-4gwo1p7fvq] { font-size: 16px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0 0 4px; }
.routine-desc[b-4gwo1p7fvq] { font-size: 13px; color: var(--bs-secondary, #6c757d); margin: 0 0 8px; line-height: 1.4; }
.routine-header-row[b-4gwo1p7fvq] { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }

.routine-meta[b-4gwo1p7fvq] { display: flex; flex-wrap: wrap; gap: 12px; }
.meta-item[b-4gwo1p7fvq] { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--fitly-text-muted, #868e96); }
.level-badge[b-4gwo1p7fvq] { background: var(--bs-tertiary-bg, #e9ecef); padding: 2px 8px; border-radius: 10px; font-weight: 500; }

.fitly-badge[b-4gwo1p7fvq] {
    font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px;
    background: rgba(3, 169, 245, 0.12); color: var(--bs-primary, #03A9F5);
}

.empty-state[b-4gwo1p7fvq] { text-align: center; padding: 60px 20px; color: var(--fitly-text-muted, #868e96); }
.empty-state svg[b-4gwo1p7fvq] { opacity: 0.3; margin-bottom: 16px; }
.empty-state h3[b-4gwo1p7fvq] { font-size: 18px; font-weight: 600; color: var(--bs-secondary, #6c757d); margin: 0 0 8px; }
.empty-state p[b-4gwo1p7fvq] { font-size: 14px; margin: 0; }
/* /Components/Pages/App/Session.razor.rz.scp.css */
/* Session Page */
.session-page-web[b-x3bk9spzui] { max-width: 800px; padding-bottom: 60px; }

/* Session Header */
.session-header[b-x3bk9spzui] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; gap: 16px; }
.session-header-left[b-x3bk9spzui] { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.back-btn[b-x3bk9spzui] { display: inline-flex; align-items: center; gap: 4px; background: none; border: none; color: var(--bs-primary, #03A9F5); font-size: 14px; font-weight: 500; cursor: pointer; padding: 4px 0; flex-shrink: 0; }
.back-btn:hover[b-x3bk9spzui] { opacity: 0.8; }
.session-title-area[b-x3bk9spzui] { display: flex; flex-direction: column; min-width: 0; }
.session-title-area h1[b-x3bk9spzui] { font-size: 22px; font-weight: 700; margin: 0; color: var(--bs-body-color, #212529); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.session-timer[b-x3bk9spzui] { font-size: 14px; font-weight: 600; color: var(--bs-primary, #03A9F5); font-variant-numeric: tabular-nums; }
.session-header-right[b-x3bk9spzui] { flex-shrink: 0; display: flex; align-items: center; gap: 12px; }
.saving-indicator[b-x3bk9spzui] { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--fitly-text-muted, #868e96); }
.btn-complete[b-x3bk9spzui] { background: var(--bs-primary, #03A9F5); color: #fff; border: none; border-radius: 8px; padding: 10px 20px; font-size: 14px; font-weight: 600; cursor: pointer; transition: background 0.15s ease; }
.btn-complete:hover[b-x3bk9spzui] { background: #0290d0; }
.btn-complete.ready[b-x3bk9spzui] { background: #28a745; }
.btn-complete.ready:hover[b-x3bk9spzui] { background: #218838; }
.btn-complete:disabled[b-x3bk9spzui] { opacity: 0.6; cursor: not-allowed; }

/* Progress */
.session-progress[b-x3bk9spzui] { margin: 15px 5px; }
.progress-bar[b-x3bk9spzui] { height: 6px; background: var(--bs-tertiary-bg, #e9ecef); border-radius: 3px; overflow: hidden; }
.progress-fill[b-x3bk9spzui] { height: 100%; background: var(--bs-primary, #03A9F5); border-radius: 3px; transition: width 0.3s ease; }
.progress-text[b-x3bk9spzui] { font-size: 12px; color: var(--fitly-text-muted, #868e96); margin-top: 6px; display: block; }

/* Set Navigation Tabs */
.set-tabs[b-x3bk9spzui] { display: flex; gap: 6px; margin-bottom: 16px; overflow-x: auto; padding-bottom: 4px; }
.set-tab[b-x3bk9spzui] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 8px; background: var(--bs-card-bg, #fff); font-size: 13px; font-weight: 500; cursor: pointer; white-space: nowrap; transition: all 0.15s ease; color: var(--bs-body-color, #212529); }
.set-tab:hover[b-x3bk9spzui] { border-color: var(--bs-primary, #03A9F5); background: rgba(3,169,245,0.04); }
.set-tab.active[b-x3bk9spzui] { background: var(--bs-primary, #03A9F5); color: #fff; border-color: var(--bs-primary, #03A9F5); }
.set-tab.completed[b-x3bk9spzui] { border-color: #28a745; }
.set-tab.completed.active[b-x3bk9spzui] { background: #28a745; border-color: #28a745; }
.set-tab-number[b-x3bk9spzui] { width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,0.08); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.set-tab.active .set-tab-number[b-x3bk9spzui] { background: rgba(255,255,255,0.25); }
.set-tab-name[b-x3bk9spzui] { max-width: 120px; overflow: hidden; text-overflow: ellipsis; }

/* Set Card */
.exercise-sets[b-x3bk9spzui] { display: flex; flex-direction: column; gap: 12px; }
.set-card[b-x3bk9spzui] { background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 12px; overflow: hidden; }
.set-card-header[b-x3bk9spzui] { padding: 16px 16px 8px; border-bottom: 1px solid var(--bs-border-color, #dee2e6); }
.set-card-header h2[b-x3bk9spzui] { font-size: 18px; font-weight: 600; margin: 0 0 2px; color: var(--bs-body-color, #212529); }
.set-exercise-count[b-x3bk9spzui] { font-size: 12px; color: var(--fitly-text-muted, #868e96); }

/* Exercise Section */
.exercises-container[b-x3bk9spzui] { display: flex; flex-direction: column; gap: 0; }
.exercise-section[b-x3bk9spzui] { padding: 16px; border-bottom: 1px solid var(--bs-border-color, #dee2e6); transition: background 0.15s ease; }
.exercise-section:last-child[b-x3bk9spzui] { border-bottom: none; }
.exercise-section.exercise-done[b-x3bk9spzui] { background: rgba(40,167,69,0.03); }

/* Exercise Header */
.exercise-header[b-x3bk9spzui] { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 12px; gap: 12px; }
.exercise-name-area[b-x3bk9spzui] { display: flex; flex-direction: column; gap: 2px; }
.exercise-name[b-x3bk9spzui] { font-size: 15px; font-weight: 600; margin: 0; color: var(--bs-body-color, #212529); }
.exercise-target[b-x3bk9spzui] { font-size: 12px; color: var(--fitly-text-muted, #868e96); }
.add-set-btn[b-x3bk9spzui] { background: none; border: none; color: var(--bs-primary, #03A9F5); cursor: pointer; padding: 4px; border-radius: 4px; display: flex; align-items: center; }
.add-set-btn:hover[b-x3bk9spzui] { background: rgba(3,169,245,0.08); }

/* Sets List */
.sets-list[b-x3bk9spzui] { display: flex; flex-direction: column; gap: 0; }
.sets-list-header[b-x3bk9spzui] { display: grid; grid-template-columns: 40px 1fr 1fr 48px 32px; gap: 8px; padding: 6px 8px; font-size: 11px; font-weight: 600; color: var(--fitly-text-muted, #868e96); text-transform: uppercase; letter-spacing: 0.3px; border-bottom: 1px solid var(--bs-border-color, #dee2e6); }

/* Set Row */
.set-row[b-x3bk9spzui] { display: grid; grid-template-columns: 40px 1fr 1fr 48px 32px; gap: 8px; align-items: center; padding: 8px; border-radius: 8px; transition: background 0.15s ease; }
.set-row:hover[b-x3bk9spzui] { background: var(--bs-secondary-bg, #f8f9fa); }
.set-row.completed[b-x3bk9spzui] { background: rgba(40,167,69,0.06); }
.set-number[b-x3bk9spzui] { width: 28px; height: 28px; border-radius: 6px; background: var(--bs-tertiary-bg, #e9ecef); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: var(--bs-body-color, #212529); }
.set-row.completed .set-number[b-x3bk9spzui] { background: #28a745; color: #fff; }

/* Input with +/- Controls */
.set-input[b-x3bk9spzui] { display: flex; align-items: center; }
.input-with-controls[b-x3bk9spzui] { display: flex; align-items: center; gap: 0; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 6px; overflow: hidden; background: var(--bs-card-bg, #fff); }
.input-with-controls input[b-x3bk9spzui] { width: 52px; text-align: center; border: none; padding: 6px 2px; font-size: 14px; font-weight: 500; background: transparent; -moz-appearance: textfield; }
.input-with-controls input[b-x3bk9spzui]::-webkit-outer-spin-button,
.input-with-controls input[b-x3bk9spzui]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.input-with-controls input:focus[b-x3bk9spzui] { outline: none; }
.input-with-controls input:disabled[b-x3bk9spzui] { color: var(--fitly-text-muted, #868e96); }
.control-btn[b-x3bk9spzui] { width: 28px; height: 32px; display: flex; align-items: center; justify-content: center; border: none; background: var(--bs-secondary-bg, #f8f9fa); color: var(--bs-body-color, #212529); font-size: 16px; font-weight: 600; cursor: pointer; user-select: none; transition: background 0.1s ease; }
.control-btn:hover:not(:disabled)[b-x3bk9spzui] { background: var(--bs-tertiary-bg, #e9ecef); }
.control-btn:disabled[b-x3bk9spzui] { opacity: 0.4; cursor: not-allowed; }
.control-btn.minus[b-x3bk9spzui] { border-right: 1px solid var(--bs-border-color, #dee2e6); }
.control-btn.plus[b-x3bk9spzui] { border-left: 1px solid var(--bs-border-color, #dee2e6); }

/* Completion Button */
.set-completion[b-x3bk9spzui] { display: flex; align-items: center; justify-content: center; }
.completion-btn[b-x3bk9spzui] { background: none; border: none; cursor: pointer; padding: 4px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--bs-border-color, #dee2e6); transition: all 0.15s ease; }
.completion-btn:hover[b-x3bk9spzui] { color: #28a745; }
.completion-btn.completed[b-x3bk9spzui] { color: #28a745; }

/* Set Actions */
.set-actions[b-x3bk9spzui] { display: flex; align-items: center; justify-content: center; }
.remove-set-btn[b-x3bk9spzui] { background: none; border: none; cursor: pointer; padding: 4px; border-radius: 4px; color: var(--fitly-text-muted, #868e96); display: flex; align-items: center; }
.remove-set-btn:hover[b-x3bk9spzui] { color: #dc3545; background: rgba(220,53,69,0.06); }

/* Set Navigation Arrows */
.set-nav-arrows[b-x3bk9spzui] { display: flex; justify-content: space-between; padding: 12px 16px; border-top: 1px solid var(--bs-border-color, #dee2e6); }
.nav-arrow[b-x3bk9spzui] { display: inline-flex; align-items: center; gap: 6px; background: none; border: none; color: var(--bs-primary, #03A9F5); font-size: 13px; font-weight: 500; cursor: pointer; padding: 6px 10px; border-radius: 6px; transition: background 0.15s ease; }
.nav-arrow:hover:not(:disabled)[b-x3bk9spzui] { background: rgba(3,169,245,0.06); }
.nav-arrow:disabled[b-x3bk9spzui] { color: var(--fitly-text-muted, #868e96); cursor: not-allowed; opacity: 0.5; }

/* Rest Timer Bar */
.rest-timer-bar[b-x3bk9spzui] { position: fixed; bottom: 0; left: 0; right: 0; background: var(--bs-card-bg, #fff); border-top: 1px solid var(--bs-border-color, #dee2e6); padding: 8px 16px; z-index: 100; }
.rest-timer-bar.rest-active[b-x3bk9spzui] { background: #1a1a2e; border-top-color: #03A9F5; }
.timer-bar-content[b-x3bk9spzui] { display: flex; align-items: center; justify-content: space-between; max-width: 800px; margin: 0 auto; gap: 16px; }
.workout-timer-section[b-x3bk9spzui] { display: flex; align-items: center; gap: 6px; color: var(--fitly-text-muted, #868e96); }
.rest-active .workout-timer-section[b-x3bk9spzui] { color: rgba(255,255,255,0.7); }
.workout-time[b-x3bk9spzui] { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.progress-section[b-x3bk9spzui] { font-size: 14px; font-weight: 600; color: var(--bs-body-color, #212529); }
.rest-active .progress-section[b-x3bk9spzui] { color: #fff; }
.progress-compact[b-x3bk9spzui] { font-variant-numeric: tabular-nums; }
.rest-timer-section[b-x3bk9spzui] { display: flex; align-items: center; }
.rest-timer-controls[b-x3bk9spzui] { display: flex; gap: 6px; }
.rest-quick-btn[b-x3bk9spzui] { padding: 5px 12px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 6px; background: var(--bs-card-bg, #fff); font-size: 12px; font-weight: 600; cursor: pointer; color: var(--bs-body-color, #212529); transition: all 0.15s ease; }
.rest-quick-btn:hover[b-x3bk9spzui] { border-color: var(--bs-primary, #03A9F5); color: var(--bs-primary, #03A9F5); }
.rest-timer-active[b-x3bk9spzui] { display: flex; align-items: center; gap: 6px; background: #03A9F5; border: none; border-radius: 6px; padding: 5px 14px; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
.rest-timer-active:hover[b-x3bk9spzui] { background: #0290d0; }
.rest-time[b-x3bk9spzui] { font-variant-numeric: tabular-nums; }

/* Finish Modal */
.finish-content[b-x3bk9spzui] { text-align: center; padding: 8px 0; }
.finish-stats[b-x3bk9spzui] { display: flex; justify-content: center; gap: 32px; margin-bottom: 16px; }
.finish-stat[b-x3bk9spzui] { display: flex; flex-direction: column; align-items: center; }
.finish-stat-value[b-x3bk9spzui] { font-size: 24px; font-weight: 700; color: var(--bs-body-color, #212529); }
.finish-stat-label[b-x3bk9spzui] { font-size: 12px; color: var(--fitly-text-muted, #868e96); margin-top: 2px; }
.finish-warning[b-x3bk9spzui] { font-size: 14px; color: #e6a800; margin: 0; }

/* Completion Success Modal */
.completion-success-content[b-x3bk9spzui] { text-align: center; padding: 12px 0; }
.success-icon[b-x3bk9spzui] { color: #28a745; margin-bottom: 12px; }
.completion-success-content h3[b-x3bk9spzui] { font-size: 20px; font-weight: 700; margin: 0 0 6px; color: var(--bs-body-color, #212529); }
.completion-success-content p[b-x3bk9spzui] { font-size: 14px; color: var(--fitly-text-muted, #868e96); margin: 0 0 16px; }
.completion-stats[b-x3bk9spzui] { display: flex; flex-direction: column; gap: 8px; text-align: left; background: var(--bs-secondary-bg, #f8f9fa); border-radius: 8px; padding: 14px 16px; }
.stat-item[b-x3bk9spzui] { display: flex; justify-content: space-between; font-size: 14px; }
.stat-item strong[b-x3bk9spzui] { color: var(--fitly-text-muted, #868e96); }
.stat-item span[b-x3bk9spzui] { color: var(--bs-body-color, #212529); font-weight: 500; }

/* Error State */
.error-state[b-x3bk9spzui] { text-align: center; padding: 64px 24px; color: var(--fitly-text-muted, #868e96); }
.error-state svg[b-x3bk9spzui] { margin-bottom: 12px; opacity: 0.4; }
.error-state h3[b-x3bk9spzui] { font-size: 18px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0 0 6px; }
.error-state p[b-x3bk9spzui] { font-size: 14px; margin: 0 0 16px; }
.error-actions[b-x3bk9spzui] { display: flex; gap: 8px; justify-content: center; }

/* Empty State */
.empty-state[b-x3bk9spzui] { text-align: center; padding: 48px 24px; color: var(--fitly-text-muted, #868e96); }
.empty-state svg[b-x3bk9spzui] { margin-bottom: 12px; opacity: 0.4; }
.empty-state h3[b-x3bk9spzui] { font-size: 18px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0 0 6px; }
.empty-state p[b-x3bk9spzui] { font-size: 14px; margin: 0; }

/* Buttons */
.btn[b-x3bk9spzui] { display: inline-flex; align-items: center; gap: 6px; border: none; border-radius: 8px; padding: 8px 16px; font-size: 14px; font-weight: 500; cursor: pointer; transition: background 0.15s ease; }
.btn-primary[b-x3bk9spzui] { background: var(--bs-primary, #03A9F5); color: #fff; }
.btn-primary:hover[b-x3bk9spzui] { background: #0290d0; }
.btn-primary:disabled[b-x3bk9spzui] { opacity: 0.6; cursor: not-allowed; }
.btn-secondary[b-x3bk9spzui] { background: var(--bs-secondary-bg, #e9ecef); color: var(--bs-body-color, #212529); }
.btn-danger-solid[b-x3bk9spzui] { background: #dc3545; color: #fff; border: none; border-radius: 8px; padding: 8px 16px; font-size: 14px; font-weight: 500; cursor: pointer; }
.btn-danger-solid:hover[b-x3bk9spzui] { background: #c82333; }

/* Loading spinner */
[b-x3bk9spzui] .loading-spinner.small { width: 16px; height: 16px; }

/* Responsive */
@media (max-width: 768px) {
    .session-header[b-x3bk9spzui] { flex-wrap: wrap; gap: 12px; }
    .session-header-right[b-x3bk9spzui] { width: 100%; justify-content: flex-end; }
    .rest-timer-bar[b-x3bk9spzui] { padding: 8px 12px; }
    .timer-bar-content[b-x3bk9spzui] { gap: 10px; }
    .rest-quick-btn[b-x3bk9spzui] { padding: 4px 8px; font-size: 11px; }
    .finish-stats[b-x3bk9spzui] { gap: 20px; }
}

@media (max-width: 600px) {
    .session-header[b-x3bk9spzui] { flex-wrap: wrap; }
    .session-title-area h1[b-x3bk9spzui] { font-size: 18px; }
    .sets-list-header[b-x3bk9spzui] { grid-template-columns: 32px 1fr 1fr 40px 28px; gap: 4px; font-size: 10px; }
    .set-row[b-x3bk9spzui] { grid-template-columns: 32px 1fr 1fr 40px 28px; gap: 4px; padding: 6px; }
    .input-with-controls input[b-x3bk9spzui] { width: 40px; font-size: 13px; }
    .control-btn[b-x3bk9spzui] { width: 24px; }
    .set-tabs[b-x3bk9spzui] { gap: 4px; }
    .set-tab[b-x3bk9spzui] { padding: 6px 10px; font-size: 12px; }
    .set-tab-name[b-x3bk9spzui] { max-width: 80px; }
    .exercise-section[b-x3bk9spzui] { padding: 12px; }
    .btn-complete[b-x3bk9spzui] { padding: 8px 14px; font-size: 13px; }
    .rest-timer-controls[b-x3bk9spzui] { gap: 4px; }
    .workout-time[b-x3bk9spzui] { font-size: 12px; }
    .finish-stats[b-x3bk9spzui] { flex-direction: column; gap: 12px; }
}
/* /Components/Pages/App/Settings.razor.rz.scp.css */
/* Settings Page */
.settings-container[b-61tncy0svi] {
    padding: 0;
    background-color: var(--fitly-bg-accent, #f8f9fa);
    min-height: 100%;
}

/* Main Tab Container */
.settings-tabs[b-61tncy0svi] {
    background: var(--bs-card-bg, #fff);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--bs-border-color, #dee2e6);
    overflow: hidden;
    max-width: 600px;
}

/* Tab Navigation */
.settings-tabs .tab-header[b-61tncy0svi] {
    background: var(--bs-secondary-bg, #f8f9fa);
    border-bottom: 1px solid var(--bs-border-color, #dee2e6);
    display: flex;
    width: 100%;
}

.settings-tabs .tab-button[b-61tncy0svi] {
    flex: 1;
    min-width: auto;
    padding: 12px;
    background: transparent;
    border: none;
    color: var(--bs-secondary, #6c757d);
    font-weight: 500;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    border-bottom: 3px solid transparent;
    position: relative;
    min-height: 48px;
}

.settings-tabs .tab-button:hover[b-61tncy0svi] {
    background: var(--bs-tertiary-bg, #e9ecef);
    color: var(--bs-primary, #03A9F5);
}

.settings-tabs .tab-button.active[b-61tncy0svi] {
    background: var(--bs-card-bg, #fff);
    color: var(--bs-primary, #03A9F5);
    border-bottom-color: var(--bs-primary, #03A9F5);
    font-weight: 600;
}

.settings-tabs .tab-button svg[b-61tncy0svi] {
    display: none;
}

.settings-tab-content[b-61tncy0svi] {
    padding: 16px;
    background: var(--bs-card-bg, #fff);
}

/* Settings Section (Help tab) */
.settings-section[b-61tncy0svi] {
    padding: 16px;
    background-color: var(--bs-card-bg, #fff);
    border-radius: 8px;
    width: 100%;
}

.settings-group[b-61tncy0svi] {
    margin-bottom: 8px;
}

.settings-group:last-child[b-61tncy0svi] {
    margin-bottom: 0;
}

/* Settings Items (Help tab) */
.settings-item[b-61tncy0svi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--fitly-border-light, #e9ecef);
    min-height: 48px;
    gap: 12px;
}

.settings-item:last-child[b-61tncy0svi] {
    border-bottom: none;
}

.settings-item > span:first-child[b-61tncy0svi] {
    font-size: 15px;
    color: var(--bs-body-color, #212529);
    font-weight: 500;
    flex-shrink: 0;
}

.link-button[b-61tncy0svi] {
    font-size: 14px;
    font-weight: 500;
    color: var(--bs-primary, #03A9F5);
    text-decoration: none;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.link-button:hover[b-61tncy0svi] {
    text-decoration: underline;
}

.settings-section[b-61tncy0svi] { margin-bottom: 24px; }
.settings-section-title[b-61tncy0svi] { font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--fitly-text-muted, #868e96); margin: 0 0 8px 4px; }

.settings-card[b-61tncy0svi] { background: var(--bs-card-bg, #fff); border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 12px; overflow: hidden; }
.settings-card.danger[b-61tncy0svi] { border-color: rgba(220, 53, 69, 0.2); }

/* Profile Row */
.profile-row[b-61tncy0svi] { display: flex; align-items: center; gap: 14px; padding: 16px; }
.profile-avatar[b-61tncy0svi] { width: 48px; height: 48px; border-radius: 50%; background: var(--bs-tertiary-bg, #e9ecef); display: flex; align-items: center; justify-content: center; color: var(--fitly-text-muted, #868e96); }
.profile-info h3[b-61tncy0svi] { font-size: 16px; font-weight: 600; color: var(--bs-body-color, #212529); margin: 0; }
.profile-info p[b-61tncy0svi] { font-size: 13px; color: var(--bs-secondary, #6c757d); margin: 2px 0 0; }

/* Role Display */
.role-item[b-61tncy0svi] { cursor: default; }
.role-item:hover[b-61tncy0svi] { background: transparent; }
.role-icon-wrapper[b-61tncy0svi] { display: flex; align-items: center; color: var(--bs-primary, #03A9F5); }
.role-value[b-61tncy0svi] { font-size: 14px; font-weight: 500; color: var(--bs-secondary, #6c757d); }
.premium-badge[b-61tncy0svi] { font-size: 12px; font-weight: 700; color: #b45309; background: rgba(234,179,8,0.12); border: 1px solid rgba(234,179,8,0.35); border-radius: 20px; padding: 2px 10px; letter-spacing: 0.02em; }

/* Settings Items */
.settings-item[b-61tncy0svi] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 16px; cursor: pointer; text-decoration: none;
    color: var(--bs-body-color, #212529);
    transition: background 0.15s ease;
    border-top: 1px solid var(--fitly-border-light, #e9ecef);
}
.settings-item:first-child[b-61tncy0svi] { border-top: none; }
.settings-item:hover[b-61tncy0svi] { background: var(--bs-secondary-bg, #f8f9fa); }
.settings-item svg[b-61tncy0svi] { color: var(--fitly-text-muted, #868e96); flex-shrink: 0; }

.settings-item-left[b-61tncy0svi] { display: flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 500; }
.settings-item-left svg[b-61tncy0svi] { color: var(--bs-secondary, #6c757d); }

.text-danger[b-61tncy0svi] { color: var(--bs-danger, #dc3545) !important; }
.danger-icon svg[b-61tncy0svi] { color: var(--bs-danger, #dc3545); }

/* Alert */
.alert[b-61tncy0svi] { padding: 12px 16px; border-radius: 8px; font-size: 14px; margin-bottom: 16px; }
.alert-success[b-61tncy0svi] { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.alert-danger[b-61tncy0svi] { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

/* FitlyTag Editing */
.fitlytag-item[b-61tncy0svi] { cursor: default; }
.fitlytag-item:hover[b-61tncy0svi] { background: transparent; }

.tag-display[b-61tncy0svi] { display: flex; align-items: center; gap: 10px; }
.tag-value[b-61tncy0svi] { font-size: 14px; color: var(--bs-secondary, #6c757d); font-weight: 500; }

.tag-edit-form[b-61tncy0svi] { display: flex; flex-direction: column; gap: 6px; min-width: 220px; }
.tag-input-row[b-61tncy0svi] { display: flex; align-items: center; gap: 2px; }
.tag-prefix[b-61tncy0svi] { font-size: 14px; font-weight: 600; color: var(--bs-secondary, #6c757d); }

.tag-input[b-61tncy0svi] {
    flex: 1; padding: 6px 10px; border-radius: 6px;
    border: 1px solid var(--bs-border-color, #dee2e6);
    font-size: 14px; color: var(--bs-body-color, #212529);
    min-width: 0;
}
.tag-input:focus[b-61tncy0svi] { outline: none; border-color: var(--bs-primary, #03A9F5); box-shadow: 0 0 0 2px rgba(3, 169, 245, 0.15); }
.tag-input.tag-available[b-61tncy0svi] { border-color: #28a745; }
.tag-input.tag-taken[b-61tncy0svi] { border-color: #dc3545; }

.tag-status[b-61tncy0svi] { font-size: 12px; font-weight: 500; }
.tag-status.checking[b-61tncy0svi] { color: var(--fitly-text-muted, #868e96); }
.tag-status.available[b-61tncy0svi] { color: #28a745; }
.tag-status.taken[b-61tncy0svi] { color: #dc3545; }

.tag-edit-actions[b-61tncy0svi] { display: flex; justify-content: flex-end; gap: 8px; margin-top: 2px; }

@media (max-width: 576px) {
    .page-header h1[b-61tncy0svi] {
        font-size: 22px;
    }

    .settings-item[b-61tncy0svi] {
        padding: 12px 14px;
    }

    .settings-item-left[b-61tncy0svi] {
        font-size: 14px;
        gap: 10px;
    }

    .profile-row[b-61tncy0svi] {
        padding: 14px;
    }

    .tag-edit-form[b-61tncy0svi] {
        min-width: 0;
        width: 100%;
    }
}
/* /Components/Pages/App/Trainer.razor.rz.scp.css */
/* Styles moved to TrainerPageContent.razor.css in Fitly.Shared.Views */

/* /Components/Pages/Db/AnonymousRoutineBuilder.razor.rz.scp.css */
.rb-hero[b-0w5fp4tr35] {
    padding: 40px 0 28px;
}
.rb-hero h1[b-0w5fp4tr35] { font-size: clamp(1.75rem, 3.5vw, 2.5rem); font-weight: 800; margin: 0 0 8px; }
.rb-hero-lead[b-0w5fp4tr35] { color: rgba(255,255,255,.8); font-size: 1.05rem; margin: 0; max-width: 720px; }

.rb-body[b-0w5fp4tr35] { padding: 32px 0 96px; background: #f8fafc; min-height: 50vh; }

.rb-empty[b-0w5fp4tr35] {
    background: #fff; border: 1px dashed #cbd5e1; border-radius: 14px;
    padding: 40px 24px; text-align: center;
}

.rb-list[b-0w5fp4tr35] {
    list-style: none; padding: 0; margin: 0;
    display: grid; gap: 10px;
}
.rb-item[b-0w5fp4tr35] {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center; gap: 12px;
    background: #fff; border: 1px solid #e6e8ec;
    border-radius: 12px; padding: 12px 14px;
    box-shadow: 0 2px 6px rgba(15,23,42,.04);
}
.rb-pos[b-0w5fp4tr35] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 50%;
    background: #2563eb; color: #fff; font-weight: 700; font-size: .85rem;
}
.rb-name[b-0w5fp4tr35] {
    color: #0f172a; text-decoration: none; font-weight: 600;
}
.rb-name:hover[b-0w5fp4tr35] { color: #2563eb; text-decoration: underline; }
.rb-actions[b-0w5fp4tr35] { display: inline-flex; gap: 6px; }

.rb-toolbar[b-0w5fp4tr35] {
    display: flex; align-items: center; justify-content: space-between;
    margin-top: 18px; gap: 12px; flex-wrap: wrap;
}

.rb-sticky[b-0w5fp4tr35] {
    position: fixed; left: 0; right: 0; bottom: 0;
    background: #0f172a; color: #fff;
    z-index: 30;
    box-shadow: 0 -8px 24px rgba(0,0,0,.18);
}
.rb-sticky-inner[b-0w5fp4tr35] {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; padding: 12px 16px; flex-wrap: wrap;
}
.rb-sticky-sub[b-0w5fp4tr35] { color: #cbd5e1; margin-left: 8px; font-size: .9rem; }
/* /Components/Pages/Db/AnonymousRoutineClaim.razor.rz.scp.css */
.rb-claim[b-imxdzjufqy] {
    padding: 48px 0 96px;
    min-height: 60vh;
    background: #f8fafc;
}
.rb-claim h1[b-imxdzjufqy] { color: #0f172a; }

.rb-claim-list[b-imxdzjufqy] {
    list-style: none; padding: 0; margin: 0 0 16px 0;
    display: grid; gap: 6px;
}
.rb-claim-list li[b-imxdzjufqy] {
    display: flex; align-items: center; gap: 10px;
    background: #fff; border: 1px solid #e2e8f0;
    border-radius: 10px; padding: 8px 12px;
    color: #1e293b; font-size: .95rem;
}
.rb-claim-pos[b-imxdzjufqy] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: 50%;
    background: #2563eb; color: #fff; font-weight: 700; font-size: .75rem;
}
/* /Components/Pages/Db/Components/ExerciseFilterRail.razor.rz.scp.css */
.ex-filter-rail[b-lqaddvf4nv] {
    background: #ffffff;
    border: 1px solid #e6e8ec;
    border-radius: 12px;
    padding: 10px 14px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
}

.ex-filter-bar[b-lqaddvf4nv] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* Search */
.ex-filter-search[b-lqaddvf4nv] {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 200px;
    min-width: 160px;
    max-width: 320px;
}
.ex-filter-search-icon[b-lqaddvf4nv] {
    position: absolute; left: 10px;
    color: #94a3b8; pointer-events: none;
    display: inline-flex;
}
.ex-filter-search-input[b-lqaddvf4nv] {
    width: 100%;
    padding: 7px 30px 7px 32px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    font-size: .875rem;
    background: #f8fafc;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.ex-filter-search-input:focus[b-lqaddvf4nv] {
    outline: none;
    border-color: #2563eb;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}
.ex-filter-search-clear[b-lqaddvf4nv] {
    position: absolute; right: 7px;
    background: transparent; border: none; cursor: pointer;
    color: #94a3b8; padding: 3px; border-radius: 4px; display: inline-flex;
}
.ex-filter-search-clear:hover[b-lqaddvf4nv] { color: #334155; }

/* Level pills */
.ex-filter-pills[b-lqaddvf4nv] { display: inline-flex; gap: 4px; }
.ex-pill[b-lqaddvf4nv] {
    border: 1px solid #cbd5e1; background: #fff;
    color: #475569; font-size: .78rem; font-weight: 600;
    padding: 5px 11px; border-radius: 999px;
    cursor: pointer; transition: all .15s ease; white-space: nowrap;
}
.ex-pill:hover[b-lqaddvf4nv] { border-color: #94a3b8; color: #0f172a; }
.ex-pill.active[b-lqaddvf4nv] { background: #2563eb; border-color: #2563eb; color: #fff; }

/* Dropdowns */
.ex-filter-select[b-lqaddvf4nv] {
    border: 1px solid #cbd5e1;
    background: #fff;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: .875rem;
    color: #0f172a;
    cursor: pointer;
    transition: border-color .15s ease;
    white-space: nowrap;
}
.ex-filter-select:focus[b-lqaddvf4nv] {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,.12);
}

/* Reset button */
.ex-filter-reset[b-lqaddvf4nv] {
    display: inline-flex; align-items: center; gap: 5px;
    border: 1px solid #e2e8f0; background: #f8fafc;
    color: #64748b; font-size: .78rem; font-weight: 600;
    padding: 5px 11px; border-radius: 8px;
    cursor: pointer; transition: all .15s ease; white-space: nowrap;
}
.ex-filter-reset:hover[b-lqaddvf4nv] { border-color: #94a3b8; color: #0f172a; background: #f1f5f9; }

@media (max-width: 640px) {
    .ex-filter-search[b-lqaddvf4nv] { max-width: 100%; flex: 1 1 100%; }
    .ex-filter-bar[b-lqaddvf4nv] { gap: 6px; }
}
/* /Components/Pages/Db/Components/ExerciseGrid.razor.rz.scp.css */
.ex-grid[b-54yprcapiw] { width: 100%; }
.ex-grid-list[b-54yprcapiw] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}
.ex-grid-virtualized[b-54yprcapiw] { display: block; }
.ex-grid-virtualized[b-54yprcapiw]  .ex-card { margin-bottom: 12px; }

.ex-grid-loadmore[b-54yprcapiw] {
    margin-top: 24px;
    text-align: center;
}
.ex-grid-loadmore-count[b-54yprcapiw] {
    font-size: .8rem; opacity: .65;
}

.ex-card[b-54yprcapiw] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid #e6e8ec;
    border-radius: 12px;
    padding: 16px 16px 12px 16px;
    text-decoration: none;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
    min-height: 132px;
}
.ex-card:hover[b-54yprcapiw], .ex-card:focus-visible[b-54yprcapiw] {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
    border-color: #cfd5de;
    outline: none;
}

.ex-card-head[b-54yprcapiw] { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.ex-card-title[b-54yprcapiw] { font-size: 1rem; font-weight: 600; margin: 0; line-height: 1.25; color: #0f172a; }
.ex-card-variant[b-54yprcapiw] {
    font-size: .7rem; font-weight: 600;
    color: #6b21a8; background: #f3e8ff;
    border-radius: 999px; padding: 2px 8px;
    white-space: nowrap;
}

.ex-card-meta[b-54yprcapiw] { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ex-chip[b-54yprcapiw] {
    font-size: .72rem; font-weight: 600;
    padding: 3px 9px; border-radius: 999px;
    background: #f1f5f9; color: #334155;
    border: 1px solid transparent;
}
.ex-chip-muscle[b-54yprcapiw] { background: #ecfeff; color: #0e7490; }
.ex-chip-equipment[b-54yprcapiw] { background: #fef3c7; color: #92400e; }
.ex-chip-level.ex-level-1[b-54yprcapiw] { background: #dcfce7; color: #166534; }
.ex-chip-level.ex-level-2[b-54yprcapiw] { background: #fef9c3; color: #854d0e; }
.ex-chip-level.ex-level-3[b-54yprcapiw] { background: #fee2e2; color: #991b1b; }

.ex-card-desc[b-54yprcapiw] {
    font-size: .85rem; color: #475569;
    margin: 10px 0 0 0;
    display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden;
}

.ex-card-cta[b-54yprcapiw] {
    display: inline-flex; align-items: center; gap: 4px;
    margin-top: 10px;
    font-size: .8rem; font-weight: 600; color: #2563eb;
}
.ex-card-arrow[b-54yprcapiw] { transition: transform .15s ease; }
.ex-card:hover .ex-card-arrow[b-54yprcapiw] { transform: translateX(2px); }

.ex-grid-empty[b-54yprcapiw] {
    text-align: center; padding: 32px 16px;
    border: 1px dashed #cbd5e1; border-radius: 12px;
    background: #f8fafc;
}
/* /Components/Pages/Db/Components/MembersOnlyVideoCard.razor.rz.scp.css */
.members-only-video[b-ojagvyzq9o] {
    border: 1px solid #e6e8ec;
    border-radius: 14px;
    overflow: hidden;
    background: #0f172a;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 14px rgba(15, 23, 42, .08);
}
.mov-svg[b-ojagvyzq9o] {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
}
.mov-cta[b-ojagvyzq9o] {
    padding: 14px 16px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}
.mov-cta-text[b-ojagvyzq9o] {
    color: #334155;
    font-size: .9rem;
    line-height: 1.4;
    flex: 1 1 220px;
}
/* /Components/Pages/Db/ExerciseDetail.razor.rz.scp.css */
.ex-detail-hero[b-uhl3uydw5u] {
    padding: 40px 0 32px;
}
.ex-crumbs[b-uhl3uydw5u] { font-size: .85rem; color: #cbd5e1; margin-bottom: 6px; }
.ex-crumbs a[b-uhl3uydw5u] { color: #93c5fd; text-decoration: none; }
.ex-crumbs a:hover[b-uhl3uydw5u] { text-decoration: underline; }
.ex-crumbs span[aria-hidden="true"][b-uhl3uydw5u] { margin: 0 6px; opacity: .5; }

.ex-detail-headline[b-uhl3uydw5u] {
    display: flex; align-items: center; flex-wrap: wrap;
    gap: 12px; margin: 6px 0 14px;
}
.ex-detail-headline h1[b-uhl3uydw5u] {
    font-size: clamp(1.85rem, 4vw, 2.75rem);
    font-weight: 800; margin: 0;
}
.ex-detail-variant-of[b-uhl3uydw5u] {
    background: rgba(255,255,255,.1);
    color: #c7d2fe; text-decoration: none;
    border: 1px solid rgba(255,255,255,.2);
    padding: 4px 10px; border-radius: 999px;
    font-size: .8rem; font-weight: 600;
}
.ex-detail-variant-of:hover[b-uhl3uydw5u] { background: rgba(255,255,255,.18); color: #fff; }

.ex-detail-chips[b-uhl3uydw5u] {
    display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px;
}
.ex-detail-chips .ex-chip[b-uhl3uydw5u] {
    text-decoration: none; transition: opacity .15s ease; color: white !important; margin-right: 25px;
}
.ex-detail-chips .ex-chip:hover[b-uhl3uydw5u] { opacity: .85; }
.ex-detail-chips .ex-chip-muscle.is-primary[b-uhl3uydw5u] {
    background: #0e7490; color: #fff;
}

.ex-detail-body[b-uhl3uydw5u] { padding: 32px 0 96px; background: #f8fafc; }
.ex-detail-side[b-uhl3uydw5u] { position: sticky; top: 24px; display: grid; gap: 16px; }

.ex-detail-body h2[b-uhl3uydw5u] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin-top: 28px;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid #e2e8f0;
}

.ex-howto[b-uhl3uydw5u] {
    margin: 0; padding-left: 1.25rem;
    line-height: 1.6; color: #1e293b;
}
.ex-howto li[b-uhl3uydw5u] { margin-bottom: 10px; }
.ex-cues[b-uhl3uydw5u], .ex-mistakes[b-uhl3uydw5u] {
    margin: 0; padding-left: 1.1rem; color: #334155; line-height: 1.55;
}
.ex-cues li[b-uhl3uydw5u], .ex-mistakes li[b-uhl3uydw5u] { margin-bottom: 6px; }

.ex-cta-card[b-uhl3uydw5u] {
    background: #fff; border: 1px solid #e6e8ec;
    border-radius: 14px; padding: 18px;
    box-shadow: 0 4px 14px rgba(15,23,42,.05);
}

.ex-sticky-cta[b-uhl3uydw5u] {
    position: fixed; left: 0; right: 0; bottom: 0;
    background: #0f172a; color: #fff;
    transform: translateY(110%); transition: transform .25s ease;
    z-index: 30;
    box-shadow: 0 -8px 24px rgba(0,0,0,.18);
}
.ex-sticky-cta.is-visible[b-uhl3uydw5u] { transform: translateY(0); }
.ex-sticky-inner[b-uhl3uydw5u] {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; padding: 12px 16px; flex-wrap: wrap;
}
.ex-sticky-sub[b-uhl3uydw5u] { color: #cbd5e1; margin-left: 8px; font-size: .9rem; }
.ex-sticky-actions[b-uhl3uydw5u] { display: inline-flex; gap: 8px; }

@media (max-width: 991px) {
    .ex-detail-side[b-uhl3uydw5u] { position: static; }
}
/* /Components/Pages/Db/ExercisesByEquipment.razor.rz.scp.css */
.ex-group-hero[b-pnisg283w1] {
    padding: 40px 0 28px;
}
.ex-group-hero h1[b-pnisg283w1] {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 800;
    margin: 8px 0 8px;
}
.ex-group-lead[b-pnisg283w1] { color: #cbd5e1; font-size: 1.05rem; margin: 0; }
.ex-crumbs[b-pnisg283w1] { font-size: .85rem; color: #cbd5e1; }
.ex-crumbs a[b-pnisg283w1] { color: #93c5fd; text-decoration: none; }
.ex-crumbs a:hover[b-pnisg283w1] { text-decoration: underline; }
.ex-crumbs span[aria-hidden="true"][b-pnisg283w1] { margin: 0 6px; opacity: .5; }

.ex-group-body[b-pnisg283w1] { padding: 32px 0 56px; background: #f8fafc; }
/* /Components/Pages/Db/ExercisesByMuscle.razor.rz.scp.css */
.ex-group-hero[b-ww70r2yibk] {
    padding: 40px 0 28px;
}
.ex-group-hero h1[b-ww70r2yibk] {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 800;
    margin: 8px 0 8px;
}
.ex-group-lead[b-ww70r2yibk] { color: #cbd5e1; font-size: 1.05rem; margin: 0; }
.ex-crumbs[b-ww70r2yibk] { font-size: .85rem; color: #cbd5e1; }
.ex-crumbs a[b-ww70r2yibk] { color: #93c5fd; text-decoration: none; }
.ex-crumbs a:hover[b-ww70r2yibk] { text-decoration: underline; }
.ex-crumbs span[aria-hidden="true"][b-ww70r2yibk] { margin: 0 6px; opacity: .5; }

.ex-group-body[b-ww70r2yibk] { padding: 32px 0 56px; background: #f8fafc; }
/* /Components/Pages/Db/ExercisesIndex.razor.rz.scp.css */
.ex-hero[b-lct4xs3h7x] {
    padding: 56px 0 40px;
    margin-bottom: 0;
}
.ex-hero h1[b-lct4xs3h7x] {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    margin-bottom: 12px;
}
.ex-hero-lead[b-lct4xs3h7x] {
    font-size: 1.1rem;
    color: rgba(255,255,255,.8);
    max-width: 720px;
    margin-bottom: 16px;
}
.ex-hero-stats[b-lct4xs3h7x] {
    display: flex; gap: 12px; flex-wrap: wrap;
    color: rgba(255,255,255,.7); font-size: .9rem;
}
.ex-hero-stats strong[b-lct4xs3h7x] { color: #fff; font-weight: 700; }

.ex-library[b-lct4xs3h7x] { padding: 32px 0 24px; background: #f8fafc; }

.ex-results-meta[b-lct4xs3h7x] {
    color: #475569; font-size: .9rem;
    margin: 0 0 12px 0;
}

.ex-secondary[b-lct4xs3h7x] { padding: 32px 0 56px; background: #fff; }
.ex-secondary h2[b-lct4xs3h7x] { margin-bottom: 12px; color: #0f172a; }
.ex-tag-cloud[b-lct4xs3h7x] { display: flex; flex-wrap: wrap; gap: 6px; }
.ex-tag[b-lct4xs3h7x] {
    display: inline-flex; align-items: center; gap: 6px;
    background: #f1f5f9; color: #1e293b;
    border: 1px solid #e2e8f0; border-radius: 999px;
    padding: 5px 12px; font-size: .85rem; font-weight: 500;
    text-decoration: none; transition: all .15s ease;
}
.ex-tag:hover[b-lct4xs3h7x] { background: #2563eb; color: #fff; border-color: #2563eb; }
.ex-tag span[b-lct4xs3h7x] { font-size: .72rem; opacity: .65; font-weight: 700; }
.ex-tag:hover span[b-lct4xs3h7x] { opacity: .9; }
/* /Components/Pages/Free/LeadMagnetLanding.razor.rz.scp.css */
.lm-crumbs[b-cixgo9luk8] {
    font-size: .85rem;
    color: rgba(255, 255, 255, 0.78);
    margin-bottom: 8px;
}

.lm-crumbs a[b-cixgo9luk8] {
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
}

.lm-crumbs a:hover[b-cixgo9luk8],
.lm-crumbs a:focus-visible[b-cixgo9luk8] {
    color: #ffffff;
    text-decoration: underline;
}

.lm-crumbs span[aria-hidden="true"][b-cixgo9luk8] {
    margin: 0 6px;
    opacity: .55;
}
/* /Components/Shared/AppStoreButtons.razor.rz.scp.css */
/* App Store Buttons Component Styles */

.app-store-buttons[b-9qcfkch0gr] {
    margin: 2rem 0;
}

.app-store-btn[b-9qcfkch0gr] {
    display: inline-block;
    transition: all 0.2s ease;
    text-decoration: none;
}

.app-store-btn:hover[b-9qcfkch0gr] {
    transform: translateY(-2px);
    opacity: 0.9;
}

.app-store-btn:active[b-9qcfkch0gr] {
    transform: translateY(0);
}

.store-badge[b-9qcfkch0gr] {
    height: 40px;
    width: auto;
    display: block;
}

/* Apple Store specific styles */
.app-store-btn.apple-store .store-badge[b-9qcfkch0gr] {
    width: 120px;
}

/* Google Play specific styles */
.app-store-btn.google-play .store-badge[b-9qcfkch0gr] {
    width: 135px;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .app-store-buttons .d-flex:not(.flex-column)[b-9qcfkch0gr] {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    
    .app-store-buttons.text-center .d-flex[b-9qcfkch0gr] {
        align-items: center !important;
    }
}
/* /Components/Shared/ComingSoonBadge.razor.rz.scp.css */
.coming-soon-badge[b-8wol7lo0lo] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.15rem 0.55rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    color: #0b6e3f;
    background-color: #e6f7ee;
    border: 1px solid #b7e4c7;
    border-radius: 999px;
    vertical-align: middle;
    letter-spacing: 0.01em;
    text-transform: uppercase;
}

.coming-soon-dot[b-8wol7lo0lo] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #2da44e;
    box-shadow: 0 0 0 2px rgba(45, 164, 78, 0.18);
}

.marketing-breadcrumbs[b-8wol7lo0lo] {
    margin: 0.5rem 0 1rem;
}

.marketing-breadcrumbs .breadcrumb[b-8wol7lo0lo] {
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 0.9rem;
}

.marketing-breadcrumbs .breadcrumb-item.active[b-8wol7lo0lo] {
    color: #6c757d;
}
/* /Components/Shared/FeatureIcons.razor.rz.scp.css */
/* Feature SVG Icons Styling */

.feature-svg-icon[b-wui26e57nf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.feature-svg-icon svg[b-wui26e57nf] {
    width: 1em;
    height: 1em;
    display: block;
}

/* Icon within feature cards - ensure white color on blue background */
.feature-icon[b-wui26e57nf] {
    background: linear-gradient(135deg, var(--fitly-primary) 0%, var(--fitly-primary-dark) 100%);
}

.feature-icon .feature-svg-icon[b-wui26e57nf] {
    font-size: 2.5rem;
    color: white !important;
}

.feature-icon .feature-svg-icon svg[b-wui26e57nf] {
    fill: white;
}

/* Ensure icons scale properly */
.feature-svg-icon svg[b-wui26e57nf] {
    transition: transform 0.2s ease;
}

.feature-card:hover .feature-svg-icon svg[b-wui26e57nf] {
    transform: scale(1.1);
}

/* Override for non-feature-card contexts */
.feature-svg-icon svg[b-wui26e57nf] {
    fill: currentColor;
}

/* /Components/Shared/FitlyLogo.razor.rz.scp.css */
/* Fitly Logo Component Styles */
.fitly-logo[b-oc95gmqjfd] {
    font-family: 'Bangers', cursive;
    font-size: 2.5rem;
    color: var(--fitly-primary);
    text-decoration: none;
    display: inline-block;
    letter-spacing: -0.03em;
    transition: opacity 0.2s ease;
}

.fitly-logo:hover[b-oc95gmqjfd] {
    opacity: 0.8;
    color: var(--fitly-primary);
    text-decoration: none;
}

.fitly-logo-suffix[b-oc95gmqjfd] {
    font-size: 0.8em;
}

/* Navbar variant - smaller for navigation bar */
.fitly-logo.navbar-brand[b-oc95gmqjfd] {
    font-size: 2rem;
    display: flex;
    align-items: center;
}

/* /Components/Shared/FounderWalkthroughFloatingButton.razor.rz.scp.css */
.founder-walkthrough-fab[b-a74xhg38p1] {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 1050;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 999px;
    background: #03A9F5;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(3, 169, 245, 0.35);
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.founder-walkthrough-fab:hover[b-a74xhg38p1],
.founder-walkthrough-fab:focus-visible[b-a74xhg38p1] {
    color: #fff;
    background: #0298de;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(3, 169, 245, 0.4);
}

.founder-walkthrough-fab:focus-visible[b-a74xhg38p1] {
    outline: 2px solid #fff;
    outline-offset: 2px;
}

.founder-walkthrough-fab-icon[b-a74xhg38p1] {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .founder-walkthrough-fab[b-a74xhg38p1] {
        right: 0.75rem;
        bottom: 0.75rem;
        padding: 0.7rem 0.9rem;
        font-size: 0.875rem;
    }
}
/* /Components/Shared/MarketingBullet.razor.rz.scp.css */
.marketing-bullet[b-csk653a4dv] {
    display: inline;
}

.marketing-bullet-badge[b-csk653a4dv] {
    margin-left: 0.4rem;
    white-space: nowrap;
}