@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.ewdlgswx1m.bundle.scp.css';

/* /Components/Account/Shared/AccountLayout.razor.rz.scp.css */
/* =================================
   ACCOUNT LAYOUT - CENTERED CARD
   ================================= */

.account-layout[b-h170kwxpjl] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    width: 100%;
    background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary) 50%, var(--color-secondary-dark) 100%);
    padding: 16px;
}

.account-card[b-h170kwxpjl] {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    padding: 40px 36px 36px;
    width: 100%;
    max-width: 440px;
    animation: account-card-enter-b-h170kwxpjl 0.35s ease-out;
}

@keyframes account-card-enter-b-h170kwxpjl {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Branding */
.account-brand[b-h170kwxpjl] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 28px;
}

.account-brand-icon[b-h170kwxpjl] {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.account-brand-name[b-h170kwxpjl] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--color-primary-dark);
    letter-spacing: -0.5px;
}

/* Page title styling */
.account-card h1[b-h170kwxpjl] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1a1a2e;
    margin: 0 0 4px;
    text-align: center;
}

.account-card h2[b-h170kwxpjl] {
    font-size: 0.95rem;
    font-weight: 400;
    color: #6b7280;
    margin: 0 0 20px;
    text-align: center;
}

.account-card h3[b-h170kwxpjl] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #6b7280;
    margin: 16px 0 8px;
    text-align: center;
}

.account-card hr[b-h170kwxpjl] {
    display: none;
}

/* Divider with text */
.account-divider[b-h170kwxpjl] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 20px 0;
    color: #9ca3af;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.account-divider[b-h170kwxpjl]::before,
.account-divider[b-h170kwxpjl]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

/* Links section */
.account-links[b-h170kwxpjl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    font-size: 0.875rem;
}

.account-links p[b-h170kwxpjl] {
    margin: 0;
}

/* Status/confirmation pages */
.account-status[b-h170kwxpjl] {
    text-align: center;
    padding: 12px 0;
}

.account-status-icon[b-h170kwxpjl] {
    font-size: 3rem;
    margin-bottom: 16px;
    display: block;
}

.account-status p[b-h170kwxpjl] {
    color: #4b5563;
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0 0 16px;
}

.account-status a[b-h170kwxpjl] {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 500;
}

.account-status a:hover[b-h170kwxpjl] {
    text-decoration: underline;
}

/* Alert overrides for status messages */
.account-card .alert[b-h170kwxpjl] {
    border-radius: 8px;
    font-size: 0.875rem;
    padding: 10px 14px;
    margin-bottom: 16px;
}

.account-card .alert-danger[b-h170kwxpjl] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.account-card .alert-success[b-h170kwxpjl] {
    background: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.account-card .alert-info[b-h170kwxpjl] {
    background: #eff6ff;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

/* Text styling */
.account-card .text-danger[b-h170kwxpjl] {
    color: #dc2626;
    font-size: 0.8rem;
}

.account-card header h1.text-danger[b-h170kwxpjl] {
    color: #dc2626;
}

.account-card header p.text-danger[b-h170kwxpjl] {
    color: #4b5563;
}

/* Mobile responsive */
@media (max-width: 480px) {
    .account-layout[b-h170kwxpjl] {
        padding: 0;
        align-items: stretch;
    }
    
    .account-card[b-h170kwxpjl] {
        border-radius: 0;
        max-width: 100%;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 32px 24px;
    }
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
.manage-layout[b-76ib8zwzys] {
     padding: 1rem;
}
/* /Components/Admin/AdminWorkoutManagement.razor.rz.scp.css */
/* ===========================================================================
   ADMIN WORKOUT MANAGEMENT - MODERN RESPONSIVE LAYOUT
   =========================================================================== */

.admin-page[b-hsoword6hv] {
    padding: 20px;
    max-width: 1400px;
    margin: 0 auto;
}

.admin-header[b-hsoword6hv] {
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.header-icon[b-hsoword6hv] {
    margin-bottom: 8px;
}

.header-subtitle[b-hsoword6hv] {
    color: var(--neutral-foreground-hint);
}

.workout-admin-container[b-hsoword6hv] {
    margin: 20px 0;
}

/* Action Buttons */
.action-buttons[b-hsoword6hv] {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.action-buttons > div[b-hsoword6hv] {
    flex: 1;
    min-width: 180px;
}

@media (max-width: 600px) {
    .action-buttons[b-hsoword6hv] {
        flex-direction: column;
    }
    
    .action-buttons > div[b-hsoword6hv] {
        width: 100%;
    }
}

/* Workout Panels - Two Column Layout */
.workout-panels[b-hsoword6hv] {
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 24px;
    min-height: 600px;
}

@media (max-width: 1024px) {
    .workout-panels[b-hsoword6hv] {
        grid-template-columns: 1fr;
    }
}

/* ===========================================================================
   LEFT PANEL: Workout List
   =========================================================================== */

.workout-list-panel[b-hsoword6hv] {
    background: var(--neutral-layer-2);
    border-radius: 12px;
    padding: 16px;
    border: 1px solid var(--neutral-stroke-rest);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 200px);
}

.panel-header[b-hsoword6hv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--neutral-stroke-divider);
}

.panel-header h4[b-hsoword6hv] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
}

.workout-count[b-hsoword6hv] {
    font-size: 0.8rem;
    color: var(--neutral-foreground-hint);
}

/* Filter Section */
.filter-section[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--neutral-stroke-divider);
    margin-bottom: 16px;
}

.filter-row[b-hsoword6hv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.filter-row > div[b-hsoword6hv] {
    min-width: 0;
    overflow: hidden;
}

@media (max-width: 600px) {
    .filter-row[b-hsoword6hv] {
        grid-template-columns: 1fr;
    }
}

.filter-actions[b-hsoword6hv] {
    display: flex;
    gap: 8px;
}

.filter-actions > *[b-hsoword6hv] {
    flex: 1;
}

/* Workout List Section */
.workout-list-section[b-hsoword6hv] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.workout-items[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    overflow-y: auto;
}

/* Individual Workout Item */
.workout-list-item[b-hsoword6hv] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--neutral-layer-2);
    border-radius: 8px;
    border: 1px solid var(--neutral-stroke-divider);
    cursor: pointer;
    transition: all 0.2s ease;
}

.workout-list-item:hover[b-hsoword6hv] {
    border-color: var(--accent-fill-rest);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.workout-list-item.selected[b-hsoword6hv] {
    border-color: var(--accent-fill-rest);
    background: var(--accent-fill-focus);
}

.workout-item-date[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 40px;
    padding: 4px 8px;
    background: var(--neutral-layer-3);
    border-radius: 6px;
}

.workout-item-date .day[b-hsoword6hv] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--accent-fill-rest);
    line-height: 1;
}

.workout-item-date .month[b-hsoword6hv] {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--neutral-foreground-hint);
}

.workout-item-info[b-hsoword6hv] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.workout-item-type[b-hsoword6hv] {
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.workout-item-user[b-hsoword6hv] {
    font-size: 0.75rem;
    color: var(--accent-fill-rest);
    font-weight: 500;
}

.workout-item-phase[b-hsoword6hv] {
    font-size: 0.75rem;
    color: var(--neutral-foreground-hint);
}

.workout-item-duration[b-hsoword6hv] {
    font-size: 0.75rem;
    color: var(--neutral-foreground-hint);
    white-space: nowrap;
}

/* Loading and Empty States */
.loading-indicator[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    gap: 12px;
    color: var(--neutral-foreground-hint);
}

.empty-list[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    text-align: center;
    color: var(--neutral-foreground-hint);
}

.empty-list p[b-hsoword6hv] {
    margin: 8px 0 0 0;
    font-size: 0.9rem;
}

/* Pagination */
.pagination[b-hsoword6hv] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 0;
    border-top: 1px solid var(--neutral-stroke-divider);
    margin-top: auto;
}

.page-info[b-hsoword6hv] {
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

/* ===========================================================================
   RIGHT PANEL: Workout Details
   =========================================================================== */

.workout-detail-panel[b-hsoword6hv] {
    background: var(--neutral-layer-2);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid var(--neutral-stroke-rest);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
    overflow-y: auto;
    max-height: calc(100vh - 200px);
}

/* Workout Basic Info */
.workout-basic-info[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

.info-item[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-value[b-hsoword6hv] {
    font-weight: 600;
    color: var(--accent-fill-rest);
    font-size: 0.95rem;
}

.info-row[b-hsoword6hv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.info-row > div[b-hsoword6hv] {
    min-width: 0;
    overflow: hidden;
}

@media (max-width: 600px) {
    .info-row[b-hsoword6hv] {
        grid-template-columns: 1fr;
    }
}

/* Exercise Management */
.exercise-management[b-hsoword6hv] {
    border-top: 1px solid var(--neutral-stroke-divider);
    padding-top: 16px;
    margin-top: 16px;
}

.exercise-header[b-hsoword6hv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.exercise-header h5[b-hsoword6hv] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.exercise-list[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 400px;
    overflow-y: auto;
}

.exercise-edit-item[b-hsoword6hv] {
    display: flex;
    gap: 8px;
    padding: 12px;
    background: var(--neutral-layer-2);
    border-radius: 8px;
    border: 1px solid var(--neutral-stroke-divider);
}

.exercise-reorder[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.exercise-details[b-hsoword6hv] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.exercise-name-row[b-hsoword6hv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.exercise-name-row strong[b-hsoword6hv] {
    color: var(--accent-fill-rest);
    font-size: 0.95rem;
}

.exercise-params-row[b-hsoword6hv] {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 8px;
}

.exercise-params-row > div[b-hsoword6hv] {
    min-width: 0;
}

@media (max-width: 600px) {
    .exercise-params-row[b-hsoword6hv] {
        grid-template-columns: 1fr 1fr;
    }
}

/* Empty State */
.empty-state[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--neutral-foreground-hint);
    min-height: 300px;
}

.empty-state h4[b-hsoword6hv] {
    margin: 16px 0 8px 0;
}

.empty-state p[b-hsoword6hv] {
    margin: 0;
    font-size: 0.9rem;
}

.no-exercises-edit[b-hsoword6hv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
    text-align: center;
    background: var(--neutral-layer-3);
    border-radius: 8px;
    color: var(--neutral-foreground-hint);
}

.no-exercises-edit p[b-hsoword6hv] {
    margin: 8px 0 0 0;
}

/* Action Buttons */
.workout-actions[b-hsoword6hv] {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--neutral-stroke-divider);
}

@media (max-width: 600px) {
    .workout-actions[b-hsoword6hv] {
        flex-direction: column;
    }
}

/* ===========================================================================
   Fluent Component Overrides for Container Constraint
   =========================================================================== */

/* Ensure FluentSelect, FluentTextField, and other inputs respect container width */
.filter-row fluent-select[b-hsoword6hv],
.filter-row fluent-text-field[b-hsoword6hv],
.filter-row fluent-date-picker[b-hsoword6hv],
.info-row fluent-select[b-hsoword6hv],
.info-row fluent-text-field[b-hsoword6hv],
.info-row fluent-date-picker[b-hsoword6hv],
.info-row fluent-number-field[b-hsoword6hv] {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Ensure the internal dropdown of fluent-select doesn't overflow */
.filter-row fluent-select[b-hsoword6hv]::part(control),
.info-row fluent-select[b-hsoword6hv]::part(control) {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Fix FluentSelect dropdown clipping - target the actual listbox element */
[b-hsoword6hv] fluent-select::part(listbox) {
    max-height: 300px !important;
    position: fixed !important;
    z-index: 9999 !important;
}

[b-hsoword6hv] fluent-select .listbox {
    max-height: 300px !important;
    position: fixed !important;
    z-index: 9999 !important;
}

/* Alternative: Use custom CSS variable for listbox height */
[b-hsoword6hv] fluent-select {
    --listbox-max-height: 300px;
}

/* Exercise Purpose Styling */
.exercise-name-with-purpose[b-hsoword6hv] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Exercise item left border colors based on purpose */
.exercise-edit-item.purpose-warmup[b-hsoword6hv] {
    border-left: 3px solid var(--purpose-warmup);
}

.exercise-edit-item.purpose-technique[b-hsoword6hv] {
    border-left: 3px solid var(--purpose-technique);
}

.exercise-edit-item.purpose-corelift[b-hsoword6hv] {
    border-left: 3px solid var(--purpose-corelift);
}

.exercise-edit-item.purpose-strength[b-hsoword6hv] {
    border-left: 3px solid var(--purpose-strength);
}

.exercise-edit-item.purpose-accessory[b-hsoword6hv] {
    border-left: 3px solid var(--purpose-accessory);
}
/* /Components/Admin/Dialogs/CopyWorkoutDialog.razor.rz.scp.css */
/* Copy Workout Dialog Styles */

.copy-workout-dialog[b-r9a1v2q64d] {
	--dialog-width: min(95vw, 600px);
	--dialog-height: min(90vh, 700px);
}

.copy-workout-content[b-r9a1v2q64d] {
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-height: 60vh;
	overflow-y: auto;
}

/* Source Workout Info */
.source-workout-info h5[b-r9a1v2q64d] {
	margin: 0 0 12px 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-neutral-dark);
}

.workout-details-card[b-r9a1v2q64d] {
	padding: 12px;
	background: var(--color-secondary-light);
	border-radius: 8px;
	border: 1px solid var(--color-neutral-light);
}

.detail-row[b-r9a1v2q64d] {
	display: flex;
	justify-content: space-between;
	padding: 4px 0;
	font-size: 0.85rem;
}

.detail-row .label[b-r9a1v2q64d] {
	font-weight: 600;
	color: var(--color-neutral-medium);
}

.detail-row .value[b-r9a1v2q64d] {
	color: var(--color-neutral-dark);
}

/* Target Date Section */
.target-date-section[b-r9a1v2q64d] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Target Users Section */
.target-users-section[b-r9a1v2q64d] {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.section-header[b-r9a1v2q64d] {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.section-header h5[b-r9a1v2q64d] {
	margin: 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-neutral-dark);
}

.user-count[b-r9a1v2q64d] {
	font-size: 0.8rem;
	color: var(--color-primary);
	font-weight: 500;
}

/* User List */
.user-list[b-r9a1v2q64d] {
	max-height: 300px;
	overflow-y: auto;
	border: 1px solid var(--color-neutral-light);
	border-radius: 8px;
	padding: 8px;
	background: white;
}

.user-checkbox-item[b-r9a1v2q64d] {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 8px;
	border-radius: 6px;
	transition: background 0.2s ease;
}

.user-checkbox-item:hover:not(.disabled)[b-r9a1v2q64d] {
	background: var(--color-neutral-light);
}

.user-checkbox-item.disabled[b-r9a1v2q64d] {
	opacity: 0.5;
	cursor: not-allowed;
}

.user-email[b-r9a1v2q64d] {
	font-size: 0.75rem;
	color: var(--color-neutral-medium);
	margin-left: 28px;
}

/* Empty State */
.empty-list[b-r9a1v2q64d] {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 24px;
	text-align: center;
	color: var(--color-neutral-medium);
}

.empty-list p[b-r9a1v2q64d] {
	margin: 0;
	font-size: 0.9rem;
}

/* Copy Summary */
.copy-summary[b-r9a1v2q64d] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	background: var(--color-info-light, #e3f2fd);
	border-radius: 8px;
	border: 1px solid var(--color-info, #2196f3);
	font-size: 0.85rem;
	color: var(--color-neutral-dark);
}
/* /Components/Admin/Dialogs/CreateWorkoutDialog.razor.rz.scp.css */
/* Create Workout Dialog Styles */

.create-workout-dialog[b-ye54jc69pq] {
	--dialog-width: min(95vw, 550px);
}

.create-workout-content[b-ye54jc69pq] {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* User Selection Section */
.user-selection-section[b-ye54jc69pq] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.user-search-results[b-ye54jc69pq] {
	max-height: 200px;
	overflow-y: auto;
	border: 1px solid var(--color-neutral-light);
	border-radius: 8px;
	background: white;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.user-result-item[b-ye54jc69pq] {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px;
	cursor: pointer;
	transition: background 0.2s ease;
	border-bottom: 1px solid var(--color-neutral-light);
}

.user-result-item:last-child[b-ye54jc69pq] {
	border-bottom: none;
}

.user-result-item:hover[b-ye54jc69pq] {
	background: var(--color-neutral-light);
}

.user-result-item.selected[b-ye54jc69pq] {
	background: var(--color-primary-light);
	border-color: var(--color-primary);
}

.user-info[b-ye54jc69pq] {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.user-name[b-ye54jc69pq] {
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--color-neutral-dark);
}

.user-email[b-ye54jc69pq] {
	font-size: 0.75rem;
	color: var(--color-neutral-medium);
}

.selected-user-badge[b-ye54jc69pq] {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--color-primary-light);
	border: 1px solid var(--color-primary);
	border-radius: 20px;
	font-size: 0.85rem;
	color: var(--color-primary);
	font-weight: 500;
	width: fit-content;
}

/* Workout Details Section */
.workout-details-section[b-ye54jc69pq] {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.form-row[b-ye54jc69pq] {
	display: grid;
	grid-template-columns: auto auto;
	gap: 12px;	
}

.form-row > div[b-ye54jc69pq] {
	min-width: 0;
}

@media (max-width: 600px) {
	.form-row[b-ye54jc69pq] {
		grid-template-columns: 1fr;
	}
}
/* /Components/Admin/Dialogs/SelectWorkoutDialog.razor.rz.scp.css */
/* Select Workout Dialog Styles */

.select-workout-dialog[b-l0qnklv8sb] {
	--dialog-width: min(95vw, 700px);
	--dialog-height: min(90vh, 800px);
}

.select-workout-content[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-height: 60vh;
}

/* Filter Section */
.filter-section[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--color-neutral-light);
}

.filter-row[b-l0qnklv8sb] {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.filter-row > div[b-l0qnklv8sb] {
	min-width: 0;
}

@media (max-width: 600px) {
	.filter-row[b-l0qnklv8sb] {
		grid-template-columns: 1fr;
	}
}

/* Workout List Section */
.workout-list-section[b-l0qnklv8sb] {
	flex: 1;
	overflow-y: auto;
	min-height: 200px;
	max-height: 400px;
}

.workout-items[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.workout-select-item[b-l0qnklv8sb] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	background: white;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-light);
	cursor: pointer;
	transition: all 0.2s ease;
}

.workout-select-item:hover[b-l0qnklv8sb] {
	border-color: var(--color-primary);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.workout-select-item.selected[b-l0qnklv8sb] {
	border-color: var(--color-primary);
	background: var(--color-primary-light);
	box-shadow: 0 2px 12px rgba(0, 120, 212, 0.15);
}

.workout-item-date[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 40px;
	padding: 4px 8px;
	background: var(--color-secondary-light);
	border-radius: 6px;
}

.workout-item-date .day[b-l0qnklv8sb] {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1;
}

.workout-item-date .month[b-l0qnklv8sb] {
	font-size: 0.7rem;
	text-transform: uppercase;
	color: var(--color-neutral-medium);
}

.workout-item-info[b-l0qnklv8sb] {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.workout-item-type[b-l0qnklv8sb] {
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--color-neutral-dark);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.workout-item-details[b-l0qnklv8sb] {
	font-size: 0.75rem;
	color: var(--color-neutral-medium);
}

.workout-item-exercises[b-l0qnklv8sb] {
	font-size: 0.7rem;
	color: var(--color-primary);
	font-weight: 500;
}

.workout-item-duration[b-l0qnklv8sb] {
	font-size: 0.75rem;
	color: var(--color-neutral-medium);
	white-space: nowrap;
}

/* Loading and Empty States */
.loading-indicator[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 32px;
	gap: 12px;
	color: var(--color-neutral-medium);
}

.empty-list[b-l0qnklv8sb] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 32px;
	text-align: center;
	color: var(--color-neutral-medium);
}

.empty-list p[b-l0qnklv8sb] {
	margin: 8px 0 0 0;
	font-size: 0.9rem;
}

/* Selected Workout Preview */
.selected-workout-preview[b-l0qnklv8sb] {
	padding: 16px;
	background: var(--color-primary-light);
	border-radius: 8px;
	border: 1px solid var(--color-primary);
}

.selected-workout-preview h5[b-l0qnklv8sb] {
	margin: 0 0 12px 0;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--color-primary);
}

.preview-content p[b-l0qnklv8sb] {
	margin: 4px 0;
	font-size: 0.85rem;
	color: var(--color-neutral-dark);
}

.preview-content strong[b-l0qnklv8sb] {
	font-weight: 600;
	color: var(--color-neutral-dark);
}
/* /Components/Admin/UserEditDialog.razor.rz.scp.css */
/* User Info Section */
.user-info-section[b-jb196ia2mm] {
    padding: 12px;
}

.info-row[b-jb196ia2mm] {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    border-bottom: 1px solid var(--neutral-stroke-divider);
}

.info-row:last-child[b-jb196ia2mm] {
    border-bottom: none;
}

/* Roles Section */
.roles-section[b-jb196ia2mm] {
    padding: 12px;
}

.role-checkbox[b-jb196ia2mm] {
    padding: 8px 0;
}

/* App Access Section */
.app-access-section[b-jb196ia2mm] {
    padding: 12px;
}

.app-checkbox[b-jb196ia2mm] {
    padding: 8px 0;
}

/* Responsive Design */
@media (max-width: 768px) {
    .info-row[b-jb196ia2mm] {
        flex-direction: column;
        gap: 4px;
    }
}
/* /Components/Admin/UserManagement.razor.rz.scp.css */
/* Admin Page Layout */
.admin-page[b-i0rj7y7am8] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 24px;
}

.admin-header[b-i0rj7y7am8] {
    text-align: center;
    margin-bottom: 32px;
    padding: 24px;
    background: var(--neutral-fill-secondary-rest);
    border-radius: 12px;
    border: 1px solid var(--neutral-stroke-divider);
}

.header-icon[b-i0rj7y7am8] {
    margin-bottom: 12px;
    color: var(--accent-fill-rest);
}

.header-subtitle[b-i0rj7y7am8] {
    color: var(--neutral-foreground-hint);
    margin-top: 8px;
}

/* Users Container */
.users-container[b-i0rj7y7am8] {
    padding: 24px;
    border-radius: 12px;
    border: 1px solid var(--neutral-stroke-divider);
    background: var(--neutral-fill-rest);
}

/* Actions column layout */
.actions-cell[b-i0rj7y7am8] {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

/* Empty State */
.empty-state[b-i0rj7y7am8] {
    padding: 48px 32px;
    text-align: center;
    border: 2px dashed var(--neutral-stroke-divider);
    background: var(--neutral-fill-secondary-rest);
}

/* Desktop/Mobile View Toggle */
.desktop-view[b-i0rj7y7am8] {
    display: block;
}

.mobile-view[b-i0rj7y7am8] {
    display: none;
}

/* Mobile Card Layout - using ::deep for FluentCard child component */
[b-i0rj7y7am8] .user-card {
    margin-bottom: 16px;
    padding: 16px;
    border-radius: 12px;
    border: 1px solid var(--neutral-stroke-divider);
    background: var(--neutral-fill-rest);
}

.user-card-header[b-i0rj7y7am8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.user-avatar[b-i0rj7y7am8] {
    flex-shrink: 0;
    color: var(--accent-fill-rest);
}

.user-card-info[b-i0rj7y7am8] {
    flex: 1;
    min-width: 0;
}

.user-email[b-i0rj7y7am8] {
    color: var(--neutral-foreground-hint);
    word-break: break-word;
}

.user-card-details[b-i0rj7y7am8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.detail-row[b-i0rj7y7am8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.badges-container[b-i0rj7y7am8] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.user-card-actions[b-i0rj7y7am8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.user-card-actions > *[b-i0rj7y7am8] {
    min-width: 0;
}

.user-card-actions .manage-button[b-i0rj7y7am8] {
    flex: 1;
}

/* Responsive Design - tablets and below get card layout */
@media (max-width: 1024px) {
    .admin-page[b-i0rj7y7am8] {
        padding: 16px;
    }

    .admin-header[b-i0rj7y7am8] {
        padding: 20px;
        margin-bottom: 24px;
    }

    .users-container[b-i0rj7y7am8] {
        padding: 16px;
    }

    .desktop-view[b-i0rj7y7am8] {
        display: none;
    }

    .mobile-view[b-i0rj7y7am8] {
        display: block;
    }
}
/* /Components/Bar/Bar.razor.rz.scp.css */
.bar-container[b-i57act1xye] {
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto;
}

.error-message[b-i57act1xye] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    background-color: var(--error-container);
    color: var(--on-error-container);
    border-radius: 8px;
    border-left: 4px solid var(--error);
}

.error-message fluent-icon[b-i57act1xye] {
    color: var(--error);
}

/* Tablet-friendly styles */
@media (max-width: 1024px) {
    .bar-container[b-i57act1xye] {
        padding: 16px;
    }
}

@media (max-width: 768px) {
    .bar-container[b-i57act1xye] {
        padding: 12px;
    }
}
/* /Components/Bar/BarOrder.razor.rz.scp.css */
.drinks-grid[b-prglox0ay2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    margin-top: 16px;
    width: 100%;
}

.drink-card[b-prglox0ay2] {
    cursor: pointer;
    transition: all 0.2s ease;
    border: 2px solid transparent;
    padding: 16px;
}

.drink-card:hover[b-prglox0ay2] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.drink-card.selected[b-prglox0ay2] {
    border-color: var(--accent-fill-rest);
    background-color: var(--accent-fill-hover);
}

.drink-image[b-prglox0ay2] {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
}

.drink-image-placeholder[b-prglox0ay2] {
    width: 100%;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--neutral-fill-secondary-rest);
    border-radius: 8px;
    color: var(--neutral-foreground-hint);
}

.drink-description[b-prglox0ay2] {
    color: var(--neutral-foreground-hint);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
    max-height: 2.8em;
}

/* Step 1 styling */
.order-info[b-prglox0ay2] {
    max-width: 720px;
    margin: 0 auto;
    padding: 24px;
    background: linear-gradient(135deg, rgba(0,0,0,0.02), rgba(0,0,0,0.06));
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

.order-inputs[b-prglox0ay2] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.order-name[b-prglox0ay2], .order-notes[b-prglox0ay2] {
    width: 100%;
}

/* Tablet optimizations */
@media (max-width: 1024px) {
    .drinks-grid[b-prglox0ay2] {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 12px;
    }
    
    .drink-card[b-prglox0ay2] {
        padding: 12px;
    }
    
    .drink-image[b-prglox0ay2],
    .drink-image-placeholder[b-prglox0ay2] {
        height: 120px;
    }
}

@media (max-width: 768px) {
    .drinks-grid[b-prglox0ay2] {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 8px;
    }
    
    .drink-image[b-prglox0ay2],
    .drink-image-placeholder[b-prglox0ay2] {
        height: 100px;
    }
}
/* /Components/Bar/BarView.razor.rz.scp.css */
.orders-grid[b-qayo8aenij] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 20px;
    margin-top: 16px;
}

.order-card[b-qayo8aenij] {
    border-left: 4px solid var(--neutral-stroke-rest);
    transition: all 0.2s ease;
}

.order-card.status-requested[b-qayo8aenij] {
    border-left-color: var(--warning);
}

.order-card.status-inprogress[b-qayo8aenij] {
    border-left-color: var(--accent-fill-rest);
}

.order-card.status-ready[b-qayo8aenij] {
    border-left-color: var(--success);
}

.empty-state[b-qayo8aenij] {
    padding: 40px;
    text-align: center;
    background-color: var(--neutral-fill-secondary-rest);
}

.special-instructions[b-qayo8aenij] {
    background-color: var(--info-container);
    border: 1px solid var(--info);
    padding: 12px;
}

.drink-item[b-qayo8aenij] {
    background-color: var(--neutral-fill-secondary-rest);
    padding: 12px;
    border: none;
}

.customization-notes[b-qayo8aenij] {
    background-color: var(--warning-container);
    border: 1px solid var(--warning);
    padding: 8px;
}

/* Tablet optimizations */
@media (max-width: 1024px) {
    .orders-grid[b-qayo8aenij] {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 16px;
    }
}

@media (max-width: 768px) {
    .orders-grid[b-qayo8aenij] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}
/* /Components/Coffee/CoffeeApp.razor.rz.scp.css */
.coffee-container[b-czmnpmstzm] {
	padding: 16px;
	max-width: 1200px;
	margin: 0 auto;
}

.error-message[b-czmnpmstzm] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	background-color: var(--neutral-fill-secondary-rest);
	border-left: 4px solid var(--accent-fill-rest);
	border-radius: 4px;
	margin-bottom: 16px;
}

@media (max-width: 768px) {
	.coffee-container[b-czmnpmstzm] {
		padding: 8px;
	}
}

@media print {
	.coffee-container[b-czmnpmstzm] {
		padding: 0;
		max-width: none;
	}
}
/* /Components/Coffee/CoffeeOrderForm.razor.rz.scp.css */
.coffee-order-wrapper[b-ub8y5nlfox] {
	max-width: 700px;
	margin: 0 auto;
}

.order-header[b-ub8y5nlfox] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 24px 0 8px 0;
}

.order-header-text[b-ub8y5nlfox] {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.subtitle-text[b-ub8y5nlfox] {
	opacity: 0.6;
}

.empty-state[b-ub8y5nlfox] {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 48px 24px;
	margin-top: 16px;
	text-align: center;
	border: 1px dashed var(--neutral-stroke-rest);
	border-radius: 12px;
}

.empty-state-icon[b-ub8y5nlfox] {
	opacity: 0.3;
}

.order-section[b-ub8y5nlfox] {
	margin-top: 24px;
	padding: 20px 24px;
	border-radius: 12px;
	background: var(--neutral-fill-secondary-rest);
	border: 1px solid var(--neutral-stroke-divider-rest);
}

.section-label[b-ub8y5nlfox] {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
	color: var(--neutral-foreground-rest);
}

.step-number[b-ub8y5nlfox] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	flex-shrink: 0;
}

.step-brown[b-ub8y5nlfox] { background: #8B5E3C; }
.step-blue[b-ub8y5nlfox] { background: #4A90D9; }
.step-green[b-ub8y5nlfox] { background: #5CA85C; }

/* Drink type card grid */
.drink-type-grid[b-ub8y5nlfox] {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: 12px;
}

.drink-card[b-ub8y5nlfox] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 20px 8px;
	border: 2px solid var(--neutral-stroke-rest);
	border-radius: 12px;
	background: var(--neutral-fill-rest);
	cursor: pointer;
	transition: all 0.2s ease;
	font-family: inherit;
	font-size: 13px;
	color: var(--neutral-foreground-rest);
	min-height: 80px;
}

.drink-card:hover[b-ub8y5nlfox] {
	border-color: #8B5E3C;
	background: var(--neutral-fill-hover);
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.drink-card.selected[b-ub8y5nlfox] {
	border-color: #8B5E3C;
	background: rgba(139, 94, 60, 0.08);
	transform: translateY(-2px);
	box-shadow: 0 4px 16px rgba(139, 94, 60, 0.15);
}

.drink-card-name[b-ub8y5nlfox] {
	font-weight: 600;
	text-align: center;
	line-height: 1.2;
}

.drink-card.selected .drink-card-name[b-ub8y5nlfox] {
	color: #6B3F1E;
}

.drink-card-price[b-ub8y5nlfox] {
	font-size: 12px;
	font-weight: 600;
	opacity: 0.6;
}

.drink-card.selected .drink-card-price[b-ub8y5nlfox] {
	color: #8B5E3C;
	opacity: 1;
}

/* Option chips */
.option-group[b-ub8y5nlfox] {
	margin-bottom: 20px;
}

.option-group:last-child[b-ub8y5nlfox] {
	margin-bottom: 0;
}

.option-group-label[b-ub8y5nlfox] {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	opacity: 0.5;
	margin-bottom: 10px;
}

.chip-row[b-ub8y5nlfox] {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.chip-price[b-ub8y5nlfox] {
	font-size: 11px;
	opacity: 0.6;
	margin-left: 2px;
}

.option-chip.selected .chip-price[b-ub8y5nlfox] {
	opacity: 0.9;
}

.option-chip[b-ub8y5nlfox] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border: 1.5px solid var(--neutral-stroke-rest);
	border-radius: 24px;
	background: var(--neutral-fill-rest);
	cursor: pointer;
	transition: all 0.15s ease;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: var(--neutral-foreground-rest);
	white-space: nowrap;
}

.option-chip:hover[b-ub8y5nlfox] {
	border-color: #4A90D9;
	background: var(--neutral-fill-hover);
}

.option-chip.selected[b-ub8y5nlfox] {
	border-color: #4A90D9;
	background: rgba(74, 144, 217, 0.08);
	color: #2A5F9E;
	font-weight: 600;
}

/* Delivery fields */
.delivery-fields[b-ub8y5nlfox] {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	align-items: flex-end;
}

/* Order summary */
.order-summary-card[b-ub8y5nlfox] {
	margin-top: 24px;
	padding: 20px 24px;
	border-radius: 12px;
	background: var(--neutral-fill-secondary-rest);
	border: 1px solid var(--neutral-stroke-divider-rest);
	border-left: 4px solid #5CA85C;
}

.summary-header[b-ub8y5nlfox] {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	opacity: 0.5;
	margin-bottom: 12px;
}

.summary-drink[b-ub8y5nlfox] {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 12px;
	color: var(--neutral-foreground-rest);
}

.summary-details[b-ub8y5nlfox] {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 12px;
}

.summary-tag[b-ub8y5nlfox] {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 12px;
	border-radius: 16px;
	border: 1.5px solid #5CA85C;
	color: #3A7A3A;
	font-size: 12px;
	font-weight: 600;
	background: rgba(92, 168, 92, 0.06);
}

.summary-location[b-ub8y5nlfox] {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	opacity: 0.7;
}

.summary-pricing[b-ub8y5nlfox] {
	margin-top: 16px;
	padding-top: 12px;
	border-top: 1px solid var(--neutral-stroke-divider-rest);
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.price-line[b-ub8y5nlfox] {
	display: flex;
	justify-content: space-between;
	font-size: 13px;
	opacity: 0.8;
}

.price-total[b-ub8y5nlfox] {
	margin-top: 6px;
	padding-top: 8px;
	border-top: 1px solid var(--neutral-stroke-divider-rest);
	font-weight: 700;
	font-size: 15px;
	opacity: 1;
}

/* Order actions */
.order-actions[b-ub8y5nlfox] {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 24px;
	padding: 20px 24px;
	border-radius: 12px;
	background: var(--neutral-fill-secondary-rest);
	border: 1px solid var(--neutral-stroke-divider-rest);
}

.option-group-price-hint[b-ub8y5nlfox] {
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	font-size: 11px;
	opacity: 0.7;
}

.option-group-hint[b-ub8y5nlfox] {
	font-weight: 400;
	text-transform: none;
	letter-spacing: normal;
	font-size: 11px;
	opacity: 0.55;
}

@@media (max-width: 480px) {
	.drink-type-grid[b-ub8y5nlfox] {
		grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	}

	.drink-card[b-ub8y5nlfox] {
		padding: 14px 6px;
		min-height: 70px;
	}

	.option-chip[b-ub8y5nlfox] {
		padding: 6px 12px;
		font-size: 12px;
	}

	.order-section[b-ub8y5nlfox] {
		padding: 16px;
	}

	.delivery-fields[b-ub8y5nlfox] {
		flex-direction: column;
	}
}
/* /Components/Coffee/CoffeeReport.razor.rz.scp.css */
/* ==================================
   COFFEE REPORT - PRINT STYLES
   ================================== */

/* Print-only section: hidden on screen, visible on print */
.report-print[b-ta00icskkp] {
	display: none;
}

@media print {
	/* Hide the interactive screen UI */
	.report-screen[b-ta00icskkp] {
		display: none !important;
	}

	.report-print[b-ta00icskkp] {
		display: block !important;
	}

	/* Report header */
	.print-header[b-ta00icskkp] {
		text-align: center;
		margin-bottom: 24px;
		padding-bottom: 12px;
		border-bottom: 2px solid #333;
	}

	.print-header h1[b-ta00icskkp] {
		margin: 0 0 4px 0;
		font-size: 20px;
		font-weight: 700;
	}

	.print-header p[b-ta00icskkp] {
		margin: 2px 0;
		font-size: 12px;
		color: #555;
	}

	/* Summary section */
	.print-summary[b-ta00icskkp] {
		margin-bottom: 20px;
		padding: 12px;
		border: 1px solid #ccc;
		border-radius: 4px;
		background-color: #f9f9f9;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	.print-summary h2[b-ta00icskkp] {
		margin: 0 0 8px 0;
		font-size: 14px;
		font-weight: 600;
	}

	.print-summary p[b-ta00icskkp] {
		margin: 2px 0;
		font-size: 12px;
	}

	.print-summary .grand-total[b-ta00icskkp] {
		font-size: 16px;
		font-weight: 700;
		margin-top: 4px;
	}

	/* Customer group section */
	.print-customer-group[b-ta00icskkp] {
		margin-bottom: 16px;
		page-break-inside: avoid;
	}

	.print-customer-header[b-ta00icskkp] {
		display: flex;
		justify-content: space-between;
		align-items: baseline;
		padding: 6px 0;
		border-bottom: 2px solid #666;
		margin-bottom: 4px;
	}

	.print-customer-header h3[b-ta00icskkp] {
		margin: 0;
		font-size: 14px;
		font-weight: 600;
	}

	.print-customer-header span[b-ta00icskkp] {
		font-size: 12px;
		color: #555;
	}

	/* Order tables */
	.print-order-table[b-ta00icskkp] {
		width: 100%;
		border-collapse: collapse;
		font-size: 11px;
		margin-bottom: 4px;
	}

	.print-order-table th[b-ta00icskkp] {
		text-align: left;
		padding: 4px 6px;
		border-bottom: 1px solid #999;
		font-weight: 600;
		font-size: 10px;
		text-transform: uppercase;
		letter-spacing: 0.3px;
		white-space: nowrap;
	}

	.print-order-table th:last-child[b-ta00icskkp] {
		text-align: right;
	}

	.print-order-table td[b-ta00icskkp] {
		padding: 3px 6px;
		border-bottom: 1px solid #e0e0e0;
		vertical-align: top;
	}

	.print-order-table td:last-child[b-ta00icskkp] {
		text-align: right;
		white-space: nowrap;
	}

	/* Customer subtotal row */
	.print-customer-total[b-ta00icskkp] {
		text-align: right;
		font-size: 12px;
		font-weight: 600;
		padding: 6px 6px 0 0;
		border-top: 1px solid #999;
	}

	/* Grand total footer */
	.print-grand-total[b-ta00icskkp] {
		margin-top: 24px;
		padding-top: 12px;
		border-top: 2px solid #333;
		text-align: right;
		font-size: 16px;
		font-weight: 700;
	}

	/* Footer */
	.print-footer[b-ta00icskkp] {
		margin-top: 24px;
		padding-top: 8px;
		border-top: 1px solid #ccc;
		text-align: center;
		font-size: 10px;
		color: #999;
	}
}
/* /Components/Coffee/CoffeeScheduleBanner.razor.rz.scp.css */
/* ===================================================================
   CoffeeScheduleBanner — Wrapper div pattern for Fluent UI shadow DOM
   All layout is controlled via wrapper divs/classes.
   =================================================================== */

.schedule-banner[b-x83gzgbspr] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 16px;
	border-radius: 10px;
	border: 1px solid var(--neutral-stroke-divider-rest);
	margin-bottom: 12px;
	transition: background-color 0.3s ease, border-color 0.3s ease;
}

.schedule-banner.schedule-open[b-x83gzgbspr] {
	background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
	border-color: #86efac;
}

.schedule-banner.schedule-closed[b-x83gzgbspr] {
	background: var(--neutral-fill-secondary-rest);
	border-color: var(--neutral-stroke-divider-rest);
}

.schedule-status[b-x83gzgbspr] {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.status-indicator[b-x83gzgbspr] {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex-shrink: 0;
}

.indicator-open[b-x83gzgbspr] {
	background-color: #22c55e;
	box-shadow: 0 0 6px rgba(34, 197, 94, 0.5);
	animation: pulse-green-b-x83gzgbspr 2s infinite;
}

.indicator-closed[b-x83gzgbspr] {
	background-color: #9ca3af;
}

@keyframes pulse-green-b-x83gzgbspr {
	0%, 100% { box-shadow: 0 0 6px rgba(34, 197, 94, 0.4); }
	50% { box-shadow: 0 0 12px rgba(34, 197, 94, 0.7); }
}

.status-text[b-x83gzgbspr] {
	font-size: 0.9rem;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.schedule-open .status-text[b-x83gzgbspr] {
	color: #15803d;
}

.schedule-closed .status-text[b-x83gzgbspr] {
	color: var(--neutral-foreground-hint);
}

.schedule-toggle[b-x83gzgbspr] {
	display: flex;
	align-items: center;
	gap: 6px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 6px;
	color: var(--neutral-foreground-hint);
	font-size: 0.8rem;
	font-weight: 500;
	transition: background-color 0.2s ease;
	flex-shrink: 0;
}

.schedule-toggle:hover[b-x83gzgbspr] {
	background-color: rgba(0, 0, 0, 0.05);
}

.toggle-label[b-x83gzgbspr] {
	display: inline;
}

.schedule-details[b-x83gzgbspr] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 8px 16px 12px;
	margin-bottom: 12px;
	background: var(--neutral-fill-secondary-rest);
	border-radius: 0 0 10px 10px;
	border: 1px solid var(--neutral-stroke-divider-rest);
	border-top: none;
	margin-top: -12px;
}

.schedule-row[b-x83gzgbspr] {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 8px;
	border-radius: 6px;
	font-size: 0.85rem;
}

.schedule-row-today[b-x83gzgbspr] {
	background: rgba(34, 197, 94, 0.08);
	font-weight: 600;
}

.schedule-days[b-x83gzgbspr] {
	color: var(--neutral-foreground-rest);
	font-weight: 500;
	min-width: 100px;
}

.schedule-row-today .schedule-days[b-x83gzgbspr] {
	color: #15803d;
}

.schedule-times[b-x83gzgbspr] {
	color: var(--neutral-foreground-hint);
	text-align: right;
}

.schedule-row-today .schedule-times[b-x83gzgbspr] {
	color: #15803d;
}

/* Mobile responsive */
@media (max-width: 480px) {
	.schedule-banner[b-x83gzgbspr] {
		padding: 8px 12px;
		gap: 8px;
	}

	.toggle-label[b-x83gzgbspr] {
		display: none;
	}

	.status-text[b-x83gzgbspr] {
		font-size: 0.85rem;
	}

	.schedule-row[b-x83gzgbspr] {
		font-size: 0.8rem;
	}

	.schedule-days[b-x83gzgbspr] {
		min-width: 80px;
	}
}
/* /Components/Coffee/CoffeeSettings.razor.rz.scp.css */
.settings-container[b-lem04y6uv9] {
	max-width: 900px;
	margin: 0 auto;
}

.settings-header[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-bottom: 8px;
}

/* Section cards */
.settings-section[b-lem04y6uv9] {
	border-radius: 8px;
	border: 1px solid var(--neutral-stroke-divider-rest);
	overflow: hidden;
}

.section-header[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 20px;
	background: var(--neutral-fill-secondary-rest);
	border-bottom: 1px solid var(--neutral-stroke-divider-rest);
	font-weight: 600;
	font-size: 15px;
}

.section-header-accent[b-lem04y6uv9] {
	width: 4px;
	height: 24px;
	border-radius: 2px;
	flex-shrink: 0;
}

.section-title[b-lem04y6uv9] {
	flex: 1;
}

.section-count[b-lem04y6uv9] {
	font-size: 12px;
	font-weight: 400;
	opacity: 0.5;
}

.accent-brown[b-lem04y6uv9] { background: #8B5E3C; }
.accent-blue[b-lem04y6uv9] { background: #4A90D9; }
.accent-green[b-lem04y6uv9] { background: #5CA85C; }
.accent-purple[b-lem04y6uv9] { background: #9B59B6; }
.accent-teal[b-lem04y6uv9] { background: #2E8B8B; }
.accent-orange[b-lem04y6uv9] { background: #D97B2A; }
.accent-red[b-lem04y6uv9] { background: #D94A4A; }

.section-body[b-lem04y6uv9] {
	padding: 0;
}

/* Item rows */
.item-row[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 20px;
	border-bottom: 1px solid var(--neutral-stroke-divider-rest);
	transition: background 0.1s ease;
}

.item-row:last-child[b-lem04y6uv9] {
	border-bottom: none;
}

.item-row:hover[b-lem04y6uv9] {
	background: var(--neutral-fill-secondary-hover);
}

.item-row.inactive[b-lem04y6uv9] {
	opacity: 0.55;
}

.item-row.inactive:hover[b-lem04y6uv9] {
	opacity: 0.75;
}

.item-name[b-lem04y6uv9] {
	flex: 1;
	min-width: 140px;
}

.item-price[b-lem04y6uv9] {
	width: 110px;
	flex-shrink: 0;
}

.item-active[b-lem04y6uv9] {
	width: 60px;
	flex-shrink: 0;
	display: flex;
	justify-content: center;
}

.item-delete[b-lem04y6uv9] {
	width: 36px;
	flex-shrink: 0;
	display: flex;
	justify-content: center;
}

/* Add new area */
.add-new-area[b-lem04y6uv9] {
	padding: 16px 20px;
	border-top: 2px dashed var(--neutral-stroke-rest);
	background: var(--neutral-fill-secondary-rest);
}

.add-new-label[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 12px;
	opacity: 0.7;
}

.add-new-fields[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 12px;
}

.add-item-name[b-lem04y6uv9] {
	flex: 1;
	min-width: 140px;
}

.add-item-price[b-lem04y6uv9] {
	width: 110px;
	flex-shrink: 0;
}

.add-item-action[b-lem04y6uv9] {
	flex-shrink: 0;
}

/* Section footer with save button */
.section-footer[b-lem04y6uv9] {
	display: flex;
	justify-content: flex-end;
	padding: 12px 20px;
	background: var(--neutral-fill-secondary-rest);
	border-top: 1px solid var(--neutral-stroke-divider-rest);
}

/* Column labels */
.column-labels[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 6px 20px 2px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	opacity: 0.5;
	border-bottom: 1px solid var(--neutral-stroke-divider-rest);
}

.col-name[b-lem04y6uv9] {
	flex: 1;
	min-width: 140px;
}

.col-price[b-lem04y6uv9] {
	width: 110px;
	flex-shrink: 0;
}

.col-active[b-lem04y6uv9] {
	width: 60px;
	flex-shrink: 0;
	text-align: center;
}

.col-delete[b-lem04y6uv9] {
	width: 36px;
	flex-shrink: 0;
}

/* Seed defaults card */
.seed-card[b-lem04y6uv9] {
	padding: 16px 20px;
	border-radius: 8px;
	border: 1px dashed var(--neutral-stroke-rest);
	background: var(--neutral-fill-secondary-rest);
}

.seed-card-content[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.seed-card-text[b-lem04y6uv9] {
	flex: 1;
	min-width: 200px;
}

.seed-message[b-lem04y6uv9] {
	margin-top: 10px;
	font-size: 13px;
	opacity: 0.7;
}

/* Pricing matrix */
.pricing-matrix[b-lem04y6uv9] {
	padding: 16px 20px;
	overflow-x: auto;
}

.pricing-header-row[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--neutral-stroke-divider-rest);
	margin-bottom: 8px;
}

.pricing-row[b-lem04y6uv9] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 0;
}

.pricing-drink-label[b-lem04y6uv9] {
	width: 140px;
	min-width: 140px;
	font-weight: 600;
	font-size: 13px;
	flex-shrink: 0;
}

.pricing-header-row .pricing-drink-label[b-lem04y6uv9] {
	font-weight: 400;
}

.pricing-size-label[b-lem04y6uv9] {
	flex: 1;
	min-width: 100px;
	text-align: center;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	opacity: 0.6;
}

.pricing-cell[b-lem04y6uv9] {
	flex: 1;
	min-width: 100px;
}

/* Empty state */
.empty-section[b-lem04y6uv9] {
	padding: 24px 20px;
	text-align: center;
	opacity: 0.5;
	font-size: 13px;
}

@@media (max-width: 600px) {
	.item-row[b-lem04y6uv9], .add-new-fields[b-lem04y6uv9], .column-labels[b-lem04y6uv9] {
		flex-wrap: wrap;
		gap: 8px;
	}

	.item-name[b-lem04y6uv9], .add-item-name[b-lem04y6uv9] {
		min-width: 100%;
	}

	.item-price[b-lem04y6uv9], .add-item-price[b-lem04y6uv9] {
		width: auto;
		flex: 1;
	}

	.column-labels[b-lem04y6uv9] {
		display: none;
	}

	.pricing-drink-label[b-lem04y6uv9] {
		width: 100px;
		min-width: 100px;
		font-size: 12px;
	}

	.pricing-cell[b-lem04y6uv9] {
		min-width: 80px;
	}
}
/* /Components/Dinner/DinnerApp.razor.rz.scp.css */
.dinner-container[b-u6vmcebejj] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px;
    background-color: var(--color-primary-light);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

/* Error Message Styling */
.error-message[b-u6vmcebejj] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    margin-bottom: 20px;
    background-color: var(--color-danger-light);
    border: 1px solid var(--color-danger);
    border-radius: 8px;
    color: var(--color-danger-dark);
    font-weight: 500;
}

.error-message span[b-u6vmcebejj] {
    flex: 1;
}
/* /Components/Dinner/DinnerPlan.razor.rz.scp.css */
.dinner-plan-container[b-rgrfqi23vh] {
    padding: 24px;
}

.plan-header[b-rgrfqi23vh] {
    margin-bottom: 32px;
    text-align: center;
}

.plan-header h3[b-rgrfqi23vh] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-primary);
}

.plan-header p[b-rgrfqi23vh] {
    margin: 0;
    color: var(--color-secondary);
    font-size: 1rem;
}

.plan-content[b-rgrfqi23vh] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 32px;
    align-items: start;
}

/* Create Meal Section */
.create-meal-section[b-rgrfqi23vh] {
    background: var(--color-neutral);
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.create-meal-section h4[b-rgrfqi23vh] {
    margin: 0 0 20px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-primary);
}

.meal-form-grid[b-rgrfqi23vh] {
    display: grid;
    gap: 20px;
}

.recipe-search-section[b-rgrfqi23vh] {
    display: grid;
    gap: 12px;
}

.form-label[b-rgrfqi23vh] {
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 8px;
    display: block;
}

.form-actions[b-rgrfqi23vh] {
    margin-top: 12px;
}

/* Recipe Actions Section */
.recipe-actions-section[b-rgrfqi23vh] {
    background: var(--fill-color);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    position: sticky;
    top: 24px;
}

.recipe-actions-section h4[b-rgrfqi23vh] {
    margin: 0 0 20px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-primary);
}

.action-buttons[b-rgrfqi23vh] {
    display: grid;
    gap: 12px;
}

.action-buttons fluent-button[b-rgrfqi23vh] {
    width: 100%;
    justify-content: flex-start;
}

/* Responsive Design */
@media (max-width: 768px) {
    .plan-content[b-rgrfqi23vh] {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .recipe-actions-section[b-rgrfqi23vh] {
        position: static;
    }
    
    .action-buttons[b-rgrfqi23vh] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}
/* /Components/Dinner/FavoriteMeals.razor.rz.scp.css */
.favorites-container[b-kjl2lermdq] {
	max-width: 900px;
	margin: 0 auto;
}

.favorites-header[b-kjl2lermdq] {
	margin-bottom: 24px;
}

.favorites-header .header-title[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}

.favorites-header .header-title h3[b-kjl2lermdq] {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 600;
}

.favorites-header .header-icon[b-kjl2lermdq] {
	color: var(--accent-fill-rest);
}

.favorites-header .header-subtitle[b-kjl2lermdq] {
	color: var(--neutral-foreground-hint);
	margin: 0;
	font-size: 0.9rem;
}

/* Add Favorite Form */
.add-favorite-section[b-kjl2lermdq] {
	background: var(--neutral-layer-2);
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 24px;
	border: 1px solid var(--neutral-stroke-rest);
}

.add-favorite-section h4[b-kjl2lermdq] {
	margin: 0 0 16px 0;
	font-size: 1rem;
	font-weight: 600;
}

.favorite-form-grid[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.form-actions[b-kjl2lermdq] {
	display: flex;
	justify-content: flex-end;
	margin-top: 8px;
}

/* Favorites List */
.favorites-list-section h4[b-kjl2lermdq] {
	margin: 0 0 16px 0;
	font-size: 1rem;
	font-weight: 600;
}

.empty-favorites[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 40px 20px;
	color: var(--neutral-foreground-hint);
	text-align: center;
}

.empty-favorites .empty-icon[b-kjl2lermdq] {
	margin-bottom: 12px;
	opacity: 0.4;
}

.favorites-grid[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.favorite-card[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 16px;
	background: var(--neutral-layer-2);
	border: 1px solid var(--neutral-stroke-rest);
	border-radius: 8px;
	transition: all 0.2s ease;
}

.favorite-card:hover[b-kjl2lermdq] {
	border-color: var(--accent-fill-rest);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.favorite-card.editing[b-kjl2lermdq] {
	border-color: var(--accent-fill-rest);
	padding: 16px;
}

.favorite-content[b-kjl2lermdq] {
	flex: 1;
	min-width: 0;
}

.favorite-header[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
}

.favorite-header h5[b-kjl2lermdq] {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
}

.favorite-star[b-kjl2lermdq] {
	color: #f59e0b;
	flex-shrink: 0;
}

.favorite-description[b-kjl2lermdq] {
	margin: 0 0 4px 28px;
	font-size: 0.85rem;
	color: var(--neutral-foreground-hint);
}

.favorite-tags[b-kjl2lermdq] {
	display: flex;
	gap: 4px;
	margin-left: 28px;
	flex-wrap: wrap;
}

.favorite-actions[b-kjl2lermdq] {
	display: flex;
	gap: 4px;
	flex-shrink: 0;
}

/* Edit Form in Card */
.favorite-edit-form[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
}

.edit-actions[b-kjl2lermdq] {
	display: flex;
	gap: 8px;
	justify-content: flex-end;
}

/* Responsive */
@media (max-width: 768px) {
	.favorite-card[b-kjl2lermdq] {
		flex-direction: column;
		align-items: stretch;
	}

	.favorite-actions[b-kjl2lermdq] {
		justify-content: flex-end;
		margin-top: 8px;
	}

	.favorite-description[b-kjl2lermdq],
	.favorite-tags[b-kjl2lermdq],
	.favorite-recipe[b-kjl2lermdq] {
		margin-left: 0;
	}
}

/* Recipe Field (Add/Edit Forms) */
.recipe-field[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.recipe-selected[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--neutral-layer-3);
	border: 1px solid var(--accent-fill-rest);
	border-radius: 8px;
}

.recipe-selected-icon[b-kjl2lermdq] {
	color: var(--accent-fill-rest);
	flex-shrink: 0;
}

.recipe-selected-name[b-kjl2lermdq] {
	flex: 1;
	font-weight: 500;
	font-size: 0.9rem;
}

.recipe-search-area[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.recipe-results[b-kjl2lermdq] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	max-height: 200px;
	overflow-y: auto;
	border: 1px solid var(--neutral-stroke-rest);
	border-radius: 8px;
	padding: 4px;
}

.recipe-option[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: transparent;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	text-align: left;
	width: 100%;
	transition: background 0.15s ease;
}

.recipe-option:hover[b-kjl2lermdq] {
	background: var(--neutral-layer-3);
}

.recipe-option-icon[b-kjl2lermdq] {
	color: var(--neutral-foreground-hint);
	flex-shrink: 0;
}

.recipe-option-name[b-kjl2lermdq] {
	font-size: 0.9rem;
	font-weight: 500;
}

.recipe-no-results[b-kjl2lermdq] {
	padding: 12px;
	text-align: center;
	color: var(--neutral-foreground-hint);
	font-size: 0.85rem;
}

/* Recipe Display in Card */
.favorite-recipe[b-kjl2lermdq] {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-left: 28px;
	margin-bottom: 4px;
}

.favorite-recipe-icon[b-kjl2lermdq] {
	color: var(--accent-fill-rest);
	flex-shrink: 0;
}

.favorite-recipe-name[b-kjl2lermdq] {
	font-size: 0.85rem;
	color: var(--neutral-foreground-hint);
	font-weight: 500;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* =================================
   MAIN LAYOUT RESPONSIVE STYLES
   ================================= */

/* Main app layout container */
.app-layout[b-m8t35i2l9w] {
    display: flex;
    height: 100vh;
    width: 100%;
}

/* Desktop sidebar */
.desktop-sidebar[b-m8t35i2l9w] {
    display: block;
    width: 86px;
    height: 100vh;
    flex-shrink: 0;
    background-color: var(--neutral-layer-4);
}

/* Main content area */
.main-content-area[b-m8t35i2l9w] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100vh;
    max-width: 100%;
}

/* Mobile bottom nav - hidden on desktop */
.mobile-bottom-nav[b-m8t35i2l9w] {
    display: none;
}

/* Mobile breakpoint */
@media (max-width: 768px) {
    .app-layout[b-m8t35i2l9w] {
        display: flex;
        flex-direction: column;
        max-width: 100vw;
        overflow-x: hidden;
        height: 100vh;
        background: var(--color-primary-light);
    }
    
    .desktop-sidebar[b-m8t35i2l9w] {
        display: none;
    }
    
    .main-content-area[b-m8t35i2l9w] {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
    }
    
    .mobile-bottom-nav[b-m8t35i2l9w] {
        display: block;
        flex-shrink: 0;
        background: var(--color-neutral);
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.app-bar-container[b-18ug0s6k72] {
	background-color: var(--neutral-layer-4);
	padding: 10px;
	height:100%;
}

[b-18ug0s6k72] .app-bar {
	background-color: var(--color-light-blue);
}

/* =================================
   MOBILE BOTTOM NAVIGATION BAR
   ================================= */

.mobile-nav-bar[b-18ug0s6k72] {
    background: var(--color-neutral);
    border-top: 1px solid var(--color-neutral-light);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    padding: 0;
    padding-bottom: env(safe-area-inset-bottom, 0);
}

.mobile-nav-items[b-18ug0s6k72] {
    display: flex;
    justify-content: space-around;
    align-items: stretch;
}

.mobile-nav-item[b-18ug0s6k72] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    min-width: 64px;
    flex: 1;
    text-decoration: none;
    color: var(--color-neutral-medium);
    font-size: 0.7rem;
    font-weight: 500;
    gap: 4px;
    transition: all 0.2s ease;
    border-top: 2px solid transparent;
    cursor: pointer;
    background: transparent;
    border-left: none;
    border-right: none;
    border-bottom: none;
}

.mobile-nav-item:hover[b-18ug0s6k72] {
    background-color: var(--color-secondary-light);
    color: var(--color-primary);
}

.mobile-nav-item.active[b-18ug0s6k72] {
    color: var(--color-primary);
    border-top-color: var(--color-primary);
    background-color: var(--color-primary-light);
}

.mobile-nav-item[b-18ug0s6k72]  svg {
    width: 24px;
    height: 24px;
}

.mobile-nav-item span[b-18ug0s6k72] {
    white-space: nowrap;
}

/* =================================
   MORE MENU DROPDOWN
   ================================= */

.mobile-more-menu[b-18ug0s6k72] {
    position: relative;
}

.mobile-more-dropdown[b-18ug0s6k72] {
    position: fixed;
    bottom: 70px;
    right: 8px;
    left: 8px;
    z-index: 1001;
}

.more-menu-overlay[b-18ug0s6k72] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: -1;
}

.more-menu-content[b-18ug0s6k72] {
    background: var(--color-neutral);
    border-radius: 12px;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    min-width: 180px;
    max-width: 300px;
    margin-left: auto;
    overflow: hidden;
    border: 1px solid var(--color-neutral-light);
}

.more-menu-item[b-18ug0s6k72] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: var(--color-neutral-dark);
    font-size: 0.9rem;
    font-weight: 500;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid var(--color-neutral-light);
}

.more-menu-item:last-child[b-18ug0s6k72] {
    border-bottom: none;
}

.more-menu-item:hover[b-18ug0s6k72] {
    background-color: var(--color-secondary-light);
}

.more-menu-item.active[b-18ug0s6k72] {
    background-color: var(--color-primary-light);
    color: var(--color-primary);
}

.more-menu-item[b-18ug0s6k72]  svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* =================================
   LOGOUT FORM IN MORE MENU
   ================================= */

.more-menu-logout-form[b-18ug0s6k72] {
    margin: 0;
    padding: 0;
}

.more-menu-item.logout-button[b-18ug0s6k72] {
    width: 100%;
    text-align: left;
    border: none;
    cursor: pointer;
    font-family: inherit;
    background: transparent;
}

.more-menu-item.logout-button:hover[b-18ug0s6k72] {
    background-color: var(--color-secondary-light);
}
/* /Components/Meal/Meal.razor.rz.scp.css */
/* Container and Layout */
.meal-planner-container[b-uyt5wmcl97] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px;
    background-color: var(--color-primary-light);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.meal-planner-header[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid var(--color-primary);
    flex-wrap: wrap;
    gap: 16px;
    background-color: var(--color-neutral);
    border-radius: 8px;
    padding: 16px;
}

.header-title[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-title h2[b-uyt5wmcl97] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
}

.header-icon[b-uyt5wmcl97] {
    color: var(--color-primary);
}

.header-controls[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.week-display[b-uyt5wmcl97] {
    padding: 8px 16px;
    background-color: var(--color-secondary-light);
    border-radius: 6px;
    font-weight: 500;
    min-width: 160px;
    text-align: center;
    border: 1px solid var(--color-secondary);
}

.week-range[b-uyt5wmcl97] {
    color: var(--color-neutral-dark);
    font-size: 0.875rem;
    font-weight: 600;
}

.header-actions[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    gap: 16px;
}

/* Grid Layout */
.week-grid-container[b-uyt5wmcl97] {
    display: flex;
    justify-content: center;
}

.week-grid[b-uyt5wmcl97] {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
     grid-auto-rows: minmax(min-content, auto);
     gap: 20px;
     width: 100%;
}

/* Day Cards - Lighter backgrounds */
.day-card[b-uyt5wmcl97] {
     background-color: var(--color-neutral);
     border-radius: 12px;
     padding: 18px;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden; /* Changed from visible to hidden for text truncation */
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
     min-width: 0; /* Allow card to shrink in grid */
}

.day-card:hover[b-uyt5wmcl97] {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    border-color: var(--color-primary);
}

.day-card.past-day[b-uyt5wmcl97] {
    background-color: var(--color-neutral);
    border-color: var(--color-secondary);
    opacity: 0.95;
}

.day-card.current-day[b-uyt5wmcl97] {
    background-color: var(--color-secondary-light);
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px var(--color-primary);
}

.day-card.future-day[b-uyt5wmcl97] {
    background-color: var(--color-neutral);
    border-color: var(--color-primary);
}

.day-card.current-day[b-uyt5wmcl97]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 1%;
    right: 0;
    height: 2%;
    width: 98%;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
    border-radius: 12px 12px 0 0;
}

.day-header[b-uyt5wmcl97] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--color-secondary);
}

.day-info[b-uyt5wmcl97] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.day-name[b-uyt5wmcl97] {
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--color-neutral-dark);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.day-date[b-uyt5wmcl97] {
    font-size: 0.8rem;
    color: var(--color-secondary);
    font-weight: 500;
}

.day-actions[b-uyt5wmcl97] {
    display: flex;
    gap: 6px;
    align-items: center;
}

/* Meal Cards */
.day-meals[b-uyt5wmcl97] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0; /* Allow flex children to shrink */
}

.meal-card[b-uyt5wmcl97] {
    background-color: var(--color-neutral);
    border: 1px solid var(--color-secondary);
    border-radius: 8px;
    padding: 14px;
    position: relative;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    cursor: pointer;
    overflow: hidden; /* Required for text truncation in children */
    min-width: 0; /* Allow card to shrink */
}

.meal-card:hover[b-uyt5wmcl97] {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
}

.meal-card.editing[b-uyt5wmcl97] {
    border-color: var(--color-primary);
    background-color: var(--color-primary-light);
    box-shadow: 0 0 0 2px var(--color-primary);
}

.meal-card.swapping[b-uyt5wmcl97] {
    border-color: var(--color-accent);
    background-color: var(--color-accent-light);
    box-shadow: 0 0 0 2px var(--color-accent);
    animation: pulse-b-uyt5wmcl97 2s infinite;
}

@keyframes pulse-b-uyt5wmcl97 {
    0% { opacity: 1; }
    50% { opacity: 0.8; }
    100% { opacity: 1; }
}

.meal-content[b-uyt5wmcl97] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0; /* Allow content to shrink for text truncation */
    overflow: hidden; /* Required for text truncation */
}

.meal-title[b-uyt5wmcl97] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.meal-description[b-uyt5wmcl97] {
    margin: 0;
    font-size: 0.8rem;
    color: var(--color-secondary);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.meal-recipe[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 6px 10px;
    background-color: var(--color-secondary-light);
    border-radius: 6px;
    border: 1px solid var(--color-secondary);
    min-width: 0; /* Allow flex item to shrink below content size */
    overflow: hidden;
}

.recipe-icon[b-uyt5wmcl97] {
    color: var(--color-accent);
    flex-shrink: 0;
}

.recipe-name[b-uyt5wmcl97] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--color-neutral-dark);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0; /* Allow text to truncate */
    flex: 1;
}

.recipe-link-btn[b-uyt5wmcl97] {
    flex-shrink: 0;
    margin-left: auto;
}

.ingredients-btn[b-uyt5wmcl97] {
    align-self: flex-start;
    margin-top: 6px;
}

.recipe-actions[b-uyt5wmcl97] {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-top: 6px;
}

.no-recipe[b-uyt5wmcl97] {
    margin: 0;
    font-size: 0.8rem;
    color: var(--color-secondary);
    font-style: italic;
    padding: 6px 10px;
    background-color: var(--color-tertiary-light);
    border-radius: 4px;
}

.meal-header[b-uyt5wmcl97] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
}

.meal-title-section[b-uyt5wmcl97] {
    flex: 1;
}

/* Hide meal actions since we're consolidating to day actions */
.meal-actions[b-uyt5wmcl97] {
    display: none;
}

/* Empty State */
.empty-meal[b-uyt5wmcl97] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px;
    text-align: center;
    color: var(--color-secondary);
    transition: all 0.3s ease;
    border: 2px dashed var(--color-secondary);
    border-radius: 8px;
    background-color: var(--color-tertiary-light);
}

.empty-meal.swappable[b-uyt5wmcl97] {
    border-color: var(--color-accent);
    background-color: var(--color-accent-light);
    cursor: pointer;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.empty-meal.swappable:hover[b-uyt5wmcl97] {
    border-color: var(--color-accent);
    background-color: var(--color-warm-light);
    transform: translateY(-3px);
}

.empty-icon[b-uyt5wmcl97] {
    margin-bottom: 10px;
    opacity: 0.6;
    color: var(--color-secondary);
}

.empty-text[b-uyt5wmcl97] {
    font-size: 0.9rem;
    margin-bottom: 10px;
    font-weight: 500;
}

.add-meal-btn[b-uyt5wmcl97] {
    margin-top: 6px;
}

.swap-meal-btn[b-uyt5wmcl97] {
    margin-top: 6px;
    background-color: var(--color-accent);
    color: var(--color-neutral);
    border: none;
}

/* Dancing Frog Styles - Now as a grid item */
.dancing-frog-card[b-uyt5wmcl97] {
    background: linear-gradient(135deg, var(--color-warm-light), var(--color-accent-light));
    border: 2px solid var(--color-accent);
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    animation: frogBounce-b-uyt5wmcl97 3s ease-in-out infinite;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

.dancing-frog-card:hover[b-uyt5wmcl97] {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    border-color: var(--color-warm);
}

.dancing-frog-card[b-uyt5wmcl97]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color-accent), var(--color-warm));
}

.frog-content[b-uyt5wmcl97] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
}

.dancing-frog-gif[b-uyt5wmcl97] {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 3px solid var(--color-accent);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
}

.dancing-frog-gif:hover[b-uyt5wmcl97] {
    transform: scale(1.15) rotate(10deg);
    border-color: var(--color-warm);
}

.frog-message[b-uyt5wmcl97] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
    text-align: center;
    letter-spacing: 0.5px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

@keyframes frogBounce-b-uyt5wmcl97 {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-6px);
    }
}

/* Remove old dancing-frog-container styles since we're not using them */

/* Form Styling */
.form-actions[b-uyt5wmcl97] {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    flex-wrap: wrap;
}

/* Responsive Design */
@media (max-width: 768px) {
    .meal-planner-container[b-uyt5wmcl97] {
        padding: 14px;
    }
    
    .meal-planner-header[b-uyt5wmcl97] {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }
    
    .header-controls[b-uyt5wmcl97] {
        justify-content: center;
    }
    
    .week-grid[b-uyt5wmcl97] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .day-card[b-uyt5wmcl97] {
        min-height: auto;
        height: auto;
    }
    
    .meal-header[b-uyt5wmcl97] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    
    .meal-title-section[b-uyt5wmcl97] {
        text-align: center;
    }

    .meal-card[b-uyt5wmcl97] {
        height: auto;
        min-height: auto;
    }

    .meal-card.editing[b-uyt5wmcl97] {
        height: auto;
        min-height: auto;
        overflow: visible;
        padding: 16px;
    }

    .dancing-frog-card[b-uyt5wmcl97] {
        min-height: auto;
        padding: 16px;
    }

    .dancing-frog-gif[b-uyt5wmcl97] {
        width: 70px;
        height: 70px;
    }

    .frog-message[b-uyt5wmcl97] {
        font-size: 0.9rem;
    }
}

@media (max-width: 480px) {
    .meal-planner-header[b-uyt5wmcl97] {
        padding: 12px;
        gap: 10px;
    }

    .header-title[b-uyt5wmcl97] {
        width: 100%;
        justify-content: center;
    }

    .header-title h2[b-uyt5wmcl97] {
        font-size: 1.25rem;
    }

    .header-controls[b-uyt5wmcl97] {
        flex-direction: column;
        gap: 8px;
        width: 100%;
        order: 2;
    }

    .header-controls fluent-button[b-uyt5wmcl97],
    .header-controls button[b-uyt5wmcl97] {
        width: auto;
        min-width: 100px;
    }

    .week-display[b-uyt5wmcl97] {
        min-width: auto;
        width: 100%;
        order: 1;
        padding: 10px 16px;
    }

    /* Stack nav buttons horizontally but below the date */
    .header-controls[b-uyt5wmcl97] {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
    }

    .header-actions[b-uyt5wmcl97] {
        flex-direction: column;
        gap: 8px;
        width: 100%;
        align-items: center;
    }
    
    .form-actions[b-uyt5wmcl97] {
        flex-direction: column;
        gap: 8px;
    }

    .form-actions fluent-button[b-uyt5wmcl97],
    .form-actions button[b-uyt5wmcl97] {
        width: 100%;
    }
    
    .day-header[b-uyt5wmcl97] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .day-actions[b-uyt5wmcl97] {
        align-self: flex-end;
    }

    .meal-card.editing[b-uyt5wmcl97] {
        padding: 14px;
    }

    .dancing-frog-gif[b-uyt5wmcl97] {
        width: 50px;
        height: 50px;
    }

    .frog-message[b-uyt5wmcl97] {
        font-size: 0.8rem;
    }
}

/* Animation for smooth transitions */
@keyframes slideIn-b-uyt5wmcl97 {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.meal-card[b-uyt5wmcl97] {
    animation: slideIn-b-uyt5wmcl97 0.3s ease;
}

/* Focus styles for accessibility */
.day-card:focus-within[b-uyt5wmcl97] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.meal-card:focus-within[b-uyt5wmcl97] {
    outline: 2px solid var(--color-primary);
    outline-offset: 1px;
}

/* Dark theme adjustments */
@media (prefers-color-scheme: dark) {
    .day-card:hover[b-uyt5wmcl97] {
        box-shadow: 0 6px 20px rgba(255, 255, 255, 0.1);
    }
    
    .meal-card:hover[b-uyt5wmcl97] {
        box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
    }
}

/* Meal Details Dialog Styles */
.meal-details-content[b-uyt5wmcl97] {
    padding: 16px 0;
}

.detail-section[b-uyt5wmcl97] {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-neutral-light);
}

.detail-section:last-child[b-uyt5wmcl97] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.detail-section h4[b-uyt5wmcl97] {
    margin: 0 0 8px 0;
    color: var(--color-primary);
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-section p[b-uyt5wmcl97] {
    margin: 0;
    color: var(--color-neutral-dark);
    line-height: 1.6;
}

.recipe-details[b-uyt5wmcl97] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px;
    background-color: var(--color-secondary-light);
    border-radius: 6px;
    border: 1px solid var(--color-secondary);
    min-width: 0;
    overflow: hidden;
}

.recipe-details .recipe-name[b-uyt5wmcl97] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
}

.recipe-dialog-actions[b-uyt5wmcl97] {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.tags-container[b-uyt5wmcl97] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag-badge[b-uyt5wmcl97] {
    padding: 4px 12px;
    background-color: var(--color-primary-light);
    color: var(--color-primary);
    border-radius: 16px;
    font-size: 0.8rem;
    font-weight: 500;
}
/* /Components/Meal/MealInspiration.razor.rz.scp.css */
.inspiration-container[b-9vpj3boz35] {
    padding: 24px;
}

.inspiration-header[b-9vpj3boz35] {
    margin-bottom: 32px;
    text-align: center;
}

.inspiration-header h3[b-9vpj3boz35] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-primary);
}

.inspiration-header p[b-9vpj3boz35] {
    margin: 0;
    color: var(--color-secondary);
    font-size: 1rem;
}

.inspiration-controls[b-9vpj3boz35] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
    gap: 16px;
    flex-wrap: wrap;
}

.search-section[b-9vpj3boz35] {
    display: flex;
    flex: 1;
    max-width: 400px;
}

.control-buttons[b-9vpj3boz35] {
    display: flex;
    gap: 12px;
}

/* Loading State */
.loading-state[b-9vpj3boz35] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px;
    text-align: center;
    color: var(--color-secondary);
}

.loading-state p[b-9vpj3boz35] {
    margin-top: 16px;
    font-size: 1.1rem;
}

/* Empty State */
.empty-state[b-9vpj3boz35] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px;
    text-align: center;
    color: var(--color-secondary);
}

.empty-state h4[b-9vpj3boz35] {
    margin: 16px 0 8px 0;
    color: var(--color-primary);
}

.empty-state p[b-9vpj3boz35] {
    margin-bottom: 24px;
}

/* Masonry Layout */
.masonry-container[b-9vpj3boz35] {
    column-count: 4;
    column-gap: 20px;
    column-fill: balance;
}

.masonry-item[b-9vpj3boz35] {
    display: inline-block;
    width: 100%;
    margin-bottom: 20px;
    break-inside: avoid;
}

/* Recipe Cards */
.recipe-card[b-9vpj3boz35] {
    background: var(--color-neutral);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    position: relative;
}

.recipe-card:hover[b-9vpj3boz35] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.recipe-image-container[b-9vpj3boz35] {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.recipe-image-container img[b-9vpj3boz35] {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.recipe-card:hover .recipe-image-container img[b-9vpj3boz35] {
    transform: scale(1.05);
}

.placeholder-image[b-9vpj3boz35] {
    width: 100%;
    height: 200px;
    background: var(--color-primary-light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-secondary);
}

.recipe-overlay[b-9vpj3boz35] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.recipe-card:hover .recipe-overlay[b-9vpj3boz35] {
    opacity: 1;
}

.add-button[b-9vpj3boz35] {
    transform: translateY(10px);
    transition: transform 0.3s ease;
}

.recipe-card:hover .add-button[b-9vpj3boz35] {
    transform: translateY(0);
}

.recipe-content[b-9vpj3boz35] {
    padding: 16px;
}

.recipe-title[b-9vpj3boz35] {
    margin: 0 0 12px 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1.3;
}

.ingredients-section[b-9vpj3boz35] {
    margin-bottom: 16px;
}

.ingredients-section h5[b-9vpj3boz35] {
    margin: 0 0 8px 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ingredients-tags[b-9vpj3boz35] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.ingredient-tag[b-9vpj3boz35] {
    background: var(--color-primary-light);
    color: var(--color-primary);
    font-size: 0.75rem;
    padding: 4px 8px;
    border-radius: 12px;
    font-weight: 500;
}

.ingredient-tag.more[b-9vpj3boz35] {
    background: var(--color-accent-light);
    color: var(--color-accent);
}

.recipe-actions[b-9vpj3boz35] {
    padding-top: 12px;
    border-top: 1px solid var(--color-primary-light);
}

/* Add Recipe Section */
.add-recipe-section[b-9vpj3boz35] {
    margin-top: 32px;
    background: var(--color-primary-light);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.add-recipe-section:not(.expanded)[b-9vpj3boz35] {
    border: 2px dashed var(--color-primary);
}

.toggle-button[b-9vpj3boz35] {
    width: 100%;
    padding: 16px;
    justify-content: center;
    background: transparent;
    border: none;
}

.custom-recipe-form[b-9vpj3boz35] {
    padding: 0 24px 24px 24px;
    border-top: 1px solid var(--color-primary);
}

.custom-recipe-form h4[b-9vpj3boz35] {
    margin: 16px 0 20px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-primary);
}

.form-grid[b-9vpj3boz35] {
    display: grid;
    gap: 16px;
}

.file-upload-section[b-9vpj3boz35] {
    display: grid;
    gap: 8px;
}

.file-upload-section label[b-9vpj3boz35] {
    font-weight: 600;
    color: var(--color-primary);
}

/* Responsive Design */
@media (max-width: 1200px) {
    .masonry-container[b-9vpj3boz35] {
        column-count: 3;
    }
}

@media (max-width: 768px) {
    .masonry-container[b-9vpj3boz35] {
        column-count: 2;
        column-gap: 16px;
    }
    
    .inspiration-controls[b-9vpj3boz35] {
        flex-direction: column;
        align-items: stretch;
    }
    
    .search-section[b-9vpj3boz35] {
        max-width: none;
    }
    
    .control-buttons[b-9vpj3boz35] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .masonry-container[b-9vpj3boz35] {
        column-count: 1;
    }
    
    .inspiration-container[b-9vpj3boz35] {
        padding: 16px;
    }
}
/* /Components/Nanny/NannyApp.razor.rz.scp.css */
.nanny-container[b-wl1q0tt5i6] {
	max-width: 1200px;
	margin: 0 auto;
	padding: 16px;
	background-color: var(--color-primary-light);
	border-radius: 12px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
/* /Components/Pages/Index.razor.rz.scp.css */
/* Root and Layout */
.dashboard-root[b-94lfyzr8hw] {
    padding: 0.75rem;
    background: var(--color-primary-light);
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    min-height: 100vh;
}

/* Loading State */
.loading-container[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 4rem;
}

/* Hero Section */
.dashboard-hero[b-94lfyzr8hw] {
    background: linear-gradient(135deg, var(--color-accent) 25%, var(--color-primary) 100%);
    border-radius: 16px;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    color: white;
    box-shadow: 0 6px 20px rgba(210, 105, 30, 0.2), 0 2px 6px rgba(0, 0, 0, 0.08);
}

.hero-content[b-94lfyzr8hw] {
    margin-bottom: 1rem;
}

.hero-greeting[b-94lfyzr8hw] {
    font-size: 1.75rem;
    font-weight: 700;
    color: white;
    margin: 0 0 0.25rem 0;
    line-height: 1.2;
}

.hero-date[b-94lfyzr8hw] {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 400;
    margin: 0;
}

.hero-stats[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.stat-badge[b-94lfyzr8hw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.stat-badge fluent-icon[b-94lfyzr8hw] {
    font-size: 1.5rem;
    color: white;
    flex-shrink: 0;
    opacity: 0.9;
}

.stat-content[b-94lfyzr8hw] {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
}

.stat-value[b-94lfyzr8hw] {
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
    line-height: 1;
}

.stat-label[b-94lfyzr8hw] {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 400;
}

/* Empty Dashboard State */
.empty-dashboard-card[b-94lfyzr8hw] {
    padding: 3rem;
    text-align: center;
    margin: 1rem 0;
}

.empty-dashboard-content[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.empty-icon[b-94lfyzr8hw] {
    font-size: 4rem;
    color: var(--neutral-fill-stealth-rest);
}

.empty-message[b-94lfyzr8hw] {
    color: var(--neutral-foreground-hint);
    max-width: 400px;
}

/* Dashboard Grid */
.dashboard-grid[b-94lfyzr8hw] {
    flex: 1 1 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
    align-items: stretch;
    min-height: 0;
    padding-bottom: 1rem;
}

@media (max-width: 1200px) {
    .dashboard-grid[b-94lfyzr8hw] {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .dashboard-root[b-94lfyzr8hw] {
        min-height: 100%;
        padding: 0.5rem;
    }
    
    .dashboard-grid[b-94lfyzr8hw] {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding-bottom: 1rem;
    }
    
    .home-card[b-94lfyzr8hw] {
        padding: 0.7rem 0.5rem;
    }
    
    /* Hero responsive adjustments */
    .dashboard-hero[b-94lfyzr8hw] {
        padding: 1.25rem;
        border-radius: 12px;
    }
    
    .hero-greeting[b-94lfyzr8hw] {
        font-size: 1.5rem;
    }
    
    .hero-date[b-94lfyzr8hw] {
        font-size: 0.95rem;
    }
    
    .stat-badge[b-94lfyzr8hw] {
        padding: 0.4rem 0;
    }
    
    .stat-value[b-94lfyzr8hw] {
        font-size: 1.35rem;
    }
    
    .stat-label[b-94lfyzr8hw] {
        font-size: 0.85rem;
    }

    .widget-header[b-94lfyzr8hw] {
        flex-direction: row;
        align-items: center;
        gap: 0.5rem;
    }
}

/* Widget Styles */
.dashboard-widget[b-94lfyzr8hw] {
    padding: 1.25rem 1.5rem;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-left: 5px solid transparent;
    min-height: 200px;
}

.dashboard-widget:hover[b-94lfyzr8hw] {
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
    transform: translateY(-4px);
}

.widget-header[b-94lfyzr8hw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.widget-header-actions[b-94lfyzr8hw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.widget-title-row[b-94lfyzr8hw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.widget-icon[b-94lfyzr8hw] {
    font-size: 1.5rem;
    flex-shrink: 0;
}

.widget-title[b-94lfyzr8hw] {
    font-weight: 700;
    margin: 0;
    color: var(--color-neutral-dark);
    font-size: 1.1rem;
}

.widget-content[b-94lfyzr8hw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.widget-loading[b-94lfyzr8hw] {
    display: flex;
    justify-content: center;
    padding: 2rem;
}

.widget-empty[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    color: var(--color-secondary);
    text-align: center;
    background: white;
    border-radius: 10px;
    border: 1.5px dashed var(--color-secondary);
}

.widget-empty fluent-icon[b-94lfyzr8hw] {
    font-size: 2rem;
    opacity: 0.5;
}

/* Weather Widget */
.weather-widget[b-94lfyzr8hw] {
    border-left-color: #e6a117;
}

/* Meal Widget */
.meal-widget[b-94lfyzr8hw] {
    border-left-color: #d2691e;
}

.meal-item[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem;
    background: white;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.2s ease;
}

.meal-item:hover[b-94lfyzr8hw] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.meal-badge[b-94lfyzr8hw] {
    align-self: flex-start;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.lunch-badge[b-94lfyzr8hw] {
    background: #FFE5B4;
    color: #D97706;
}

.dinner-badge[b-94lfyzr8hw] {
    background: #FECACA;
    color: #DC2626;
}

.breakfast-badge[b-94lfyzr8hw] {
    background: #DBEAFE;
    color: #2563EB;
}

.meal-details[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.meal-name[b-94lfyzr8hw] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.meal-description[b-94lfyzr8hw] {
    font-size: 0.9rem;
    color: var(--neutral-foreground-hint);
    line-height: 1.4;
}

/* Workout Widget */
.workout-widget[b-94lfyzr8hw] {
    border-left-color: #3a9e96;
}

.workout-summary[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.workout-type[b-94lfyzr8hw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.workout-type-badge[b-94lfyzr8hw] {
    background: #CFFAFE;
 color: #0891B2;
    font-weight: 600;
}

.workout-duration[b-94lfyzr8hw] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
}

.workout-notes[b-94lfyzr8hw] {
    font-size: 0.95rem;
    color: var(--neutral-foreground-rest);
    padding: 0.75rem;
    background: white;
    border-radius: 8px;
    margin: 0;
    line-height: 1.5;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.workout-exercises[b-94lfyzr8hw] {
    display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.exercises-label[b-94lfyzr8hw] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.exercise-list[b-94lfyzr8hw] {
    display: flex;
flex-direction: column;
    gap: 0.5rem;
}

.exercise-item[b-94lfyzr8hw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    background: white;
    border-radius: 6px;
    gap: 0.5rem;
    border-left: 3px solid transparent;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Exercise Purpose Color Coding */
.exercise-item.purpose-warmup[b-94lfyzr8hw] {
    border-left-color: var(--purpose-warmup);
}

.exercise-item.purpose-technique[b-94lfyzr8hw] {
    border-left-color: var(--purpose-technique);
}

.exercise-item.purpose-corelift[b-94lfyzr8hw] {
    border-left-color: var(--purpose-corelift);
}

.exercise-item.purpose-strength[b-94lfyzr8hw] {
    border-left-color: var(--purpose-strength);
}

.exercise-item.purpose-accessory[b-94lfyzr8hw] {
    border-left-color: var(--purpose-accessory);
}

.exercise-purpose[b-94lfyzr8hw] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 4px;
    text-transform: uppercase;
    min-width: 16px;
    text-align: center;
}

.exercise-purpose.purpose-warmup[b-94lfyzr8hw] {
    background: var(--purpose-warmup-bg);
    color: var(--purpose-warmup-text);
}

.exercise-purpose.purpose-technique[b-94lfyzr8hw] {
    background: var(--purpose-technique-bg);
    color: var(--purpose-technique-text);
}

.exercise-purpose.purpose-corelift[b-94lfyzr8hw] {
    background: var(--purpose-corelift-bg);
    color: var(--purpose-corelift-text);
}

.exercise-purpose.purpose-strength[b-94lfyzr8hw] {
    background: var(--purpose-strength-bg);
    color: var(--purpose-strength-text);
}

.exercise-purpose.purpose-accessory[b-94lfyzr8hw] {
    background: var(--purpose-accessory-bg);
    color: var(--purpose-accessory-text);
}

.exercise-name[b-94lfyzr8hw] {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--neutral-foreground-rest);
    flex: 1;
}

.exercise-sets[b-94lfyzr8hw] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
    white-space: nowrap;
}

.more-exercises[b-94lfyzr8hw] {
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
    font-style: italic;
 text-align: center;
    padding: 0.5rem;
}

/* Nanny Widget */
.nanny-widget[b-94lfyzr8hw] {
    border-left-color: #7b6fa0;
}

.nanny-icon[b-94lfyzr8hw] {
    color: #7b6fa0;
}

.timeoff-summary[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
  gap: 1rem;
}

.timeoff-stat[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    border-radius: 12px;
    color: white;
}

.stat-number[b-94lfyzr8hw] {
    font-size: 3rem;
    font-weight: 700;
    line-height: 1;
}

.stat-text[b-94lfyzr8hw] {
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}

.timeoff-breakdown[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.timeoff-item[b-94lfyzr8hw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    background: white;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.timeoff-label[b-94lfyzr8hw] {
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--neutral-foreground-rest);
}

.timeoff-value[b-94lfyzr8hw] {
  font-size: 0.95rem;
 font-weight: 600;
    color: var(--neutral-foreground-hint);
}

/* Icon Colors */
.meal-icon[b-94lfyzr8hw] {
    color: var(--icon-meal);
}

.workout-icon[b-94lfyzr8hw] {
    color: var(--icon-workout);
}

.weather-icon[b-94lfyzr8hw] {
    color: var(--icon-weather);
}

.calendar-icon[b-94lfyzr8hw] {
    color: var(--icon-calendar);
}

/* Coffee Widget */
.coffee-widget[b-94lfyzr8hw] {
    border-left-color: #6f4e37;
}

.coffee-icon[b-94lfyzr8hw] {
    color: #6f4e37;
}

.coffee-station-summary[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, #6f4e37 0%, #4a3425 100%);
    border-radius: 12px;
    color: white;
}

.coffee-stat[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.coffee-order-summary[b-94lfyzr8hw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.coffee-order-item[b-94lfyzr8hw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: white;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--neutral-foreground-rest);
}
/* /Components/Pages/Settings.razor.rz.scp.css */
/* Settings Page Layout */
.settings-page[b-rilbt59vrw] {
    max-width: 900px;
    margin: 0 auto;
    padding: 24px;
}

.settings-header[b-rilbt59vrw] {
    text-align: center;
    margin-bottom: 32px;
    padding: 24px;
    background: var(--neutral-fill-secondary-rest);
    border-radius: 12px;
    border: 1px solid var(--neutral-stroke-divider);
}

.header-icon[b-rilbt59vrw] {
    margin-bottom: 12px;
    color: var(--accent-fill-rest);
}

.header-subtitle[b-rilbt59vrw] {
    color: var(--neutral-foreground-hint);
    margin-top: 8px;
}

.settings-container[b-rilbt59vrw] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Settings Section Cards */
.settings-section[b-rilbt59vrw] {
    padding: 24px;
    border-radius: 12px;
    border: 1px solid var(--neutral-stroke-divider);
    background: var(--neutral-fill-rest);
    transition: all 0.3s ease;
}

.settings-section:hover[b-rilbt59vrw] {
    border-color: var(--accent-fill-rest);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.settings-section.coming-soon[b-rilbt59vrw] {
    opacity: 0.6;
    background: var(--neutral-fill-secondary-rest);
}

/* Section Headers */
.section-header[b-rilbt59vrw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--neutral-stroke-divider);
}

.section-title[b-rilbt59vrw] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.section-icon[b-rilbt59vrw] {
    color: var(--accent-fill-rest);
}

.help-icon[b-rilbt59vrw] {
    color: var(--neutral-foreground-hint);
    cursor: help;
    transition: color 0.2s ease;
}

.help-icon:hover[b-rilbt59vrw] {
    color: var(--accent-fill-rest);
}

/* Setting Rows */
.setting-row[b-rilbt59vrw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0;
    border-bottom: 1px solid var(--neutral-stroke-divider);
}

.setting-row:last-child[b-rilbt59vrw] {
    border-bottom: none;
    padding-bottom: 0;
}

.setting-info[b-rilbt59vrw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.setting-label[b-rilbt59vrw] {
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.setting-description[b-rilbt59vrw] {
    font-size: 0.9em;
    color: var(--neutral-foreground-hint);
    line-height: 1.4;
}

.setting-control[b-rilbt59vrw] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.setting-value[b-rilbt59vrw] {
    font-size: 0.9em;
    color: var(--neutral-foreground-hint);
    font-weight: 500;
    min-width: 60px;
    text-align: right;
}

/* Color Palette Preview */
.color-palette-preview[b-rilbt59vrw] {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--neutral-stroke-divider);
}

.palette-label[b-rilbt59vrw] {
    margin-bottom: 16px;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.palette-grid[b-rilbt59vrw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.palette-theme[b-rilbt59vrw] {
    padding: 16px;
    border-radius: 8px;
    border: 2px solid var(--neutral-stroke-divider);
    transition: all 0.3s ease;
    cursor: pointer;
}

.palette-theme.active[b-rilbt59vrw] {
    border-color: var(--accent-fill-rest);
    background: var(--neutral-fill-secondary-rest);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.palette-name[b-rilbt59vrw] {
    font-size: 0.9em;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
    margin-bottom: 8px;
    text-align: center;
}

.palette-colors[b-rilbt59vrw] {
    display: flex;
    justify-content: center;
    gap: 6px;
    flex-wrap: wrap;
}

.color-dot[b-rilbt59vrw] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    cursor: help;
    transition: transform 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.color-dot:hover[b-rilbt59vrw] {
    transform: scale(1.2);
}

/* Coming Soon Placeholder */
.coming-soon-content[b-rilbt59vrw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 32px;
    color: var(--neutral-foreground-hint);
}

/* Authentication Required Card */
.auth-required[b-rilbt59vrw] {
    padding: 48px 32px;
    text-align: center;
    border: 2px dashed var(--neutral-stroke-divider);
    background: var(--neutral-fill-secondary-rest);
}

.auth-icon[b-rilbt59vrw] {
    color: var(--neutral-foreground-hint);
    margin-bottom: 16px;
}

.auth-message[b-rilbt59vrw] {
    color: var(--neutral-foreground-hint);
    margin-bottom: 24px;
    line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 768px) {
    .settings-page[b-rilbt59vrw] {
        padding: 16px;
    }
    
    .settings-header[b-rilbt59vrw] {
        padding: 20px;
        margin-bottom: 24px;
    }
    
    .settings-section[b-rilbt59vrw] {
        padding: 20px;
    }
    
    .setting-row[b-rilbt59vrw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .setting-control[b-rilbt59vrw] {
        align-self: stretch;
        justify-content: space-between;
    }
    
    .palette-grid[b-rilbt59vrw] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .color-dot[b-rilbt59vrw] {
        width: 20px;
        height: 20px;
    }
}

@media (max-width: 480px) {
    .settings-page[b-rilbt59vrw] {
        padding: 12px;
    }
    
    .palette-colors[b-rilbt59vrw] {
        gap: 4px;
    }
    
    .color-dot[b-rilbt59vrw] {
        width: 18px;
        height: 18px;
    }
}
/* /Components/Widgets/QuickAddFavoritesDialog.razor.rz.scp.css */
/* QuickAddFavoritesDialog Styles */

[b-z4t60qj58i] .quick-add-favorites-dialog {
	--dialog-width: 95vw;
	--dialog-max-width: 500px;
}

.dialog-header-content[b-z4t60qj58i] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.dialog-header-icon[b-z4t60qj58i] {
	color: #f59e0b;
}

.quick-add-content[b-z4t60qj58i] {
	padding: 8px;
}

/* Empty State */
.empty-state[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 32px 16px;
	text-align: center;
	color: var(--neutral-foreground-hint);
}

.empty-state .empty-icon[b-z4t60qj58i] {
	margin-bottom: 12px;
	opacity: 0.4;
}

.empty-state p[b-z4t60qj58i] {
	margin: 4px 0;
}

.empty-hint[b-z4t60qj58i] {
	font-size: 0.85rem;
}

/* Date Selection */
.date-selection[b-z4t60qj58i] {
	margin-bottom: 16px;
}

.date-options[b-z4t60qj58i] {
	display: flex;
	gap: 8px;
	margin-top: 8px;
	flex-wrap: wrap;
}

.calendar-picker[b-z4t60qj58i] {
	margin-top: 12px;
}

.selected-date-label[b-z4t60qj58i] {
	margin-top: 8px;
	color: var(--neutral-foreground-hint);
}

.favorites-divider[b-z4t60qj58i] {
	height: 1px;
	background: var(--neutral-stroke-rest);
	margin: 16px 0;
}

/* Meal Type Selection */
.meal-type-selection[b-z4t60qj58i] {
	margin-bottom: 4px;
}

.meal-type-options[b-z4t60qj58i] {
	display: flex;
	gap: 8px;
	margin-top: 8px;
	flex-wrap: wrap;
}

.meal-type-badge[b-z4t60qj58i] {
	margin-top: 8px;
}

/* Description Section */
.description-section[b-z4t60qj58i] {
	margin-bottom: 8px;
}

/* Favorites Selection */
.favorites-selection[b-z4t60qj58i] {
	margin-bottom: 8px;
}

.favorites-list[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 8px;
	max-height: 300px;
	overflow-y: auto;
}

.favorite-option[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 12px 16px;
	background: var(--neutral-layer-2);
	border: 2px solid var(--neutral-stroke-rest);
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.15s ease;
	text-align: left;
	width: 100%;
}

.favorite-option:hover[b-z4t60qj58i] {
	border-color: var(--accent-fill-rest);
	background: var(--neutral-layer-3);
}

.favorite-option.selected[b-z4t60qj58i] {
	border-color: var(--accent-fill-rest);
	background: var(--accent-fill-rest);
	color: white;
}

.favorite-option.selected .favorite-icon[b-z4t60qj58i] {
	color: white;
}

.favorite-option.selected .favorite-desc[b-z4t60qj58i] {
	color: rgba(255, 255, 255, 0.8);
}

.favorite-option-content[b-z4t60qj58i] {
	display: flex;
	align-items: center;
	gap: 8px;
}

.favorite-icon[b-z4t60qj58i] {
	color: #f59e0b;
	flex-shrink: 0;
}

.favorite-info[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.favorite-name[b-z4t60qj58i] {
	font-weight: 600;
	font-size: 0.95rem;
}

.favorite-desc[b-z4t60qj58i] {
	font-size: 0.8rem;
	color: var(--neutral-foreground-hint);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.favorite-option-tags[b-z4t60qj58i] {
	display: flex;
	gap: 4px;
	margin-left: 24px;
	flex-wrap: wrap;
}

.mini-tag[b-z4t60qj58i] {
	font-size: 0.7rem;
}

/* Recipe Selection */
.recipe-selection[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.selected-recipe[b-z4t60qj58i] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--neutral-layer-2);
	border: 1px solid var(--accent-fill-rest);
	border-radius: 8px;
}

.recipe-link-icon[b-z4t60qj58i] {
	color: var(--accent-fill-rest);
	flex-shrink: 0;
}

.recipe-link-name[b-z4t60qj58i] {
	flex: 1;
	font-weight: 500;
	font-size: 0.9rem;
}

.recipe-search-area[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 4px;
}

.recipe-results[b-z4t60qj58i] {
	display: flex;
	flex-direction: column;
	gap: 4px;
	max-height: 200px;
	overflow-y: auto;
	border: 1px solid var(--neutral-stroke-rest);
	border-radius: 8px;
	padding: 4px;
}

.recipe-option[b-z4t60qj58i] {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: transparent;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	text-align: left;
	width: 100%;
	transition: background 0.15s ease;
}

.recipe-option:hover[b-z4t60qj58i] {
	background: var(--neutral-layer-3);
}

.recipe-option-icon[b-z4t60qj58i] {
	color: var(--neutral-foreground-hint);
	flex-shrink: 0;
}

.recipe-option-name[b-z4t60qj58i] {
	font-size: 0.9rem;
	font-weight: 500;
}

.recipe-no-results[b-z4t60qj58i] {
	padding: 12px;
	text-align: center;
	color: var(--neutral-foreground-hint);
	font-size: 0.85rem;
}
/* /Components/Workout/Dialogs/AddExerciseDialog.razor.rz.scp.css */
/* =================================
   ADD EXERCISE DIALOG STYLES
   
   FLUENT UI LAYOUT PATTERN:
   -------------------------
   FluentUI Blazor components render as Web Components with shadow DOM.
   Wrap them in container <div> elements for stable layout control.
   Use 'auto' sizing in grids to let components size naturally.
   ================================= */

/* Dialog sizing and z-index for nested dialogs */
.add-exercise-dialog[b-9u221ttpgo] {
    --dialog-width: min(95vw, 600px);
    z-index: 1000;
}

/* Ensure dialog body allows interaction */
.add-exercise-content[b-9u221ttpgo] {
    padding: 8px;
    position: relative;
    z-index: 1;
}

/* Fix for nested dialog input focus issues */
.exercise-params-form[b-9u221ttpgo] {
    position: relative;
    z-index: 10;
}

.params-row[b-9u221ttpgo] {
    display: flex;
    gap: 12px;
    position: relative;
    z-index: 10;
}

.params-row > *[b-9u221ttpgo] {
    flex: 1;
    min-width: 0;
}

/* Ensure FluentUI inputs are clickable in nested dialogs */
.params-row > div[b-9u221ttpgo] {
    position: relative;
    z-index: 10;
}

/* Force input elements to be interactive */
.params-row fluent-number-field[b-9u221ttpgo],
.params-row fluent-text-field[b-9u221ttpgo],
.params-row fluent-select[b-9u221ttpgo] {
    position: relative;
    z-index: 11;
}

/* Dialog Header with Back Button */
.dialog-header-with-back[b-9u221ttpgo] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Category Grid */
.category-grid[b-9u221ttpgo] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
}

.category-tile[b-9u221ttpgo] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.category-tile:hover[b-9u221ttpgo] {
    border-color: var(--accent-fill-rest);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.category-tile.selected[b-9u221ttpgo] {
    border-color: var(--accent-fill-rest);
    background: var(--accent-fill-rest);
    color: white;
}

.category-tile.selected .category-icon[b-9u221ttpgo] {
    background: rgba(255, 255, 255, 0.2);
}

.category-icon[b-9u221ttpgo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--neutral-layer-2);
    border-radius: 8px;
    flex-shrink: 0;
}

.category-info[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.category-name[b-9u221ttpgo] {
    font-weight: 600;
    font-size: 0.9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-count[b-9u221ttpgo] {
    font-size: 0.75rem;
    opacity: 0.7;
}

/* Exercise Selection */
.exercise-selection-header[b-9u221ttpgo] {
    margin-bottom: 16px;
}

.selected-category-badge[b-9u221ttpgo] {
    display: inline-block;
    padding: 4px 12px;
    background: var(--accent-fill-rest);
    color: white;
    border-radius: 16px;
    font-size: 0.8rem;
    font-weight: 500;
}

.exercise-list-selection[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 400px;
    overflow-y: auto;
}

.exercise-select-item[b-9u221ttpgo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.exercise-select-item:hover[b-9u221ttpgo] {
    border-color: var(--accent-fill-rest);
    background: var(--neutral-layer-2);
}

.exercise-select-item.selected[b-9u221ttpgo] {
    border-color: var(--accent-fill-rest);
    background: var(--accent-fill-rest);
    color: white;
}

.exercise-select-name[b-9u221ttpgo] {
    font-weight: 500;
}

.exercise-select-focus[b-9u221ttpgo] {
    font-size: 0.8rem;
    color: var(--neutral-foreground-hint);
    padding: 2px 8px;
    background: var(--neutral-layer-2);
    border-radius: 12px;
}

.exercise-select-item.selected .exercise-select-focus[b-9u221ttpgo] {
    background: rgba(255, 255, 255, 0.2);
    color: white;
}

/* Exercise Details Form */
.exercise-details-form[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
    z-index: 5;
}

.selected-exercise-header[b-9u221ttpgo] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: var(--neutral-layer-2);
    border-radius: 10px;
}

.selected-exercise-info[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.selected-exercise-name[b-9u221ttpgo] {
    font-weight: 600;
    font-size: 1.1rem;
}

.selected-exercise-category[b-9u221ttpgo] {
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

.exercise-params-form[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Mobile Responsiveness */
@media (max-width: 500px) {
    .category-grid[b-9u221ttpgo] {
        grid-template-columns: 1fr;
    }
    
    .params-row[b-9u221ttpgo] {
        flex-direction: column;
    }
    
    .params-row > *[b-9u221ttpgo] {
        flex: none;
        width: 100%;
    }
    
    .category-tile[b-9u221ttpgo] {
        padding: 12px;
    }
}

/* Resizable notes textarea */
.resizable-notes[b-9u221ttpgo]::part(control) {
    resize: vertical;
    min-height: 60px;
    white-space: pre-wrap;
    font-family: inherit;
    line-height: 1.4;
}

/* Exercise Purpose Selection */
.purpose-selection[b-9u221ttpgo] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 8px;
}

.purpose-selection .purpose-label[b-9u221ttpgo] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--neutral-foreground-rest);
}

.purpose-options[b-9u221ttpgo] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.purpose-option[b-9u221ttpgo] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    background: var(--neutral-layer-1);
}

.purpose-option:hover[b-9u221ttpgo] {
    border-color: var(--neutral-stroke-hover);
    background: var(--neutral-layer-2);
}

.purpose-option.selected[b-9u221ttpgo] {
    border-width: 2px;
}

.purpose-indicator[b-9u221ttpgo] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--neutral-stroke-rest);
}

.purpose-option.purpose-warmup .purpose-indicator[b-9u221ttpgo] {
    background: var(--purpose-warmup);
}

.purpose-option.purpose-technique .purpose-indicator[b-9u221ttpgo] {
    background: var(--purpose-technique);
}

.purpose-option.purpose-corelift .purpose-indicator[b-9u221ttpgo] {
    background: var(--purpose-corelift);
}

.purpose-option.purpose-strength .purpose-indicator[b-9u221ttpgo] {
    background: var(--purpose-strength);
}

.purpose-option.purpose-accessory .purpose-indicator[b-9u221ttpgo] {
    background: var(--purpose-accessory);
}

.purpose-option.purpose-warmup.selected[b-9u221ttpgo] {
    border-color: var(--purpose-warmup);
    background: var(--purpose-warmup-bg);
}

.purpose-option.purpose-technique.selected[b-9u221ttpgo] {
    border-color: var(--purpose-technique);
    background: var(--purpose-technique-bg);
}

.purpose-option.purpose-corelift.selected[b-9u221ttpgo] {
    border-color: var(--purpose-corelift);
    background: var(--purpose-corelift-bg);
}

.purpose-option.purpose-strength.selected[b-9u221ttpgo] {
    border-color: var(--purpose-strength);
    background: var(--purpose-strength-bg);
}

.purpose-option.purpose-accessory.selected[b-9u221ttpgo] {
    border-color: var(--purpose-accessory);
    background: var(--purpose-accessory-bg);
}

.purpose-name[b-9u221ttpgo] {
    font-size: 0.85rem;
    font-weight: 500;
}
/* /Components/Workout/Dialogs/EditWorkoutDialog.razor.rz.scp.css */
/* =================================
   EDIT WORKOUT DIALOG STYLES
   
   FLUENT UI LAYOUT PATTERN:
   -------------------------
   FluentUI Blazor components render as Web Components with shadow DOM.
   This means they have multiple internal parts that can affect layout.
   
   Best practices:
   1. Wrap FluentUI components in a container <div> for layout control
   2. Use 'auto' or 'minmax()' in grids instead of '1fr' to let components size naturally
   3. Apply flex/grid styles to the wrapper div, not the component itself
   4. The container div acts as the stable layout unit
   
   Example:
   <div class="exercise-params-row">
       <div><FluentNumberField Label="Sets" ... /></div>
       <div><FluentNumberField Label="Reps" ... /></div>
       <div><FluentSelect Label="Unit" ... /></div>
   </div>
   
   .exercise-params-row {
       display: grid;
       grid-template-columns: auto auto auto;
   }
}

/* Dialog sizing */
.edit-workout-dialog[b-aopy7hkk91] {
    --dialog-width: min(95vw, 580px);
}

/* Form layout */
.workout-basic-info[b-aopy7hkk91] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 16px;
}

.form-row[b-aopy7hkk91] {
    display: flex;
    gap: 16px;
}

.form-row > *[b-aopy7hkk91] {
    flex: 1;
    min-width: 0;
}

/* Exercise section */
.exercise-management[b-aopy7hkk91] {
    border-top: 1px solid var(--neutral-stroke-rest, #e0e0e0);
    padding-top: 16px;
    margin-top: 16px;
}

.exercise-header[b-aopy7hkk91] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.exercise-header h5[b-aopy7hkk91] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

/* Exercise list with scroll */
.exercise-list[b-aopy7hkk91] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 320px;
    overflow-y: auto;
}

/* Individual exercise card */
.exercise-edit-item[b-aopy7hkk91] {
    display: flex;
    gap: 8px;
    padding: 12px;
    background: var(--neutral-layer-2, #f5f5f5);
    border-radius: 8px;
    border: 1px solid var(--neutral-stroke-rest, #e0e0e0);
}

.exercise-reorder[b-aopy7hkk91] {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.exercise-details[b-aopy7hkk91] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.exercise-name-row[b-aopy7hkk91] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.exercise-name-row strong[b-aopy7hkk91] {
    color: var(--accent-fill-rest, #0078d4);
    font-size: 0.95rem;
}

/* Exercise parameters grid - use 'auto' to let wrapped components size naturally */
.exercise-params-row[b-aopy7hkk91] {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 8px;
}

.percentage-of-row[b-aopy7hkk91],
.exercise-notes-row[b-aopy7hkk91] {
    margin-top: 4px;
}

/* Resizable notes textarea */
.resizable-notes[b-aopy7hkk91]::part(control) {
    resize: vertical;
    min-height: 60px;
    white-space: pre-wrap;
    font-family: inherit;
    line-height: 1.4;
}

/* Empty state */
.no-exercises-edit[b-aopy7hkk91] {
    text-align: center;
    padding: 24px;
    color: var(--neutral-foreground-hint, #666);
    background: var(--neutral-layer-2, #f5f5f5);
    border-radius: 8px;
}

/* Mobile: stack form row */
@media (max-width: 480px) {
    .form-row[b-aopy7hkk91] {
        flex-direction: column;
    }
    
    .exercise-edit-item[b-aopy7hkk91] {
        flex-direction: column;
    }
    
    .exercise-reorder[b-aopy7hkk91] {
        flex-direction: row;
        justify-content: flex-end;
        order: 1;
        padding-top: 8px;
        border-top: 1px solid var(--neutral-stroke-rest, #e0e0e0);
    }
    
    /* On mobile, let params stack in 2 columns */
    .exercise-params-row[b-aopy7hkk91] {
        grid-template-columns: 1fr 1fr;
    }
}
/* /Components/Workout/Dialogs/GenerateWorkoutDialog.razor.rz.scp.css */
/* =================================
   GENERATE WORKOUT DIALOG STYLES
   ================================= */

[b-wdzxrahusm] .generate-workout-dialog {
    --dialog-width: 95vw;
    --dialog-max-width: 900px;
}

.generate-workout-content[b-wdzxrahusm] {
    padding: 8px;
}

.template-header[b-wdzxrahusm] {
    text-align: center;
    margin-bottom: 24px;
}

.template-title[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-title h3[b-wdzxrahusm] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.template-title .header-icon[b-wdzxrahusm] {
    color: var(--accent-fill-rest);
}

.template-subtitle[b-wdzxrahusm] {
    color: var(--neutral-foreground-hint);
    margin: 0;
    font-size: 0.9rem;
}

/* Dialog Header with Back Button */
.dialog-header-with-back[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Week Planning Section */
.week-planning-section[b-wdzxrahusm] {
    margin-bottom: 24px;
}

.week-planning-button[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
    padding: 16px 20px;
    background: linear-gradient(135deg, var(--accent-fill-rest) 0%, var(--accent-fill-hover) 100%);
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: white;
    text-align: left;
}

.week-planning-button:hover[b-wdzxrahusm] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--accent-fill-rest-rgb), 0.3);
}

.week-planning-button .button-icon[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
}

.week-planning-button .button-content[b-wdzxrahusm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.week-planning-button .button-title[b-wdzxrahusm] {
    font-size: 1.1rem;
    font-weight: 600;
}

.week-planning-button .button-subtitle[b-wdzxrahusm] {
    font-size: 0.85rem;
    opacity: 0.9;
}

.week-planning-button .button-arrow[b-wdzxrahusm] {
    opacity: 0.8;
}

/* Section Divider */
.section-divider[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 24px 0;
    color: var(--neutral-foreground-hint);
    font-size: 0.85rem;
}

.section-divider[b-wdzxrahusm]::before,
.section-divider[b-wdzxrahusm]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--neutral-stroke-rest);
}

/* Day Type Grid */
.day-type-grid[b-wdzxrahusm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
}

.day-type-tile[b-wdzxrahusm] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.day-type-tile:hover[b-wdzxrahusm] {
    border-color: var(--accent-fill-rest);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.day-type-tile-header[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.day-type-tile-header h4[b-wdzxrahusm] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
}

.day-type-icon[b-wdzxrahusm] {
    color: var(--accent-fill-rest);
}

.day-type-description[b-wdzxrahusm] {
    margin: 0 0 12px 0;
    font-size: 0.8rem;
    color: var(--neutral-foreground-hint);
    line-height: 1.4;
}

.template-count[b-wdzxrahusm] {
    font-size: 0.75rem;
    color: var(--accent-fill-rest);
    font-weight: 500;
}

/* Week Template Categories */
.week-category-section[b-wdzxrahusm] {
    margin-bottom: 24px;
}

.week-category-section:last-child[b-wdzxrahusm] {
    margin-bottom: 0;
}

.week-category-title[b-wdzxrahusm] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--accent-fill-rest);
    display: inline-block;
}

/* Week Template Grid */
.week-template-grid[b-wdzxrahusm] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.week-template-tile[b-wdzxrahusm] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.week-template-tile:hover[b-wdzxrahusm] {
    border-color: var(--accent-fill-rest);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.week-template-header[b-wdzxrahusm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--neutral-stroke-rest);
}

.week-template-header h4[b-wdzxrahusm] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.day-count[b-wdzxrahusm] {
    font-size: 0.8rem;
    color: var(--accent-fill-rest);
    font-weight: 500;
    background: var(--accent-fill-rest);
    color: white;
    padding: 2px 8px;
    border-radius: 12px;
}

.week-template-days[b-wdzxrahusm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.week-day-preview[b-wdzxrahusm] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.week-day-preview .day-label[b-wdzxrahusm] {
    min-width: 36px;
    font-weight: 600;
    color: var(--accent-fill-rest);
    font-size: 0.85rem;
}

.week-day-preview .template-name[b-wdzxrahusm] {
    font-size: 0.85rem;
    color: var(--neutral-foreground-rest);
}

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

.template-tile[b-wdzxrahusm] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.template-tile:hover[b-wdzxrahusm] {
    border-color: var(--accent-fill-rest);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.template-tile-header[b-wdzxrahusm] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}

.template-tile-icon[b-wdzxrahusm] {
    color: var(--accent-fill-rest);
    flex-shrink: 0;
}

.template-tile-title[b-wdzxrahusm] {
    flex: 1;
}

.template-tile-name[b-wdzxrahusm] {
    margin: 0 0 4px 0;
    font-size: 1rem;
    font-weight: 600;
}

.template-duration[b-wdzxrahusm] {
    font-size: 0.8rem;
    color: var(--neutral-foreground-hint);
}

.template-tile-content[b-wdzxrahusm] {
    padding-top: 8px;
    border-top: 1px solid var(--neutral-stroke-rest);
}

.template-tile-description[b-wdzxrahusm] {
    margin: 0 0 12px 0;
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

/* Exercise Phases */
.exercise-phases[b-wdzxrahusm] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.phase-item[b-wdzxrahusm] {
    display: flex;
    gap: 8px;
    font-size: 0.8rem;
    padding: 4px 8px;
    border-radius: 6px;
    background: var(--neutral-layer-2);
}

.phase-item.warmup[b-wdzxrahusm] {
    border-left: 3px solid var(--purpose-warmup);
}

.phase-item.technique[b-wdzxrahusm] {
    border-left: 3px solid var(--purpose-technique);
}

.phase-item.core[b-wdzxrahusm] {
    border-left: 3px solid var(--purpose-corelift);
}

.phase-item.strength[b-wdzxrahusm] {
    border-left: 3px solid var(--purpose-strength);
}

.phase-item.accessory[b-wdzxrahusm] {
    border-left: 3px solid var(--purpose-accessory);
}

.phase-label[b-wdzxrahusm] {
    min-width: 70px;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
}

.phase-exercise[b-wdzxrahusm] {
    color: var(--neutral-foreground-rest);
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
    .day-type-grid[b-wdzxrahusm] {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .week-template-grid[b-wdzxrahusm],
    .template-grid[b-wdzxrahusm] {
        grid-template-columns: 1fr;
    }
    
    .week-planning-button[b-wdzxrahusm] {
        padding: 12px 16px;
    }
    
    .week-planning-button .button-icon[b-wdzxrahusm] {
        width: 40px;
        height: 40px;
    }
    
    .day-selector-grid[b-wdzxrahusm] {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }
    
    .day-selector-tile[b-wdzxrahusm] {
        padding: 10px 6px;
    }
    
    .day-selector-tile .day-number[b-wdzxrahusm] {
        font-size: 1.2rem;
    }
}

/* =================================
   DAY SELECTOR STYLES (Using FluentCalendar)
   ================================= */

.calendar-container[b-wdzxrahusm] {
    display: flex;
    justify-content: center;
    margin: 20px 0;
}

/* Style the FluentCalendar to fit the dialog */
.calendar-container fluent-calendar[b-wdzxrahusm] {
    --calendar-width: 100%;
    max-width: 320px;
}

.date-warning[b-wdzxrahusm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px;
    background: rgba(255, 152, 0, 0.1);
    border: 1px solid rgba(255, 152, 0, 0.3);
    border-radius: 8px;
    color: #e65100;
    font-size: 0.85rem;
    margin-bottom: 16px;
}

.day-selection-actions[b-wdzxrahusm] {
    display: flex;
    justify-content: center;
    margin-top: 16px;
}
/* /Components/Workout/Dialogs/ManageCyclesDialog.razor.rz.scp.css */
/* =================================
   MANAGE CYCLES DIALOG STYLES
   ================================= */

[b-uukbr9cmgy] .manage-cycles-dialog {
    --dialog-width: 95vw;
    --dialog-max-width: 700px;
}

.manage-cycles-content[b-uukbr9cmgy] {
    padding: 8px;
    min-height: 400px;
}

/* Dialog Header with Back Button */
.dialog-header-with-back[b-uukbr9cmgy] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Dialog Header with Close Button */
.dialog-header-with-close[b-uukbr9cmgy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* List Header */
.cycles-list-header[b-uukbr9cmgy] {
    margin-bottom: 24px;
}

.list-subtitle[b-uukbr9cmgy] {
    color: var(--neutral-foreground-hint);
    margin: 0 0 16px 0;
    font-size: 0.9rem;
}

/* Loading and Empty States */
.loading-indicator[b-uukbr9cmgy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    gap: 12px;
    color: var(--neutral-foreground-hint);
}

.empty-state[b-uukbr9cmgy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--neutral-foreground-hint);
}

.empty-state h4[b-uukbr9cmgy] {
    margin: 16px 0 8px 0;
    color: var(--neutral-foreground-rest);
}

.empty-state p[b-uukbr9cmgy] {
    margin: 0;
    font-size: 0.9rem;
}

/* Cycles Grid */
.cycles-grid[b-uukbr9cmgy] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

@media (max-width: 600px) {
    .cycles-grid[b-uukbr9cmgy] {
        grid-template-columns: 1fr;
    }
}

/* Cycle Card */
.cycle-card[b-uukbr9cmgy] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: all 0.2s ease;
}

.cycle-card:hover[b-uukbr9cmgy] {
    border-color: var(--accent-fill-rest);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.cycle-card-header[b-uukbr9cmgy] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
}

.cycle-card-header h4[b-uukbr9cmgy] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    flex: 1;
    word-break: break-word;
}

.cycle-actions[b-uukbr9cmgy] {
    display: flex;
    gap: 4px;
}

.cycle-card-body[b-uukbr9cmgy] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cycle-info-row[b-uukbr9cmgy] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

/* Edit Form */
.form-section[b-uukbr9cmgy] {
    margin-bottom: 16px;
}

.form-row[b-uukbr9cmgy] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

@media (max-width: 500px) {
    .form-row[b-uukbr9cmgy] {
        grid-template-columns: 1fr;
    }
}

.form-row > div[b-uukbr9cmgy] {
    min-width: 0;
}

.form-actions[b-uukbr9cmgy] {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--neutral-stroke-rest);
}

.form-actions > *[b-uukbr9cmgy] {
    flex: 1;
}
/* /Components/Workout/Dialogs/ManageExercisesDialog.razor.rz.scp.css */
/* =================================
   MANAGE EXERCISES DIALOG STYLES
   ================================= */

[b-u2hdbrxsb9] .manage-exercises-dialog {
    --dialog-width: 95vw;
    --dialog-max-width: 750px;
}

.manage-exercises-content[b-u2hdbrxsb9] {
    padding: 8px;
    min-height: 500px;
}

/* Dialog Header with Back Button */
.dialog-header-with-back[b-u2hdbrxsb9] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Dialog Header with Close Button */
.dialog-header-with-close[b-u2hdbrxsb9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* Exercise Header Actions */
.exercise-header-actions[b-u2hdbrxsb9] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

/* List Header */
.exercises-list-header[b-u2hdbrxsb9] {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.header-top[b-u2hdbrxsb9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

@media (max-width: 600px) {
    .header-top[b-u2hdbrxsb9] {
        flex-direction: column;
        align-items: stretch;
    }
}

.list-subtitle[b-u2hdbrxsb9] {
    color: var(--neutral-foreground-hint);
    margin: 0;
    font-size: 0.9rem;
    flex: 1;
}

/* Loading and Empty States */
.loading-indicator[b-u2hdbrxsb9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    gap: 12px;
    color: var(--neutral-foreground-hint);
}

.empty-state[b-u2hdbrxsb9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--neutral-foreground-hint);
}

.empty-state h4[b-u2hdbrxsb9] {
    margin: 16px 0 8px 0;
    color: var(--neutral-foreground-rest);
}

.empty-state p[b-u2hdbrxsb9] {
    margin: 0;
    font-size: 0.9rem;
}

/* Exercises List */
.exercises-list[b-u2hdbrxsb9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 500px;
    overflow-y: auto;
    padding-right: 8px;
}

/* Exercise Card */
.exercise-card[b-u2hdbrxsb9] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: all 0.2s ease;
}

.exercise-card:hover[b-u2hdbrxsb9] {
    border-color: var(--accent-fill-rest);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

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

.exercise-title[b-u2hdbrxsb9] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.exercise-title h4[b-u2hdbrxsb9] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    word-break: break-word;
}

.exercise-description[b-u2hdbrxsb9] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--neutral-foreground-hint);
    line-height: 1.4;
}

.exercise-details[b-u2hdbrxsb9] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.exercise-detail-item[b-u2hdbrxsb9] {
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

.exercise-detail-item strong[b-u2hdbrxsb9] {
    color: var(--neutral-foreground-rest);
    font-weight: 500;
}

.exercise-video[b-u2hdbrxsb9] {
    padding-top: 8px;
    border-top: 1px solid var(--neutral-stroke-rest);
}

/* Edit Form */
.form-section[b-u2hdbrxsb9] {
    margin-bottom: 16px;
}

.form-row[b-u2hdbrxsb9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

@media (max-width: 500px) {
    .form-row[b-u2hdbrxsb9] {
        grid-template-columns: 1fr;
    }
}

.form-row > div[b-u2hdbrxsb9] {
    min-width: 0;
}

.form-actions[b-u2hdbrxsb9] {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--neutral-stroke-rest);
}

.form-actions > *[b-u2hdbrxsb9] {
    flex: 1;
}

/* Scrollbar Styling */
.exercises-list[b-u2hdbrxsb9]::-webkit-scrollbar {
    width: 8px;
}

.exercises-list[b-u2hdbrxsb9]::-webkit-scrollbar-track {
    background: var(--neutral-layer-2);
    border-radius: 4px;
}

.exercises-list[b-u2hdbrxsb9]::-webkit-scrollbar-thumb {
    background: var(--neutral-stroke-rest);
    border-radius: 4px;
}

.exercises-list[b-u2hdbrxsb9]::-webkit-scrollbar-thumb:hover {
    background: var(--neutral-stroke-hover);
}
/* /Components/Workout/Dialogs/ManagePhasesDialog.razor.rz.scp.css */
/* =================================
   MANAGE PHASES DIALOG STYLES
   ================================= */

[b-0obq8g6p0g] .manage-phases-dialog {
    --dialog-width: 95vw;
    --dialog-max-width: 650px;
}

.manage-phases-content[b-0obq8g6p0g] {
    padding: 8px;
    min-height: 400px;
}

/* Dialog Header with Back Button */
.dialog-header-with-back[b-0obq8g6p0g] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* List Header */
.phases-list-header[b-0obq8g6p0g] {
    margin-bottom: 24px;
}

.list-subtitle[b-0obq8g6p0g] {
    color: var(--neutral-foreground-hint);
    margin: 0 0 16px 0;
    font-size: 0.9rem;
}

/* Loading and Empty States */
.loading-indicator[b-0obq8g6p0g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    gap: 12px;
    color: var(--neutral-foreground-hint);
}

.empty-state[b-0obq8g6p0g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--neutral-foreground-hint);
}

.empty-state h4[b-0obq8g6p0g] {
    margin: 16px 0 8px 0;
    color: var(--neutral-foreground-rest);
}

.empty-state p[b-0obq8g6p0g] {
    margin: 0;
    font-size: 0.9rem;
}

/* Phases List */
.phases-list[b-0obq8g6p0g] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Phase Card */
.phase-card[b-0obq8g6p0g] {
    background: var(--neutral-layer-1);
    border: 1px solid var(--neutral-stroke-rest);
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: all 0.2s ease;
}

.phase-card:hover[b-0obq8g6p0g] {
    border-color: var(--accent-fill-rest);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.phase-card-header[b-0obq8g6p0g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
}

.phase-title[b-0obq8g6p0g] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.phase-title h4[b-0obq8g6p0g] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    word-break: break-word;
}

.phase-actions[b-0obq8g6p0g] {
    display: flex;
    gap: 4px;
}

.phase-description[b-0obq8g6p0g] {
    margin: 0;
    font-size: 0.9rem;
    color: var(--neutral-foreground-hint);
    line-height: 1.4;
}

.phase-info[b-0obq8g6p0g] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.phase-info-item[b-0obq8g6p0g] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

/* Edit Form */
.form-section[b-0obq8g6p0g] {
    margin-bottom: 16px;
}

.form-actions[b-0obq8g6p0g] {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid var(--neutral-stroke-rest);
}

.form-actions > *[b-0obq8g6p0g] {
    flex: 1;
}
/* /Components/Workout/Dialogs/WorkoutDetailsDialog.razor.rz.scp.css */
/* =================================
   WORKOUT DETAILS DIALOG STYLES
   ================================= */

[b-zkk0o6fee7] .workout-details-dialog {
    --dialog-width: 95vw;
    --dialog-max-width: 550px;
}

.workout-details-content[b-zkk0o6fee7] {
    padding: 8px;
}

.detail-section[b-zkk0o6fee7] {
    margin-bottom: 20px;
}

.detail-section:last-child[b-zkk0o6fee7] {
    margin-bottom: 0;
}

.detail-section h4[b-zkk0o6fee7] {
    margin: 0 0 8px 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-section p[b-zkk0o6fee7] {
    margin: 0;
    color: var(--neutral-foreground-rest);
}

/* Completion Status */
.completion-status[b-zkk0o6fee7] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Exercises List */
.exercises-list[b-zkk0o6fee7] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.exercise-detail-item[b-zkk0o6fee7] {
    padding: 12px 16px;
    background: var(--neutral-layer-2);
    border-radius: 8px;
    border-left: 3px solid var(--accent-fill-rest);
}

/* Exercise Purpose Colors */
.exercise-detail-item.purpose-warmup[b-zkk0o6fee7] {
    border-left-color: var(--purpose-warmup);
}

.exercise-detail-item.purpose-technique[b-zkk0o6fee7] {
    border-left-color: var(--purpose-technique);
}

.exercise-detail-item.purpose-corelift[b-zkk0o6fee7] {
    border-left-color: var(--purpose-corelift);
}

.exercise-detail-item.purpose-strength[b-zkk0o6fee7] {
    border-left-color: var(--purpose-strength);
}

.exercise-detail-item.purpose-accessory[b-zkk0o6fee7] {
    border-left-color: var(--purpose-accessory);
}

.exercise-name-with-purpose[b-zkk0o6fee7] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.exercise-detail-header[b-zkk0o6fee7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}

.exercise-detail-header strong[b-zkk0o6fee7] {
    font-size: 0.95rem;
    color: var(--neutral-foreground-rest);
}

.exercise-detail-stats[b-zkk0o6fee7] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.stat-badge[b-zkk0o6fee7] {
    font-size: 0.8rem;
    padding: 2px 10px;
    background: var(--neutral-layer-3);
    border-radius: 12px;
    color: var(--neutral-foreground-rest);
    font-weight: 500;
}

.percentage-badge[b-zkk0o6fee7] {
    background: var(--accent-fill-rest);
    color: white;
}

.weight-badge[b-zkk0o6fee7] {
    background: var(--neutral-fill-secondary-rest);
}

.exercise-detail-notes[b-zkk0o6fee7] {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--neutral-stroke-rest);
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

.no-exercises[b-zkk0o6fee7] {
    text-align: center;
    padding: 24px;
    color: var(--neutral-foreground-hint);
    font-style: italic;
}

/* Mobile Responsiveness */
@media (max-width: 500px) {
    .exercise-detail-header[b-zkk0o6fee7] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .exercise-detail-stats[b-zkk0o6fee7] {
        width: 100%;
    }
}
/* /Components/Workout/Workout.razor.rz.scp.css */
/* =================================
   WORKOUT PLANNER COMPONENT STYLES
   ================================= */

/* =================================
   CONTAINER AND LAYOUT
   ================================= */
.workout-planner-container[b-vw3vojmbyy] {
     max-width: 1200px;
     margin: 0 auto;
     padding: 16px;
     background-color: var(--color-primary-light);
     border-radius: var(--workout-border-radius);
     box-shadow: var(--workout-shadow-light);
}

/* Mobile breakpoint */
@media (max-width: 768px) {
    .workout-planner-container[b-vw3vojmbyy] {
        padding: 8px;
        border-radius: 0;
    }
}

/* =================================
   ERROR
   ================================= */

/* Error Message */
.error-message[b-vw3vojmbyy] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    background-color: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: var(--workout-border-radius-small);
    color: #dc2626;
    font-size: 0.9rem;
}

/* =================================
   FORM STYLING (FOR DIALOGS)
   ================================= */

/* Form Styling */
.form-actions[b-vw3vojmbyy] {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    justify-content: flex-end;
}

/* Enhanced Exercise Management */
.workout-edit-container[b-vw3vojmbyy] {
    padding: 16px;
}

.workout-basic-info[b-vw3vojmbyy] {
    display: flex;
    align-items: end;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.exercise-management[b-vw3vojmbyy] {
    margin: 16px 0;
    padding: 16px;
    background-color: var(--color-secondary-light);
    border-radius: 8px;
    border: 1px solid var(--color-neutral-light);
}

.exercise-header[b-vw3vojmbyy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.exercise-header h5[b-vw3vojmbyy] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-primary);
}

.add-exercise-btn[b-vw3vojmbyy] {
    font-size: 0.9rem;
}

.exercise-list[b-vw3vojmbyy] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.exercise-edit-item[b-vw3vojmbyy] {
    display: flex;
    gap: 12px;
    padding: 12px;
    background-color: var(--color-neutral);
    border-radius: 8px;
    border: 1px solid var(--color-neutral-light);
}

.exercise-reorder[b-vw3vojmbyy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}

.exercise-details[b-vw3vojmbyy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.exercise-name-row[b-vw3vojmbyy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.exercise-name-row strong[b-vw3vojmbyy] {
    color: var(--color-primary);
    font-size: 1rem;
}

.remove-exercise-btn[b-vw3vojmbyy] {
    color: var(--color-danger) !important;
}

.exercise-params[b-vw3vojmbyy] {
    display: flex;
    gap: 12px;
    align-items: end;
    flex-wrap: wrap;
}

.no-exercises-edit[b-vw3vojmbyy] {
    text-align: center;
    color: var(--color-neutral-medium);
    font-style: italic;
    padding: 24px;
    margin: 0;
}

/* Add Exercise Dialog */
.add-exercise-content[b-vw3vojmbyy] {
    padding: 16px 0;
}

.exercise-params-grid[b-vw3vojmbyy] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

/* Generate Workout Dialog */
.generate-workout-content[b-vw3vojmbyy] {
    padding: 16px 0;
}

/* Enhanced Template Header */
.template-header[b-vw3vojmbyy] {
    margin-bottom: 24px;
    text-align: center;
}

.template-title[b-vw3vojmbyy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-title h3[b-vw3vojmbyy] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-neutral-dark);
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.template-title .header-icon[b-vw3vojmbyy] {
    color: var(--color-accent);
    font-size: 1.8rem;
}

.template-subtitle[b-vw3vojmbyy] {
    font-size: 1rem;
    color: var(--color-neutral-medium);
    margin: 0;
    font-style: italic;
}

/* Template Grid Layout */
.template-grid[b-vw3vojmbyy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    margin-top: 20px;
}

/* Template Tiles */
.template-tile[b-vw3vojmbyy] {
    background: linear-gradient(135deg, var(--color-neutral), var(--color-secondary-light));
    border: 2px solid var(--color-neutral-light);
    border-radius: 16px;
    padding: 20px;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 140px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
    overflow: hidden;
}

.template-tile[b-vw3vojmbyy]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
    opacity: 0;
    transition: opacity 0.3s ease;
}

.template-tile:hover[b-vw3vojmbyy] {
    border-color: var(--color-primary);
    transform: translateY(-6px) scale(1.02);
    box-shadow: 0 12px 32px rgba(59, 130, 246, 0.2);
    background: linear-gradient(135deg, var(--color-primary-light), var(--color-accent-light));
}

.template-tile:hover[b-vw3vojmbyy]::before {
    opacity: 1;
}

.template-tile-header[b-vw3vojmbyy] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-tile-icon[b-vw3vojmbyy] {
    font-size: 2rem;
    color: var(--color-primary);
    transition: all 0.3s ease;
}

.template-tile:hover .template-tile-icon[b-vw3vojmbyy] {
    color: var(--color-accent);
    transform: scale(1.1) rotate(5deg);
}

.template-tile-name[b-vw3vojmbyy] {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-neutral-dark);
    margin: 0;
    line-height: 1.3;
}

.template-tile-content[b-vw3vojmbyy] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.template-tile-description[b-vw3vojmbyy] {
    font-size: 0.95rem;
    color: var(--color-neutral-medium);
    margin: 0;
    line-height: 1.4;
    flex: 1;
}

.template-tile-exercises[b-vw3vojmbyy] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.exercise-preview[b-vw3vojmbyy] {
    background-color: var(--color-secondary-light);
    color: var(--color-primary);
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 500;
}

.exercise-count[b-vw3vojmbyy] {
    background-color: var(--color-accent-light);
    color: var(--color-accent);
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
}

/* Responsive Design */
@media (max-width: 768px) {
    .workout-planner-container[b-vw3vojmbyy] {
        padding: 12px;
    }
}

@media (max-width: 480px) {
    .workout-planner-container[b-vw3vojmbyy] {
	   padding: 8px;
    }
}
/* /Components/Workout/WorkoutDiscover.razor.rz.scp.css */
/* ========================================
   WORKOUT DISCOVER - Responsive Styles
   ======================================== */

.discover-container[b-h9nqfvcqcf] {
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
}

/* ========================================
   HERO SECTION
   ======================================== */

.discover-hero[b-h9nqfvcqcf] {
    background: linear-gradient(135deg, var(--accent-fill-rest) 0%, var(--accent-fill-hover) 100%);
    border-radius: 12px;
    padding: 24px 24px;
    margin-bottom: 28px;
    text-align: center;
    color: white;
}

.hero-content[b-h9nqfvcqcf] {
    max-width: 600px;
    margin: 0 auto;
}

.hero-icon[b-h9nqfvcqcf] {
    font-size: 32px;
    margin-bottom: 8px;
    opacity: 0.9;
}

.discover-hero h2[b-h9nqfvcqcf] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 700;
}

.discover-hero p[b-h9nqfvcqcf] {
    margin: 0;
    font-size: 0.95rem;
    opacity: 0.9;
    line-height: 1.4;
}

/* ========================================
   SECTION HEADERS
   ======================================== */

.section-header[b-h9nqfvcqcf] {
    margin-bottom: 24px;
    text-align: center;
}

.section-header h3[b-h9nqfvcqcf] {
    margin: 0 0 8px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.section-header p[b-h9nqfvcqcf] {
    margin: 0;
    color: var(--neutral-foreground-hint);
    font-size: 1rem;
}

/* ========================================
   CONCEPTS SECTION
   ======================================== */

.concepts-section[b-h9nqfvcqcf] {
    margin-bottom: 48px;
}

.concept-cards[b-h9nqfvcqcf] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 24px;
}

.concept-card[b-h9nqfvcqcf] {
    background: var(--neutral-layer-card-container);
    border: 1px solid var(--neutral-stroke-layer-rest);
    border-left: 4px solid var(--accent-fill-rest);
    border-radius: 8px;
    padding: 20px 24px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.concept-card:hover[b-h9nqfvcqcf] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.concept-content h4[b-h9nqfvcqcf] {
    margin: 0 0 8px 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
}

.concept-content p[b-h9nqfvcqcf] {
    margin: 0 0 12px 0;
    font-size: 0.9rem;
    color: var(--neutral-foreground-hint);
    line-height: 1.5;
}

.concept-tips[b-h9nqfvcqcf] {
    margin: 0;
    padding-left: 20px;
    font-size: 0.85rem;
    color: var(--neutral-foreground-hint);
}

.concept-tips li[b-h9nqfvcqcf] {
    margin-bottom: 4px;
}

.concept-tips li:last-child[b-h9nqfvcqcf] {
    margin-bottom: 0;
}

/* ========================================
   QUICK START GUIDE
   ======================================== */

.quick-start[b-h9nqfvcqcf] {
    background: var(--neutral-layer-card-container);
    border: 2px dashed var(--neutral-stroke-layer-rest);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.quick-start.expanded[b-h9nqfvcqcf] {
    border-style: solid;
    border-color: var(--accent-fill-rest);
}

.quick-start-toggle[b-h9nqfvcqcf] {
    width: 100%;
    padding: 16px;
    justify-content: center;
    font-weight: 500;
}

.quick-start-content[b-h9nqfvcqcf] {
    padding: 0 24px 24px 24px;
    border-top: 1px solid var(--neutral-stroke-layer-rest);
}

.setup-steps[b-h9nqfvcqcf] {
    margin: 20px 0;
    padding-left: 24px;
    counter-reset: step-counter;
    list-style: none;
}

.setup-steps li[b-h9nqfvcqcf] {
    position: relative;
    padding: 12px 0 12px 16px;
    border-left: 2px solid var(--neutral-stroke-layer-rest);
    margin-left: 12px;
}

.setup-steps li[b-h9nqfvcqcf]::before {
    content: counter(step-counter);
    counter-increment: step-counter;
    position: absolute;
    left: -14px;
    top: 12px;
    width: 24px;
    height: 24px;
    background: var(--accent-fill-rest);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 600;
}

.setup-steps li strong[b-h9nqfvcqcf] {
    display: block;
    color: var(--neutral-foreground-rest);
    margin-bottom: 4px;
}

.setup-steps li span[b-h9nqfvcqcf] {
    font-size: 0.9rem;
    color: var(--neutral-foreground-hint);
}

.quick-start-action[b-h9nqfvcqcf] {
    text-align: center;
    padding-top: 16px;
}

/* ========================================
   EXERCISES SECTION
   ======================================== */

.exercises-section[b-h9nqfvcqcf] {
    margin-bottom: 32px;
}

.exercise-controls[b-h9nqfvcqcf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.search-box[b-h9nqfvcqcf] {
    max-width: 400px;
}

.filter-chips[b-h9nqfvcqcf] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.filter-chip[b-h9nqfvcqcf] {
    font-size: 0.85rem;
    padding: 6px 12px;
}

/* ========================================
   EXERCISE GRID
   ======================================== */

.exercise-grid[b-h9nqfvcqcf] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
}

.exercise-card[b-h9nqfvcqcf] {
    background: var(--neutral-layer-card-container);
    border: 1px solid var(--neutral-stroke-layer-rest);
    border-left: 3px solid var(--accent-fill-rest);
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex;
    flex-direction: column;
}

.exercise-card:hover[b-h9nqfvcqcf] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border-left-color: var(--accent-fill-hover);
}

.exercise-card-clickable[b-h9nqfvcqcf] {
    cursor: pointer;
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 16px;
}

.exercise-card-content[b-h9nqfvcqcf] {
    flex: 1;
}

.exercise-title-row[b-h9nqfvcqcf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 8px;
}

.exercise-card-content h4[b-h9nqfvcqcf] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--neutral-foreground-rest);
    line-height: 1.3;
    flex: 1;
}

.difficulty-badge[b-h9nqfvcqcf] {
    font-size: 0.65rem;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}

.difficulty-beginner[b-h9nqfvcqcf] {
    background: #d4edda;
    color: #155724;
}

.difficulty-intermediate[b-h9nqfvcqcf] {
    background: #fff3cd;
    color: #856404;
}

.difficulty-advanced[b-h9nqfvcqcf] {
    background: #f8d7da;
    color: #721c24;
}

.difficulty-expert[b-h9nqfvcqcf] {
    background: #d1c4e9;
    color: #4a148c;
}

.difficulty-default[b-h9nqfvcqcf] {
    background: var(--neutral-layer-floating);
    color: var(--neutral-foreground-hint);
}

.exercise-focus[b-h9nqfvcqcf] {
    display: block;
    font-size: 0.85rem;
    color: var(--accent-fill-rest);
    margin-bottom: 4px;
}

.exercise-category[b-h9nqfvcqcf] {
    display: inline-block;
    font-size: 0.75rem;
    background: var(--neutral-layer-floating);
    color: var(--neutral-foreground-hint);
    padding: 2px 8px;
    border-radius: 8px;
}

.exercise-card-footer[b-h9nqfvcqcf] {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    padding: 8px 12px;
    border-top: 1px solid var(--neutral-stroke-layer-rest);
    background: var(--neutral-layer-floating);
}

/* ========================================
   LOADING & EMPTY STATES
   ======================================== */

.loading-state[b-h9nqfvcqcf],
.empty-state[b-h9nqfvcqcf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 24px;
    text-align: center;
    color: var(--neutral-foreground-hint);
}

.loading-state p[b-h9nqfvcqcf],
.empty-state p[b-h9nqfvcqcf] {
    margin: 16px 0;
}

.empty-state h4[b-h9nqfvcqcf] {
    margin: 16px 0 8px 0;
    color: var(--neutral-foreground-rest);
}

.load-more[b-h9nqfvcqcf] {
    display: flex;
    justify-content: center;
    padding: 24px;
}

/* ========================================
   EXERCISE DETAILS DIALOG
   ======================================== */

.exercise-details-dialog[b-h9nqfvcqcf] {
    max-width: 500px;
}

.dialog-header-content[b-h9nqfvcqcf] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.exercise-detail-content[b-h9nqfvcqcf] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.detail-row[b-h9nqfvcqcf] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-label[b-h9nqfvcqcf] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--neutral-foreground-hint);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.detail-value[b-h9nqfvcqcf] {
    font-size: 1rem;
    color: var(--neutral-foreground-rest);
}

.detail-row.description p[b-h9nqfvcqcf] {
    margin: 0;
    line-height: 1.5;
}

/* ========================================
   RESPONSIVE - TABLET
   ======================================== */

@media (max-width: 1024px) {
    .discover-container[b-h9nqfvcqcf] {
        padding: 20px;
    }

    .concept-cards[b-h9nqfvcqcf] {
        grid-template-columns: repeat(2, 1fr);
    }

    .exercise-grid[b-h9nqfvcqcf] {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }
}

/* ========================================
   RESPONSIVE - MOBILE
   ======================================== */

@media (max-width: 768px) {
    .discover-container[b-h9nqfvcqcf] {
        padding: 16px;
    }

    .discover-hero[b-h9nqfvcqcf] {
        padding: 20px 16px;
        border-radius: 10px;
    }

    .discover-hero h2[b-h9nqfvcqcf] {
        font-size: 1.25rem;
    }

    .discover-hero p[b-h9nqfvcqcf] {
        font-size: 0.9rem;
    }

    .concept-cards[b-h9nqfvcqcf] {
        grid-template-columns: 1fr;
    }

    .concept-card[b-h9nqfvcqcf] {
        text-align: left;
    }

    .concept-tips[b-h9nqfvcqcf] {
        text-align: left;
    }

    .exercise-controls[b-h9nqfvcqcf] {
        gap: 12px;
    }

    .search-box[b-h9nqfvcqcf] {
        max-width: none;
    }

    .filter-chips[b-h9nqfvcqcf] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding-bottom: 0;
    }

    .filter-chip[b-h9nqfvcqcf] {
        flex-shrink: 0;
        padding: 4px 10px;
        font-size: 0.8rem;
    }

    .exercise-grid[b-h9nqfvcqcf] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .exercise-card-clickable[b-h9nqfvcqcf] {
        padding: 12px;
    }

    .exercise-card-header[b-h9nqfvcqcf] {
        padding: 0 0 8px 0;
    }

    .exercise-card-content[b-h9nqfvcqcf] {
        padding: 0;
    }

    .exercise-card-content h4[b-h9nqfvcqcf] {
        font-size: 0.9rem;
    }

    .exercise-card-footer[b-h9nqfvcqcf] {
        padding: 8px 12px;
    }

    .setup-steps li[b-h9nqfvcqcf] {
        padding: 10px 0 10px 12px;
    }
}

/* ========================================
   RESPONSIVE - SMALL MOBILE
   ======================================== */

@media (max-width: 480px) {
    .discover-container[b-h9nqfvcqcf] {
        padding: 12px;
    }

    .discover-hero[b-h9nqfvcqcf] {
        padding: 16px 12px;
        margin-bottom: 20px;
    }

    .discover-hero h2[b-h9nqfvcqcf] {
        font-size: 1.1rem;
    }

    .hero-icon[b-h9nqfvcqcf] {
        display: none;
    }

    .section-header h3[b-h9nqfvcqcf] {
        font-size: 1.25rem;
    }
}
/* /Components/Workout/WorkoutManage.razor.rz.scp.css */
/* ===========================================================================
   WORKOUT MANAGE - TWO-PANEL LAYOUT WITH FILTER + LIST
   
   FLUENT UI LAYOUT PATTERN:
   -------------------------
   FluentUI Blazor components render as Web Components with shadow DOM.
   Wrap them in container <div> elements for stable layout control.
   Use 'auto' sizing in grids to let components size naturally.
   =========================================================================== */

/* Management Actions Bar */
.management-actions-bar[b-m20z9llecm] {
    background: linear-gradient(135deg, var(--accent-fill-rest) 0%, var(--accent-fill-hover) 100%);
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

.actions-header h3[b-m20z9llecm] {
    margin: 0 0 4px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: white;
}

.actions-header p[b-m20z9llecm] {
    margin: 0;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
}

.actions-buttons[b-m20z9llecm] {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .management-actions-bar[b-m20z9llecm] {
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
    }

    .actions-header[b-m20z9llecm] {
        text-align: center;
    }

    .actions-buttons[b-m20z9llecm] {
        flex-direction: column;
    }
}

/* Main Container - Two Panel Layout */
.manage-workout-container[b-m20z9llecm] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 24px;
    min-height: 600px;
    max-width: 1400px;
    margin: 0 auto;
    padding: 16px;
}

/* Responsive: Stack on mobile */
@media (max-width: 900px) {
    .manage-workout-container[b-m20z9llecm] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* Panel Headers */
.panel-header[b-m20z9llecm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--color-neutral-light);
}

.panel-header h4[b-m20z9llecm] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
}

/* ===========================================================================
   LEFT PANEL: Workout List
   =========================================================================== */

.workout-list-panel[b-m20z9llecm] {
    background: var(--color-neutral);
    border-radius: 12px;
    padding: 16px;
    border: 1px solid var(--color-neutral-light);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 150px);
}

/* Filter Section */
.filter-section[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-neutral-light);
    margin-bottom: 16px;
}

.filter-row[b-m20z9llecm] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.filter-row > div[b-m20z9llecm] {
    min-width: 0;
}

.filter-actions[b-m20z9llecm] {
    display: flex;
    gap: 8px;
}

.filter-actions > *[b-m20z9llecm] {
    flex: 1;
}

/* Workout List Section */
.workout-list-section[b-m20z9llecm] {
    flex: 1;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.workout-items[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    overflow-y: auto;
}

/* Individual Workout Item */
.workout-list-item[b-m20z9llecm] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: white;
    border-radius: 8px;
    border: 1px solid var(--color-neutral-light);
    cursor: pointer;
    transition: all 0.2s ease;
}

.workout-list-item:hover[b-m20z9llecm] {
    border-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.workout-list-item.selected[b-m20z9llecm] {
    border-color: var(--color-primary);
    background: var(--color-primary-light);
}

.workout-item-date[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 40px;
    padding: 4px 8px;
    background: var(--color-secondary-light);
    border-radius: 6px;
}

.workout-item-date .day[b-m20z9llecm] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1;
}

.workout-item-date .month[b-m20z9llecm] {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--color-neutral-medium);
}

.workout-item-info[b-m20z9llecm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.workout-item-type[b-m20z9llecm] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--color-neutral-dark);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.workout-item-phase[b-m20z9llecm] {
    font-size: 0.75rem;
    color: var(--color-neutral-medium);
}

.workout-item-duration[b-m20z9llecm] {
    font-size: 0.75rem;
    color: var(--color-neutral-medium);
    white-space: nowrap;
}

/* Loading and Empty States */
.loading-indicator[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    gap: 12px;
    color: var(--color-neutral-medium);
}

.empty-list[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px;
    text-align: center;
    color: var(--color-neutral-medium);
}

.empty-list p[b-m20z9llecm] {
    margin: 8px 0 0 0;
    font-size: 0.9rem;
}

/* Pagination */
.pagination[b-m20z9llecm] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 0;
    border-top: 1px solid var(--color-neutral-light);
    margin-top: auto;
}

.page-info[b-m20z9llecm] {
    font-size: 0.85rem;
    color: var(--color-neutral-medium);
}

.total-count[b-m20z9llecm] {
    text-align: center;
    font-size: 0.75rem;
    color: var(--color-neutral-medium);
    padding-top: 8px;
}

/* ===========================================================================
   RIGHT PANEL: Workout Details
   =========================================================================== */

.workout-detail-panel[b-m20z9llecm] {
    background: var(--color-neutral);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid var(--color-neutral-light);
    overflow-y: auto;
    max-height: calc(100vh - 150px);
}

/* Workout Basic Info */
.workout-basic-info[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

.info-row[b-m20z9llecm] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.info-row > div[b-m20z9llecm] {
    min-width: 0;
}

.info-row.full-width[b-m20z9llecm] {
    grid-template-columns: 1fr;
}

/* Exercise Management */
.exercise-management[b-m20z9llecm] {
    border-top: 1px solid var(--color-neutral-light);
    padding-top: 16px;
    margin-top: 16px;
}

.exercise-header[b-m20z9llecm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.exercise-header h5[b-m20z9llecm] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.exercise-list[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 400px;
    overflow-y: auto;
}

.exercise-edit-item[b-m20z9llecm] {
    display: flex;
    gap: 8px;
    padding: 12px;
    background: white;
    border-radius: 8px;
    border: 1px solid var(--color-neutral-light);
}

.exercise-reorder[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}

.exercise-details[b-m20z9llecm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.exercise-name-row[b-m20z9llecm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.exercise-name-row strong[b-m20z9llecm] {
    color: var(--color-primary);
    font-size: 0.95rem;
}

.exercise-params-row[b-m20z9llecm] {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 8px;
}

.exercise-params-row > div[b-m20z9llecm] {
    min-width: 0;
}

@media (max-width: 600px) {
    .exercise-params-row[b-m20z9llecm] {
        grid-template-columns: 1fr 1fr;
    }
}

/* Empty State */
.empty-state[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--color-neutral-medium);
    min-height: 300px;
}

.empty-state h4[b-m20z9llecm] {
    margin: 16px 0 8px 0;
    color: var(--color-neutral-dark);
}

.empty-state p[b-m20z9llecm] {
    margin: 0;
    font-size: 0.9rem;
}

.no-exercises-edit[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px;
    text-align: center;
    background: var(--color-tertiary-light);
    border-radius: 8px;
    color: var(--color-neutral-medium);
}

.no-exercises-edit p[b-m20z9llecm] {
    margin: 8px 0 0 0;
}

/* Action Buttons */
.workout-actions[b-m20z9llecm] {
    display: flex;
    gap: 12px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--color-neutral-light);
}

/* ===========================================================================
   ADD EXERCISE DIALOG
   =========================================================================== */

.add-exercise-dialog[b-m20z9llecm] {
    --dialog-width: min(95vw, 500px);
}

.add-exercise-content[b-m20z9llecm] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
/* /Components/Workout/WorkoutView.razor.rz.scp.css */
/* =================================
   WORKOUT PLANNER VIEW STYLES
   ================================= */

/* =================================
   RESPONSIVE VISIBILITY HELPERS
   ================================= */

.desktop-only[b-hbtwknv491] {
    display: flex;
}

.mobile-only[b-hbtwknv491] {
    display: none;
}

@media (max-width: 768px) {
    .desktop-only[b-hbtwknv491] {
        display: none !important;
    }
    
    .mobile-only[b-hbtwknv491] {
        display: block !important;
    }
}

/* =================================
   HEADER STYLING
   ================================= */

.workout-planner-header[b-hbtwknv491] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid var(--color-primary);
    flex-wrap: wrap;
    gap: 16px;
    background-color: var(--color-neutral);
    border-radius: var(--workout-border-radius-small);
    padding: 16px;
}

.header-title[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-title h2[b-hbtwknv491] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
}

.header-icon[b-hbtwknv491] {
    color: var(--color-primary);
}

.header-controls[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.week-display[b-hbtwknv491] {
    padding: 8px 16px;
    background-color: var(--color-secondary-light);
    border-radius: 6px;
    font-weight: 500;
    min-width: 160px;
    text-align: center;
    border: 1px solid var(--color-secondary);
}

.week-range[b-hbtwknv491] {
    color: var(--color-neutral-dark);
    font-size: 0.875rem;
    font-weight: 600;
}

/* =================================
   MOBILE HEADER STYLING
   ================================= */

.workout-planner-header-mobile[b-hbtwknv491] {
    background-color: var(--color-neutral);
    border-radius: var(--workout-border-radius-small);
    padding: 12px;
    margin-bottom: 12px;
}

.mobile-header-row[b-hbtwknv491] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 10px;
}

.mobile-week-range[b-hbtwknv491] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--color-neutral-dark);
    padding: 4px 8px;
    background-color: var(--color-secondary-light);
    border-radius: 4px;
    min-width: 140px;
    text-align: center;
}

.mobile-actions-row[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.header-actions[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* =================================
   WEEK GRID LAYOUT
   ================================= */

.week-grid-container[b-hbtwknv491] {
    display: flex;
    justify-content: center;
}

.week-grid[b-hbtwknv491] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    grid-auto-rows: minmax(min-content, auto);
    gap: 20px;
    width: 100%;
}

/* Day Cards */
.day-card[b-hbtwknv491] {
    background-color: var(--color-neutral);
    border-radius: 12px;
    padding: 18px;
    transition: all 0.3s ease;
    position: relative;
    overflow: visible;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.day-card:hover[b-hbtwknv491] {
    transform: translateY(-4px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    border-color: var(--color-primary);
}

.day-card.today[b-hbtwknv491] {
    background-color: var(--color-secondary-light);
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px var(--color-primary);
}

.day-card.today[b-hbtwknv491]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 1%;
    right: 0;
    height: 4px;
    width: 98%;
    background: linear-gradient(90deg, var(--color-primary), var(--color-accent));
    border-radius: 12px 12px 0 0;
}

.day-card.weekend[b-hbtwknv491] {
    background-color: var(--color-secondary-light);
}

.day-header[b-hbtwknv491] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-neutral-light);
}

.day-info[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.day-name[b-hbtwknv491] {
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--color-neutral-dark);
}

.day-date[b-hbtwknv491] {
    font-size: 0.9rem;
    color: var(--color-neutral-medium);
}

.day-actions[b-hbtwknv491] {
    display: flex;
    gap: 4px;
    opacity: 0.8;
}

.day-actions:hover[b-hbtwknv491] {
    opacity: 1;
}

/* Workout Cards */
.day-workouts[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.workout-card[b-hbtwknv491] {
    background-color: var(--color-neutral);
    border: 1px solid var(--color-neutral-light);
    border-radius: 8px;
    padding: 12px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.workout-card:hover[b-hbtwknv491] {
    border-color: var(--color-primary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.workout-card.swapping[b-hbtwknv491] {
    border-color: var(--color-accent);
    background-color: var(--color-accent-light);
    box-shadow: 0 0 0 2px var(--color-accent);
    animation: pulse-b-hbtwknv491 2s infinite;
}

/* Completed Workout Styling */
.workout-card.completed[b-hbtwknv491] {
    background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
    border-color: #86efac;
    position: relative;
}

.workout-card.completed[b-hbtwknv491]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #22c55e, #16a34a);
    border-radius: 8px 8px 0 0;
}

.workout-card.completed .workout-title[b-hbtwknv491] {
    color: #166534;
}

.workout-card.completed .exercise-name[b-hbtwknv491] {
    color: #166534;
}

.completion-badge[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 4px rgba(34, 197, 94, 0.3);
}

.completion-badge[b-hbtwknv491]  svg {
    width: 14px;
    height: 14px;
}

.completion-notes[b-hbtwknv491] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 8px 10px;
    margin-bottom: 8px;
    background-color: rgba(34, 197, 94, 0.1);
    border-radius: 6px;
    border-left: 3px solid #22c55e;
    font-size: 0.8rem;
    color: #166534;
    font-style: italic;
}

.completion-notes[b-hbtwknv491]  svg {
    flex-shrink: 0;
    margin-top: 2px;
    opacity: 0.7;
}

.completion-notes span[b-hbtwknv491] {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

@keyframes pulse-b-hbtwknv491 {
    0% { opacity: 1; }
    50% { opacity: 0.8; }
    100% { opacity: 1; }
}

.workout-header[b-hbtwknv491] {
    margin-bottom: 8px;
}

.workout-title-section[b-hbtwknv491] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.workout-title[b-hbtwknv491] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workout-duration[b-hbtwknv491] {
    font-size: 0.85rem;
    color: var(--color-neutral-medium);
    background-color: var(--color-secondary-light);
    padding: 2px 8px;
    border-radius: 12px;
}

.workout-content[b-hbtwknv491] {
    color: var(--color-neutral-dark);
}

.workout-notes[b-hbtwknv491] {
    font-size: 0.9rem;
    color: var(--color-neutral-medium);
    margin: 0 0 8px 0;
    font-style: italic;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.workout-exercises[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.exercise-item[b-hbtwknv491] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    background-color: var(--color-secondary-light);
    border-radius: 6px;
    font-size: 0.85rem;
    border-left: 3px solid transparent;
}

/* Exercise Purpose Color Coding */
.exercise-item.purpose-warmup[b-hbtwknv491] {
    border-left-color: var(--purpose-warmup);
}

.exercise-item.purpose-technique[b-hbtwknv491] {
    border-left-color: var(--purpose-technique);
}

.exercise-item.purpose-corelift[b-hbtwknv491] {
    border-left-color: var(--purpose-corelift);
}

.exercise-item.purpose-strength[b-hbtwknv491] {
    border-left-color: var(--purpose-strength);
}

.exercise-item.purpose-accessory[b-hbtwknv491] {
    border-left-color: var(--purpose-accessory);
}

.exercise-purpose[b-hbtwknv491] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 4px;
    margin-right: 6px;
    text-transform: uppercase;
    min-width: 16px;
    text-align: center;
}

.exercise-purpose.purpose-warmup[b-hbtwknv491] {
    background: var(--purpose-warmup-bg);
    color: var(--purpose-warmup-text);
}

.exercise-purpose.purpose-technique[b-hbtwknv491] {
    background: var(--purpose-technique-bg);
    color: var(--purpose-technique-text);
}

.exercise-purpose.purpose-corelift[b-hbtwknv491] {
    background: var(--purpose-corelift-bg);
    color: var(--purpose-corelift-text);
}

.exercise-purpose.purpose-strength[b-hbtwknv491] {
    background: var(--purpose-strength-bg);
    color: var(--purpose-strength-text);
}

.exercise-purpose.purpose-accessory[b-hbtwknv491] {
    background: var(--purpose-accessory-bg);
    color: var(--purpose-accessory-text);
}

.exercise-name[b-hbtwknv491] {
    font-weight: 500;
    color: var(--color-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sets-reps[b-hbtwknv491] {
    color: var(--color-neutral-medium);
    margin-left: 8px;
}

.weight[b-hbtwknv491] {
    color: var(--color-accent);
    font-weight: 500;
    margin-left: 8px;
}

.no-exercises[b-hbtwknv491] {
    font-size: 0.85rem;
    color: var(--color-neutral-medium);
    font-style: italic;
    margin: 0;
}

/* Empty State */
.empty-workout[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 28px 16px;
    text-align: center;
    border: 2px dashed var(--color-secondary);
    border-radius: 8px;
    background-color: var(--color-tertiary-light);
    color: var(--color-secondary);
    transition: all 0.3s ease;
}

.empty-icon[b-hbtwknv491] {
    font-size: 2rem;
    opacity: 0.6;
    margin-bottom: 10px;
    color: var(--color-secondary);
}

.empty-text[b-hbtwknv491] {
    font-size: 0.9rem;
    font-weight: 500;
    margin-bottom: 10px;
}

.empty-workout.swappable[b-hbtwknv491] {
    border-color: var(--color-accent);
    background-color: var(--color-accent-light);
    cursor: pointer;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.empty-workout.swappable:hover[b-hbtwknv491] {
    border-color: var(--color-accent);
    background-color: var(--color-warm-light);
    transform: translateY(-3px);
}

.add-workout-btn[b-hbtwknv491] {
    margin-top: 6px;
}

.swap-workout-btn[b-hbtwknv491] {
    margin-top: 6px;
    background-color: var(--color-accent);
    color: var(--color-neutral);
    border: none;
}

/* Success Indicator */
.success-indicator-card[b-hbtwknv491] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--color-accent-light), var(--color-primary-light));
    border-radius: 12px;
    padding: 16px;
}

.success-content[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.success-icon[b-hbtwknv491] {
    font-size: 3rem;
    color: var(--color-accent);
}

.success-message[b-hbtwknv491] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-neutral-dark);
}

/* Week Grid Responsive */
@media (max-width: 768px) {
    .week-grid[b-hbtwknv491] {
        grid-template-columns: 1fr;
    }
    
    .day-card[b-hbtwknv491] {
        min-height: auto;
        height: auto;
    }

    .workout-card[b-hbtwknv491] {
        height: auto;
        min-height: auto;
    }
}

/* =================================
   GENERATE WORKOUT DIALOG
   ================================= */

.generate-workout-content[b-hbtwknv491] {
    padding: 16px 0;
    overflow: hidden;
}

@media (max-width: 768px) {
    .generate-workout-content[b-hbtwknv491] {
        padding: 8px 0;
        max-height: 60vh;
        overflow-y: auto;
    }
    
    .day-type-grid[b-hbtwknv491] {
        grid-template-columns: 1fr;
        gap: 12px;
        max-width: 100%;
    }
    
    .day-type-tile[b-hbtwknv491] {
        padding: 12px;
    }

    [b-hbtwknv491] .fluent-dialog-body {
        max-height: 65vh;
        overflow-y: auto;
    }

    .week-template-grid[b-hbtwknv491] {
        grid-template-columns: 1fr;
    }

    .template-grid[b-hbtwknv491] {
        grid-template-columns: 1fr;
    }
}

.template-header[b-hbtwknv491] {
    text-align: center;
    margin-bottom: 24px;
}

.template-title[b-hbtwknv491] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 8px;
}

.template-title h3[b-hbtwknv491] {
    margin: 0;
    color: var(--color-primary);
    font-weight: 600;
}

.template-subtitle[b-hbtwknv491] {
    color: var(--color-neutral-medium);
    margin: 0;
    font-size: 0.9rem;
}

.template-grid[b-hbtwknv491] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.template-tile[b-hbtwknv491] {
    background: var(--color-secondary-light);
    border: 2px solid var(--color-neutral-light);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.template-tile:hover[b-hbtwknv491] {
    border-color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.template-tile-header[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.template-tile-icon[b-hbtwknv491] {
    color: var(--color-primary);
    font-size: 1.5rem;
}

.template-tile-name[b-hbtwknv491] {
    margin: 0;
    color: var(--color-primary);
    font-weight: 600;
    font-size: 1rem;
}

.template-tile-title[b-hbtwknv491] {
    flex: 1;
}

.template-duration[b-hbtwknv491] {
    font-size: 0.75rem;
    color: var(--color-neutral-medium);
    font-weight: normal;
}

.template-tile-description[b-hbtwknv491] {
    color: var(--color-neutral-medium);
    font-size: 0.85rem;
    margin: 0 0 12px 0;
    line-height: 1.4;
}

.template-tile-exercises[b-hbtwknv491] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.exercise-preview[b-hbtwknv491] {
    background: var(--color-primary-light);
    color: var(--color-primary);
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 500;
}

.exercise-count[b-hbtwknv491] {
    color: var(--color-neutral-medium);
    font-size: 0.75rem;
    font-style: italic;
}

/* =================================
   DAY TYPE SELECTION
   ================================= */

.week-planning-section[b-hbtwknv491] {
    margin-bottom: 1rem;
}

.week-planning-button[b-hbtwknv491] {
    width: 100%;
    padding: 1.25rem 1.5rem;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark, #1565c0) 100%);
    color: white !important;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1rem;
    box-shadow: 0 4px 12px rgba(var(--color-primary-rgb, 33, 150, 243), 0.3);
}

.week-planning-button:hover[b-hbtwknv491] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(var(--color-primary-rgb, 33, 150, 243), 0.4);
}

.week-planning-button .button-icon[b-hbtwknv491] {
    background: rgba(255, 255, 255, 0.2);
    padding: 0.75rem;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.week-planning-button .button-icon[b-hbtwknv491]  svg {
    fill: white;
    width: 24px;
    height: 24px;
}

.week-planning-button .button-content[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.week-planning-button .button-title[b-hbtwknv491] {
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
    margin-bottom: 0.25rem;
}

.week-planning-button .button-subtitle[b-hbtwknv491] {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.85);
}

.week-planning-button .button-arrow[b-hbtwknv491] {
    margin-left: auto;
    opacity: 0.7;
    transition: transform 0.3s ease;
}

.week-planning-button .button-arrow[b-hbtwknv491]  svg {
    fill: white;
    width: 20px;
    height: 20px;
}

.week-planning-button:hover .button-arrow[b-hbtwknv491] {
    transform: translateX(4px);
    opacity: 1;
}

.section-divider[b-hbtwknv491] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 1.5rem 0;
    color: var(--color-neutral-medium);
    font-size: 0.85rem;
}

.section-divider[b-hbtwknv491]::before,
.section-divider[b-hbtwknv491]::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid var(--color-neutral-light);
}

.section-divider span[b-hbtwknv491] {
    padding: 0 1rem;
}

.day-type-grid[b-hbtwknv491] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

.day-type-tile[b-hbtwknv491] {
    background: var(--color-secondary-light);
    border: 2px solid var(--color-neutral-light);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.day-type-tile:hover[b-hbtwknv491] {
    border-color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.day-type-tile-header[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.day-type-icon[b-hbtwknv491] {
    color: var(--color-primary);
    font-size: 2rem;
}

.day-type-tile h4[b-hbtwknv491] {
    margin: 0;
    color: var(--color-primary);
    font-weight: 600;
}

.day-type-description[b-hbtwknv491] {
    color: var(--color-neutral-medium);
    font-size: 0.8rem;
    margin: 0 0 8px 0;
    line-height: 1.3;
}

.template-count[b-hbtwknv491] {
    background: var(--color-primary-light);
    color: var(--color-primary);
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: 500;
}

/* =================================
   WEEK PLANNING
   ================================= */

.week-template-grid[b-hbtwknv491] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
}

.week-template-tile[b-hbtwknv491] {
    background: var(--color-secondary-light);
    border: 2px solid var(--color-neutral-light);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.week-template-tile:hover[b-hbtwknv491] {
    border-color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.week-template-header[b-hbtwknv491] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--color-neutral-light);
}

.week-template-header h4[b-hbtwknv491] {
    margin: 0;
    color: var(--color-primary);
    font-weight: 600;
    font-size: 0.95rem;
}

.day-count[b-hbtwknv491] {
    background: var(--color-primary);
    color: white;
    padding: 3px 8px;
    border-radius: 10px;
    font-size: 0.7rem;
    font-weight: 500;
}

.week-template-days[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.week-day-preview[b-hbtwknv491] {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 6px 10px;
    background: var(--color-neutral);
    border-radius: 6px;
}

.day-label[b-hbtwknv491] {
    font-weight: 600;
    color: var(--color-primary);
    min-width: 35px;
    font-size: 0.8rem;
}

.template-name[b-hbtwknv491] {
    color: var(--color-neutral-dark);
    font-size: 0.8rem;
}

/* =================================
   EXERCISE PHASES
   ================================= */

.exercise-phases[b-hbtwknv491] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--color-neutral-light);
}

.phase-item[b-hbtwknv491] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 0.75rem;
}

.phase-label[b-hbtwknv491] {
    font-weight: 600;
    min-width: 65px;
    font-size: 0.65rem;
    text-transform: uppercase;
}

.phase-exercise[b-hbtwknv491] {
    color: var(--color-neutral-dark);
    flex: 1;
}

.phase-item.warmup[b-hbtwknv491] {
    background: rgba(255, 193, 7, 0.15);
}

.phase-item.warmup .phase-label[b-hbtwknv491] {
    color: #d4a106;
}

.phase-item.technique[b-hbtwknv491] {
    background: rgba(33, 150, 243, 0.15);
}

.phase-item.technique .phase-label[b-hbtwknv491] {
    color: #1976d2;
}

.phase-item.core[b-hbtwknv491] {
    background: rgba(76, 175, 80, 0.15);
}

.phase-item.core .phase-label[b-hbtwknv491] {
    color: #388e3c;
}

.phase-item.strength[b-hbtwknv491] {
    background: rgba(156, 39, 176, 0.15);
}

.phase-item.strength .phase-label[b-hbtwknv491] {
    color: #7b1fa2;
}

.phase-item.accessory[b-hbtwknv491] {
    background: rgba(96, 125, 139, 0.15);
}

.phase-item.accessory .phase-label[b-hbtwknv491] {
    color: #546e7a;
}

/* =================================
   NO EXERCISES EDIT STATE
   ================================= */

.no-exercises-edit[b-hbtwknv491] {
    text-align: center;
    padding: 32px 24px;
    background-color: var(--color-tertiary-light);
    border-radius: 8px;
    margin: 16px 0;
    color: var(--color-neutral-medium);
}