/* /Components/Account/Pages/Login.razor.rz.scp.css */
/* Auth card spacing + clearer secondary-link hierarchy. */
.tmg-auth-card[b-cmcb5pt8v5] {
    padding: 36px 36px 32px;
}

.tmg-auth-title[b-cmcb5pt8v5] {
    font-size: 1.625rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 0.35rem;
}

.tmg-auth-subtitle[b-cmcb5pt8v5] {
    color: var(--tmg-text-muted, #6B7280);
    margin: 0 0 1.5rem;
}

[b-cmcb5pt8v5] .form-floating {
    margin-bottom: 1rem !important;
}

[b-cmcb5pt8v5] .form-floating > .form-control {
    padding-top: 1.625rem;
    padding-bottom: 0.5rem;
}

[b-cmcb5pt8v5] .form-check {
    margin-bottom: 1.25rem !important;
}

[b-cmcb5pt8v5] .btn-primary.btn-lg {
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 600;
}

.tmg-auth-divider[b-cmcb5pt8v5] {
    margin: 1.25rem 0 0.5rem;
    font-size: 0.7rem;
}

.tmg-auth-links[b-cmcb5pt8v5] {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--tmg-border, #E5E7EB);
    gap: 0.55rem;
}

.tmg-auth-links a[b-cmcb5pt8v5] {
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #6B7280);
    transition: color 120ms ease;
}

.tmg-auth-links a.tmg-auth-link-new[b-cmcb5pt8v5] {
    color: var(--tmg-brand, #0F766E);
    font-weight: 500;
}

.tmg-auth-links a:hover[b-cmcb5pt8v5] {
    color: var(--tmg-brand, #0F766E);
}
/* /Components/Account/Pages/Manage/EmailPreferences.razor.rz.scp.css */
.email-preferences[b-bbbkon5rrq] { max-width: 48rem; overflow-wrap: anywhere; }
.email-preferences-option[b-bbbkon5rrq] { padding: 1.25rem; margin: 1.5rem 0 1rem; border: 1px solid var(--tmg-border); border-radius: .75rem; background: var(--tmg-surface); }
.email-preferences-option .form-check[b-bbbkon5rrq] { margin-bottom: .75rem; }
.email-preferences-option .form-check-input[b-bbbkon5rrq] { min-width: 1.1rem; min-height: 1.1rem; }
.email-preferences-save[b-bbbkon5rrq] { min-height: 44px; white-space: normal; }
.email-preferences-essential[b-bbbkon5rrq] { margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--tmg-border); }
.email-preferences-essential h4[b-bbbkon5rrq] { font-size: 1.1rem; }
@media (max-width: 575px) { .email-preferences-option[b-bbbkon5rrq] { padding: 1rem; } .email-preferences-save[b-bbbkon5rrq] { width: 100%; } }
/* /Components/Account/Pages/Register.razor.rz.scp.css */
/* Register: form card + benefits panel. Stacked (form first) below 992px; two columns
   (benefits left, form right) from 992px. Auth-card spacing mirrors Login. */
.tmg-register[b-i93qkkwsex] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    max-width: 440px;
    margin: 8px auto 24px;
}

.tmg-register .tmg-auth-card[b-i93qkkwsex] {
    margin: 0;
    max-width: none;
    width: 100%;
    padding: 36px 36px 32px;
}

.tmg-auth-title[b-i93qkkwsex] {
    font-size: 1.625rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 0.35rem;
}

.tmg-register-lede[b-i93qkkwsex] {
    color: var(--tmg-text-muted, #6B7280);
    margin: 0 0 1.5rem;
}

[b-i93qkkwsex] .form-floating {
    margin-bottom: 1rem !important;
}

[b-i93qkkwsex] .form-floating > .form-control {
    padding-top: 1.625rem;
    padding-bottom: 0.5rem;
}

[b-i93qkkwsex] .btn-primary.btn-lg {
    padding: 0.65rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    margin-top: 0.5rem;
}

/* "Advanced options" — native disclosure, collapsed by default. */
.tmg-register-advanced[b-i93qkkwsex] {
    margin: 0 0 0.75rem;
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: 8px;
    padding: 0 12px;
}

.tmg-register-advanced > summary[b-i93qkkwsex] {
    cursor: pointer;
    min-height: 44px;
    display: flex;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--tmg-text-muted, #6B7280);
    list-style: none;
}

/* display:flex drops the native disclosure marker, so draw a chevron that turns when open. */
.tmg-register-advanced > summary[b-i93qkkwsex]::-webkit-details-marker {
    display: none;
}

.tmg-register-advanced > summary[b-i93qkkwsex]::after {
    content: '\f282'; /* bi-chevron-down */
    font-family: 'bootstrap-icons';
    margin-left: auto;
    padding-left: 8px;
    line-height: 1;
    transition: transform .2s ease;
}

.tmg-register-advanced[open] > summary[b-i93qkkwsex]::after {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    .tmg-register-advanced > summary[b-i93qkkwsex]::after {
        transition: none;
    }
}

.tmg-register-advanced > summary:hover[b-i93qkkwsex],
.tmg-register-advanced[open] > summary[b-i93qkkwsex] {
    color: var(--tmg-text, #111827);
}

.tmg-register-advanced > summary:focus-visible[b-i93qkkwsex] {
    outline: 2px solid var(--tmg-brand, #0F766E);
    outline-offset: 2px;
    border-radius: 4px;
}

.tmg-register-advanced .form-check[b-i93qkkwsex] {
    margin: 0 0 12px;
}

.tmg-register-consent[b-i93qkkwsex] {
    margin: 0.75rem 0 0;
    font-size: 0.8rem;
    color: var(--tmg-text-muted, #6B7280);
    text-align: center;
}

.tmg-register-consent a[b-i93qkkwsex] {
    color: var(--tmg-brand, #0F766E);
}

.tmg-auth-links[b-i93qkkwsex] {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--tmg-border, #E5E7EB);
    align-items: center;
    text-align: center;
}

.tmg-auth-links a[b-i93qkkwsex] {
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #6B7280);
}

.tmg-auth-links a:hover[b-i93qkkwsex] {
    color: var(--tmg-brand, #0F766E);
}

/* Benefits panel */
.tmg-register-benefits[b-i93qkkwsex] {
    background: var(--tmg-brand-50, #F0FDFA);
    border: 1px solid var(--tmg-brand-200, #99F6E4);
    border-radius: var(--tmg-radius-lg, 14px);
    padding: 28px 24px;
    color: var(--tmg-text, #111827);
}

.tmg-register-benefits-title[b-i93qkkwsex] {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
    margin: 0 0 0.6rem;
}

.tmg-register-benefits-sub[b-i93qkkwsex] {
    color: var(--tmg-text-muted, #6B7280);
    margin: 0 0 1.25rem;
}

.tmg-register-benefits-list[b-i93qkkwsex] {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tmg-register-benefits-list li[b-i93qkkwsex] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-weight: 500;
}

.tmg-register-benefits-list i[b-i93qkkwsex] {
    color: var(--tmg-brand, #0F766E);
    font-size: 1.1rem;
    line-height: 1.4;
    flex: none;
}

.tmg-register-benefits-note[b-i93qkkwsex] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #6B7280);
}

@media (max-width: 575.98px) {
    .tmg-register .tmg-auth-card[b-i93qkkwsex] {
        padding: 28px 20px 24px;
    }

    .tmg-register-benefits[b-i93qkkwsex] {
        padding: 22px 20px;
    }
}

@media (min-width: 992px) {
    .tmg-register[b-i93qkkwsex] {
        max-width: 960px;
        grid-template-columns: minmax(0, 1fr) minmax(0, 440px);
        grid-template-areas: "benefits form";
        gap: 48px;
        align-items: center;
        margin-top: 24px;
    }

    .tmg-register-card[b-i93qkkwsex] {
        grid-area: form;
    }

    .tmg-register-benefits[b-i93qkkwsex] {
        grid-area: benefits;
        padding: 40px 36px;
    }

    .tmg-register-benefits-title[b-i93qkkwsex] {
        font-size: 1.75rem;
    }
}
/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
/* Account/Manage layout: tighter header, calmer left rail. */
.tmg-manage-header[b-3e4dt7syv9] {
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--tmg-border, #E5E7EB);
}

.tmg-manage-title[b-3e4dt7syv9] {
    font-size: 1.625rem;
    font-weight: 700;
    margin: 0 0 4px;
    letter-spacing: -0.01em;
    color: var(--tmg-text, #111827);
}

.tmg-manage-subtitle[b-3e4dt7syv9] {
    margin: 0;
    color: var(--tmg-text-muted, #6B7280);
    font-size: 0.95rem;
}

.tmg-manage-row[b-3e4dt7syv9] {
    margin-top: 8px;
}

.tmg-manage-body[b-3e4dt7syv9] {
    padding-left: 24px;
}

@media (max-width: 991.98px) {
    .tmg-manage-body[b-3e4dt7syv9] {
        padding-left: 12px;
        padding-top: 16px;
    }
}
/* /Components/Account/Shared/ManageNavMenu.razor.rz.scp.css */
/* Replace the harsh Bootstrap nav-pills look with calm muted rail. */
.nav-pills[b-qh3f4qupd4] {
    --bs-nav-pills-border-radius: 6px;
    --bs-nav-pills-link-active-color: var(--tmg-text, #111827);
    --bs-nav-pills-link-active-bg: rgba(15, 118, 110, 0.08);
    border-right: 1px solid var(--tmg-border, #E5E7EB);
    padding-right: 8px;
    gap: 1px;
}

[b-qh3f4qupd4] .nav-link {
    color: var(--tmg-text-muted, #6B7280);
    padding: 0.5rem 0.85rem;
    border-radius: 6px;
    font-size: 0.9rem;
    border-left: 2px solid transparent;
    border-radius: 0 6px 6px 0;
    transition: background 120ms ease, color 120ms ease;
}

[b-qh3f4qupd4] .nav-link:hover {
    background: rgba(15, 23, 42, 0.04);
    color: var(--tmg-text, #111827);
}

[b-qh3f4qupd4] .nav-link.active {
    background: rgba(15, 118, 110, 0.08) !important;
    color: var(--tmg-brand, #0F766E) !important;
    font-weight: 600;
    border-left-color: var(--tmg-brand, #0F766E);
}

@media (max-width: 991.98px) {
    .nav-pills[b-qh3f4qupd4] {
        border-right: none;
        border-bottom: 1px solid var(--tmg-border, #E5E7EB);
        padding-right: 0;
        padding-bottom: 12px;
        margin-bottom: 12px;
        flex-direction: row !important;
        flex-wrap: wrap;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-2ep6li6kfy] {
    position: relative;
    display: flex;
    flex-direction: column;
    background: var(--tmg-bg, #F9FAFB);
    min-height: 100vh;
}

main[b-2ep6li6kfy] {
    flex: 1;
    background-color: var(--tmg-bg, #F3F5F9);
    /* Very subtle fixed brand tint over the app-shell content area. */
    background-image:
        radial-gradient(1200px 600px at 85% -10%, rgba(13, 148, 136, .06), transparent 60%),
        radial-gradient(900px 500px at -10% 110%, rgba(16, 185, 129, .05), transparent 55%);
    background-attachment: fixed;
    /* Critical: flex children without min-width:0 collapse to their min-content width,
       and any deeply-nested wide grid/flex (e.g. many-campaign charts) pushes the body
       past the viewport. Containing it here keeps horizontal scroll *local* to whichever
       widget needs it, not on the document as a whole. */
    min-width: 0;
    overflow-x: hidden;
}

html[data-tmg-theme="dark"] main[b-2ep6li6kfy] {
    background-image:
        radial-gradient(1200px 600px at 85% -10%, rgba(20, 184, 166, .04), transparent 60%),
        radial-gradient(900px 500px at -10% 110%, rgba(52, 211, 153, .03), transparent 55%);
}

.sidebar[b-2ep6li6kfy] {
    background-color: var(--tmg-sidebar-bg, #1F2937);
    /* Deep blue-teal vertical gradient instead of the flat slate. */
    background-image: linear-gradient(180deg, #111C2E 0%, #0F1B24 60%, #0E1A20 100%);
    color: var(--tmg-sidebar-fg, #E5E7EB);
}

/* Scope from this layout into the nested bell component. Only an open menu
   lifts the sidebar above ordinary content; a closed sidebar stays below
   the main course dialogs. This also works for the mobile flex item. */
.page[b-2ep6li6kfy]  .sidebar:has(.tmg-notification-bell.open) {
    z-index: 20;
}

@media (max-width: 640.98px) {
    article.content[b-2ep6li6kfy] {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .tmg-page-card[b-2ep6li6kfy] {
        max-width: 100%;
        margin: 12px 0;
        padding: 16px;
    }
    .sidebar[b-2ep6li6kfy] {
        min-height: 64px;
    }
}

@media (min-width: 641px) {
    .page[b-2ep6li6kfy] {
        flex-direction: row;
    }

    .sidebar[b-2ep6li6kfy] {
        width: 240px;
        height: 100vh;
        position: sticky;
        top: 0;
        flex-shrink: 0;
    }

    article.content[b-2ep6li6kfy] {
        padding-left: 24px !important;
        padding-right: 24px !important;
        padding-top: 24px;
    }
}

/* #blazor-error-ui styles live in app.css (global): the banner div is rendered by
   BOTH MainLayout and PublicLayout, and scoped rules here only matched MainLayout's
   copy — leaving the banner permanently visible on public pages. */
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-d0ohu0gmbo] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-d0ohu0gmbo] {
    background-color: rgba(255, 255, 255, 0.5);
}

/* Wordmark, then the theme toggle and (for admins and customers) the bell. The wordmark gives way
   first, so the three never touch inside the 240px sidebar. */
.tmg-sidebar-brand[b-d0ohu0gmbo] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 16px 14px 16px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    min-height: 64px;
}

/* ---- Theme toggle button ---- */
.tmg-theme-toggle[b-d0ohu0gmbo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    margin-left: auto;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(229, 231, 235, 0.85);
    cursor: pointer;
    transition: background .15s ease, color .15s ease, transform .15s ease;
    font-size: 1rem;
    line-height: 1;
    padding: 0;
}

.tmg-theme-toggle:hover[b-d0ohu0gmbo],
.tmg-theme-toggle:focus-visible[b-d0ohu0gmbo] {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    transform: scale(1.08);
    outline: none;
}

/* Icon swap: show moon in light mode, sun in dark mode. */
html[data-tmg-theme="light"] .tmg-theme-icon-light[b-d0ohu0gmbo],
html:not([data-tmg-theme]) .tmg-theme-icon-light[b-d0ohu0gmbo] {
    display: none;
}

html[data-tmg-theme="dark"] .tmg-theme-icon-dark[b-d0ohu0gmbo] {
    display: none;
}

html[data-tmg-theme="dark"] .tmg-theme-icon-light[b-d0ohu0gmbo] {
    display: inline;
}

/* Two classes deep so the dark theme's generic link colour does not turn the wordmark teal. */
.tmg-sidebar-brand .tmg-sidebar-wordmark[b-d0ohu0gmbo],
.tmg-sidebar-brand .tmg-sidebar-wordmark:hover[b-d0ohu0gmbo] {
    color: #F8FAFC;
}

.tmg-sidebar-wordmark[b-d0ohu0gmbo] {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: #F8FAFC;
    text-decoration: none;
    font-size: 1.04rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.tmg-sidebar-wordmark span[b-d0ohu0gmbo] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tmg-sidebar-wordmark img[b-d0ohu0gmbo] {
    filter: brightness(0) invert(1);
    opacity: 0.95;
    flex-shrink: 0;
    display: block;
    /* Optical alignment with text baseline. */
    transform: translateY(-1px);
}

.tmg-sidebar-wordmark:hover[b-d0ohu0gmbo] {
    color: #fff;
}

.tmg-sidebar-nav[b-d0ohu0gmbo] {
    display: flex;
    flex-direction: column;
    height: calc(100% - 64px);
    padding: 8px 0 0;
}

.tmg-nav-list[b-d0ohu0gmbo] {
    list-style: none;
    margin: 0;
    padding: 0 8px;
}

.tmg-nav-list li[b-d0ohu0gmbo] {
    margin: 1px 0;
}

.tmg-nav-list[b-d0ohu0gmbo]  .tmg-nav-link,
.tmg-nav-list .tmg-nav-link[b-d0ohu0gmbo] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 14px;
    color: var(--tmg-sidebar-fg, #E5E7EB);
    text-decoration: none;
    border-radius: 8px;
    border-left: 2px solid transparent;
    font-size: 0.9rem;
    line-height: 1.25rem;
    background: transparent;
    border-top: none;
    border-right: none;
    border-bottom: none;
    width: 100%;
    transition: background .15s ease, color .15s ease, transform .15s ease;
}

.tmg-nav-list .tmg-nav-link i[b-d0ohu0gmbo] {
    width: 18px;
    font-size: 1rem;
    text-align: center;
    opacity: 0.85;
}

.tmg-nav-list[b-d0ohu0gmbo]  a.tmg-nav-link:hover,
.tmg-nav-list .tmg-nav-link:hover[b-d0ohu0gmbo] {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    transform: translateX(2px);
}

.tmg-nav-list[b-d0ohu0gmbo]  a.tmg-nav-link.active {
    background: linear-gradient(90deg, rgb(16 185 129 / .18), rgb(16 185 129 / .05));
    color: #6EE7B7;
    border-left-color: transparent;
    box-shadow: inset 3px 0 0 var(--tmg-sidebar-active, #10B981);
    transform: none;
}

/* Section eyebrows ("Platform", "AI training", …). Rendered via text-transform so
   the markup stays readable; a hairline rule fills the remaining row width to give
   each section a quiet, professional delineation instead of floating caps text. */
.tmg-nav-section-label[b-d0ohu0gmbo] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(148, 163, 184, 0.78);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-weight: 700;
    padding: 16px 14px 6px;
    user-select: none;
}

.tmg-nav-section-label[b-d0ohu0gmbo]::after {
    content: "";
    flex: 1 1 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(148, 163, 184, 0.28), transparent);
}

.tmg-sidebar-footer[b-d0ohu0gmbo] {
    margin-top: auto;
    padding: 12px 16px 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--tmg-sidebar-fg, #E5E7EB);
}

.tmg-user-row[b-d0ohu0gmbo] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.tmg-user-email[b-d0ohu0gmbo] {
    font-size: 0.8rem;
    color: rgba(229, 231, 235, 0.85);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
}

.tmg-role-chip[b-d0ohu0gmbo] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 3px 9px;
    border-radius: 9999px;
    background: rgba(16, 185, 129, 0.18);
    color: #6ee7b7;
    border: 1px solid rgba(16, 185, 129, 0.3);
    flex-shrink: 0;
}

.tmg-role-chip.tmg-role-caller[b-d0ohu0gmbo] {
    background: rgba(59, 130, 246, 0.18);
    color: #93c5fd;
    border-color: rgba(59, 130, 246, 0.3);
}

.tmg-user-email[b-d0ohu0gmbo] {
    font-weight: 500;
}

.tmg-sidebar-footer-links[b-d0ohu0gmbo] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.tmg-footer-link[b-d0ohu0gmbo] {
    background: none;
    border: none;
    padding: 0;
    color: rgba(229, 231, 235, 0.7);
    font-size: 0.8rem;
    text-decoration: none;
    cursor: pointer;
}

.tmg-footer-link:hover[b-d0ohu0gmbo] {
    color: #fff;
    text-decoration: underline;
}

.tmg-signout-form[b-d0ohu0gmbo] {
    display: inline;
    margin: 0;
    margin-left: auto;
}

.tmg-signout-btn[b-d0ohu0gmbo] {
    color: rgba(229, 231, 235, 0.9);
    font-weight: 500;
}

.tmg-signout-btn:hover[b-d0ohu0gmbo] {
    color: #fff;
}

.nav-scrollable[b-d0ohu0gmbo] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-d0ohu0gmbo] {
    display: block;
}

@media (max-width: 640px) {
    /* Keep the menu's reserved hit area separate from theme and notification controls. */
    .tmg-sidebar-brand[b-d0ohu0gmbo] {
        padding: 10px 68px 10px 12px;
        gap: 6px;
    }

    .navbar-toggler[b-d0ohu0gmbo] {
        top: 10px;
        right: 12px;
        width: 44px;
        height: 44px;
    }

    .tmg-theme-toggle[b-d0ohu0gmbo] {
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        margin-right: 0;
    }

    .tmg-sidebar-wordmark[b-d0ohu0gmbo] {
        gap: 8px;
        font-size: 1rem;
    }
}

@media (min-width: 641px) {
    .navbar-toggler[b-d0ohu0gmbo] {
        display: none;
    }

    .nav-scrollable[b-d0ohu0gmbo] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 64px);
        overflow-y: auto;
    }
}
/* /Components/Layout/PublicLayout.razor.rz.scp.css */
/* Public shell styles are owned by wwwroot/public-design.css. */
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lyuyurc12h],
.components-reconnect-repeated-attempt-visible[b-lyuyurc12h],
.components-reconnect-failed-visible[b-lyuyurc12h],
.components-pause-visible[b-lyuyurc12h],
.components-resume-failed-visible[b-lyuyurc12h],
.components-rejoining-animation[b-lyuyurc12h] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-retrying[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-failed[b-lyuyurc12h],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-lyuyurc12h] {
    display: block;
}


#components-reconnect-modal[b-lyuyurc12h] {
    background-color: var(--tmg-surface, #fff);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-lyuyurc12h 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-lyuyurc12h 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-lyuyurc12h 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-lyuyurc12h]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-lyuyurc12h 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-lyuyurc12h {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-lyuyurc12h {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-lyuyurc12h {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-lyuyurc12h] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-lyuyurc12h] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-lyuyurc12h] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-lyuyurc12h] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-lyuyurc12h] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-lyuyurc12h] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-lyuyurc12h] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-lyuyurc12h 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-lyuyurc12h] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-lyuyurc12h {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/About.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Admin/BillingAdmin.razor.rz.scp.css */
.tmg-billing-cards[b-i2cskfutcw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.tmg-billing-card[b-i2cskfutcw] {
    background: linear-gradient(160deg, var(--tmg-card-bg, #ffffff), rgba(99, 102, 241, 0.04));
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.tmg-billing-card-label[b-i2cskfutcw] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--tmg-muted, #64748B);
    margin-bottom: 6px;
}

.tmg-billing-card-value[b-i2cskfutcw] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.tmg-billing-card-sub[b-i2cskfutcw] {
    font-size: 0.78rem;
    color: var(--tmg-muted, #64748B);
    margin-top: 4px;
}

.tmg-billing-panel[b-i2cskfutcw] {
    background: var(--tmg-card-bg, #ffffff);
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.tmg-billing-panel h2[b-i2cskfutcw] {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 10px;
}

.tmg-billing-grid[b-i2cskfutcw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

@media (max-width: 900px) {
    .tmg-billing-grid[b-i2cskfutcw] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Admin/BusinessEmail.razor.rz.scp.css */
.email-message-summary[b-4t5jnuk4wm] {
    cursor: pointer;
    min-height: 44px;
    padding: .25rem 0;
}
.email-subject[b-4t5jnuk4wm] {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
details[open] .email-message-summary[b-4t5jnuk4wm] { margin-bottom: .5rem; }
.email-review-scroll[b-4t5jnuk4wm] { max-width: 100%; overflow-x: auto; }
.email-review-scroll table[b-4t5jnuk4wm] { min-width: 760px; margin-bottom: 0; }
.email-review-scroll th[b-4t5jnuk4wm], .email-review-scroll td[b-4t5jnuk4wm] { white-space: nowrap; }
.email-review-scroll:focus-visible[b-4t5jnuk4wm] { outline: 2px solid var(--bs-primary, #087f75); outline-offset: 3px; }
.email-routine-summary[b-4t5jnuk4wm] { cursor: pointer; min-height: 44px; padding: .6rem 0; }
.email-routine-summary:focus-visible[b-4t5jnuk4wm] { outline: 2px solid var(--bs-primary, #087f75); outline-offset: 3px; }
/* /Components/Pages/Admin/Traffic.razor.rz.scp.css */
/* ---- Stat cards ---- */
.tmg-traffic-cards[b-662wyot4y4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.tmg-traffic-card[b-662wyot4y4] {
    background: linear-gradient(160deg, var(--tmg-card-bg, #ffffff), rgba(16, 185, 129, 0.04));
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.tmg-traffic-card-label[b-662wyot4y4] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--tmg-muted, #64748B);
    margin-bottom: 6px;
}

.tmg-traffic-card-value[b-662wyot4y4] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.tmg-traffic-unit[b-662wyot4y4] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--tmg-muted, #64748B);
    margin-left: 2px;
}

.tmg-traffic-card-sub[b-662wyot4y4] {
    font-size: 0.78rem;
    color: var(--tmg-muted, #64748B);
    margin-top: 4px;
}

/* ---- Panels ---- */
.tmg-traffic-panel[b-662wyot4y4] {
    background: var(--tmg-card-bg, #ffffff);
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.tmg-traffic-panel-head[b-662wyot4y4] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 10px;
}

.tmg-traffic-panel-head h2[b-662wyot4y4] {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0;
}

.tmg-traffic-legend[b-662wyot4y4] {
    display: flex;
    gap: 16px;
    font-size: 0.78rem;
    color: var(--tmg-muted, #64748B);
}

.tmg-legend-dot[b-662wyot4y4] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 5px;
    vertical-align: -1px;
}

.tmg-legend-views[b-662wyot4y4] { background: #10B981; }
.tmg-legend-unique[b-662wyot4y4] { background: #6366F1; }

.tmg-traffic-grid[b-662wyot4y4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

@media (max-width: 900px) {
    .tmg-traffic-grid[b-662wyot4y4] { grid-template-columns: 1fr; }
}

/* SVG chart internals (.tmg-chart-*) live in app.css: parts of the SVG are emitted
   as raw MarkupString (Razor reserves the <text> tag) and raw markup doesn't receive
   the scoped-CSS attribute. */

/* ---- Devices ---- */
.tmg-traffic-devices[b-662wyot4y4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 6px 0;
}

.tmg-traffic-device-row[b-662wyot4y4] {
    display: grid;
    grid-template-columns: 110px 1fr 44px;
    align-items: center;
    gap: 12px;
}

.tmg-traffic-device-name[b-662wyot4y4] {
    font-size: 0.85rem;
    font-weight: 600;
}

.tmg-traffic-device-name i[b-662wyot4y4] {
    margin-right: 6px;
    color: var(--tmg-muted, #64748B);
}

.tmg-traffic-device-pct[b-662wyot4y4] {
    text-align: right;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
    color: var(--tmg-muted, #64748B);
}

.tmg-traffic-bar-track[b-662wyot4y4] {
    height: 8px;
    border-radius: 9999px;
    background: rgba(100, 116, 139, 0.12);
    overflow: hidden;
}

.tmg-traffic-bar-fill[b-662wyot4y4] {
    height: 100%;
    border-radius: 9999px;
    background: linear-gradient(90deg, #10B981, #34D399);
}

/* ---- Tables ---- */
.tmg-traffic-table[b-662wyot4y4] { margin-bottom: 0; }

.tmg-traffic-path[b-662wyot4y4] {
    font-family: var(--bs-font-monospace, ui-monospace, monospace);
    font-size: 0.82rem;
}

.tmg-traffic-share-col[b-662wyot4y4] { width: 30%; }

.tmg-traffic-404[b-662wyot4y4] {
    margin-top: 12px;
    font-size: 0.82rem;
    color: #B45309;
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.25);
    border-radius: 10px;
    padding: 8px 12px;
}
/* /Components/Pages/Admin/UnreconciledReservations.razor.rz.scp.css */
.tmg-ur[b-b6j8u416zr] {
    background: var(--tmg-card-bg, #ffffff);
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.tmg-ur-head[b-b6j8u416zr] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
}

.tmg-ur h2[b-b6j8u416zr] {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 4px;
}

.tmg-ur-sub[b-b6j8u416zr] {
    margin: 0;
    max-width: 62ch;
    font-size: 0.85rem;
    color: var(--tmg-muted, #64748B);
}

.tmg-ur-actions[b-b6j8u416zr] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tmg-ur-cards[b-b6j8u416zr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin: 12px 0;
}

.tmg-ur-card[b-b6j8u416zr] {
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    padding: 12px 14px;
}

.tmg-ur-card-label[b-b6j8u416zr] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--tmg-muted, #64748B);
    margin-bottom: 4px;
}

.tmg-ur-card-value[b-b6j8u416zr] {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.tmg-ur-card-sub[b-b6j8u416zr] {
    font-size: 0.72rem;
    color: var(--tmg-muted, #64748B);
    margin-top: 3px;
}

.tmg-ur-note[b-b6j8u416zr] {
    font-size: 0.82rem;
    color: var(--tmg-muted, #64748B);
    margin: 4px 0 10px;
}

.tmg-ur-id[b-b6j8u416zr] {
    font-size: 0.72rem;
    font-family: var(--bs-font-monospace, monospace);
}

.tmg-ur-change[b-b6j8u416zr] {
    font-weight: 600;
    margin-top: 2px;
}

.tmg-ur-backdrop[b-b6j8u416zr] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 1050;
}

.tmg-ur-dialog[b-b6j8u416zr] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    background: var(--tmg-card-bg, #ffffff);
    color: inherit;
    border-radius: 14px;
    padding: 22px 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.3);
    z-index: 1051;
}

.tmg-ur-dialog h2[b-b6j8u416zr] {
    font-size: 1.1rem;
    margin-bottom: 10px;
}

.tmg-ur-dlg-list[b-b6j8u416zr] {
    padding-left: 1.1rem;
    margin-bottom: 10px;
    font-size: 0.9rem;
}

.tmg-ur-dlg-effect[b-b6j8u416zr] {
    font-size: 0.95rem;
}

.tmg-ur-dlg-actions[b-b6j8u416zr] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.tmg-ur-list[b-b6j8u416zr] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.tmg-ur-row[b-b6j8u416zr] {
    border: 1px solid var(--tmg-border, rgba(15, 23, 42, 0.08));
    border-radius: 12px;
    padding: 12px 14px;
}

.tmg-ur-row-head[b-b6j8u416zr] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4px 12px;
    margin-bottom: 6px;
}

.tmg-ur-facts[b-b6j8u416zr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 6px 16px;
    margin: 0 0 8px;
    font-size: 0.85rem;
}

.tmg-ur-facts dt[b-b6j8u416zr] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--tmg-muted, #64748B);
}

.tmg-ur-facts dd[b-b6j8u416zr] {
    margin: 0;
}

.tmg-ur-row-foot[b-b6j8u416zr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.tmg-ur-change[b-b6j8u416zr] {
    margin-left: 8px;
    font-size: 0.85rem;
}
/* /Components/Pages/Agents/Edit.razor.rz.scp.css */
/* Agents editor polish — textarea spacing, rail emphasis, byte-count meta. */
[b-w2h2bqa2ji] textarea.form-control {
    min-height: 180px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.875rem;
    line-height: 1.5;
}

[b-w2h2bqa2ji] .form-text {
    color: var(--tmg-text-muted);
    margin-top: 0.35rem;
}

[b-w2h2bqa2ji] .form-text code {
    font-size: 0.78rem;
    color: var(--tmg-text-muted);
    background: var(--tmg-bg);
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
}

[b-w2h2bqa2ji] .tmg-form-rail {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 1rem;
}

[b-w2h2bqa2ji] .tmg-form-rail .btn:disabled {
    opacity: 0.55;
}

[b-w2h2bqa2ji] .nav-tabs {
    border-bottom: 1px solid var(--tmg-border);
}

[b-w2h2bqa2ji] .nav-tabs .nav-link {
    color: var(--tmg-text-muted);
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.5rem 0.9rem;
    margin-bottom: -1px;
    background: transparent;
}

[b-w2h2bqa2ji] .nav-tabs .nav-link.active {
    color: var(--tmg-brand);
    border-bottom-color: var(--tmg-brand);
    font-weight: 600;
    background: transparent;
}

[b-w2h2bqa2ji] .alert-warning {
    background: var(--tmg-tint-warn-bg, #FFFBEB);
    border-color: var(--tmg-tint-warn-border, #FEF3C7);
    color: var(--tmg-warn-text, #92400E);
}
/* /Components/Pages/Agents/Index.razor.rz.scp.css */
/* Agents list polish. */
[b-rbw4qqn8bv] table.tmg-table tbody tr td {
    vertical-align: middle;
}

[b-rbw4qqn8bv] table.tmg-table td code {
    font-size: 0.85rem;
    color: var(--tmg-text-muted);
    background: transparent;
    padding: 0;
    white-space: nowrap;
}

[b-rbw4qqn8bv] table.tmg-table td:nth-child(2) code {
    color: var(--tmg-text);
}

[b-rbw4qqn8bv] table.tmg-table td:last-child {
    text-align: right;
    width: 1%;
    white-space: nowrap;
}
/* /Components/Pages/Assistant.razor.rz.scp.css */
.assistant-workspace[b-hxkx35f3c3]{color:var(--tmg-text);max-width:1440px;margin:auto}.assistant-header[b-hxkx35f3c3]{display:flex;align-items:center;gap:18px;padding:12px 0 24px}.assistant-mark[b-hxkx35f3c3]{display:grid;place-items:center;width:58px;height:58px;border-radius:19px;background:var(--tmg-brand-grad);color:white;font-size:26px;box-shadow:0 8px 30px #0f766e22}.assistant-header h1[b-hxkx35f3c3]{font-size:clamp(1.5rem,2.4vw,2.2rem);letter-spacing:-.04em;margin:3px 0}.assistant-header p[b-hxkx35f3c3]{margin:0;color:var(--tmg-text-muted)}.assistant-header>button[b-hxkx35f3c3]{margin-left:auto;min-height:44px}.assistant-eyebrow[b-hxkx35f3c3]{font-size:.67rem;font-weight:800;letter-spacing:.13em;color:var(--tmg-brand)}.assistant-status[b-hxkx35f3c3]{border:1px solid var(--tmg-border);background:var(--tmg-bg);padding:12px 16px;border-radius:12px;font-size:.8rem;margin-bottom:20px}.assistant-grid[b-hxkx35f3c3]{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);gap:22px;align-items:start}.assistant-chat[b-hxkx35f3c3]{border:1px solid var(--tmg-border);border-radius:22px;overflow:hidden;background:var(--tmg-surface);position:sticky;top:20px}.assistant-chat-body[b-hxkx35f3c3]{min-height:400px;max-height:65vh;overflow:auto;padding:28px}.assistant-welcome[b-hxkx35f3c3]{text-align:center;padding:35px 16px 22px}.assistant-orbit[b-hxkx35f3c3]{color:var(--tmg-brand);font-size:36px}.assistant-welcome h2[b-hxkx35f3c3]{font-size:1.6rem;letter-spacing:-.035em;margin:16px 0 10px}.assistant-welcome p[b-hxkx35f3c3],.assistant-panel p[b-hxkx35f3c3]{color:var(--tmg-text-muted);font-size:.87rem;line-height:1.7}.assistant-starters[b-hxkx35f3c3]{display:grid;grid-template-columns:1fr 1fr;gap:12px}.assistant-starters button[b-hxkx35f3c3]{border:1px solid var(--tmg-border);background:var(--tmg-bg);border-radius:15px;padding:18px;text-align:left;color:var(--tmg-text);min-height:110px;transition:border-color .15s}.assistant-starters button:hover[b-hxkx35f3c3]{border-color:var(--tmg-brand)}.assistant-starters i[b-hxkx35f3c3]{color:var(--tmg-brand);font-size:20px}.assistant-starters strong[b-hxkx35f3c3],.assistant-starters span[b-hxkx35f3c3]{display:block;margin-top:8px}.assistant-starters strong[b-hxkx35f3c3]{font-size:.87rem}.assistant-starters span[b-hxkx35f3c3]{font-size:.75rem;color:var(--tmg-text-muted)}.assistant-message[b-hxkx35f3c3]{padding:16px 18px;background:var(--tmg-bg);border-radius:15px;margin:14px 0;overflow-wrap:anywhere}.assistant-message.is-user[b-hxkx35f3c3]{margin-left:35px;border:1px solid var(--tmg-border);background:var(--tmg-surface)}.assistant-message-author[b-hxkx35f3c3]{font-size:.72rem;font-weight:700;color:var(--tmg-brand);margin-bottom:8px}.assistant-message p[b-hxkx35f3c3]{white-space:pre-wrap;font-size:.87rem;line-height:1.75;margin:0}.assistant-sources[b-hxkx35f3c3]{display:flex;flex-wrap:wrap;gap:6px;margin-top:15px}.assistant-sources span[b-hxkx35f3c3],.assistant-sources a[b-hxkx35f3c3]{font-size:.65rem;border:1px solid var(--tmg-border);border-radius:8px;padding:4px 7px}.assistant-composer[b-hxkx35f3c3]{padding:18px;border-top:1px solid var(--tmg-border);background:var(--tmg-bg)}.assistant-composer textarea[b-hxkx35f3c3]{width:100%;resize:vertical;border:1px solid var(--tmg-border);border-radius:12px;background:var(--tmg-surface);color:var(--tmg-text);padding:13px;font-size:.9rem}.assistant-composer>div[b-hxkx35f3c3]{display:flex;align-items:center;gap:15px;margin-top:10px;justify-content:space-between}.assistant-composer small[b-hxkx35f3c3]{color:var(--tmg-text-muted);font-size:.68rem}.assistant-tabs[b-hxkx35f3c3]{display:flex;padding:5px;background:var(--tmg-bg);border:1px solid var(--tmg-border);border-radius:14px;margin-bottom:12px;gap:4px}.assistant-tabs button[b-hxkx35f3c3]{flex:1;border:0;border-radius:10px;padding:12px 8px;background:transparent;color:var(--tmg-text-muted);font-size:.85rem;font-weight:600;min-height:44px}.assistant-tabs button.active[b-hxkx35f3c3]{background:var(--tmg-surface);color:var(--tmg-brand);box-shadow:0 2px 6px #00000008}.assistant-panel[b-hxkx35f3c3]{border:1px solid var(--tmg-border);border-radius:20px;padding:24px;background:var(--tmg-surface)}.assistant-panel h2[b-hxkx35f3c3]{font-size:1.25rem;letter-spacing:-.025em;margin:9px 0 12px}.assistant-panel label[b-hxkx35f3c3]{display:block;font-size:.78rem;font-weight:650;margin:16px 0 7px}.assistant-panel .form-control[b-hxkx35f3c3],.assistant-panel .form-select[b-hxkx35f3c3]{font-size:.83rem}.assistant-upload[b-hxkx35f3c3]{border:1px dashed var(--tmg-border);border-radius:12px;padding:12px 14px;margin:18px 0}.assistant-upload input[b-hxkx35f3c3]{max-width:100%;font-size:.75rem;margin:15px 0}.assistant-upload label[b-hxkx35f3c3]{margin-top:0}.assistant-note[b-hxkx35f3c3]{font-size:.75rem!important;color:var(--tmg-text-muted);line-height:1.6}.assistant-source-chip[b-hxkx35f3c3]{overflow-wrap:anywhere;font-size:.8rem;border:1px solid var(--tmg-border);border-radius:10px;padding:10px;margin-bottom:10px}.assistant-source-chip small[b-hxkx35f3c3]{display:block;color:var(--tmg-text-muted)}.assistant-clarification[b-hxkx35f3c3],.assistant-evidence[b-hxkx35f3c3]{border-left:3px solid var(--tmg-brand);background:var(--tmg-bg);padding:16px;border-radius:0 12px 12px 0;margin:18px 0;font-size:.8rem}.assistant-clarification p[b-hxkx35f3c3]{margin:10px 0}.assistant-proposal[b-hxkx35f3c3]{margin-top:24px;padding:28px;border:1px solid var(--tmg-border);border-radius:22px;background:var(--tmg-surface)}.assistant-proposal h2[b-hxkx35f3c3]{font-size:1.4rem;letter-spacing:-.03em;margin:10px 0 20px}.assistant-proposal>p[b-hxkx35f3c3]{font-size:.85rem;color:var(--tmg-text-muted)}.assistant-course-cards[b-hxkx35f3c3]{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:20px}.assistant-course-cards article[b-hxkx35f3c3]{border:1px solid var(--tmg-border);border-radius:16px;padding:20px;background:var(--tmg-bg)}.assistant-course-cards span[b-hxkx35f3c3]{font-size:.7rem;color:var(--tmg-brand);font-weight:700}.assistant-course-cards h3[b-hxkx35f3c3]{font-size:1rem;line-height:1.5;margin:12px 0}.assistant-course-cards p[b-hxkx35f3c3],.assistant-course-cards small[b-hxkx35f3c3]{font-size:.8rem;line-height:1.65;color:var(--tmg-text-muted)}.assistant-action-bar[b-hxkx35f3c3]{display:flex;gap:20px;align-items:center;justify-content:space-between;border-top:1px solid var(--tmg-border);padding-top:20px}.assistant-action-bar strong[b-hxkx35f3c3]{font-size:.9rem}.assistant-action-bar p[b-hxkx35f3c3]{font-size:.75rem;color:var(--tmg-text-muted);margin:6px 0}.assistant-action-bar button[b-hxkx35f3c3]{min-height:48px}.assistant-error[b-hxkx35f3c3]{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--tmg-bg);border:1px solid var(--tmg-warning);border-radius:12px;padding:15px;margin-bottom:18px;font-size:.85rem}.assistant-roster[b-hxkx35f3c3]{max-height:380px;overflow:auto;margin-bottom:18px}.assistant-roster-row[b-hxkx35f3c3]{display:grid;grid-template-columns:30px 1fr 1.3fr;gap:12px;padding:12px;border-bottom:1px solid var(--tmg-border);font-size:.8rem;overflow-wrap:anywhere}.assistant-roster-row small[b-hxkx35f3c3]{grid-column:2/-1;color:var(--tmg-text-muted)}.assistant-receipt[b-hxkx35f3c3]{background:var(--tmg-bg);padding:18px;border-radius:12px;margin-bottom:15px}.assistant-receipt p[b-hxkx35f3c3]{font-size:.85rem;line-height:1.7}.assistant-receipt small[b-hxkx35f3c3]{font-size:.7rem;color:var(--tmg-text-muted)}.assistant-draft[b-hxkx35f3c3]{padding:20px;border:1px solid var(--tmg-border);border-radius:15px;margin-top:15px;overflow-wrap:anywhere}.assistant-draft h3[b-hxkx35f3c3]{font-size:1rem}.assistant-draft p[b-hxkx35f3c3]{white-space:pre-wrap;font-size:.85rem;line-height:1.65}.assistant-draft details[b-hxkx35f3c3]{padding:12px 0}.assistant-draft summary[b-hxkx35f3c3]{cursor:pointer;font-weight:600;min-height:44px}.assistant-workspace button:focus-visible[b-hxkx35f3c3],.assistant-workspace textarea:focus-visible[b-hxkx35f3c3],.assistant-workspace input:focus-visible[b-hxkx35f3c3]{outline:3px solid var(--tmg-brand);outline-offset:3px}.assistant-workspace button:disabled[b-hxkx35f3c3]{opacity:.55;cursor:not-allowed}@media(max-width:1000px){.assistant-grid[b-hxkx35f3c3]{grid-template-columns:1fr}.assistant-chat[b-hxkx35f3c3]{position:static}.assistant-chat-body[b-hxkx35f3c3]{min-height:300px;max-height:55vh}.assistant-header[b-hxkx35f3c3]{flex-wrap:wrap}.assistant-header>button[b-hxkx35f3c3]{margin-left:76px}.assistant-course-cards[b-hxkx35f3c3]{grid-template-columns:1fr}}@media(max-width:576px){.assistant-header[b-hxkx35f3c3]{gap:12px}.assistant-mark[b-hxkx35f3c3]{width:45px;height:45px;border-radius:14px}.assistant-header>div:nth-child(2)[b-hxkx35f3c3]{flex:1}.assistant-header p[b-hxkx35f3c3]{font-size:.8rem}.assistant-header>button[b-hxkx35f3c3]{margin-left:0;width:100%}.assistant-chat-body[b-hxkx35f3c3]{padding:16px}.assistant-starters[b-hxkx35f3c3]{gap:8px}.assistant-starters button[b-hxkx35f3c3]{padding:13px}.assistant-panel[b-hxkx35f3c3],.assistant-proposal[b-hxkx35f3c3]{padding:18px}.assistant-action-bar[b-hxkx35f3c3]{flex-direction:column;align-items:stretch}.assistant-composer>div[b-hxkx35f3c3]{align-items:flex-end}.assistant-roster-row[b-hxkx35f3c3]{grid-template-columns:24px 1fr}.assistant-roster-row>span:nth-child(3)[b-hxkx35f3c3]{grid-column:2}.assistant-roster-row small[b-hxkx35f3c3]{grid-column:2}.assistant-welcome[b-hxkx35f3c3]{padding:22px 8px}}@media(prefers-reduced-motion:reduce){*[b-hxkx35f3c3]{transition:none!important}}


.assistant-sources a[b-hxkx35f3c3]{color:var(--tmg-brand);text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}.assistant-workspace a:focus-visible[b-hxkx35f3c3]{outline:3px solid var(--tmg-brand);outline-offset:3px}
.assistant-composer button[aria-disabled="true"][b-hxkx35f3c3]{opacity:.55;cursor:not-allowed}
/* /Components/Pages/Billing/BillingSettings.razor.rz.scp.css */
.tmg-billing-settings-shell[b-0m3fire0hy] {
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem 1.5rem 3rem;
}

.tmg-billing-settings-header h1[b-0m3fire0hy] {
    color: var(--tmg-text, #111827);
}

.tmg-billing-empty[b-0m3fire0hy] {
    margin: 2rem auto;
    max-width: 460px;
    text-align: center;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: 12px;
    padding: 2.5rem 2rem;
    box-shadow: 0 1px 3px rgb(15 23 42 / .04), 0 10px 20px rgb(15 23 42 / .05);
}

.tmg-billing-empty-icon[b-0m3fire0hy] {
    font-size: 2.5rem;
    color: var(--tmg-brand, #0F766E);
    display: block;
    margin-bottom: 0.6rem;
}

.tmg-billing-empty-title[b-0m3fire0hy] {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.tmg-billing-empty-sub[b-0m3fire0hy] {
    color: var(--tmg-text-muted, #4B5563);
    margin-bottom: 1.5rem;
}

.tmg-billing-cards[b-0m3fire0hy] {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.tmg-billing-card[b-0m3fire0hy] {
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgb(15 23 42 / .04), 0 6px 16px rgb(15 23 42 / .04);
    overflow: hidden;
}

.tmg-billing-card-head[b-0m3fire0hy] {
    background: var(--tmg-brand, #0F766E);
    color: #fff;
    padding: 0.75rem 1.1rem;
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tmg-billing-card-body[b-0m3fire0hy] {
    padding: 1.1rem 1.1rem 1.25rem;
}

.tmg-billing-plan-row[b-0m3fire0hy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.3rem;
}

.tmg-billing-plan-name[b-0m3fire0hy] {
    font-size: 1.15rem;
    font-weight: 700;
}

.tmg-billing-plan-price[b-0m3fire0hy] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--tmg-brand, #0F766E);
    margin-bottom: 0.7rem;
    font-variant-numeric: tabular-nums;
}

.tmg-billing-renews[b-0m3fire0hy] {
    color: var(--tmg-text-muted, #374151);
    margin-bottom: 0.4rem;
}

.tmg-billing-subid code[b-0m3fire0hy] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.78rem;
}

.tmg-billing-status-badge[b-0m3fire0hy] {
    display: inline-block;
    padding: 0.18rem 0.6rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.tmg-status-active[b-0m3fire0hy] { background: #ECFDF5; color: #047857; border: 1px solid #6EE7B7; }
.tmg-status-pastdue[b-0m3fire0hy] { background: var(--tmg-tint-warn-bg, #FFFBEB); color: var(--tmg-warn-text, #92400E); border: 1px solid #FDE68A; }
.tmg-status-canceled[b-0m3fire0hy] { background: var(--tmg-tint-danger-bg, #FEF2F2); color: var(--tmg-danger-text, #B91C1C); border: 1px solid #FCA5A5; }
.tmg-status-none[b-0m3fire0hy] { background: var(--tmg-surface-3, #F3F4F6); color: var(--tmg-text-muted, #374151); border: 1px solid #E5E7EB; }

/* Dark-mode overrides — the hardcoded light pills clash on the dark card otherwise.
   :global on the html ancestor keeps the scope attribute on the badge element only. */
html[data-tmg-theme="dark"] .tmg-status-active[b-0m3fire0hy] { background: rgba(52, 211, 153, 0.15); color: #6EE7B7; border-color: rgba(110, 231, 183, 0.35); }
html[data-tmg-theme="dark"] .tmg-status-pastdue[b-0m3fire0hy] { background: rgba(251, 191, 36, 0.15); color: #FCD34D; border-color: rgba(252, 211, 77, 0.35); }
html[data-tmg-theme="dark"] .tmg-status-canceled[b-0m3fire0hy] { background: rgba(248, 113, 113, 0.15); color: #FCA5A5; border-color: rgba(252, 165, 165, 0.35); }
html[data-tmg-theme="dark"] .tmg-status-none[b-0m3fire0hy] { background: rgba(139, 148, 158, 0.15); color: #8B949E; border-color: rgba(139, 148, 158, 0.35); }

.tmg-billing-card-pm[b-0m3fire0hy] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.tmg-billing-card-brand[b-0m3fire0hy] {
    font-size: 1.4rem;
    color: var(--tmg-brand, #0F766E);
}

.tmg-billing-card-num[b-0m3fire0hy] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    font-size: 0.98rem;
    letter-spacing: 0.06em;
}

/* PAYG balance (exact four-decimal ledger value, matching /settings/account). */
.tmg-billing-balance[b-0m3fire0hy] {
    margin: 0.75rem 0 1rem;
    padding: 0.85rem 1rem;
    border-radius: 10px;
    background: color-mix(in srgb, var(--tmg-brand, #0F766E) 6%, transparent);
    border: 1px solid color-mix(in srgb, var(--tmg-brand, #0F766E) 18%, transparent);
}

.tmg-billing-balance-label[b-0m3fire0hy] {
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tmg-text-muted, #4B5563);
}

.tmg-billing-balance-value[b-0m3fire0hy] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
    color: var(--tmg-text, #111827);
}

.tmg-billing-balance-unit[b-0m3fire0hy] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--tmg-text-muted, #4B5563);
}

.tmg-billing-empty-actions[b-0m3fire0hy] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
}

.tmg-billing-empty-actions .btn[b-0m3fire0hy] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

@media (max-width: 575px) {
    .tmg-billing-settings-shell[b-0m3fire0hy] {
        padding: 1rem 0 2rem;
    }

    .tmg-billing-empty[b-0m3fire0hy] {
        padding: 1.75rem 1.1rem;
    }
}
/* /Components/Pages/Billing/Cancel.razor.rz.scp.css */
.tmg-billing-cancel-shell[b-wzxgn21opj] {
    display: flex;
    justify-content: center;
    padding: 4rem 1rem;
}

.tmg-billing-cancel-card[b-wzxgn21opj] {
    max-width: 480px;
    width: 100%;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: var(--tmg-radius-lg, 12px);
    box-shadow: 0 1px 3px rgb(15 23 42 / .04), 0 14px 30px rgb(15 23 42 / .07);
    padding: 2.5rem 2rem 2rem;
    text-align: center;
}

.tmg-billing-cancel-icon[b-wzxgn21opj] {
    font-size: 3rem;
    color: var(--tmg-brand, #0F766E);
    display: block;
    margin-bottom: 0.75rem;
}

.tmg-billing-cancel-title[b-wzxgn21opj] {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
}

.tmg-billing-cancel-sub[b-wzxgn21opj] {
    color: var(--tmg-text-muted, #4B5563);
    margin-bottom: 1.5rem;
}

.tmg-billing-cancel-actions[b-wzxgn21opj] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}
/* /Components/Pages/Billing/Success.razor.rz.scp.css */
.tmg-billing-success-shell[b-mpz1hfov27] {
    display: flex;
    justify-content: center;
    padding: 3rem 1rem 4rem;
}

.tmg-billing-success-card[b-mpz1hfov27] {
    max-width: 540px;
    width: 100%;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: var(--tmg-radius-lg, 12px);
    box-shadow: 0 1px 3px rgb(15 23 42 / .04), 0 18px 36px rgb(15 23 42 / .08);
    padding: 2.5rem 2rem 2rem;
    text-align: center;
}

.tmg-billing-success-iconwrap[b-mpz1hfov27] {
    display: flex;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.tmg-billing-success-tick[b-mpz1hfov27] {
    width: 84px;
    height: 84px;
}

.tmg-billing-tick-circle[b-mpz1hfov27] {
    stroke: var(--tmg-brand, #0F766E);
    stroke-width: 3;
    stroke-dasharray: 160;
    stroke-dashoffset: 160;
    animation: tmg-tick-circle-b-mpz1hfov27 0.55s ease-out forwards;
}

.tmg-billing-tick-path[b-mpz1hfov27] {
    stroke: var(--tmg-brand, #0F766E);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: tmg-tick-path-b-mpz1hfov27 0.35s 0.45s ease-out forwards;
}

@keyframes tmg-tick-circle-b-mpz1hfov27 {
    to { stroke-dashoffset: 0; }
}

@keyframes tmg-tick-path-b-mpz1hfov27 {
    to { stroke-dashoffset: 0; }
}

.tmg-billing-success-title[b-mpz1hfov27] {
    font-size: 1.6rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
    color: var(--tmg-text, #111827);
}

.tmg-billing-success-sub[b-mpz1hfov27] {
    color: var(--tmg-text-muted, #4B5563);
    margin-bottom: 1.5rem;
}

.tmg-billing-summary[b-mpz1hfov27] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: 10px;
    overflow: hidden;
    margin: 0 0 1.25rem;
    text-align: left;
}

.tmg-billing-summary > div[b-mpz1hfov27] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--tmg-border, #E5E7EB);
    background: var(--tmg-surface-2, #F9FAFB);
}

.tmg-billing-summary > div:last-child[b-mpz1hfov27] { border-bottom: none; }

.tmg-billing-summary dt[b-mpz1hfov27] {
    font-weight: 600;
    color: var(--tmg-text-muted, #374151);
    margin: 0;
}

.tmg-billing-summary dd[b-mpz1hfov27] {
    margin: 0;
    color: var(--tmg-text, #111827);
    font-variant-numeric: tabular-nums;
}

.tmg-billing-subid code[b-mpz1hfov27] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
}

.tmg-billing-success-actions[b-mpz1hfov27] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}
/* /Components/Pages/Billing/TopUp.razor.rz.scp.css */
.tmg-topup-wrap[b-zs5wlu17sq] {
    display: flex;
    justify-content: center;
    padding: 2rem 1rem;
}

.tmg-topup-card[b-zs5wlu17sq] {
    width: 100%;
    max-width: 720px;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #e3e9e7);
    border-radius: 18px;
    padding: 2.25rem 2.5rem;
    box-shadow: 0 10px 40px rgba(13, 60, 48, 0.08);
}

.tmg-topup-head h1[b-zs5wlu17sq] {
    font-size: 1.7rem;
    margin-bottom: 0.35rem;
}

.tmg-topup-sub[b-zs5wlu17sq] {
    color: var(--tmg-text-muted, #5b6b66);
    margin-bottom: 1.5rem;
}

.tmg-topup-balance[b-zs5wlu17sq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    background: color-mix(in srgb, var(--tmg-brand, #0d8a6a) 6%, transparent);
    border: 1px solid color-mix(in srgb, var(--tmg-brand, #0d8a6a) 18%, transparent);
    margin-bottom: 1.5rem;
}

.tmg-topup-balance-label[b-zs5wlu17sq] {
    font-size: 0.78rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--tmg-text-muted, #5b6b66);
}

.tmg-topup-balance-value[b-zs5wlu17sq] {
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.1;
}

.tmg-topup-balance-low[b-zs5wlu17sq] {
    color: #c2362b;
}

.tmg-topup-rate[b-zs5wlu17sq] {
    font-size: 0.9rem;
    color: var(--tmg-text-muted, #5b6b66);
}

.tmg-topup-presets[b-zs5wlu17sq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.5rem;
    align-items: stretch;
    /* element is a <fieldset> for a11y grouping — strip its default chrome so the grid
       layout is unaffected. */
    border: 0;
    padding: 0;
    margin-inline: 0;
    min-inline-size: 0;
}

.tmg-topup-preset[b-zs5wlu17sq] {
    border: 1.5px solid var(--tmg-border, #e3e9e7);
    border-radius: 12px;
    background: var(--tmg-surface, #fff);
    padding: 0.9rem 0.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.tmg-topup-preset:hover[b-zs5wlu17sq] {
    border-color: color-mix(in srgb, var(--tmg-brand, #0d8a6a) 50%, transparent);
    transform: translateY(-1px);
}

.tmg-topup-preset.selected[b-zs5wlu17sq] {
    border-color: var(--tmg-brand, #0d8a6a);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--tmg-brand, #0d8a6a) 18%, transparent);
}

.tmg-topup-preset-amount[b-zs5wlu17sq] {
    font-size: 1.25rem;
    font-weight: 700;
}

.tmg-topup-preset-tag[b-zs5wlu17sq] {
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--tmg-brand, #0d8a6a);
}

.tmg-topup-preset-mins[b-zs5wlu17sq] {
    font-size: 0.74rem;
    color: var(--tmg-text-muted, #5b6b66);
}

.tmg-topup-custom[b-zs5wlu17sq] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.tmg-topup-actions[b-zs5wlu17sq] {
    margin-bottom: 1.25rem;
}

.tmg-topup-go[b-zs5wlu17sq] {
    width: 100%;
}

.tmg-topup-trust[b-zs5wlu17sq] {
    margin-top: 0.6rem;
    font-size: 0.82rem;
    color: var(--tmg-text-muted, #5b6b66);
    text-align: center;
}

.tmg-topup-footer[b-zs5wlu17sq] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    font-size: 0.85rem;
}

@media (max-width: 576px) {
    .tmg-topup-card[b-zs5wlu17sq] {
        padding: 1.5rem 1.25rem;
    }
}

/* One helper line directly under the amount chooser. */
.tmg-topup-help[b-zs5wlu17sq] {
    margin: -0.75rem 0 1.5rem;
    line-height: 1.45;
}
/* /Components/Pages/Billing/Unavailable.razor.rz.scp.css */
.tmg-billing-cancel-shell[b-t5k4n3ynkj] {
    display: flex;
    justify-content: center;
    padding: 4rem 1rem;
}

.tmg-billing-cancel-card[b-t5k4n3ynkj] {
    max-width: 540px;
    width: 100%;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: var(--tmg-radius-lg, 12px);
    box-shadow: 0 1px 3px rgb(15 23 42 / .04), 0 14px 30px rgb(15 23 42 / .07);
    padding: 2.5rem 2rem 2rem;
    text-align: center;
}

.tmg-billing-cancel-icon[b-t5k4n3ynkj] {
    font-size: 3rem;
    display: block;
    margin-bottom: 0.75rem;
}

.tmg-billing-cancel-title[b-t5k4n3ynkj] {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 0.4rem;
}

.tmg-billing-cancel-sub[b-t5k4n3ynkj] {
    color: var(--tmg-text-muted, #4B5563);
    margin-bottom: 1.5rem;
}

.tmg-billing-cancel-sub code[b-t5k4n3ynkj] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85rem;
}

.tmg-billing-cancel-actions[b-t5k4n3ynkj] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}
/* /Components/Pages/CallAnalysis.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Calls/Detail.razor.rz.scp.css */
/* Call detail — Wave 7C polish. */

/* Header */
[b-1cfsgy96pk] .page-header h1 {
    margin-bottom: 4px;
}

[b-1cfsgy96pk] .page-header-subtitle code {
    font-size: 13px;
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 2px 8px;
    border-radius: 4px;
    color: var(--tmg-text);
}

/* Metric tiles row at top. */
[b-1cfsgy96pk] .tmg-metric {
    padding: 14px 16px;
    border-radius: var(--tmg-radius);
}

[b-1cfsgy96pk] .tmg-metric-label {
    font-size: 10px;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--tmg-text-muted);
    text-transform: uppercase;
}

[b-1cfsgy96pk] .tmg-metric-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--tmg-text);
    font-variant-numeric: tabular-nums;
    margin-top: 2px;
}

/* Section headings */
[b-1cfsgy96pk] section h2.h5 {
    color: var(--tmg-text);
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 0.75rem;
    letter-spacing: -0.005em;
}

/* Recording: subtle bg + spacing. */
[b-1cfsgy96pk] audio {
    width: 100%;
    max-width: 560px;
    margin-top: 2px;
}

/* Transcript bubbles: tighten width, sharper timestamps. */
[b-1cfsgy96pk] .tmg-transcript {
    gap: 10px;
    padding: 4px 0;
}

[b-1cfsgy96pk] .tmg-bubble {
    max-width: 68%;
    padding: 10px 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    font-size: 14px;
    line-height: 1.5;
}

[b-1cfsgy96pk] .tmg-bubble-agent {
    background: var(--tmg-surface-3, #F3F4F6);
    color: var(--tmg-text);
}

[b-1cfsgy96pk] .tmg-bubble-user {
    background: var(--tmg-brand);
    color: #fff;
}

[b-1cfsgy96pk] .tmg-bubble-speaker {
    font-size: 10px;
    letter-spacing: 0.06em;
    margin-bottom: 4px;
    opacity: 0.85;
}

/* Notes section helper text — readable, not over-muted. */
[b-1cfsgy96pk] section p.text-muted.small {
    color: var(--tmg-text-muted);
    font-size: 12px;
    line-height: 1.55;
    margin-bottom: 0.75rem;
}

[b-1cfsgy96pk] section p.text-muted.small code {
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 11.5px;
}

[b-1cfsgy96pk] textarea.form-control {
    border-color: var(--tmg-border);
    font-size: 14px;
    line-height: 1.55;
    transition: border-color .12s, box-shadow .12s;
}

[b-1cfsgy96pk] textarea.form-control:focus {
    border-color: var(--tmg-brand);
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}

/* Notes action row: link buttons left, Save right (already in markup). */
[b-1cfsgy96pk] .btn-link.btn-sm {
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    color: var(--tmg-brand);
}

[b-1cfsgy96pk] .btn-link.btn-sm:hover {
    text-decoration: underline;
    color: var(--tmg-brand-hover);
}

[b-1cfsgy96pk] .btn-link.btn-sm.text-muted {
    color: var(--tmg-text-muted) !important;
}

/* Save button: clear primary even at small size. */
[b-1cfsgy96pk] .btn-primary.btn-sm {
    background: var(--tmg-brand);
    border-color: var(--tmg-brand);
    color: #fff;
    font-weight: 600;
    padding: 6px 18px;
}

[b-1cfsgy96pk] .btn-primary.btn-sm:disabled {
    background: var(--tmg-brand);
    border-color: var(--tmg-brand);
    opacity: .45;
}

[b-1cfsgy96pk] .btn-primary.btn-sm:not(:disabled):hover {
    background: var(--tmg-brand-hover);
    border-color: var(--tmg-brand-hover);
}

/* Analysis section: card-like for separation from notes. */
[b-1cfsgy96pk] section.analysis-section {
    padding-top: 1rem;
    border-top: 1px solid var(--tmg-border);
}

[b-1cfsgy96pk] section.analysis-section table.table-sm code {
    background: var(--tmg-surface-3, #F3F4F6);
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 12.5px;
}

[b-1cfsgy96pk] section.analysis-section table.table-sm thead th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
}

/* Toast feedback under notes — softer. */
[b-1cfsgy96pk] .alert.py-2.small {
    font-size: 12.5px;
    padding: 8px 12px;
    border-radius: var(--tmg-radius);
}
/* /Components/Pages/Campaigns/Contacts/ImportSheet.razor.rz.scp.css */
/* Import from Google Sheet — Wave 7C polish. */

[b-dhowwlsdwg] .form-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--tmg-text);
    margin-bottom: 6px;
}

[b-dhowwlsdwg] select.form-select {
    max-width: 560px;
    border-color: var(--tmg-border);
    height: 40px;
    background-color: var(--tmg-surface, #FFFFFF);
    transition: border-color .12s, box-shadow .12s;
}

[b-dhowwlsdwg] select.form-select:focus {
    border-color: var(--tmg-brand);
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}

/* Preview button — primary feel even when outline-secondary. */
[b-dhowwlsdwg] .btn-outline-secondary {
    font-weight: 500;
    padding: 6px 16px;
}

[b-dhowwlsdwg] .btn-outline-secondary:not(:disabled):hover {
    background: var(--tmg-brand);
    color: #fff;
    border-color: var(--tmg-brand);
}

/* Preview table compactness. */
[b-dhowwlsdwg] table.table-sm thead th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
}

[b-dhowwlsdwg] table.table-sm tbody tr.table-danger {
    background: var(--tmg-tint-danger-bg, #FEF2F2);
}

[b-dhowwlsdwg] .alert {
    padding: 10px 14px;
    border-radius: var(--tmg-radius);
}

[b-dhowwlsdwg] .alert.alert-warning {
    background: var(--tmg-tint-warn-bg, #FFFBEB);
    border-color: var(--tmg-tint-warn-border, #FDE68A);
    border-left: 3px solid var(--tmg-warning);
    color: var(--tmg-warn-text, #78350F);
}
/* /Components/Pages/Campaigns/Contacts/Upload.razor.rz.scp.css */
/* Upload contacts — Wave 7C/8 polish. */

.tmg-upload-card[b-exfr8rpkkf] {
    background: var(--tmg-surface);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius-lg);
    padding: 20px 24px;
    max-width: 720px;
    margin-bottom: 1.5rem;
}

.tmg-upload-card h2.h6[b-exfr8rpkkf] {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tmg-text-muted);
    margin-bottom: 0;
    font-weight: 600;
}

/* The proper drop-zone: centred icon + prompt, with the native file input
   styled so the entire zone reads as a single affordance. */
.tmg-dropzone[b-exfr8rpkkf] {
    position: relative;
    border: 2px dashed var(--tmg-border);
    border-radius: var(--tmg-radius-lg);
    background: var(--tmg-surface-2, #FAFBFC);
    padding: 28px 20px 22px;
    text-align: center;
    transition: border-color .15s, background-color .15s;
}

.tmg-dropzone:hover[b-exfr8rpkkf] {
    border-color: var(--tmg-brand);
    background: rgba(15, 118, 110, 0.04);
}

.tmg-dropzone-icon[b-exfr8rpkkf] {
    display: block;
    font-size: 28px;
    color: var(--tmg-text-muted);
    margin-bottom: 8px;
    line-height: 1;
}

.tmg-dropzone-prompt[b-exfr8rpkkf] {
    font-size: 14px;
    font-weight: 500;
    color: var(--tmg-text);
    margin-bottom: 10px;
}

/* Style the inline file input + checkbox as a small import card. */
[b-exfr8rpkkf] .form-check {
    padding: 8px 12px;
    background: var(--tmg-surface-2, #F9FAFB);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

[b-exfr8rpkkf] .form-check .form-check-input {
    margin-top: 0;
    margin-left: 0;
    accent-color: var(--tmg-brand);
}

[b-exfr8rpkkf] .form-check .form-check-label {
    font-size: 14px;
    color: var(--tmg-text);
}

/* Make the InputFile blend into the dropzone wrapper. */
[b-exfr8rpkkf] .tmg-dropzone input[type="file"] {
    display: inline-block;
    width: auto;
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    background: var(--tmg-surface, #fff);
    padding: 4px 8px;
    color: var(--tmg-text);
    font-size: 13px;
    cursor: pointer;
}

/* Preview-time file input (after a successful selection rerender) keeps
   the old standalone affordance shape. */
[b-exfr8rpkkf] input[type="file"]:not(.tmg-dropzone input[type="file"]) {
    display: block;
    padding: 12px;
    width: 100%;
    max-width: 560px;
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    background: var(--tmg-surface-2, #FAFBFC);
    color: var(--tmg-text);
    font-size: 13px;
    cursor: pointer;
}

[b-exfr8rpkkf] input[type="file"]::file-selector-button {
    border: 1px solid var(--tmg-border);
    background: var(--tmg-surface, #FFFFFF);
    padding: 6px 14px;
    border-radius: var(--tmg-radius);
    margin-right: 12px;
    font-weight: 500;
    color: var(--tmg-text);
    cursor: pointer;
    transition: background-color .12s, border-color .12s;
}

[b-exfr8rpkkf] input[type="file"]::file-selector-button:hover {
    background: rgba(15, 118, 110, 0.06);
    border-color: var(--tmg-brand);
    color: var(--tmg-brand);
}

[b-exfr8rpkkf] .form-text {
    font-size: 12px;
    color: var(--tmg-text-muted);
    margin-top: 6px;
}

/* Preview table: tighter rows + zebra. */
[b-exfr8rpkkf] table.table-sm thead th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
    border-bottom: 2px solid var(--tmg-border);
}

[b-exfr8rpkkf] table.table-sm tbody tr.table-danger {
    background: var(--tmg-tint-danger-bg, #FEF2F2);
}

[b-exfr8rpkkf] table.table-sm code {
    font-size: 12px;
}

/* Confirm-import button spacing. */
[b-exfr8rpkkf] .btn-primary {
    margin-left: 8px;
}
/* /Components/Pages/Campaigns/Detail.razor.rz.scp.css */
/* Campaign Detail — Wave 7C polish.
   Restyle only — do not change DOM/structure (manual-mode flow is load-bearing). */

/* ---------- Header ---------- */
[b-yukges59ir] .page-header h1 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-yukges59ir] .page-header h1 .badge {
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 999px;
    vertical-align: middle;
}

/* Brand-aligned mode chip (replaces Bootstrap default bg-info text-dark brick). */
[b-yukges59ir] .page-header h1 .badge.tmg-mode-chip {
    background: rgba(15, 118, 110, 0.10);
    color: var(--tmg-brand);
    border: 1px solid rgba(15, 118, 110, 0.25);
    letter-spacing: 0.02em;
}

[b-yukges59ir] .page-header-actions .btn {
    font-weight: 500;
}

/* ---------- Tab strip ---------- */
[b-yukges59ir] .nav-tabs {
    border-bottom: 1px solid var(--tmg-border);
    gap: 4px;
}

[b-yukges59ir] .nav-tabs .nav-link {
    color: var(--tmg-text-muted);
    border: none;
    border-bottom: 2px solid transparent;
    padding: 10px 16px;
    font-weight: 500;
    font-size: 14px;
    border-radius: 0;
    background: transparent;
    transition: color .12s, border-color .12s, background-color .12s;
}

[b-yukges59ir] .nav-tabs .nav-link:hover {
    color: var(--tmg-text);
    background: rgba(15, 118, 110, 0.04);
    border-bottom-color: var(--tmg-border);
}

[b-yukges59ir] .nav-tabs .nav-link.active {
    color: var(--tmg-brand);
    border-bottom: 2px solid var(--tmg-brand);
    background: transparent;
    font-weight: 600;
}

/* ---------- Overview: budget alert — slimmer ---------- */
[b-yukges59ir] .alert.alert-info,
[b-yukges59ir] .alert.alert-warning,
[b-yukges59ir] .alert.alert-danger {
    padding: 10px 14px;
    font-size: 14px;
    border-radius: var(--tmg-radius);
    margin-bottom: 1rem;
}

[b-yukges59ir] .alert.alert-info {
    background: var(--tmg-tint-info-bg, #ECFEFF);
    border-color: #A5F3FC;
    color: var(--tmg-info-text, #0E7490);
    border-left: 3px solid #06B6D4;
}

[b-yukges59ir] .alert.alert-warning {
    background: var(--tmg-tint-warn-bg, #FFFBEB);
    border-color: var(--tmg-tint-warn-border, #FDE68A);
    color: var(--tmg-warn-text, #78350F);
    border-left: 3px solid var(--tmg-warning);
}

[b-yukges59ir] .alert.alert-danger {
    border-left: 3px solid var(--tmg-danger);
}

/* ---------- Counters row — denser cards, numeric value emphasis ---------- */
[b-yukges59ir] .tmg-metric {
    padding: 14px 16px;
    border-radius: var(--tmg-radius);
}

[b-yukges59ir] .tmg-metric-label {
    font-size: 10px;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--tmg-text-muted);
    text-transform: uppercase;
}

[b-yukges59ir] .tmg-metric-value {
    font-size: 22px;
    font-weight: 700;
    color: var(--tmg-text);
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    margin-top: 2px;
}

/* Secondary action group on Overview: visually grouped. */
[b-yukges59ir] .mb-3.d-flex.flex-wrap.gap-2 {
    padding: 10px 12px;
    background: var(--tmg-surface-2, #F9FAFB);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    margin-top: 0.25rem;
}

[b-yukges59ir] .mb-3.d-flex.flex-wrap.gap-2 .btn {
    font-weight: 500;
}

/* Definition list (Agent / From number / Dial window ...) */
[b-yukges59ir] dl.row {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--tmg-border);
}

[b-yukges59ir] dl.row dt {
    color: var(--tmg-text-muted);
    font-weight: 500;
    font-size: 13px;
    padding-top: 4px;
    padding-bottom: 4px;
}

[b-yukges59ir] dl.row dd {
    color: var(--tmg-text);
    font-size: 14px;
    padding-top: 4px;
    padding-bottom: 4px;
}

[b-yukges59ir] dl.row dd code {
    font-size: 13px;
    background: transparent;
    padding: 0;
    color: var(--tmg-text-muted);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

/* Tighten the dl: the keys ("Agent", "From number"...) are short; using
   col-sm-3 leaves a huge gap. Override to give keys 160px max. */
[b-yukges59ir] dl.row > dt.col-sm-3 {
    flex: 0 0 160px;
    max-width: 160px;
}

[b-yukges59ir] dl.row > dd.col-sm-9 {
    flex: 0 0 calc(100% - 160px);
    max-width: calc(100% - 160px);
}

/* ---------- Contacts tab ---------- */
[b-yukges59ir] table.tmg-table th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
    white-space: nowrap;
}

[b-yukges59ir] table.tmg-table td {
    vertical-align: middle;
    padding-top: 12px;
    padding-bottom: 12px;
}

[b-yukges59ir] table.tmg-table tbody tr:hover {
    background: rgba(15, 118, 110, 0.03);
}

[b-yukges59ir] table.tmg-table td code {
    font-size: 13px;
    color: var(--tmg-text-muted);
    background: transparent;
    padding: 0;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

/* Right-most action column: fixed-width slots so single "Call" lines up
   with the "Call · Skip" pairs underneath. */
[b-yukges59ir] table.tmg-table tbody td:last-child .btn-group {
    min-width: 132px;
    justify-content: flex-end;
    display: inline-flex;
}

[b-yukges59ir] table.tmg-table tbody td:last-child .btn-group .btn {
    min-width: 64px;
}

/* Notes column muted preview */
[b-yukges59ir] table.tmg-table td small.text-muted.fst-italic {
    opacity: .6;
    font-size: 12px;
}

/* Right-most action button group: snug, right-aligned. */
[b-yukges59ir] table.tmg-table tbody td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-yukges59ir] .btn-group-sm .btn {
    margin-left: 2px;
}

[b-yukges59ir] .btn-group-sm .btn i.bi {
    font-size: 12px;
}

/* Batch research toolbar above contacts. */
[b-yukges59ir] .d-flex.align-items-center.gap-2.mb-2.flex-wrap {
    padding: 10px 12px;
    background: var(--tmg-surface-2, #F9FAFB);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    margin-bottom: 0.75rem !important;
}

/* In-flight active-call banner: more presence. */
[b-yukges59ir] .alert.alert-info strong {
    color: inherit;
}

/* ---------- Calls tab ---------- */
[b-yukges59ir] table.tmg-table.table-hover tbody td {
    padding-top: 10px;
    padding-bottom: 10px;
}

[b-yukges59ir] .tmg-row-clickable {
    cursor: pointer;
}

[b-yukges59ir] .tmg-row-clickable:hover {
    background: rgba(15, 118, 110, 0.05) !important;
}

/* Avatar column: tighter, centred. */
[b-yukges59ir] .tmg-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--tmg-brand);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
}

/* Right-align numeric duration/cost columns on the Calls table. */
[b-yukges59ir] table.tmg-table.table-hover tbody td:nth-child(5),
[b-yukges59ir] table.tmg-table.table-hover tbody td:nth-child(6),
[b-yukges59ir] table.tmg-table.table-hover thead th:nth-child(5),
[b-yukges59ir] table.tmg-table.table-hover thead th:nth-child(6) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ---------- Settings tab ---------- */
[b-yukges59ir] .h5 {
    color: var(--tmg-text);
    font-size: 15px;
    font-weight: 600;
    margin-top: 1.5rem;
}

[b-yukges59ir] label.form-check {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    cursor: pointer;
    font-size: 14px;
}

[b-yukges59ir] label.form-check input[type="checkbox"] {
    accent-color: var(--tmg-brand);
    margin-right: 0;
}

/* ---------- Objection handling tab ---------- */
[b-yukges59ir] .tmg-objection-card {
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    background: var(--tmg-surface, #fff);
    transition: border-color .12s, box-shadow .12s;
}

[b-yukges59ir] .tmg-objection-card:hover {
    border-color: rgba(15, 118, 110, 0.35);
    box-shadow: 0 1px 3px rgba(15, 118, 110, 0.05);
}

[b-yukges59ir] .tmg-objection-card h3 {
    color: var(--tmg-text);
    font-size: 15px;
}

[b-yukges59ir] .tmg-objection-card .text-body {
    color: var(--tmg-text-muted);
    font-size: 14px;
    line-height: 1.5;
}

[b-yukges59ir] .tmg-objection-card .btn-group .btn {
    padding: 4px 10px;
    line-height: 1.2;
}

[b-yukges59ir] .tmg-objection-card .btn-group .btn i.bi {
    font-size: 14px;
    line-height: 1;
    vertical-align: middle;
}

/* Slightly more breathing room between the body of the card and the action group. */
[b-yukges59ir] .tmg-objection-card .card-body > .d-flex {
    gap: 0.75rem;
}

/* ---------- Pagination nav under tables ---------- */
[b-yukges59ir] nav .btn {
    margin-right: 4px;
}

/* ---------- Modal Research section ---------- */
[b-yukges59ir] .tmg-modal-research .tmg-research-link {
    color: #0d6efd;
    text-decoration: none;
    font-weight: 500;
}

[b-yukges59ir] .tmg-modal-research .tmg-research-link:hover,
[b-yukges59ir] .tmg-modal-research .tmg-research-link:focus {
    text-decoration: underline;
    color: #0a58ca;
}

[b-yukges59ir] .tmg-modal-research .tmg-research-links li {
    line-height: 1.5;
}

[b-yukges59ir] .tmg-modal-research p {
    line-height: 1.45;
    overflow-wrap: anywhere;
}
/* /Components/Pages/Campaigns/Index.razor.rz.scp.css */
/* Campaigns list — Wave 7C polish. Scoped: only affects this page. */

/* Toolbar: give inputs comfortable widths, raise contrast on the search,
   and let the spacer push "+ New campaign" to the trailing edge. */
[b-6ljcebwsax] .tmg-toolbar {
    padding: 14px 16px;
    gap: 10px;
}

[b-6ljcebwsax] .tmg-toolbar input[type="text"] {
    min-width: 240px;
    max-width: 320px;
    height: 36px;
    padding: 0 12px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='7' cy='7' r='5'/><line x1='11' y1='11' x2='14' y2='14'/></svg>");
    background-repeat: no-repeat;
    background-position: 10px center;
    padding-left: 32px;
}

[b-6ljcebwsax] .tmg-toolbar select.form-select {
    min-width: 150px;
    max-width: 180px;
    height: 36px;
}

[b-6ljcebwsax] .tmg-toolbar .btn-primary {
    height: 36px;
    padding: 0 16px;
    font-weight: 600;
    white-space: nowrap;
}

/* Table — column-specific tightening so counter columns don't dominate. */
[b-6ljcebwsax] .tmg-table {
    margin-top: .25rem;
}

[b-6ljcebwsax] .tmg-table thead th {
    font-size: 11px;
    letter-spacing: 0.04em;
    white-space: nowrap;
    color: var(--tmg-text-muted);
}

/* Centre numeric counter columns (Pending..Skipped: 4th–9th columns). */
[b-6ljcebwsax] .tmg-table thead th:nth-child(n+4):nth-child(-n+9),
[b-6ljcebwsax] .tmg-table tbody td:nth-child(n+4):nth-child(-n+9) {
    text-align: center;
    width: 72px;
    font-variant-numeric: tabular-nums;
}

/* Status column (3rd) — keep badge left-aligned but reserve breathing room. */
[b-6ljcebwsax] .tmg-table thead th:nth-child(3),
[b-6ljcebwsax] .tmg-table tbody td:nth-child(3) {
    width: 110px;
}

/* Mode column (2nd) — small, dim, capitalized tag. */
[b-6ljcebwsax] .tmg-table tbody td:nth-child(2) .small {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tmg-text-muted);
}

/* Name column — slightly longer truncation, brand-coloured link weight. */
[b-6ljcebwsax] .tmg-table tbody td:first-child {
    max-width: 320px;
}

[b-6ljcebwsax] .tmg-table tbody td:first-child a.tmg-truncate {
    font-weight: 600;
    color: var(--tmg-text);
    max-width: 300px;
}

[b-6ljcebwsax] .tmg-table tbody td:first-child a.tmg-truncate:hover {
    color: var(--tmg-brand);
}

/* Actions column (last) — right-aligned, snug button group. */
[b-6ljcebwsax] .tmg-table thead th:last-child,
[b-6ljcebwsax] .tmg-table tbody td:last-child {
    text-align: right;
    white-space: nowrap;
    width: 140px;
}

[b-6ljcebwsax] .tmg-table tbody td:last-child .btn {
    margin-left: 4px;
    min-width: 64px;
    font-weight: 500;
}

/* Row hover — make rows feel clickable. */
[b-6ljcebwsax] .tmg-table tbody tr:hover {
    background: rgba(15, 118, 110, 0.03);
}

/* Zero counter cells fade out so non-zero values pop. */
[b-6ljcebwsax] .tmg-table tbody td.tmg-zero {
    color: #CBD2DA;
}

/* Pagination footer — proper card-floor styling, not naked flex. */
.pagination-footer[b-6ljcebwsax] {
    margin-top: 1rem;
    padding: 10px 14px;
    border-top: 1px solid var(--tmg-border);
    background: var(--tmg-surface-2, #FAFBFC);
    border-bottom-left-radius: var(--tmg-radius);
    border-bottom-right-radius: var(--tmg-radius);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/* /Components/Pages/Campaigns/New.razor.rz.scp.css */
/* New campaign form — Wave 7C polish. */

[b-ikgivra5sr] .tmg-form .form-label.fw-bold {
    color: var(--tmg-text);
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px;
}

[b-ikgivra5sr] .tmg-form .form-text {
    font-size: 12px;
    color: var(--tmg-text-muted);
    margin-top: 6px;
    line-height: 1.5;
}

/* Mode radios: turn into segmented pills. */
[b-ikgivra5sr] .tmg-form input[type="radio"] {
    accent-color: var(--tmg-brand);
    margin-right: 6px;
}

[b-ikgivra5sr] .tmg-form label.me-3,
[b-ikgivra5sr] .tmg-form label.me-3 + label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid var(--tmg-border);
    border-radius: 999px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color .12s, border-color .12s;
}

[b-ikgivra5sr] .tmg-form label.me-3:hover,
[b-ikgivra5sr] .tmg-form label.me-3 + label:hover {
    background: rgba(15, 118, 110, 0.04);
    border-color: var(--tmg-brand);
}

[b-ikgivra5sr] .tmg-form .form-control,
[b-ikgivra5sr] .tmg-form .form-select {
    border-color: var(--tmg-border);
    transition: border-color .12s, box-shadow .12s;
}

[b-ikgivra5sr] .tmg-form .form-control:focus,
[b-ikgivra5sr] .tmg-form .form-select:focus {
    border-color: var(--tmg-brand);
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12);
}

/* Spacing rhythm between field groups. */
[b-ikgivra5sr] .tmg-form .mb-3 {
    margin-bottom: 1.25rem !important;
}

/* Recording-warning alert: warmer + tighter. */
[b-ikgivra5sr] .tmg-form .alert-warning {
    border-left: 3px solid var(--tmg-warning);
    background: var(--tmg-tint-warn-bg, #FFFBEB);
    border-color: var(--tmg-tint-warn-border, #FDE68A);
    color: var(--tmg-warn-text, #78350F);
    font-size: 13px;
    line-height: 1.5;
}
/* /Components/Pages/Compliance.razor.rz.scp.css */
/* Compliance — long-form public page. Style sister to About; tighter copy density
   because this is a reference doc, not a marketing pitch. */

[b-3j2a7bh5hh] .tmg-compliance-page-header {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

/* Hero ───────────────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-hero {
    text-align: center;
    padding: 3.5rem 1rem 2rem;
    max-width: 760px;
    margin: 0 auto;
}

[b-3j2a7bh5hh] .tmg-compliance-hero-icon {
    font-size: 2.5rem;
    color: var(--tmg-brand, #0F766E);
    margin-bottom: 0.85rem;
    display: inline-block;
}

[b-3j2a7bh5hh] .tmg-compliance-hero-title {
    font-size: clamp(1.85rem, 2.4vw + 1rem, 2.5rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
    font-weight: 700;
    color: var(--tmg-text, #111827);
    margin: 0 0 1rem;
}

[b-3j2a7bh5hh] .tmg-compliance-hero-tagline {
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--tmg-text-muted, #4B5563);
    margin: 0 auto;
    max-width: 600px;
}

/* Top alert ─────────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-alert {
    max-width: 920px;
    margin: 1.5rem auto 0;
    padding: 0 1rem;
}

[b-3j2a7bh5hh] .tmg-compliance-alert-inner {
    background: #FEF3C7;
    border: 1px solid #F59E0B;
    border-left: 4px solid #B45309;
    border-radius: var(--tmg-radius-lg, 12px);
    padding: 1.25rem 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

[b-3j2a7bh5hh] .tmg-compliance-alert-icon {
    color: var(--tmg-warn-strong, #B45309);
    font-size: 1.5rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

[b-3j2a7bh5hh] .tmg-compliance-alert-title {
    font-weight: 600;
    color: var(--tmg-warn-text, #78350F);
    margin-bottom: 0.35rem;
}

[b-3j2a7bh5hh] .tmg-compliance-alert-body {
    color: var(--tmg-warn-text, #78350F);
    line-height: 1.55;
    margin: 0;
    font-size: 0.95rem;
}

/* Sections ──────────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-section {
    max-width: 1180px;
    margin: 4rem auto 0;
    padding: 0 1rem;
}

[b-3j2a7bh5hh] .tmg-compliance-section-title {
    font-size: clamp(1.4rem, 1.4vw + 0.8rem, 1.75rem);
    line-height: 1.2;
    letter-spacing: -0.015em;
    font-weight: 700;
    color: var(--tmg-text, #111827);
    margin: 0 0 1rem;
}

[b-3j2a7bh5hh] .tmg-compliance-section p {
    color: var(--tmg-text-muted, #4B5563);
    line-height: 1.6;
    max-width: 70ch;
}

[b-3j2a7bh5hh] .tmg-compliance-regulated {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 0.4rem 1.5rem;
    max-width: 920px;
}

[b-3j2a7bh5hh] .tmg-compliance-regulated li {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.4rem 0;
    color: var(--tmg-text, #111827);
    line-height: 1.5;
    font-size: 0.95rem;
}

[b-3j2a7bh5hh] .tmg-bullet-icon {
    color: var(--tmg-brand, #0F766E);
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 0.2rem;
}

/* Regime cards ──────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-regimes {
    margin-top: 1.5rem;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-card {
    width: 100%;
    background: var(--tmg-surface, #fff);
    border: 1px solid rgb(15 118 110 / .08);
    border-radius: var(--tmg-radius-lg, 14px);
    padding: 1.5rem 1.25rem 1.25rem;
    box-shadow: var(--tmg-shadow-card, 0 1px 3px rgb(15 23 42 / .04), 0 10px 25px rgb(15 23 42 / .05));
    display: flex;
    flex-direction: column;
    transition: transform .18s ease, box-shadow .18s ease;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--tmg-shadow-lift, 0 12px 32px -8px rgb(15 118 110 / .18), 0 4px 12px -4px rgb(15 23 42 / .10));
}

[b-3j2a7bh5hh] .tmg-compliance-regime-flag {
    font-size: 1.85rem;
    line-height: 1;
    margin-bottom: 0.65rem;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--tmg-text, #111827);
    margin: 0 0 0.65rem;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-bullets {
    list-style: none;
    padding: 0;
    margin: 0 0 0.85rem;
    flex-grow: 1;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-bullets li {
    color: var(--tmg-text-muted, #4B5563);
    font-size: 0.88rem;
    line-height: 1.5;
    padding: 0.25rem 0;
    border-bottom: 1px solid var(--tmg-border-soft, #F3F4F6);
}

[b-3j2a7bh5hh] .tmg-compliance-regime-bullets li:last-child {
    border-bottom: none;
}

[b-3j2a7bh5hh] .tmg-compliance-regime-fine {
    font-size: 0.78rem;
    color: var(--tmg-warn-strong, #B45309);
    background: #FEF3C7;
    border-radius: 6px;
    padding: 0.4rem 0.65rem;
    line-height: 1.35;
    font-weight: 500;
    margin-top: auto;
}

/* Tool cards ────────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-tools {
    margin-top: 1.5rem;
}

[b-3j2a7bh5hh] .tmg-compliance-tool-card {
    width: 100%;
    background: var(--tmg-surface, #fff);
    border: 1px solid rgb(15 118 110 / .08);
    border-radius: var(--tmg-radius-lg, 14px);
    padding: 1.35rem 1.25rem;
    box-shadow: 0 1px 2px rgb(15 23 42 / .03);
    transition: transform .18s ease, box-shadow .18s ease;
}

[b-3j2a7bh5hh] .tmg-compliance-tool-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--tmg-shadow-lift, 0 12px 32px -8px rgb(15 118 110 / .18), 0 4px 12px -4px rgb(15 23 42 / .10));
}

[b-3j2a7bh5hh] .tmg-compliance-tool-icon {
    font-size: 1.4rem;
    color: var(--tmg-brand, #0F766E);
    margin-bottom: 0.65rem;
    display: block;
}

[b-3j2a7bh5hh] .tmg-compliance-tool-card h3 {
    font-weight: 600;
    color: var(--tmg-text, #111827);
    margin: 0 0 0.4rem;
}

[b-3j2a7bh5hh] .tmg-compliance-tool-card p {
    color: var(--tmg-text-muted, #4B5563);
    line-height: 1.5;
    font-size: 0.9rem;
    margin: 0;
}

/* Final checklist ───────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-final {
    margin-top: 5rem;
}

[b-3j2a7bh5hh] .tmg-compliance-final-inner {
    max-width: 820px;
    background: linear-gradient(135deg, #F0FDFA 0%, #ECFEFF 100%);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: var(--tmg-radius-lg, 12px);
    padding: 2.5rem 2rem;
    margin: 0 auto;
}

[b-3j2a7bh5hh] .tmg-compliance-final-inner .tmg-compliance-section-title {
    margin-bottom: 1.25rem;
}

[b-3j2a7bh5hh] .tmg-compliance-checklist {
    counter-reset: complchk;
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem;
}

[b-3j2a7bh5hh] .tmg-compliance-checklist li {
    position: relative;
    padding: 0.65rem 0 0.65rem 2.5rem;
    color: var(--tmg-text, #111827);
    line-height: 1.55;
    border-bottom: 1px solid rgba(15, 118, 110, 0.12);
    counter-increment: complchk;
}

[b-3j2a7bh5hh] .tmg-compliance-checklist li:last-child {
    border-bottom: none;
}

[b-3j2a7bh5hh] .tmg-compliance-checklist li::before {
    content: counter(complchk);
    position: absolute;
    left: 0;
    top: 0.65rem;
    width: 1.75rem;
    height: 1.75rem;
    background: var(--tmg-brand, #0F766E);
    color: #fff;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

[b-3j2a7bh5hh] .tmg-compliance-final-note {
    color: var(--tmg-text-muted, #4B5563);
    font-size: 0.92rem;
    line-height: 1.6;
    margin: 0;
    padding-top: 1rem;
    border-top: 1px solid rgba(15, 118, 110, 0.18);
    font-style: italic;
}

/* Back link ─────────────────────────────────────────────────────────────────── */

[b-3j2a7bh5hh] .tmg-compliance-back {
    max-width: 1180px;
    margin: 2rem auto 4rem;
    padding: 0 1rem;
    text-align: center;
}

[b-3j2a7bh5hh] .tmg-compliance-back-link {
    color: var(--tmg-brand, #0F766E);
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: background 120ms ease;
}

[b-3j2a7bh5hh] .tmg-compliance-back-link:hover {
    background: rgba(15, 118, 110, 0.08);
    text-decoration: none;
}

/* Responsive ─────────────────────────────────────────────────────────────────── */

@media (max-width: 767.98px) {
    [b-3j2a7bh5hh] .tmg-compliance-hero {
        padding-top: 2.5rem;
    }
    [b-3j2a7bh5hh] .tmg-compliance-section {
        margin-top: 3rem;
    }
    [b-3j2a7bh5hh] .tmg-compliance-final {
        margin-top: 3.5rem;
    }
    [b-3j2a7bh5hh] .tmg-compliance-final-inner {
        padding: 1.75rem 1.25rem;
    }
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
/* Wave 7B: Dashboard scoped polish.
   Targets, in order of priority:
   1. "Now strip" 4-tile row: stronger label/value hierarchy + accent edge.
   2. Active campaigns table: bolder headers, hover row, aligned status pill,
      progress bar contrast.
   3. Outcomes funnel: dim zero values, decreasing tile size hint.
   4. Calls-per-day chart: visible baseline, wider empty-day bars.
   5. Recent calls list: tighter two-line meta, time chip on trailing.
   6. Empty states: more generous padding + softer icon. */

/* ---------- Now strip ---------- */
section.row .tmg-metric[b-iirw87z6ch] {
    position: relative;
    padding: 14px 16px 16px;
    overflow: hidden;
}

section.row .tmg-metric[b-iirw87z6ch]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--tmg-brand);
    opacity: 0.55;
}

section.row .tmg-metric-label[b-iirw87z6ch] {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    margin-bottom: 2px;
}

section.row .tmg-metric-value[b-iirw87z6ch] {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

section.row .tmg-metric-detail[b-iirw87z6ch] {
    font-size: 0.78rem;
    margin-top: 6px;
}

section.row .progress[b-iirw87z6ch] {
    background: rgba(15, 118, 110, 0.10);
}

section.row .progress-bar[b-iirw87z6ch] {
    background: var(--tmg-brand);
}

/* ---------- Active campaigns table ---------- */
.tmg-card h2.h5[b-iirw87z6ch] {
    font-weight: 600;
    letter-spacing: -0.005em;
    color: var(--tmg-text);
}

.tmg-table thead th[b-iirw87z6ch] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tmg-text-muted);
    border-bottom: 2px solid var(--tmg-border);
    padding-top: 10px;
    padding-bottom: 10px;
    white-space: nowrap;
}

.tmg-table tbody tr[b-iirw87z6ch] {
    transition: background-color 0.12s ease;
}

.tmg-table tbody tr:hover[b-iirw87z6ch] {
    background: rgba(15, 118, 110, 0.04);
}

.tmg-table tbody td[b-iirw87z6ch] {
    vertical-align: middle;
    padding-top: 10px;
    padding-bottom: 10px;
}

.tmg-table tbody td .badge.tmg-status[b-iirw87z6ch] {
    vertical-align: middle;
}

.tmg-table tbody td .progress[b-iirw87z6ch] {
    background: rgba(15, 118, 110, 0.10);
    margin-bottom: 2px;
}

.tmg-table tbody td .progress-bar[b-iirw87z6ch] {
    background: var(--tmg-brand);
}

.tmg-table tbody td small[b-iirw87z6ch] {
    color: var(--tmg-text-muted);
    font-variant-numeric: tabular-nums;
}

/* Inline action column: align right so empty cells don't yank the row layout. */
.tmg-table tbody td:last-child[b-iirw87z6ch] {
    text-align: right;
    white-space: nowrap;
}

/* ---------- Outcomes funnel ---------- */
section.tmg-card .row .tmg-metric.text-center[b-iirw87z6ch] {
    padding: 12px 8px;
}

section.tmg-card .row .col-md-2 .tmg-metric-label[b-iirw87z6ch] {
    margin-bottom: 4px;
}

section.tmg-card .row .col-md-2 .tmg-metric-value[b-iirw87z6ch] {
    font-size: 1.6rem;
    font-variant-numeric: tabular-nums;
}

/* Visually de-emphasise zero values in the funnel — keeps numeric tabular
   alignment but tells the eye "nothing here". */
section.tmg-card .row .tmg-metric-value:not(:empty)[b-iirw87z6ch] {
    color: var(--tmg-text);
}

/* ---------- Calls per day ---------- */
.tmg-bar-row[b-iirw87z6ch] {
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--tmg-border);
    margin: 0 auto;
    max-width: 560px;
}

.tmg-bar[b-iirw87z6ch] {
    width: 28px;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(180deg, var(--tmg-brand) 0%, var(--tmg-brand-hover) 100%);
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.tmg-bar.tmg-bar-empty[b-iirw87z6ch] {
    width: 28px;
    height: 6px !important;
    background: var(--tmg-border);
    box-shadow: none;
}

.tmg-bar-count[b-iirw87z6ch] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--tmg-text);
    min-height: 1.1em;
}

.tmg-bar-label[b-iirw87z6ch] {
    font-size: 0.72rem;
    color: var(--tmg-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ---------- Recent calls ---------- */
.tmg-list-item[b-iirw87z6ch] {
    padding: 12px 8px;
    gap: 14px;
}

.tmg-list-item .tmg-avatar[b-iirw87z6ch] {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    font-size: 0.78rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.10);
}

.tmg-list-item .tmg-list-title[b-iirw87z6ch] {
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 2px;
}

.tmg-list-item .tmg-list-meta[b-iirw87z6ch] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    line-height: 1.2;
}

.tmg-list-item .tmg-list-trailing[b-iirw87z6ch] {
    font-size: 0.75rem;
    padding: 2px 8px;
    background: rgba(15, 23, 42, 0.05);
    color: var(--tmg-text-muted);
    border-radius: 9999px;
    font-variant-numeric: tabular-nums;
}

/* ---------- Empty states ---------- */
.tmg-empty[b-iirw87z6ch] {
    padding: 2.5rem 1rem 2.25rem;
}

.tmg-empty .tmg-empty-icon[b-iirw87z6ch] {
    font-size: 2.4rem;
    opacity: 0.35;
    color: var(--tmg-brand);
    margin-bottom: 0.6rem;
}

.tmg-empty .tmg-empty-title[b-iirw87z6ch] {
    font-size: 1rem;
    margin-bottom: 0.35rem;
}

.tmg-empty p[b-iirw87z6ch] {
    font-size: 0.88rem;
    color: var(--tmg-text-muted);
}

/* ---------- Page header polish ---------- */
.page-header h1[b-iirw87z6ch] {
    letter-spacing: -0.015em;
}
/* /Components/Pages/Demos.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Error.razor.rz.scp.css */
.tmg-error[b-infcrc7z7a] {
    text-align: center;
    padding: 48px 16px;
    max-width: 540px;
    margin: 0 auto;
}

.tmg-error-icon[b-infcrc7z7a] {
    font-size: 2.75rem;
    color: #DC2626;
    margin-bottom: 12px;
    line-height: 1;
}

.tmg-error-title[b-infcrc7z7a] {
    font-size: 1.625rem;
    font-weight: 700;
    margin: 0 0 12px;
    color: var(--tmg-text, #111827);
    letter-spacing: -0.01em;
}

.tmg-error-text[b-infcrc7z7a] {
    color: var(--tmg-text-muted, #6B7280);
    margin-bottom: 16px;
}

.tmg-error-request[b-infcrc7z7a] {
    background: var(--tmg-bg, #F9FAFB);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: 6px;
    padding: 10px 14px;
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #6B7280);
    display: inline-block;
    margin-bottom: 20px;
}

.tmg-error-request code[b-infcrc7z7a] {
    font-size: 0.8rem;
    color: var(--tmg-text, #111827);
}

.tmg-error-actions[b-infcrc7z7a] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Insights/Index.razor.rz.scp.css */
/* Scoped chart styles for the Insights page. No JS chart libraries — pure CSS. */

/* Containment: when a tenant has many campaigns the vbar-row can otherwise force the
   parent card (and the page itself) to grow beyond the viewport. Pin the card so the
   horizontal scrollbar lives inside the chart container, not on the whole page. */
.tmg-insights-card[b-064uc6jash] {
    overflow-x: hidden;
    min-width: 0;
    max-width: 100%;
}

.tmg-insights-card h2[b-064uc6jash] {
    margin-bottom: 0.5rem;
}

/* Horizontal bar list (objections). */
.tmg-hbar-list[b-064uc6jash] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tmg-hbar-row[b-064uc6jash] {
    display: grid;
    grid-template-columns: minmax(140px, 28%) 1fr 56px;
    align-items: center;
    gap: 0.75rem;
    padding: 0.35rem 0;
}

.tmg-hbar-label[b-064uc6jash] {
    font-size: 0.9rem;
    color: var(--tmg-text, #1f2937);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tmg-hbar-track[b-064uc6jash] {
    background: var(--tmg-track, #f1f3f5);
    border-radius: 4px;
    height: 18px;
    position: relative;
    overflow: hidden;
}

.tmg-hbar-fill[b-064uc6jash] {
    background: var(--tmg-brand, #14b8a6);
    height: 100%;
    border-radius: 4px;
    transition: width 220ms ease;
}

.tmg-hbar-count[b-064uc6jash] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--tmg-text, #1f2937);
    text-align: right;
}

/* Vertical bar row (conversion %, appointments). */
.tmg-vbar-row[b-064uc6jash] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    padding: 0.5rem 0 0.5rem;
    min-height: 180px;
    overflow-x: auto;
    /* Critical: without min-width:0 the flex children's intrinsic min-content size
       propagates up and bloats the parent card past the viewport. */
    min-width: 0;
    scrollbar-width: thin;
}

.tmg-vbar-col[b-064uc6jash] {
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Snug fixed-width cells so many-campaign tenants get a usable horizontal scroll
       inside the card instead of a 12,000px-wide page. */
    flex: 0 0 88px;
    min-width: 88px;
}

.tmg-vbar-count[b-064uc6jash] {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--tmg-text, #1f2937);
    margin-bottom: 0.25rem;
}

.tmg-vbar[b-064uc6jash] {
    width: 36px;
    background: var(--tmg-brand, #14b8a6);
    border-radius: 4px 4px 0 0;
    transition: height 220ms ease;
}

.tmg-vbar-empty[b-064uc6jash] {
    background: var(--tmg-track, #e5e7eb);
}

.tmg-vbar-label[b-064uc6jash] {
    margin-top: 0.4rem;
    font-size: 0.85rem;
    text-align: center;
    color: var(--tmg-text, #1f2937);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tmg-vbar-sublabel[b-064uc6jash] {
    font-size: 0.75rem;
    color: var(--tmg-muted, #6b7280);
    margin-top: 0.1rem;
}
/* /Components/Pages/NotFound.razor.rz.scp.css */
.tmg-notfound[b-ucwe5w5cph] {
    text-align: center;
    padding: 48px 16px;
    max-width: 480px;
    margin: 0 auto;
}

.tmg-notfound-code[b-ucwe5w5cph] {
    font-size: 4rem;
    font-weight: 700;
    color: var(--tmg-brand, #0F766E);
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 8px;
}

.tmg-notfound-title[b-ucwe5w5cph] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0 0 8px;
    color: var(--tmg-text, #111827);
}

.tmg-notfound-text[b-ucwe5w5cph] {
    color: var(--tmg-text-muted, #6B7280);
    margin-bottom: 24px;
}

.tmg-notfound-actions[b-ucwe5w5cph] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.tmg-notfound-actions .btn[b-ucwe5w5cph] {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}
/* /Components/Pages/Pricing.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Settings/AuditLog.razor.rz.scp.css */
/* Audit log — filter row alignment, monospace details column. */
[b-cstrkfagzv] .form-label.small {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
    margin-bottom: 0.25rem;
}

[b-cstrkfagzv] table.tmg-table {
    font-size: 0.85rem;
    table-layout: fixed;
    width: 100%;
}

[b-cstrkfagzv] table.tmg-table thead th:nth-child(1) { width: 130px; }
[b-cstrkfagzv] table.tmg-table thead th:nth-child(2) { width: 110px; }
[b-cstrkfagzv] table.tmg-table thead th:nth-child(3) { width: 140px; }
[b-cstrkfagzv] table.tmg-table thead th:nth-child(4) { width: 180px; }
[b-cstrkfagzv] table.tmg-table thead th:nth-child(5) { width: auto; }

[b-cstrkfagzv] table.tmg-table tbody td {
    overflow: hidden;
}

[b-cstrkfagzv] table.tmg-table tbody td {
    vertical-align: top;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

[b-cstrkfagzv] table.tmg-table td:nth-child(1) code {
    background: transparent;
    color: var(--tmg-text-muted);
    padding: 0;
    font-size: 0.78rem;
    white-space: nowrap;
}

[b-cstrkfagzv] table.tmg-table td:nth-child(5) {
    max-width: 28rem;
}

[b-cstrkfagzv] table.tmg-table td:nth-child(5) small {
    display: block;
    max-width: 100%;
    overflow: hidden;
}

[b-cstrkfagzv] table.tmg-table td:nth-child(5) code {
    background: var(--tmg-bg);
    color: var(--tmg-text-muted);
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-size: 0.75rem;
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Reveal full JSON on hover so the row height stays compact at rest. */
[b-cstrkfagzv] table.tmg-table tbody tr:hover td:nth-child(5) code {
    white-space: pre-wrap;
    word-break: break-all;
    background: var(--tmg-bg);
    color: var(--tmg-text);
}

/* Action column: small chip rather than naked bold. */
[b-cstrkfagzv] table.tmg-table td:nth-child(3) strong {
    display: inline-block;
    background: rgba(15, 118, 110, 0.08);
    color: var(--tmg-brand);
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.03em;
    padding: 2px 8px;
    border-radius: 999px;
    white-space: nowrap;
}

/* Pagination: spacing between Prev/Next. */
[b-cstrkfagzv] nav {
    margin-top: 0.75rem;
}

[b-cstrkfagzv] nav .btn + .btn {
    margin-left: 0.5rem;
}

[b-cstrkfagzv] .text-muted.small {
    color: var(--tmg-text-muted);
    margin-bottom: 0.75rem !important;
}
/* /Components/Pages/Settings/CostRates.razor.rz.scp.css */
/* Cost rates — FX rate row, add-rate form alignment, history current row. */
[b-uwwldyw1h1] .tmg-section-heading {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tmg-text-muted);
    margin-bottom: 0.5rem;
}

[b-uwwldyw1h1] .form-label.small {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--tmg-text-muted);
    margin-bottom: 0.25rem;
}

[b-uwwldyw1h1] table.tmg-table tbody td {
    vertical-align: middle;
    font-variant-numeric: tabular-nums;
}

[b-uwwldyw1h1] table.tmg-table tr.table-success {
    background: rgba(16, 185, 129, 0.08);
}

[b-uwwldyw1h1] table.tmg-table tr.table-success td {
    background: transparent;
}

[b-uwwldyw1h1] section.mb-4 {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 1rem;
}
/* /Components/Pages/Settings/Credentials.razor.rz.scp.css */
/* Credentials — tighten Set buttons, kbd-style env vars. */
[b-mk57gb779f] code {
    font-size: 0.8rem;
    background: var(--tmg-bg);
    color: var(--tmg-text);
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
}

/* Only code inside an error message is tinted; environment variable names in the help text stay neutral. */
[b-mk57gb779f] .text-danger code {
    background: rgba(239, 68, 68, 0.08);
    color: var(--tmg-danger-text, #B91C1C);
}

[b-mk57gb779f] .btn-outline-secondary.btn-sm {
    border-color: var(--tmg-border);
}
/* /Components/Pages/Settings/DoNotCall.razor.rz.scp.css */
/* DNC — add-entry / bulk panes, entries table. */
[b-z3cek0p4fq] section.row > [class*="col-"] {
    margin-bottom: 1rem;
}

[b-z3cek0p4fq] .tmg-section-heading {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tmg-text-muted);
    margin-bottom: 0.75rem;
}

[b-z3cek0p4fq] input[type="file"] {
    display: block;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px dashed var(--tmg-border);
    border-radius: var(--tmg-radius);
    background: var(--tmg-surface-2, #FAFBFC);
    font-size: 0.875rem;
}

[b-z3cek0p4fq] input[type="file"]::file-selector-button {
    margin-right: 0.75rem;
    padding: 0.25rem 0.75rem;
    border: 1px solid var(--tmg-border);
    border-radius: 4px;
    background: var(--tmg-surface, #fff);
    font-size: 0.85rem;
    cursor: pointer;
}

[b-z3cek0p4fq] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-z3cek0p4fq] table.tmg-table td code {
    font-size: 0.85rem;
    background: transparent;
    padding: 0;
    color: var(--tmg-text-muted);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

/* Add-entry placeholders should clearly look like ghost text, not values. */
[b-z3cek0p4fq] .col-md-6:first-child input.form-control::placeholder {
    color: #B7BDC8;
    opacity: 1;
}

[b-z3cek0p4fq] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-z3cek0p4fq] .small code {
    background: var(--tmg-bg);
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
    font-size: 0.78rem;
}
/* /Components/Pages/Settings/Erasure.razor.rz.scp.css */
/* Erasure — search row alignment, btn-primary brand fix, confirm states. */
[b-hm5hovv9sf] input.form-control {
    max-width: 400px;
}

[b-hm5hovv9sf] .btn-primary {
    background-color: var(--tmg-brand);
    border-color: var(--tmg-brand);
    color: #fff;
}

[b-hm5hovv9sf] .btn-primary:hover {
    background-color: var(--tmg-brand-hover);
    border-color: var(--tmg-brand-hover);
}

[b-hm5hovv9sf] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-hm5hovv9sf] table.tmg-table td code {
    font-size: 0.85rem;
    background: transparent;
    padding: 0;
}

[b-hm5hovv9sf] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-hm5hovv9sf] .alert {
    border-radius: var(--tmg-radius);
}
/* /Components/Pages/Settings/GoogleSheets.razor.rz.scp.css */
/* Google Sheets — textarea, service-account email callout, connection table. */
[b-ttb3i8v0wn] textarea.font-monospace {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.82rem;
    line-height: 1.5;
    background: var(--tmg-surface-2, #FAFBFC);
}

[b-ttb3i8v0wn] details {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 0.5rem 0.75rem;
}

[b-ttb3i8v0wn] details summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--tmg-brand);
}

[b-ttb3i8v0wn] details ol {
    margin-top: 0.5rem;
    padding-left: 1.25rem;
}

[b-ttb3i8v0wn] .alert-info {
    background: var(--tmg-tint-info-bg, #ECFEFF);
    border-color: #A5F3FC;
    color: var(--tmg-info-text, #155E75);
}

[b-ttb3i8v0wn] .alert-info code {
    background: rgba(15, 118, 110, 0.08);
    color: var(--tmg-brand-hover);
    font-size: 0.9rem;
}

[b-ttb3i8v0wn] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-ttb3i8v0wn] table.tmg-table td code {
    font-size: 0.82rem;
    background: transparent;
    padding: 0;
    color: var(--tmg-text-muted);
}

[b-ttb3i8v0wn] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-ttb3i8v0wn] .text-success {
    color: var(--tmg-brand) !important;
}
/* /Components/Pages/Settings/Notifications.razor.rz.scp.css */
.tmg-notif-unread > td[b-hhoknkgxwh] {
    background: rgba(15, 118, 110, 0.04);
}

.tmg-notif-unread > td:first-child[b-hhoknkgxwh] {
    box-shadow: inset 3px 0 0 var(--tmg-brand, #0F766E);
}
/* /Components/Pages/Settings/PhoneNumbers.razor.rz.scp.css */
/* Phone numbers — two-column tables polish. */
[b-dxu3v9yftm] .tmg-section-heading {
    margin-bottom: 0.75rem;
}

[b-dxu3v9yftm] table.tmg-table {
    background: var(--tmg-surface);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    overflow: hidden;
}

[b-dxu3v9yftm] table.tmg-table th {
    background: var(--tmg-bg);
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
}

[b-dxu3v9yftm] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-dxu3v9yftm] table.tmg-table td code {
    font-size: 0.85rem;
    background: transparent;
    padding: 0;
    color: var(--tmg-text-muted);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

/* Loading skeleton rows. */
.tmg-skeleton-rows[b-dxu3v9yftm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tmg-skeleton-row[b-dxu3v9yftm] {
    height: 38px;
    border-radius: var(--tmg-radius);
    background: linear-gradient(90deg, #F1F5F9 0%, #E5E7EB 50%, #F1F5F9 100%);
    background-size: 200% 100%;
    animation: tmg-shimmer-b-dxu3v9yftm 1.4s linear infinite;
}

@keyframes tmg-shimmer-b-dxu3v9yftm {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

[b-dxu3v9yftm] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}
/* /Components/Pages/Settings/Users.razor.rz.scp.css */
/* Users — table polish, role pill alignment. */
[b-x4zvbooczm] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-x4zvbooczm] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-x4zvbooczm] .badge.tmg-status {
    font-size: 0.72rem;
    padding: 0.3em 0.7em;
    text-transform: lowercase;
    letter-spacing: 0.02em;
}

/* Differentiate the two role pills: admin = brand, caller = neutral slate. */
[b-x4zvbooczm] .badge.tmg-role-admin {
    background: rgba(15, 118, 110, 0.10);
    color: var(--tmg-brand);
    border: 1px solid rgba(15, 118, 110, 0.25);
    font-weight: 600;
}

[b-x4zvbooczm] .badge.tmg-role-caller {
    background: var(--tmg-surface-3, #F1F5F9);
    color: var(--tmg-text-muted, #475569);
    border: 1px solid var(--tmg-border, #E2E8F0);
    font-weight: 500;
}

[b-x4zvbooczm] .text-muted.small i.bi-shield-lock-fill {
    color: var(--tmg-text-muted);
}

[b-x4zvbooczm] .btn-outline-primary {
    border-color: var(--tmg-brand);
    color: var(--tmg-brand);
}

[b-x4zvbooczm] .btn-outline-primary:hover {
    background: var(--tmg-brand);
    color: #fff;
}
/* /Components/Pages/Team.razor.rz.scp.css */
/* Public composition styles are owned by wwwroot/public-design.css, under .tmg-public-shell. */
/* /Components/Pages/Training/Admin.razor.rz.scp.css */
/* Training admin — bar chart brand colour, table polish. */
[b-bq3kmvwzo8] .progress {
    background: var(--tmg-bg);
    border-radius: 999px;
    overflow: hidden;
}

[b-bq3kmvwzo8] .progress-bar.bg-info {
    background-color: var(--tmg-brand) !important;
    color: #fff;
    font-weight: 600;
    font-size: 0.78rem;
}

[b-bq3kmvwzo8] table.tmg-table tbody tr:hover {
    background: var(--tmg-bg);
}

[b-bq3kmvwzo8] table.tmg-table tbody td {
    vertical-align: middle;
}

[b-bq3kmvwzo8] table.tmg-table td:last-child {
    text-align: right;
}
/* /Components/Pages/Training/AdminUserDetail.razor.rz.scp.css */
/* Training admin user detail — filter row, sessions table. */
[b-o4icjmfxvf] .form-label.me-2 {
    font-weight: 600;
    color: var(--tmg-text);
    margin-bottom: 0;
    margin-right: 0.75rem !important;
}

[b-o4icjmfxvf] select.form-select {
    border-color: var(--tmg-border);
}

[b-o4icjmfxvf] .tmg-inline-bar-fill {
    background: var(--tmg-brand);
}

[b-o4icjmfxvf] table tbody tr:hover {
    background: var(--tmg-bg);
}

[b-o4icjmfxvf] table tbody td {
    vertical-align: middle;
}

[b-o4icjmfxvf] audio {
    height: 32px;
}
/* /Components/Pages/Training/Courses/AiNew.razor.rz.scp.css */
.tmg-ainew-card[b-8jxnpuz2lq] {
    max-width: 820px;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #e5e7eb);
    border-radius: 18px;
    padding: 2rem 2.25rem;
    box-shadow: 0 8px 32px rgba(13, 60, 48, 0.07);
}

.tmg-ainew-step[b-8jxnpuz2lq] {
    display: flex;
    gap: 1.1rem;
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem;
    border-bottom: 1px solid var(--tmg-border, #e5e7eb);
}

.tmg-ainew-step:last-of-type[b-8jxnpuz2lq] {
    border-bottom: none;
    margin-bottom: 0.25rem;
    padding-bottom: 0.5rem;
}

.tmg-ainew-step-num[b-8jxnpuz2lq] {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-weight: 700;
    color: var(--tmg-brand, #0f766e);
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 12%, transparent);
}

.tmg-ainew-step-body[b-8jxnpuz2lq] {
    flex: 1;
    min-width: 0;
}

.tmg-ainew-label[b-8jxnpuz2lq] {
    display: block;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.tmg-ainew-examples[b-8jxnpuz2lq] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 0.6rem;
}

.tmg-ainew-chip[b-8jxnpuz2lq] {
    border: 1px solid var(--tmg-border, #e5e7eb);
    background: var(--tmg-surface-2, #f8fafc);
    color: inherit;
    border-radius: 999px;
    font-size: 0.8rem;
    padding: 3px 12px;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.tmg-ainew-chip:hover[b-8jxnpuz2lq] {
    border-color: var(--tmg-brand, #0f766e);
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 8%, transparent);
}

.tmg-ainew-voices[b-8jxnpuz2lq] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

@media (max-width: 640px) {
    .tmg-ainew-voices[b-8jxnpuz2lq] {
        grid-template-columns: 1fr;
    }
}

.tmg-ainew-voice[b-8jxnpuz2lq] {
    display: flex;
    gap: 0.7rem;
    align-items: flex-start;
    padding: 0.85rem 1rem;
    border: 1.5px solid var(--tmg-border, #e5e7eb);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.tmg-ainew-voice input[b-8jxnpuz2lq] {
    margin-top: 0.2rem;
}

.tmg-ainew-voice.selected[b-8jxnpuz2lq] {
    border-color: var(--tmg-brand, #0f766e);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--tmg-brand, #0f766e) 14%, transparent);
}
/* /Components/Pages/Training/Courses/AssignDialog.razor.rz.scp.css */
/* Assign dialog: same shape as the course level modal (backdrop blur, rounded surface, 44px close
   target). Colours come from the theme tokens so light and dark both work. Opacity-only entrance:
   no transform is retained on an ancestor of the scrolling list. */

.tmg-assign-backdrop[b-h1inyq9emj] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    place-items: center;
    padding: 1.25rem;
    background: rgba(8, 18, 16, 0.55);
    backdrop-filter: blur(6px);
    animation: tmg-assign-fade-b-h1inyq9emj 0.18s ease-out;
}

.tmg-assign-modal[b-h1inyq9emj] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 560px;
    max-height: calc(100vh - 2.5rem);
    max-height: calc(100dvh - 2.5rem);
    background: var(--tmg-surface);
    color: var(--tmg-text);
    border: 1px solid var(--tmg-border);
    border-radius: 20px;
    padding: 1.75rem 1.75rem 1.25rem;
    box-shadow: var(--tmg-shadow-modal);
}

.tmg-assign-modal:focus[b-h1inyq9emj] { outline: none; }

.tmg-assign-close[b-h1inyq9emj] {
    position: absolute;
    top: 0.8rem;
    right: 0.8rem;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: none;
    border-radius: 50%;
    background: var(--tmg-surface-3);
    color: var(--tmg-text-muted);
    transition: background 0.15s ease, color 0.15s ease;
}

.tmg-assign-close:hover[b-h1inyq9emj] { background: var(--tmg-brand-100); color: var(--tmg-brand); }
.tmg-assign-close:focus-visible[b-h1inyq9emj] { outline: 2px solid var(--tmg-brand); outline-offset: 2px; }

.tmg-assign-head[b-h1inyq9emj] { padding-right: 3rem; }

.tmg-assign-kicker[b-h1inyq9emj] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tmg-brand);
}

.tmg-assign-title[b-h1inyq9emj] {
    margin: 0.15rem 0 0.4rem;
    font-size: 1.3rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.015em;
    overflow-wrap: anywhere;
}

.tmg-assign-courses[b-h1inyq9emj] {
    margin: 0 0 0.5rem;
    padding-left: 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
}

.tmg-assign-sub[b-h1inyq9emj] {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    color: var(--tmg-text-muted);
}

.tmg-assign-tools[b-h1inyq9emj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 1rem;
    margin-bottom: 0.6rem;
}

.tmg-assign-search[b-h1inyq9emj] { position: relative; flex: 1 1 220px; }

.tmg-assign-search i[b-h1inyq9emj] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--tmg-text-muted);
    pointer-events: none;
}

.tmg-assign-search .form-control[b-h1inyq9emj] { padding-left: 34px; min-height: 44px; }

.tmg-assign-all[b-h1inyq9emj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 44px;
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.tmg-assign-all input[b-h1inyq9emj], .tmg-assign-row input[b-h1inyq9emj] { width: 1.15rem; height: 1.15rem; margin: 0; flex: none; }

.tmg-assign-list[b-h1inyq9emj] {
    list-style: none;
    margin: 0;
    padding: 0.25rem;
    flex: 1 1 auto;
    min-height: 3.5rem;
    overflow-y: auto;
    border: 1px solid var(--tmg-border);
    border-radius: 12px;
    background: var(--tmg-surface-2);
}

.tmg-assign-row[b-h1inyq9emj] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-height: 48px;
    margin: 0;
    padding: 0.35rem 0.6rem;
    border-radius: 9px;
    cursor: pointer;
    transition: background-color 0.12s ease;
}

.tmg-assign-row:hover[b-h1inyq9emj] { background: var(--tmg-brand-50); }
.tmg-assign-row:has(input:focus-visible)[b-h1inyq9emj] { outline: 2px solid var(--tmg-brand); outline-offset: -2px; }
.tmg-assign-row:has(input:checked):not(.is-done)[b-h1inyq9emj] { background: var(--tmg-brand-100); }
.tmg-assign-row.is-done[b-h1inyq9emj] { cursor: default; color: var(--tmg-text-muted); }
.tmg-assign-row.is-done:hover[b-h1inyq9emj] { background: transparent; }

.tmg-assign-avatar[b-h1inyq9emj] {
    flex: none;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--tmg-surface-3);
    border: 1px solid var(--tmg-border);
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--tmg-text-muted);
}

.tmg-assign-email[b-h1inyq9emj] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.925rem;
}

.tmg-assign-tag[b-h1inyq9emj] {
    flex: none;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: var(--tmg-surface-3);
    border: 1px solid var(--tmg-border);
    color: var(--tmg-text-muted);
    white-space: nowrap;
}

.tmg-assign-none[b-h1inyq9emj] {
    margin: 0.6rem 0 0;
    font-size: 0.85rem;
    color: var(--tmg-text-muted);
}

.tmg-assign-empty[b-h1inyq9emj] {
    text-align: center;
    padding: 1.5rem 1rem;
    border: 1px dashed var(--tmg-border);
    border-radius: 12px;
    color: var(--tmg-text-muted);
}

.tmg-assign-empty p[b-h1inyq9emj] { font-size: 0.9rem; max-width: 40ch; margin: 0.35rem auto 1rem; }

.tmg-assign-empty-icon[b-h1inyq9emj] {
    width: 56px;
    height: 56px;
    margin: 0 auto 0.6rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--tmg-brand-50);
    border: 1px dashed var(--tmg-brand-200);
    color: var(--tmg-brand);
    font-size: 1.5rem;
}

.tmg-assign-empty-title[b-h1inyq9emj] { font-weight: 700; color: var(--tmg-text); }

.tmg-assign-loading[b-h1inyq9emj] { display: grid; gap: 0.5rem; }

.tmg-assign-loading span[b-h1inyq9emj] {
    height: 44px;
    border-radius: 9px;
    background: var(--tmg-surface-3);
}

.tmg-assign-foot[b-h1inyq9emj] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem 1rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--tmg-border);
}

.tmg-assign-summary[b-h1inyq9emj] { font-size: 0.9rem; font-weight: 600; color: var(--tmg-text-muted); }

.tmg-assign-foot-actions[b-h1inyq9emj] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-left: auto; }
.tmg-assign-foot-actions .btn[b-h1inyq9emj] { min-height: 44px; }

@keyframes tmg-assign-fade-b-h1inyq9emj {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: no-preference) {
    .tmg-assign-loading span[b-h1inyq9emj] { animation: tmg-assign-pulse-b-h1inyq9emj 1.6s ease-in-out infinite; }
    @keyframes tmg-assign-pulse-b-h1inyq9emj { 50% { opacity: 0.55; } }
}

@media (prefers-reduced-motion: reduce) {
    .tmg-assign-backdrop[b-h1inyq9emj] { animation: none; }
}

@media (max-width: 575px) {
    .tmg-assign-backdrop[b-h1inyq9emj] { padding: 0.5rem; align-items: end; }
    .tmg-assign-modal[b-h1inyq9emj] {
        max-height: calc(100vh - 1rem);
        max-height: calc(100dvh - 1rem);
        padding: 1.25rem 1rem 1rem;
        border-radius: 18px;
    }
    .tmg-assign-foot-actions[b-h1inyq9emj] { width: 100%; }
    .tmg-assign-foot-actions .btn[b-h1inyq9emj] { flex: 1 1 0; }
}

.tmg-assign-modal .form-check-input:checked[b-h1inyq9emj] {
    background-color: var(--tmg-brand);
    border-color: var(--tmg-brand);
}
/* /Components/Pages/Training/Courses/Detail.razor.rz.scp.css */
.tmg-course-enrollment-header[b-s0zt1vwpxm] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.tmg-course-enrollment-actions[b-s0zt1vwpxm] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-left: auto;
    min-width: 0;
    max-width: 100%;
}

.tmg-course-enrollment-actions select[b-s0zt1vwpxm],
.tmg-course-enrollment-actions button[b-s0zt1vwpxm] {
    min-height: 44px;
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 575px) {
    .tmg-course-enrollment-actions[b-s0zt1vwpxm] {
        width: 100%;
        margin-left: 0;
    }

    .tmg-course-enrollment-actions select[b-s0zt1vwpxm],
    .tmg-course-enrollment-actions button[b-s0zt1vwpxm] {
        width: 100%;
    }
}

/* ── Level modal ───────────────────────────────────────────────────────────
   The whole run-a-level experience: backdrop blur, slide-up entrance, level
   stepper, scoring rings, and the level-passed celebration. All colours come
   from the theme tokens so light/dark both work. */

.tmg-level-backdrop[b-s0zt1vwpxm] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: grid;
    place-items: center;
    padding: 1.25rem;
    background: rgba(8, 18, 16, 0.55);
    backdrop-filter: blur(6px);
    animation: tmg-level-fade-b-s0zt1vwpxm 0.2s ease-out;
}

.tmg-level-modal[b-s0zt1vwpxm] {
    position: relative;
    width: 100%;
    max-width: 720px;
    max-height: calc(100vh - 2.5rem);
    overflow-y: auto;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #e5e7eb);
    border-radius: 20px;
    padding: 2rem 2.25rem 2.25rem;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
    animation: tmg-level-rise-b-s0zt1vwpxm 0.28s cubic-bezier(0.21, 1.02, 0.55, 1);
}

.tmg-level-modal-celebrate[b-s0zt1vwpxm] {
    border-color: color-mix(in srgb, var(--tmg-brand, #0f766e) 55%, transparent);
    box-shadow:
        0 24px 80px rgba(0, 0, 0, 0.35),
        0 0 0 4px color-mix(in srgb, var(--tmg-brand, #0f766e) 18%, transparent);
}

.tmg-level-close[b-s0zt1vwpxm] {
    position: absolute;
    top: 0.9rem;
    right: 0.9rem;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: none;
    border-radius: 50%;
    background: var(--tmg-surface-3, #f3f4f6);
    color: var(--tmg-text-muted, #6b7280);
    transition: background 0.15s ease, color 0.15s ease;
}

.tmg-level-close:hover[b-s0zt1vwpxm] {
    background: var(--tmg-border, #e5e7eb);
    color: inherit;
}

/* ── Header & stepper ── */

.tmg-level-head[b-s0zt1vwpxm] {
    text-align: center;
    margin-bottom: 1.25rem;
}

.tmg-level-stepper[b-s0zt1vwpxm] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.1rem;
}

.tmg-level-dot[b-s0zt1vwpxm] {
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 700;
    border: 2px solid var(--tmg-border, #e5e7eb);
    color: var(--tmg-text-muted, #6b7280);
    background: var(--tmg-surface, #fff);
    transition: all 0.3s ease;
}

.tmg-level-dot.done[b-s0zt1vwpxm] {
    background: var(--tmg-brand, #0f766e);
    border-color: var(--tmg-brand, #0f766e);
    color: #fff;
}

.tmg-level-dot.current[b-s0zt1vwpxm] {
    border-color: var(--tmg-brand, #0f766e);
    color: var(--tmg-brand, #0f766e);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--tmg-brand, #0f766e) 16%, transparent);
}

.tmg-level-dot.next[b-s0zt1vwpxm] {
    border-color: var(--tmg-brand, #0f766e);
    color: var(--tmg-brand, #0f766e);
    animation: tmg-level-dot-pulse-b-s0zt1vwpxm 1.4s ease-in-out infinite;
}

.tmg-level-dot-rail[b-s0zt1vwpxm] {
    width: 34px;
    height: 2px;
    flex: 0 0 auto;
    background: var(--tmg-border, #e5e7eb);
}

.tmg-level-dot-rail.done[b-s0zt1vwpxm] {
    background: var(--tmg-brand, #0f766e);
}

.tmg-level-kicker[b-s0zt1vwpxm] {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--tmg-brand, #0f766e);
}

.tmg-level-title[b-s0zt1vwpxm] {
    font-size: 1.55rem;
    font-weight: 700;
    margin: 0.15rem 0 0.5rem;
}

.tmg-level-chips[b-s0zt1vwpxm] {
    display: flex;
    gap: 0.5rem;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

.tmg-level-chip[b-s0zt1vwpxm] {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--tmg-surface-3, #f3f4f6);
    color: var(--tmg-text-muted, #6b7280);
}

/* ── Setup ── */

.tmg-level-desc[b-s0zt1vwpxm] {
    text-align: left;
    white-space: pre-line;
    color: var(--tmg-text-muted, #6b7280);
    max-width: 540px;
    margin: 0 auto 1rem;
}

.tmg-level-criteria[b-s0zt1vwpxm] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 7%, transparent);
    border: 1px solid color-mix(in srgb, var(--tmg-brand, #0f766e) 20%, transparent);
}

.tmg-level-criteria i[b-s0zt1vwpxm] {
    color: var(--tmg-brand, #0f766e);
    font-size: 1.1rem;
}

/* ── Tips for this call (pre-call, scenario-specific) ── */

.tmg-level-tips[b-s0zt1vwpxm] {
    padding: 0.85rem 1rem;
    border-radius: 12px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
    background: color-mix(in srgb, #eab308 8%, transparent);
    border: 1px solid color-mix(in srgb, #eab308 25%, transparent);
    text-align: left;
}

.tmg-level-tips-title[b-s0zt1vwpxm] {
    font-weight: 600;
    margin-bottom: 0.4rem;
}

.tmg-level-tips-title i[b-s0zt1vwpxm] {
    color: #ca8a04;
}

.tmg-level-tips-list[b-s0zt1vwpxm] {
    margin: 0;
    padding-left: 1.1rem;
    display: grid;
    gap: 0.3rem;
}

/* ── AI coach feedback (post-call, shown once the review settles) ── */

.tmg-level-feedback[b-s0zt1vwpxm] {
    margin: 0.75rem auto 1rem;
    max-width: 560px;
    padding: 0.9rem 1.1rem;
    border-radius: 12px;
    font-size: 0.9rem;
    text-align: left;
    background: var(--tmg-surface-2, rgba(0, 0, 0, 0.03));
    border: 1px solid var(--tmg-border, #e5e7eb);
    display: grid;
    gap: 0.55rem;
}

.tmg-level-feedback-head[b-s0zt1vwpxm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
}

.tmg-level-feedback-head i[b-s0zt1vwpxm] {
    color: var(--tmg-brand, #0f766e);
}

.tmg-level-feedback-score[b-s0zt1vwpxm] {
    margin-left: auto;
    font-weight: 700;
    font-size: 1.15rem;
    color: var(--tmg-brand, #0f766e);
}

.tmg-level-feedback-score small[b-s0zt1vwpxm] {
    font-size: 0.7em;
    opacity: 0.7;
}

.tmg-level-feedback-row[b-s0zt1vwpxm] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
}

.tmg-level-feedback-row.positive i[b-s0zt1vwpxm] {
    color: #16a34a;
}

.tmg-level-feedback-row.improve i[b-s0zt1vwpxm] {
    color: #d97706;
}

.tmg-level-feedback-metrics[b-s0zt1vwpxm] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.1rem;
    margin-top: 0.2rem;
    padding-top: 0.6rem;
    border-top: 1px solid var(--tmg-border, #e5e7eb);
    font-size: 0.82rem;
    color: var(--tmg-text-muted, #6b7280);
}

.tmg-level-feedback-metrics strong[b-s0zt1vwpxm] {
    color: var(--tmg-brand, #0f766e);
}

/* ── Scoring ── */

.tmg-level-scoring[b-s0zt1vwpxm] {
    text-align: center;
    padding: 1.5rem 0 1rem;
}

.tmg-level-scoring-rings[b-s0zt1vwpxm] {
    position: relative;
    width: 96px;
    height: 96px;
    margin: 0 auto 1.25rem;
    display: grid;
    place-items: center;
}

.tmg-level-scoring-rings i[b-s0zt1vwpxm] {
    font-size: 2rem;
    color: var(--tmg-brand, #0f766e);
}

.tmg-level-scoring-rings span[b-s0zt1vwpxm] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid var(--tmg-brand, #0f766e);
    opacity: 0;
    animation: tmg-level-ring-b-s0zt1vwpxm 2.1s ease-out infinite;
}

.tmg-level-scoring-rings span:nth-child(2)[b-s0zt1vwpxm] { animation-delay: 0.7s; }
.tmg-level-scoring-rings span:nth-child(3)[b-s0zt1vwpxm] { animation-delay: 1.4s; }

.tmg-level-scoring-title[b-s0zt1vwpxm] {
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.tmg-level-scoring-sub[b-s0zt1vwpxm] {
    color: var(--tmg-text-muted, #6b7280);
    max-width: 460px;
    margin: 0 auto;
    font-size: 0.9rem;
}

/* ── Level passed ── */

.tmg-level-passed[b-s0zt1vwpxm] {
    text-align: center;
    padding: 1rem 0 0.5rem;
}

.tmg-level-passed-badge[b-s0zt1vwpxm] {
    width: 84px;
    height: 84px;
    margin: 0 auto 1rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 2.4rem;
    color: #fff;
    background: linear-gradient(135deg, var(--tmg-brand, #0f766e), #34d399);
    box-shadow: 0 10px 36px color-mix(in srgb, var(--tmg-brand, #0f766e) 45%, transparent);
    animation: tmg-level-pop-b-s0zt1vwpxm 0.5s cubic-bezier(0.3, 1.6, 0.5, 1);
}

.tmg-level-passed-title[b-s0zt1vwpxm] {
    font-size: 1.6rem;
    font-weight: 800;
    margin-bottom: 0.4rem;
    animation: tmg-level-fade-b-s0zt1vwpxm 0.5s ease-out 0.1s backwards;
}

.tmg-level-passed-sub[b-s0zt1vwpxm] {
    color: var(--tmg-text-muted, #6b7280);
    margin-bottom: 1.25rem;
    animation: tmg-level-fade-b-s0zt1vwpxm 0.5s ease-out 0.22s backwards;
}

/* ── Try again / course failed ── */

.tmg-level-tryagain[b-s0zt1vwpxm] {
    text-align: center;
    padding: 1rem 0 0.5rem;
}

.tmg-level-tryagain-badge[b-s0zt1vwpxm] {
    width: 76px;
    height: 76px;
    margin: 0 auto 1rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 2rem;
    color: #b45309;
    background: color-mix(in srgb, #f59e0b 16%, transparent);
    animation: tmg-level-pop-b-s0zt1vwpxm 0.4s cubic-bezier(0.3, 1.6, 0.5, 1);
}

.tmg-level-tryagain-badge.failed[b-s0zt1vwpxm] {
    color: #b91c1c;
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

.tmg-level-tryagain-title[b-s0zt1vwpxm] {
    font-size: 1.35rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.tmg-level-tryagain-sub[b-s0zt1vwpxm] {
    color: var(--tmg-text-muted, #6b7280);
    max-width: 480px;
    margin: 0 auto 1.25rem;
}

/* ── Keyframes ── */

@keyframes tmg-level-fade-b-s0zt1vwpxm {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes tmg-level-rise-b-s0zt1vwpxm {
    from { opacity: 0; transform: translateY(26px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes tmg-level-pop-b-s0zt1vwpxm {
    0% { transform: scale(0.3); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes tmg-level-ring-b-s0zt1vwpxm {
    0% { transform: scale(0.55); opacity: 0.75; }
    100% { transform: scale(1.25); opacity: 0; }
}

@keyframes tmg-level-dot-pulse-b-s0zt1vwpxm {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--tmg-brand, #0f766e) 35%, transparent); }
    50% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--tmg-brand, #0f766e) 0%, transparent); }
}

@media (prefers-reduced-motion: reduce) {
    .tmg-level-backdrop[b-s0zt1vwpxm],
    .tmg-level-modal[b-s0zt1vwpxm],
    .tmg-level-passed-badge[b-s0zt1vwpxm],
    .tmg-level-passed-title[b-s0zt1vwpxm],
    .tmg-level-passed-sub[b-s0zt1vwpxm],
    .tmg-level-tryagain-badge[b-s0zt1vwpxm] {
        animation: none;
    }
    .tmg-level-scoring-rings span[b-s0zt1vwpxm],
    .tmg-level-dot.next[b-s0zt1vwpxm] {
        animation: none;
        opacity: 0.25;
    }
}

/* ── Enrolment attempts & conversations panel ───────────────────────────────── */
.tmg-enrollment-attempts-row td[b-s0zt1vwpxm] {
    background-color: var(--tmg-surface-subtle, #f8fafc);
    border-top: none;
}

.tmg-attempt-card[b-s0zt1vwpxm] {
    background: var(--tmg-surface, #ffffff);
    border: 1px solid var(--tmg-border, #e2e8f0);
    border-radius: var(--tmg-radius, 8px);
    transition: box-shadow 0.15s ease-in-out;
}

.tmg-attempt-card:hover[b-s0zt1vwpxm] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.tmg-attempt-audio-section[b-s0zt1vwpxm] {
    background: var(--tmg-surface-muted, #f1f5f9);
    border-radius: var(--tmg-radius-sm, 6px);
    padding: 0.75rem 1rem;
}

/* ── Level modal refinements (October 2026) ────────────────────────────────
   A calmer, more deliberate dialog: a brand hairline across the top, a stepper
   that reads as progress, the brief as a card, and one unmistakable primary
   action. The live call itself is the dark stage in app.css ("Live practice
   call"). Tokens only; nothing new moves under prefers-reduced-motion. */

.tmg-level-backdrop[b-s0zt1vwpxm] {
    background: rgba(6, 16, 20, 0.62);
    backdrop-filter: blur(8px) saturate(120%);
}

.tmg-level-modal[b-s0zt1vwpxm] {
    max-width: 760px;
    border-radius: 24px;
    padding: 2.1rem 2.25rem 2rem;
    border-color: color-mix(in srgb, var(--tmg-brand, #0f766e) 14%, var(--tmg-border, #e5e7eb));
    box-shadow: 0 30px 90px -20px rgba(2, 12, 16, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.04);
    background:
        radial-gradient(120% 60% at 50% 0%, color-mix(in srgb, var(--tmg-brand, #0f766e) 7%, transparent), transparent 70%),
        var(--tmg-surface, #fff);
}

/* The brand hairline. It scrolls with the dialog's content, so it sits at the very top of the scroll box. */
.tmg-level-modal[b-s0zt1vwpxm]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24px;
    right: 24px;
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: var(--tmg-brand-grad, linear-gradient(135deg, #0f766e, #10b981));
}

.tmg-level-close[b-s0zt1vwpxm] {
    top: 1rem;
    right: 1rem;
    background: var(--tmg-surface-2, #f8fafc);
    border: 1px solid var(--tmg-border, #e5e7eb);
}

.tmg-level-head[b-s0zt1vwpxm] {
    margin-bottom: 1.4rem;
}

.tmg-level-stepper[b-s0zt1vwpxm] {
    margin-bottom: 1.15rem;
}

.tmg-level-dot[b-s0zt1vwpxm] {
    width: 34px;
    height: 34px;
    font-size: 0.86rem;
    border-width: 2px;
}

.tmg-level-dot.done[b-s0zt1vwpxm] {
    background: var(--tmg-brand-grad, linear-gradient(135deg, #0f766e, #10b981));
    border-color: transparent;
    box-shadow: 0 6px 14px -6px color-mix(in srgb, var(--tmg-brand, #0f766e) 70%, transparent);
}

.tmg-level-dot.current[b-s0zt1vwpxm] {
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 8%, var(--tmg-surface, #fff));
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--tmg-brand, #0f766e) 14%, transparent);
}

.tmg-level-dot.locked[b-s0zt1vwpxm] {
    background: var(--tmg-surface-2, #f8fafc);
}

.tmg-level-dot-rail[b-s0zt1vwpxm] {
    width: 46px;
    height: 3px;
    border-radius: 2px;
}

.tmg-level-dot-rail.done[b-s0zt1vwpxm] {
    background: linear-gradient(90deg, var(--tmg-brand, #0f766e), #34d399);
}

.tmg-level-kicker[b-s0zt1vwpxm] {
    display: inline-block;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    /* The darker brand tone: the lighter one on this tint is under 4.5:1 in the light theme. */
    color: var(--tmg-brand-hover, #115e59);
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 10%, transparent);
}

[data-tmg-theme="dark"] .tmg-level-kicker[b-s0zt1vwpxm] {
    color: var(--tmg-brand-600, #2dd4bf);
}

.tmg-level-title[b-s0zt1vwpxm] {
    font-size: 1.62rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    line-height: 1.2;
    margin: 0.55rem auto 0.65rem;
    max-width: 30ch;
    text-wrap: balance;
}

.tmg-level-chip[b-s0zt1vwpxm] {
    padding: 4px 11px;
    background: var(--tmg-surface-2, #f8fafc);
    border: 1px solid var(--tmg-border, #e5e7eb);
}

/* The brief: a card with its own label, read left to right at a comfortable measure. */
.tmg-level-desc[b-s0zt1vwpxm] {
    position: relative;
    max-width: none;
    margin: 0 0 1rem;
    padding: 2.1rem 1.1rem 1rem;
    border-radius: 14px;
    border: 1px solid var(--tmg-border, #e5e7eb);
    background: var(--tmg-surface-2, #f8fafc);
    color: var(--tmg-text, #111827);
    font-size: 0.94rem;
    line-height: 1.6;
}

.tmg-level-desc[b-s0zt1vwpxm]::before {
    content: "Your brief";
    position: absolute;
    top: 0.8rem;
    left: 1.1rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tmg-text-muted, #6b7280);
}

.tmg-level-criteria[b-s0zt1vwpxm],
.tmg-level-tips[b-s0zt1vwpxm] {
    border-radius: 14px;
    line-height: 1.55;
}

.tmg-level-criteria i[b-s0zt1vwpxm] {
    flex: none;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 0.95rem;
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 13%, transparent);
}

.tmg-level-tips[b-s0zt1vwpxm] {
    background: var(--tmg-tint-warn-bg, #fffbeb);
    border-color: var(--tmg-tint-warn-border, #fde68a);
}

.tmg-level-tips-title i[b-s0zt1vwpxm] {
    color: var(--tmg-warn-strong, #b45309);
}

/* The one primary action in the dialog. */
.tmg-level-body[b-s0zt1vwpxm]  [data-testid="start-practice-btn"],
.tmg-level-body [data-testid="start-practice-btn"][b-s0zt1vwpxm] {
    min-height: 54px;
    border-radius: 14px;
    font-size: 1.05rem;
    letter-spacing: -0.01em;
    /* The fill is .btn-primary's own dark teal: white text on the brand gradient's emerald end fails contrast. */
    box-shadow: 0 14px 28px -14px color-mix(in srgb, var(--tmg-brand, #0f766e) 85%, transparent), inset 0 1px 0 rgb(255 255 255 / 0.2);
}

.tmg-level-body [data-testid="close-brief-btn"][b-s0zt1vwpxm] {
    border-color: transparent;
    color: var(--tmg-text-muted, #6b7280);
}

.tmg-level-body [data-testid="close-brief-btn"]:hover[b-s0zt1vwpxm] {
    background: var(--tmg-surface-2, #f8fafc);
    color: var(--tmg-text, #111827);
}

/* Scoring: the rings carry the brand gradient and the centre sits on a soft disc. */
.tmg-level-scoring[b-s0zt1vwpxm] {
    padding: 2rem 0 1.25rem;
}

.tmg-level-scoring-rings[b-s0zt1vwpxm] {
    width: 104px;
    height: 104px;
}

.tmg-level-scoring-rings i[b-s0zt1vwpxm] {
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    font-size: 1.7rem;
    color: #fff;
    background: var(--tmg-brand-grad, linear-gradient(135deg, #0f766e, #10b981));
    box-shadow: 0 12px 28px -10px color-mix(in srgb, var(--tmg-brand, #0f766e) 80%, transparent);
}

.tmg-level-scoring-title[b-s0zt1vwpxm] {
    font-size: 1.25rem;
    letter-spacing: -0.015em;
}

/* Results */
.tmg-level-passed-badge[b-s0zt1vwpxm] {
    box-shadow: 0 0 0 8px color-mix(in srgb, var(--tmg-brand, #0f766e) 12%, transparent), 0 14px 40px -8px color-mix(in srgb, var(--tmg-brand, #0f766e) 55%, transparent);
}

.tmg-level-passed-title[b-s0zt1vwpxm],
.tmg-level-tryagain-title[b-s0zt1vwpxm] {
    letter-spacing: -0.02em;
}

.tmg-level-tryagain-badge[b-s0zt1vwpxm] {
    color: var(--tmg-warn-strong, #b45309);
    box-shadow: 0 0 0 8px color-mix(in srgb, #f59e0b 8%, transparent);
}

.tmg-level-feedback[b-s0zt1vwpxm] {
    border-radius: 16px;
    padding: 1rem 1.15rem;
    box-shadow: var(--tmg-shadow-sm, 0 1px 2px rgb(0 0 0 / 0.05));
}

.tmg-level-feedback-score[b-s0zt1vwpxm] {
    padding: 2px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--tmg-brand, #0f766e) 10%, transparent);
    font-variant-numeric: tabular-nums;
}

@media (max-width: 575px) {
    .tmg-level-modal[b-s0zt1vwpxm] {
        padding: 1.6rem 1.1rem 1.4rem;
        border-radius: 20px;
    }

    .tmg-level-title[b-s0zt1vwpxm] {
        font-size: 1.32rem;
    }

    .tmg-level-dot-rail[b-s0zt1vwpxm] {
        width: 30px;
    }
}
/* Focus is parked on the dialog itself when it opens (so Escape and Tab work); the container is not a control, so it shows no ring. */
.tmg-level-modal:focus[b-s0zt1vwpxm] {
    outline: none;
}

/* The start notice inside the dialog is a quiet inset panel, and a Start button that cannot be used does not glow. */
.tmg-level-body[b-s0zt1vwpxm]  [data-testid="training-start-notice"] {
    border-radius: 14px !important;
    border-color: var(--tmg-border, #e5e7eb) !important;
    background: var(--tmg-surface-2, #f8fafc);
    line-height: 1.55;
}

.tmg-level-body [data-testid="start-practice-btn"]:disabled[b-s0zt1vwpxm] {
    box-shadow: none;
}
/* ── Review fixes (October 2026) ── */

/* The stepper never runs under the close button or scrolls the dialog: the rails give way first, then the dots. The row is narrower than the
   dialog by the close button's width on both sides, so it stays centred. */
.tmg-level-stepper[b-s0zt1vwpxm] {
    max-width: calc(100% - 104px);
    margin-left: auto;
    margin-right: auto;
}

.tmg-level-dot[b-s0zt1vwpxm] {
    flex: 0 1 34px;
    width: auto;
    height: auto;
    min-width: 22px;
    aspect-ratio: 1;
}

.tmg-level-dot-rail[b-s0zt1vwpxm] {
    flex: 1 1 46px;
    width: auto;
    max-width: 46px;
    min-width: 4px;
}

/* The feedback card lines up with the call analysis card under it. */
.tmg-level-feedback[b-s0zt1vwpxm] {
    max-width: none;
}

/* During a call on a phone or a short screen the dialog keeps only the level line above the stage: the stage already names the persona, and
   End call must stay within reach without scrolling. */
@media (max-width: 575px), (max-height: 720px) {
    .tmg-level-head.is-incall[b-s0zt1vwpxm] {
        margin-bottom: 0.85rem;
    }

    .tmg-level-head.is-incall .tmg-level-stepper[b-s0zt1vwpxm],
    .tmg-level-head.is-incall .tmg-level-title[b-s0zt1vwpxm],
    .tmg-level-head.is-incall .tmg-level-chips[b-s0zt1vwpxm] {
        display: none;
    }
}

@media (max-width: 575px) {
    .tmg-level-dot[b-s0zt1vwpxm] {
        flex-basis: 28px;
    }

    .tmg-level-dot-rail[b-s0zt1vwpxm] {
        flex-basis: 30px;
    }
}
/* Seven or more levels do not fit a phone's stepper beside the close button: the level line ("Level 3 of 8") carries it alone. */
@media (max-width: 575px) {
    .tmg-level-stepper:has(> :nth-child(13))[b-s0zt1vwpxm] {
        display: none;
    }
}
/* /Components/Pages/Training/Courses/Index.razor.rz.scp.css */
/* Course catalogue. Theme tokens only (light and dark), no transforms on card ancestors of the
   assign dialog, 44px touch targets, one column at phone widths. */

.tmg-cat-section[b-58zx7agwsp] { margin-bottom: 2rem; }

.tmg-cat-section-head[b-58zx7agwsp] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
}

.tmg-cat-h[b-58zx7agwsp] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 750;
    letter-spacing: -0.01em;
    color: var(--tmg-text);
}

.tmg-cat-count[b-58zx7agwsp] {
    font-size: 0.75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    background: var(--tmg-surface-3);
    border: 1px solid var(--tmg-border);
    color: var(--tmg-text-muted);
}

.tmg-cat-lede[b-58zx7agwsp] {
    margin: 0 0 0.9rem;
    max-width: 78ch;
    font-size: 0.925rem;
    color: var(--tmg-text-muted);
}

.tmg-cat-hint[b-58zx7agwsp] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.85rem 1rem;
    border: 1px dashed var(--tmg-border);
    border-radius: var(--tmg-radius-lg);
    background: var(--tmg-surface);
    color: var(--tmg-text-muted);
    font-size: 0.925rem;
}

.tmg-cat-hint i[b-58zx7agwsp] { color: var(--tmg-brand); font-size: 1.1rem; line-height: 1.3; }

.tmg-cat-result[b-58zx7agwsp] { position: relative; padding-right: 3rem; }
.tmg-cat-result .btn-close[b-58zx7agwsp] { position: absolute; top: 0.85rem; right: 0.85rem; }

/* ---- Courses in use (team or own) ---- */
.tmg-cat-inuse[b-58zx7agwsp] {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius-lg);
    background: var(--tmg-surface);
    box-shadow: var(--tmg-shadow-sm);
    overflow: hidden;
}

.tmg-cat-inuse-row[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 1.25rem;
    padding: 0.8rem 1rem;
}

.tmg-cat-inuse-row + .tmg-cat-inuse-row[b-58zx7agwsp] { border-top: 1px solid var(--tmg-border); }

.tmg-cat-inuse-main[b-58zx7agwsp] {
    flex: 1 1 18rem;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}

.tmg-cat-inuse-title[b-58zx7agwsp] {
    font-weight: 650;
    font-size: 1rem;
    line-height: 1.3;
    color: var(--tmg-text);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.tmg-cat-inuse-title:hover[b-58zx7agwsp] { color: var(--tmg-brand); text-decoration: underline; }

.tmg-cat-inuse-meta[b-58zx7agwsp] { font-size: 0.825rem; color: var(--tmg-text-muted); max-width: 100%; }

.tmg-cat-clamp-1[b-58zx7agwsp] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tmg-cat-progress[b-58zx7agwsp] {
    flex: 0 1 13rem;
    min-width: 9rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.tmg-cat-progress-track[b-58zx7agwsp] {
    height: 8px;
    border-radius: 999px;
    background: var(--tmg-track);
    overflow: hidden;
}

.tmg-cat-progress-track span[b-58zx7agwsp] {
    display: block;
    height: 100%;
    min-width: 8px;
    border-radius: 999px;
    background: var(--tmg-brand-grad);
}

.tmg-cat-progress-track span.failed[b-58zx7agwsp] { background: var(--tmg-danger); }

.tmg-cat-progress-text[b-58zx7agwsp] { font-size: 0.8rem; font-weight: 600; color: var(--tmg-text-muted); }

.tmg-cat-inuse-actions[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

.tmg-cat-inuse-actions .btn[b-58zx7agwsp] { min-height: 44px; display: inline-flex; align-items: center; }

/* ---- Toolbar, chips ---- */
.tmg-cat-toolbar[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 1rem;
    margin-bottom: 0.75rem;
}

.tmg-cat-search[b-58zx7agwsp] { position: relative; flex: 1 1 260px; max-width: 460px; }

.tmg-cat-search i[b-58zx7agwsp] {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--tmg-text-muted);
    pointer-events: none;
}

.tmg-cat-search .form-control[b-58zx7agwsp] { padding-left: 36px; min-height: 44px; border-radius: 10px; }

.tmg-cat-sort[b-58zx7agwsp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0 auto;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--tmg-text-muted);
}

.tmg-cat-sort select[b-58zx7agwsp] { min-height: 44px; width: auto; border-radius: 10px; }

.tmg-cat-chips[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-bottom: 0.5rem;
}

.tmg-cat-chip[b-58zx7agwsp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 40px;
    padding: 0.3rem 0.8rem;
    border: 1px solid var(--tmg-border);
    border-radius: 999px;
    background: var(--tmg-surface);
    color: var(--tmg-text);
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
    transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.tmg-cat-chip:hover:not(:disabled)[b-58zx7agwsp] { border-color: var(--tmg-brand); color: var(--tmg-brand); }
.tmg-cat-chip:focus-visible[b-58zx7agwsp] { outline: 2px solid var(--tmg-brand); outline-offset: 2px; }

.tmg-cat-chip[aria-pressed="true"][b-58zx7agwsp] {
    background: var(--tmg-brand);
    border-color: var(--tmg-brand);
    color: var(--tmg-surface);
}

.tmg-cat-chip-count[b-58zx7agwsp] {
    font-size: 0.72rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    padding: 0.05rem 0.4rem;
    border-radius: 999px;
    background: var(--tmg-surface-3);
    color: var(--tmg-text-muted);
}

.tmg-cat-chip[aria-pressed="true"] .tmg-cat-chip-count[b-58zx7agwsp] {
    background: rgb(255 255 255 / 0.22);
    color: inherit;
}

.tmg-cat-status[b-58zx7agwsp] { margin: 0 0 0.75rem; }

/* ---- Card grid ---- */
.tmg-cat-grid[b-58zx7agwsp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr));
    gap: 1rem;
    align-items: start;
}

.tmg-cat-card[b-58zx7agwsp] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    min-width: 0;
    padding: 1rem 1.1rem 0.9rem;
    background: var(--tmg-surface);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius-lg);
    box-shadow: var(--tmg-shadow-sm);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.tmg-cat-card:hover[b-58zx7agwsp] { box-shadow: var(--tmg-shadow-card); border-color: var(--tmg-brand-200); }

.tmg-cat-card.is-selected[b-58zx7agwsp] {
    border-color: var(--tmg-brand);
    box-shadow: 0 0 0 2px var(--tmg-brand-200), var(--tmg-shadow-card);
}

.tmg-cat-card-top[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.6rem;
    min-height: 28px;
}

.tmg-cat-tag[b-58zx7agwsp] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--tmg-text-muted);
}

.tmg-cat-tag i[b-58zx7agwsp] {
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 7px;
    font-size: 0.78rem;
    color: var(--ind-accent, var(--tmg-brand));
    background: color-mix(in srgb, var(--ind-accent, var(--tmg-brand)) 14%, transparent);
}

.tmg-cat-recommended[b-58zx7agwsp] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    background: var(--tmg-tint-warn-bg);
    border: 1px solid var(--tmg-tint-warn-border);
    color: var(--tmg-warn-strong);
}

.tmg-cat-recommended i[b-58zx7agwsp] { font-size: 0.62rem; }

.tmg-cat-select[b-58zx7agwsp] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin: -0.5rem -0.4rem -0.5rem auto;
    min-height: 44px;
    padding: 0 0.4rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--tmg-text-muted);
    cursor: pointer;
    border-radius: 8px;
}

.tmg-cat-select:hover[b-58zx7agwsp] { color: var(--tmg-brand); }
.tmg-cat-select input[b-58zx7agwsp] { width: 1.15rem; height: 1.15rem; margin: 0; cursor: pointer; }

.tmg-cat-title[b-58zx7agwsp] { margin: 0; font-size: 1.05rem; line-height: 1.3; }

.tmg-cat-title a[b-58zx7agwsp] {
    color: var(--tmg-text);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.tmg-cat-title a:hover[b-58zx7agwsp] { color: var(--tmg-brand); text-decoration: underline; }
.tmg-cat-title a:focus-visible[b-58zx7agwsp] { outline: 2px solid var(--tmg-brand); outline-offset: 2px; border-radius: 4px; }

/* Full descriptions remain available on the linked course page. */
.course-summary[b-58zx7agwsp] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    font-size: 0.9rem;
    line-height: 1.45;
    color: var(--tmg-text-muted);
}

.tmg-cat-badges[b-58zx7agwsp] { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmg-cat-badges .badge[b-58zx7agwsp] { font-weight: 600; }

.tmg-cat-inside[b-58zx7agwsp] {
    border-top: 1px solid var(--tmg-border);
    padding-top: 0.15rem;
}

.tmg-cat-inside > summary[b-58zx7agwsp] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 44px;
    cursor: pointer;
    list-style: none;
    font-size: 0.875rem;
    font-weight: 650;
    color: var(--tmg-brand);
    border-radius: 8px;
}

.tmg-cat-inside > summary[b-58zx7agwsp]::-webkit-details-marker { display: none; }

.tmg-cat-inside > summary[b-58zx7agwsp]::before {
    content: "\203A";
    display: inline-block;
    width: 0.8rem;
    text-align: center;
    font-size: 1.1rem;
    line-height: 1;
    transition: transform 0.15s ease;
}

.tmg-cat-inside[open] > summary[b-58zx7agwsp]::before { transform: rotate(90deg); }
.tmg-cat-inside > summary:focus-visible[b-58zx7agwsp] { outline: 2px solid var(--tmg-brand); outline-offset: 2px; }

.tmg-cat-levels[b-58zx7agwsp] {
    list-style: none;
    counter-reset: level;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.6rem;
}

.tmg-cat-levels > li[b-58zx7agwsp] {
    counter-increment: level;
    position: relative;
    padding-left: 2.1rem;
}

.tmg-cat-levels > li[b-58zx7agwsp]::before {
    content: counter(level);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5rem;
    height: 1.5rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--tmg-brand-100);
    color: var(--tmg-brand);
    font-size: 0.75rem;
    font-weight: 800;
}

.tmg-cat-level-head[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem 0.5rem;
}

.tmg-cat-level-name[b-58zx7agwsp] { font-size: 0.9rem; font-weight: 650; color: var(--tmg-text); overflow-wrap: anywhere; }

.tmg-cat-level-task[b-58zx7agwsp] { margin-top: 0.1rem; font-size: 0.85rem; line-height: 1.45; color: var(--tmg-text-muted); }

.tmg-cat-inside-note[b-58zx7agwsp] {
    margin: 0.75rem 0 0.25rem;
    padding: 0.5rem 0.7rem;
    border-radius: 8px;
    background: var(--tmg-surface-2);
    font-size: 0.8rem;
    color: var(--tmg-text-muted);
}

.tmg-cat-actions[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.5rem;
    margin-top: auto;
}

.tmg-cat-actions .btn[b-58zx7agwsp] {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}

.tmg-cat-actions .btn-link[b-58zx7agwsp] { padding-inline: 0.5rem; font-weight: 600; text-decoration: none; }
.tmg-cat-actions .btn-link:hover[b-58zx7agwsp] { text-decoration: underline; }

/* ---- Multi-select bar ---- */
.tmg-cat-selection[b-58zx7agwsp] {
    position: sticky;
    bottom: 1rem;
    z-index: 20;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    max-width: 640px;
    margin: 1.25rem auto 0;
    padding: 0.6rem 0.75rem 0.6rem 1.1rem;
    border: 1px solid var(--tmg-brand-200);
    border-radius: 16px;
    background: var(--tmg-surface);
    box-shadow: var(--tmg-shadow-modal);
}

.tmg-cat-selection-text[b-58zx7agwsp] { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.95rem; }
.tmg-cat-selection-text i[b-58zx7agwsp] { color: var(--tmg-brand); font-size: 1.1rem; }
.tmg-cat-selection-actions[b-58zx7agwsp] { display: flex; align-items: center; gap: 0.25rem; margin-left: auto; }
.tmg-cat-selection-actions .btn[b-58zx7agwsp] { min-height: 44px; }

/* ---- Platform admin block ---- */
.tmg-cat-admin[b-58zx7agwsp] { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--tmg-border); }

.tmg-cat-admin-tools[b-58zx7agwsp] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.9rem;
}

.tmg-cat-admin-tools .btn[b-58zx7agwsp] { min-height: 44px; }

/* ---- Loading skeleton ---- */
.tmg-cat-skel[b-58zx7agwsp] { min-height: 190px; gap: 0.8rem; }

.tmg-cat-skel-line[b-58zx7agwsp] {
    display: block;
    height: 10px;
    border-radius: 6px;
    background: var(--tmg-surface-3);
}

.tmg-cat-skel-line.tall[b-58zx7agwsp] { height: 18px; }

@media (prefers-reduced-motion: no-preference) {
    .tmg-cat-skel[b-58zx7agwsp] { animation: tmg-cat-pulse-b-58zx7agwsp 1.6s ease-in-out infinite; }
    @keyframes tmg-cat-pulse-b-58zx7agwsp { 50% { opacity: 0.55; } }
}

@media (prefers-reduced-motion: reduce) {
    .tmg-cat-card[b-58zx7agwsp], .tmg-cat-chip[b-58zx7agwsp], .tmg-cat-inside > summary[b-58zx7agwsp]::before { transition: none; }
}

@media (max-width: 575px) {
    .course-summary[b-58zx7agwsp] { -webkit-line-clamp: 3; line-clamp: 3; }
    .tmg-cat-sort[b-58zx7agwsp] { margin-left: 0; width: 100%; }
    .tmg-cat-sort select[b-58zx7agwsp] { flex: 1 1 auto; }
    .tmg-cat-search[b-58zx7agwsp] { max-width: none; }
    .tmg-cat-chip[b-58zx7agwsp] { min-height: 44px; }
    .tmg-cat-inuse-actions[b-58zx7agwsp] { margin-left: 0; width: 100%; }
    .tmg-cat-progress[b-58zx7agwsp] { flex: 1 1 100%; }
    .tmg-cat-selection[b-58zx7agwsp] { bottom: 0.5rem; padding: 0.6rem 0.75rem; }
    .tmg-cat-selection-actions[b-58zx7agwsp] { width: 100%; justify-content: flex-end; }
}

.tmg-cat-select .form-check-input:checked[b-58zx7agwsp] {
    background-color: var(--tmg-brand);
    border-color: var(--tmg-brand);
}

/* "What's inside" and "View course" share one row; the details body opens beneath both. */
.tmg-cat-more[b-58zx7agwsp] { position: relative; border-top: 1px solid var(--tmg-border); }
.tmg-cat-more .tmg-cat-inside[b-58zx7agwsp] { border-top: 0; }
.tmg-cat-more .tmg-cat-inside > summary[b-58zx7agwsp] { width: fit-content; padding-right: 0.5rem; }

.tmg-cat-more > .course-open-action[b-58zx7agwsp] {
    position: absolute;
    top: 0.15rem;
    right: -0.5rem;
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    padding-inline: 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}

.tmg-cat-more > .course-open-action:hover[b-58zx7agwsp] { text-decoration: underline; }

/* Phones: one swipeable row of industry chips instead of six stacked rows. */
@media (max-width: 575px) {
    .tmg-cat-chips[b-58zx7agwsp] {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-inline: -0.25rem;
        padding: 0.25rem 0.25rem 0.5rem;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }
    .tmg-cat-chip[b-58zx7agwsp] { flex: none; }
}
/* /Components/Pages/Training/Courses/LibraryPanel.razor.rz.scp.css */
.tmg-library-panel[b-mw0rq6yhul] {
    margin-bottom: 1.25rem;
    border-color: var(--tmg-border);
    background: var(--tmg-surface);
}

.tmg-library-head[b-mw0rq6yhul] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.tmg-library-vertical[b-mw0rq6yhul] {
    margin-top: .75rem;
    border: 1px solid var(--tmg-border);
    border-radius: 10px;
    background: var(--tmg-surface-2, transparent);
}

.tmg-library-vertical > summary[b-mw0rq6yhul] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: .25rem .75rem;
    padding: .65rem .9rem;
    cursor: pointer;
    list-style: none;
    font-weight: 600;
}

.tmg-library-vertical > summary[b-mw0rq6yhul]::-webkit-details-marker { display: none; }

.tmg-library-vertical > summary[b-mw0rq6yhul]::before {
    content: "\203A";
    display: inline-block;
    margin-right: .4rem;
    transition: transform .15s ease;
}

.tmg-library-vertical[open] > summary[b-mw0rq6yhul]::before { transform: rotate(90deg); }

.tmg-library-vertical > summary:focus-visible[b-mw0rq6yhul] {
    outline: 2px solid var(--tmg-brand);
    outline-offset: 2px;
    border-radius: 10px;
}

.tmg-library-vertical-name[b-mw0rq6yhul] { flex: 1 1 auto; }

.tmg-library-vertical-meta[b-mw0rq6yhul] {
    font-weight: 400;
    font-size: .85rem;
    color: var(--tmg-text-muted);
}

.tmg-library-vertical-actions[b-mw0rq6yhul] { padding: 0 .9rem .5rem; }

.tmg-library-courses[b-mw0rq6yhul] {
    list-style: none;
    margin: 0;
    padding: 0 .9rem .75rem;
}

.tmg-library-course[b-mw0rq6yhul] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem 1rem;
    padding: .65rem 0;
    border-top: 1px solid var(--tmg-border);
}

.tmg-library-course-text[b-mw0rq6yhul] { flex: 1 1 22rem; min-width: 0; }

.tmg-library-course-name[b-mw0rq6yhul] { font-weight: 600; }

.tmg-library-course-desc[b-mw0rq6yhul] {
    font-size: .85rem;
    color: var(--tmg-text-muted);
}

.tmg-library-course-status[b-mw0rq6yhul] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
}

@media (prefers-reduced-motion: reduce) {
    .tmg-library-vertical > summary[b-mw0rq6yhul]::before { transition: none; }
}
/* /Components/Pages/Training/Edit.razor.rz.scp.css */
/* Training scenario editor — difficulty radio polish, prompt textarea, rail. */
[b-gtll4ghklf] form {
    max-width: none;
}

[b-gtll4ghklf] .form-check-inline {
    margin-right: 1.25rem;
    padding: 0.4rem 0.9rem 0.4rem 2rem;
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: 999px;
    cursor: pointer;
    transition: background .12s ease, border-color .12s ease;
}

[b-gtll4ghklf] .form-check-inline:hover {
    background: var(--tmg-surface, #fff);
    border-color: var(--tmg-text-muted);
}

[b-gtll4ghklf] .form-check-inline .form-check-input {
    margin-left: -1.5rem;
}

[b-gtll4ghklf] .form-check-inline .form-check-input:checked {
    background-color: var(--tmg-brand);
    border-color: var(--tmg-brand);
}

[b-gtll4ghklf] .form-check-inline .form-check-label {
    font-weight: 500;
    color: var(--tmg-text);
}

[b-gtll4ghklf] textarea.form-control {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.875rem;
    line-height: 1.5;
}

[b-gtll4ghklf] .form-text {
    color: var(--tmg-text-muted);
    margin-top: 0.35rem;
}

[b-gtll4ghklf] .form-text code {
    font-size: 0.78rem;
    color: var(--tmg-text-muted);
    background: var(--tmg-bg);
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
}

[b-gtll4ghklf] .tmg-form-rail {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 1rem;
}
/* /Components/Pages/Training/Index.razor.rz.scp.css */
/* Training index — scenario card polish, sessions list. */
[b-fl3rydz24c] .tmg-scenario-card {
    transition: box-shadow .15s ease, transform .15s ease;
}

[b-fl3rydz24c] .tmg-scenario-card:hover {
    box-shadow: var(--tmg-shadow-md);
    transform: translateY(-1px);
}

[b-fl3rydz24c] .tmg-scenario-card .card-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--tmg-text);
}

[b-fl3rydz24c] .tmg-scenario-card .card-text {
    color: var(--tmg-text-muted);
    line-height: 1.45;
    min-height: 3em;
}

[b-fl3rydz24c] .tmg-scenario-card .btn-sm {
    padding: 0.3rem 0.75rem;
    font-size: 0.85rem;
}

[b-fl3rydz24c] .tmg-scenario-card .text-warning {
    color: var(--tmg-warn-strong, #B45309) !important;
}

[b-fl3rydz24c] .transcript {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 0.75rem;
}

[b-fl3rydz24c] .tmg-list {
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    overflow: hidden;
    background: var(--tmg-surface);
}

[b-fl3rydz24c] .tmg-list .tmg-list-item {
    cursor: pointer;
    padding: 12px 14px;
    border-bottom: 1px solid var(--tmg-border);
    transition: background-color .12s ease;
}

[b-fl3rydz24c] .tmg-list .tmg-list-item:last-child {
    border-bottom: none;
}

[b-fl3rydz24c] .tmg-list .tmg-list-item:hover {
    background: rgba(15, 118, 110, 0.03);
}

[b-fl3rydz24c] .tmg-list .tmg-list-trailing {
    color: var(--tmg-text-muted);
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

[b-fl3rydz24c] .tmg-scenario-voice {
    min-height: 1.4em;
}

/* Scenario grid: as many >=260px columns as fit, so narrow content never squeezes
   three columns (min() keeps a single column inside very small viewports). */
.tmg-scenario-grid[b-fl3rydz24c] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
    gap: 1rem;
}

.tmg-scenario-cell[b-fl3rydz24c] {
    min-width: 0;
}

/* Full fictional brief stays one native disclosure away (no JS, CSP-safe). */
.tmg-scenario-brief[b-fl3rydz24c] {
    margin: 0 0 .75rem;
}

.tmg-scenario-brief > summary[b-fl3rydz24c] {
    cursor: pointer;
    color: var(--tmg-brand);
    font-weight: 600;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: .35rem;
    list-style: none;
}

/* display:flex drops the native disclosure marker, so draw a chevron that turns when open. */
.tmg-scenario-brief > summary[b-fl3rydz24c]::-webkit-details-marker {
    display: none;
}

.tmg-scenario-brief > summary[b-fl3rydz24c]::before {
    content: '\f285'; /* bi-chevron-right */
    font-family: 'bootstrap-icons';
    font-size: .8em;
    line-height: 1;
    transition: transform .2s ease;
}

.tmg-scenario-brief[open] > summary[b-fl3rydz24c]::before {
    transform: rotate(90deg);
}

@media (prefers-reduced-motion: reduce) {
    .tmg-scenario-brief > summary[b-fl3rydz24c]::before {
        transition: none;
    }
}

.tmg-scenario-brief > summary:focus-visible[b-fl3rydz24c] {
    outline: 2px solid var(--tmg-brand);
    outline-offset: 2px;
    border-radius: 4px;
}

.tmg-scenario-brief-body[b-fl3rydz24c] {
    white-space: pre-line;
    overflow-wrap: anywhere;
    color: var(--tmg-text-muted);
    line-height: 1.45;
    padding: .5rem .65rem;
    border-left: 3px solid var(--tmg-border);
    background: var(--tmg-bg);
    border-radius: 0 var(--tmg-radius) var(--tmg-radius) 0;
}
/* /Components/Pages/Training/Progress.razor.rz.scp.css */
.tmg-progress-identity[b-youh1x62sy] {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
}
/* /Components/Pages/Training/Run.razor.rz.scp.css */
/* Training run — constrain form width, polish helpers. */
.tmg-form-narrow[b-7e203xe0b5] {
    max-width: 520px;
}

[b-7e203xe0b5] form {
    max-width: 520px;
}

[b-7e203xe0b5] .form-text {
    color: var(--tmg-text-muted);
    margin-top: 0.35rem;
}

[b-7e203xe0b5] .form-text code {
    font-size: 0.78rem;
    background: var(--tmg-bg);
    color: var(--tmg-text-muted);
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
}

[b-7e203xe0b5] .btn-primary {
    padding: 0.5rem 1.25rem;
}

/* "Read the brief": the header carries only the task line; the factsheet is one tap away. */
.tmg-run-brief[b-7e203xe0b5] {
    max-width: 720px;
    margin: 0 0 1rem;
}

.tmg-run-brief > summary[b-7e203xe0b5] {
    cursor: pointer;
    color: var(--tmg-brand);
    font-weight: 600;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: .35rem;
    list-style: none;
}

/* display:flex drops the native disclosure marker, so draw a chevron that turns when open. */
.tmg-run-brief > summary[b-7e203xe0b5]::-webkit-details-marker {
    display: none;
}

.tmg-run-brief > summary[b-7e203xe0b5]::before {
    content: '\f285'; /* bi-chevron-right */
    font-family: 'bootstrap-icons';
    font-size: .8em;
    line-height: 1;
    transition: transform .2s ease;
}

.tmg-run-brief[open] > summary[b-7e203xe0b5]::before {
    transform: rotate(90deg);
}

.tmg-run-brief > summary:focus-visible[b-7e203xe0b5] {
    outline: 2px solid var(--tmg-brand);
    outline-offset: 2px;
    border-radius: 4px;
}

.tmg-run-brief-body[b-7e203xe0b5] {
    white-space: pre-line;
    overflow-wrap: anywhere;
    color: var(--tmg-text-muted);
    line-height: 1.45;
    padding: .5rem .65rem;
    border-left: 3px solid var(--tmg-border);
    background: var(--tmg-bg);
    border-radius: 0 var(--tmg-radius) var(--tmg-radius) 0;
}

@media (prefers-reduced-motion: reduce) {
    .tmg-run-brief > summary[b-7e203xe0b5]::before {
        transition: none;
    }
}
/* /Components/Pages/Training/Session.razor.rz.scp.css */
/* Training session detail — transcript bubbles, recording player, pitch context. */
[b-9hmn0iwvo1] .tmg-metric-ungraded {
    font-size: 1.05rem;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
    background: none;
    color: var(--tmg-brand);
    -webkit-text-fill-color: var(--tmg-brand);
}

[b-9hmn0iwvo1] .transcript {
    background: var(--tmg-bg);
    border: 1px solid var(--tmg-border);
    border-radius: var(--tmg-radius);
    padding: 1rem;
}

[b-9hmn0iwvo1] .transcript > div {
    margin-bottom: 0.5rem;
}

/* Trainee bubble: softer brand tint, not the full saturated brand wall. */
[b-9hmn0iwvo1] .transcript .bg-primary {
    background-color: rgba(15, 118, 110, 0.12) !important;
    color: var(--tmg-text) !important;
    border: 1px solid rgba(15, 118, 110, 0.30);
}

[b-9hmn0iwvo1] .transcript .bg-primary.text-white {
    color: var(--tmg-text) !important;
}

[b-9hmn0iwvo1] .transcript .bg-light {
    background-color: var(--tmg-surface, #fff) !important;
    border: 1px solid var(--tmg-border);
}

[b-9hmn0iwvo1] .tmg-metric-when {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--tmg-text);
    font-variant-numeric: tabular-nums;
}

[b-9hmn0iwvo1] .tmg-metric-when .text-muted {
    font-size: 0.78rem;
    font-weight: 500;
    margin-left: 4px;
}

[b-9hmn0iwvo1] audio {
    width: 100%;
    max-width: 480px;
}

[b-9hmn0iwvo1] section h2.h5 {
    color: var(--tmg-text);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

[b-9hmn0iwvo1] .tmg-ai-overall {
    background: var(--tmg-brand);
    color: #fff;
    border-radius: var(--tmg-radius);
    padding: 0.6rem 1rem;
    min-width: 110px;
    text-align: center;
    line-height: 1;
}

[b-9hmn0iwvo1] .tmg-ai-overall-num {
    font-size: 2.2rem;
    font-weight: 700;
}

[b-9hmn0iwvo1] .tmg-ai-overall-ungraded {
    font-size: 1.05rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

[b-9hmn0iwvo1] .tmg-ai-review-heading > div:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

.page-header > div:first-child[b-9hmn0iwvo1] {
    min-width: 0;
}

.page-header h1[b-9hmn0iwvo1],
.page-header-subtitle[b-9hmn0iwvo1] {
    overflow-wrap: anywhere;
}

.tmg-review-header[b-9hmn0iwvo1],
.tmg-review-actions[b-9hmn0iwvo1] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tmg-review-header[b-9hmn0iwvo1] {
    justify-content: space-between;
}

.tmg-review-actions[b-9hmn0iwvo1] {
    min-width: 0;
}

.tmg-review-actions .btn[b-9hmn0iwvo1] {
    white-space: normal;
    overflow-wrap: anywhere;
    max-width: 100%;
}

@media (max-width: 575.98px) {
    .tmg-review-actions .btn[b-9hmn0iwvo1] {
        min-height: 44px;
        min-width: 44px;
        padding: 0.5rem 0.75rem;
    }
}

[b-9hmn0iwvo1] .tmg-ai-overall-denom {
    font-size: 0.85rem;
    opacity: 0.85;
    margin-left: 0.25rem;
}

[b-9hmn0iwvo1] .page-header-subtitle code {
    font-size: 0.85rem;
    background: var(--tmg-bg);
    color: var(--tmg-text-muted);
    padding: 0.1rem 0.4rem;
    border-radius: 3px;
}
/* /Components/Pages/Voices/Create.razor.rz.scp.css */
/* Voices create — file-input affordance, consent checkbox emphasis, form max-width. */
[b-dz9p3wob8w] form {
    max-width: 760px;
}

[b-dz9p3wob8w] input[type="file"] {
    display: block;
    width: 100%;
    padding: 0.5rem 0.75rem;
    margin-top: 0.25rem;
    border: 1px dashed var(--tmg-border);
    border-radius: var(--tmg-radius);
    background: var(--tmg-surface-2, #FAFBFC);
    color: var(--tmg-text);
    font-size: 0.9rem;
    cursor: pointer;
    transition: border-color .12s ease, background .12s ease;
}

[b-dz9p3wob8w] input[type="file"]:hover {
    border-color: var(--tmg-brand);
    background: var(--tmg-brand-50, #F4FBFA);
}

[b-dz9p3wob8w] input[type="file"]::file-selector-button {
    margin-right: 0.75rem;
    padding: 0.25rem 0.75rem;
    border: 1px solid var(--tmg-border);
    border-radius: 4px;
    background: var(--tmg-surface, #fff);
    color: var(--tmg-text);
    font-size: 0.85rem;
    cursor: pointer;
}

[b-dz9p3wob8w] input[type="file"]::file-selector-button:hover {
    background: var(--tmg-bg);
}

[b-dz9p3wob8w] .form-check {
    padding: 0.75rem 0.75rem 0.75rem 2.25rem;
    background: var(--tmg-tint-warn-bg, #FFFBEB);
    border: 1px solid var(--tmg-tint-warn-border, #FEF3C7);
    border-radius: var(--tmg-radius);
    margin-bottom: 1rem;
}

[b-dz9p3wob8w] .form-check .form-check-input {
    margin-top: 0.2rem;
}

[b-dz9p3wob8w] .form-check .form-check-label {
    color: var(--tmg-text);
    font-size: 0.9rem;
}

[b-dz9p3wob8w] .form-text {
    color: var(--tmg-text-muted);
    margin-top: 0.35rem;
}
/* /Components/Pages/Voices/Import.razor.rz.scp.css */
/* Voices import — table polish, tighter rows, badge style. */
[b-1nig0481ry] table {
    table-layout: auto;
}

[b-1nig0481ry] table th {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--tmg-text-muted);
    background: var(--tmg-bg);
    border-bottom: 1px solid var(--tmg-border);
}

[b-1nig0481ry] table tbody tr {
    border-bottom: 1px solid var(--tmg-border);
}

[b-1nig0481ry] table tbody tr td {
    vertical-align: middle;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

[b-1nig0481ry] table tbody tr td:first-child {
    max-width: 28rem;
    word-break: break-all;
    font-size: 0.875rem;
}

[b-1nig0481ry] table tbody td code {
    font-size: 0.8rem;
    color: var(--tmg-text-muted);
    background: transparent;
    padding: 0;
    white-space: nowrap;
}

[b-1nig0481ry] td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-1nig0481ry] .badge.bg-secondary {
    background: rgba(100, 116, 139, 0.15) !important;
    color: var(--tmg-text-muted) !important;
    font-weight: 500;
    padding: 0.35em 0.65em;
}
/* /Components/Pages/Voices/Index.razor.rz.scp.css */
/* Voices list polish — tighten row layout, soften delete weight, monospaced voice id. */
[b-ejl9af3a9e] table.tmg-table tbody tr td {
    vertical-align: middle;
}

[b-ejl9af3a9e] table.tmg-table td code {
    font-size: 0.85rem;
    color: var(--tmg-text-muted);
    background: transparent;
    padding: 0;
    white-space: nowrap;
}

[b-ejl9af3a9e] table.tmg-table td:last-child {
    text-align: right;
    white-space: nowrap;
}

[b-ejl9af3a9e] table.tmg-table td:last-child .btn + .btn {
    margin-left: 0.375rem;
}

[b-ejl9af3a9e] .btn-outline-danger {
    border-color: var(--tmg-border);
    color: var(--tmg-danger);
}

[b-ejl9af3a9e] .btn-outline-danger:hover {
    background-color: var(--tmg-danger);
    border-color: var(--tmg-danger);
    color: #fff;
}

[b-ejl9af3a9e] audio {
    width: 100%;
    max-width: 480px;
    margin: 0.25rem 0;
}
/* /Components/Pages/Welcome.razor.rz.scp.css */
/* Welcome intro: the 4-step "How to get going" list (hero/wizard base styles live in
   app.css under "Welcome wizard"). Numbered with a CSS counter; left-aligned inside the
   centred hero; wraps cleanly down to 320px. */
.tmg-welcome-steps-title[b-d9u8hfbz0m] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--tmg-text-muted, #5b6470);
    margin: 0 0 12px;
}

.tmg-welcome-steps[b-d9u8hfbz0m] {
    list-style: none;
    counter-reset: tmg-welcome-step;
    padding: 0;
    margin: 0 auto 18px;
    max-width: 520px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    text-align: left;
}

.tmg-welcome-steps li[b-d9u8hfbz0m] {
    counter-increment: tmg-welcome-step;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 14px 12px 50px;
    min-width: 0;
    background: var(--tmg-surface, #fff);
    border: 1px solid var(--tmg-border, #e5e7eb);
    border-radius: var(--tmg-radius-lg, 14px);
}

.tmg-welcome-steps li[b-d9u8hfbz0m]::before {
    content: counter(tmg-welcome-step);
    position: absolute;
    left: 14px;
    top: 12px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--tmg-brand, #0F766E);
    background: var(--tmg-brand-100, #CCFBF1);
}

.tmg-welcome-steps strong[b-d9u8hfbz0m] {
    font-weight: 600;
    color: var(--tmg-text, #111827);
    overflow-wrap: anywhere;
}

.tmg-welcome-steps span[b-d9u8hfbz0m] {
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #5b6470);
    overflow-wrap: anywhere;
}

.tmg-welcome-hero-note[b-d9u8hfbz0m] {
    font-size: 0.875rem;
    color: var(--tmg-text-muted, #5b6470);
    margin: 0 auto 22px;
}

@media (max-width: 575.98px) {
    .tmg-welcome-steps[b-d9u8hfbz0m] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Components/Shared/AssistantIntro.razor.rz.scp.css */
.assistant-intro[b-orurpl7alb] { text-align:left; margin:24px 0; padding:24px; border:1px solid var(--tmg-border); border-radius:18px; background:var(--tmg-surface); color:var(--tmg-text); }
.assistant-intro-heading[b-orurpl7alb] { display:flex; align-items:flex-start; gap:14px; }
.assistant-intro-heading>i[b-orurpl7alb] { color:var(--tmg-brand); font-size:1.6rem; }
.assistant-intro-kicker[b-orurpl7alb] { color:var(--tmg-brand); font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.assistant-intro h2[b-orurpl7alb] { font-size:1.3rem; margin:5px 0 9px; letter-spacing:-.025em; }
.assistant-intro p[b-orurpl7alb],.assistant-intro li[b-orurpl7alb] { font-size:.86rem; line-height:1.7; }
.assistant-intro-heading p[b-orurpl7alb] { color:var(--tmg-text-muted); margin:0; }
.assistant-intro ul[b-orurpl7alb] { padding-left:20px; margin:18px 0; }
.assistant-intro li[b-orurpl7alb] { margin-bottom:10px; }
.assistant-intro-policy[b-orurpl7alb] { border-top:1px solid var(--tmg-border); padding-top:16px; color:var(--tmg-text-muted); font-size:.77rem!important; }
.assistant-intro a[b-orurpl7alb] { min-height:44px; display:inline-flex; align-items:center; gap:12px; }
.assistant-intro a:focus-visible[b-orurpl7alb] { outline:3px solid var(--tmg-brand); outline-offset:3px; }
@media(max-width:576px) { .assistant-intro[b-orurpl7alb] { padding:18px; } .assistant-intro-heading[b-orurpl7alb] { gap:10px; } .assistant-intro h2[b-orurpl7alb] { font-size:1.15rem; } }
/* /Components/Shared/AvailableBalancePill.razor.rz.scp.css */
/* Neutral "Add credit" state for an exactly-zero balance (a new workspace is not an
   error). Like the other balance pills it uses a solid dark fill with light text, so it
   reads on the dark sidebar and on light/dark page surfaces alike; the brand-teal outline
   marks it as an action rather than a warning. Base shape comes from .tmg-balance-pill. */
.tmg-balance-zero[b-pl1j4w0uve] {
    gap: 0.35rem;
    background: rgba(30, 41, 59, 0.9);
    color: #e2e8f0;
    border-color: rgba(45, 212, 191, 0.6);
}

.tmg-balance-zero:hover[b-pl1j4w0uve],
.tmg-balance-zero:focus-visible[b-pl1j4w0uve] {
    color: #ffffff;
    border-color: rgba(45, 212, 191, 0.9);
}

.tmg-balance-zero .bi[b-pl1j4w0uve] {
    font-size: 0.85em;
    color: #5eead4;
}
/* /Components/Shared/BusinessDailyOperationsFeed.razor.rz.scp.css */
.observation-heading[b-hktvctc8vg] { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1rem; }
.observation-boundary[b-hktvctc8vg] { border-left: 3px solid var(--bs-secondary-color, #64748b); padding-left: .75rem; }
.observation-list[b-hktvctc8vg] { display: grid; gap: .75rem; }
.observation-day[b-hktvctc8vg] { border: 1px solid var(--bs-border-color, #cbd5e1); border-radius: .6rem; min-width: 0; }
.observation-summary[b-hktvctc8vg] { cursor: pointer; min-height: 48px; padding: .85rem 1rem; overflow-wrap: anywhere; }
.observation-summary[b-hktvctc8vg]::marker { color: var(--bs-secondary-color, #64748b); }
.observation-summary:focus-visible[b-hktvctc8vg] { outline: 2px solid var(--bs-primary, #0f766e); outline-offset: 3px; border-radius: .6rem; }
.observation-date[b-hktvctc8vg] { font-weight: 600; }
.observation-status[b-hktvctc8vg] { display: inline-block; margin-left: .75rem; font-size: .875rem; font-weight: 600; }
.observation-status[data-status="AttentionRequired"][b-hktvctc8vg], .observation-status[data-status="Blocked"][b-hktvctc8vg] { text-decoration: underline; text-underline-offset: .2em; }
.observation-content[b-hktvctc8vg] { padding: 0 1rem 1rem; overflow-wrap: anywhere; }
.observation-metrics[b-hktvctc8vg] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1.5rem; }
.observation-metric[b-hktvctc8vg] { border-top: 1px solid var(--bs-border-color, #cbd5e1); padding-top: .75rem; min-width: 0; }
.observation-metric dd[b-hktvctc8vg] { margin: .3rem 0 0; }
.observation-number[b-hktvctc8vg] { font-variant-numeric: tabular-nums; }
.observation-content h3[b-hktvctc8vg] { margin-top: 1.25rem; }
.observation-content ul[b-hktvctc8vg] { padding-left: 1.25rem; }
.observation-attention li[b-hktvctc8vg] { margin-bottom: .35rem; }
@media (max-width: 575.98px) {
    .observation-metrics[b-hktvctc8vg] { grid-template-columns: minmax(0, 1fr); }
    .observation-status[b-hktvctc8vg] { display: block; margin: .35rem 0 0 1rem; }
    .observation-summary[b-hktvctc8vg] { padding: .75rem; }
    .observation-content[b-hktvctc8vg] { padding: 0 .75rem .75rem; }
}
/* /Components/Shared/CallNavigatorModal.razor.rz.scp.css */
/* Wave 7B: CallNavigatorModal scoped polish.
   The app.css base already paints dialog/header/footer; this file
   refines the rhythm seen on screens 46-48:
   - Header: tighter title block, position chip pulled flush with title baseline.
   - Body: ensure metric tile grid breathes (gap on mobile).
   - Footer: kbd chip vertical-aligned with button text; disabled buttons
     get softer styling so the eye doesn't track them.
   - kbd chips inside header / footer share a single sizing rule. */

.tmg-modal-header[b-m1dlw487tb] {
    align-items: flex-start;
    padding-top: 20px;
    padding-bottom: 16px;
}

.tmg-modal-header > div:first-child[b-m1dlw487tb] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.tmg-modal-title[b-m1dlw487tb] {
    line-height: 1.2;
    letter-spacing: -0.01em;
}

/* Position indicator: muted text, not a pill — avoids being mistaken for
   a status badge at a glance. Note: do NOT use text-transform: uppercase
   here — e2e tests assert the literal text "X of Y" via innerText. */
.tmg-modal-position[b-m1dlw487tb] {
    margin-top: 0;
    align-self: flex-start;
    background: transparent;
    color: var(--tmg-text-muted);
    border: none;
    padding: 0;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    font-weight: 500;
}

.tmg-modal-header .btn-close[b-m1dlw487tb] {
    margin-top: 2px;
}

.tmg-modal-body[b-m1dlw487tb] {
    padding-top: 20px;
    padding-bottom: 20px;
}

.tmg-modal-footer[b-m1dlw487tb] {
    align-items: center;
    padding-top: 14px;
    padding-bottom: 14px;
    justify-content: space-between;
}

.tmg-modal-footer-actions[b-m1dlw487tb] {
    display: inline-flex;
    gap: 8px;
}

.tmg-modal-keyhint .tmg-kbd[b-m1dlw487tb] {
    margin: 0 2px;
}

.tmg-modal-footer .btn[b-m1dlw487tb] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
}

.tmg-modal-footer .btn:disabled[b-m1dlw487tb] {
    opacity: 0.55;
}

/* kbd chips rendered inside this component: smaller, baseline-aligned.
   These are literal <kbd> tags in CallNavigatorModal.razor so they get
   the scope attribute automatically. */
.tmg-kbd[b-m1dlw487tb] {
    font-size: 0.7rem;
    padding: 1px 6px;
    line-height: 1.3;
    vertical-align: baseline;
    background: rgba(15, 23, 42, 0.04);
}

.tmg-modal-footer .tmg-kbd[b-m1dlw487tb] {
    margin-left: 2px;
}
/* /Components/Shared/InsufficientBalanceNotice.razor.rz.scp.css */
.tmg-balance-notice[b-mjlzyug8df] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    max-width: 620px;
    padding: 1.25rem 1.4rem;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--tmg-brand, #0d8a6a) 25%, transparent);
    background:
        radial-gradient(120% 160% at 0% 0%, color-mix(in srgb, var(--tmg-brand, #0d8a6a) 8%, transparent), transparent 60%),
        var(--tmg-surface, #fff);
    box-shadow: 0 6px 24px rgba(13, 60, 48, 0.08);
}

.tmg-balance-notice-icon[b-mjlzyug8df] {
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    font-size: 1.35rem;
    color: var(--tmg-brand, #0d8a6a);
    background: color-mix(in srgb, var(--tmg-brand, #0d8a6a) 12%, transparent);
}

.tmg-balance-notice-title[b-mjlzyug8df] {
    font-weight: 700;
    font-size: 1.05rem;
    margin-bottom: 0.25rem;
}

.tmg-balance-notice-text[b-mjlzyug8df] {
    margin-bottom: 0.75rem;
    color: var(--tmg-text-muted, #5b6b66);
    font-size: 0.925rem;
}

.tmg-balance-notice-body[b-mjlzyug8df] {
    min-width: 0;
}

.tmg-balance-notice-cta[b-mjlzyug8df] {
    margin-right: 0.75rem;
}

.tmg-balance-notice-hint[b-mjlzyug8df] {
    font-size: 0.8rem;
    color: var(--tmg-text-muted, #5b6b66);
    overflow-wrap: anywhere;
}
/* /Components/Shared/NotificationBell.razor.rz.scp.css */
.tmg-notification-bell[b-51l6qut73c] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Same 32px tile as the theme toggle beside it, so the two read as a pair. */
.tmg-bell-btn[b-51l6qut73c] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    background: rgba(255, 255, 255, 0.06);
    border: 0;
    color: rgba(229, 231, 235, 0.85);
    padding: 0 8px;
    border-radius: 8px;
    cursor: pointer;
    line-height: 1;
    transition: background .15s ease, color .15s ease;
}

.tmg-bell-btn:hover:not(:disabled)[b-51l6qut73c],
.tmg-bell-btn:focus-visible[b-51l6qut73c] {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    outline: none;
}

.tmg-bell-btn i[b-51l6qut73c] {
    font-size: 1rem;
}

.tmg-bell-badge[b-51l6qut73c] {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    background: #10B981;
    color: #04231C;
    border-radius: 999px;
    font-size: 0.64rem;
    font-weight: 700;
    line-height: 17px;
    text-align: center;
    box-shadow: 0 0 0 2px #111C2E;
}

.tmg-bell-dropdown[b-51l6qut73c] {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: calc(100% + 6px);
    /* Bell lives in the left sidebar; opening "right: 0" would push the panel off the
       left edge of the viewport. Open into the content area instead. */
    left: 0;
    width: 360px;
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 100px);
    background: var(--tmg-surface, #fff);
    color: var(--tmg-text, #111827);
    border: 1px solid var(--tmg-border, #E5E7EB);
    border-radius: var(--tmg-radius-lg, 12px);
    box-shadow: var(--tmg-shadow-md, 0 4px 12px rgb(0 0 0 / .15));
    z-index: 1050;
    overflow: hidden;
}

@media (max-width: 640.98px) {
    .tmg-bell-dropdown[b-51l6qut73c] {
        /* The mobile bell is near the right edge; constrain the panel to the
           viewport rather than keeping its left edge anchored to the bell. */
        position: fixed;
        top: 72px;
        left: auto;
        right: 12px;
        max-height: calc(100dvh - 84px);
    }
}

.tmg-bell-head[b-51l6qut73c] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--tmg-border, #E5E7EB);
}

.tmg-bell-title[b-51l6qut73c] {
    font-weight: 600;
    font-size: 0.875rem;
}

.tmg-bell-mark-all[b-51l6qut73c] {
    background: transparent;
    border: 0;
    color: var(--tmg-brand, #0F766E);
    font-size: 0.75rem;
    cursor: pointer;
    padding: 0;
}

.tmg-bell-mark-all:hover[b-51l6qut73c] {
    text-decoration: underline;
}

.tmg-bell-empty[b-51l6qut73c] {
    padding: 16px 14px;
    color: var(--tmg-text-muted, #6B7280);
    font-size: 0.875rem;
    text-align: center;
}

.tmg-bell-list[b-51l6qut73c] {
    min-height: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 360px;
    overflow-y: auto;
}

.tmg-bell-row[b-51l6qut73c] {
    padding: 10px 14px;
    border-bottom: 1px solid var(--tmg-border, #E5E7EB);
    cursor: pointer;
    border-left: 3px solid transparent;
}

.tmg-bell-row:last-child[b-51l6qut73c] {
    border-bottom: 0;
}

.tmg-bell-row.unread[b-51l6qut73c] {
    border-left-color: var(--tmg-brand, #0F766E);
    background: rgba(15, 118, 110, 0.04);
}

.tmg-bell-row:hover[b-51l6qut73c] {
    background: rgba(15, 118, 110, 0.08);
}

.tmg-bell-row-title[b-51l6qut73c] {
    font-weight: 600;
    font-size: 0.85rem;
    line-height: 1.3;
    margin-bottom: 2px;
}

.tmg-bell-row-body[b-51l6qut73c] {
    font-size: 0.8rem;
    color: var(--tmg-text-muted, #6B7280);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
}

.tmg-bell-row-time[b-51l6qut73c] {
    font-size: 0.7rem;
    color: var(--tmg-text-muted, #6B7280);
}

.tmg-bell-foot[b-51l6qut73c] {
    flex-shrink: 0;
    padding: 8px 14px;
    border-top: 1px solid var(--tmg-border, #E5E7EB);
    text-align: center;
    background: rgba(15, 118, 110, 0.02);
}

.tmg-bell-foot a[b-51l6qut73c] {
    color: var(--tmg-brand, #0F766E);
    text-decoration: none;
    font-size: 0.78rem;
}

.tmg-bell-foot a:hover[b-51l6qut73c] {
    text-decoration: underline;
}
/* /Components/Shared/ProductShot.razor.rz.scp.css */
/* ProductShot presentation is owned by public-design.css inside .tmg-public-shell. */
/* /Components/Shared/StatusBadge.razor.rz.scp.css */
/* Wave 7B: StatusBadge scoped polish.
   Goals:
   - Visually distinguish NoAnswer from Skipped (both slate in app.css).
   - Add a small leading dot to common states so they read at a glance
     even at very small sizes (table rows, list meta).
   - Tighten vertical alignment so pills sit on the baseline cleanly. */

.badge.tmg-status[b-3zm9b3o028] {
    vertical-align: middle;
    border: 1px solid transparent;
    white-space: nowrap;
}

/* Leading dot for the most common states (pure CSS, no extra markup).
   The colour matches the text so the dot reads even on grayscale. */
.badge.tmg-status-pending[b-3zm9b3o028]::before,
.badge.tmg-status-queued[b-3zm9b3o028]::before,
.badge.tmg-status-done[b-3zm9b3o028]::before,
.badge.tmg-status-failed[b-3zm9b3o028]::before,
.badge.tmg-status-skipped[b-3zm9b3o028]::before,
.badge.tmg-status-noanswer[b-3zm9b3o028]::before,
.badge.tmg-status-optout[b-3zm9b3o028]::before,
.badge.tmg-status-info[b-3zm9b3o028]::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex: 0 0 6px;
}

/* Distinguish NoAnswer (hollow ring) from Skipped (solid dot) — both
   slate in app.css but functionally different. NoAnswer means "tried,
   nothing"; Skipped means "we chose not to try". */
.badge.tmg-status-noanswer[b-3zm9b3o028] {
    border-color: rgba(100, 116, 139, 0.35);
}

.badge.tmg-status-noanswer[b-3zm9b3o028]::before {
    background: transparent;
    box-shadow: inset 0 0 0 1.5px currentColor;
}

/* Failed gets a stronger ring — drives the eye in long lists. */
.badge.tmg-status-failed[b-3zm9b3o028] {
    border-color: rgba(239, 68, 68, 0.30);
}

/* Skipped: clearly muted (no border, dim dot). */
.badge.tmg-status-skipped[b-3zm9b3o028]::before {
    opacity: 0.6;
}
/* /Components/Shared/TmgAudioPlayer.razor.rz.scp.css */
.tmg-audio[b-xwe2qqzlgh] {
    display: flex;
    align-items: center;
    gap: 12px;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 560px;
    padding: 10px 14px;
    border-radius: 9999px;
    background: linear-gradient(135deg, #0F172A, #1E293B);
    border: 1px solid rgba(148, 163, 184, 0.25);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.25);
}

.tmg-audio-play[b-xwe2qqzlgh] {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 50%;
    background: linear-gradient(135deg, #10B981, #34D399);
    color: #022C22;
    font-size: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.45);
}

.tmg-audio-play:hover[b-xwe2qqzlgh] {
    transform: scale(1.07);
    box-shadow: 0 3px 12px rgba(16, 185, 129, 0.6);
}

.tmg-audio-play i[b-xwe2qqzlgh] {
    /* optical centring of the play glyph */
    transform: translateX(1px);
}

.tmg-audio-playing .tmg-audio-play i[b-xwe2qqzlgh] {
    transform: none;
}

.tmg-audio-playing .tmg-audio-play[b-xwe2qqzlgh] {
    animation: tmg-audio-pulse-b-xwe2qqzlgh 2s ease-in-out infinite;
}

@keyframes tmg-audio-pulse-b-xwe2qqzlgh {
    0%, 100% { box-shadow: 0 2px 8px rgba(16, 185, 129, 0.45); }
    50% { box-shadow: 0 2px 18px rgba(16, 185, 129, 0.8); }
}

.tmg-audio-time[b-xwe2qqzlgh] {
    flex-shrink: 0;
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
    color: rgba(226, 232, 240, 0.85);
    min-width: 38px;
    text-align: center;
}

.tmg-audio-seek[b-xwe2qqzlgh] {
    --tmg-audio-progress: 0%;
    flex: 1 1 auto;
    min-width: 0;
    width: 0;
    appearance: none;
    height: 44px;
    border-radius: 9999px;
    background:
        linear-gradient(90deg, #10B981 var(--tmg-audio-progress), rgba(148, 163, 184, 0.25) var(--tmg-audio-progress));
    background-size: 100% 6px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    outline: none;
}

/* The slider removes the default outline, so keyboard focus needs its own visible ring (the player is always dark). */
.tmg-audio-seek:focus-visible[b-xwe2qqzlgh] {
    outline: 2px solid #6EE7B7;
    outline-offset: 2px;
}

.tmg-audio-seek:focus-visible[b-xwe2qqzlgh]::-webkit-slider-thumb {
    box-shadow: 0 0 0 4px rgba(110, 231, 183, 0.55), 0 1px 4px rgba(0, 0, 0, 0.4);
}

.tmg-audio-seek:focus-visible[b-xwe2qqzlgh]::-moz-range-thumb {
    box-shadow: 0 0 0 4px rgba(110, 231, 183, 0.55), 0 1px 4px rgba(0, 0, 0, 0.4);
}

.tmg-audio-seek[b-xwe2qqzlgh]::-webkit-slider-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #10B981;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    transition: transform 0.1s ease;
}

.tmg-audio-seek[b-xwe2qqzlgh]::-webkit-slider-thumb:hover {
    transform: scale(1.2);
}

.tmg-audio-seek[b-xwe2qqzlgh]::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #10B981;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.tmg-audio-speed[b-xwe2qqzlgh] {
    flex-shrink: 0;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: transparent;
    color: rgba(226, 232, 240, 0.9);
    font-size: 0.72rem;
    font-weight: 700;
    border-radius: 9999px;
    padding: 4px 10px;
    cursor: pointer;
    min-width: 48px;
    min-height: 44px;
    transition: background 0.12s ease;
}

.tmg-audio-speed:hover[b-xwe2qqzlgh] {
    background: rgba(148, 163, 184, 0.15);
}

.tmg-audio-download[b-xwe2qqzlgh] {
    flex-shrink: 0;
    color: rgba(226, 232, 240, 0.75);
    font-size: 1rem;
    text-decoration: none;
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 4px;
    border-radius: 8px;
    transition: color 0.12s ease, background 0.12s ease;
}

.tmg-audio-download:hover[b-xwe2qqzlgh] {
    color: #fff;
    background: rgba(148, 163, 184, 0.15);
}

.tmg-audio audio[b-xwe2qqzlgh] {
    display: none;
}

@media (max-width: 575px) {
    .tmg-audio[b-xwe2qqzlgh] {
        display: grid;
        grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1fr) 48px;
        gap: 4px;
        padding: 8px;
        border-radius: 16px;
    }

    .tmg-audio-play[b-xwe2qqzlgh] { grid-area: 1 / 1; }
    .tmg-audio-current[b-xwe2qqzlgh] { grid-area: 1 / 2; }
    .tmg-audio-total[b-xwe2qqzlgh] { grid-area: 1 / 3; }
    .tmg-audio-speed[b-xwe2qqzlgh] { grid-area: 1 / 4; }
    .tmg-audio-seek[b-xwe2qqzlgh] { grid-area: 2 / 1 / 3 / 4; width: 100%; }
    .tmg-audio-download[b-xwe2qqzlgh] { grid-area: 2 / 4; }
    .tmg-audio-time[b-xwe2qqzlgh] { min-width: 0; }
}