/* /Components/AdminDataImportPanel.razor.rz.scp.css */
/* -- Header ------------------------------------------------------ */
.import-header[b-bayr4lycoi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    flex-wrap: wrap;
    gap: 10px;
}

.import-title[b-bayr4lycoi] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0;
}

.import-subtitle[b-bayr4lycoi] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

/* -- Section divider --------------------------------------------- */
.section-divider[b-bayr4lycoi] {
    border: none;
    border-top: 1px solid var(--border);
    margin: 32px 0;
}

/* -- Import section title ---------------------------------------- */
.import-section-title[b-bayr4lycoi] {
    font-size: 17px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0 0 8px;
}

/* -- Skeleton loading -------------------------------------------- */
.skeleton[b-bayr4lycoi] {
    border-radius: 4px;
    background: var(--border);
    animation: skeleton-pulse-b-bayr4lycoi 1.4s ease-in-out infinite;
}

.skeleton-label[b-bayr4lycoi] {
    width: 80px;
    height: 13px;
    margin-bottom: 8px;
}

.skeleton-value[b-bayr4lycoi] {
    width: 110px;
    height: 24px;
    border-radius: 6px;
}

.skeleton-section-heading[b-bayr4lycoi] {
    width: 180px;
    height: 18px;
    margin: 24px 0 12px;
    border-radius: 6px;
}

.skeleton-source-name[b-bayr4lycoi] {
    width: 120px;
    height: 16px;
    border-radius: 4px;
}

.skeleton-badge[b-bayr4lycoi] {
    width: 60px;
    height: 22px;
    border-radius: 999px;
}

.skeleton-stat-label[b-bayr4lycoi] {
    width: 56px;
    height: 11px;
}

.skeleton-stat-value[b-bayr4lycoi] {
    width: 80px;
    height: 14px;
    margin-top: 2px;
    border-radius: 4px;
}

.skeleton-cell[b-bayr4lycoi] {
    width: 70px;
    height: 14px;
    border-radius: 4px;
}

@keyframes skeleton-pulse-b-bayr4lycoi {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.error-banner[b-bayr4lycoi] {
    background: var(--dangerBg);
    color: var(--dangerText);
    border: 1px solid var(--danger);
    border-radius: var(--radiusMd);
    padding: 12px 16px;
    font-size: 14px;
    margin: 16px 0;
}

/* -- Stats ------------------------------------------------------- */
.admin-stats-row[b-bayr4lycoi] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 14px;
    margin-top: 16px;
    margin-bottom: 20px;
}

.metric-card[b-bayr4lycoi] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
}

.metric-label[b-bayr4lycoi] {
    font-size: 12px;
    color: var(--textMuted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.metric-value[b-bayr4lycoi] {
    font-size: 22px;
    font-weight: 600;
    font-family: var(--font-mono);
    color: var(--textPrimary);
}

/* -- Section headings -------------------------------------------- */
.section-heading[b-bayr4lycoi] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    margin: 24px 0 12px;
    color: var(--textPrimary);
}

/* -- Source cards ------------------------------------------------- */
.source-cards[b-bayr4lycoi] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 14px;
    margin-bottom: 24px;
}

.source-card[b-bayr4lycoi] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
}

.source-card-header[b-bayr4lycoi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.source-name[b-bayr4lycoi] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.source-card-body[b-bayr4lycoi] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.source-stat[b-bayr4lycoi] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.source-stat-label[b-bayr4lycoi] {
    font-size: 11px;
    color: var(--textMuted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.source-stat-value[b-bayr4lycoi] {
    font-size: 14px;
    font-weight: 500;
    font-family: var(--font-mono);
    color: var(--textPrimary);
}

.source-card-error[b-bayr4lycoi] {
    margin-top: 12px;
    padding: 10px 12px;
    background: var(--dangerBg);
    color: var(--dangerText);
    border-radius: var(--radiusSm);
    font-size: 13px;
    line-height: 1.5;
}

/* -- Badge variants ---------------------------------------------- */
.badge-ok[b-bayr4lycoi] { color: var(--successText); background: var(--successBg); }
.badge-warn[b-bayr4lycoi] { color: var(--warningText); background: var(--warningBg); }
.badge-danger[b-bayr4lycoi] { color: var(--dangerText); background: var(--dangerBg); }
.badge-muted[b-bayr4lycoi] { color: var(--textMuted); background: var(--surfaceAlt); }

/* -- Runs table -------------------------------------------------- */
.runs-table-card[b-bayr4lycoi] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.table-wrap[b-bayr4lycoi] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 960px) {
    .source-cards[b-bayr4lycoi] { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .admin-stats-row[b-bayr4lycoi] { grid-template-columns: repeat(2, 1fr); }
    .metric-card[b-bayr4lycoi] { padding: 16px; }
    .source-card[b-bayr4lycoi] { padding: 16px; }
    .source-card-body[b-bayr4lycoi] { grid-template-columns: 1fr 1fr; }
}
/* /Components/AdminRolesPanel.razor.rz.scp.css */
/* -- Header (outside card) --------------------------------------- */
.roles-header[b-mks3v7e624] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    flex-wrap: wrap;
    gap: 10px;
}

.roles-title[b-mks3v7e624] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0;
}

.roles-subtitle[b-mks3v7e624] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

/* -- Table card -------------------------------------------------- */
.roles-table-card[b-mks3v7e624] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    margin-top: 16px;
    overflow: hidden;
}

/* -- Name column ------------------------------------------------- */
.role-name[b-mks3v7e624] {
    font-size: 14px;
    font-weight: 500;
}

/* -- Description column ------------------------------------------ */
.role-desc[b-mks3v7e624] {
    font-size: 13px;
    color: var(--textSecondary);
}

/* -- User count (monospace) -------------------------------------- */
.mono-count[b-mks3v7e624] {
    font-size: 14px;
    font-family: var(--font-mono);
    font-weight: 600;
}

/* -- Action column ----------------------------------------------- */
.role-action[b-mks3v7e624] {
    display: flex;
    justify-content: flex-end;
}

/* -- Badge variants ---------------------------------------------- */
.badge-ok[b-mks3v7e624] {
    color: var(--successText);
    background: var(--successBg);
}

.badge-muted[b-mks3v7e624] {
    color: var(--textMuted);
    background: var(--surfaceAlt);
}

/* -- Drawer (modal dialog) --------------------------------------- */
.drawer-backdrop[b-mks3v7e624] {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    padding: 16px;
}

.drawer-panel[b-mks3v7e624] {
    background: var(--surface);
    width: 100%;
    max-width: 480px;
    max-height: 85vh;
    border-radius: 16px;
    overflow: auto;
    box-shadow: var(--shadowLg);
    border: 1px solid var(--border);
}

.drawer-header[b-mks3v7e624] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
}

.drawer-title[b-mks3v7e624] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.drawer-close[b-mks3v7e624] {
    cursor: pointer;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surfaceAlt);
    border: none;
    color: var(--textSecondary);
    padding: 0;
}

.drawer-close:hover[b-mks3v7e624] {
    color: var(--textPrimary);
}

.drawer-body[b-mks3v7e624] {
    padding: 20px;
}

.drawer-field[b-mks3v7e624] {
    margin-bottom: 14px;
    width: 100%;
}

.drawer-label[b-mks3v7e624] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    margin-bottom: 5px;
    font-family: var(--font-heading);
}

.drawer-submit[b-mks3v7e624] {
    width: 100%;
    margin-top: 4px;
}

/* -- Mobile drawer ----------------------------------------------- */
@media (max-width: 600px) {
    .drawer-backdrop[b-mks3v7e624] {
        align-items: flex-end;
        padding: 0;
    }

    .drawer-panel[b-mks3v7e624] {
        max-width: 100%;
        border-radius: 20px 20px 0 0;
    }
}
/* /Components/AdminUserDetailPanel.razor.rz.scp.css */
/* -- Back link --------------------------------------------------- */
.back-link[b-s94j3eolqt] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    cursor: pointer;
    color: var(--textMuted);
}

.back-link span[b-s94j3eolqt] {
    font-size: 13px;
    font-weight: 500;
}

/* -- Two-column grid --------------------------------------------- */
.detail-grid[b-s94j3eolqt] {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 14px;
    margin-bottom: 20px;
}

/* -- Cards ------------------------------------------------------- */
.detail-card[b-s94j3eolqt] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
}

.detail-card-title[b-s94j3eolqt] {
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin-bottom: 16px;
}

/* -- Account overview rows --------------------------------------- */
.account-row[b-s94j3eolqt] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

.account-row:last-child[b-s94j3eolqt] {
    border-bottom: none;
}

.account-label[b-s94j3eolqt] {
    font-size: 14px;
    color: var(--textSecondary);
}

.account-value[b-s94j3eolqt] {
    font-size: 14px;
    font-weight: 500;
}

/* -- Security actions -------------------------------------------- */
.action-grid[b-s94j3eolqt] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.action-btn[b-s94j3eolqt] {
    width: 100%;
}

/* -- Audit trail card (title inside) ----------------------------- */
.audit-card[b-s94j3eolqt] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.audit-card-title[b-s94j3eolqt] {
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-heading);
    padding: 20px 20px 14px;
}

/* -- Audit table overrides --------------------------------------- */
[b-s94j3eolqt] .audit-card .app-table th {
    padding: 10px 20px;
    border-radius: 0;
}

[b-s94j3eolqt] .audit-card .app-table td {
    padding: 12px 20px;
    font-weight: 400;
}

/* -- Audit cell styles ------------------------------------------- */
.audit-time[b-s94j3eolqt] {
    font-size: 13px;
    font-weight: 400;
    color: var(--textSecondary);
}

.audit-muted[b-s94j3eolqt] {
    font-size: 13px;
    font-weight: 400;
    color: var(--textMuted);
}

/* -- Badge variants ---------------------------------------------- */
.badge-ok[b-s94j3eolqt] {
    color: var(--successText);
    background: var(--successBg);
}

.badge-register[b-s94j3eolqt] {
    color: var(--primaryDark);
    background: var(--surfaceAlt);
}

.badge-action[b-s94j3eolqt] {
    color: var(--textSecondary);
    background: var(--surfaceAlt);
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 960px) {
    .detail-grid[b-s94j3eolqt] {
        grid-template-columns: 1fr;
    }
}
/* /Components/AdminUsersPanel.razor.rz.scp.css */
/* -- Header ------------------------------------------------------ */
.users-header[b-6ohq72indp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    flex-wrap: wrap;
    gap: 10px;
}

.users-title[b-6ohq72indp] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0;
}

.users-subtitle[b-6ohq72indp] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

.users-toolbar[b-6ohq72indp] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* -- Search ------------------------------------------------------ */
.search-wrap[b-6ohq72indp] {
    position: relative;
    display: flex;
    align-items: center;
}

.search-icon[b-6ohq72indp] {
    position: absolute;
    left: 12px;
    color: var(--textMuted);
    pointer-events: none;
}

.search-input[b-6ohq72indp] {
    padding-left: 36px;
    width: 260px;
}

/* -- Stats ------------------------------------------------------- */
.admin-stats-row[b-6ohq72indp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 16px;
    margin-bottom: 20px;
}

.metric-card[b-6ohq72indp] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
}

[b-6ohq72indp] .metric-value {
    font-weight: 600;
}

/* -- Table card -------------------------------------------------- */
.users-table-card[b-6ohq72indp] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

/* -- Row actions ------------------------------------------------- */
.user-actions[b-6ohq72indp] {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

/* -- Badge variants ---------------------------------------------- */
.badge-role[b-6ohq72indp] { color: var(--primaryDark); background: var(--surfaceAlt); }
.badge-ok[b-6ohq72indp] { color: var(--successText); background: var(--successBg); }
.badge-warn[b-6ohq72indp] { color: var(--warningText); background: var(--warningBg); }
.badge-danger[b-6ohq72indp] { color: var(--dangerText); background: var(--dangerBg); }

@media (max-width: 960px) {
    .admin-stats-row[b-6ohq72indp] { grid-template-columns: repeat(2, 1fr); }
    .search-input[b-6ohq72indp] { width: 200px; }
}

@media (max-width: 600px) {
    .admin-stats-row[b-6ohq72indp] { grid-template-columns: repeat(2, 1fr); }
    .metric-card[b-6ohq72indp] { padding: 16px; }
    .search-input[b-6ohq72indp] { width: 100%; }
    .users-toolbar[b-6ohq72indp] { width: 100%; flex-wrap: wrap; }
}
/* /Components/Button.razor.rz.scp.css */
/* =========================================================
   BASE BUTTON
========================================================= */

.btn[b-p8gg4917ta] {
    /* ----- Core Variables ----- */
    --btn-color: var(--primary);
    --btn-text-color: var(--primaryFg);
    --btn-border-radius: 10px;
    --btn-transition: 0.15s ease-in-out;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;

    border-radius: var(--btn-border-radius);
    border: 1.5px solid transparent;

    font-weight: 600;
    font-family: var(--font-heading);
    line-height: 1;
    cursor: pointer;
    user-select: none;

    transition: background-color var(--btn-transition),
    color var(--btn-transition),
    border-color var(--btn-transition),
    transform 0.05s ease,
    opacity var(--btn-transition);

    width: auto;
}

.btn:active[b-p8gg4917ta] {
    transform: translateY(1px);
}

/* =========================================================
   SIZES
========================================================= */

.btn--small[b-p8gg4917ta] {
    height: 34px;
    padding: 0 14px;
    font-size: 12px;
}

.btn--medium[b-p8gg4917ta] {
    height: 42px;
    padding: 0 20px;
    font-size: 13px;
}

.btn--large[b-p8gg4917ta] {
    height: 48px;
    padding: 0 20px;
    font-size: 13px;
}

/* =========================================================
   COLOR DEFINITIONS
========================================================= */

/* PRIMARY */
.btn--primary[b-p8gg4917ta] {
    --btn-color: var(--primary);
    --btn-text-color: var(--primaryFg);
}

/* SECONDARY */
.btn--secondary[b-p8gg4917ta] {
    --btn-color: var(--textSecondary);
    --btn-text-color: var(--surface);
}

/* SUCCESS */
.btn--success[b-p8gg4917ta] {
    --btn-color: var(--success);
    --btn-text-color: var(--surface);
}

/* WARNING */
.btn--warning[b-p8gg4917ta] {
    --btn-color: var(--warning);
    --btn-text-color: var(--surface);
}

/* DANGER */
.btn--danger[b-p8gg4917ta] {
    --btn-color: var(--danger);
    --btn-text-color: var(--surface);
}

/* INFO */
.btn--info[b-p8gg4917ta] {
    --btn-color: var(--info);
    --btn-text-color: var(--surface);
}

/* LIGHT */
.btn--light[b-p8gg4917ta] {
    --btn-color: var(--surfaceAlt);
    --btn-text-color: var(--textPrimary);
}

/* DARK */
.btn--dark[b-p8gg4917ta] {
    --btn-color: var(--textPrimary);
    --btn-text-color: var(--bg);
}

/* =========================================================
   SOLID STYLE
========================================================= */

.btn--solid[b-p8gg4917ta] {
    background-color: var(--btn-color);
    border-color: var(--btn-color);
    color: var(--btn-text-color);
}

/* =========================================================
   OUTLINE STYLE
========================================================= */

.btn--outline[b-p8gg4917ta] {
    background-color: transparent;
    border-color: var(--btn-color);
    color: var(--btn-color);
}

/* =========================================================
   HOVER BEHAVIOR
========================================================= */

/* Hover fills with button color */
.btn--hoverfill:not(:disabled):hover[b-p8gg4917ta] {
    background-color: var(--btn-color);
    border-color: var(--btn-color);
    color: var(--btn-text-color);
}

/* Hover disabled */
.btn--hovernone:not(:disabled):hover[b-p8gg4917ta] {
    background-color: inherit;
    border-color: inherit;
    color: inherit;
}

/* =========================================================
   DISABLED
========================================================= */

.btn--disabled[b-p8gg4917ta],
.btn:disabled[b-p8gg4917ta] {
    opacity: .55;
    cursor: not-allowed;
    pointer-events: none;
}

/* =========================================================
   ICON STYLING (Google Material Symbols)
========================================================= */

.btn__icon[b-p8gg4917ta] {
    font-size: 1.2em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn__icon--left[b-p8gg4917ta] {
    margin-right: .25rem;
}

.btn__icon--right[b-p8gg4917ta] {
    margin-left: .25rem;
}

/* =========================================================
   TEXT
========================================================= */

.btn__text[b-p8gg4917ta] {
    display: inline-flex;
    align-items: center;
}
/* /Components/ChangePasswordDialog.razor.rz.scp.css */
/* ================================
   Drawer backdrop
================================ */

.drawer-backdrop[b-l61ere0w9e] {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    padding: 16px;
}

/* ================================
   Drawer dialog
================================ */

.drawer-dialog[b-l61ere0w9e] {
    background: var(--surface);
    width: 100%;
    max-width: 480px;
    max-height: 85vh;
    border-radius: 16px;
    overflow: auto;
    box-shadow: var(--shadowLg);
    border: 1px solid var(--border);
}

/* ================================
   Drawer header
================================ */

.drawer-header[b-l61ere0w9e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
}

.drawer-title[b-l61ere0w9e] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.drawer-close[b-l61ere0w9e] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: var(--surfaceAlt);
    color: var(--textSecondary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease;
}

.drawer-close:hover[b-l61ere0w9e] {
    background: var(--border);
}

.drawer-close .material-symbols-outlined[b-l61ere0w9e] {
    font-size: 16px;
}

/* ================================
   Drawer body
================================ */

.drawer-body[b-l61ere0w9e] {
    padding: 20px;
}

/* ================================
   Password fields
================================ */

.pwd-field[b-l61ere0w9e] {
    margin-bottom: 14px;
}

.pwd-label[b-l61ere0w9e] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    margin-bottom: 5px;
    font-family: var(--font-heading);
}

.pwd-input-wrap[b-l61ere0w9e] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--inputBg);
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    padding: 0 12px;
    height: 42px;
    transition: all 0.2s ease;
}

.pwd-input-wrap:focus-within[b-l61ere0w9e] {
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.pwd-input-wrap.wrap-valid[b-l61ere0w9e] {
    border-color: var(--primary);
}

.pwd-input-wrap.wrap-valid:focus-within[b-l61ere0w9e] {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}

.pwd-input-wrap.wrap-invalid[b-l61ere0w9e] {
    border-color: var(--danger);
}

.pwd-input-wrap.wrap-invalid:focus-within[b-l61ere0w9e] {
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

.pwd-input-icon[b-l61ere0w9e] {
    font-size: 16px;
    color: var(--textMuted);
    flex-shrink: 0;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20;
}

.pwd-input[b-l61ere0w9e] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 14px;
    color: var(--textPrimary);
    font-family: var(--font-body);
    height: 100%;
    width: 100%;
}

.pwd-input[b-l61ere0w9e]::placeholder {
    color: var(--textMuted);
}

/* ================================
   Eye toggle button
================================ */

.pwd-eye-btn[b-l61ere0w9e] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    transition: color 0.15s ease;
}

.pwd-eye-btn:hover[b-l61ere0w9e] {
    color: var(--textPrimary);
}

.pwd-eye-btn .material-symbols-outlined[b-l61ere0w9e] {
    font-size: 16px;
}

/* ================================
   Validation
================================ */

.pwd-valid-icon[b-l61ere0w9e] {
    font-size: 18px;
    color: var(--primary);
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.pwd-error-text[b-l61ere0w9e] {
    color: var(--danger);
    font-size: 13px;
    font-weight: 500;
    margin: 0;
}

.pwd-rules[b-l61ere0w9e] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pwd-rules li[b-l61ere0w9e] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--textMuted);
}

.pwd-rules li[b-l61ere0w9e]::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--textMuted);
    flex-shrink: 0;
}

.pwd-rule--fail[b-l61ere0w9e] {
    color: var(--danger);
}

.pwd-rule--fail[b-l61ere0w9e]::before {
    background: var(--danger);
}

.pwd-rule--pass[b-l61ere0w9e] {
    color: var(--textMuted);
}

/* ================================
   GcBtn styles
================================ */

.gc-btn[b-l61ere0w9e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s ease;
    border: 1.5px solid transparent;
    white-space: nowrap;
}

.gc-btn:disabled[b-l61ere0w9e] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gc-btn-primary[b-l61ere0w9e] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

.gc-btn-primary:hover:not(:disabled)[b-l61ere0w9e] {
    background: var(--primaryDark);
    border-color: var(--primaryDark);
}

.gc-btn-full[b-l61ere0w9e] {
    width: 100%;
}

/* ================================
   Mobile responsive
================================ */

@media (max-width: 700px) {
    .drawer-dialog[b-l61ere0w9e] {
        max-width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
        align-self: flex-end;
    }

    .drawer-backdrop[b-l61ere0w9e] {
        align-items: flex-end;
        padding: 0;
    }
}
/* /Components/HamburgerButton.razor.rz.scp.css */
/* Hidden on desktop (>= 1024px), shown below */
.topbar-hamburger[b-17t5uqxwgb] {
    display: none;
    place-items: center;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: var(--textPrimary);
}

.topbar-hamburger .material-symbols-outlined[b-17t5uqxwgb] {
    font-size: 22px;
}

@media (max-width: 1023px) {
    .topbar-hamburger[b-17t5uqxwgb] {
        display: grid;
    }
}
/* /Components/Input.razor.rz.scp.css */
/* ================================
   Root Variables
================================ */

.in-field[b-dkzjaswx1x] {
    --in-width: 100%;
    --in-height: 44px;

    --in-bg: var(--inputBg);
    --in-text: var(--textPrimary);
    --in-muted: var(--textMuted);

    --in-outline: var(--inputBorder);
    --in-accent: var(--inputFocus);
    --in-error: var(--danger);

    --in-radius: 10px;
    --in-pad-x: 14px;
    --in-icon-gap: 10px;
    --in-border: var(--in-outline);

    --in-shadow-rest: 0 1px 2px rgba(0, 0, 0, 0.04);
    --in-shadow-hover: 0 2px 6px rgba(0, 0, 0, 0.06);
    --in-shadow-focus: 0 4px 12px rgba(0, 0, 0, 0.08);

    width: var(--in-width);
    color: var(--in-text);
    font-family: var(--font-body);
    margin-bottom: 14px;
}

/* ================================
   Label
================================ */

.in-label[b-dkzjaswx1x] {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    cursor: pointer;
    font-family: var(--font-heading);
}

/* ================================
   Control (Surface)
================================ */

.in-control[b-dkzjaswx1x] {
    display: flex;
    align-items: center;
    height: var(--in-height);
    background-color: var(--in-bg);

    border: 1.5px solid var(--in-outline);
    border-radius: var(--in-radius);
    box-shadow: none;

    transition: border-color 160ms ease,
    box-shadow 160ms ease,
    transform 120ms ease,
    background 160ms ease;
}

/* Hover Elevation */
.in-control:hover[b-dkzjaswx1x] {
    border-color: var(--in-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-accent) 13%, transparent);
}

/* Focus Elevation */
.in-control:focus-within[b-dkzjaswx1x] {
    border-color: var(--in-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-accent) 13%, transparent);
}

.in-control.invalid[b-dkzjaswx1x] {
    border-color: var(--in-error);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-error) 13%, transparent);
}

.in-control.invalid:focus-within[b-dkzjaswx1x] {
    border-color: var(--in-error);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-error) 13%, transparent);
}

.in-input[b-dkzjaswx1x]::placeholder {
    color: color-mix(in srgb, var(--in-muted) 75%, transparent);
}

/* ================================
   Icons
================================ */

.in-icon[b-dkzjaswx1x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    background: none;

    font-size: 18px;
    color: var(--in-muted);
    transition: color 120ms ease;
}

.in-control:focus-within .in-icon[b-dkzjaswx1x] {
    color: var(--in-accent);
}

.in-icon-left[b-dkzjaswx1x] {
    padding-left: var(--in-pad-x);
    padding-right: var(--in-icon-gap);
}

.in-icon-right[b-dkzjaswx1x] {
    padding-right: var(--in-pad-x);
    padding-left: var(--in-icon-gap);
}

.in-input.in-has-left[b-dkzjaswx1x] {
    padding-left: 0;
}

.in-input.in-has-right[b-dkzjaswx1x] {
    padding-right: 0;
}

.in-icon.invalid[b-dkzjaswx1x] {
    color: var(--in-error);
    font-variation-settings: 'FILL' 1;
}

/*!* ================================*/
/*   Disabled*/
/*================================ *!*/

.in-disabled .in-control[b-dkzjaswx1x] {
    background: var(--surfaceAlt);
    border-color: var(--border);
    box-shadow: none;
    cursor: not-allowed;
}

.in-disabled .in-input[b-dkzjaswx1x] {
    cursor: not-allowed;
}

/*!* ================================*/
/*   ReadOnly*/
/*================================ *!*/

.in-readonly .in-control[b-dkzjaswx1x] {
    background: var(--surfaceAlt);
}

/* ✅ Blazor validation class */
.in-input.input-validation-error[b-dkzjaswx1x] {
    border-color: var(--in-error);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-error) 18%, transparent);
}

/* ================================
   Validation Text
================================ */

.in-helper[b-dkzjaswx1x] {
    margin-top: 6px;
    font-size: 0.85rem;
    color: var(--in-error);
}

/* ================================
   Native datetime polish
================================ */

.in-input[b-dkzjaswx1x]::-webkit-calendar-picker-indicator {
    opacity: 0.75;
    cursor: pointer;
}

/* Outline mode */
.in-input.is-outline[b-dkzjaswx1x] {
    border-color: var(--in-accent);
}

/*!* Disabled *!*/
.in-input.is-disabled[b-dkzjaswx1x] {
    opacity: .65;
    cursor: not-allowed;
}

/* Checkbox / Toggle switch */
.in-checkbox[b-dkzjaswx1x] {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.in-checkbox .in-label[b-dkzjaswx1x] {
    order: 2;
    margin-bottom: 0;
    font-size: 13px;
    font-weight: 400;
    color: var(--textPrimary);
    cursor: pointer;
}

/* Hide native checkbox, show toggle track */
[b-dkzjaswx1x] .in-input-checkbox {
    appearance: none;
    -webkit-appearance: none;
    width: 44px;
    min-width: 44px;
    height: 24px;
    border-radius: 12px;
    background: var(--border);
    position: relative;
    cursor: pointer;
    transition: background 0.2s ease;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

[b-dkzjaswx1x] .in-input-checkbox:checked {
    background: var(--primary);
}

/* Toggle knob */
[b-dkzjaswx1x] .in-input-checkbox::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s ease;
}

[b-dkzjaswx1x] .in-input-checkbox:checked::after {
    transform: translateX(20px);
}

/* Password show/hide toggle */
.in-eye-btn[b-dkzjaswx1x] {
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0;
    padding-right: var(--in-pad-x);
    padding-left: var(--in-icon-gap);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--in-muted);
    flex-shrink: 0;
    min-width: 44px;
    min-height: 44px;
    border-radius: 0 var(--in-radius) var(--in-radius) 0;
    transition: color 120ms ease;
}

.in-eye-btn .material-symbols-outlined[b-dkzjaswx1x] {
    font-size: 18px;
}

.in-eye-btn:hover[b-dkzjaswx1x] {
    color: var(--in-accent);
}

.in-control:focus-within .in-eye-btn[b-dkzjaswx1x] {
    color: var(--in-accent);
}
/* /Components/JobsPanel.razor.rz.scp.css */
/* -- Header (outside card) --------------------------------------- */
.jobs-header[b-swfdj4clmi] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
    flex-wrap: wrap;
    gap: 10px;
}

.jobs-title[b-swfdj4clmi] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0;
}

.jobs-subtitle[b-swfdj4clmi] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

/* -- Table card -------------------------------------------------- */
.jobs-table-card[b-swfdj4clmi] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    margin-top: 16px;
    overflow: hidden;
}

/* -- Job name ---------------------------------------------------- */
.job-name[b-swfdj4clmi] {
    font-size: 14px;
    font-weight: 500;
}

/* -- Cron (monospace) -------------------------------------------- */
.mono-cron[b-swfdj4clmi] {
    font-size: 13px;
    font-family: var(--font-mono);
    color: var(--textSecondary);
}

/* -- Next run ---------------------------------------------------- */
.text-secondary[b-swfdj4clmi] {
    font-size: 13px;
    color: var(--textSecondary);
}

/* -- Row actions ------------------------------------------------- */
.job-actions[b-swfdj4clmi] {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

/* -- Badge variants ---------------------------------------------- */
.badge-ok[b-swfdj4clmi] {
    color: var(--successText);
    background: var(--successBg);
}

.badge-warn[b-swfdj4clmi] {
    color: var(--warningText);
    background: var(--warningBg);
}

.badge-danger[b-swfdj4clmi] {
    color: var(--dangerText);
    background: var(--dangerBg);
}

.badge-muted[b-swfdj4clmi] {
    color: var(--textMuted);
    background: var(--surfaceAlt);
}
/* /Components/NavMenu.razor.rz.scp.css */
.nav-menu[b-nabyfrwoch] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nav-menu a[b-nabyfrwoch] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 10px;
    color: var(--textSecondary);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    min-height: 44px;
    transition: background 150ms ease, color 150ms ease;
}

.nav-menu a:hover[b-nabyfrwoch] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.nav-menu a.active[b-nabyfrwoch] {
    background: var(--primarySubtle);
    color: var(--primary);
    font-weight: 600;
}

.nav-icon[b-nabyfrwoch] {
    font-size: 20px;
    flex-shrink: 0;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
    transition: font-variation-settings 150ms ease;
}

.nav-menu a.active .nav-icon[b-nabyfrwoch] {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.nav-label[b-nabyfrwoch] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nav-section-label[b-nabyfrwoch] {
    margin-top: 20px;
    margin-bottom: 4px;
    padding: 0 10px;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--textMuted);
}
/* /Components/OAuthProvidersPanel.razor.rz.scp.css */
/* -- Page header ------------------------------------------------- */
.page-header[b-zhkd1tdbaf] {
    margin-bottom: 20px;
}

.page-header h1[b-zhkd1tdbaf] {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    color: var(--textPrimary);
    font-family: var(--font-heading);
}

.page-subtitle[b-zhkd1tdbaf] {
    font-size: 13px;
    color: var(--textMuted);
    margin-top: 2px;
}

/* -- Grid override ----------------------------------------------- */
.oauth-grid[b-zhkd1tdbaf] {
    gap: 14px;
}

/* -- Provider card internals ------------------------------------- */
.provider-header[b-zhkd1tdbaf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.provider-name[b-zhkd1tdbaf] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    margin: 0;
    color: var(--textPrimary);
}

/* -- Toggle (matches GcToggle: 44x24, thumb 20x20) -------------- */
.toggle-row[b-zhkd1tdbaf] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.toggle-track[b-zhkd1tdbaf] {
    position: relative;
    width: 44px;
    height: 24px;
    border-radius: 12px;
    background: var(--border);
    border: none;
    padding: 2px;
    cursor: pointer;
    transition: background 200ms ease;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.toggle-track.toggle-on[b-zhkd1tdbaf] {
    background: var(--primary);
}

.toggle-thumb[b-zhkd1tdbaf] {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: transform 200ms ease;
    transform: translateX(0);
}

.toggle-track.toggle-on .toggle-thumb[b-zhkd1tdbaf] {
    transform: translateX(20px);
}

.toggle-label[b-zhkd1tdbaf] {
    font-size: 13px;
    color: var(--textPrimary);
    user-select: none;
}

/* -- Fields (matches GcInput spacing) ---------------------------- */
.provider-fields[b-zhkd1tdbaf] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.field-group[b-zhkd1tdbaf] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.field-label[b-zhkd1tdbaf] {
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    font-family: var(--font-heading);
}

/* -- Secret input with reveal ------------------------------------ */
.secret-input-wrap[b-zhkd1tdbaf] {
    position: relative;
    display: flex;
    align-items: center;
}

.secret-input[b-zhkd1tdbaf] {
    width: 100%;
    padding-right: 40px;
}

.reveal-btn[b-zhkd1tdbaf] {
    position: absolute;
    right: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-height: 44px;
    min-width: 44px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    border-radius: var(--radiusSm);
    transition: color 150ms ease;
}

.reveal-btn:hover[b-zhkd1tdbaf] {
    color: var(--textPrimary);
}

/* -- Action buttons ---------------------------------------------- */
.provider-actions[b-zhkd1tdbaf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 600px) {
    .provider-header[b-zhkd1tdbaf] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}
/* /Components/RolePermissionsEditor.razor.rz.scp.css */
/* -- Back link --------------------------------------------------- */
.back-link[b-62wmkg1r7t] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    cursor: pointer;
    color: var(--textMuted);
}

.back-link span[b-62wmkg1r7t] {
    font-size: 13px;
    font-weight: 500;
}

/* -- Header ------------------------------------------------------ */
.perm-header[b-62wmkg1r7t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 10px;
}

.perm-title[b-62wmkg1r7t] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0;
}

.perm-subtitle[b-62wmkg1r7t] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

/* -- Grid override ----------------------------------------------- */
.perm-grid[b-62wmkg1r7t] {
    gap: 14px;
}

/* -- Group title ------------------------------------------------- */
.perm-group-title[b-62wmkg1r7t] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    margin-bottom: 12px;
}

/* -- Permission row ---------------------------------------------- */
.perm-row[b-62wmkg1r7t] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
}

.perm-row:last-child[b-62wmkg1r7t] {
    border-bottom: none;
}

/* -- Custom checkbox --------------------------------------------- */
.perm-checkbox[b-62wmkg1r7t] {
    width: 18px;
    height: 18px;
    border-radius: 4px;
    border: 1.5px solid var(--border);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.perm-checkbox.perm-checked[b-62wmkg1r7t] {
    border-color: var(--primary);
    background: var(--primary);
}

/* -- Permission label -------------------------------------------- */
.perm-label[b-62wmkg1r7t] {
    font-size: 13px;
    color: var(--textPrimary);
}
/* /Components/Shared/AddExerciseDialog.razor.rz.scp.css */
/* Backdrop */
.ae-backdrop[b-wl6tvj0s87] {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 16px 24px;
    overflow-y: auto;
}

/* Dialog card */
.ae-dialog[b-wl6tvj0s87] {
    width: 100%;
    max-width: 480px;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
}

/* Header */
.ae-header[b-wl6tvj0s87] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.ae-title[b-wl6tvj0s87] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.ae-close-btn[b-wl6tvj0s87] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    border-radius: var(--radiusSm);
    transition: background 150ms ease, color 150ms ease;
}

.ae-close-btn:hover[b-wl6tvj0s87] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

/* Body */
.ae-body[b-wl6tvj0s87] {
    padding: 20px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Field wrapper */
.ae-field[b-wl6tvj0s87] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ae-row[b-wl6tvj0s87] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.ae-field-half[b-wl6tvj0s87] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Labels */
.ae-label[b-wl6tvj0s87] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--textPrimary);
    margin: 0;
}

.ae-label-optional[b-wl6tvj0s87] {
    font-weight: 400;
    color: var(--textMuted);
    font-size: 0.8rem;
}

/* Chips */
.ae-context-box[b-wl6tvj0s87] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px;
    background: var(--primarySubtle);
    border-radius: var(--radiusSm);
}

.ae-chip[b-wl6tvj0s87] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: var(--radiusSm);
    border: none;
    background: var(--mainBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    min-height: 32px;
    transition: background 150ms ease, color 150ms ease;
}

.ae-chip:hover[b-wl6tvj0s87] {
    color: var(--textPrimary);
}

.ae-chip-active[b-wl6tvj0s87] {
    background: var(--primary);
    color: var(--textPrimary);
    font-weight: 600;
}

.ae-chip-check[b-wl6tvj0s87] {
    font-size: 15px;
}

.ae-chip-sm[b-wl6tvj0s87] {
    padding: 4px 10px;
    font-size: 12px;
}

.ae-intensity-chips[b-wl6tvj0s87] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

/* Number input with unit */
.ae-number-wrap[b-wl6tvj0s87] {
    position: relative;
    display: flex;
    align-items: center;
}

.ae-number-input[b-wl6tvj0s87] {
    padding-right: 46px !important;
}

.ae-number-unit[b-wl6tvj0s87] {
    position: absolute;
    right: 12px;
    font-size: 13px;
    color: var(--textMuted);
    pointer-events: none;
    font-weight: 500;
}

/* Error */
.ae-error-text[b-wl6tvj0s87] {
    font-size: 0.8rem;
    color: var(--danger);
    margin: 0;
}

/* Quick-pick pills */
.ae-quickpick-wrap[b-wl6tvj0s87] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ae-quickpick-pill[b-wl6tvj0s87] {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    min-height: 32px;
}

.ae-quickpick-pill:hover[b-wl6tvj0s87] {
    background: var(--primarySubtle);
    border-color: var(--primary);
    color: var(--textPrimary);
}

/* Tags */
.ae-tags-list[b-wl6tvj0s87] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 6px;
}

.ae-tag-pill[b-wl6tvj0s87] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px 3px 10px;
    border-radius: 999px;
    background: var(--primarySubtle);
    color: var(--textPrimary);
    font-size: 12px;
    font-weight: 500;
}

.ae-tag-remove[b-wl6tvj0s87] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    padding: 0;
    border-radius: 50%;
    transition: background 150ms ease, color 150ms ease;
}

.ae-tag-remove .material-symbols-outlined[b-wl6tvj0s87] {
    font-size: 14px;
}

.ae-tag-remove:hover[b-wl6tvj0s87] {
    background: var(--border);
    color: var(--textPrimary);
}

.ae-tag-input-wrap[b-wl6tvj0s87] {
    position: relative;
}

.ae-tag-suggestions[b-wl6tvj0s87] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 10;
    overflow: hidden;
}

.ae-tag-suggestion[b-wl6tvj0s87] {
    display: block;
    width: 100%;
    padding: 8px 12px;
    text-align: left;
    background: transparent;
    border: none;
    font-size: 13px;
    color: var(--textPrimary);
    cursor: pointer;
    transition: background 100ms ease;
}

.ae-tag-suggestion:hover[b-wl6tvj0s87] {
    background: var(--primarySubtle);
}

/* Responsive */
@media (max-width: 480px) {
    .ae-backdrop[b-wl6tvj0s87] {
        padding: 0;
        align-items: flex-end;
    }

    .ae-dialog[b-wl6tvj0s87] {
        max-width: 100%;
        border-radius: var(--radiusXl) var(--radiusXl) 0 0;
        max-height: 92dvh;
    }

    .ae-row[b-wl6tvj0s87] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/AddMealDialog.razor.rz.scp.css */
/* ── Drawer backdrop ── */
.drawer-backdrop[b-ws7lwltd0z] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: 16px;
}

/* ── Drawer dialog ── */
.drawer-dialog[b-ws7lwltd0z] {
    background: var(--surface);
    width: 100%;
    max-width: 520px;
    max-height: 85vh;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadowLg);
    border: 1px solid var(--border);
    display: flex;
    flex-direction: column;
}

/* ── Mobile handle bar (hidden on desktop) ── */
.drawer-handle-bar[b-ws7lwltd0z] {
    display: none;
}

/* ── Header ── */
.drawer-header[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.drawer-title[b-ws7lwltd0z] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.drawer-close[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border: none;
    border-radius: 8px;
    background: var(--surfaceAlt);
    color: var(--textSecondary);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.drawer-close:hover[b-ws7lwltd0z] {
    background: var(--border);
    color: var(--textPrimary);
}

.drawer-close .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 16px;
}

/* ── Body ── */
.drawer-body[b-ws7lwltd0z] {
    padding: 20px;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ── Field ── */
.am-field[b-ws7lwltd0z] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.am-label[b-ws7lwltd0z] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textSecondary);
    margin: 0;
}

.am-label-optional[b-ws7lwltd0z] {
    font-size: 12px;
    font-weight: 400;
    color: var(--textMuted);
}

.am-hint[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
    margin: -4px 0 0;
}

/* ── Quick pick pills ── */
.am-quickpick-wrap[b-ws7lwltd0z] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.am-quickpick-pill[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    white-space: nowrap;
}

.am-quickpick-pill:hover[b-ws7lwltd0z] {
    background: var(--primarySubtle);
    color: var(--primary);
    border-color: var(--primary);
}

/* ── Meal type chip box ── */
.am-context-box[b-ws7lwltd0z] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px;
    background: var(--primarySubtle);
    border-radius: var(--radiusSm);
}

.am-chip[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: var(--radiusSm);
    border: none;
    background: var(--mainBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    min-height: 32px;
    transition: background 150ms ease, color 150ms ease;
}

.am-chip:hover[b-ws7lwltd0z] {
    color: var(--textPrimary);
}

.am-chip-active[b-ws7lwltd0z] {
    background: var(--primary);
    color: var(--primaryFg);
    font-weight: 600;
}

.am-chip-check[b-ws7lwltd0z] {
    font-size: 15px;
    line-height: 1;
}

/* ── Macros grid ── */
.am-macros-grid[b-ws7lwltd0z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.am-macro-cell[b-ws7lwltd0z] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.am-macro-label[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
    margin: 0;
}

.am-macro-input-wrap[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.am-macro-input[b-ws7lwltd0z] {
    flex: 1;
    min-width: 0;
}

.am-macro-unit[b-ws7lwltd0z] {
    font-size: 13px;
    color: var(--textMuted);
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Tags ── */
.am-tags-list[b-ws7lwltd0z] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.am-tag-pill[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px 3px 10px;
    border-radius: 999px;
    background: var(--primarySubtle);
    color: var(--primary);
    font-size: 13px;
    font-weight: 600;
}

.am-tag-remove[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: var(--primary);
    cursor: pointer;
    padding: 0;
    transition: background 150ms ease;
}

.am-tag-remove:hover[b-ws7lwltd0z] {
    background: var(--primary);
    color: var(--primaryFg);
}

.am-tag-remove .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 14px;
}

.am-tag-input-wrap[b-ws7lwltd0z] {
    position: relative;
}

.am-tag-suggestions[b-ws7lwltd0z] {
    position: absolute;
    top: 100%;
    inset-inline: 0;
    z-index: 10;
    margin-top: 4px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.am-tag-suggestion[b-ws7lwltd0z] {
    display: block;
    width: 100%;
    padding: 8px 12px;
    border: none;
    background: transparent;
    color: var(--textPrimary);
    font-size: 13px;
    text-align: start;
    cursor: pointer;
    transition: background 150ms ease;
}

.am-tag-suggestion:hover[b-ws7lwltd0z] {
    background: var(--primarySubtle);
}

/* ── Food items ── */
.am-items-list[b-ws7lwltd0z] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.am-item-row[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: var(--radiusSm);
    background: var(--surfaceAlt);
}

.am-item-info[b-ws7lwltd0z] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.am-item-name[b-ws7lwltd0z] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.am-item-serving[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
}

.am-item-macros[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
}

.am-item-remove[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border: none;
    border-radius: var(--radiusSm);
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.am-item-remove:hover[b-ws7lwltd0z] {
    background: var(--dangerBg);
    color: var(--dangerText);
}

.am-item-remove .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 18px;
}

/* ── Food autocomplete dropdown ── */
.am-food-search-wrap[b-ws7lwltd0z] {
    position: relative;
}

.am-food-dropdown[b-ws7lwltd0z] {
    position: absolute;
    top: 100%;
    inset-inline: 0;
    z-index: 10;
    margin-top: 4px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    box-shadow: var(--shadow);
    overflow: hidden;
    max-height: 300px;
    overflow-y: auto;
}

.am-food-dropdown-loading[b-ws7lwltd0z] {
    padding: 12px;
    font-size: 13px;
    color: var(--textMuted);
    text-align: center;
}

.am-food-result[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-bottom: 1px solid var(--border);
    background: transparent;
    color: var(--textPrimary);
    text-align: start;
    cursor: pointer;
    transition: background 150ms ease;
}

.am-food-result:last-of-type[b-ws7lwltd0z] {
    border-bottom: none;
}

.am-food-result:hover[b-ws7lwltd0z] {
    background: var(--primarySubtle);
}

.am-food-result-info[b-ws7lwltd0z] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.am-food-result-name[b-ws7lwltd0z] {
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.am-food-result-brand[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.am-food-result-meta[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.am-food-result-kcal[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
    white-space: nowrap;
}



.am-food-manual[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-top: 1px solid var(--border);
    background: var(--surfaceAlt);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.am-food-manual:hover[b-ws7lwltd0z] {
    background: var(--primarySubtle);
    color: var(--primary);
}

.am-food-manual .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 16px;
}

/* ── Portion row ── */
.am-portion-row[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.am-portion-label[b-ws7lwltd0z] {
    font-size: 13px;
    font-weight: 600;
    color: var(--textSecondary);
    white-space: nowrap;
}

.am-portion-input-wrap[b-ws7lwltd0z] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

.am-portion-input[b-ws7lwltd0z] {
    flex: 1;
    min-width: 0;
}

/* ── Item field with label ── */
.am-item-field[b-ws7lwltd0z] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.am-item-field-label[b-ws7lwltd0z] {
    font-size: 12px;
    color: var(--textMuted);
    margin: 0;
}

/* ── Add item form ── */
.am-item-form[b-ws7lwltd0z] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border-radius: var(--radiusSm);
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
}

.am-item-form-row[b-ws7lwltd0z] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.am-item-form-input[b-ws7lwltd0z] {
    min-width: 0;
}

.am-item-form-btn[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 8px 14px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background 150ms ease, color 150ms ease;
    font-family: var(--font-heading);
    width: 100%;
    margin-top: 4px;
}

.am-item-form-add[b-ws7lwltd0z] {
    background: transparent;
    border-color: var(--border);
    color: var(--textSecondary);
}

.am-item-form-add:hover:not(:disabled)[b-ws7lwltd0z] {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primarySubtle);
}

.am-item-form-add:disabled[b-ws7lwltd0z] {
    opacity: 0.5;
    cursor: not-allowed;
}

.am-item-form-add .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 16px;
}

/* ── Add item button ── */
.am-add-item-btn[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: var(--radiusSm);
    border: 1px dashed var(--border);
    background: transparent;
    color: var(--textMuted);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    width: fit-content;
}

.am-add-item-btn:hover[b-ws7lwltd0z] {
    background: var(--primarySubtle);
    color: var(--primary);
    border-color: var(--primary);
}

.am-add-item-btn .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 18px;
}

/* ── Error text ── */
.am-error-text[b-ws7lwltd0z] {
    color: var(--danger);
    font-size: 13px;
    font-weight: 500;
    margin: 0;
}

/* ── Drawer footer (pinned at bottom) ── */
.drawer-footer[b-ws7lwltd0z] {
    padding: 16px 20px;
    flex-shrink: 0;
}

/* ── Save/Update button (GcBtn full lg) ── */
.gc-btn[b-ws7lwltd0z] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 52px;
    padding: 0 20px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 700;
    font-family: var(--font-heading);
    cursor: pointer;
    border: none;
    transition: all 150ms ease;
    letter-spacing: -0.01em;
}

.gc-btn:disabled[b-ws7lwltd0z] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gc-btn-primary[b-ws7lwltd0z] {
    background: var(--primary);
    color: var(--primaryFg);
}

.gc-btn-primary:hover:not(:disabled)[b-ws7lwltd0z] {
    background: var(--primaryDark);
}

.gc-btn-full[b-ws7lwltd0z] {
    width: 100%;
}

.gc-btn .material-symbols-outlined[b-ws7lwltd0z] {
    font-size: 18px;
}

@keyframes gc-btn-spin-b-ws7lwltd0z {
    to {
        transform: rotate(360deg);
    }
}

.gc-btn-spin[b-ws7lwltd0z] {
    animation: gc-btn-spin-b-ws7lwltd0z 0.9s linear infinite;
}

/* ══════════════════════════════════════════
   MOBILE: bottom-sheet style
   ══════════════════════════════════════════ */
@media (max-width: 640px) {
    .drawer-backdrop[b-ws7lwltd0z] {
        align-items: flex-end;
        padding: 0;
    }

    .drawer-dialog[b-ws7lwltd0z] {
        max-width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
    }

    .drawer-handle-bar[b-ws7lwltd0z] {
        display: block;
        width: 40px;
        height: 4px;
        border-radius: 2px;
        background: var(--border);
        margin: 10px auto 0;
    }
}
/* /Components/Shared/AddMedicationDialog.razor.rz.scp.css */
/* Backdrop */
.ld-backdrop[b-yi4yfg0427] {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 16px 24px;
    overflow-y: auto;
}

/* Dialog card */
.ld-dialog[b-yi4yfg0427] {
    width: 100%;
    max-width: 480px;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
}

/* Header */
.ld-header[b-yi4yfg0427] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.ld-title[b-yi4yfg0427] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.ld-close-btn[b-yi4yfg0427] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    border-radius: var(--radiusSm);
    transition: background 150ms ease, color 150ms ease;
}

.ld-close-btn:hover[b-yi4yfg0427] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

/* Body */
.ld-body[b-yi4yfg0427] {
    padding: 20px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Fields */
.ld-field[b-yi4yfg0427] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ld-row[b-yi4yfg0427] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.ld-field-half[b-yi4yfg0427] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ld-label[b-yi4yfg0427] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--textPrimary);
    margin: 0;
}

.ld-optional[b-yi4yfg0427] {
    font-weight: 400;
    color: var(--textMuted);
    font-size: 0.8rem;
}

/* Number input with inline unit */
.ld-num-wrap[b-yi4yfg0427] {
    position: relative;
    display: flex;
    align-items: center;
}

.ld-num-input[b-yi4yfg0427] {
    padding-right: 46px !important;
}

.ld-num-unit[b-yi4yfg0427] {
    position: absolute;
    right: 12px;
    font-size: 13px;
    color: var(--textMuted);
    pointer-events: none;
    font-weight: 500;
}

/* Quick-dose chips */
.ld-chips[b-yi4yfg0427] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ld-chip[b-yi4yfg0427] {
    padding: 4px 14px;
    border-radius: var(--radiusSm);
    border: 1px solid var(--border);
    background: var(--secondaryBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    min-height: 32px;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.ld-chip:hover[b-yi4yfg0427] {
    color: var(--textPrimary);
    border-color: var(--primary);
}

.ld-chip-active[b-yi4yfg0427] {
    background: var(--alertAmberBg);
    border-color: var(--alertAmberBorder);
    color: var(--alertAmberText);
    font-weight: 700;
}

/* Error */
.ld-error[b-yi4yfg0427] {
    font-size: 0.8rem;
    color: var(--danger);
    margin: 0;
}

/* Mobile: bottom-sheet */
@media (max-width: 480px) {
    .ld-backdrop[b-yi4yfg0427] {
        padding: 0;
        align-items: flex-end;
    }

    .ld-dialog[b-yi4yfg0427] {
        max-width: 100%;
        border-radius: var(--radiusXl) var(--radiusXl) 0 0;
        max-height: 92dvh;
    }

    .ld-row[b-yi4yfg0427] {
        grid-template-columns: 1fr;
    }
}

/* -- Active toggle (edit mode only) ------------------------------ */
.amd-active-toggle[b-yi4yfg0427] {
    padding-top: 4px;
}

.amd-toggle-label[b-yi4yfg0427] {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.amd-toggle-label input[type="checkbox"][b-yi4yfg0427] {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
    cursor: pointer;
}

/* -- Medicine autocomplete search -------------------------------- */
.amd-search-wrap[b-yi4yfg0427] {
    position: relative;
}

.amd-search-backdrop[b-yi4yfg0427] {
    position: fixed;
    inset: 0;
    z-index: 1;
}

.amd-search-dropdown[b-yi4yfg0427] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 2;
    background: var(--secondaryBg);
    border: 1px solid var(--border);
    border-radius: var(--radiusMd);
    margin-top: 4px;
    max-height: 300px;
    overflow-y: auto;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.amd-search-option[b-yi4yfg0427] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 10px 14px;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    color: var(--textPrimary);
    font-size: 14px;
    transition: background 120ms ease;
    min-height: 44px;
}

.amd-search-option:not(:last-child)[b-yi4yfg0427] {
    border-bottom: 1px solid var(--border);
}

.amd-search-option:hover[b-yi4yfg0427] {
    background: var(--surfaceAlt);
}

.amd-search-name[b-yi4yfg0427] {
    font-weight: 500;
}

.amd-search-route[b-yi4yfg0427] {
    font-size: 12px;
    color: var(--textMuted);
}

.amd-search-spinner[b-yi4yfg0427] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: var(--textMuted);
    animation: spin-b-yi4yfg0427 1s linear infinite;
}

@keyframes spin-b-yi4yfg0427 {
    to { transform: translateY(-50%) rotate(360deg); }
}

.amd-search-loading[b-yi4yfg0427] {
    padding: 12px;
    font-size: 13px;
    color: var(--textMuted);
    text-align: center;
}
/* /Components/Shared/AlertPopup.razor.rz.scp.css */
.alert-popup-container[b-idfg5ao28n] {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 400px;
    width: calc(100% - 32px);
    pointer-events: none;
}

.alert-toast[b-idfg5ao28n] {
    display: flex;
    border-radius: var(--radiusMd);
    background: var(--secondaryBg);
    box-shadow: var(--shadowLg);
    overflow: hidden;
    pointer-events: auto;
    border: 1px solid var(--border);
}

.alert-toast-enter[b-idfg5ao28n] {
    animation: alert-slide-in-b-idfg5ao28n 300ms ease-out forwards;
}

.alert-toast-exit[b-idfg5ao28n] {
    animation: alert-slide-out-b-idfg5ao28n 200ms ease-in forwards;
}

.alert-toast-strip[b-idfg5ao28n] {
    width: 4px;
    flex-shrink: 0;
}

.alert-toast-critical .alert-toast-strip[b-idfg5ao28n] {
    background: var(--alertRoseBorder);
}

.alert-toast-warning .alert-toast-strip[b-idfg5ao28n] {
    background: var(--alertAmberBorder);
}

.alert-toast-info .alert-toast-strip[b-idfg5ao28n] {
    background: var(--alertGreenBorder);
}

.alert-toast-body[b-idfg5ao28n] {
    flex: 1;
    padding: 12px 14px;
    min-width: 0;
}

.alert-toast-header[b-idfg5ao28n] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.alert-toast-icon[b-idfg5ao28n] {
    font-size: 18px;
    flex-shrink: 0;
}

.alert-toast-critical .alert-toast-icon[b-idfg5ao28n] {
    color: var(--alertRoseText);
}

.alert-toast-warning .alert-toast-icon[b-idfg5ao28n] {
    color: var(--alertAmberText);
}

.alert-toast-info .alert-toast-icon[b-idfg5ao28n] {
    color: var(--alertGreenText);
}

.alert-toast-title[b-idfg5ao28n] {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: var(--textPrimary);
    line-height: 1.3;
    min-width: 0;
}

.alert-toast-close[b-idfg5ao28n] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    border-radius: var(--radiusSm);
    padding: 0;
    transition: background 150ms ease, color 150ms ease;
}

.alert-toast-close:hover[b-idfg5ao28n] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.alert-toast-close .material-symbols-outlined[b-idfg5ao28n] {
    font-size: 16px;
}

.alert-toast-message[b-idfg5ao28n] {
    font-size: 12px;
    color: var(--textSecondary);
    line-height: 1.5;
    margin: 6px 0 0;
}

.alert-toast-category[b-idfg5ao28n] {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    color: var(--textMuted);
    margin-top: 6px;
}

@keyframes alert-slide-in-b-idfg5ao28n {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes alert-slide-out-b-idfg5ao28n {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(100%);
    }
}

@media (max-width: 480px) {
    .alert-popup-container[b-idfg5ao28n] {
        right: 8px;
        top: 8px;
        max-width: none;
        width: calc(100% - 16px);
    }
}
/* /Components/Shared/AppSelect.razor.rz.scp.css */
.asel-wrap[b-08i8e9zhhq] {
    position: relative;
    width: 100%;
    margin-bottom: 14px;
}

.asel-label[b-08i8e9zhhq] {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    cursor: pointer;
    font-family: var(--font-heading);
}

/* Trigger button */
.asel-trigger[b-08i8e9zhhq] {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    background: var(--inputBg);
    color: var(--textPrimary);
    font-size: 14px;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    transition: border-color 200ms ease, box-shadow 200ms ease;
    gap: 8px;
}

.asel-trigger:focus[b-08i8e9zhhq] {
    outline: none;
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.asel-trigger-open[b-08i8e9zhhq] {
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.asel-value[b-08i8e9zhhq] {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 1.4;
}

.asel-placeholder[b-08i8e9zhhq] {
    color: var(--textMuted);
}

.asel-chevron[b-08i8e9zhhq] {
    flex-shrink: 0;
    color: var(--textMuted);
    display: flex;
    align-items: center;
    pointer-events: none;
}

.asel-chevron svg[b-08i8e9zhhq] {
    width: 14px;
    height: 14px;
    transition: transform 200ms ease;
}

.asel-trigger-open .asel-chevron svg[b-08i8e9zhhq] {
    transform: rotate(180deg);
}

/* Transparent backdrop to close on outside click */
.asel-backdrop[b-08i8e9zhhq] {
    position: fixed;
    inset: 0;
    z-index: 49;
}

/* Dropdown list */
.asel-dropdown[b-08i8e9zhhq] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 50;
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: 10px;
    box-shadow: var(--shadowLg);
    max-height: 200px;
    overflow-y: auto;
}

/* Option buttons */
.asel-option[b-08i8e9zhhq] {
    width: 100%;
    padding: 10px 14px;
    border: none;
    background: transparent;
    color: var(--textPrimary);
    font-size: 13px;
    font-family: var(--font-body);
    text-align: left;
    cursor: pointer;
    transition: background 120ms ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
}

.asel-option:not(:last-child)[b-08i8e9zhhq] {
    border-bottom: 1px solid var(--border);
}

.asel-option:hover[b-08i8e9zhhq] {
    background: var(--surfaceAlt);
}

.asel-option-active[b-08i8e9zhhq] {
    background: var(--surfaceAlt);
    color: var(--primary);
    font-weight: 500;
}
/* /Components/Shared/DateRangePicker.razor.rz.scp.css */
/* Wrapper - relative so the dropdown anchors correctly */
.drp-wrap[b-vfah10moys] {
    position: relative;
    display: inline-block;
}

/* Pill button */
.drp-pill[b-vfah10moys] {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--mainBg);
    padding: 6px 12px;
    font-size: 0.85rem;
    color: var(--textPrimary);
    cursor: pointer;
    transition: background 150ms ease;
    min-height: 44px;
    white-space: nowrap;
}

.drp-pill:hover[b-vfah10moys] {
    background: var(--primarySubtle);
}

.drp-cal-icon[b-vfah10moys] {
    font-size: 18px;
    color: var(--primary);
}

.drp-caret[b-vfah10moys] {
    font-size: 18px;
    color: var(--textMuted);
}

/* Dropdown panel */
.drp-dropdown[b-vfah10moys] {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 6px);
    right: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusMd);
    box-shadow: var(--shadowLg);
    padding: 16px;
    min-width: 280px;
}

/* Month navigation */
.drp-month-nav[b-vfah10moys] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.drp-month-label[b-vfah10moys] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--textPrimary);
}

.drp-nav-btn[b-vfah10moys] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    border-radius: var(--radiusSm);
    cursor: pointer;
    color: var(--textMuted);
    transition: background 150ms ease, color 150ms ease;
}

.drp-nav-btn:hover[b-vfah10moys] {
    background: var(--primarySubtle);
    color: var(--primary);
}

.drp-nav-btn .material-symbols-outlined[b-vfah10moys] {
    font-size: 18px;
}

/* Calendar grid */
.drp-grid[b-vfah10moys] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    margin-bottom: 10px;
}

.drp-dow[b-vfah10moys] {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--textMuted);
    padding: 4px 0 6px;
}

/* Day cells */
.drp-day[b-vfah10moys] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    border-radius: 50%;
    font-size: 0.8rem;
    color: var(--textPrimary);
    cursor: pointer;
    transition: background 100ms ease, color 100ms ease;
    justify-self: center;
}

.drp-day:hover[b-vfah10moys] {
    background: var(--primarySubtle);
    color: var(--primary);
}

/* Range fill - flush background, no circle */
.drp-day-in-range[b-vfah10moys] {
    background: var(--primarySubtle);
    border-radius: 0;
    color: var(--textPrimary);
    width: 100%;
}

/* Endpoint days - full circle, primary color */
.drp-day-endpoint[b-vfah10moys] {
    background: var(--primary);
    border-radius: 50%;
    color: var(--primaryFg);
    width: 32px;
}

.drp-day-endpoint:hover[b-vfah10moys] {
    background: var(--primaryDark);
    color: var(--primaryFg);
}

/* Disabled (future) day cells */
.drp-day:disabled[b-vfah10moys] {
    opacity: 0.28;
    cursor: not-allowed;
    pointer-events: none;
}

/* Disabled next-month nav button */
.drp-nav-btn:disabled[b-vfah10moys] {
    opacity: 0.28;
    cursor: not-allowed;
    pointer-events: none;
}

/* Hint text */
.drp-hint[b-vfah10moys] {
    font-size: 0.78rem;
    color: var(--textMuted);
    text-align: center;
    margin: 0 0 8px;
}

/* Action buttons row */
.drp-actions[b-vfah10moys] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 8px;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

.drp-btn[b-vfah10moys] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 14px;
    border-radius: var(--radiusSm);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
    border: 1px solid transparent;
}

.drp-btn-cancel[b-vfah10moys] {
    background: transparent;
    border-color: var(--border);
    color: var(--textMuted);
}

.drp-btn-cancel:hover[b-vfah10moys] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.drp-btn-apply[b-vfah10moys] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

.drp-btn-apply:hover:not(:disabled)[b-vfah10moys] {
    background: var(--primaryDark);
    border-color: var(--primaryDark);
}

.drp-btn-apply:disabled[b-vfah10moys] {
    opacity: 0.45;
    cursor: not-allowed;
}
/* /Components/Shared/DateTimePicker.razor.rz.scp.css */
/* Wrapper - relative so the dropdown anchors correctly */
.dtp-wrap[b-ojfrqgibua] {
    position: relative;
    display: inline-block;
}

/* Pill button */
.dtp-pill[b-ojfrqgibua] {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--mainBg);
    padding: 6px 12px;
    font-size: 0.85rem;
    color: var(--textPrimary);
    cursor: pointer;
    transition: background 150ms ease;
    min-height: 44px;
    white-space: nowrap;
}

.dtp-pill:hover[b-ojfrqgibua] {
    background: var(--primarySubtle);
}

.dtp-cal-icon[b-ojfrqgibua] {
    font-size: 18px;
    color: var(--primary);
}

.dtp-caret[b-ojfrqgibua] {
    font-size: 18px;
    color: var(--textMuted);
}

/* Dropdown panel */
.dtp-dropdown[b-ojfrqgibua] {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 6px);
    right: 0;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusMd);
    box-shadow: var(--shadowLg);
    padding: 16px;
    min-width: 280px;
}

/* Month navigation */
.dtp-month-nav[b-ojfrqgibua] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.dtp-month-label[b-ojfrqgibua] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--textPrimary);
}

.dtp-nav-btn[b-ojfrqgibua] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    border-radius: var(--radiusSm);
    cursor: pointer;
    color: var(--textMuted);
    transition: background 150ms ease, color 150ms ease;
}

.dtp-nav-btn:hover[b-ojfrqgibua] {
    background: var(--primarySubtle);
    color: var(--primary);
}

.dtp-nav-btn .material-symbols-outlined[b-ojfrqgibua] {
    font-size: 18px;
}

/* Calendar grid */
.dtp-grid[b-ojfrqgibua] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
    margin-bottom: 10px;
}

.dtp-dow[b-ojfrqgibua] {
    text-align: center;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--textMuted);
    padding: 4px 0 6px;
}

/* Day cells */
.dtp-day[b-ojfrqgibua] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    border-radius: 50%;
    font-size: 0.8rem;
    color: var(--textPrimary);
    cursor: pointer;
    transition: background 100ms ease, color 100ms ease;
    justify-self: center;
}

.dtp-day:hover[b-ojfrqgibua] {
    background: var(--primarySubtle);
    color: var(--primary);
}

/* Selected day - single selection, primary bg */
.dtp-day-selected[b-ojfrqgibua] {
    background: var(--primary);
    border-radius: 50%;
    color: var(--primaryFg);
}

.dtp-day-selected:hover[b-ojfrqgibua] {
    background: var(--primaryDark);
    color: var(--primaryFg);
}

/* Time section */
.dtp-time-section[b-ojfrqgibua] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    margin: 8px 0;
}

.dtp-time-label[b-ojfrqgibua] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--textMuted);
    margin-right: 4px;
}

.dtp-time-input[b-ojfrqgibua] {
    width: 52px;
    text-align: center;
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--surfaceRaised);
    font-size: 0.9rem;
    color: var(--textPrimary);
}

.dtp-time-sep[b-ojfrqgibua] {
    font-weight: 700;
    color: var(--textMuted);
}

/* AM / PM toggle */
.dtp-ampm[b-ojfrqgibua] {
    display: flex;
    gap: 2px;
    margin-left: 6px;
}

.dtp-ampm-btn[b-ojfrqgibua] {
    padding: 4px 10px;
    min-height: 32px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--mainBg);
    color: var(--textMuted);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}

.dtp-ampm-btn:hover[b-ojfrqgibua] {
    background: var(--primarySubtle);
    color: var(--primary);
    border-color: var(--primary);
}

.dtp-ampm-active[b-ojfrqgibua] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

/* Action buttons row */
.dtp-actions[b-ojfrqgibua] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 8px;
    padding-top: 10px;
}

.dtp-btn[b-ojfrqgibua] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 14px;
    border-radius: var(--radiusSm);
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
    border: 1px solid transparent;
}

.dtp-btn-apply[b-ojfrqgibua] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

.dtp-btn-apply:hover[b-ojfrqgibua] {
    background: var(--primaryDark);
    border-color: var(--primaryDark);
}
/* /Components/Shared/FormSelect.razor.rz.scp.css */
.fsel-wrap[b-807xjgdtua] {
    position: relative;
    width: 100%;
    margin-bottom: 14px;
}

.fsel-label[b-807xjgdtua] {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    cursor: pointer;
    font-family: var(--font-heading);
}

/* Trigger button */
.fsel-trigger[b-807xjgdtua] {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    background: var(--inputBg);
    color: var(--textPrimary);
    font-size: 14px;
    font-family: var(--font-body);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    transition: border-color 200ms ease, box-shadow 200ms ease;
    gap: 8px;
}

.fsel-trigger:focus[b-807xjgdtua] {
    outline: none;
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.fsel-value[b-807xjgdtua] {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 1.4;
}

.fsel-placeholder[b-807xjgdtua] {
    color: var(--textMuted);
}

.fsel-chevron[b-807xjgdtua] {
    flex-shrink: 0;
    color: var(--textMuted);
    display: flex;
    align-items: center;
    pointer-events: none;
    transition: transform 200ms ease;
}

/* Dropdown list */
.fsel-dropdown[b-807xjgdtua] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 50;
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: 10px;
    box-shadow: var(--shadowLg);
    max-height: 200px;
    overflow-y: auto;
}

/* Option buttons */
.fsel-option[b-807xjgdtua] {
    width: 100%;
    padding: 10px 14px;
    border: none;
    background: transparent;
    color: var(--textPrimary);
    font-size: 13px;
    font-family: var(--font-body);
    text-align: left;
    cursor: pointer;
    transition: background 120ms ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
}

.fsel-option:not(:last-child)[b-807xjgdtua] {
    border-bottom: 1px solid var(--border);
}

.fsel-option:hover[b-807xjgdtua] {
    background: var(--surfaceAlt);
}

.fsel-option-active[b-807xjgdtua] {
    background: var(--surfaceAlt);
    color: var(--primary);
    font-weight: 500;
}
/* /Components/Shared/GlucoseTrendChart.razor.rz.scp.css */
/* -- Container ------------------------------------------------ */
.gtc[b-nmwva7ymqz] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* -- Loading overlay (inside gtc-chart-wrap which is position:relative) -- */
.gtc-loading-overlay[b-nmwva7ymqz] {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--pageBg) 75%, transparent);
    border-radius: 8px;
    pointer-events: none;
}

.gtc-spinner[b-nmwva7ymqz] {
    width: 28px;
    height: 28px;
    border: 2.5px solid var(--border);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: gtc-spin-b-nmwva7ymqz 0.7s linear infinite;
    display: block;
}

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

/* -- Header row (title + picker) ------------------------------ */
.gtc-header[b-nmwva7ymqz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.gtc-title[b-nmwva7ymqz] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0;
}

/* -- Chart wrapper -------------------------------------------- */
.gtc-chart-wrap[b-nmwva7ymqz] {
    position: relative;
    width: 100%;
}

.gtc-svg[b-nmwva7ymqz] {
    width: 100%;
    height: auto;
    display: block;
}

/* -- Marker interactivity ------------------------------------- */
.gtc-marker-group[b-nmwva7ymqz] {
    cursor: pointer;
}

.gtc-marker-group:hover[b-nmwva7ymqz] {
    filter: brightness(1.1);
}

/* -- Tooltip -------------------------------------------------- */
.gtc-tooltip[b-nmwva7ymqz] {
    position: absolute;
    z-index: 10;
    background: var(--secondaryBg);
    border: 0.5px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadowLg);
    min-width: 180px;
    max-width: 260px;
    pointer-events: none;
}

.gtc-tooltip-strip[b-nmwva7ymqz] {
    height: 4px;
    width: 100%;
}

.gtc-tooltip-body[b-nmwva7ymqz] {
    padding: 10px 12px;
}

.gtc-tooltip-name[b-nmwva7ymqz] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
    margin-bottom: 2px;
}

.gtc-tooltip-meta[b-nmwva7ymqz] {
    font-size: 12px;
    color: var(--textMuted);
}

.gtc-tooltip-divider[b-nmwva7ymqz] {
    height: 1px;
    background: var(--border);
    margin: 8px 0;
}

.gtc-tooltip-note[b-nmwva7ymqz] {
    font-size: 12px;
    color: var(--textSecondary);
    display: flex;
    align-items: center;
    gap: 4px;
}

/* -- Legend ---------------------------------------------------- */
.gtc-legend[b-nmwva7ymqz] {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 4px 0;
}

.gtc-legend-item[b-nmwva7ymqz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--textSecondary);
}

.gtc-legend-dot[b-nmwva7ymqz] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.gtc-legend-diamond[b-nmwva7ymqz] {
    width: 9px;
    height: 9px;
    transform: rotate(45deg);
    flex-shrink: 0;
}

.gtc-legend-range[b-nmwva7ymqz] {
    width: 16px;
    height: 10px;
    border-radius: 2px;
    background: color-mix(in srgb, var(--success) 20%, transparent);
    border: 1px dashed var(--success);
    flex-shrink: 0;
}

/* -- Zoom controls (hidden on desktop) ------------------------ */
.gtc-zoom-controls[b-nmwva7ymqz] {
    display: none;
}

/* -- Responsive ----------------------------------------------- */
@media (max-width: 600px) {
    .gtc-chart-wrap[b-nmwva7ymqz] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .gtc-chart-wrap[b-nmwva7ymqz]::-webkit-scrollbar {
        height: 4px;
    }

    .gtc-chart-wrap[b-nmwva7ymqz]::-webkit-scrollbar-track {
        background: transparent;
    }

    .gtc-chart-wrap[b-nmwva7ymqz]::-webkit-scrollbar-thumb {
        background: var(--border);
        border-radius: 2px;
    }

    .gtc-zoom-controls[b-nmwva7ymqz] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
    }

    .gtc-zoom-btn[b-nmwva7ymqz] {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        border: 1px solid var(--border);
        background: var(--secondaryBg);
        color: var(--textPrimary);
        cursor: pointer;
        padding: 0;
    }

    .gtc-zoom-btn .material-symbols-outlined[b-nmwva7ymqz] {
        font-size: 16px;
    }

    .gtc-zoom-level[b-nmwva7ymqz] {
        font-size: 11px;
        font-weight: 500;
        color: var(--textSecondary);
        min-width: 28px;
        text-align: center;
    }

    .gtc-legend[b-nmwva7ymqz] {
        gap: 12px;
    }

    .gtc-tooltip[b-nmwva7ymqz] {
        min-width: 150px;
    }
}
/* /Components/Shared/HealthSettingsDialog.razor.rz.scp.css */
/* ================================
   Drawer backdrop
================================ */

.drawer-backdrop[b-xeuzrhuko9] {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    padding: 16px;
}

/* ================================
   Drawer dialog
================================ */

.drawer-dialog[b-xeuzrhuko9] {
    background: var(--surface);
    width: 100%;
    max-width: 480px;
    max-height: 85vh;
    border-radius: 16px;
    overflow: auto;
    box-shadow: var(--shadowLg);
    border: 1px solid var(--border);
}

/* ================================
   Drawer header
================================ */

.drawer-header[b-xeuzrhuko9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
}

.drawer-title[b-xeuzrhuko9] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.drawer-close[b-xeuzrhuko9] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: var(--surfaceAlt);
    color: var(--textSecondary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease;
}

.drawer-close:hover[b-xeuzrhuko9] {
    background: var(--border);
}

.drawer-close .material-symbols-outlined[b-xeuzrhuko9] {
    font-size: 16px;
}

/* ================================
   Drawer body
================================ */

.drawer-body[b-xeuzrhuko9] {
    padding: 20px;
}

/* ================================
   Fields
================================ */

.hs-field[b-xeuzrhuko9] {
    margin-bottom: 14px;
}

.hs-label[b-xeuzrhuko9] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    margin-bottom: 5px;
    font-family: var(--font-heading);
}

/* ================================
   Unit pill selector
================================ */

.hs-select-row[b-xeuzrhuko9] {
    display: flex;
    gap: 6px;
}

.hs-unit-pill[b-xeuzrhuko9] {
    flex: 1;
    height: 42px;
    border-radius: 10px;
    border: 1.5px solid var(--border);
    background: transparent;
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s ease;
}

.hs-unit-pill:hover[b-xeuzrhuko9] {
    background: var(--surfaceAlt);
}

.hs-unit-pill.active[b-xeuzrhuko9] {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 10%, transparent);
    color: var(--primary);
    font-weight: 600;
}

/* ================================
   Range grid
================================ */

.hs-range-grid[b-xeuzrhuko9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

/* ================================
   Input box
================================ */

.hs-input-box[b-xeuzrhuko9] {
    display: flex;
    align-items: center;
    height: 42px;
    background: var(--inputBg);
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.hs-input-box:focus-within[b-xeuzrhuko9] {
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.hs-input[b-xeuzrhuko9] {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0 12px;
    font-size: 14px;
    font-family: var(--font-body);
    color: var(--textPrimary);
    height: 100%;
    outline: none;
    min-width: 0;
}

.hs-input[b-xeuzrhuko9]::placeholder {
    color: var(--textMuted);
}

.hs-input[b-xeuzrhuko9]::-webkit-inner-spin-button,
.hs-input[b-xeuzrhuko9]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.hs-input[type=number][b-xeuzrhuko9] {
    -moz-appearance: textfield;
}

.hs-input-suffix[b-xeuzrhuko9] {
    font-size: 12px;
    font-weight: 500;
    color: var(--textMuted);
    padding-right: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ================================
   Toggle row (Do not disturb)
================================ */

.hs-toggle-row[b-xeuzrhuko9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    padding: 12px 14px;
    background: var(--surfaceAlt);
    border-radius: 10px;
    border: 1px solid var(--border);
}

.hs-toggle-info[b-xeuzrhuko9] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.hs-toggle-label[b-xeuzrhuko9] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.hs-toggle-sub[b-xeuzrhuko9] {
    font-size: 12px;
    color: var(--textMuted);
}

.hs-toggle[b-xeuzrhuko9] {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    flex-shrink: 0;
}

.hs-toggle input[type=checkbox][b-xeuzrhuko9] {
    appearance: none;
    -webkit-appearance: none;
    width: 44px;
    min-width: 44px;
    height: 24px;
    border-radius: 12px;
    background: var(--border);
    position: relative;
    cursor: pointer;
    transition: background 0.2s ease;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

.hs-toggle input[type=checkbox]:checked[b-xeuzrhuko9] {
    background: var(--primary);
}

.hs-toggle input[type=checkbox][b-xeuzrhuko9]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s ease;
}

.hs-toggle input[type=checkbox]:checked[b-xeuzrhuko9]::after {
    transform: translateX(20px);
}

/* ================================
   Error
================================ */

.hs-error[b-xeuzrhuko9] {
    color: var(--danger);
    font-size: 11px;
    margin: 0 0 14px;
}

/* ================================
   GcBtn styles
================================ */

.gc-btn[b-xeuzrhuko9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s ease;
    border: 1.5px solid transparent;
    white-space: nowrap;
}

.gc-btn:disabled[b-xeuzrhuko9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gc-btn-primary[b-xeuzrhuko9] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

.gc-btn-primary:hover:not(:disabled)[b-xeuzrhuko9] {
    background: var(--primaryDark);
    border-color: var(--primaryDark);
}

.gc-btn-full[b-xeuzrhuko9] {
    width: 100%;
}

/* ================================
   Mobile responsive
================================ */

@media (max-width: 700px) {
    .drawer-dialog[b-xeuzrhuko9] {
        max-width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
        align-self: flex-end;
    }

    .drawer-backdrop[b-xeuzrhuko9] {
        align-items: flex-end;
        padding: 0;
    }

    .hs-range-grid[b-xeuzrhuko9] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/LogMedicationDialog.razor.rz.scp.css */
/* Backdrop */
.ld-backdrop[b-1mmxq70rrr] {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 16px 24px;
    overflow-y: auto;
}

/* Dialog card */
.ld-dialog[b-1mmxq70rrr] {
    width: 100%;
    max-width: 480px;
    padding: 0;
    display: flex;
    flex-direction: column;
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
}

/* Header */
.ld-header[b-1mmxq70rrr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.ld-title[b-1mmxq70rrr] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.ld-close-btn[b-1mmxq70rrr] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    border-radius: var(--radiusSm);
    transition: background 150ms ease, color 150ms ease;
}

.ld-close-btn:hover[b-1mmxq70rrr] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

/* Body */
.ld-body[b-1mmxq70rrr] {
    padding: 20px 24px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Fields */
.ld-field[b-1mmxq70rrr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ld-row[b-1mmxq70rrr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.ld-field-half[b-1mmxq70rrr] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ld-label[b-1mmxq70rrr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--textPrimary);
    margin: 0;
}

.ld-optional[b-1mmxq70rrr] {
    font-weight: 400;
    color: var(--textMuted);
    font-size: 0.8rem;
}

/* Number input with inline unit */
.ld-num-wrap[b-1mmxq70rrr] {
    position: relative;
    display: flex;
    align-items: center;
}

.ld-num-input[b-1mmxq70rrr] {
    padding-right: 46px !important;
}

.ld-num-unit[b-1mmxq70rrr] {
    position: absolute;
    right: 12px;
    font-size: 13px;
    color: var(--textMuted);
    pointer-events: none;
    font-weight: 500;
}

/* Quick-dose chips */
.ld-chips[b-1mmxq70rrr] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ld-chip[b-1mmxq70rrr] {
    padding: 4px 14px;
    border-radius: var(--radiusSm);
    border: 1px solid var(--border);
    background: var(--secondaryBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    min-height: 32px;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.ld-chip:hover[b-1mmxq70rrr] {
    color: var(--textPrimary);
    border-color: var(--primary);
}

.ld-chip-active[b-1mmxq70rrr] {
    background: var(--alertAmberBg);
    border-color: var(--alertAmberBorder);
    color: var(--alertAmberText);
    font-weight: 700;
}

/* Context pills */
.ld-context-pills[b-1mmxq70rrr] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ld-context-pill[b-1mmxq70rrr] {
    padding: 7px 14px;
    border-radius: 10px;
    border: 1.5px solid var(--border);
    background: var(--inputBg, var(--surface));
    color: var(--textSecondary);
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    transition: all 0.15s ease;
}

.ld-context-pill:hover[b-1mmxq70rrr] {
    border-color: var(--primary);
}

.ld-context-pill-active[b-1mmxq70rrr] {
    border-color: var(--primary);
    background: color-mix(in srgb, var(--primary) 8%, transparent);
    color: var(--primary);
    font-weight: 600;
}

/* Textarea */
.ld-textarea[b-1mmxq70rrr] {
    resize: vertical;
    min-height: 56px;
}

/* Submit button */
.ld-submit-btn[b-1mmxq70rrr] {
    width: 100%;
    height: 52px;
    border: none;
    border-radius: var(--radiusSm);
    background: var(--primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 150ms ease;
}

.ld-submit-btn:hover:not(:disabled)[b-1mmxq70rrr] {
    opacity: 0.9;
}

.ld-submit-btn:disabled[b-1mmxq70rrr] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Error */
.ld-error[b-1mmxq70rrr] {
    font-size: 0.8rem;
    color: var(--danger);
    margin: 0;
}

/* Mobile: bottom-sheet */
@media (max-width: 480px) {
    .ld-backdrop[b-1mmxq70rrr] {
        padding: 0;
        align-items: flex-end;
    }

    .ld-dialog[b-1mmxq70rrr] {
        max-width: 100%;
        border-radius: var(--radiusXl) var(--radiusXl) 0 0;
        max-height: 92dvh;
    }

    .ld-row[b-1mmxq70rrr] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/NotificationPanel.razor.rz.scp.css */
/* Wrapper: relative positioned for dropdown placement */
.notif-wrap[b-g8ihutmygj] {
    position: relative;
    outline: none;
}

/* Prototype: 36x36, borderRadius 10, border 1px solid border, background surface */
.notif-btn[b-g8ihutmygj] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    position: relative;
    transition: background 150ms ease;
}

.notif-btn:hover[b-g8ihutmygj],
.notif-btn-active[b-g8ihutmygj] {
    background: var(--surfaceAlt);
}

.notif-btn-active[b-g8ihutmygj] {
    border-color: var(--inputFocusBorder, var(--primary));
}

.notif-icon[b-g8ihutmygj] {
    font-size: 18px;
    color: var(--textSecondary);
}

/* Prototype: 9x9, borderRadius 50%, background bad, border 2px solid surface,
   position absolute top 5 right 5 */
.notif-badge[b-g8ihutmygj] {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--danger, #EF4444);
    border: 2px solid var(--surface);
}

/* Prototype panel: position absolute, top 100%, right 0, marginTop 8,
   width 340 (280 on mobile), background surface, border 1.5px solid border,
   borderRadius 14, boxShadow shLg, zIndex 60, overflow hidden */
.notif-panel[b-g8ihutmygj] {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 8px;
    width: 340px;
    background: var(--surface);
    border: 1.5px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadowLg, 0 8px 32px rgba(0, 0, 0, .15));
    z-index: 60;
    overflow: hidden;
}

/* Prototype header: flex, space-between, padding 14px 16px,
   borderBottom 1px solid border */
.notif-header[b-g8ihutmygj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
}

/* Prototype title: fontSize 14, fontWeight 600, fontFamily J (heading) */
.notif-title[b-g8ihutmygj] {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-heading);
}

/* Prototype count badge: marginLeft 6, padding 1px 7px, borderRadius 10,
   background bad, color #fff, fontSize 10, fontWeight 600 */
.notif-count[b-g8ihutmygj] {
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 10px;
    background: var(--danger, #EF4444);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
}

/* Prototype mark all read: fontSize 11, color primary, cursor pointer, fontWeight 500 */
.notif-mark-all[b-g8ihutmygj] {
    font-size: 11px;
    color: var(--primary);
    cursor: pointer;
    font-weight: 500;
    background: none;
    border: none;
    padding: 0;
    font-family: inherit;
}

.notif-mark-all:hover[b-g8ihutmygj] {
    text-decoration: underline;
}

/* Prototype list: maxHeight 300, overflowY auto */
.notif-list[b-g8ihutmygj] {
    max-height: 300px;
    overflow-y: auto;
}

/* Prototype empty state: padding 32px 16px, textAlign center */
.notif-empty[b-g8ihutmygj] {
    padding: 32px 16px;
    text-align: center;
}

.notif-empty-icon[b-g8ihutmygj] {
    font-size: 24px;
    color: var(--textMuted);
}

.notif-empty-text[b-g8ihutmygj] {
    font-size: 13px;
    color: var(--textMuted);
    margin-top: 8px;
}

/* Prototype item: flex, gap 10, padding 12px 16px,
   borderBottom 1px solid border (except last),
   background transparent (read) or surfAlt (unread),
   cursor pointer, transition background .1s */
.notif-item[b-g8ihutmygj] {
    display: flex;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    background: transparent;
    cursor: pointer;
    transition: background 100ms ease;
}

.notif-item:hover[b-g8ihutmygj] {
    background: var(--surfaceAlt);
}

.notif-item-unread[b-g8ihutmygj] {
    background: var(--surfaceAlt);
}

.notif-item-last[b-g8ihutmygj] {
    border-bottom: none;
}

/* Prototype dot: 8x8, borderRadius 50%, marginTop 5, flexShrink 0 */
.notif-dot[b-g8ihutmygj] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 5px;
    flex-shrink: 0;
}

.notif-dot-read[b-g8ihutmygj] {
    background: transparent;
}

.notif-dot-warn[b-g8ihutmygj] {
    background: var(--warning, #F59E0B);
}

.notif-dot-ok[b-g8ihutmygj] {
    background: var(--success, #10B981);
}

.notif-dot-info[b-g8ihutmygj] {
    background: var(--primary);
}

/* Content section */
.notif-content[b-g8ihutmygj] {
    flex: 1;
    min-width: 0;
}

/* Prototype item title: fontSize 13, fontWeight 400 (read) or 600 (unread),
   color text, marginBottom 2 */
.notif-item-title[b-g8ihutmygj] {
    font-size: 13px;
    font-weight: 400;
    color: var(--textPrimary);
    margin-bottom: 2px;
}

.notif-item-title-unread[b-g8ihutmygj] {
    font-weight: 600;
}

/* Prototype item desc: fontSize 12, color textSec, lineHeight 1.4, marginBottom 4 */
.notif-item-desc[b-g8ihutmygj] {
    font-size: 12px;
    color: var(--textSecondary);
    line-height: 1.4;
    margin-bottom: 4px;
}

/* Prototype item time: fontSize 11, color textMut */
.notif-item-time[b-g8ihutmygj] {
    font-size: 11px;
    color: var(--textMuted);
}

/* Prototype dismiss: 20x20, borderRadius 6, flex center, cursor pointer,
   flexShrink 0, marginTop 2, opacity .4, hover opacity 1 */
.notif-dismiss[b-g8ihutmygj] {
    width: 20px;
    height: 20px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    margin-top: 2px;
    opacity: 0.4;
    background: none;
    border: none;
    padding: 0;
    color: var(--textMuted);
    transition: opacity 100ms ease;
}

.notif-dismiss:hover[b-g8ihutmygj] {
    opacity: 1;
}

/* Mobile: width 280 */
@media (max-width: 639px) {
    .notif-panel[b-g8ihutmygj] {
        width: 280px;
    }
}
/* /Components/Shared/NutriScoreBadge.razor.rz.scp.css */
.nutri-badge[b-jngkum6bn2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    line-height: 1;
    flex-shrink: 0;
}
/* /Components/Shared/PillPicker.razor.rz.scp.css */
.pill-picker[b-ghc1h4q779] {
    display: inline-flex;
    gap: 2px;
    background: var(--surfaceAlt);
    border-radius: 12px;
    padding: 4px;
    position: relative;
    border: 1px solid var(--border);
    flex-shrink: 0;
}

.pill-picker-indicator[b-ghc1h4q779] {
    position: absolute;
    top: 4px;
    height: calc(100% - 8px);
    background: var(--surface);
    border-radius: 9px;
    transition: left 0.25s cubic-bezier(0.4, 0, 0.2, 1), width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--border);
    pointer-events: none;
}

.pill-picker-btn[b-ghc1h4q779] {
    padding: 6px 14px;
    border-radius: 9px;
    border: none;
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    background: transparent;
    color: var(--textMuted);
    transition: color 0.2s;
    position: relative;
    z-index: 1;
    white-space: nowrap;
    letter-spacing: -0.01em;
}

.pill-picker-btn-active[b-ghc1h4q779] {
    font-weight: 600;
    color: var(--textPrimary);
}

.pill-picker-btn:hover:not(.pill-picker-btn-active)[b-ghc1h4q779] {
    color: var(--textSecondary);
}

/* Size variant: sm */
.pill-picker-sm .pill-picker-btn[b-ghc1h4q779] {
    padding: 6px 14px;
    font-size: 11px;
}

/* Size variant: md */
.pill-picker-md .pill-picker-btn[b-ghc1h4q779] {
    padding: 8px 18px;
    font-size: 12px;
}

@media (max-width: 600px) {
    .pill-picker-sm .pill-picker-btn[b-ghc1h4q779] {
        padding: 5px 10px;
        font-size: 10px;
    }

    .pill-picker-md .pill-picker-btn[b-ghc1h4q779] {
        padding: 6px 12px;
        font-size: 11px;
    }
}
/* /Components/Shared/TimePicker.razor.rz.scp.css */
.tp-wrap[b-ts2mj2w9vs] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.tp-num[b-ts2mj2w9vs] {
    width: 60px !important;
    text-align: center;
    padding-left: 6px !important;
    padding-right: 6px !important;
}

.tp-sep[b-ts2mj2w9vs] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--textSecondary);
    user-select: none;
}

.tp-ampm[b-ts2mj2w9vs] {
    display: flex;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    overflow: hidden;
    margin-left: 4px;
}

.tp-ampm-btn[b-ts2mj2w9vs] {
    padding: 0 12px;
    min-height: 40px;
    border: none;
    background: var(--secondaryBg);
    color: var(--textMuted);
    font-size: 12px;
    font-weight: 400;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.tp-ampm-btn + .tp-ampm-btn[b-ts2mj2w9vs] {
    border-left: 1px solid var(--border);
}

.tp-ampm-active[b-ts2mj2w9vs] {
    background: var(--primary);
    color: #fff;
}
/* /Components/SideBar.razor.rz.scp.css */
a[b-g9cke8562z] {
    text-decoration: none;
}

/* ================================
   Overlay - sibling of sidebar
   Prototype: position fixed, inset 0, rgba(0,0,0,.4), zIndex 40
================================ */

.sb-overlay[b-g9cke8562z] {
    display: none;
}

/* ================================
   Sidebar - single element
   Desktop: static in flex, width 240, overflow visible
   Mobile/tablet: fixed, slides via left, width 240/260
================================ */

.sb[b-g9cke8562z] {
    background: var(--surface);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    height: 100dvh;
    width: 240px;
    overflow: visible;
    color: var(--textPrimary);
}

/* ================================
   Brand
   Prototype: padding 20, flex row, gap 12, flexShrink 0, whiteSpace nowrap
================================ */

.sb-top[b-g9cke8562z] {
    padding: 16px 12px;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    white-space: nowrap;
}

.sb-brand[b-g9cke8562z] {
    display: flex;
    align-items: center;
    color: inherit;
    min-width: 0;
}

.sb-brand-logo[b-g9cke8562z] {
    height: 52px;
    width: auto;
}

/* ================================
   Nav links
   Prototype: flex 1, overflowY auto, padding "8px 12px"
================================ */

.sb-links[b-g9cke8562z] {
    display: flex;
    flex-direction: column;
    padding: 8px 12px;
    min-width: 0;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.sb-section-label[b-g9cke8562z] {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--textMuted);
    padding: 14px 10px 6px;
    font-weight: 500;
    white-space: nowrap;
    font-family: var(--font-heading);
}

/* Prototype link: flex, gap 10, padding 9px 12px, borderRadius 10, fontSize 13,
   borderLeft 3px solid transparent, marginBottom 2, whiteSpace nowrap */
.sb-link[b-g9cke8562z] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 10px;
    font-size: 13px;
    font-family: var(--font-body);
    color: var(--textSecondary);
    font-weight: 400;
    border-left: 3px solid transparent;
    transition: background 150ms ease, color 150ms ease;
    margin-bottom: 2px;
    white-space: nowrap;
}

.sb-link:hover[b-g9cke8562z] {
    background: var(--surfaceAlt);
}

/* Prototype active: background primary+18 (~9%), color primaryDk, fontWeight 600,
   borderLeft 3px solid primary */
.sb-link.active[b-g9cke8562z] {
    background: color-mix(in srgb, var(--primary) 9%, transparent);
    color: var(--primaryDark);
    font-weight: 600;
    border-left-color: var(--primary);
}

[b-g9cke8562z] .sb-link.active .sb-link-icon {
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.sb-link-icon[b-g9cke8562z] {
    font-size: 18px;
    flex-shrink: 0;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
    transition: font-variation-settings 150ms ease;
}

/* ================================
   Footer
   Prototype: padding 12, borderTop 1px solid border, flexShrink 0
================================ */

.sb-footer[b-g9cke8562z] {
    flex-shrink: 0;
    padding: 12px;
    border-top: 1px solid var(--border);
}

/* Prototype logout: flex, gap 10, width 100%, padding 9px 12px, borderRadius 10,
   no border, transparent, textMut, fontSize 13, marginBottom 4, whiteSpace nowrap */
.sb-logout-btn[b-g9cke8562z] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    background: transparent;
    color: var(--textMuted);
    font-size: 13px;
    font-family: var(--font-body);
    transition: all 150ms ease;
    margin-bottom: 4px;
    white-space: nowrap;
}

.sb-logout-btn:hover[b-g9cke8562z] {
    background: var(--surfaceAlt);
    color: var(--danger);
}

/* Prototype user: flex, gap 10, padding 8, borderRadius 10, cursor pointer, whiteSpace nowrap */
.sb-user[b-g9cke8562z] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    border-radius: 10px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease;
}

.sb-user:hover[b-g9cke8562z] {
    background: var(--surfaceAlt);
}

/* Prototype avatar: 32x32, borderRadius 10, gradient, fontSize 13, fontWeight 600, color #fff */
.sb-avatar[b-g9cke8562z] {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    flex-shrink: 0;
    background: linear-gradient(135deg, #D97706, #F59E0B);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
}

.sb-user-info[b-g9cke8562z] {
    flex: 1;
    overflow: hidden;
}

/* Prototype name: fontSize 13, fontWeight 500 */
.sb-user-name[b-g9cke8562z] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textPrimary);
}

/* Prototype email: fontSize 11, textMut */
.sb-user-email[b-g9cke8562z] {
    font-size: 11px;
    color: var(--textMuted);
}

/* ================================
   Dark mode active link override
   Prototype: dark mode active uses primary instead of primaryDk
================================ */

@media (prefers-color-scheme: dark) {
    .sb-link.active[b-g9cke8562z] {
        color: var(--primary);
    }
}

:global(.theme-dark) .sb-link.active[b-g9cke8562z] {
    color: var(--primary);
}

/* ================================
   Responsive: below desktop (< 1024px)
   Prototype: position fixed, left so?0:isMob?-270:-240, top 0, bottom 0,
   zIndex 50, width isMob?260:240, transition left .25s ease,
   boxShadow so?shLg:"none", overflow hidden
================================ */

@media (max-width: 1023px) {
    .sb-overlay[b-g9cke8562z] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, .4);
        z-index: 40;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.25s ease;
    }

    .sb-overlay.open[b-g9cke8562z] {
        opacity: 1;
        pointer-events: auto;
    }

    .sb[b-g9cke8562z] {
        position: fixed;
        left: -240px;
        top: 0;
        bottom: 0;
        z-index: 50;
        width: 240px;
        transition: left 0.25s ease, box-shadow 0.25s ease;
        box-shadow: none;
        overflow: hidden;
    }

    .sb.sb-open[b-g9cke8562z] {
        left: 0;
        box-shadow: var(--shadowLg);
    }
}

/* Mobile: narrower sidebar at -270, width 260 */
@media (max-width: 639px) {
    .sb[b-g9cke8562z] {
        left: -270px;
        width: 260px;
    }

    .sb.sb-open[b-g9cke8562z] {
        left: 0;
    }
}
/* /Components/ThemeToggle.razor.rz.scp.css */
.theme-toggle-btn[b-gcvakx6bcc] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--textSecondary);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
    flex-shrink: 0;
    padding: 0;
}

.theme-toggle-btn:hover[b-gcvakx6bcc] {
    background: var(--surfaceAlt);
}

.theme-mode-icon[b-gcvakx6bcc] {
    font-size: 18px;
}
/* /Layout/AuthLayout.razor.rz.scp.css */
.auth-layout[b-bcz3tbaoxy] {
    min-height: 100dvh;
    background: var(--bg);
    color: var(--textPrimary);
    font-family: var(--font-body);
}
/* /Layout/GlowcyteLayout.razor.rz.scp.css */
.layout[b-26flkxak29] {
    display: flex;
    height: 100dvh;
    overflow: hidden;
    background: var(--bg);
    color: var(--textPrimary);
}

.layout-authenticated[b-26flkxak29] {
    /* Sidebar takes fixed width, rest flexes */
}

/* Topbar
   Prototype: height 56, flex, space-between, padding 0 20px,
   borderBottom 1px solid border, background surface, flexShrink 0 */
.topbar[b-26flkxak29] {
    position: fixed;
    top: 0;
    right: 0;
    left: 240px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid var(--border);
    background: var(--surface);
    z-index: 30;
}

.topbar-left[b-26flkxak29] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Prototype title: fontSize 16, fontWeight 600, fontFamily J */
.topbar-title[b-26flkxak29] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
}

.topbar-right[b-26flkxak29] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Prototype synced badge: gap 5, padding 6px 10px, borderRadius 8,
   background okBg, fontSize 11, fontWeight 500, color okTxt */
.synced-badge[b-26flkxak29] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 10px;
    border-radius: 8px;
    background: var(--successBg, var(--alertGreenBg));
    font-size: 11px;
    font-weight: 500;
    color: var(--successText, var(--alertGreenText));
}

/* Prototype synced dot: 6x6, borderRadius 50%, background ok */
.synced-dot[b-26flkxak29] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--success);
}

.synced-text[b-26flkxak29] {
    /* Hidden on mobile */
}

/* Main content area */
.main[b-26flkxak29] {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.main-authenticated[b-26flkxak29] {
    padding-top: 56px; /* Below topbar */
}

main article[b-26flkxak29] {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

/* Responsive: below desktop (< 1024px)
   Prototype: topbar left 0, hamburger visible */
@media (max-width: 1023px) {
    .topbar[b-26flkxak29] {
        left: 0;
    }
}

/* Responsive: mobile (< 640px)
   Prototype: padding 0 16px on topbar, hide "Synced" text,
   main padding 16px 16px 84px */
@media (max-width: 639px) {
    .topbar[b-26flkxak29] {
        padding: 0 16px;
    }

    .synced-text[b-26flkxak29] {
        display: none;
    }

    main article[b-26flkxak29] {
        padding: 16px 16px 84px;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
.main-shell[b-o6ozuxr8qg] {
    min-height: 100dvh;
    display: grid;
    grid-template-columns: 260px 1fr;
    background: var(--bg);
}

/* Sidebar */
.sidebar[b-o6ozuxr8qg] {
    position: sticky;
    top: 0;
    height: 100dvh;
    overflow-y: auto;
    padding: 20px 12px;
    background: var(--surface);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
}

.brand-block[b-o6ozuxr8qg] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 4px 18px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 12px;
    flex-shrink: 0;
}

.brand-logo[b-o6ozuxr8qg] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--primary), var(--primaryDark));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.brand-logo .material-symbols-outlined[b-o6ozuxr8qg] {
    font-size: 20px;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.brand-text[b-o6ozuxr8qg] {
    min-width: 0;
}

.brand-kicker[b-o6ozuxr8qg] {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--primary);
    line-height: 1;
}

.brand-title[b-o6ozuxr8qg] {
    font-size: 15px;
    font-weight: 700;
    color: var(--textPrimary);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Main content */
.main-content[b-o6ozuxr8qg] {
    min-width: 0;
    padding: 24px;
    display: flex;
    flex-direction: column;
}

/* Topbar */
.topbar[b-o6ozuxr8qg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 24px;
    flex-shrink: 0;
}

.topbar-left[b-o6ozuxr8qg] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.hamburger-btn[b-o6ozuxr8qg] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--textSecondary);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.hamburger-btn:hover[b-o6ozuxr8qg] {
    background: var(--surfaceAlt);
    border-color: var(--borderStrong);
    color: var(--primary);
}

.hamburger-btn .material-symbols-outlined[b-o6ozuxr8qg] {
    font-size: 22px;
}

.topbar-brand[b-o6ozuxr8qg] {
    display: none;
    align-items: center;
    gap: 8px;
}

.brand-logo-sm[b-o6ozuxr8qg] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--primary), var(--primaryDark));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.brand-logo-sm .material-symbols-outlined[b-o6ozuxr8qg] {
    font-size: 16px;
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.brand-kicker-sm[b-o6ozuxr8qg] {
    font-size: 14px;
    font-weight: 800;
    color: var(--primary);
    letter-spacing: .04em;
}

.topbar-actions[b-o6ozuxr8qg] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.avatar[b-o6ozuxr8qg] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accentGlow), var(--primary));
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    cursor: pointer;
    box-shadow: 0 0 0 2px var(--surface), 0 0 0 3px var(--border);
    transition: box-shadow 150ms ease;
    flex-shrink: 0;
}

.avatar:hover[b-o6ozuxr8qg] {
    box-shadow: 0 0 0 2px var(--surface), 0 0 0 3px var(--primary);
}

.avatar .material-symbols-outlined[b-o6ozuxr8qg] {
    font-size: 20px;
}

/* Content body */
.content-body[b-o6ozuxr8qg] {
    flex: 1;
    display: grid;
    gap: 20px;
    align-content: start;
}

/* Mobile drawer backdrop */
.drawer-backdrop[b-o6ozuxr8qg] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.40);
    backdrop-filter: blur(2px);
    z-index: 99;
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
}

.drawer-backdrop.open[b-o6ozuxr8qg] {
    opacity: 1;
    pointer-events: auto;
}

/* Mobile nav drawer */
.mobile-drawer[b-o6ozuxr8qg] {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 280px;
    background: var(--surface);
    border-right: 1px solid var(--border);
    z-index: 100;
    padding: 16px 12px;
    transform: translateX(-100%);
    transition: transform 220ms cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--border) transparent;
}

.mobile-drawer.open[b-o6ozuxr8qg] {
    transform: translateX(0);
}

.drawer-header[b-o6ozuxr8qg] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 12px;
    flex-shrink: 0;
}

.drawer-close[b-o6ozuxr8qg] {
    margin-left: auto;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 150ms ease, color 150ms ease;
}

.drawer-close:hover[b-o6ozuxr8qg] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.drawer-close .material-symbols-outlined[b-o6ozuxr8qg] {
    font-size: 18px;
}

@media (max-width: 960px) {
    .main-shell[b-o6ozuxr8qg] {
        grid-template-columns: 1fr;
    }

    .sidebar[b-o6ozuxr8qg] {
        display: none;
    }

    .hamburger-btn[b-o6ozuxr8qg] {
        display: inline-flex;
    }

    .topbar-brand[b-o6ozuxr8qg] {
        display: flex;
    }

    .main-content[b-o6ozuxr8qg] {
        padding: 16px;
    }

    .topbar[b-o6ozuxr8qg] {
        margin-bottom: 20px;
    }
}
/* /Pages/Admin/Index.razor.rz.scp.css */
.admin-heading[b-xfh45lxaiu] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin: 0 0 6px;
}

.admin-subtitle[b-xfh45lxaiu] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 0 0 20px;
}

[b-xfh45lxaiu] .admin-home-grid {
    gap: 14px;
}

[b-xfh45lxaiu] .admin-tile {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

[b-xfh45lxaiu] .admin-tile:hover {
    border-color: var(--primary);
    box-shadow: var(--shadowMd);
}

.tile-icon[b-xfh45lxaiu] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: color-mix(in srgb, var(--primary) 8%, transparent);
    color: var(--primary);
}

.tile-content[b-xfh45lxaiu] {
    flex: 1;
    min-width: 0;
}

.tile-title-row[b-xfh45lxaiu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}

.tile-title[b-xfh45lxaiu] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
}

.tile-count[b-xfh45lxaiu] {
    font-size: 12px;
    font-family: var(--font-mono);
    color: var(--textMuted);
    background: var(--surfaceAlt);
    padding: 2px 8px;
    border-radius: 6px;
    line-height: 1;
}

.tile-desc[b-xfh45lxaiu] {
    font-size: 13px;
    color: var(--textSecondary);
    line-height: 1.5;
}
/* /Pages/Exercise.razor.rz.scp.css */
/* ── Page layout ── */
.exercise-page[b-bl91pfd4ih] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ── Header ── */
.exercise-header[b-bl91pfd4ih] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2px;
    flex-wrap: wrap;
    gap: 10px;
}

.exercise-title[b-bl91pfd4ih] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0;
}

/* ── Filter card ── */
.filter-card[b-bl91pfd4ih] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.search-wrap[b-bl91pfd4ih] {
    flex: 1;
    min-width: 180px;
    position: relative;
}

.search-icon[b-bl91pfd4ih] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    color: var(--textMuted);
    pointer-events: none;
}

.search-input[b-bl91pfd4ih] {
    width: 100%;
    padding: 10px 12px 10px 38px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--surface);
    color: var(--textPrimary);
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
}

.search-input:focus[b-bl91pfd4ih] {
    border-color: var(--primary);
}

.search-input[b-bl91pfd4ih]::placeholder {
    color: var(--textMuted);
}

/* ── Table card ── */
.table-card[b-bl91pfd4ih] {
    padding: 0;
    overflow: hidden;
}

/* ── CSS Grid: 7 columns ── */
.grid-header[b-bl91pfd4ih] {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 80px 80px 90px 72px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    color: var(--textMuted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: var(--surfaceAlt);
}

.grid-body[b-bl91pfd4ih] {
    max-height: 500px;
    overflow-y: auto;
}

.grid-row[b-bl91pfd4ih] {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 80px 80px 90px 72px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    transition: background 100ms ease;
}

.grid-row:last-child[b-bl91pfd4ih] {
    border-bottom: none;
}

.grid-row:hover[b-bl91pfd4ih] {
    background: var(--surfaceAlt);
}

/* ── Column styles ── */
.col-exercise-name[b-bl91pfd4ih] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.col-exercise-time[b-bl91pfd4ih] {
    font-size: 12px;
    color: var(--textMuted);
    margin-top: 2px;
}

.col-duration[b-bl91pfd4ih] {
    font-size: 14px;
    color: var(--textPrimary);
}

.col-glucose[b-bl91pfd4ih] {
    font-family: var(--font-mono);
    font-weight: 500;
    font-size: 14px;
    color: var(--textPrimary);
}

.col-glucose-empty[b-bl91pfd4ih] {
    font-family: var(--font-mono);
    font-size: 14px;
    color: var(--textMuted);
}

/* ── Intensity badge ── */
.intensity-tag[b-bl91pfd4ih] {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
}

.intensity-light[b-bl91pfd4ih] {
    background: var(--alertGreenBg);
    color: var(--alertGreenText);
}

.intensity-moderate[b-bl91pfd4ih] {
    background: var(--alertAmberBg);
    color: var(--alertAmberText);
}

.intensity-high[b-bl91pfd4ih] {
    background: var(--alertRoseBg);
    color: var(--alertRoseText);
}

/* ── Change badge ── */
.change-badge[b-bl91pfd4ih] {
    display: inline-flex;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background: var(--alertGreenBg);
    color: var(--alertGreenText);
}

/* ── Actions column ── */
.col-actions[b-bl91pfd4ih] {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.action-btn[b-bl91pfd4ih] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
    color: var(--textMuted);
    text-decoration: none;
    padding: 0;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.action-btn:hover[b-bl91pfd4ih] {
    background: var(--border);
    color: var(--textPrimary);
}

.action-btn-delete:hover[b-bl91pfd4ih] {
    background: var(--dangerBg);
    color: var(--dangerText);
    border-color: var(--dangerBg);
}

.action-btn .material-symbols-outlined[b-bl91pfd4ih] {
    font-size: 13px;
}

/* ── Mobile row ── */
.mobile-row[b-bl91pfd4ih] {
    display: none;
}

/* ── Empty / error states ── */
.empty-state[b-bl91pfd4ih] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 48px 20px;
    text-align: center;
}

.empty-icon-wrap[b-bl91pfd4ih] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--surfaceAlt);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 6px;
}

.empty-icon-wrap .material-symbols-outlined[b-bl91pfd4ih] {
    font-size: 22px;
    color: var(--textMuted);
}

.empty-title[b-bl91pfd4ih] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    font-family: var(--font-heading);
}

.empty-sub[b-bl91pfd4ih] {
    font-size: 13px;
    color: var(--textMuted);
}

.error-banner[b-bl91pfd4ih] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-radius: var(--radiusMd);
    background: var(--dangerBg);
    border: 1px solid var(--dangerBg);
    color: var(--dangerText);
    font-size: 14px;
    margin: 16px;
}

/* ── Skeleton ── */
.skeleton[b-bl91pfd4ih] {
    border-radius: 4px;
    background: var(--border);
    animation: skeleton-pulse-b-bl91pfd4ih 1.4s ease-in-out infinite;
}

.skeleton-xs[b-bl91pfd4ih] {
    width: 40px;
    height: 14px;
}

.skeleton-sm[b-bl91pfd4ih] {
    width: 60px;
    height: 14px;
}

.skeleton-md[b-bl91pfd4ih] {
    width: 100px;
    height: 14px;
}

@keyframes skeleton-pulse-b-bl91pfd4ih {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}

/* ── Delete dialog ── */
.del-backdrop[b-bl91pfd4ih] {
    position: fixed;
    inset: 0;
    z-index: 600;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 72px;
}

.del-dialog[b-bl91pfd4ih] {
    width: 100%;
    max-width: 400px;
    padding: 28px 24px 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.del-icon[b-bl91pfd4ih] {
    font-size: 36px;
    color: var(--danger);
    opacity: 0.85;
}

.del-title[b-bl91pfd4ih] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.del-body[b-bl91pfd4ih] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--textSecondary);
    line-height: 1.5;
}

.del-actions[b-bl91pfd4ih] {
    display: flex;
    gap: 10px;
    margin-top: 6px;
    width: 100%;
    justify-content: center;
}

.del-btn[b-bl91pfd4ih] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 20px;
    border-radius: var(--radiusSm);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 150ms ease, border-color 150ms ease;
    flex: 1;
    max-width: 160px;
}

.del-btn:disabled[b-bl91pfd4ih] {
    opacity: 0.6;
    cursor: not-allowed;
}

.del-btn-cancel[b-bl91pfd4ih] {
    background: var(--surface);
    border-color: var(--border);
    color: var(--textSecondary);
}

.del-btn-cancel:hover:not(:disabled)[b-bl91pfd4ih] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.del-btn-delete[b-bl91pfd4ih] {
    background: var(--danger);
    border-color: var(--danger);
    color: #fff;
}

.del-btn-delete:hover:not(:disabled)[b-bl91pfd4ih] {
    opacity: 0.88;
}

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

.del-spin[b-bl91pfd4ih] {
    font-size: 18px;
    animation: del-spin-b-bl91pfd4ih 0.9s linear infinite;
    display: inline-block;
}

/* ══════════════════════════════════════════
   RESPONSIVE: mobile (<768px)
   ══════════════════════════════════════════ */
@media (max-width: 767px) {
    .grid-header[b-bl91pfd4ih],
    .desktop-row[b-bl91pfd4ih] {
        display: none;
    }

    .grid-body[b-bl91pfd4ih] {
        max-height: none;
    }

    .mobile-row[b-bl91pfd4ih] {
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--border);
    }

    .mobile-row:last-child[b-bl91pfd4ih] {
        border-bottom: none;
    }

    .mobile-row-content[b-bl91pfd4ih] {
        flex: 1;
        min-width: 0;
        padding: 14px 8px 14px 16px;
        cursor: pointer;
        transition: background 100ms ease;
    }

    .mobile-row-content:active[b-bl91pfd4ih] {
        background: var(--surfaceAlt);
    }

    .mobile-top[b-bl91pfd4ih] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 4px;
    }

    .mobile-exercise[b-bl91pfd4ih] {
        font-size: 14px;
        font-weight: 500;
        color: var(--textPrimary);
    }

    .mobile-bottom[b-bl91pfd4ih] {
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .mobile-detail[b-bl91pfd4ih] {
        font-size: 12px;
        color: var(--textSecondary);
    }

    .mobile-sep[b-bl91pfd4ih] {
        font-size: 12px;
        color: var(--textMuted);
    }

    .mobile-time[b-bl91pfd4ih] {
        font-size: 12px;
        color: var(--textMuted);
    }

    .mobile-delete-btn[b-bl91pfd4ih] {
        flex-shrink: 0;
        width: 34px;
        height: 34px;
        margin-right: 10px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        background: transparent;
        border: 1px solid transparent;
        color: var(--textMuted);
        padding: 0;
        transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    }

    .mobile-delete-btn:active[b-bl91pfd4ih] {
        background: var(--dangerBg);
        color: var(--dangerText);
        border-color: var(--dangerBg);
    }

    .mobile-delete-btn .material-symbols-outlined[b-bl91pfd4ih] {
        font-size: 18px;
    }

    .exercise-title[b-bl91pfd4ih] {
        font-size: 18px;
    }

    .filter-card[b-bl91pfd4ih] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-wrap[b-bl91pfd4ih] {
        min-width: 0;
    }

}
/* /Pages/Forbidden.razor.rz.scp.css */
.fb-page[b-8185g4702v] {
    min-height: 100dvh;
    background: var(--bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    position: relative;
    overflow: hidden;
}

/* -- Background locked grid -------------------------------------- */
.fb-bg-grid[b-8185g4702v] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.fb-bg-icon[b-8185g4702v] {
    position: absolute;
}

/* -- Main cell illustration -------------------------------------- */
.fb-cell-wrap[b-8185g4702v] {
    position: relative;
    width: 160px;
    height: 160px;
    margin-bottom: 32px;
}

.fb-cell-svg[b-8185g4702v] {
    width: 100%;
    height: 100%;
}

.fb-code-overlay[b-8185g4702v] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 40px;
}

.fb-code-text[b-8185g4702v] {
    font-family: var(--font-mono);
    font-size: 28.8px;
    font-weight: 700;
    color: var(--danger);
    opacity: 0.2;
    letter-spacing: -1px;
}

/* -- Content ----------------------------------------------------- */
.fb-content[b-8185g4702v] {
    text-align: center;
    max-width: 420px;
    position: relative;
    z-index: 1;
}

.fb-heading[b-8185g4702v] {
    font-size: 28px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0 0 8px;
}

.fb-desc[b-8185g4702v] {
    font-size: 14px;
    color: var(--textSecondary);
    line-height: 1.6;
    margin: 0 0 8px;
}

.fb-badge[b-8185g4702v] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 10px;
    background: var(--dangerBg);
    margin-bottom: 24px;
}

.fb-badge span[b-8185g4702v] {
    font-size: 12px;
    font-weight: 600;
    color: var(--dangerText);
}

.fb-actions[b-8185g4702v] {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

/* -- Button (match prototype GcBtn exactly) ---------------------- */
.fb-btn-primary[b-8185g4702v] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 20px;
    background: var(--primary);
    color: var(--primaryFg);
    border: 1.5px solid var(--primary);
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none;
}

.fb-btn-primary:hover[b-8185g4702v] {
    background: var(--primaryDark);
}

/* -- Footer ------------------------------------------------------ */
.fb-footer[b-8185g4702v] {
    margin-top: 40px;
    font-size: 12px;
    color: var(--textMuted);
    text-align: center;
    position: relative;
    z-index: 1;
}

.fb-footer-code[b-8185g4702v] {
    font-family: var(--font-mono);
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 600px) {
    .fb-cell-wrap[b-8185g4702v] {
        width: 120px;
        height: 120px;
    }

    .fb-code-overlay[b-8185g4702v] {
        padding-top: 30px;
    }

    .fb-code-text[b-8185g4702v] {
        font-size: 21.6px;
    }

    .fb-heading[b-8185g4702v] {
        font-size: 22px;
    }
}
/* /Pages/ForgotPassword.razor.rz.scp.css */
.forgot-page[b-d876fm8rcn] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100dvh;
    padding: 24px;
    background: var(--bg);
}

.forgot-card[b-d876fm8rcn] {
    width: 100%;
    max-width: 420px;
    margin-top: -4vh;
    text-align: center;
}

/* Icon */
.forgot-icon[b-d876fm8rcn] {
    width: 56px;
    height: 56px;
    border-radius: var(--radiusMd);
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.forgot-icon .material-symbols-outlined[b-d876fm8rcn] {
    font-size: 26px;
    color: var(--primary);
}

.forgot-icon--success[b-d876fm8rcn] {
    background: var(--successBg);
    border-color: var(--alertGreenBorder);
}

.forgot-icon--success .material-symbols-outlined[b-d876fm8rcn] {
    color: var(--success);
}

/* Header */
.forgot-header[b-d876fm8rcn] {
    margin-bottom: 24px;
}

.forgot-header h1[b-d876fm8rcn] {
    font-size: 22px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0 0 8px;
}

.forgot-header p[b-d876fm8rcn] {
    font-size: 14px;
    color: var(--textMuted);
    line-height: 1.5;
    margin: 0;
}

.forgot-header strong[b-d876fm8rcn] {
    color: var(--textPrimary);
    font-weight: 600;
}

/* Form card */
.forgot-form-card[b-d876fm8rcn] {
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 28px;
}

/* Form */
.forgot-form[b-d876fm8rcn] {
    text-align: left;
    margin-bottom: 16px;
}

/* Error alert */
.forgot-error[b-d876fm8rcn] {
    width: 100%;
    color: var(--alertRoseText);
    padding: 12px 14px;
    border-radius: var(--radiusSm);
    border: 1px solid var(--alertRoseBorder);
    background: var(--alertRoseBg);
    font-size: 13px;
    margin-bottom: 8px;
}

/* Back to login link (step 1) */
.forgot-back[b-d876fm8rcn] {
    margin-top: 16px;
    font-size: 13px;
}

.forgot-back a[b-d876fm8rcn] {
    color: var(--primary);
    font-weight: 500;
    text-decoration: none;
}

.forgot-back a:hover[b-d876fm8rcn] {
    text-decoration: underline;
}

/* Retry section (step 2) */
.forgot-retry[b-d876fm8rcn] {
    font-size: 13px;
    color: var(--textMuted);
    margin-bottom: 20px;
}

.retry-link[b-d876fm8rcn] {
    color: var(--primary);
    font-weight: 500;
    text-decoration: none;
}

.retry-link:hover[b-d876fm8rcn] {
    text-decoration: underline;
}

/* Back to login button wrapper (step 2) */
.forgot-back-btn[b-d876fm8rcn] {
    display: block;
    text-decoration: none;
}

/* Responsive: mobile */
@media (max-width: 639px) {
    .forgot-page[b-d876fm8rcn] {
        padding: 20px 16px;
    }

    .forgot-card[b-d876fm8rcn] {
        margin-top: 0;
    }
}
/* /Pages/Logbook.razor.rz.scp.css */
/* ── Page layout ── */
.readings-page[b-opjrwx9lxk] {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 0;
}

/* ── Header row ── */
.readings-header[b-opjrwx9lxk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 10px;
    flex-shrink: 0;
}

.readings-title[b-opjrwx9lxk] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0;
}

.readings-header .material-symbols-outlined[b-opjrwx9lxk] {
    font-size: 18px;
}

/* ── Search + filter card ── */
.search-card[b-opjrwx9lxk] {
    margin-bottom: 14px;
    flex-shrink: 0;
}

.search-filter-row[b-opjrwx9lxk] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.search-wrap[b-opjrwx9lxk] {
    flex: 1;
    min-width: 180px;
    position: relative;
}

.search-icon[b-opjrwx9lxk] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--textMuted);
    font-size: 20px;
    pointer-events: none;
    user-select: none;
}

.search-input[b-opjrwx9lxk] {
    padding-left: 42px;
    padding-right: 40px;
}

.search-clear[b-opjrwx9lxk] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--textMuted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: var(--radiusSm);
    transition: background 150ms ease, color 150ms ease;
    padding: 0;
}

.search-clear:hover[b-opjrwx9lxk] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.search-clear .material-symbols-outlined[b-opjrwx9lxk] {
    font-size: 18px;
}

/* ── Pill filter (segmented control) ── */
.pills-wrap[b-opjrwx9lxk] {
    display: inline-flex;
    gap: 2px;
    background: var(--surfaceAlt);
    border-radius: 12px;
    padding: 4px;
    border: 1px solid var(--border);
    flex-shrink: 0;
    position: relative;
}

.pill-indicator[b-opjrwx9lxk] {
    position: absolute;
    top: 4px;
    left: 4px;
    height: calc(100% - 8px);
    width: calc(100% / 4 - 2px);
    background: var(--surface);
    border-radius: 9px;
    border: 1px solid var(--border);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.06);
    transform: translateX(calc(var(--pill-index) * 100%));
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.pill-btn[b-opjrwx9lxk] {
    flex: 1;
    padding: 6px 14px;
    border-radius: 9px;
    border: none;
    font-size: 11px;
    font-weight: 400;
    cursor: pointer;
    background: transparent;
    color: var(--textMuted);
    position: relative;
    z-index: 1;
    white-space: nowrap;
    font-family: var(--font-body);
    transition: color 200ms ease, background 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
    white-space: nowrap;
    letter-spacing: -0.01em;
    position: relative;
}

.pill-btn:hover[b-opjrwx9lxk] {
    color: var(--textSecondary);
}

.pill-active[b-opjrwx9lxk] {
    font-weight: 600;
    color: var(--textPrimary);
}

/* ── Table card ── */
.table-card[b-opjrwx9lxk] {
    padding: 0 !important;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ── Grid header (desktop) ── */
.grid-header[b-opjrwx9lxk] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr 72px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    color: var(--textMuted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

/* ── Grid body (scrollable) ── */
.grid-body[b-opjrwx9lxk] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

/* ── Desktop row ── */
.grid-row[b-opjrwx9lxk],
.desktop-row[b-opjrwx9lxk] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr 72px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    transition: background 100ms ease;
}

.grid-row:last-child[b-opjrwx9lxk],
.desktop-row:last-child[b-opjrwx9lxk] {
    border-bottom: none;
}

.desktop-row:hover[b-opjrwx9lxk] {
    background: var(--surfaceAlt);
}

/* ── Mobile row (hidden on desktop) ── */
.mobile-row[b-opjrwx9lxk] {
    display: none;
}

/* ── Column: Reading (context + time) ── */
.reading-context[b-opjrwx9lxk] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.reading-time[b-opjrwx9lxk] {
    font-size: 12px;
    color: var(--textMuted);
    margin-top: 2px;
}

/* ── Column: Value ── */
.col-value[b-opjrwx9lxk] {
    font-family: var(--font-mono);
    font-size: 15px;
    font-weight: 600;
    color: var(--textPrimary);
}

.col-value.value-high[b-opjrwx9lxk] {
    color: var(--warning);
}

.col-value.value-low[b-opjrwx9lxk] {
    color: var(--danger);
}

.value-unit[b-opjrwx9lxk] {
    font-size: 11px;
    font-weight: 400;
    color: var(--textMuted);
}

/* ── Column: Status badge ── */
.status-badge[b-opjrwx9lxk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    font-family: var(--font-body);
    white-space: nowrap;
}

.status-badge.status-ok[b-opjrwx9lxk] {
    background: var(--successBg);
    color: var(--successText);
}

.status-badge.status-high[b-opjrwx9lxk] {
    background: var(--warningBg);
    color: var(--warningText);
}

.status-badge.status-low[b-opjrwx9lxk] {
    background: var(--dangerBg);
    color: var(--dangerText);
}

/* ── Column: Notes ── */
.col-notes[b-opjrwx9lxk] {
    font-size: 13px;
    color: var(--textSecondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Column: Edit button ── */
.col-actions[b-opjrwx9lxk] {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.action-btn[b-opjrwx9lxk] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
    color: var(--textMuted);
    text-decoration: none;
    padding: 0;
    text-decoration: none;
    transition: background 150ms ease, color 150ms ease;
}

.action-btn:hover[b-opjrwx9lxk] {
    background: var(--border);
    color: var(--textPrimary);
}

.action-btn-delete:hover[b-opjrwx9lxk] {
    background: var(--dangerBg);
    color: var(--dangerText);
    border-color: var(--dangerBg);
}

.action-btn .material-symbols-outlined[b-opjrwx9lxk] {
    font-size: 13px;
}

/* ── Status dot (mobile) ── */
.status-dot[b-opjrwx9lxk] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.status-dot.status-ok[b-opjrwx9lxk] {
    background: var(--success);
}

.status-dot.status-high[b-opjrwx9lxk] {
    background: var(--warning);
}

.status-dot.status-low[b-opjrwx9lxk] {
    background: var(--danger);
}

/* ── Empty state ── */
.empty-state[b-opjrwx9lxk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 48px 20px;
}

.empty-icon-wrap[b-opjrwx9lxk] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--surfaceAlt);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.empty-icon-wrap .material-symbols-outlined[b-opjrwx9lxk] {
    font-size: 22px;
    color: var(--textMuted);
}

.empty-title[b-opjrwx9lxk] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    margin-bottom: 4px;
    font-family: var(--font-heading);
}

.empty-sub[b-opjrwx9lxk] {
    font-size: 13px;
    color: var(--textMuted);
}

/* ── Error banner ── */
.error-banner[b-opjrwx9lxk] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-radius: var(--radiusMd);
    background: var(--dangerBg);
    border: 1px solid var(--alertRoseBorder);
    color: var(--dangerText);
    font-size: 14px;
    margin-top: 8px;
}

/* ── Skeleton loading ── */
.skeleton[b-opjrwx9lxk] {
    border-radius: 4px;
    background: var(--border);
    animation: skeleton-pulse-b-opjrwx9lxk 1.4s ease-in-out infinite;
}

.skeleton-sm[b-opjrwx9lxk] {
    width: 60px;
    height: 14px;
}

.skeleton-md[b-opjrwx9lxk] {
    width: 100px;
    height: 14px;
}

.skeleton-lg[b-opjrwx9lxk] {
    width: 130px;
    height: 14px;
}

.skeleton-badge[b-opjrwx9lxk] {
    width: 56px;
    height: 22px;
    border-radius: 20px;
}

.skeleton-search[b-opjrwx9lxk] {
    width: 100%;
    height: 42px;
    border-radius: 10px;
}

.skeleton-pills[b-opjrwx9lxk] {
    width: 220px;
    height: 34px;
    border-radius: 12px;
    flex-shrink: 0;
}

@keyframes skeleton-pulse-b-opjrwx9lxk {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}

/* ── Spinner ── */
.spin[b-opjrwx9lxk] {
    animation: spin-b-opjrwx9lxk 1s linear infinite;
    display: inline-block;
}

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

/* ── Loading more indicator ── */
.load-more-indicator[b-opjrwx9lxk] {
    display: flex;
    justify-content: center;
    padding: 16px 0;
    color: var(--textMuted);
}

/* ── Delete confirmation dialog ── */
.del-backdrop[b-opjrwx9lxk] {
    position: fixed;
    inset: 0;
    z-index: 600;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 72px;
}

.del-dialog[b-opjrwx9lxk] {
    width: 100%;
    max-width: 400px;
    padding: 28px 24px 24px !important;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.del-icon[b-opjrwx9lxk] {
    font-size: 36px;
    color: var(--danger);
    opacity: 0.85;
}

.del-title[b-opjrwx9lxk] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.del-body[b-opjrwx9lxk] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--textSecondary);
    line-height: 1.5;
}

.del-actions[b-opjrwx9lxk] {
    display: flex;
    gap: 10px;
    margin-top: 6px;
    width: 100%;
    justify-content: center;
}

.del-btn[b-opjrwx9lxk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 20px;
    border-radius: var(--radiusSm);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    flex: 1;
    max-width: 160px;
}

.del-btn:disabled[b-opjrwx9lxk] {
    opacity: 0.6;
    cursor: not-allowed;
}

.del-btn-cancel[b-opjrwx9lxk] {
    background: var(--surface);
    border-color: var(--border);
    color: var(--textSecondary);
}

.del-btn-cancel:hover:not(:disabled)[b-opjrwx9lxk] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.del-btn-delete[b-opjrwx9lxk] {
    background: var(--danger);
    border-color: var(--danger);
    color: #fff;
}

.del-btn-delete:hover:not(:disabled)[b-opjrwx9lxk] {
    opacity: 0.88;
}

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

.del-spin[b-opjrwx9lxk] {
    font-size: 18px;
    animation: del-spin-b-opjrwx9lxk 0.9s linear infinite;
    display: inline-block;
}

/* ══════════════════════════════════════════
   Mobile layout (<=768px)
   ══════════════════════════════════════════ */
@media (max-width: 768px) {
    /* Hide desktop elements */
    .grid-header[b-opjrwx9lxk] {
        display: none;
    }

    .desktop-row[b-opjrwx9lxk] {
        display: none;
    }

    /* Show mobile rows */
    .mobile-row[b-opjrwx9lxk] {
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--border);
    }

    .mobile-row:last-child[b-opjrwx9lxk] {
        border-bottom: none;
    }

    .mobile-row-link[b-opjrwx9lxk] {
        flex: 1;
        min-width: 0;
        display: block;
        padding: 14px 8px 14px 16px;
        text-decoration: none;
        color: inherit;
        cursor: pointer;
        transition: background 100ms ease;
    }

    .mobile-row-link:active[b-opjrwx9lxk] {
        background: var(--surfaceAlt);
    }

    .mobile-delete-btn[b-opjrwx9lxk] {
        flex-shrink: 0;
        width: 34px;
        height: 34px;
        margin-right: 10px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        background: transparent;
        border: 1px solid transparent;
        color: var(--textMuted);
        padding: 0;
        transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    }

    .mobile-delete-btn:active[b-opjrwx9lxk] {
        background: var(--dangerBg);
        color: var(--dangerText);
        border-color: var(--dangerBg);
    }

    .mobile-delete-btn .material-symbols-outlined[b-opjrwx9lxk] {
        font-size: 18px;
    }

    .mobile-top[b-opjrwx9lxk] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 4px;
    }

    .mobile-left[b-opjrwx9lxk] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .mobile-context[b-opjrwx9lxk] {
        font-size: 14px;
        font-weight: 500;
        color: var(--textPrimary);
    }

    .mobile-value[b-opjrwx9lxk] {
        font-family: var(--font-mono);
        font-size: 16px;
        font-weight: 600;
        color: var(--textPrimary);
    }

    .mobile-value.value-high[b-opjrwx9lxk] {
        color: var(--warning);
    }

    .mobile-value.value-low[b-opjrwx9lxk] {
        color: var(--danger);
    }

    .mobile-bottom[b-opjrwx9lxk] {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .mobile-time[b-opjrwx9lxk] {
        font-size: 12px;
        color: var(--textMuted);
    }

    .mobile-notes[b-opjrwx9lxk] {
        font-size: 12px;
        color: var(--textSecondary);
        margin-top: 4px;
    }

    /* Adjust search card for mobile */
    .search-filter-row[b-opjrwx9lxk] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-wrap[b-opjrwx9lxk] {
        min-width: 0;
    }

    .pills-wrap[b-opjrwx9lxk] {
        align-self: flex-start;
    }

    .readings-title[b-opjrwx9lxk] {
        font-size: 18px;
    }
}

/* ══════════════════════════════════════════
   Small mobile (<=480px)
   ══════════════════════════════════════════ */
@media (max-width: 480px) {
    .pills-wrap[b-opjrwx9lxk] {
        width: 100%;
        justify-content: center;
    }

    .pill-btn[b-opjrwx9lxk] {
        flex: 1;
        text-align: center;
        padding: 6px 8px;
    }
}
/* /Pages/LogEntry.razor.rz.scp.css */
/* Two-column layout: form left, readings panel right */
.log-layout[b-4yz0zrwzhd] {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 20px;
    align-items: start;
}

/* Readings panel - viewport-constrained so it doesn't grow past the screen */
.readings-card[b-4yz0zrwzhd] {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    max-height: calc(100svh - 40px); /* 20px top sticky offset + 20px bottom clearance */
    overflow: hidden;
}

.readings-table-wrap[b-4yz0zrwzhd] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.readings-title[b-4yz0zrwzhd] {
    font-size: 16px;
    font-weight: 700;
    color: var(--textPrimary);
    margin: 0 0 4px;
    font-family: var(--font-heading);
}

.readings-sub[b-4yz0zrwzhd] {
    color: var(--textSecondary);
    font-size: 13px;
    margin: 0 0 12px;
}

.readings-table[b-4yz0zrwzhd] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.readings-table th[b-4yz0zrwzhd] {
    text-align: left;
    font-weight: 600;
    color: var(--textSecondary);
    padding: 0 8px 8px 0;
    border-bottom: 1px solid var(--border);
    font-size: 12px;
    white-space: nowrap;
}

.readings-table td[b-4yz0zrwzhd] {
    padding: 10px 8px 10px 0;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.readings-table tr:last-child td[b-4yz0zrwzhd] {
    border-bottom: none;
}

.reading-chip[b-4yz0zrwzhd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.reading-chip.in-range[b-4yz0zrwzhd] {
    background: var(--alertGreenBg);
    border: 1px solid var(--alertGreenBorder);
    color: var(--alertGreenText);
}

.reading-chip.low[b-4yz0zrwzhd] {
    background: var(--alertAmberBg);
    border: 1px solid var(--alertAmberBorder);
    color: var(--alertAmberText);
}

.reading-chip.high[b-4yz0zrwzhd] {
    background: var(--alertRoseBg);
    border: 1px solid var(--alertRoseBorder);
    color: var(--alertRoseText);
}

.readings-empty[b-4yz0zrwzhd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 32px 16px;
    color: var(--textMuted);
    font-size: 13px;
    text-align: center;
}

.readings-empty .material-symbols-outlined[b-4yz0zrwzhd] {
    font-size: 32px;
    opacity: 0.5;
}

.log-title[b-4yz0zrwzhd] {
    font-size: 22px;
    font-weight: 800;
    color: var(--textPrimary);
    margin: 0 0 4px;
    font-family: var(--font-heading);
}

.log-sub[b-4yz0zrwzhd] {
    color: var(--textSecondary);
    font-size: 14px;
    margin: 0 0 4px;
}

/* Section labels */
.section-label[b-4yz0zrwzhd] {
    font-size: 15px;
    font-weight: 700;
    color: var(--textPrimary);
    margin: 20px 0 8px;
    font-family: var(--font-heading);
}

/* Chip container (contexts, meals, medications) */
.context-box[b-4yz0zrwzhd] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px;
    background: var(--primarySubtle);
    border-radius: var(--radiusSm);
}

/* Shared chip style */
.chip[b-4yz0zrwzhd] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: var(--radiusSm);
    border: none;
    background: var(--mainBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
    min-height: 22px;
    transition: background 150ms ease, color 150ms ease;
}

.chip:hover[b-4yz0zrwzhd] {
    color: var(--textPrimary);
}

.chip-active[b-4yz0zrwzhd] {
    background: var(--primarySubtle);
    color: var(--primary);
    font-weight: 600;
}

.chip-check[b-4yz0zrwzhd] {
    font-size: 15px;
    line-height: 1;
}

/* Glucose input with inline unit toggle */
.glucose-input-wrap[b-4yz0zrwzhd] {
    display: flex;
    align-items: center;
    padding-right: 14px;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--primarySubtle);
    transition: border-color 150ms ease;
}

.glucose-input-wrap:focus-within[b-4yz0zrwzhd] {
    border-color: var(--primary);
}

.glucose-input-wrap--error[b-4yz0zrwzhd] {
    border-color: var(--danger) !important;
}

.glucose-num-input[b-4yz0zrwzhd] {
    flex: 1;
    padding: 12px 14px;
    border: none;
    background: transparent;
    font-size: 15px;
    color: var(--textPrimary);
    outline: none;
    min-width: 0;
    font-family: var(--font-mono);
}

.glucose-num-input[b-4yz0zrwzhd]::placeholder {
    color: var(--textMuted);
}

/* Hide browser number input spinners */
.glucose-num-input[b-4yz0zrwzhd]::-webkit-outer-spin-button,
.glucose-num-input[b-4yz0zrwzhd]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.glucose-num-input[type=number][b-4yz0zrwzhd] {
    -moz-appearance: textfield;
}

.unit-btn[b-4yz0zrwzhd] {
    padding: 0 18px;
    border: none;
    border-radius: var(--radiusSm);
    background: var(--mainBg);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    min-height: 22px;
    min-width: 72px;
    transition: background 150ms ease, color 150ms ease;
}

.unit-btn:hover[b-4yz0zrwzhd] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.field-error[b-4yz0zrwzhd] {
    display: block;
    color: var(--danger);
    font-size: 12px;
    margin-top: 4px;
}

/* Meal search */
.search-wrap[b-4yz0zrwzhd] {
    position: relative;
}

.search-input[b-4yz0zrwzhd] {
    padding-right: 40px;
    width: 100%;
    box-sizing: border-box;
}

.search-icon[b-4yz0zrwzhd] {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--textMuted);
    font-size: 20px;
    pointer-events: none;
}

/* Empty state messages (no meals / no meds) */
.empty-field-msg[b-4yz0zrwzhd] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-radius: var(--radiusSm);
    background: var(--primarySubtle);
    color: var(--textMuted);
    font-size: 13px;
}

.empty-field-msg .material-symbols-outlined[b-4yz0zrwzhd] {
    font-size: 20px;
    flex-shrink: 0;
}

/* Medication dose rows */
.dose-list[b-4yz0zrwzhd] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 10px;
}

.dose-row[b-4yz0zrwzhd] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: var(--radiusMd);
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
}

.dose-name[b-4yz0zrwzhd] {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: var(--textPrimary);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dose-input-wrap[b-4yz0zrwzhd] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.dose-input[b-4yz0zrwzhd] {
    width: 72px !important;
    padding: 6px 8px !important;
    font-size: 13px !important;
    text-align: right;
}

.dose-unit[b-4yz0zrwzhd] {
    font-size: 12px;
    color: var(--textMuted);
    white-space: nowrap;
}

/* Reading row action buttons (delete) */
.r-actions-cell[b-4yz0zrwzhd] {
    text-align: right;
    padding-right: 0;
}

.r-action-btn[b-4yz0zrwzhd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radiusSm);
    background: transparent;
    color: var(--textMuted);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.r-action-btn .material-symbols-outlined[b-4yz0zrwzhd] {
    font-size: 16px;
}

.r-action-delete:hover[b-4yz0zrwzhd] {
    background: var(--alertRoseBg);
    color: var(--alertRoseText);
}

/* Delete confirmation dialog */
.del-backdrop[b-4yz0zrwzhd] {
    position: fixed;
    inset: 0;
    z-index: 600;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 72px;
}

.del-dialog[b-4yz0zrwzhd] {
    width: 100%;
    max-width: 400px;
    padding: 28px 24px 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.del-icon[b-4yz0zrwzhd] {
    font-size: 36px;
    color: var(--danger);
    opacity: 0.85;
}

.del-title[b-4yz0zrwzhd] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.del-body[b-4yz0zrwzhd] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--textSecondary);
    line-height: 1.5;
}

.del-actions[b-4yz0zrwzhd] {
    display: flex;
    gap: 10px;
    margin-top: 6px;
    width: 100%;
    justify-content: center;
}

.del-btn[b-4yz0zrwzhd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 20px;
    border-radius: var(--radiusSm);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    flex: 1;
    max-width: 160px;
}

.del-btn:disabled[b-4yz0zrwzhd] {
    opacity: 0.6;
    cursor: not-allowed;
}

.del-btn-cancel[b-4yz0zrwzhd] {
    background: var(--surface);
    border-color: var(--border);
    color: var(--textSecondary);
}

.del-btn-cancel:hover:not(:disabled)[b-4yz0zrwzhd] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.del-btn-delete[b-4yz0zrwzhd] {
    background: var(--danger);
    border-color: var(--danger);
    color: #fff;
}

.del-btn-delete:hover:not(:disabled)[b-4yz0zrwzhd] {
    opacity: 0.88;
}

@keyframes del-spin-b-4yz0zrwzhd {
    to {
        transform: rotate(360deg);
    }
}

.del-spin[b-4yz0zrwzhd] {
    font-size: 18px;
    animation: del-spin-b-4yz0zrwzhd 0.9s linear infinite;
    display: inline-block;
}

/* Save button */
.save-btn[b-4yz0zrwzhd] {
    width: 100%;
    margin-top: 24px;
    min-height: 48px;
    font-size: 15px;
    border-radius: var(--radiusLg);
}

/* Save error banner */
.save-error[b-4yz0zrwzhd] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-radius: var(--radiusMd);
    background: var(--alertRoseBg);
    border: 1px solid var(--alertRoseBorder);
    color: var(--alertRoseText);
    font-size: 14px;
    margin-top: 12px;
}

.spin[b-4yz0zrwzhd] {
    animation: spin-b-4yz0zrwzhd 1s linear infinite;
    display: inline-block;
}

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

/* Sticky header so it stays visible when the wrap scrolls */
.readings-table th[b-4yz0zrwzhd] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--mainBg);
}

@media (max-width: 960px) {
    .log-layout[b-4yz0zrwzhd] {
        grid-template-columns: 1fr;
    }

    .readings-card[b-4yz0zrwzhd] {
        position: static;
        max-height: none;
        overflow: visible;
    }

    /* Cap to ~15 rows (~37px each) and scroll the rest */
    .readings-table-wrap[b-4yz0zrwzhd] {
        max-height: 560px;
        overflow-y: auto;
    }
}

@media (max-width: 600px) {
    .log-title[b-4yz0zrwzhd] {
        font-size: 18px;
    }

    .unit-btn[b-4yz0zrwzhd] {
        padding: 0 12px;
        min-width: 60px;
    }
}
/* /Pages/Login.razor.rz.scp.css */
.login-page[b-6vw66s0y2h] {
    display: flex;
    min-height: 100dvh;
}

/* Brand panel - left side */
.login-brand[b-6vw66s0y2h] {
    width: 45%;
    background: linear-gradient(135deg, #D97706, #F59E0B, #FBBF24);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 48px;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.brand-pattern[b-6vw66s0y2h] {
    position: absolute;
    inset: 0;
    opacity: 0.08;
    background-image: radial-gradient(circle at 30% 50%, #fff 1px, transparent 1px),
    radial-gradient(circle at 70% 80%, #fff 1px, transparent 1px);
    background-size: 60px 60px, 40px 40px;
}

.brand-content[b-6vw66s0y2h] {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 340px;
}

.brand-icon[b-6vw66s0y2h] {
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    border: 1px solid rgba(255, 255, 255, 0.25);
}

.brand-name[b-6vw66s0y2h] {
    font-size: 32px;
    font-weight: 700;
    color: #fff;
    font-family: var(--font-heading);
    letter-spacing: -0.03em;
    margin-bottom: 8px;
}

.brand-tagline[b-6vw66s0y2h] {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.6;
}

/* Form panel - right side */
.login-form-panel[b-6vw66s0y2h] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 48px;
    background: var(--bg);
}

.login-form-wrap[b-6vw66s0y2h] {
    width: 100%;
    max-width: 380px;
}

.login-header[b-6vw66s0y2h] {
    margin-bottom: 28px;
}

.login-header h1[b-6vw66s0y2h] {
    font-size: 22px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin-bottom: 6px;
}

.login-header p[b-6vw66s0y2h] {
    font-size: 14px;
    color: var(--textMuted);
    margin: 0;
}

.login-error[b-6vw66s0y2h] {
    width: 100%;
    color: var(--alertRoseText);
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--alertRoseBorder);
    background: var(--alertRoseBg);
    font-size: 13px;
    margin-bottom: 4px;
}

.login-options[b-6vw66s0y2h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.forgot-link[b-6vw66s0y2h] {
    font-size: 13px;
    color: var(--primary);
    font-weight: 500;
    cursor: pointer;
}

.login-signup[b-6vw66s0y2h] {
    text-align: center;
    margin-top: 20px;
    font-size: 13px;
    color: var(--textMuted);
}

.login-signup a[b-6vw66s0y2h] {
    color: var(--primary);
    font-weight: 500;
}

/* Responsive: tablet */
@media (max-width: 767px) {
    .login-brand[b-6vw66s0y2h] {
        width: 40%;
    }
}

/* Responsive: mobile */
@media (max-width: 639px) {
    .login-page[b-6vw66s0y2h] {
        flex-direction: column;
    }

    .login-brand[b-6vw66s0y2h] {
        width: 100%;
        padding: 28px 24px;
    }

    .brand-icon[b-6vw66s0y2h] {
        width: 64px;
        height: 64px;
        border-radius: 18px;
    }

    .brand-name[b-6vw66s0y2h] {
        font-size: 26px;
    }

    .brand-tagline[b-6vw66s0y2h] {
        font-size: 13px;
    }

    .login-form-panel[b-6vw66s0y2h] {
        align-items: flex-start;
        padding: 24px 20px 40px;
    }
}
/* /Pages/Meals.razor.rz.scp.css */
/* ── Page layout ── */
.meals-page[b-jbnh3y1gyd] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ── Header ── */
.meals-header[b-jbnh3y1gyd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2px;
    flex-wrap: wrap;
    gap: 10px;
}

.meals-title[b-jbnh3y1gyd] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0;
}

/* ── Table card ── */
.table-card[b-jbnh3y1gyd] {
    padding: 0;
    overflow: hidden;
}

.grid-header[b-jbnh3y1gyd] {
    display: grid;
    grid-template-columns: 1fr 80px 1fr 80px 60px 60px 60px 70px 72px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--border);
    font-size: 11px;
    color: var(--textMuted);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: var(--surfaceAlt);
}

.grid-body[b-jbnh3y1gyd] {
    max-height: 400px;
    overflow-y: auto;
}

.grid-row[b-jbnh3y1gyd] {
    display: grid;
    grid-template-columns: 1fr 80px 1fr 80px 60px 60px 60px 70px 72px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    transition: background 100ms ease;
}

.grid-row:last-child[b-jbnh3y1gyd] {
    border-bottom: none;
}

.grid-row:hover[b-jbnh3y1gyd] {
    background: var(--surfaceAlt);
}

/* ── Columns ── */
.col-desc[b-jbnh3y1gyd] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textPrimary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-type[b-jbnh3y1gyd] {
    font-size: 12px;
    color: var(--textSecondary);
}

.col-items[b-jbnh3y1gyd] {
    font-size: 13px;
    color: var(--textSecondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-time[b-jbnh3y1gyd] {
    font-size: 12px;
    color: var(--textMuted);
}

.col-macro[b-jbnh3y1gyd] {
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-mono);
    color: var(--textPrimary);
}

/* ── Actions column ── */
.col-actions[b-jbnh3y1gyd] {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
}

.action-btn[b-jbnh3y1gyd] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
    color: var(--textMuted);
    text-decoration: none;
    padding: 0;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.action-btn:hover[b-jbnh3y1gyd] {
    background: var(--border);
    color: var(--textPrimary);
}

.action-btn-delete:hover[b-jbnh3y1gyd] {
    background: var(--dangerBg);
    color: var(--dangerText);
    border-color: var(--dangerBg);
}

.action-btn .material-symbols-outlined[b-jbnh3y1gyd] {
    font-size: 13px;
}

/* ── Mobile row ── */
.mobile-row[b-jbnh3y1gyd] {
    display: none;
}

/* ── Breakdown card ── */
.breakdown-header[b-jbnh3y1gyd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    gap: 12px;
    flex-wrap: wrap;
}

.breakdown-title[b-jbnh3y1gyd] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.bar-row[b-jbnh3y1gyd] {
    margin-bottom: 12px;
}

.bar-row:last-child[b-jbnh3y1gyd] {
    margin-bottom: 0;
}

.bar-label-row[b-jbnh3y1gyd] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size: 13px;
    color: var(--textSecondary);
}

.bar-pct[b-jbnh3y1gyd] {
    font-weight: 600;
}

.bar-track[b-jbnh3y1gyd] {
    height: 8px;
    border-radius: 4px;
    background: var(--surfaceAlt);
    overflow: hidden;
}

.bar-fill[b-jbnh3y1gyd] {
    height: 100%;
    border-radius: 4px;
    background: var(--primary);
    transition: width 0.3s ease;
}

/* ── Notes card ── */
.notes-heading[b-jbnh3y1gyd] {
    font-size: 15px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin-bottom: 16px;
}

.coming-soon[b-jbnh3y1gyd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 24px 16px;
    text-align: center;
}

.coming-soon .material-symbols-outlined[b-jbnh3y1gyd] {
    font-size: 28px;
    color: var(--primary);
    opacity: 0.7;
}

.coming-soon p[b-jbnh3y1gyd] {
    margin: 0;
    font-size: 13px;
    color: var(--textMuted);
    line-height: 1.6;
    max-width: 320px;
}

/* ── Empty / error states ── */
.empty-state[b-jbnh3y1gyd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 48px 20px;
    text-align: center;
}

.empty-icon-wrap[b-jbnh3y1gyd] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: var(--surfaceAlt);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 6px;
}

.empty-icon-wrap .material-symbols-outlined[b-jbnh3y1gyd] {
    font-size: 22px;
    color: var(--textMuted);
}

.empty-title[b-jbnh3y1gyd] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    font-family: var(--font-heading);
}

.empty-sub[b-jbnh3y1gyd] {
    font-size: 13px;
    color: var(--textMuted);
}

.empty-state-inline[b-jbnh3y1gyd] {
    color: var(--textMuted);
    font-size: 13px;
    padding: 16px 0;
    text-align: center;
}

.error-banner[b-jbnh3y1gyd] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-radius: var(--radiusMd);
    background: var(--dangerBg);
    border: 1px solid var(--dangerBg);
    color: var(--dangerText);
    font-size: 14px;
    margin: 16px;
}

/* ── Skeleton ── */
.skeleton[b-jbnh3y1gyd] {
    border-radius: 4px;
    background: var(--border);
    animation: skeleton-pulse-b-jbnh3y1gyd 1.4s ease-in-out infinite;
}

.skeleton-sm[b-jbnh3y1gyd] {
    width: 50px;
    height: 14px;
}

.skeleton-md[b-jbnh3y1gyd] {
    width: 80px;
    height: 14px;
}

.skeleton-lg[b-jbnh3y1gyd] {
    width: 150px;
    height: 14px;
}

@keyframes skeleton-pulse-b-jbnh3y1gyd {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}

/* ── Delete dialog ── */
.del-backdrop[b-jbnh3y1gyd] {
    position: fixed;
    inset: 0;
    z-index: 600;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 72px;
}

.del-dialog[b-jbnh3y1gyd] {
    width: 100%;
    max-width: 400px;
    padding: 28px 24px 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.del-icon[b-jbnh3y1gyd] {
    font-size: 36px;
    color: var(--danger);
    opacity: 0.85;
}

.del-title[b-jbnh3y1gyd] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--textPrimary);
}

.del-body[b-jbnh3y1gyd] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--textSecondary);
    line-height: 1.5;
}

.del-actions[b-jbnh3y1gyd] {
    display: flex;
    gap: 10px;
    margin-top: 6px;
    width: 100%;
    justify-content: center;
}

.del-btn[b-jbnh3y1gyd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 20px;
    border-radius: var(--radiusSm);
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 150ms ease, border-color 150ms ease;
    flex: 1;
    max-width: 160px;
}

.del-btn:disabled[b-jbnh3y1gyd] {
    opacity: 0.6;
    cursor: not-allowed;
}

.del-btn-cancel[b-jbnh3y1gyd] {
    background: var(--surface);
    border-color: var(--border);
    color: var(--textSecondary);
}

.del-btn-cancel:hover:not(:disabled)[b-jbnh3y1gyd] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.del-btn-delete[b-jbnh3y1gyd] {
    background: var(--danger);
    border-color: var(--danger);
    color: #fff;
}

.del-btn-delete:hover:not(:disabled)[b-jbnh3y1gyd] {
    opacity: 0.88;
}

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

.del-spin[b-jbnh3y1gyd] {
    font-size: 18px;
    animation: del-spin-b-jbnh3y1gyd 0.9s linear infinite;
    display: inline-block;
}

/* ══════════════════════════════════════════
   RESPONSIVE: mobile (<768px)
   ══════════════════════════════════════════ */
@media (max-width: 767px) {
    .grid-header[b-jbnh3y1gyd],
    .desktop-row[b-jbnh3y1gyd] {
        display: none;
    }

    .grid-body[b-jbnh3y1gyd] {
        max-height: none;
    }

    .mobile-row[b-jbnh3y1gyd] {
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--border);
    }

    .mobile-row:last-child[b-jbnh3y1gyd] {
        border-bottom: none;
    }

    .mobile-row-content[b-jbnh3y1gyd] {
        flex: 1;
        min-width: 0;
        padding: 14px 8px 14px 16px;
        cursor: pointer;
        transition: background 100ms ease;
    }

    .mobile-row-content:active[b-jbnh3y1gyd] {
        background: var(--surfaceAlt);
    }

    .mobile-top[b-jbnh3y1gyd] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 4px;
    }

    .mobile-desc-primary[b-jbnh3y1gyd] {
        font-size: 14px;
        font-weight: 500;
        color: var(--textPrimary);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        flex: 1;
        min-width: 0;
    }

    .mobile-bottom[b-jbnh3y1gyd] {
        display: flex;
        align-items: center;
        margin-top: 2px;
    }

    .mobile-items[b-jbnh3y1gyd] {
        font-size: 12px;
        color: var(--textSecondary);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-macros[b-jbnh3y1gyd] {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-top: 4px;
    }

    .mobile-macro[b-jbnh3y1gyd] {
        font-family: var(--font-mono);
        font-size: 12px;
        font-weight: 600;
        color: var(--textSecondary);
    }

    .mobile-type[b-jbnh3y1gyd] {
        font-size: 11px;
        color: var(--textMuted);
        flex-shrink: 0;
    }

    .mobile-time[b-jbnh3y1gyd] {
        font-size: 12px;
        color: var(--textMuted);
        flex-shrink: 0;
    }

    .mobile-delete-btn[b-jbnh3y1gyd] {
        flex-shrink: 0;
        width: 34px;
        height: 34px;
        margin-right: 10px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        background: transparent;
        border: 1px solid transparent;
        color: var(--textMuted);
        padding: 0;
        transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    }

    .mobile-delete-btn:active[b-jbnh3y1gyd] {
        background: var(--dangerBg);
        color: var(--dangerText);
        border-color: var(--dangerBg);
    }

    .mobile-delete-btn .material-symbols-outlined[b-jbnh3y1gyd] {
        font-size: 18px;
    }

    .meals-title[b-jbnh3y1gyd] {
        font-size: 18px;
    }
}
/* /Pages/Medications.razor.rz.scp.css */
/* -- Page layout ------------------------------------------------- */
.medication-page[b-1wufk1qo7a] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* -- Header ------------------------------------------------------ */
.page-header[b-1wufk1qo7a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.page-header h1[b-1wufk1qo7a] {
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    color: var(--textPrimary);
    font-family: var(--font-heading);
}

.page-subtitle[b-1wufk1qo7a] {
    font-size: 13px;
    color: var(--textMuted);
    margin-top: 2px;
}

/* -- Stat cards -------------------------------------------------- */
.stats-section[b-1wufk1qo7a] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.stats-heading[b-1wufk1qo7a] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textMuted);
    font-family: var(--font-heading);
    margin: 0;
}

.stats-grid[b-1wufk1qo7a] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.stat-card[b-1wufk1qo7a] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusMd);
    padding: 16px;
}

.stat-label[b-1wufk1qo7a] {
    font-size: 11px;
    font-weight: 500;
    color: var(--textMuted);
    letter-spacing: 0.03em;
    margin-bottom: 6px;
}

.stat-value[b-1wufk1qo7a] {
    font-size: 28px;
    font-weight: 700;
    font-family: var(--font-mono);
    line-height: 1.1;
    margin-bottom: 4px;
}

.stat-value-success[b-1wufk1qo7a] {
    color: var(--success);
}

.stat-value-warn[b-1wufk1qo7a] {
    color: var(--warning);
}

.stat-sub[b-1wufk1qo7a] {
    font-size: 12px;
    color: var(--textMuted);
}

.header-actions[b-1wufk1qo7a] {
    display: flex;
    gap: 8px;
}

/* -- Medication card grid ---------------------------------------- */
.med-grid[b-1wufk1qo7a] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 20px;
}

.med-card[b-1wufk1qo7a] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
    position: relative;
}

.med-card-inactive[b-1wufk1qo7a] {
    opacity: 0.4;
    filter: grayscale(0.5);
    pointer-events: none;
}

.med-card-inactive .edit-btn[b-1wufk1qo7a] {
    pointer-events: auto;
}

/* -- Inactive badge ---------------------------------------------- */
.inactive-badge-row[b-1wufk1qo7a] {
    margin-bottom: 8px;
}

.inactive-badge[b-1wufk1qo7a] {
    display: inline-block;
    font-size: 11px;
    font-weight: 500;
    padding: 3px 10px;
    border-radius: 99px;
    background: var(--surfaceAlt);
    color: var(--textMuted);
}

/* -- Card header (name + edit button) ---------------------------- */
.med-card-header[b-1wufk1qo7a] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10px;
    position: relative;
}

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

.med-name[b-1wufk1qo7a] {
    font-size: 15px;
    font-weight: 600;
    color: var(--textPrimary);
    margin-bottom: 2px;
}

.med-type[b-1wufk1qo7a] {
    font-size: 12px;
    color: var(--textMuted);
}

/* -- Edit button ------------------------------------------------- */
.edit-btn[b-1wufk1qo7a] {
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
    color: var(--textMuted);
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    transition: color 150ms ease, background 150ms ease;
}

.edit-btn:hover[b-1wufk1qo7a] {
    color: var(--textPrimary);
    background: var(--border);
}

.edit-btn .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 14px;
}

/* -- Dose and Frequency chips ------------------------------------ */
.med-chips[b-1wufk1qo7a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.med-chip[b-1wufk1qo7a] {
    background: var(--surfaceAlt);
    border-radius: 8px;
    padding: 8px 10px;
}

.chip-label[b-1wufk1qo7a] {
    font-size: 10px;
    color: var(--textMuted);
    margin-bottom: 2px;
}

.chip-value-mono[b-1wufk1qo7a] {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-mono);
    color: var(--textPrimary);
}

.chip-value-freq[b-1wufk1qo7a] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textPrimary);
}

/* -- Card dropdown menu ------------------------------------------ */
.med-dropdown[b-1wufk1qo7a] {
    position: absolute;
    top: 44px;
    right: 0;
    background: var(--surface);
    border: 1px solid var(--borderStrong);
    border-radius: 8px;
    padding: 4px;
    z-index: 51;
    min-width: 160px;
    display: none;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    box-shadow: var(--shadowLg);
}

.med-dropdown.open[b-1wufk1qo7a] {
    display: block;
}

.med-dropdown-item[b-1wufk1qo7a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 13px;
    color: var(--textPrimary);
    cursor: pointer;
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
    transition: background 120ms ease;
}

.med-dropdown-item:hover:not(:disabled)[b-1wufk1qo7a] {
    background: var(--surfaceAlt);
}

.med-dropdown-item:disabled[b-1wufk1qo7a] {
    opacity: 0.5;
    cursor: not-allowed;
}

.med-dropdown-item .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 15px;
    flex-shrink: 0;
}

.med-dropdown-item.danger[b-1wufk1qo7a] {
    color: var(--danger);
}

/* -- Today's log ------------------------------------------------- */
.log-heading[b-1wufk1qo7a] {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin-bottom: 14px;
}

.log-entry[b-1wufk1qo7a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

.log-entry-last[b-1wufk1qo7a] {
    border-bottom: none;
}

.log-entry-left[b-1wufk1qo7a] {
    flex: 1;
    min-width: 0;
}

.log-entry-name[b-1wufk1qo7a] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.log-entry-time[b-1wufk1qo7a] {
    font-size: 12px;
    color: var(--textMuted);
    margin-top: 2px;
}

.log-entry-right[b-1wufk1qo7a] {
    flex-shrink: 0;
    margin-left: 12px;
}

.taken-badge[b-1wufk1qo7a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--radiusSm);
    background: var(--surfaceAlt);
    color: var(--primaryDark);
}

.taken-badge .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 14px;
    color: var(--primary);
}

/* -- Skeleton placeholders --------------------------------------- */
.skeleton[b-1wufk1qo7a] {
    border-radius: 4px;
    background: var(--border);
    animation: med-skeleton-pulse-b-1wufk1qo7a 1.4s ease-in-out infinite;
}

@keyframes med-skeleton-pulse-b-1wufk1qo7a {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}

.med-card-skeleton[b-1wufk1qo7a] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 20px;
}

.skeleton-chips[b-1wufk1qo7a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.log-row-skeleton[b-1wufk1qo7a] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

/* -- Error and empty states -------------------------------------- */
.error-banner[b-1wufk1qo7a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 16px;
    border-radius: var(--radiusMd);
    background: var(--alertRoseBg);
    border: 1px solid var(--alertRoseBorder);
    color: var(--alertRoseText);
    font-size: 14px;
}

.empty-state[b-1wufk1qo7a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 24px;
    color: var(--textMuted);
    font-size: 14px;
    text-align: center;
}

.empty-state .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 40px;
    opacity: 0.5;
}

.empty-state-sm[b-1wufk1qo7a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px 16px;
    color: var(--textMuted);
    font-size: 13px;
    text-align: center;
}

.empty-state-sm .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 28px;
    opacity: 0.4;
}

/* -- Log entry actions -------------------------------------------- */
.log-entry-right[b-1wufk1qo7a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.log-entry-actions[b-1wufk1qo7a] {
    display: flex;
    gap: 2px;
    opacity: 0;
    transition: opacity 150ms ease;
}

.log-entry:hover .log-entry-actions[b-1wufk1qo7a] {
    opacity: 1;
}

.log-action-btn[b-1wufk1qo7a] {
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    background: transparent;
    border: none;
    color: var(--textMuted);
    transition: color 150ms ease, background 150ms ease;
}

.log-action-btn:hover[b-1wufk1qo7a] {
    color: var(--textPrimary);
    background: var(--surfaceAlt);
}

.log-action-btn .material-symbols-outlined[b-1wufk1qo7a] {
    font-size: 16px;
}

.log-action-delete:hover[b-1wufk1qo7a] {
    color: var(--danger);
}

/* -- Delete confirmation dialog ---------------------------------- */
.del-backdrop[b-1wufk1qo7a] {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.del-dialog[b-1wufk1qo7a] {
    width: 100%;
    max-width: 360px;
    padding: 28px 24px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 4px;
}

.del-icon[b-1wufk1qo7a] {
    font-size: 36px;
    color: var(--danger);
    margin-bottom: 8px;
}

.del-title[b-1wufk1qo7a] {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--textPrimary);
}

.del-desc[b-1wufk1qo7a] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--textMuted);
}

.del-actions[b-1wufk1qo7a] {
    display: flex;
    gap: 8px;
    width: 100%;
}

.del-cancel-btn[b-1wufk1qo7a],
.del-confirm-btn[b-1wufk1qo7a] {
    flex: 1;
    padding: 10px 16px;
    border-radius: var(--radiusSm);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid var(--border);
    transition: background 120ms ease;
}

.del-cancel-btn[b-1wufk1qo7a] {
    background: var(--surface);
    color: var(--textPrimary);
}

.del-cancel-btn:hover:not(:disabled)[b-1wufk1qo7a] {
    background: var(--surfaceAlt);
}

.del-confirm-btn[b-1wufk1qo7a] {
    background: var(--danger);
    color: #fff;
    border-color: var(--danger);
}

.del-confirm-btn:hover:not(:disabled)[b-1wufk1qo7a] {
    opacity: 0.9;
}

.del-cancel-btn:disabled[b-1wufk1qo7a],
.del-confirm-btn:disabled[b-1wufk1qo7a] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 767px) {
    .med-grid[b-1wufk1qo7a] {
        grid-template-columns: repeat(2, 1fr);
    }

    .stats-grid[b-1wufk1qo7a] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 639px) {
    .stats-grid[b-1wufk1qo7a] {
        grid-template-columns: 1fr 1fr;
    }

    .page-header[b-1wufk1qo7a] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .med-grid[b-1wufk1qo7a] {
        grid-template-columns: 1fr;
    }

    .log-entry-name[b-1wufk1qo7a] {
        font-size: 13px;
    }

    .log-entry-actions[b-1wufk1qo7a] {
        opacity: 1;
    }
}
/* /Pages/NotFound.razor.rz.scp.css */
.nf-page[b-83vps5paw9] {
    min-height: 100dvh;
    background: var(--bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    position: relative;
    overflow: hidden;
}

/* -- Floating background cells ----------------------------------- */
.nf-bg-cells[b-83vps5paw9] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.nf-bg-cell[b-83vps5paw9] {
    position: absolute;
}

.nf-float-0[b-83vps5paw9] {
    animation: nf-float0-b-83vps5paw9 ease-in-out infinite;
}

.nf-float-1[b-83vps5paw9] {
    animation: nf-float1-b-83vps5paw9 ease-in-out infinite;
}

.nf-float-2[b-83vps5paw9] {
    animation: nf-float2-b-83vps5paw9 ease-in-out infinite;
}

@keyframes nf-float0-b-83vps5paw9 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-20px) rotate(8deg); }
}

@keyframes nf-float1-b-83vps5paw9 {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-15px) rotate(-6deg); }
}

@keyframes nf-float2-b-83vps5paw9 {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-25px) scale(1.05); }
}

/* -- Main cell illustration -------------------------------------- */
.nf-cell-wrap[b-83vps5paw9] {
    position: relative;
    width: 160px;
    height: 160px;
    margin-bottom: 32px;
}

.nf-cell-svg[b-83vps5paw9] {
    width: 100%;
    height: 100%;
}

.nf-code-overlay[b-83vps5paw9] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 16px;
}

.nf-code-text[b-83vps5paw9] {
    font-family: var(--font-mono);
    font-size: 48px;
    font-weight: 700;
    color: var(--primary);
    opacity: 0.25;
    letter-spacing: -2px;
}

/* -- Content ----------------------------------------------------- */
.nf-content[b-83vps5paw9] {
    text-align: center;
    max-width: 400px;
    position: relative;
    z-index: 1;
}

.nf-heading[b-83vps5paw9] {
    font-size: 28px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0 0 8px;
}

.nf-desc[b-83vps5paw9] {
    font-size: 14px;
    color: var(--textSecondary);
    line-height: 1.6;
    margin: 0 0 24px;
}

.nf-actions[b-83vps5paw9] {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

/* -- Buttons (match prototype GcBtn exactly) --------------------- */
.nf-btn-primary[b-83vps5paw9],
.nf-btn-secondary[b-83vps5paw9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none;
}

.nf-btn-primary[b-83vps5paw9] {
    background: var(--primary);
    color: var(--primaryFg);
    border: 1.5px solid var(--primary);
}

.nf-btn-primary:hover[b-83vps5paw9] {
    background: var(--primaryDark);
}

.nf-btn-secondary[b-83vps5paw9] {
    background: transparent;
    color: var(--textPrimary);
    border: 1.5px solid var(--border);
}

.nf-btn-secondary:hover[b-83vps5paw9] {
    background: var(--surfaceAlt);
}

/* -- Footer ------------------------------------------------------ */
.nf-footer[b-83vps5paw9] {
    margin-top: 40px;
    font-size: 12px;
    color: var(--textMuted);
    text-align: center;
    position: relative;
    z-index: 1;
}

.nf-footer-code[b-83vps5paw9] {
    font-family: var(--font-mono);
}

/* -- Responsive -------------------------------------------------- */
@media (max-width: 600px) {
    .nf-cell-wrap[b-83vps5paw9] {
        width: 120px;
        height: 120px;
    }

    .nf-code-overlay[b-83vps5paw9] {
        padding-bottom: 12px;
    }

    .nf-code-text[b-83vps5paw9] {
        font-size: 36px;
    }

    .nf-heading[b-83vps5paw9] {
        font-size: 22px;
    }
}
/* /Pages/Overview.razor.rz.scp.css */
.overview[b-3y36i2hh1a] {
    display: grid;
    gap: 20px;
}

/* Greeting header */
.greeting-section[b-3y36i2hh1a] {
    padding: 4px 0;
}

.greeting-title[b-3y36i2hh1a] {
    font-size: 22px;
    font-weight: 700;
    color: var(--textPrimary);
    font-family: var(--font-heading);
    margin: 0;
    line-height: 1.3;
}

.greeting-date[b-3y36i2hh1a] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 2px 0 0;
}

/* Stat cards grid */
.dash-stats[b-3y36i2hh1a] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.stat-card[b-3y36i2hh1a] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radiusLg);
    padding: 20px 22px;
    box-shadow: var(--shadow);
}

.stat-hero[b-3y36i2hh1a] {
    background: linear-gradient(135deg, var(--primaryDark), var(--primary));
    border: none;
    box-shadow: var(--shadowLg);
    color: #fff;
    position: relative;
    overflow: hidden;
}

.stat-hero[b-3y36i2hh1a]::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.06;
    background-image: radial-gradient(circle at 80% 20%, #fff 1px, transparent 1px);
    background-size: 30px 30px;
    pointer-events: none;
}

.stat-hero-label[b-3y36i2hh1a] {
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: rgba(255, 255, 255, .80);
    opacity: 0.8;
    margin-bottom: 6px;
    position: relative;
    z-index: 1;
}

.stat-hero-reading[b-3y36i2hh1a] {
    display: flex;
    align-items: baseline;
    gap: 4px;
    position: relative;
    z-index: 1;
}

.stat-hero-value[b-3y36i2hh1a] {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    color: white;
    font-family: var(--font-mono);
}

.stat-hero-unit[b-3y36i2hh1a] {
    font-size: 12px;
    font-weight: 400;
    color: rgba(255, 255, 255, .80);
}

.stat-label[b-3y36i2hh1a] {
    font-size: 11px;
    font-weight: 500;
    color: var(--textMuted);
    text-transform: uppercase;
    letter-spacing: .04em;
    font-family: var(--font-heading);
    margin-bottom: 6px;
}

.stat-value[b-3y36i2hh1a] {
    font-size: 24px;
    font-weight: 600;
    color: var(--textPrimary);
    line-height: 1.1;
    font-family: var(--font-mono);
}

.stat-unit[b-3y36i2hh1a] {
    font-size: 12px;
    font-weight: 400;
    color: var(--textMuted);
}

.stat-sub[b-3y36i2hh1a] {
    font-size: 11px;
    color: var(--textSecondary);
    margin-top: 4px;
}

.stat-hint[b-3y36i2hh1a] {
    font-size: 11px;
    line-height: 1.4;
    color: var(--textSecondary);
    margin: 10px 0 0;
    padding-top: 10px;
    border-top: 1px solid var(--border);
}

/* Bottom two-column grid */
.dash-bottom[b-3y36i2hh1a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.dash-side[b-3y36i2hh1a] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Recent readings */
.recent-readings[b-3y36i2hh1a] {
    display: flex;
    flex-direction: column;
}

.reading-row[b-3y36i2hh1a] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.reading-row:last-child[b-3y36i2hh1a] {
    border-bottom: none;
}

.reading-dot[b-3y36i2hh1a] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.dot-green[b-3y36i2hh1a] {
    background: var(--alertGreenText);
}

.dot-rose[b-3y36i2hh1a] {
    background: var(--alertRoseText);
}

.dot-amber[b-3y36i2hh1a] {
    background: var(--alertAmberText);
}

.reading-info[b-3y36i2hh1a] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.reading-context[b-3y36i2hh1a] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textPrimary);
    line-height: 1.3;
}

.reading-time[b-3y36i2hh1a] {
    font-size: 11px;
    color: var(--textMuted);
    margin-top: 1px;
}

.reading-value[b-3y36i2hh1a] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    font-family: var(--font-mono);
    white-space: nowrap;
}

.reading-unit[b-3y36i2hh1a] {
    font-size: 11px;
    font-weight: 400;
    color: var(--textMuted);
}

.reading-value-rose[b-3y36i2hh1a] {
    color: var(--alertRoseText);
}

.reading-value-amber[b-3y36i2hh1a] {
    color: var(--alertAmberText);
}

.view-all-link[b-3y36i2hh1a] {
    font-size: 13px;
    font-weight: 500;
    color: var(--primary);
    text-decoration: none;
    white-space: nowrap;
    padding: 4px 0;
    min-height: 44px;
    display: flex;
    align-items: center;
}

.view-all-link:hover[b-3y36i2hh1a] {
    text-decoration: underline;
}

/* Empty state */
.empty-state[b-3y36i2hh1a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    color: var(--textMuted);
    gap: 8px;
}

.empty-icon[b-3y36i2hh1a] {
    font-size: 32px;
    opacity: 0.5;
}

.empty-state p[b-3y36i2hh1a] {
    font-size: 13px;
    margin: 0;
}

/* Time in Range donut */
.tir-layout[b-3y36i2hh1a] {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 12px;
}

.tir-donut-wrap[b-3y36i2hh1a] {
    position: relative;
    width: 120px;
    height: 120px;
    flex-shrink: 0;
}

.tir-donut[b-3y36i2hh1a] {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.tir-center[b-3y36i2hh1a] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.tir-pct[b-3y36i2hh1a] {
    font-size: 22px;
    font-weight: 700;
    font-family: var(--font-mono);
    color: var(--textPrimary);
    line-height: 1;
}

.tir-label[b-3y36i2hh1a] {
    font-size: 11px;
    color: var(--alertGreenText);
    font-weight: 500;
    margin-top: 2px;
}

.tir-legend[b-3y36i2hh1a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tir-legend-row[b-3y36i2hh1a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tir-swatch[b-3y36i2hh1a] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}

.tir-swatch-green[b-3y36i2hh1a] {
    background: var(--alertGreenText);
}

.tir-swatch-amber[b-3y36i2hh1a] {
    background: var(--alertAmberText);
}

.tir-swatch-rose[b-3y36i2hh1a] {
    background: var(--alertRoseText);
}

.tir-legend-label[b-3y36i2hh1a] {
    font-size: 12px;
    color: var(--textSecondary);
    width: 55px;
}

.tir-legend-value[b-3y36i2hh1a] {
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-mono);
    color: var(--textPrimary);
}

/* Hero card overrides for out-of-range glucose */
.stat-hero.stat-hero-high[b-3y36i2hh1a] {
    background: var(--alertRoseBg);
    border: 1px solid var(--alertRoseBorder);
    color: var(--alertRoseText);
    box-shadow: var(--shadow);
}

.stat-hero.stat-hero-high .stat-hero-label[b-3y36i2hh1a] {
    color: var(--alertRoseText);
    opacity: 0.8;
}

.stat-hero.stat-hero-high .stat-hero-value[b-3y36i2hh1a],
.stat-hero.stat-hero-high .stat-hero-unit[b-3y36i2hh1a] {
    color: var(--alertRoseText);
}

.stat-hero.stat-hero-low[b-3y36i2hh1a] {
    background: var(--alertAmberBg);
    border: 1px solid var(--alertAmberBorder);
    color: var(--alertAmberText);
    box-shadow: var(--shadow);
}

.stat-hero.stat-hero-low .stat-hero-label[b-3y36i2hh1a] {
    color: var(--alertAmberText);
    opacity: 0.8;
}

.stat-hero.stat-hero-low .stat-hero-value[b-3y36i2hh1a],
.stat-hero.stat-hero-low .stat-hero-unit[b-3y36i2hh1a] {
    color: var(--alertAmberText);
}

.hero-badge[b-3y36i2hh1a] {
    display: inline-flex;
    padding: 2px 8px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .20);
    font-size: 10px;
    font-weight: 600;
    color: white;
}

.hero-badge.hero-badge-high[b-3y36i2hh1a] {
    background: var(--alertRoseBorder);
    color: var(--alertRoseText);
}

.hero-badge.hero-badge-low[b-3y36i2hh1a] {
    background: var(--alertAmberBorder);
    color: var(--alertAmberText);
}

.stat-hero-footer[b-3y36i2hh1a] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    position: relative;
    z-index: 1;
}

.hero-target[b-3y36i2hh1a] {
    font-size: 10px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
}

/* Skeleton loading states */
.skeleton[b-3y36i2hh1a] {
    border-radius: 4px;
    background: var(--border);
    animation: overview-skeleton-pulse-b-3y36i2hh1a 1.4s ease-in-out infinite;
}

.stat-card .skeleton[b-3y36i2hh1a] {
    background: var(--border);
}

.stat-card.stat-hero .skeleton[b-3y36i2hh1a] {
    background: rgba(255, 255, 255, 0.25);
}

.skeleton-greeting[b-3y36i2hh1a] {
    width: 220px;
    height: 26px;
    display: block;
    border-radius: 6px;
}

.skeleton-date[b-3y36i2hh1a] {
    width: 160px;
    height: 16px;
    display: block;
    margin-top: 6px;
    border-radius: 4px;
}

.skeleton-label[b-3y36i2hh1a] {
    width: 80px;
    height: 13px;
    display: block;
}

.skeleton-value[b-3y36i2hh1a] {
    width: 100px;
    height: 24px;
    display: block;
    margin-top: 8px;
    border-radius: 6px;
}

.skeleton-value-lg[b-3y36i2hh1a] {
    width: 80px;
    height: 24px;
    display: block;
    margin-top: 8px;
    border-radius: 8px;
}

.skeleton-badge[b-3y36i2hh1a] {
    width: 60px;
    height: 20px;
    display: block;
    margin-top: 8px;
    border-radius: 999px;
}

.skeleton-sub[b-3y36i2hh1a] {
    width: 60px;
    height: 12px;
    display: block;
    margin-top: 8px;
}

@keyframes overview-skeleton-pulse-b-3y36i2hh1a {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}

.stat-no-data[b-3y36i2hh1a] {
    color: var(--textMuted);
    font-size: 24px !important;
}

/* Quick action buttons */
.quick-grid[b-3y36i2hh1a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 12px;
}

.quick-btn[b-3y36i2hh1a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 150ms ease;
    border: 1px solid var(--border);
    background: var(--surfaceAlt);
    color: var(--textPrimary);
    white-space: nowrap;
    min-height: 44px;
}

.quick-btn .material-symbols-outlined[b-3y36i2hh1a] {
    font-size: 18px;
    color: var(--textSecondary);
}

.quick-btn:hover:not(:disabled)[b-3y36i2hh1a] {
    border-color: var(--borderStrong);
}

.quick-btn:disabled[b-3y36i2hh1a] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Bar skeleton */
.bar.bar-skeleton[b-3y36i2hh1a] {
    background: var(--border);
    animation: overview-skeleton-pulse-b-3y36i2hh1a 1.4s ease-in-out infinite;
    cursor: default;
    pointer-events: none;
}

.bar.bar-skeleton[b-3y36i2hh1a]::after {
    display: none;
}

.bar[b-3y36i2hh1a] {
    position: relative;
    cursor: pointer;
    overflow: visible;
}

.bar[b-3y36i2hh1a]::after {
    content: attr(data-value);
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--textPrimary);
    color: var(--bg);
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: var(--radiusSm);
    white-space: nowrap;
    pointer-events: none;
    z-index: 10;
    opacity: 0;
    transition: opacity 120ms ease;
}

.bar:not([data-value=""]):hover[b-3y36i2hh1a]::after,
.bar:not([data-value=""]):focus[b-3y36i2hh1a]::after,
.bar:not([data-value=""]):active[b-3y36i2hh1a]::after {
    opacity: 1;
}

.bar.bar-high[b-3y36i2hh1a] {
    background: var(--chartBarHigh);
    opacity: 0.85;
}

.bar.bar-low[b-3y36i2hh1a] {
    background: var(--chartBarLow);
    opacity: 0.85;
}

.bar.bar-high:hover[b-3y36i2hh1a],
.bar.bar-low:hover[b-3y36i2hh1a],
.bar.bar-high:focus[b-3y36i2hh1a],
.bar.bar-low:focus[b-3y36i2hh1a] {
    opacity: 1;
}

@media (max-width: 960px) {
    .dash-stats[b-3y36i2hh1a] {
        grid-template-columns: repeat(2, 1fr);
    }

    .dash-bottom[b-3y36i2hh1a] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 639px) {
    .dash-stats[b-3y36i2hh1a] {
        grid-template-columns: repeat(3, 1fr);
    }

    .stat-hero[b-3y36i2hh1a] {
        grid-column: 1 / -1;
    }

    .stat-hero-label[b-3y36i2hh1a] {
        font-size: 12px;
        text-transform: none;
        letter-spacing: normal;
        opacity: 1;
        margin-bottom: 8px;
    }

    .stat-hero-reading[b-3y36i2hh1a] {
        gap: 6px;
    }

    .stat-hero-value[b-3y36i2hh1a] {
        font-size: 42px;
        letter-spacing: -0.03em;
    }

    .stat-hero-unit[b-3y36i2hh1a] {
        font-size: 16px;
        font-weight: 500;
    }

    .stat-hero-footer[b-3y36i2hh1a] {
        gap: 8px;
        margin-top: 8px;
    }

    .hero-badge[b-3y36i2hh1a] {
        padding: 4px 12px;
        border-radius: 20px;
        font-size: 12px;
    }

    .hero-target[b-3y36i2hh1a] {
        font-size: 12px;
    }

    .stat-card:not(.stat-hero)[b-3y36i2hh1a] {
        padding: 14px 10px;
    }

    .stat-value[b-3y36i2hh1a] {
        font-size: 20px;
    }

    .stat-sub[b-3y36i2hh1a] {
        display: none;
    }

    .stat-card:not(.stat-hero)[b-3y36i2hh1a] {
        position: relative;
        cursor: pointer;
        outline: none;
    }

    .stat-hint[b-3y36i2hh1a] {
        position: absolute;
        bottom: calc(100% + 8px);
        left: 0;
        right: 0;
        background: var(--textPrimary);
        color: var(--bg);
        font-size: 11px;
        font-weight: 500;
        line-height: 1.5;
        padding: 10px 12px;
        border-radius: var(--radiusMd);
        border-top: none;
        padding-top: 10px;
        margin-top: 0;
        opacity: 0;
        pointer-events: none;
        z-index: 20;
        transition: opacity 150ms ease;
        white-space: normal;
    }

    .stat-card:not(.stat-hero):focus .stat-hint[b-3y36i2hh1a],
    .stat-card:not(.stat-hero):active .stat-hint[b-3y36i2hh1a] {
        opacity: 1;
    }

    .dash-bottom[b-3y36i2hh1a] {
        grid-template-columns: 1fr;
    }

    .greeting-title[b-3y36i2hh1a] {
        font-size: 20px;
    }
}
/* /Pages/Profile.razor.rz.scp.css */
/* ================================
   Settings Page
================================ */

.settings-page[b-kcisbprv4r] {
    display: grid;
    gap: 14px;
}

.settings-title[b-kcisbprv4r] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    margin-bottom: 20px;
    color: var(--textPrimary);
}

.settings-grid[b-kcisbprv4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* ================================
   Card heading
================================ */

.card-heading[b-kcisbprv4r] {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-heading);
    margin-bottom: 16px;
    color: var(--textPrimary);
}

/* ================================
   1. Profile card
================================ */

.profile-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}

.profile-avatar[b-kcisbprv4r] {
    width: 56px;
    height: 56px;
    min-width: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, #D97706, #F59E0B);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
}

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

.profile-name[b-kcisbprv4r] {
    font-size: 15px;
    font-weight: 600;
    color: var(--textPrimary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-email[b-kcisbprv4r] {
    font-size: 12px;
    color: var(--textMuted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-type[b-kcisbprv4r] {
    font-size: 12px;
    color: var(--textSecondary);
    margin-top: 2px;
}

.profile-actions[b-kcisbprv4r] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* ================================
   2. Connected devices card
================================ */

.device-list[b-kcisbprv4r] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}

.device-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    background: var(--surfaceAlt);
    border-radius: 10px;
    border: 1px solid var(--border);
}

.device-left[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.device-icon-box[b-kcisbprv4r] {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.device-icon-box .material-symbols-outlined[b-kcisbprv4r] {
    font-size: 18px;
}

.device-icon-green[b-kcisbprv4r] {
    background: var(--alertGreenBg);
}

.device-icon-green .material-symbols-outlined[b-kcisbprv4r] {
    color: var(--success);
}

.device-icon-neutral[b-kcisbprv4r] {
    background: var(--surfaceAlt);
    border: 1px solid var(--border);
}

.device-icon-neutral .material-symbols-outlined[b-kcisbprv4r] {
    color: var(--textMuted);
}

.device-meta[b-kcisbprv4r] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.device-name[b-kcisbprv4r] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textPrimary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.device-sync[b-kcisbprv4r] {
    font-size: 11px;
    color: var(--textMuted);
}

.device-badge[b-kcisbprv4r] {
    font-size: 11px;
    font-weight: 600;
    color: var(--alertGreenText);
    background: var(--alertGreenBg);
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ================================
   3. Glucose preferences card
================================ */

.card-heading-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.card-heading-row .card-heading[b-kcisbprv4r] {
    margin-bottom: 0;
}

.glucose-display[b-kcisbprv4r] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}

.glucose-display-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: var(--surfaceAlt);
    border-radius: 10px;
    border: 1px solid var(--border);
}

.glucose-display-label[b-kcisbprv4r] {
    font-size: 13px;
    font-weight: 500;
    color: var(--textSecondary);
}

.glucose-display-value[b-kcisbprv4r] {
    font-size: 14px;
    font-weight: 600;
    color: var(--textPrimary);
    font-family: var(--font-mono);
}

.range-badges[b-kcisbprv4r] {
    display: flex;
    gap: 6px;
    padding: 10px 14px;
    background: var(--surfaceAlt);
    border-radius: 10px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.range-badge[b-kcisbprv4r] {
    font-size: 11px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

.range-badge-low[b-kcisbprv4r] {
    color: var(--dangerText);
    background: var(--dangerBg);
}

.range-badge-ok[b-kcisbprv4r] {
    color: var(--alertGreenText);
    background: var(--alertGreenBg);
}

.range-badge-high[b-kcisbprv4r] {
    color: var(--alertAmberText);
    background: var(--alertAmberBg);
}

/* ================================
   4/5. Toggle rows (Appearance & Notifications)
================================ */

.toggle-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.toggle-row + .toggle-row[b-kcisbprv4r] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

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

.toggle-label[b-kcisbprv4r] {
    font-size: 14px;
    font-weight: 500;
    color: var(--textPrimary);
}

.toggle-sub[b-kcisbprv4r] {
    font-size: 12px;
    color: var(--textMuted);
}

/* Toggle switch */
.settings-toggle[b-kcisbprv4r] {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    flex-shrink: 0;
}

.settings-toggle input[type=checkbox][b-kcisbprv4r] {
    appearance: none;
    -webkit-appearance: none;
    width: 44px;
    min-width: 44px;
    height: 24px;
    border-radius: 12px;
    background: var(--border);
    position: relative;
    cursor: pointer;
    transition: background 0.2s ease;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

.settings-toggle input[type=checkbox]:checked[b-kcisbprv4r] {
    background: var(--primary);
}

.settings-toggle input[type=checkbox][b-kcisbprv4r]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    transition: transform 0.2s ease;
}

.settings-toggle input[type=checkbox]:checked[b-kcisbprv4r]::after {
    transform: translateX(20px);
}

.settings-toggle-track[b-kcisbprv4r] {
    display: none;
}

/* ================================
   6. Data & account card
================================ */

.data-actions[b-kcisbprv4r] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.data-separator[b-kcisbprv4r] {
    border-top: 1px solid var(--border);
    padding-top: 12px;
    margin-top: 4px;
}

.data-danger-row[b-kcisbprv4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

/* ================================
   GcBtn - matches prototype exactly
================================ */

.gc-btn[b-kcisbprv4r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    padding: 0 20px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all 0.15s ease;
    border: 1.5px solid transparent;
    white-space: nowrap;
}

.gc-btn-icon[b-kcisbprv4r] {
    font-size: 16px;
    flex-shrink: 0;
    font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 20;
}

.gc-btn-sm .gc-btn-icon[b-kcisbprv4r] {
    font-size: 14px;
}

/* Secondary variant */
.gc-btn-secondary[b-kcisbprv4r] {
    background: transparent;
    color: var(--textPrimary);
    border-color: var(--border);
}

.gc-btn-secondary:hover[b-kcisbprv4r] {
    background: var(--surfaceAlt);
}

/* Danger variant */
.gc-btn-danger[b-kcisbprv4r] {
    background: var(--danger);
    color: #fff;
    border-color: var(--danger);
}

.gc-btn-danger:hover[b-kcisbprv4r] {
    background: #b91c1c;
    border-color: #b91c1c;
}

/* Small size */
.gc-btn-sm[b-kcisbprv4r] {
    height: 34px;
    padding: 0 14px;
    font-size: 12px;
}

/* Full width */
.gc-btn-full[b-kcisbprv4r] {
    width: 100%;
}

/* Primary variant */
.gc-btn-primary[b-kcisbprv4r] {
    background: var(--primary);
    color: var(--primaryFg);
    border-color: var(--primary);
}

.gc-btn-primary:hover[b-kcisbprv4r] {
    background: var(--primaryDark);
    border-color: var(--primaryDark);
}

/* ================================
   Drawer (Edit Profile)
================================ */

.drawer-backdrop[b-kcisbprv4r] {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
    padding: 16px;
}

.drawer-dialog[b-kcisbprv4r] {
    background: var(--surface);
    width: 100%;
    max-width: 480px;
    max-height: 85vh;
    border-radius: 16px;
    overflow: auto;
    box-shadow: var(--shadowLg);
    border: 1px solid var(--border);
}

.drawer-header[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border);
}

.drawer-title[b-kcisbprv4r] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.drawer-close[b-kcisbprv4r] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: var(--surfaceAlt);
    color: var(--textSecondary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s ease;
}

.drawer-close:hover[b-kcisbprv4r] {
    background: var(--border);
}

.drawer-close .material-symbols-outlined[b-kcisbprv4r] {
    font-size: 16px;
}

.drawer-body[b-kcisbprv4r] {
    padding: 20px;
}

.edit-avatar-row[b-kcisbprv4r] {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 20px;
}

.edit-avatar[b-kcisbprv4r] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    border-radius: 18px;
    background: linear-gradient(135deg, #D97706, #F59E0B);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.edit-name-grid[b-kcisbprv4r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
}

.edit-field[b-kcisbprv4r] {
    margin-bottom: 14px;
}

.edit-label[b-kcisbprv4r] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    margin-bottom: 5px;
    font-family: var(--font-heading);
}

.edit-input[b-kcisbprv4r] {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    background: var(--inputBg);
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    font-size: 14px;
    font-family: var(--font-body);
    color: var(--textPrimary);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.edit-input:focus[b-kcisbprv4r] {
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

.edit-error[b-kcisbprv4r] {
    font-size: 13px;
    color: var(--danger);
    margin-bottom: 8px;
}

/* ================================
   Mobile responsive
================================ */

@media (max-width: 700px) {
    .drawer-dialog[b-kcisbprv4r] {
        max-width: 100%;
        max-height: 85vh;
        border-radius: 20px 20px 0 0;
        align-self: flex-end;
    }

    .drawer-backdrop[b-kcisbprv4r] {
        align-items: flex-end;
        padding: 0;
    }
}

@media (max-width: 700px) {
    .settings-grid[b-kcisbprv4r] {
        grid-template-columns: 1fr;
    }

    .glucose-range-grid[b-kcisbprv4r] {
        grid-template-columns: 1fr;
    }

    .data-danger-row[b-kcisbprv4r] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Register.razor.rz.scp.css */
.register-page[b-fu4va5u5zr] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100dvh;
    padding: 24px 16px;
    background: var(--bg);
}

.register-container[b-fu4va5u5zr] {
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Logo */
.register-logo[b-fu4va5u5zr] {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: linear-gradient(135deg, #D97706, #F59E0B);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 24px var(--accentGlow);
    margin-bottom: 12px;
}

/* Heading */
.register-heading[b-fu4va5u5zr] {
    text-align: center;
    margin-bottom: 28px;
}

.register-heading h1[b-fu4va5u5zr] {
    font-size: 22px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0 0 4px;
}

.register-heading p[b-fu4va5u5zr] {
    font-size: 14px;
    color: var(--textMuted);
    margin: 0;
}

/* Card */
.register-card[b-fu4va5u5zr] {
    width: 100%;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: 28px;
}

/* Error / no-error */
.no-error[b-fu4va5u5zr] {
    display: none;
}

.text-danger[b-fu4va5u5zr] {
    width: 100%;
    color: var(--alertRoseText);
    padding: 12px 14px;
    border-radius: 10px;
    border: 1px solid var(--alertRoseBorder);
    background: var(--alertRoseBg);
    font-size: 13px;
    margin-bottom: 4px;
}

/* Fields */
.register-fields[b-fu4va5u5zr] {
    display: flex;
    flex-direction: column;
}

/* Select fields styled to match Input component */
.reg-select-wrap[b-fu4va5u5zr] {
    width: 100%;
    margin-bottom: 14px;
}

.reg-select-label[b-fu4va5u5zr] {
    display: block;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: var(--textSecondary);
    cursor: pointer;
    font-family: var(--font-heading);
}

.reg-select[b-fu4va5u5zr] {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    font-size: 14px;
    font-family: var(--font-body);
    color: var(--textPrimary);
    background-color: var(--inputBg);
    border: 1.5px solid var(--inputBorder);
    border-radius: 10px;
    box-shadow: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%239C8E80' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    cursor: pointer;
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

.reg-select:hover[b-fu4va5u5zr],
.reg-select:focus[b-fu4va5u5zr] {
    outline: none;
    border-color: var(--inputFocus);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--inputFocus) 13%, transparent);
}

/* Action */
.register-action[b-fu4va5u5zr] {
    margin-top: 8px;
}

/* Footer link */
.register-footer[b-fu4va5u5zr] {
    text-align: center;
    margin-top: 16px;
    font-size: 13px;
    color: var(--textMuted);
}

.register-footer a[b-fu4va5u5zr] {
    color: var(--primary);
    font-weight: 500;
}

/* Success state */
.register-success[b-fu4va5u5zr] {
    display: grid;
    row-gap: 8px;
    justify-items: center;
    text-align: center;
    padding: 16px 0;
}

.register-success-icon[b-fu4va5u5zr] {
    font-size: 3rem;
    color: var(--primary);
}

.register-success-title[b-fu4va5u5zr] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 600;
    font-family: var(--font-heading);
    color: var(--textPrimary);
}

.register-success-body[b-fu4va5u5zr] {
    margin: 0;
    font-size: 14px;
    color: var(--textMuted);
    line-height: 1.6;
}

.register-success-body a[b-fu4va5u5zr] {
    color: var(--primary);
    font-weight: 500;
}

/* Turnstile */
.turnstile-box[b-fu4va5u5zr] {
    width: 100%;
    margin-top: 4px;
}

/* Responsive: mobile */
@media (max-width: 520px) {
    .register-card[b-fu4va5u5zr] {
        padding: 20px 16px;
    }
}
/* /Pages/Reports.razor.rz.scp.css */
/* ---- Page layout ------------------------------------------------- */
.rp-page[b-ofu51gjtjn] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ---- Header row -------------------------------------------------- */
.rp-header[b-ofu51gjtjn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.rp-title[b-ofu51gjtjn] {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-heading);
    color: var(--textPrimary);
    margin: 0;
}

.rp-header-actions[b-ofu51gjtjn] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ---- Period pills (segmented) ------------------------------------ */
.rp-period-pills[b-ofu51gjtjn] {
    display: flex;
    gap: 0;
    border-radius: var(--radiusSm);
    border: 1px solid var(--border);
    overflow: hidden;
    flex-shrink: 0;
}

.rp-pill[b-ofu51gjtjn] {
    padding: 8px 14px;
    border: none;
    border-radius: 0;
    background: var(--surface);
    color: var(--textSecondary);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
    white-space: nowrap;
}

.rp-pill:not(:last-child)[b-ofu51gjtjn] {
    border-right: 1px solid var(--border);
}

.rp-pill:hover[b-ofu51gjtjn] {
    background: var(--surfaceAlt);
}

.rp-pill-active[b-ofu51gjtjn] {
    background: var(--primary);
    color: #fff;
}

.rp-pill-active:hover[b-ofu51gjtjn] {
    background: var(--primary);
}

/* ---- Export button ------------------------------------------------ */
.rp-export-btn[b-ofu51gjtjn] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--textPrimary);
    font-size: 13px;
    font-weight: 500;
    border-radius: var(--radiusSm);
    cursor: not-allowed;
    opacity: 0.6;
    font-family: var(--font-heading);
}

.rp-export-btn .material-symbols-outlined[b-ofu51gjtjn] {
    font-size: 16px;
}

/* ---- Loading state ----------------------------------------------- */
.rp-loading[b-ofu51gjtjn] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 300px;
}

.rp-loading-dots[b-ofu51gjtjn] {
    display: flex;
    gap: 8px;
}

.rp-loading-dots span[b-ofu51gjtjn] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    animation: rp-pulse-b-ofu51gjtjn 1.2s ease-in-out infinite;
}

.rp-loading-dots span:nth-child(2)[b-ofu51gjtjn] {
    animation-delay: 0.2s;
}

.rp-loading-dots span:nth-child(3)[b-ofu51gjtjn] {
    animation-delay: 0.4s;
}

@keyframes rp-pulse-b-ofu51gjtjn {
    0%, 80%, 100% {
        opacity: 0.3;
        transform: scale(0.8);
    }
    40% {
        opacity: 1;
        transform: scale(1);
    }
}

/* ---- Stats grid -------------------------------------------------- */
.rp-stats[b-ofu51gjtjn] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 20px;
}

.rp-stat-card[b-ofu51gjtjn] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px;
    box-shadow: var(--shadow);
    position: relative;
}

.rp-stat-label[b-ofu51gjtjn] {
    font-size: 11px;
    font-weight: 500;
    color: var(--textMuted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-family: var(--font-heading);
    margin-bottom: 6px;
}

.rp-stat-value[b-ofu51gjtjn] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    font-size: 24px;
    font-weight: 600;
    color: var(--textPrimary);
    line-height: 1.1;
    font-family: var(--font-mono);
}

.rp-stat-unit[b-ofu51gjtjn] {
    font-size: 12px;
    font-weight: 400;
    color: var(--textMuted);
}

.rp-stat-none[b-ofu51gjtjn] {
    color: var(--textMuted);
}

/* ---- Merged Average + Readings subtitle -------------------------- */
.rp-stat-sub[b-ofu51gjtjn] {
    font-size: 12px;
    color: var(--textMuted);
    margin-top: 6px;
    font-family: var(--font-mono);
}

/* ---- Range breakdown card (TBR/TIR/TAR) -------------------------- */
.rp-range-card[b-ofu51gjtjn] {
    overflow: visible;
}

.rp-range-rows[b-ofu51gjtjn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rp-range-row[b-ofu51gjtjn] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rp-range-dot[b-ofu51gjtjn] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}

.rp-range-dot-danger[b-ofu51gjtjn] {
    background: var(--danger);
}

.rp-range-dot-success[b-ofu51gjtjn] {
    background: var(--success);
}

.rp-range-dot-warning[b-ofu51gjtjn] {
    background: var(--warning);
}

.rp-range-label[b-ofu51gjtjn] {
    font-size: 12px;
    color: var(--textSecondary);
    flex: 1;
}

.rp-range-pct[b-ofu51gjtjn] {
    font-size: 16px;
    font-weight: 600;
    font-family: var(--font-mono);
    min-width: 40px;
    text-align: right;
}

.rp-range-pct-danger[b-ofu51gjtjn] {
    color: var(--danger);
}

.rp-range-pct-success[b-ofu51gjtjn] {
    color: var(--success);
}

.rp-range-pct-warning[b-ofu51gjtjn] {
    color: var(--warning);
}

/* ---- Stat hint (tooltip on focus/hover) -------------------------- */
.rp-stat-hint[b-ofu51gjtjn] {
    display: none;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--textPrimary);
    color: var(--surface);
    font-size: 12px;
    line-height: 1.4;
    padding: 10px 14px;
    border-radius: var(--radiusSm);
    max-width: 260px;
    width: max-content;
    z-index: 10;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.rp-stat-card:hover .rp-stat-hint[b-ofu51gjtjn],
.rp-stat-card:focus .rp-stat-hint[b-ofu51gjtjn],
.rp-stat-card:focus-within .rp-stat-hint[b-ofu51gjtjn] {
    display: block;
}

/* ---- A1C card ---------------------------------------------------- */
.rp-a1c-card[b-ofu51gjtjn] {
    position: relative;
}

.rp-a1c-note[b-ofu51gjtjn] {
    font-size: 11px;
    color: var(--textMuted);
    margin-top: 8px;
    line-height: 1.4;
}

/* ---- Card headings ----------------------------------------------- */
.rp-card-heading[b-ofu51gjtjn] {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-heading);
    margin: 0 0 14px;
    color: var(--textPrimary);
}

/* ---- Glucose trend card ------------------------------------------ */

/* ---- Two-column grid --------------------------------------------- */
.rp-two-col[b-ofu51gjtjn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* ---- Time in range card ------------------------------------------ */
.rp-tir-content[b-ofu51gjtjn] {
    display: flex;
    align-items: center;
    gap: 28px;
}

.rp-donut-wrap[b-ofu51gjtjn] {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
}

.rp-donut[b-ofu51gjtjn] {
    width: 100%;
    height: 100%;
}

.rp-tir-legend[b-ofu51gjtjn] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rp-legend-item[b-ofu51gjtjn] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rp-legend-dot[b-ofu51gjtjn] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    flex-shrink: 0;
}

.rp-dot-green[b-ofu51gjtjn] {
    background: var(--success);
}

.rp-dot-amber[b-ofu51gjtjn] {
    background: var(--warning);
}

.rp-dot-rose[b-ofu51gjtjn] {
    background: var(--danger);
}

.rp-legend-label[b-ofu51gjtjn] {
    font-size: 12px;
    color: var(--textSecondary);
    flex: 1;
}

.rp-legend-pct[b-ofu51gjtjn] {
    font-size: 18px;
    font-weight: 600;
    font-family: var(--font-mono);
    color: var(--textPrimary);
    margin-left: 16px;
}

/* ---- Fasting trend card ------------------------------------------ */
.rp-fasting-card .rp-card-heading[b-ofu51gjtjn] {
    margin-bottom: 2px;
}

.rp-fasting-header[b-ofu51gjtjn] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 14px;
}

.rp-fasting-sub[b-ofu51gjtjn] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 0;
}

.rp-fasting-toggle[b-ofu51gjtjn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: var(--radiusSm);
    background: var(--surface);
    color: var(--textSecondary);
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;
}

.rp-fasting-toggle:hover[b-ofu51gjtjn] {
    background: var(--surfaceAlt);
    color: var(--textPrimary);
}

.rp-fasting-toggle .material-symbols-outlined[b-ofu51gjtjn] {
    font-size: 18px;
}

.rp-fasting-empty[b-ofu51gjtjn] {
    font-size: 13px;
    color: var(--textMuted);
    text-align: center;
    padding: 24px 0;
}

.rp-fasting-stat[b-ofu51gjtjn] {
    display: flex;
    align-items: baseline;
    gap: 12px;
}

.rp-fasting-value[b-ofu51gjtjn] {
    font-size: 28px;
    font-weight: 600;
    color: var(--textPrimary);
    font-family: var(--font-mono);
    line-height: 1.1;
}

.rp-fasting-delta[b-ofu51gjtjn] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: var(--radiusSm);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-mono);
}

.rp-delta-good[b-ofu51gjtjn] {
    background: var(--alertGreenBg);
    color: var(--alertGreenText);
    border: 1px solid var(--alertGreenBorder);
}

.rp-delta-warn[b-ofu51gjtjn] {
    background: var(--alertAmberBg);
    color: var(--alertAmberText);
    border: 1px solid var(--alertAmberBorder);
}

/* ---- Sparkline --------------------------------------------------- */
.rp-sparkline-wrap[b-ofu51gjtjn] {
    padding: 8px 0;
}

.rp-sparkline[b-ofu51gjtjn] {
    width: 100%;
    height: 90px;
}

[b-ofu51gjtjn] .rp-axis-label {
    font-size: 10px;
    fill: var(--textMuted);
    font-family: var(--font-mono);
}

/* ---- Pattern analysis card --------------------------------------- */
.rp-pattern-card .rp-card-heading[b-ofu51gjtjn] {
    font-size: 15px;
    margin-bottom: 2px;
}

.rp-pattern-sub[b-ofu51gjtjn] {
    font-size: 13px;
    color: var(--textMuted);
    margin: 0 0 14px;
}

.rp-pattern-grid[b-ofu51gjtjn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.rp-pattern-item[b-ofu51gjtjn] {
    background: var(--surfaceAlt);
    border: 1.5px solid var(--border);
    border-radius: 12px;
    padding: 16px 18px;
}

.rp-pattern-label[b-ofu51gjtjn] {
    font-size: 12px;
    font-weight: 500;
    color: var(--textMuted);
    margin-bottom: 4px;
}

.rp-pattern-value[b-ofu51gjtjn] {
    font-size: 20px;
    font-weight: 700;
    color: var(--textPrimary);
    font-family: var(--font-heading);
    line-height: 1.2;
    margin-bottom: 4px;
}

.rp-pattern-detail[b-ofu51gjtjn] {
    font-size: 13px;
    color: var(--primary);
    font-weight: 600;
    font-family: var(--font-mono);
}

/* ---- Care summary card ------------------------------------------- */
.rp-care-card .rp-card-heading[b-ofu51gjtjn] {
    font-size: 15px;
    margin-bottom: 14px;
}

.rp-care-list[b-ofu51gjtjn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rp-care-item[b-ofu51gjtjn] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--surfaceAlt);
    border: 1.5px solid var(--border);
    border-radius: 12px;
    font-size: 14px;
    color: var(--textPrimary);
    line-height: 1.4;
}

.rp-care-dot[b-ofu51gjtjn] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
}

/* ---- Responsive -------------------------------------------------- */
@media (max-width: 960px) {
    .rp-two-col[b-ofu51gjtjn] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .rp-stats[b-ofu51gjtjn] {
        grid-template-columns: 1fr;
    }

    .rp-pattern-grid[b-ofu51gjtjn] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .rp-header[b-ofu51gjtjn] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

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

    .rp-pill[b-ofu51gjtjn] {
        padding: 6px 10px;
        font-size: 12px;
    }

    .rp-stat-value[b-ofu51gjtjn] {
        font-size: 20px;
    }

    .rp-tir-content[b-ofu51gjtjn] {
        flex-direction: column;
        gap: 16px;
    }

    .rp-pattern-value[b-ofu51gjtjn] {
        font-size: 17px;
    }

    .rp-care-item[b-ofu51gjtjn] {
        font-size: 13px;
        padding: 12px 14px;
    }

    .rp-fasting-value[b-ofu51gjtjn] {
        font-size: 22px;
    }
}