@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';

/* /Components/AutoAuth.razor.rz.scp.css */
.autoauth-page[b-z61jae8bo8] {
    min-height: calc(100vh - 64px);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: #f8fbfd;
    box-sizing: border-box;
}

.autoauth-card[b-z61jae8bo8] {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border: 1px solid #e2ebf0;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    color: #0d2d3f;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.autoauth-logo[b-z61jae8bo8] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 4px;
}

.autoauth-logo__mark[b-z61jae8bo8] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #0d2d3f;
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.autoauth-logo__mark em[b-z61jae8bo8],
.autoauth-logo__word em[b-z61jae8bo8] {
    color: #4ac4ff;
    font-style: normal;
}

.autoauth-logo__word[b-z61jae8bo8] {
    font-weight: 800;
    font-size: 20px;
    letter-spacing: -0.02em;
}

.autoauth-spinner[b-z61jae8bo8] {
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    border: 2px solid rgba(74, 196, 255, 0.25);
    border-top-color: #4ac4ff;
    animation: autoauth-spin-b-z61jae8bo8 0.9s linear infinite;
}

.autoauth-title[b-z61jae8bo8] {
    margin: 0;
    font-weight: 700;
    font-size: 18px;
    letter-spacing: -0.01em;
}

.autoauth-title em[b-z61jae8bo8] {
    color: #4ac4ff;
    font-style: normal;
}

.autoauth-subtitle[b-z61jae8bo8] {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: #7a9bad;
    text-align: center;
}

@keyframes autoauth-spin-b-z61jae8bo8 {
    to {
        transform: rotate(360deg);
    }
}
/* /Components/CustomerComponents/AddRequestsComponent.razor.rz.scp.css */
.requests[b-7xjyepck9j] {
    border-radius: 12px;
    background: #FAFCFD;
    border: 1px solid #E2EBF0;
    overflow: hidden;
}

.requests-head[b-7xjyepck9j] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px 4px;
}

.requests-head .t1[b-7xjyepck9j] {
    font-size: 10px;
    font-weight: 700;
    color: #9BB8C5;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.requests-list[b-7xjyepck9j] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 4px 6px 8px;
}

.req-row[b-7xjyepck9j] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 6px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 150ms cubic-bezier(.2,.7,.2,1);
}

.req-row:hover[b-7xjyepck9j] {
    background: #fff;
}

.req-pill[b-7xjyepck9j] {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: #0D2D3F;
    color: #4AC4FF;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: transform 150ms cubic-bezier(.2,.7,.2,1), background 150ms cubic-bezier(.2,.7,.2,1);
}

.req-pill i[b-7xjyepck9j] {
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
}

.req-pill:hover[b-7xjyepck9j] {
    transform: translateY(-1px);
    background: #074260;
}

.req-pill:focus-visible[b-7xjyepck9j] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.req-text[b-7xjyepck9j] {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
    flex: 1 1 auto;
    cursor: pointer;
}

.req-text .l1[b-7xjyepck9j] {
    font-size: 14px;
    font-weight: 600;
    color: #0D2D3F;
}

.req-text .l2[b-7xjyepck9j] {
    font-size: 10px;
    color: #9BB8C5;
    font-weight: 700;
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.req-text:hover .l2[b-7xjyepck9j] {
    color: #4A6878;
}

.req-cta[b-7xjyepck9j] {
    margin-left: auto;
    color: #9BB8C5;
    transition: color 150ms cubic-bezier(.2,.7,.2,1), transform 150ms cubic-bezier(.2,.7,.2,1);
    display: grid;
    place-items: center;
}

.req-cta i[b-7xjyepck9j] {
    font-size: 14px;
    line-height: 1;
}

.req-row:hover .req-cta[b-7xjyepck9j] {
    color: #0D2D3F;
    transform: translateX(2px);
}

@media (prefers-reduced-motion: reduce) {
    .req-row[b-7xjyepck9j],
    .req-pill[b-7xjyepck9j],
    .req-cta[b-7xjyepck9j] {
        transition: none;
    }
    .req-pill:hover[b-7xjyepck9j],
    .req-row:hover .req-cta[b-7xjyepck9j] {
        transform: none;
    }
}
/* /Components/CustomerComponents/NavigationMenuComponent.razor.rz.scp.css */
.rail[b-auk7h8kf8r] {
    --brand-50: #E8F8FF;
    --brand-100: #C5EDFF;
    --brand-400: #4AC4FF;
    --brand-500: #1AA3E8;
    --brand-600: #0D80BB;
    --ink: #0D2D3F;
    --neutral-bg: #F8FBFD;
    --neutral-surface: #FAFCFD;
    --neutral-border: #EDF2F5;
    --neutral-border-strong: #DDE8EE;
    --neutral-card-border: #E2EBF0;
    --neutral-label: #4A6878;
    --neutral-placeholder: #9BB8C5;
    --neutral-pill-bg: #F2F5F7;
    --success: #22C55E;

    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    --rail-w: 248px;
    --rail-w-mini: 76px;

    --t-fast: 150ms;
    --t-base: 180ms;
    --t-slow: 220ms;
    --ease-out: cubic-bezier(.2, .7, .2, 1);

    --shadow-md: 0 2px 16px rgba(13, 45, 63, 0.07);
    --focus-brand: 0 0 0 3px rgba(74, 196, 255, 0.18);

    flex: 0 0 auto;
    width: var(--rail-w);
    height: 100vh;
    position: sticky;
    top: 0;
    background: #fff;
    border-right: 1px solid var(--neutral-border);
    display: flex;
    flex-direction: column;
    transition: width var(--t-base) var(--ease-out);
    z-index: 200;
    font-family: var(--font-sans);
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
}

.rail.is-mini[b-auk7h8kf8r] {
    width: var(--rail-w-mini);
}

.rail[b-auk7h8kf8r]  a,
.rail[b-auk7h8kf8r]  a:link,
.rail[b-auk7h8kf8r]  a:visited,
.rail[b-auk7h8kf8r]  a:hover,
.rail[b-auk7h8kf8r]  a:focus,
.rail[b-auk7h8kf8r]  a:active,
.rail[b-auk7h8kf8r]  .mud-nav-link,
.rail[b-auk7h8kf8r]  .mud-nav-link:link,
.rail[b-auk7h8kf8r]  .mud-nav-link:visited,
.rail[b-auk7h8kf8r]  .mud-nav-link:hover,
.rail[b-auk7h8kf8r]  .mud-nav-link:focus,
.rail[b-auk7h8kf8r]  .mud-nav-link:active,
.rail[b-auk7h8kf8r]  .mud-nav-link *,
.rail[b-auk7h8kf8r]  .mud-nav-link *:hover {
    text-decoration: none !important;
    border-bottom: none !important;
}

/* ========= BRAND ========= */
.brand[b-auk7h8kf8r] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px 10px;
    min-height: 52px;
    color: inherit;
}

.brand-mark[b-auk7h8kf8r] {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: var(--ink);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-sans);
    font-weight: 800;
    font-size: 14px;
    letter-spacing: -.02em;
    line-height: 1;
    user-select: none;
}

.brand-mark__dot[b-auk7h8kf8r] {
    color: var(--brand-400);
    margin-left: 1px;
}

.brand-text[b-auk7h8kf8r] {
    display: flex;
    align-items: baseline;
    gap: 1px;
    line-height: 1;
    min-width: 0;
}

.brand-text .b1[b-auk7h8kf8r] {
    font-size: 17px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.015em;
    white-space: nowrap;
}

.brand-text .b1 .dot[b-auk7h8kf8r] {
    color: var(--brand-400);
}

.rail.is-mini .brand[b-auk7h8kf8r] {
    justify-content: center;
    padding: 18px 0 14px;
}

.rail.is-mini .brand-text[b-auk7h8kf8r] {
    display: none;
}

/* ========= NAV REGION ========= */
.nav-region[b-auk7h8kf8r] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    position: relative;
    border-top: 1px solid var(--neutral-border);
}

.nav-scroll[b-auk7h8kf8r] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4px 10px 12px;
    scrollbar-width: thin;
    scrollbar-color: var(--neutral-border-strong) transparent;
}

.nav-scroll[b-auk7h8kf8r]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.nav-scroll[b-auk7h8kf8r]::-webkit-scrollbar-thumb {
    background: var(--neutral-border-strong);
    border-radius: 9999px;
}

.nav-scroll[b-auk7h8kf8r]::-webkit-scrollbar-track {
    background: transparent;
}

.nav-overline[b-auk7h8kf8r] {
    font-size: 10px;
    font-weight: 700;
    color: var(--neutral-placeholder);
    letter-spacing: .09em;
    text-transform: uppercase;
    padding: 8px 14px 6px;
}

.rail.is-mini .nav-overline[b-auk7h8kf8r] {
    text-align: center;
    padding: 14px 0 6px;
    font-size: 9px;
    color: var(--neutral-border-strong);
}

.rail.is-mini .nav-overline span[b-auk7h8kf8r] {
    display: none;
}

.rail.is-mini .nav-overline[b-auk7h8kf8r]::after {
    content: "·····";
    letter-spacing: .4em;
}

/* ========= NAV SECTION ========= */
.nav-section[b-auk7h8kf8r] {
    position: relative;
    margin: 1px 0;
}

.nav-no-access[b-auk7h8kf8r] {
    padding: 16px 12px;
    text-align: center;
}

.nav-no-access-text[b-auk7h8kf8r] {
    color: var(--neutral-label);
    white-space: normal;
    font-size: 14px;
}

/* ========= MUD NAV LINKS — restyle MudBlazor ========= */
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 36px;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 8px;
    cursor: pointer;
    color: var(--neutral-label);
    font-family: var(--font-sans);
    font-size: 12px;
    font-weight: 500;
    position: relative;
    transition: background var(--t-fast) var(--ease-out), color var(--t-fast) var(--ease-out);
    user-select: none;
    background: transparent;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item .mud-nav-link-icon {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    color: currentColor;
    margin: 0;
    display: grid;
    place-items: center;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item .mud-nav-link-icon .mud-icon-root {
    font-size: 18px;
    color: currentColor;
    margin: 0;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item .mud-nav-link-text {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: inherit;
    font: inherit;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item:hover {
    background: var(--neutral-bg);
    color: var(--ink);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item:focus-visible {
    outline: none;
    box-shadow: var(--focus-brand);
}

/* Section header */
.rail[b-auk7h8kf8r]  .mud-nav-link.section-header {
    color: var(--ink);
    font-weight: 600;
    font-size: 12px;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.section-header .mud-nav-link-icon .mud-icon-root {
    font-size: 16px;
}

/* Active section header — brand-tinted pill, brand-colored text and icon.
   !important + descendant combinator (instead of `>`) to punch through both
   MudBlazor defaults and any Blazor scoped-CSS quirks with direct-child + ::deep. */
.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header,
.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header:link,
.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header:visited,
.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header.active {
    background: var(--brand-50) !important;
    color: var(--brand-600) !important;
    font-weight: 700 !important;
}

.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header .mud-nav-link-text {
    color: var(--brand-600) !important;
}

.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header:hover {
    background: var(--brand-100) !important;
}

.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header .mud-nav-link-icon,
.rail .nav-section.is-active[b-auk7h8kf8r]  .mud-nav-link.section-header .mud-nav-link-icon .mud-icon-root {
    color: var(--brand-400) !important;
}

.nav-section.is-active[b-auk7h8kf8r]::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 6px;
    bottom: 6px;
    width: 3px;
    border-radius: 0 6px 6px 0;
    background: var(--brand-400);
    z-index: 1;
}

/* Sub items */
.sub-list[b-auk7h8kf8r] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows var(--t-slow) var(--ease-out);
    margin: 2px 0 6px;
}

.sub-list-inner[b-auk7h8kf8r] {
    overflow: hidden;
    position: relative;
    padding-left: 24px;
}

.sub-list-inner[b-auk7h8kf8r]::before {
    content: "";
    position: absolute;
    left: 23px;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background: var(--neutral-border-strong);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub {
    height: 30px;
    min-height: 30px;
    padding: 0 10px;
    gap: 10px;
    color: var(--neutral-label);
    font-weight: 500;
    font-size: 12px;
    position: relative;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub .mud-nav-link-icon .mud-icon-root {
    font-size: 16px;
    color: var(--neutral-placeholder);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub::before {
    content: "";
    position: absolute;
    left: -12px;
    top: 50%;
    width: 10px;
    height: 1px;
    background: var(--neutral-border-strong);
    transform: translateY(-50%);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub:hover {
    background: var(--neutral-bg);
    color: var(--ink);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub:hover .mud-nav-link-icon .mud-icon-root {
    color: var(--neutral-label);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active,
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active {
    background: var(--brand-50) !important;
    color: var(--brand-600) !important;
    font-weight: 600 !important;
    box-shadow: inset 0 0 0 1px rgba(74, 196, 255, 0.25) !important;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active .mud-nav-link-text,
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active .mud-nav-link-text {
    color: var(--brand-600) !important;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active:hover,
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active:hover {
    background: var(--brand-100) !important;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active::before,
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active::before {
    background: var(--brand-400) !important;
    height: 2px !important;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active .mud-nav-link-icon .mud-icon-root,
.rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active .mud-nav-link-icon .mud-icon-root {
    color: var(--brand-400) !important;
}

/* ========= COLLAPSED MODE ========= */
.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.section-header {
    height: 44px;
    min-height: 44px;
    padding: 0;
    justify-content: center;
    border-radius: 8px;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.section-header .mud-nav-link-text {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.section-header .mud-nav-link-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    margin: 0;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.section-header .mud-nav-link-icon .mud-icon-root {
    font-size: 20px;
}

.rail.is-mini .sub-list-inner[b-auk7h8kf8r] {
    padding-left: 0;
}

.rail.is-mini .sub-list-inner[b-auk7h8kf8r]::before {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub {
    height: 34px;
    min-height: 34px;
    padding: 0;
    justify-content: center;
    margin: 1px 0;
    border-radius: 8px;
    gap: 0;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub .mud-nav-link-text {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub::before {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub .mud-nav-link-icon {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: #fff;
    color: var(--neutral-label);
    position: relative;
    z-index: 1;
    border: 1px solid var(--neutral-border);
    display: grid;
    place-items: center;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub .mud-nav-link-icon .mud-icon-root {
    font-size: 14px;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub:hover .mud-nav-link-icon {
    color: var(--ink);
    border-color: var(--neutral-border-strong);
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.mud-nav-link-active .mud-nav-link-icon,
.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub.active .mud-nav-link-icon {
    color: var(--brand-400);
    border-color: var(--brand-400);
}

/* Mini active section — ink fill icon tile, brand glyph */
.rail.is-mini .nav-section.is-active[b-auk7h8kf8r] >  .mud-nav-link.section-header {
    background: transparent;
}

.rail.is-mini .nav-section.is-active[b-auk7h8kf8r] >  .mud-nav-link.section-header .mud-nav-link-icon {
    background: var(--ink);
    color: var(--brand-400);
}

.rail.is-mini .nav-section.is-active[b-auk7h8kf8r] >  .mud-nav-link.section-header .mud-nav-link-icon .mud-icon-root {
    color: var(--brand-400);
}

.rail.is-mini .nav-section.is-active[b-auk7h8kf8r]::before {
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 2px;
}

.rail.is-mini[b-auk7h8kf8r]  .mud-nav-link.section-header:hover .mud-nav-link-icon {
    background: var(--neutral-bg);
}

/* ========= FLYOUT =========
   position: fixed so it overlays the page content and does not contribute to
   .nav-scroll's overflow box (which would force a horizontal scrollbar).
   top/left are set by sidebar-flyout.js on mouseover/focusin. */
.flyout[b-auk7h8kf8r] {
    position: fixed;
    top: 0;
    left: 0;
    margin-left: 10px;
    min-width: 240px;
    max-width: 280px;
    background: #fff;
    border: 1px solid var(--neutral-card-border);
    border-radius: 12px;
    box-shadow: var(--shadow-md);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-4px);
    transform-origin: left center;
    transition: opacity var(--t-base) var(--ease-out),
                transform var(--t-base) var(--ease-out),
                visibility var(--t-base);
    z-index: 1000;
}

.flyout[b-auk7h8kf8r]::before {
    content: "";
    position: absolute;
    left: -6px;
    top: 18px;
    width: 11px;
    height: 11px;
    background: #fff;
    border-left: 1px solid var(--neutral-card-border);
    border-bottom: 1px solid var(--neutral-card-border);
    transform: rotate(45deg);
}

.flyout[b-auk7h8kf8r]::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -14px;
    width: 14px;
}

.nav-section:not(.is-active):hover > .flyout[b-auk7h8kf8r],
.nav-section:not(.is-active) > .flyout:hover[b-auk7h8kf8r] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 120ms;
}

.flyout-title[b-auk7h8kf8r] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px 10px;
    border-bottom: 1px solid var(--neutral-border);
    margin-bottom: 6px;
}

.flyout-title .ico[b-auk7h8kf8r] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: var(--ink);
    color: var(--brand-400);
    flex: 0 0 auto;
}

.flyout-title .ico[b-auk7h8kf8r]  .mud-icon-root {
    font-size: 16px;
    color: var(--brand-400);
}

.flyout-title .t1[b-auk7h8kf8r] {
    font-weight: 700;
    font-size: 13px;
    color: var(--ink);
    letter-spacing: -.005em;
    line-height: 1.2;
}

.flyout-title .t2[b-auk7h8kf8r] {
    font-size: 10px;
    color: var(--neutral-placeholder);
    font-weight: 600;
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.flyout-list[b-auk7h8kf8r] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 32px;
    min-height: 32px;
    padding: 0 10px;
    border-radius: 6px;
    color: var(--neutral-label);
    font-size: 12px;
    font-weight: 500;
    font-family: var(--font-sans);
    transition: background var(--t-fast), color var(--t-fast);
    cursor: pointer;
    background: transparent;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item .mud-nav-link-icon {
    width: 18px;
    height: 18px;
    color: var(--neutral-placeholder);
    margin: 0;
    display: grid;
    place-items: center;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item .mud-nav-link-icon .mud-icon-root {
    font-size: 16px;
    color: currentColor;
    margin: 0;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item .mud-nav-link-text {
    color: inherit;
    font: inherit;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item:hover {
    background: var(--neutral-bg);
    color: var(--ink);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item:hover .mud-nav-link-icon .mud-icon-root {
    color: var(--neutral-label);
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item.mud-nav-link-active,
.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item.active {
    color: var(--ink);
    font-weight: 600;
}

.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item.mud-nav-link-active .mud-nav-link-icon .mud-icon-root,
.rail[b-auk7h8kf8r]  .mud-nav-link.flyout-item.active .mud-nav-link-icon .mud-icon-root {
    color: var(--brand-400);
}

/* Active section suppresses its own flyout */
.nav-section.is-active > .flyout[b-auk7h8kf8r] {
    display: none;
}

/* ========= FOOT ========= */
.rail-foot[b-auk7h8kf8r] {
    flex: 0 0 auto;
    border-top: 1px solid var(--neutral-border);
    padding: 12px 12px 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
}

.rail.is-mini .rail-foot[b-auk7h8kf8r] {
    padding: 10px 8px;
    gap: 8px;
}

.rail.is-mini[b-auk7h8kf8r]  .profile {
    justify-content: center;
    padding: 6px;
    gap: 0;
}

.rail.is-mini[b-auk7h8kf8r]  .profile .profile-text,
.rail.is-mini[b-auk7h8kf8r]  .profile .profile-cta {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .requests {
    background: #fff;
}

.rail.is-mini[b-auk7h8kf8r]  .requests .requests-head {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .requests .requests-list {
    padding: 4px;
    gap: 6px;
}

.rail.is-mini[b-auk7h8kf8r]  .requests .req-row {
    justify-content: center;
    padding: 4px;
    gap: 0;
}

.rail.is-mini[b-auk7h8kf8r]  .requests .req-text,
.rail.is-mini[b-auk7h8kf8r]  .requests .req-cta {
    display: none;
}

.rail.is-mini[b-auk7h8kf8r]  .requests .req-pill {
    width: 32px;
    height: 32px;
}

/* ========= TOGGLE ========= */
.rail-toggle[b-auk7h8kf8r] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 8px 12px 14px;
    border-top: 1px solid var(--neutral-border);
    background: #fff;
}

.rail.is-mini .rail-toggle[b-auk7h8kf8r] {
    justify-content: center;
    padding: 8px 0 14px;
}

.toggle-btn[b-auk7h8kf8r] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: #fff;
    border: 1px solid var(--neutral-border-strong);
    color: var(--neutral-label);
    cursor: pointer;
    padding: 0;
    transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast);
}

.toggle-btn:hover[b-auk7h8kf8r] {
    color: var(--ink);
    border-color: var(--ink);
}

.toggle-btn:focus-visible[b-auk7h8kf8r] {
    outline: none;
    box-shadow: var(--focus-brand);
}

.toggle-btn[b-auk7h8kf8r]  .mud-icon-root {
    font-size: 16px;
    color: currentColor;
}

/* ========= REDUCED MOTION ========= */
@media (prefers-reduced-motion: reduce) {
    .rail[b-auk7h8kf8r],
    .sub-list[b-auk7h8kf8r],
    .flyout[b-auk7h8kf8r],
    .toggle-btn[b-auk7h8kf8r],
    .rail[b-auk7h8kf8r]  .mud-nav-link {
        transition: none;
    }
}

/* ========= DENSITY @ short viewports ========= */
@media (max-height: 820px) {
    .rail[b-auk7h8kf8r]  .mud-nav-link.nav-item {
        height: 34px;
        min-height: 34px;
    }

    .rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub {
        height: 28px;
        min-height: 28px;
    }

    .nav-overline[b-auk7h8kf8r] {
        padding: 10px 14px 6px;
    }

    .brand[b-auk7h8kf8r] {
        min-height: 52px;
        padding: 14px 20px 10px;
    }
}

@media (max-height: 700px) {
    .rail[b-auk7h8kf8r]  .mud-nav-link.nav-item {
        height: 30px;
        min-height: 30px;
    }

    .rail[b-auk7h8kf8r]  .mud-nav-link.nav-item.sub {
        height: 26px;
        min-height: 26px;
    }

    .rail[b-auk7h8kf8r]  .mud-nav-link.nav-item .mud-nav-link-icon .mud-icon-root,
    .rail[b-auk7h8kf8r]  .mud-nav-link.section-header .mud-nav-link-icon .mud-icon-root {
        font-size: 18px;
    }

    .rail-foot[b-auk7h8kf8r] {
        padding: 8px 10px;
        gap: 6px;
    }

    .rail-toggle[b-auk7h8kf8r] {
        padding: 6px 12px 10px;
    }
}
/* /Components/CustomerComponents/UserProfileComponent.razor.rz.scp.css */
.profile[b-p4ue92dlr1] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #E2EBF0;
    transition: background 150ms cubic-bezier(.2,.7,.2,1), border-color 150ms cubic-bezier(.2,.7,.2,1);
    position: relative;
    min-width: 0;
    width: 100%;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
    appearance: none;
    -webkit-appearance: none;
}

/* Kill Bootstrap's automatic caret (▼) on .dropdown-toggle */
.profile.dropdown-toggle[b-p4ue92dlr1]::after {
    display: none !important;
}

.profile:hover[b-p4ue92dlr1] {
    border-color: #DDE8EE;
    background: #FAFCFD;
}

.profile:focus-visible[b-p4ue92dlr1] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.avatar[b-p4ue92dlr1] {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    display: grid;
    place-items: center;
    background: #0D2D3F;
    color: #4AC4FF;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .02em;
    position: relative;
    user-select: none;
}

.avatar[b-p4ue92dlr1]::after {
    content: "";
    position: absolute;
    right: -1px;
    bottom: -1px;
    width: 9px;
    height: 9px;
    border-radius: 9999px;
    background: #22C55E;
    box-shadow: 0 0 0 2px #fff;
}

.profile-text[b-p4ue92dlr1] {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
    min-width: 0;
    flex: 1 1 auto;
}

.profile-text .p1[b-p4ue92dlr1] {
    font-size: 14px;
    font-weight: 600;
    color: #0D2D3F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-text .p2[b-p4ue92dlr1] {
    font-size: 11px;
    font-weight: 500;
    color: #9BB8C5;
    margin-top: 3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0;
}

.profile-cta[b-p4ue92dlr1] {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    color: #9BB8C5;
    border-radius: 6px;
    transition: color 150ms cubic-bezier(.2,.7,.2,1);
}

.profile-cta i[b-p4ue92dlr1] {
    font-size: 14px;
    line-height: 1;
}

.profile:hover .profile-cta[b-p4ue92dlr1] {
    color: #0D2D3F;
}

.dropdown-menu[b-p4ue92dlr1] {
    border-radius: 10px;
    border: 1px solid #E2EBF0;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    padding: 6px;
    min-width: 180px;
}

.dropdown-item[b-p4ue92dlr1] {
    border-radius: 6px;
    font-size: 14px;
    color: #4A6878;
    padding: 8px 10px;
}

.dropdown-item:hover[b-p4ue92dlr1],
.dropdown-item:focus[b-p4ue92dlr1] {
    background: #F8FBFD;
    color: #0D2D3F;
}

.dropdown-divider[b-p4ue92dlr1] {
    margin: 4px 0;
    border-color: #EDF2F5;
}
/* /Components/Layout/PublicMainLayout.razor.rz.scp.css */
.page[b-f3v3hhwuvj] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-f3v3hhwuvj] {
    flex: 1;
}

.sidebar[b-f3v3hhwuvj] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-f3v3hhwuvj] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-f3v3hhwuvj]  a, .top-row[b-f3v3hhwuvj]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-f3v3hhwuvj]  a:hover, .top-row[b-f3v3hhwuvj]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-f3v3hhwuvj]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-f3v3hhwuvj] {
        justify-content: space-between;
    }

    .top-row[b-f3v3hhwuvj]  a, .top-row[b-f3v3hhwuvj]  .btn-link {
        margin-left: 0;
    }
}

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

    .sidebar[b-f3v3hhwuvj] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-f3v3hhwuvj] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-f3v3hhwuvj]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-f3v3hhwuvj], article[b-f3v3hhwuvj] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-f3v3hhwuvj] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss[b-f3v3hhwuvj] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Css for navbar */
.fixed-navbar[b-f3v3hhwuvj] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1050;
}

.content-with-navbar[b-f3v3hhwuvj] {
    padding-top: 100px;
}
/* /Components/Pages/Account/AdminLogin.razor.rz.scp.css */
.auth-page[b-wyq6haittu] {
    min-height: 100vh;
    background: #f8fbfd;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 32px 20px;
    box-sizing: border-box;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: #0d2d3f;
}

.auth-shell[b-wyq6haittu] {
    width: 100%;
    max-width: 420px;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.auth-logo[b-wyq6haittu] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    border-radius: 8px;
    padding: 4px 6px;
}

.auth-logo:focus-visible[b-wyq6haittu] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.3);
}

.auth-logo__mark[b-wyq6haittu] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #0d2d3f;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.auth-logo__mark em[b-wyq6haittu] {
    color: #4ac4ff;
    font-style: normal;
    margin-left: 1px;
}

.auth-logo__word[b-wyq6haittu] {
    font-weight: 800;
    font-size: 22px;
    color: #0d2d3f;
    letter-spacing: -0.02em;
}

.auth-logo__word em[b-wyq6haittu] {
    color: #4ac4ff;
    font-style: normal;
}

.auth-card[b-wyq6haittu] {
    width: 100%;
    background: #fff;
    border: 1px solid #e2ebf0;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    padding: 32px 32px 28px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.auth-card__head[b-wyq6haittu] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}

.auth-card__title[b-wyq6haittu] {
    margin: 4px 0 0;
    font-weight: 800;
    font-size: 24px;
    color: #0d2d3f;
    letter-spacing: -0.01em;
    line-height: 1.15;
}

.auth-card__title em[b-wyq6haittu] {
    font-style: normal;
    color: #4ac4ff;
}

.auth-card__lede[b-wyq6haittu] {
    margin: 0;
    font-size: 13px;
    color: #7a9bad;
    line-height: 1.5;
}

.auth-pill[b-wyq6haittu] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #f2f5f7;
    color: #4a6878;
    border: 1px solid transparent;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 5px 11px;
    border-radius: 9999px;
}

.auth-pill__dot[b-wyq6haittu] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: #4ac4ff;
}

.auth-banner[b-wyq6haittu] {
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.5;
}

.auth-banner--error[b-wyq6haittu] {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
}

.auth-banner__icon[b-wyq6haittu] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: #e11d48;
    margin-top: 1px;
}

.auth-banner__body[b-wyq6haittu] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.auth-banner__title[b-wyq6haittu] {
    margin: 0;
    font-weight: 600;
    color: #9f1239;
}

.auth-banner__text[b-wyq6haittu] {
    margin: 0;
}

.auth-form[b-wyq6haittu] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.field[b-wyq6haittu] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
}

.field__label-row[b-wyq6haittu] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.field__label[b-wyq6haittu] {
    font-size: 12px;
    font-weight: 600;
    color: #4a6878;
    letter-spacing: 0.005em;
}

.field__hint-link[b-wyq6haittu] {
    font-size: 12px;
    font-weight: 600;
    color: #4a6878;
    text-decoration: none;
    border-radius: 4px;
    padding: 2px 4px;
    transition: color 150ms ease-out;
}

.field__hint-link:hover[b-wyq6haittu] {
    color: #0d2d3f;
}

.field__hint-link:focus-visible[b-wyq6haittu] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.field__control[b-wyq6haittu] {
    position: relative;
    height: 46px;
    background: #fff;
    border: 1.5px solid #dde8ee;
    border-radius: 10px;
    display: flex;
    align-items: center;
    padding-left: 42px;
    padding-right: 14px;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}

.field__control:focus-within[b-wyq6haittu] {
    border-color: #4ac4ff;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.field__control.is-invalid[b-wyq6haittu] {
    border-color: #f43f5e;
    box-shadow: 0 0 0 3px rgba(244, 63, 94, 0.1);
}

.field__icon[b-wyq6haittu] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    color: #9bb8c5;
    pointer-events: none;
}

.field__control:focus-within .field__icon[b-wyq6haittu] {
    color: #4a6878;
}

.field__control.is-invalid .field__icon[b-wyq6haittu] {
    color: #e11d48;
}

.field__input[b-wyq6haittu] {
    flex: 1;
    width: 100%;
    border: 0 !important;
    outline: none;
    box-shadow: none !important;
    background: transparent !important;
    font: inherit;
    font-size: 14px;
    color: #0d2d3f;
    height: 100%;
    padding: 0;
    margin: 0;
    appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
}

.field__input[b-wyq6haittu]::placeholder {
    color: #9bb8c5;
}

.field__input:disabled[b-wyq6haittu] {
    color: #7a9bad;
}

.field__error[b-wyq6haittu] {
    margin: 2px 0 0;
    font-size: 12px;
    color: #e11d48;
    display: flex;
    align-items: center;
    gap: 6px;
}

.field__error svg[b-wyq6haittu] {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
}

.btn[b-wyq6haittu] {
    height: 48px;
    border-radius: 10px;
    border: none;
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    transition: background 150ms ease-out;
    padding: 0 16px;
}

.btn:focus-visible[b-wyq6haittu] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.35);
}

.btn:disabled[b-wyq6haittu] {
    cursor: default;
}

.btn--ink[b-wyq6haittu] {
    background: #0d2d3f;
    color: #fff;
}

.btn--ink:hover:not(:disabled)[b-wyq6haittu] {
    background: #1e4256;
}

.btn--ink:active:not(:disabled)[b-wyq6haittu] {
    background: #07202e;
}

.btn--ink[aria-busy="true"][b-wyq6haittu] {
    opacity: 0.85;
}

.btn--ink:disabled:not([aria-busy="true"])[b-wyq6haittu] {
    opacity: 0.45;
}

.btn--submit[b-wyq6haittu] {
    width: 100%;
    margin-top: 8px;
}

.btn__spinner[b-wyq6haittu] {
    width: 16px;
    height: 16px;
    border-radius: 9999px;
    border: 2px solid rgba(255, 255, 255, 0.25);
    border-top-color: #fff;
    animation: btn-spin-b-wyq6haittu 0.9s linear infinite;
}

.auth-back[b-wyq6haittu] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #4a6878;
    text-decoration: none;
    padding: 8px 12px;
    border-radius: 8px;
    transition: color 150ms ease-out, background 150ms ease-out;
}

.auth-back svg[b-wyq6haittu] {
    width: 14px;
    height: 14px;
}

.auth-back:hover[b-wyq6haittu] {
    color: #0d2d3f;
    background: #f2f5f7;
}

.auth-back:focus-visible[b-wyq6haittu] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

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

@media (max-width: 380px) {
    .auth-card[b-wyq6haittu] {
        padding: 26px 20px 22px;
        border-radius: 14px;
    }

    .auth-card__title[b-wyq6haittu] {
        font-size: 21px;
    }
}
/* /Components/Pages/Account/AzureOAuthCallback.razor.rz.scp.css */
.auth-page[b-jdf9nt8gra] {
    min-height: 100vh;
    background: #f8fbfd;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 32px 20px;
    box-sizing: border-box;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: #0d2d3f;
}

.auth-shell[b-jdf9nt8gra] {
    width: 100%;
    max-width: 440px;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.auth-logo[b-jdf9nt8gra] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    border-radius: 8px;
    padding: 4px 6px;
}

.auth-logo:focus-visible[b-jdf9nt8gra] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.3);
}

.auth-logo__mark[b-jdf9nt8gra] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #0d2d3f;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.auth-logo__mark em[b-jdf9nt8gra] {
    color: #4ac4ff;
    font-style: normal;
    margin-left: 1px;
}

.auth-logo__word[b-jdf9nt8gra] {
    font-weight: 800;
    font-size: 22px;
    color: #0d2d3f;
    letter-spacing: -0.02em;
}

.auth-logo__word em[b-jdf9nt8gra] {
    color: #4ac4ff;
    font-style: normal;
}

.auth-card[b-jdf9nt8gra] {
    width: 100%;
    background: #fff;
    border: 1px solid #e2ebf0;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    padding: 32px 32px 28px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.auth-card__head[b-jdf9nt8gra] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
}

.auth-card__title[b-jdf9nt8gra] {
    margin: 4px 0 0;
    font-weight: 800;
    font-size: 22px;
    color: #0d2d3f;
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.auth-card__title em[b-jdf9nt8gra] {
    font-style: normal;
    color: #4ac4ff;
}

.auth-card__lede[b-jdf9nt8gra] {
    margin: 0;
    font-size: 13px;
    color: #7a9bad;
    line-height: 1.5;
}

.auth-pill[b-jdf9nt8gra] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 5px 11px;
    border-radius: 9999px;
    border: 1px solid transparent;
}

.auth-pill__dot[b-jdf9nt8gra] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
}

.auth-pill--secure[b-jdf9nt8gra] {
    background: #f2f5f7;
    color: #4a6878;
}

.auth-pill--secure .auth-pill__dot[b-jdf9nt8gra] {
    background: #4ac4ff;
}

.auth-pill--success[b-jdf9nt8gra] {
    background: #f0fdf4;
    color: #15803d;
    border-color: #bbf7d0;
}

.auth-pill--success .auth-pill__dot[b-jdf9nt8gra] {
    background: #22c55e;
}

.auth-pill--error[b-jdf9nt8gra] {
    background: #fff1f2;
    color: #e11d48;
    border-color: #fecdd3;
}

.auth-pill--error .auth-pill__dot[b-jdf9nt8gra] {
    background: #f43f5e;
}

.cb-steps[b-jdf9nt8gra] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cb-step[b-jdf9nt8gra] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    transition: color 200ms ease-out;
}

.cb-step__marker[b-jdf9nt8gra] {
    width: 26px;
    height: 26px;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid #dde8ee;
    background: #fff;
    color: #9bb8c5;
    flex: 0 0 auto;
    transition: all 200ms ease-out;
}

.cb-step__marker svg[b-jdf9nt8gra] {
    width: 14px;
    height: 14px;
}

.cb-step__num[b-jdf9nt8gra] {
    font-size: 11px;
    font-weight: 700;
}

.cb-step__label[b-jdf9nt8gra] {
    flex: 1;
}

.cb-step__meta[b-jdf9nt8gra] {
    font-size: 11px;
    font-weight: 500;
    color: #9bb8c5;
}

.cb-step__spinner[b-jdf9nt8gra] {
    width: 13px;
    height: 13px;
    border-radius: 9999px;
    border: 2px solid rgba(74, 196, 255, 0.25);
    border-top-color: #4ac4ff;
    animation: btn-spin-b-jdf9nt8gra 0.9s linear infinite;
}

.cb-step--done .cb-step__marker[b-jdf9nt8gra] {
    background: #0d2d3f;
    border-color: #0d2d3f;
    color: #fff;
}

.cb-step--done .cb-step__label[b-jdf9nt8gra] {
    color: #4a6878;
    font-weight: 500;
}

.cb-step--active .cb-step__marker[b-jdf9nt8gra] {
    border-color: #4ac4ff;
    color: #4ac4ff;
}

.cb-step--active .cb-step__label[b-jdf9nt8gra] {
    color: #0d2d3f;
    font-weight: 600;
}

.cb-step--error .cb-step__marker[b-jdf9nt8gra] {
    background: #fff1f2;
    border-color: #f43f5e;
    color: #e11d48;
}

.cb-step--error .cb-step__label[b-jdf9nt8gra] {
    color: #e11d48;
    font-weight: 600;
}

.cb-step--pending .cb-step__label[b-jdf9nt8gra] {
    color: #9bb8c5;
    font-weight: 500;
}

.cb-foot[b-jdf9nt8gra] {
    margin: 0;
    font-size: 12px;
    color: #9bb8c5;
    text-align: center;
}

.cb-foot--success[b-jdf9nt8gra] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.cb-spinner[b-jdf9nt8gra] {
    width: 12px;
    height: 12px;
    border-radius: 9999px;
    border: 1.5px solid rgba(74, 196, 255, 0.25);
    border-top-color: #4ac4ff;
    animation: btn-spin-b-jdf9nt8gra 0.9s linear infinite;
}

.auth-banner[b-jdf9nt8gra] {
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.5;
}

.auth-banner--error[b-jdf9nt8gra] {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
}

.auth-banner__icon[b-jdf9nt8gra] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: #e11d48;
    margin-top: 1px;
}

.auth-banner__body[b-jdf9nt8gra] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.auth-banner__title[b-jdf9nt8gra] {
    margin: 0;
    font-weight: 600;
    color: #9f1239;
}

.auth-banner__list[b-jdf9nt8gra] {
    margin: 0;
    padding-left: 18px;
    line-height: 1.6;
}

.btn[b-jdf9nt8gra] {
    height: 48px;
    border-radius: 10px;
    border: none;
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    transition: background 150ms ease-out;
    padding: 0 16px;
    width: 100%;
}

.btn--ink[b-jdf9nt8gra] {
    background: #0d2d3f;
    color: #fff;
}

.btn--ink:hover:not(:disabled)[b-jdf9nt8gra] {
    background: #1e4256;
}

.btn--ink:active:not(:disabled)[b-jdf9nt8gra] {
    background: #07202e;
}

.btn:focus-visible[b-jdf9nt8gra] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.35);
}

.cb-actions[b-jdf9nt8gra] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.auth-back[b-jdf9nt8gra] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #4a6878;
    text-decoration: none;
    padding: 8px 12px;
    border-radius: 8px;
    transition: color 150ms ease-out, background 150ms ease-out;
}

.auth-back--center[b-jdf9nt8gra] {
    align-self: center;
}

.auth-back svg[b-jdf9nt8gra] {
    width: 14px;
    height: 14px;
}

.auth-back:hover[b-jdf9nt8gra] {
    color: #0d2d3f;
    background: #f2f5f7;
}

.auth-back:focus-visible[b-jdf9nt8gra] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

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

@media (max-width: 380px) {
    .auth-card[b-jdf9nt8gra] {
        padding: 26px 20px 22px;
        border-radius: 14px;
    }

    .auth-card__title[b-jdf9nt8gra] {
        font-size: 20px;
    }
}

.cb-success-badge[b-jdf9nt8gra] {
    position: relative;
    width: 72px;
    height: 72px;
    margin: 4px auto 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cb-success-badge__ring[b-jdf9nt8gra] {
    position: absolute;
    inset: 0;
    border-radius: 9999px;
    background: rgba(34, 197, 94, 0.18);
    animation: cb-ring-pulse-b-jdf9nt8gra 1.8s ease-out infinite;
}

.cb-success-badge__circle[b-jdf9nt8gra] {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: #22c55e;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(34, 197, 94, 0.35);
    transform: scale(0);
    animation: cb-pop-b-jdf9nt8gra 420ms cubic-bezier(0.18, 0.89, 0.32, 1.28) forwards;
}

.cb-success-badge__check[b-jdf9nt8gra] {
    width: 30px;
    height: 30px;
}

.cb-success-badge__check path[b-jdf9nt8gra] {
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: cb-draw-b-jdf9nt8gra 380ms ease-out 320ms forwards;
}

.auth-card__head:has(.cb-success-badge)[b-jdf9nt8gra] {
    align-items: center;
    text-align: center;
}

@keyframes cb-pop-b-jdf9nt8gra {
    0%   { transform: scale(0); }
    60%  { transform: scale(1.08); }
    100% { transform: scale(1); }
}

@keyframes cb-draw-b-jdf9nt8gra {
    to { stroke-dashoffset: 0; }
}

@keyframes cb-ring-pulse-b-jdf9nt8gra {
    0%   { transform: scale(0.85); opacity: 0.55; }
    70%  { transform: scale(1.25); opacity: 0;    }
    100% { transform: scale(1.25); opacity: 0;    }
}

@media (prefers-reduced-motion: reduce) {
    .cb-step__spinner[b-jdf9nt8gra],
    .cb-spinner[b-jdf9nt8gra],
    .btn__spinner[b-jdf9nt8gra] {
        animation-duration: 1.6s;
    }

    .cb-success-badge__ring[b-jdf9nt8gra] { animation: none; }
    .cb-success-badge__circle[b-jdf9nt8gra] { animation: none; transform: none; }
    .cb-success-badge__check path[b-jdf9nt8gra] { animation: none; stroke-dashoffset: 0; }
}
/* /Components/Pages/Account/Login.razor.rz.scp.css */
.auth-page[b-qvk3ncqefn] {
    min-height: 100vh;
    background: #f8fbfd;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 32px 20px;
    box-sizing: border-box;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    color: #0d2d3f;
}

.auth-shell[b-qvk3ncqefn] {
    width: 100%;
    max-width: 420px;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
}

.auth-logo[b-qvk3ncqefn] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    border-radius: 8px;
    padding: 4px 6px;
    transition: opacity 150ms ease-out;
}

.auth-logo:hover[b-qvk3ncqefn] {
    opacity: 0.85;
}

.auth-logo:focus-visible[b-qvk3ncqefn] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.3);
}

.auth-logo__mark[b-qvk3ncqefn] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #0d2d3f;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.auth-logo__mark em[b-qvk3ncqefn] {
    color: #4ac4ff;
    font-style: normal;
    margin-left: 1px;
}

.auth-logo__word[b-qvk3ncqefn] {
    font-weight: 800;
    font-size: 22px;
    color: #0d2d3f;
    letter-spacing: -0.02em;
}

.auth-logo__word em[b-qvk3ncqefn] {
    color: #4ac4ff;
    font-style: normal;
}

.auth-card[b-qvk3ncqefn] {
    width: 100%;
    background: #fff;
    border: 1px solid #e2ebf0;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    padding: 36px 32px 28px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.auth-card__head[b-qvk3ncqefn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: center;
    text-align: center;
}

.auth-card__title[b-qvk3ncqefn] {
    margin: 0;
    font-weight: 800;
    font-size: 26px;
    color: #0d2d3f;
    letter-spacing: -0.01em;
    line-height: 1.15;
}

.auth-card__title em[b-qvk3ncqefn] {
    font-style: normal;
    color: #4ac4ff;
}

.auth-card__lede[b-qvk3ncqefn] {
    margin: 0;
    font-size: 14px;
    color: #7a9bad;
    line-height: 1.5;
}

.auth-banner[b-qvk3ncqefn] {
    border-radius: 10px;
    padding: 12px 14px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.5;
}

.auth-banner--info[b-qvk3ncqefn] {
    background: #f6fbfd;
    border: 1px solid #d6eaf3;
    color: #0d2d3f;
}

.auth-banner__icon[b-qvk3ncqefn] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: #0d80bb;
    margin-top: 1px;
}

.auth-banner__body[b-qvk3ncqefn] {
    margin: 0;
}

.auth-actions[b-qvk3ncqefn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.btn[b-qvk3ncqefn] {
    height: 48px;
    border-radius: 10px;
    border: none;
    font-family: inherit;
    font-weight: 600;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    transition: background 150ms ease-out, box-shadow 150ms ease-out;
    padding: 0 16px;
}

.btn:focus-visible[b-qvk3ncqefn] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.35);
}

.btn:disabled[b-qvk3ncqefn] {
    opacity: 0.45;
    cursor: default;
}

.btn--ink[b-qvk3ncqefn] {
    background: #0d2d3f;
    color: #fff;
}

.btn--ink:hover:not(:disabled)[b-qvk3ncqefn] {
    background: #1e4256;
}

.btn--ink:active:not(:disabled)[b-qvk3ncqefn] {
    background: #07202e;
}

.btn--ms[b-qvk3ncqefn] {
    width: 100%;
}

.btn__ms-mark[b-qvk3ncqefn],
.btn__spinner[b-qvk3ncqefn] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.btn__spinner[b-qvk3ncqefn] {
    animation: auth-spin-b-qvk3ncqefn 0.9s linear infinite;
}

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

.auth-divider[b-qvk3ncqefn] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 0;
    font-size: 11px;
    font-weight: 700;
    color: #9bb8c5;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.auth-divider__line[b-qvk3ncqefn] {
    flex: 1;
    height: 1px;
    background: #edf2f5;
}

.auth-divider__label[b-qvk3ncqefn] {
    padding: 0 2px;
}

.auth-link[b-qvk3ncqefn] {
    align-self: center;
    font-size: 13px;
    font-weight: 600;
    color: #4a6878;
    text-decoration: none;
    padding: 8px 12px;
    border-radius: 8px;
    transition: color 150ms ease-out, background 150ms ease-out;
}

.auth-link span[b-qvk3ncqefn] {
    border-bottom: 1px dashed #b7cad3;
}

.auth-link:hover[b-qvk3ncqefn] {
    color: #0d2d3f;
    background: #f2f5f7;
}

.auth-link:focus-visible[b-qvk3ncqefn] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.auth-link--disabled[b-qvk3ncqefn] {
    opacity: 0.45;
    pointer-events: none;
}

.auth-foot[b-qvk3ncqefn] {
    margin: 0;
    font-size: 12px;
    color: #9bb8c5;
    text-align: center;
}

@media (max-width: 380px) {
    .auth-card[b-qvk3ncqefn] {
        padding: 28px 22px 22px;
        border-radius: 14px;
    }

    .auth-card__title[b-qvk3ncqefn] {
        font-size: 22px;
    }
}
/* /Components/Pages/Assessments/AssessmentsOverviewPage.razor.rz.scp.css */
.assessments-overview-page[b-1vj7r997ic] {
    padding: 1.5rem;
    padding-bottom: 24px;
}

.stat-cards-row[b-1vj7r997ic] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 16px;
}

.stat-card-col[b-1vj7r997ic] {
    min-width: 0;
}

[b-1vj7r997ic] .assessments-overview-stat-card {
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    border: 2px solid transparent;
}

[b-1vj7r997ic] .assessments-overview-stat-card:hover {
    border-color: #cfe8f5;
    box-shadow: 0 6px 14px rgba(13, 128, 187, 0.1);
    transform: translateY(-1px);
}

[b-1vj7r997ic] .stat-card-active {
    border: 2px solid var(--mud-palette-primary) !important;
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
    background-color: #f7fcff;
}

.stat-card-content[b-1vj7r997ic] {
    min-height: 110px;
}

.stat-head-row[b-1vj7r997ic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 4px;
}

.stat-value[b-1vj7r997ic] {
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.1;
}

.stat-label[b-1vj7r997ic] {
    font-size: 0.95rem;
    font-weight: 600;
}

.stat-sublabel[b-1vj7r997ic] {
    font-size: 0.78rem;
    margin-top: 2px;
}

.stat-icon[b-1vj7r997ic] {
    font-size: 1.35rem;
}

.overview-switch[b-1vj7r997ic] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}

.overview-switch-link[b-1vj7r997ic] {
    background: none;
    border: 0;
    padding: 0;
    color: #6c757d;
    font-weight: 600;
    font-size: 1rem;
    transition: color 0.2s ease;
}

.overview-switch-link:hover[b-1vj7r997ic] {
    color: #0d80bb;
}

.overview-switch-link.active[b-1vj7r997ic] {
    color: #0d80bb;
}

.overview-switch-separator[b-1vj7r997ic] {
    color: #adb5bd;
    font-weight: 600;
}

.filters-wrapper[b-1vj7r997ic] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.filter-search[b-1vj7r997ic] {
    flex: 1 1 380px;
    min-width: 220px;
}

.filter-actions[b-1vj7r997ic] {
    display: flex;
    align-items: center;
}

.assessments-overview-table[b-1vj7r997ic] {
    table-layout: fixed;
}

.assessments-overview-column-header[b-1vj7r997ic] {
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: space-between;
}

.assessments-overview-sort-btn[b-1vj7r997ic] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: 0;
    font-weight: 600;
    color: #495057;
    padding: 0;
    cursor: pointer;
}

.assessments-overview-sort-btn:hover[b-1vj7r997ic] {
    color: #0d80bb;
}

.assessments-overview-sort-btn--grow[b-1vj7r997ic] {
    flex: 1;
    justify-content: flex-start;
}

.subject-cell[b-1vj7r997ic] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.subject-meta[b-1vj7r997ic] {
    min-width: 0;
}

.subject-link[b-1vj7r997ic] {
    border: 0;
    background: none;
    color: #0d80bb;
    font-weight: 600;
    padding: 0;
    cursor: pointer;
    text-align: left;
}

.subject-link:hover[b-1vj7r997ic] {
    text-decoration: underline;
}

.assessment-status-badge[b-1vj7r997ic] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.78rem;
    font-weight: 600;
    border: 1px solid transparent;
    white-space: nowrap;
}

.status-dot[b-1vj7r997ic] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.status-draft[b-1vj7r997ic] {
    background: #f8f9fa;
    color: #495057;
    border-color: #dee2e6;
}

.status-draft .status-dot[b-1vj7r997ic] {
    background: #6c757d;
}

.status-planned[b-1vj7r997ic] {
    background: #eaf6ff;
    color: #0d80bb;
    border-color: #cfe8f5;
}

.status-planned .status-dot[b-1vj7r997ic] {
    background: #0d80bb;
}

.status-in-progress[b-1vj7r997ic] {
    background: #fff8e1;
    color: #a36a00;
    border-color: #ffe4a8;
}

.status-in-progress .status-dot[b-1vj7r997ic] {
    background: #f59f00;
}

.status-completed[b-1vj7r997ic] {
    background: #eaf9f0;
    color: #1b7f45;
    border-color: #c8efd8;
}

.status-completed .status-dot[b-1vj7r997ic] {
    background: #2f9e44;
}

.status-cancelled[b-1vj7r997ic] {
    background: #fff1f0;
    color: #b42318;
    border-color: #ffd6d2;
}

.status-cancelled .status-dot[b-1vj7r997ic] {
    background: #e03131;
}

.status-rescheduled[b-1vj7r997ic] {
    background: #f3f3ff;
    color: #4b3fbf;
    border-color: #dcd8ff;
}

.status-rescheduled .status-dot[b-1vj7r997ic] {
    background: #5f3dc4;
}

.status-default[b-1vj7r997ic] {
    background: #f8f9fa;
    color: #495057;
    border-color: #dee2e6;
}

.status-default .status-dot[b-1vj7r997ic] {
    background: #6c757d;
}

@media (max-width: 900px) {
    .assessments-overview-page[b-1vj7r997ic] {
        padding: 1rem;
        padding-bottom: 20px;
    }

    .assessments-overview-table[b-1vj7r997ic] {
        table-layout: auto;
    }
}
/* /Components/Pages/CandidatePages/CandidateDetails/AiSkillsCard.razor.rz.scp.css */
.ai-skills-card[b-63wzcauzfq] {
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.ai-skills-card .ai-skills-header[b-63wzcauzfq] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #ffffff;
    border-bottom: none;
}

.ai-skills-card .ai-skills-header .ai-skills-title[b-63wzcauzfq] {
    font-weight: 600;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ai-skills-card .ai-skills-meta[b-63wzcauzfq] {
    font-size: 0.75rem;
    opacity: 0.85;
    margin-top: 2px;
}

.ai-skills-card .ai-skills-chips[b-63wzcauzfq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.ai-skills-card .ai-skills-summary[b-63wzcauzfq] {
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    background-color: rgba(102, 126, 234, 0.06);
    border-left: 4px solid #667eea;
    border-radius: 0.25rem;
    font-style: italic;
    color: #4a5568;
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
}

.ai-skills-card .ai-skills-summary i[b-63wzcauzfq] {
    color: #667eea;
    font-size: 1.1rem;
    margin-top: 2px;
}

.ai-skills-regenerate-btn[b-63wzcauzfq] {
    color: #ffffff !important;
}
/* /Components/Pages/CandidatePages/CandidateDetails/CandidateAssessmentTab.razor.rz.scp.css */
.tab-no-access[b-111kcier7r] {
    padding: 2rem;
    text-align: center;
}

.employee-assessments-page[b-111kcier7r] {
    background: #f8fafc;
    padding: 32px;
}

.assessments-content[b-111kcier7r] {
    width: 100%;
    max-width: 100%;
}

.content-header[b-111kcier7r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.content-title[b-111kcier7r] {
    font-size: 24px;
    font-weight: 600;
    color: #1e293b;
}

.controls-bar[b-111kcier7r] {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.search-field[b-111kcier7r] {
    width: 300px;
}

.filter-field[b-111kcier7r] {
    min-width: 160px;
}

.summary-grid[b-111kcier7r] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 32px;
}

.summary-card[b-111kcier7r] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
}

.summary-label[b-111kcier7r] {
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    margin-bottom: 8px;
}

.summary-value[b-111kcier7r] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 4px;
    line-height: 1.2;
}

.summary-sub[b-111kcier7r] {
    font-size: 13px;
    color: #94a3b8;
}

.badge-status[b-111kcier7r] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-success[b-111kcier7r] {
    background: #d1fae5;
    color: #059669;
}

.badge-planned[b-111kcier7r] {
    background: #e9d5ff;
    color: #7c3aed;
}

.badge-warning[b-111kcier7r] {
    background: #fed7aa;
    color: #ea580c;
}

.badge-danger[b-111kcier7r] {
    background: #fee2e2;
    color: #dc2626;
}

.badge-info[b-111kcier7r] {
    background: #dbeafe;
    color: #1d4ed8;
}

.badge-neutral[b-111kcier7r] {
    background: #e2e8f0;
    color: #64748b;
}

.timeline-container[b-111kcier7r] {
    position: relative;
    padding-left: 16px;
}

.timeline-line[b-111kcier7r] {
    position: absolute;
    left: 23px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
    z-index: 0;
}

.year-marker[b-111kcier7r] {
    font-size: 16px;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    display: inline-block;
    background: #f8fafc;
    padding: 0 8px;
}

.timeline-item[b-111kcier7r] {
    display: flex;
    gap: 24px;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
}

.timeline-date[b-111kcier7r] {
    width: 60px;
    text-align: right;
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    padding-top: 18px;
    flex-shrink: 0;
}

.timeline-node[b-111kcier7r] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #f8fafc;
    border: 2px solid #94a3b8;
    flex-shrink: 0;
    margin-top: 20px;
    box-shadow: 0 0 0 4px #f8fafc;
}

.timeline-node.completed[b-111kcier7r] {
    background: #059669;
    border-color: #059669;
}

.timeline-node.planned[b-111kcier7r] {
    border-color: #7c3aed;
    background: #f8fafc;
}

.timeline-node.warning[b-111kcier7r] {
    border-color: #ea580c;
    background: #f8fafc;
}

.timeline-node.danger[b-111kcier7r] {
    border-color: #dc2626;
    background: #dc2626;
}

.timeline-node.draft[b-111kcier7r] {
    border-color: #94a3b8;
    background: #f8fafc;
}

.assessment-card[b-111kcier7r] {
    flex: 1;
    background: #ffffff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e2e8f0;
    border-left: 4px solid #94a3b8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.assessment-card.completed[b-111kcier7r] {
    border-left-color: #059669;
}

.assessment-card.planned[b-111kcier7r] {
    border-left-color: #7c3aed;
}

.assessment-card.warning[b-111kcier7r] {
    border-left-color: #ea580c;
}

.assessment-card.cancelled[b-111kcier7r] {
    border-left-color: #dc2626;
}

.card-content h3[b-111kcier7r] {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.status-text[b-111kcier7r] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #94a3b8;
}

.status-text.success[b-111kcier7r] {
    color: #059669;
}

.status-text.planned[b-111kcier7r] {
    color: #7c3aed;
}

.status-text.warning[b-111kcier7r] {
    color: #ea580c;
}

.status-text.danger[b-111kcier7r] {
    color: #dc2626;
}

.status-text.neutral[b-111kcier7r] {
    color: #94a3b8;
}

.card-details[b-111kcier7r] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 14px;
    color: #64748b;
}

.card-actions[b-111kcier7r] {
    display: flex;
    gap: 8px;
}

.btn-outline[b-111kcier7r] {
    background: transparent;
    border: 1px solid #e2e8f0;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    cursor: pointer;
    transition: background 0.1s;
}

.btn-outline:hover[b-111kcier7r] {
    background: #f8fafc;
    border-color: #94a3b8;
}

.load-more[b-111kcier7r] {
    display: block;
    width: 100%;
    text-align: center;
    padding: 16px;
    color: #64748b;
    font-weight: 500;
    font-size: 14px;
    cursor: pointer;
    border-top: 1px solid #e2e8f0;
    margin-top: 24px;
}

.load-more:hover[b-111kcier7r] {
    color: #2e75b6;
}

[b-111kcier7r] .assessments-empty-state-card {
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 12px;
    min-height: 400px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 24px;
    text-align: center;
}

[b-111kcier7r] .assessments-empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
}

[b-111kcier7r] .assessments-empty-heading {
    font-weight: 600;
    margin-bottom: 8px;
}

[b-111kcier7r] .assessments-empty-description {
    color: rgba(0,0,0,0.6);
    max-width: 480px;
    margin-bottom: 24px;
}

.assessment-modal-backdrop[b-111kcier7r] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    z-index: 1200;
}

.assessment-modal[b-111kcier7r] {
    background: #ffffff;
    border-radius: 12px;
    width: min(720px, 96vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
}

.assessment-modal-header[b-111kcier7r] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.assessment-modal-title[b-111kcier7r] {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 4px;
}

.assessment-modal-subtitle[b-111kcier7r] {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

.assessment-modal-close[b-111kcier7r] {
    border: none;
    background: transparent;
    font-size: 18px;
    cursor: pointer;
    color: #64748b;
}

.assessment-modal-body[b-111kcier7r] {
    padding: 24px;
    overflow: auto;
}

.assessment-modal-footer[b-111kcier7r] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

.assessment-duration-input[b-111kcier7r] {
    width: 120px;
}

@media (max-width: 1024px) {
    .summary-grid[b-111kcier7r] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .employee-assessments-page[b-111kcier7r] {
        padding: 16px;
    }

    .controls-bar[b-111kcier7r] {
        flex-direction: column;
    }

    .search-field[b-111kcier7r],
    .filter-field[b-111kcier7r] {
        width: 100%;
    }

    .timeline-item[b-111kcier7r] {
        flex-direction: column;
        gap: 8px;
        padding-left: 32px;
    }

    .timeline-date[b-111kcier7r] {
        text-align: left;
        width: auto;
        padding-top: 0;
        font-size: 13px;
    }

    .timeline-node[b-111kcier7r] {
        position: absolute;
        left: 0;
        top: 0;
        margin-top: 4px;
    }

    .timeline-line[b-111kcier7r] {
        left: 7px;
    }

    .assessment-card[b-111kcier7r] {
        flex-direction: column;
        align-items: flex-start;
    }

    .card-actions[b-111kcier7r] {
        width: 100%;
    }

    .btn-outline[b-111kcier7r] {
        flex: 1;
        text-align: center;
    }
}
/* /Components/Pages/CandidatePages/CandidateDetails/CandidateCVsTab.razor.rz.scp.css */
/* Empty State - Original */
.cv-empty-state[b-93kew1de8a] {
    max-width: 600px;
    margin: 2rem auto;
    padding: 1rem;
}

.empty-state-card[b-93kew1de8a] {
    background-color: #fafafa;
    border-radius: 12px;
    padding: 3rem 2rem;
}

.empty-state-icon[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    background-color: #f0f0f0;
    border-radius: 12px;
    margin-bottom: 1rem;
}

.empty-state-icon i[b-93kew1de8a] {
    font-size: 2.5rem;
    color: #bdbdbd;
}

.empty-state-title[b-93kew1de8a] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 0.5rem 0;
}

.empty-state-subtitle[b-93kew1de8a] {
    font-size: 0.9375rem;
    color: #757575;
    margin: 0 0 1.5rem 0;
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
}

/* Compact Empty State for Grid Layout */
.cv-empty-state-compact[b-93kew1de8a] {
    text-align: center;
    padding: 2rem 1rem;
}

.empty-icon-wrapper[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background-color: #f5f5f5;
    border-radius: 50%;
    margin-bottom: 1rem;
}

.empty-icon-wrapper i[b-93kew1de8a] {
    font-size: 2rem;
    color: #bdbdbd;
}

.empty-title[b-93kew1de8a] {
    font-size: 1rem;
    font-weight: 600;
    color: #424242;
    margin: 0 0 0.5rem 0;
}

.empty-subtitle[b-93kew1de8a] {
    font-size: 0.875rem;
    color: #757575;
    margin: 0;
    line-height: 1.5;
}

/* Upload CV Button */
.btn-upload-cv[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background-color: #4f6bed;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-upload-cv:hover[b-93kew1de8a] {
    background-color: #3d5bd9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 107, 237, 0.3);
}

.btn-upload-cv i[b-93kew1de8a] {
    font-size: 1.125rem;
}

/* Main Container */
.cvs-main-container[b-93kew1de8a] {
    max-width: 1400px;
    margin: 1rem auto 15rem;
    padding: 0 1rem;
}

/* Grid Layout */
.cvs-grid[b-93kew1de8a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: start;
}

/* Section Styling */
.cvs-section[b-93kew1de8a] {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.2s ease;
}

.cvs-section:hover[b-93kew1de8a] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.cvs-section-header[b-93kew1de8a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-bottom: 1px solid #e0e0e0;
    gap: 1rem;
}

.cvs-section-title-wrapper[b-93kew1de8a] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.section-icon[b-93kew1de8a] {
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.external-icon[b-93kew1de8a] {
    color: #4f6bed;
}

.internal-icon[b-93kew1de8a] {
    color: #28a745;
}

.cvs-section-title[b-93kew1de8a] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

.cvs-section-body[b-93kew1de8a] {
    padding: 1.5rem;
    min-height: 200px;
}

/* Action Buttons */
.btn-action[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    min-width: auto;
    flex-shrink: 0;
    width: auto;
}

.btn-action i[b-93kew1de8a] {
    font-size: 1rem;
}

.btn-action span[b-93kew1de8a] {
    display: inline-block;
}

.btn-action.btn-primary[b-93kew1de8a] {
    background-color: #4f6bed;
    color: white;
}

.btn-action.btn-primary:hover[b-93kew1de8a] {
    background-color: #3d5bd9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 107, 237, 0.3);
}

.btn-action.btn-secondary[b-93kew1de8a] {
    background-color: #28a745;
    color: white;
}

.btn-action.btn-secondary:hover[b-93kew1de8a] {
    background-color: #218838;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.3);
}

/* CV List */
.cv-list[b-93kew1de8a] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cv-item[b-93kew1de8a] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.cv-item:hover[b-93kew1de8a] {
    border-color: #c0c0c0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* File Badge */
.cv-file-badge[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 28px;
    padding: 0 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: 4px;
    flex-shrink: 0;
}

.cv-badge-pdf[b-93kew1de8a] {
    background-color: #ffebee;
    color: #d32f2f;
}

.cv-badge-doc[b-93kew1de8a] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.cv-badge-default[b-93kew1de8a] {
    background-color: #f5f5f5;
    color: #757575;
}

/* CV Details */
.cv-details[b-93kew1de8a] {
    flex: 1;
    min-width: 0;
}

.cv-filename[b-93kew1de8a] {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #1a1a1a;
    margin: 0 0 0.25rem 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cv-meta[b-93kew1de8a] {
    font-size: 0.8125rem;
    color: #757575;
    margin: 0;
}

.cv-filesize[b-93kew1de8a] {
    font-size: 0.75rem;
    color: #9e9e9e;
    margin: 0.25rem 0 0 0;
}

/* Download Button */
.btn-download[b-93kew1de8a] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background-color: #ffffff;
    color: #555555;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.btn-download:hover:not(:disabled)[b-93kew1de8a] {
    background-color: #f5f5f5;
    border-color: #c0c0c0;
}

.btn-download:disabled[b-93kew1de8a] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-download.downloading[b-93kew1de8a] {
    background-color: #f5f5f5;
    border-color: #e0e0e0;
}

.btn-download i[b-93kew1de8a] {
    font-size: 1rem;
    color: #4f6bed;
}

.btn-download .spinner-border-sm[b-93kew1de8a] {
    border-color: #4f6bed;
    border-right-color: transparent;
}

/* Upload Zone */
.upload-zone[b-93kew1de8a] {
    transition: all 0.3s ease;
    background-color: #ffffff;
}

.upload-zone:hover[b-93kew1de8a] {
    border-color: #4f6bed !important;
    background-color: #f5f9ff !important;
}

.upload-zone--active[b-93kew1de8a],
.upload-zone.drag-over[b-93kew1de8a] {
    border-color: #4f6bed !important;
    background-color: #e3f2fd !important;
}

/* Responsive */
@media (max-width: 1200px) {
    .cvs-grid[b-93kew1de8a] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .cvs-main-container[b-93kew1de8a] {
        max-width: 900px;
    }
}

@media (max-width: 768px) {
    .cvs-main-container[b-93kew1de8a] {
        padding: 0 0.5rem;
    }

    .cvs-section-header[b-93kew1de8a] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1.25rem 1.5rem;
        background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
        border-bottom: 1px solid #e0e0e0;
        gap: 1rem;
    }

    .cvs-section-title-wrapper[b-93kew1de8a] {
        justify-content: center;
    }

    .btn-action[b-93kew1de8a] {
        justify-content: center;
    }

    .cvs-section-body[b-93kew1de8a] {
        padding: 1rem;
    }
}

@media (max-width: 600px) {
    .cv-item[b-93kew1de8a] {
        flex-wrap: wrap;
        gap: 0.75rem;
        padding: 1rem;
    }

    .cv-details[b-93kew1de8a] {
        flex: 1 1 calc(100% - 60px);
        order: 2;
    }

    .cv-file-badge[b-93kew1de8a] {
        order: 1;
    }

    .btn-download[b-93kew1de8a] {
        order: 3;
        width: 100%;
        justify-content: center;
    }

    .section-icon[b-93kew1de8a] {
        font-size: 1.25rem;
    }

    .cvs-section-title[b-93kew1de8a] {
        font-size: 1rem;
    }
}

/* PDF Preview Modal (same as Feedback) */
.dialog-overlay[b-93kew1de8a] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    animation: fadeIn-b-93kew1de8a 0.2s ease-in-out;
}

@keyframes fadeIn-b-93kew1de8a {
    from { opacity: 0; }
    to { opacity: 1; }
}

.preview-layout[b-93kew1de8a] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    animation: slideIn-b-93kew1de8a 0.3s ease-out;
}

@keyframes slideIn-b-93kew1de8a {
    from { transform: translateY(-40px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.pdf-preview-area[b-93kew1de8a] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-93kew1de8a] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-93kew1de8a] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}
/* /Components/Pages/CandidatePages/CandidateDetails/CandidateDetailsPage.razor.rz.scp.css */
/* Candidate Details — vertical tab rail (Talents DS). Tokens from talents-tokens.css */

.cd-body[b-ar2tkbtqts] {
    display: grid;
    grid-template-columns: 232px 1fr;
    gap: 18px;
    align-items: start;
}
.cd-rail[b-ar2tkbtqts] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    padding: 8px;
    display: flex; flex-direction: column; gap: 2px;
    position: sticky; top: 20px;
}
.cd-tab[b-ar2tkbtqts] {
    position: relative;
    display: flex; align-items: center; gap: 11px;
    padding: 10px 12px 10px 14px;
    border-radius: var(--radius-md);
    border: none; background: transparent;
    width: 100%; text-align: left; cursor: pointer;
    font-family: var(--font-sans);
    color: var(--neutral-label);
    transition: background .15s ease, color .15s ease;
}
.cd-tab:hover[b-ar2tkbtqts] { background: var(--neutral-surface); color: var(--ink); }
.cd-tab-ico[b-ar2tkbtqts] { display: inline-flex; align-items: center; justify-content: center; color: var(--neutral-placeholder); flex-shrink: 0; font-size: 16px; }
.cd-tab-label[b-ar2tkbtqts] { flex: 1; font-size: 13px; font-weight: var(--fw-semibold); }
.cd-tab-count[b-ar2tkbtqts] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 22px; height: 20px; padding: 0 7px;
    border-radius: var(--radius-full);
    background: var(--neutral-pill-bg); color: var(--neutral-label);
    font-size: 11px; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums;
}
.cd-tab.is-active[b-ar2tkbtqts] { background: var(--brand-50); color: var(--brand-800); }
.cd-tab.is-active[b-ar2tkbtqts]::before {
    content: ""; position: absolute; left: 0; top: 7px; bottom: 7px;
    width: 3px; border-radius: 0 3px 3px 0; background: var(--brand-400);
}
.cd-tab.is-active .cd-tab-ico[b-ar2tkbtqts] { color: var(--brand-500); }
.cd-tab.is-active .cd-tab-count[b-ar2tkbtqts] { background: white; color: var(--brand-700); border: 1px solid var(--brand-200); }

.cd-tab-content[b-ar2tkbtqts] { min-width: 0; }

@media (max-width: 1100px) {
    .cd-body[b-ar2tkbtqts] { grid-template-columns: 1fr; }
    .cd-rail[b-ar2tkbtqts] { flex-direction: row; flex-wrap: wrap; position: static; }
    .cd-tab[b-ar2tkbtqts] { width: auto; }
}

/* ==========================================================================
   DS look for the sub-tab cards — restyles chrome only (via ::deep), so every
   sub-component card matches the design system without touching their markup.
   ========================================================================== */
.cd-tab-content[b-ar2tkbtqts]  .card {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}
.cd-tab-content[b-ar2tkbtqts]  .card-header {
    background: var(--neutral-surface);
    border-bottom: 1px solid var(--neutral-border);
    padding: 14px 20px;
}
.cd-tab-content[b-ar2tkbtqts]  .card-title,
.cd-tab-content[b-ar2tkbtqts]  .card-header h5,
.cd-tab-content[b-ar2tkbtqts]  .card-header h6 {
    font-size: 13px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0;
}
.cd-tab-content[b-ar2tkbtqts]  .card-body { padding: 18px 20px; }

/* Lists inside the cards → DS rows */
.cd-tab-content[b-ar2tkbtqts]  .list-group { border-radius: 0; }
.cd-tab-content[b-ar2tkbtqts]  .list-group-item {
    border: none;
    border-bottom: 1px solid var(--neutral-border);
    padding: 12px 4px;
    font-size: 13px;
    color: var(--ink);
    background: transparent;
}
.cd-tab-content[b-ar2tkbtqts]  .list-group-item:last-child { border-bottom: none; }

/* Empty states */
.cd-tab-content[b-ar2tkbtqts]  .empty-state {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; padding: 40px 16px; text-align: center;
    color: var(--neutral-muted); font-size: 13px;
}
.cd-tab-content[b-ar2tkbtqts]  .empty-state i { font-size: 26px; color: var(--neutral-placeholder); }
.cd-tab-content[b-ar2tkbtqts]  .empty-state p { margin: 0; max-width: 420px; }
/* /Components/Pages/CandidatePages/CandidateDetails/InternalComments.razor.rz.scp.css */
.summary-container[b-z1cnu9p29k] {
    position: relative;
    overflow: hidden;
}

.loading-overlay[b-z1cnu9p29k] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(248, 249, 250, 0.95);
    backdrop-filter: blur(4px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.loading-overlay.active[b-z1cnu9p29k] {
    opacity: 1;
}

.snake-border[b-z1cnu9p29k] {
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border-radius: 8px;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.snake-border.active[b-z1cnu9p29k] {
    opacity: 1;
}

.snake-border[b-z1cnu9p29k]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: linear-gradient(90deg,
    transparent 0%,
    transparent 70%,
    #007bff 80%,
    #0056b3 90%,
    transparent 100%);
    animation: snakeMove-b-z1cnu9p29k 3s linear infinite;
}

.snake-border[b-z1cnu9p29k]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 6px;
    background: #fff;
    z-index: 1;
}

@keyframes snakeMove-b-z1cnu9p29k {
    0% {
        transform: rotate(0deg) scale(1.1);
    }
    25% {
        transform: rotate(90deg) scale(1.1);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    75% {
        transform: rotate(270deg) scale(1.1);
    }
    100% {
        transform: rotate(360deg) scale(1.1);
    }
}

.updating-text[b-z1cnu9p29k] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #007bff;
    margin-bottom: 0.5rem;
}

.dots[b-z1cnu9p29k] {
    display: inline-block;
    width: 20px;
}

.dots[b-z1cnu9p29k]::after {
    content: '';
    animation: dots-b-z1cnu9p29k 1.5s steps(4, end) infinite;
}

@keyframes dots-b-z1cnu9p29k {
    0%, 20% { content: ''; }
    40% { content: '.'; }
    60% { content: '..'; }
    80%, 100% { content: '...'; }
}

.ai-icon[b-z1cnu9p29k] {
    font-size: 2rem;
    color: #007bff;
    animation: pulse-b-z1cnu9p29k 2s ease-in-out infinite;
}

@keyframes pulse-b-z1cnu9p29k {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.1); }
}

.summary-container.no-clip[b-z1cnu9p29k] {
    overflow: visible;
}
/* /Components/Pages/CandidatePages/CandidateDetails/JobList.razor.rz.scp.css */
.cvb-arrow[b-jlu2q0f71c] {
    fill: rgba(0,0,0,0.54);
    transition: transform .15s ease;
}

.cvb-rotate-180[b-jlu2q0f71c] {
    transform: rotate(180deg);
}

.cvb-backdrop[b-jlu2q0f71c] {
    position: fixed;
    inset: 0;
    z-index: 1045;
    background: transparent;
}

.cvb-dropdown[b-jlu2q0f71c] {
    position: absolute;
    z-index: 1055;
    max-height: 380px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
}

.cvb-list[b-jlu2q0f71c] {
    max-height: 280px;
    overflow: auto;
    padding-left: 4px;
}

.jobs-select-btn[b-jlu2q0f71c] {
    height: 60px;
    padding-top: 8px;
    padding-bottom: 8px;
}
/* /Components/Pages/CandidatePages/CandidateDetails/PersonalInfo.razor.rz.scp.css */
.summary-container[b-dk1wwxrhm7] {
    position: relative;
    overflow: hidden;
}

.loading-overlay[b-dk1wwxrhm7] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(248, 249, 250, 0.95);
    backdrop-filter: blur(4px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.loading-overlay.active[b-dk1wwxrhm7] {
    opacity: 1;
}

.snake-border[b-dk1wwxrhm7] {
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border-radius: 8px;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.snake-border.active[b-dk1wwxrhm7] {
    opacity: 1;
}

.snake-border[b-dk1wwxrhm7]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: linear-gradient(90deg,
    transparent 0%,
    transparent 70%,
    #007bff 80%,
    #0056b3 90%,
    transparent 100%);
    animation: snakeMove-b-dk1wwxrhm7 3s linear infinite;
}

.snake-border[b-dk1wwxrhm7]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 6px;
    background: #fff;
    z-index: 1;
}

@keyframes snakeMove-b-dk1wwxrhm7 {
    0% {
        transform: rotate(0deg) scale(1.1);
    }
    25% {
        transform: rotate(90deg) scale(1.1);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    75% {
        transform: rotate(270deg) scale(1.1);
    }
    100% {
        transform: rotate(360deg) scale(1.1);
    }
}

.updating-text[b-dk1wwxrhm7] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #007bff;
    margin-bottom: 0.5rem;
}

.dots[b-dk1wwxrhm7] {
    display: inline-block;
    width: 20px;
}

.dots[b-dk1wwxrhm7]::after {
    content: '';
    animation: dots-b-dk1wwxrhm7 1.5s steps(4, end) infinite;
}

@keyframes dots-b-dk1wwxrhm7 {
    0%, 20% { content: ''; }
    40% { content: '.'; }
    60% { content: '..'; }
    80%, 100% { content: '...'; }
}

.ai-icon[b-dk1wwxrhm7] {
    font-size: 2rem;
    color: #007bff;
    animation: pulse-b-dk1wwxrhm7 2s ease-in-out infinite;
}

@keyframes pulse-b-dk1wwxrhm7 {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.1); }
}

.summary-container.no-clip[b-dk1wwxrhm7] {
    overflow: visible;
}

/* ==========================================================================
   View-mode identity card (Talents DS) — tokens from talents-tokens.css
   ========================================================================== */
.cp-btn[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 38px; padding: 0 14px;
    border-radius: var(--radius-md);
    font-family: var(--font-sans); font-size: 13px; font-weight: var(--fw-semibold); line-height: 1;
    border: 1.5px solid transparent; background: white; color: var(--ink);
    cursor: pointer; white-space: nowrap; text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.cp-btn:focus-visible[b-dk1wwxrhm7] { outline: none; box-shadow: var(--focus-brand); }
.cp-btn:disabled[b-dk1wwxrhm7] { opacity: 0.45; cursor: not-allowed; }
.cp-btn-outline[b-dk1wwxrhm7] { background: white; color: var(--ink); border-color: var(--neutral-border-strong); }
.cp-btn-outline:hover[b-dk1wwxrhm7] { border-color: var(--brand-200); background: var(--neutral-surface); }
.cp-btn-primary[b-dk1wwxrhm7] { background: var(--ink); color: white; border-color: var(--ink); }
.cp-btn-primary:hover:not(:disabled)[b-dk1wwxrhm7] { background: #1E4256; border-color: #1E4256; }
.cp-btn-sm[b-dk1wwxrhm7] { height: 30px; padding: 0 10px; font-size: 12px; }

/* Add-as-profile modal (email collision) — copied from the duplicates page DS */
.cp-modal-backdrop[b-dk1wwxrhm7] {
    position: fixed; inset: 0; background: rgba(13, 45, 63, 0.35); backdrop-filter: blur(2px);
    display: flex; align-items: center; justify-content: center; padding: 24px; z-index: 1400;
    animation: dc-fade-b-dk1wwxrhm7 .15s ease;
}
@keyframes dc-fade-b-dk1wwxrhm7 { from { opacity: 0; } to { opacity: 1; } }
.dc-dialog[b-dk1wwxrhm7] {
    position: relative; background: white;
    border: 1px solid var(--neutral-card-border); border-radius: var(--radius-xl);
    box-shadow: 0 24px 64px rgba(13,45,63,0.18); width: 100%; max-width: 420px; overflow: hidden;
}
.dc-dialog-body[b-dk1wwxrhm7] { padding: 22px 22px 18px; display: flex; flex-direction: column; gap: 14px; }
.dc-dialog-head[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 12px; }
.dc-dialog-icon[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: var(--radius-full);
    background: var(--error-bg); color: var(--error-text); border: 1px solid var(--error-border); flex-shrink: 0;
}
.dc-dialog-icon-brand[b-dk1wwxrhm7] { background: var(--brand-50); color: var(--brand-700); border-color: var(--brand-200); }
.dc-dialog-title[b-dk1wwxrhm7] { font-size: 15px; font-weight: var(--fw-bold); color: var(--ink); }
.dc-dialog-text[b-dk1wwxrhm7] { font-size: 13px; color: var(--neutral-muted); line-height: 1.55; margin: 0; }
.dc-dialog-text strong[b-dk1wwxrhm7] { color: var(--ink); font-weight: var(--fw-semibold); }
.dc-dialog-note[b-dk1wwxrhm7] {
    display: flex; align-items: flex-start; gap: 7px;
    font-size: 12.5px; line-height: 1.5; margin: 0;
    padding: 9px 11px; border-radius: var(--radius-md);
    background: var(--brand-50); color: var(--brand-700);
}
.dc-dialog-note i[b-dk1wwxrhm7] { margin-top: 1px; flex-shrink: 0; }
.dc-dialog-footer[b-dk1wwxrhm7] {
    display: flex; align-items: center; justify-content: flex-end; gap: 8px;
    padding: 14px 22px; border-top: 1px solid var(--neutral-border); background: var(--neutral-surface);
}
.dc-choice[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 8px; }
.dc-choice-opt[b-dk1wwxrhm7] {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--radius-md);
    border: 1.5px solid var(--neutral-border-strong); background: white; cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.dc-choice-opt:hover[b-dk1wwxrhm7] { border-color: var(--brand-200); }
.dc-choice-opt.is-active[b-dk1wwxrhm7] { border-color: var(--brand-400); background: var(--brand-50); }
.dc-choice-opt input[b-dk1wwxrhm7] { accent-color: var(--brand-500); flex-shrink: 0; }
.dc-choice-text[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.dc-choice-main[b-dk1wwxrhm7] { font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink); }
.dc-choice-sub[b-dk1wwxrhm7] { font-size: 11.5px; color: var(--neutral-muted); }
.dc-namefield[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 5px; }
.dc-namefield-label[b-dk1wwxrhm7] { font-size: 10px; font-weight: var(--fw-bold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--neutral-placeholder); }
.dc-input[b-dk1wwxrhm7] {
    height: 36px; padding: 0 12px; border-radius: var(--radius-md);
    border: 1.5px solid var(--neutral-border-strong); background: white;
    font-family: var(--font-sans); font-size: 13px; color: var(--ink); outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.dc-input:focus[b-dk1wwxrhm7] { border-color: var(--brand-400); box-shadow: var(--focus-brand); }

/* CV dropzone (matches the candidate list upload experience) */
.cp-dropzone[b-dk1wwxrhm7] {
    position: relative; border: 2px dashed var(--neutral-border-strong);
    border-radius: var(--radius-md); background: var(--neutral-surface, #f7f9fc);
    padding: 20px 16px; text-align: center; cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.cp-dropzone.is-active[b-dk1wwxrhm7] { border-color: var(--brand-400); background: var(--brand-50, #eef7ff); }
.cp-dropzone-inner[b-dk1wwxrhm7] { display: flex; flex-direction: column; align-items: center; gap: 4px; pointer-events: none; }
.cp-dropzone-icon[b-dk1wwxrhm7] { font-size: 26px; color: var(--brand-400); }
.cp-dropzone-title[b-dk1wwxrhm7] { font-size: 13px; font-weight: var(--fw-bold); color: var(--ink); }
.cp-dropzone-sub[b-dk1wwxrhm7] { font-size: 11px; color: var(--neutral-placeholder); }
.cp-cv-file[b-dk1wwxrhm7] {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    padding: 8px 12px; border-radius: var(--radius-md);
    border: 1.5px solid var(--neutral-border-strong); background: white;
}
.cp-cv-file-name[b-dk1wwxrhm7] { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink); }

/* CV overwrite checkbox groups */
.cp-cv-group[b-dk1wwxrhm7] {
    margin-top: 12px; padding: 12px 14px; border-radius: var(--radius-md);
    border: 1px solid var(--neutral-border); background: var(--neutral-surface, #fafcfd);
}
.cp-cv-group-shared[b-dk1wwxrhm7] { border-color: var(--warning-border); background: var(--warning-bg); }
.cp-cv-group-head[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.cp-cv-group-title[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: var(--fw-bold); letter-spacing: 0.02em; color: var(--ink);
}
.cp-cv-group-shared .cp-cv-group-title[b-dk1wwxrhm7] { color: var(--warning-text); }
.cp-cv-group-hint[b-dk1wwxrhm7] { font-size: 11px; line-height: 1.4; color: var(--neutral-muted); }
.cp-cv-check[b-dk1wwxrhm7] {
    display: flex; align-items: center; gap: 8px; margin: 0;
    font-size: 13px; color: var(--ink); cursor: pointer;
}
.cp-cv-check input[b-dk1wwxrhm7] { accent-color: var(--brand-500); width: 15px; height: 15px; cursor: pointer; }

/* "Creating profile" loading animation */
.cp-creating[b-dk1wwxrhm7] {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: 6px; padding: 44px 28px;
}
.cp-creating-orbit[b-dk1wwxrhm7] {
    position: relative; width: 76px; height: 76px; display: grid; place-items: center; margin-bottom: 10px;
}
.cp-creating-orbit[b-dk1wwxrhm7]::before {
    content: ""; position: absolute; inset: 0; border-radius: 50%;
    background: conic-gradient(from 0deg, var(--brand-600), var(--brand-400), var(--brand-100), var(--brand-600));
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
            mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
    animation: cp-orbit-spin-b-dk1wwxrhm7 1.1s linear infinite;
}
.cp-creating-core[b-dk1wwxrhm7] {
    width: 58px; height: 58px; border-radius: 50%;
    background: var(--brand-50); color: var(--brand-600);
    display: grid; place-items: center; font-size: 24px;
    animation: cp-orbit-pulse-b-dk1wwxrhm7 1.6s ease-in-out infinite;
}
.cp-creating-title[b-dk1wwxrhm7] { font-size: var(--fs-card); font-weight: var(--fw-bold); color: var(--ink); }
.cp-creating-sub[b-dk1wwxrhm7] { font-size: var(--fs-label); color: var(--neutral-muted); max-width: 340px; line-height: 1.45; }
.cp-creating-bar[b-dk1wwxrhm7] {
    margin-top: 16px; width: 220px; height: 6px; border-radius: var(--radius-full);
    background: var(--brand-50); overflow: hidden; position: relative;
}
.cp-creating-bar span[b-dk1wwxrhm7] {
    position: absolute; top: 0; height: 100%; width: 40%; border-radius: var(--radius-full);
    background: linear-gradient(90deg, var(--brand-400), var(--brand-600));
    animation: cp-creating-slide-b-dk1wwxrhm7 1.3s ease-in-out infinite;
}
@keyframes cp-orbit-spin-b-dk1wwxrhm7 { to { transform: rotate(360deg); } }
@keyframes cp-orbit-pulse-b-dk1wwxrhm7 { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.07); } }
@keyframes cp-creating-slide-b-dk1wwxrhm7 { 0% { left: -42%; } 100% { left: 100%; } }
@media (prefers-reduced-motion: reduce) {
    .cp-creating-orbit[b-dk1wwxrhm7]::before, .cp-creating-core[b-dk1wwxrhm7], .cp-creating-bar span[b-dk1wwxrhm7] { animation-duration: 2.4s; }
}
.cp-icon-btn[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; border-radius: var(--radius-md);
    border: 1px solid transparent; background: transparent; color: var(--neutral-label);
    cursor: pointer; transition: background .15s ease, color .15s ease;
}
.cp-icon-btn:hover[b-dk1wwxrhm7] { background: var(--neutral-pill-bg); color: var(--ink); }
.cp-avatar[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 9999px; background: var(--ink); color: var(--brand-400);
    font-weight: var(--fw-bold); letter-spacing: 0.02em; flex-shrink: 0;
}

.cd-idcard[b-dk1wwxrhm7] {
    background: white; border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); overflow: hidden;
}
.cd-id-toolbar[b-dk1wwxrhm7] {
    display: flex; align-items: center; justify-content: space-between; gap: 6px;
    padding: 10px 16px 10px 20px; border-bottom: 1px solid var(--neutral-border); background: var(--neutral-surface);
}
.cd-id-toolbar-title[b-dk1wwxrhm7] { font-size: 12px; font-weight: var(--fw-bold); color: var(--neutral-label); text-transform: uppercase; letter-spacing: 0.08em; }
.cd-id-toolbar-actions[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 6px; }
.cd-id-toolbar .cp-btn[b-dk1wwxrhm7] { height: 32px; padding: 0 12px; font-size: 12px; }
.cd-id-top[b-dk1wwxrhm7] { display: flex; align-items: flex-start; gap: 18px; padding: 22px 24px; }
.cd-id-main[b-dk1wwxrhm7] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.cd-id-namerow[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cd-id-name[b-dk1wwxrhm7] { font-size: var(--fs-title); font-weight: var(--fw-black); color: var(--ink); letter-spacing: -0.01em; margin: 0; }
.cd-id-title[b-dk1wwxrhm7] { font-size: 13px; color: var(--neutral-label); font-weight: var(--fw-medium); }
.cd-id-contacts[b-dk1wwxrhm7] { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }
.cd-contact[b-dk1wwxrhm7] { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--neutral-label); text-decoration: none; }
.cd-contact i[b-dk1wwxrhm7] { color: var(--neutral-placeholder); flex-shrink: 0; }
a.cd-contact:hover[b-dk1wwxrhm7] { color: var(--brand-700); }
a.cd-contact:hover i[b-dk1wwxrhm7] { color: var(--brand-500); }
.cd-id-actions[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 8px; flex-shrink: 0; align-self: flex-start; flex-wrap: wrap; justify-content: flex-end; }

.cd-switcher[b-dk1wwxrhm7] {
    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
    padding: 14px 24px; border-top: 1px solid var(--neutral-border);
    background: var(--neutral-surface);
}
.cd-switcher-label[b-dk1wwxrhm7] { font-size: 10px; font-weight: var(--fw-bold); letter-spacing: 0.09em; text-transform: uppercase; color: var(--neutral-placeholder); }
.cd-chips[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cd-chip[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; gap: 7px;
    height: 32px; padding: 0 14px; border-radius: var(--radius-full);
    border: 1px solid var(--neutral-border-strong); background: white; color: var(--neutral-label);
    font-family: var(--font-sans); font-size: 12.5px; font-weight: var(--fw-semibold);
    cursor: pointer; white-space: nowrap;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.cd-chip:hover[b-dk1wwxrhm7] { border-color: var(--brand-200); color: var(--ink); }
.cd-chip-star[b-dk1wwxrhm7] { color: var(--neutral-placeholder); }
.cd-chip.is-active[b-dk1wwxrhm7] { background: var(--brand-400); border-color: var(--brand-400); color: var(--ink); }
.cd-chip.is-active .cd-chip-star[b-dk1wwxrhm7] { color: var(--ink); }
.cd-switcher-meta[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-wrap: wrap; }
.cd-meta-text[b-dk1wwxrhm7] { font-size: 12px; color: var(--neutral-muted); }
.cd-meta-text strong[b-dk1wwxrhm7] { color: var(--neutral-label); font-weight: var(--fw-semibold); }
.cd-rename[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; gap: 6px;
    height: 32px; padding: 0 6px 0 12px; border-radius: var(--radius-full);
    border: 1.5px solid var(--brand-400); background: white; box-shadow: var(--focus-brand);
}
.cd-rename input[b-dk1wwxrhm7] {
    border: none; outline: none; background: transparent;
    font-family: var(--font-sans); font-size: 12.5px; font-weight: var(--fw-semibold);
    color: var(--ink); width: 140px; min-width: 60px;
}
.cd-rename-btn[b-dk1wwxrhm7] { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: var(--radius-sm); border: none; cursor: pointer; flex-shrink: 0; }
.cd-rename-ok[b-dk1wwxrhm7] { background: var(--ink); color: white; }
.cd-rename-ok:hover[b-dk1wwxrhm7] { background: #1E4256; }
.cd-rename-cancel[b-dk1wwxrhm7] { background: var(--neutral-pill-bg); color: var(--neutral-label); }
.cd-rename-cancel:hover[b-dk1wwxrhm7] { background: var(--neutral-border-strong); color: var(--ink); }

.cd-card-section[b-dk1wwxrhm7] { padding: 22px 24px; border-top: 1px solid var(--neutral-border); }
.cd-section-head[b-dk1wwxrhm7] { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cd-section-title[b-dk1wwxrhm7] { font-size: 13px; font-weight: var(--fw-bold); color: var(--ink); text-transform: uppercase; letter-spacing: 0.08em; }
.cd-bio[b-dk1wwxrhm7] { font-size: 13.5px; line-height: 1.65; color: var(--ink); margin: 0; }
.cd-bio[b-dk1wwxrhm7]  p:last-child { margin-bottom: 0; }

.cd-badge-private[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 2px 8px; border-radius: var(--radius-full);
    background: var(--warning-bg); border: 1px solid var(--warning-border); color: #B45309;
    font-size: 10px; font-weight: var(--fw-bold); letter-spacing: 0.06em; text-transform: uppercase;
}
.cd-badge-private[b-dk1wwxrhm7]::before { content: ""; width: 5px; height: 5px; border-radius: 9999px; background: #B45309; }

.cd-confidential[b-dk1wwxrhm7] { background: var(--info-bg); border: 1px solid var(--info-border); border-radius: var(--radius-lg); }
.cd-confidential-note[b-dk1wwxrhm7] {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 12px 16px; border-bottom: 1px solid var(--info-border);
    font-size: 12.5px; color: var(--brand-800); line-height: 1.5;
}
.cd-confidential-note i[b-dk1wwxrhm7] { color: var(--brand-600); flex-shrink: 0; margin-top: 1px; }
.cd-confidential-note strong[b-dk1wwxrhm7] { font-weight: var(--fw-bold); color: var(--brand-900); }
.cd-confidential-grid[b-dk1wwxrhm7] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 28px; padding: 18px 16px 20px; align-items: start; }
.cd-col[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.cd-field[b-dk1wwxrhm7] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cd-field-label[b-dk1wwxrhm7] { font-size: 10px; font-weight: var(--fw-bold); letter-spacing: 0.09em; text-transform: uppercase; color: var(--neutral-placeholder); }
.cd-field-value[b-dk1wwxrhm7] { font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink); line-height: 1.4; word-wrap: break-word; }
.cd-field-value.is-muted[b-dk1wwxrhm7] { color: var(--neutral-placeholder); font-weight: var(--fw-medium); }
.cd-field-value.is-success[b-dk1wwxrhm7] { color: #15803D; }
.cd-coop-chips[b-dk1wwxrhm7] { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.cd-coop-chip[b-dk1wwxrhm7] {
    display: inline-flex; align-items: center; padding: 3px 9px; border-radius: var(--radius-full);
    background: white; border: 1px solid var(--neutral-border-strong); color: var(--ink);
    font-size: 11px; font-weight: var(--fw-semibold);
}

@media (max-width: 1000px) {
    .cd-confidential-grid[b-dk1wwxrhm7] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .cd-confidential-grid[b-dk1wwxrhm7] { grid-template-columns: 1fr; }
}
/* /Components/Pages/CandidatePages/CandidateDetails/WorkExperience.razor.rz.scp.css */
.summary-container[b-lvjsvyokxn] {
    position: relative;
    overflow: hidden;
}

.loading-overlay[b-lvjsvyokxn] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(248, 249, 250, 0.95);
    backdrop-filter: blur(4px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.loading-overlay.active[b-lvjsvyokxn] {
    opacity: 1;
}

.snake-border[b-lvjsvyokxn] {
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border-radius: 8px;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
}

.snake-border.active[b-lvjsvyokxn] {
    opacity: 1;
}

.snake-border[b-lvjsvyokxn]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    background: linear-gradient(90deg,
    transparent 0%,
    transparent 70%,
    #007bff 80%,
    #0056b3 90%,
    transparent 100%);
    animation: snakeMove-b-lvjsvyokxn 3s linear infinite;
}

.snake-border[b-lvjsvyokxn]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 6px;
    background: #fff;
    z-index: 1;
}

@keyframes snakeMove-b-lvjsvyokxn {
    0% {
        transform: rotate(0deg) scale(1.1);
    }
    25% {
        transform: rotate(90deg) scale(1.1);
    }
    50% {
        transform: rotate(180deg) scale(1.1);
    }
    75% {
        transform: rotate(270deg) scale(1.1);
    }
    100% {
        transform: rotate(360deg) scale(1.1);
    }
}

.updating-text[b-lvjsvyokxn] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #007bff;
    margin-bottom: 0.5rem;
}

.dots[b-lvjsvyokxn] {
    display: inline-block;
    width: 20px;
}

.dots[b-lvjsvyokxn]::after {
    content: '';
    animation: dots-b-lvjsvyokxn 1.5s steps(4, end) infinite;
}

@keyframes dots-b-lvjsvyokxn {
    0%, 20% { content: ''; }
    40% { content: '.'; }
    60% { content: '..'; }
    80%, 100% { content: '...'; }
}

.ai-icon[b-lvjsvyokxn] {
    font-size: 2rem;
    color: #007bff;
    animation: pulse-b-lvjsvyokxn 2s ease-in-out infinite;
}

@keyframes pulse-b-lvjsvyokxn {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.1); }
}

.summary-container.no-clip[b-lvjsvyokxn] {
    overflow: visible;
}
/* /Components/Pages/CandidatePages/CandidateDuplicatesPage.razor.rz.scp.css */
/* Duplicate Candidates — Talents DS (scoped). Tokens from talents-tokens.css */

.cp-page[b-971nov86lq] { display: flex; flex-direction: column; gap: 20px; }
.cp-header-text[b-971nov86lq] { display: flex; flex-direction: column; gap: 6px; }
.cp-title[b-971nov86lq] { font-size: var(--fs-hero); font-weight: var(--fw-black); color: var(--ink); letter-spacing: -0.01em; line-height: 1.1; margin: 0; }
.cp-subtitle[b-971nov86lq] { font-size: var(--fs-body); color: var(--neutral-muted); }

.cp-btn[b-971nov86lq] {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 38px; padding: 0 14px; border-radius: var(--radius-md);
    font-family: var(--font-sans); font-size: 13px; font-weight: var(--fw-semibold); line-height: 1;
    border: 1.5px solid transparent; background: white; color: var(--ink);
    cursor: pointer; white-space: nowrap;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.cp-btn:focus-visible[b-971nov86lq] { outline: none; box-shadow: var(--focus-brand); }
.cp-btn:disabled[b-971nov86lq] { opacity: 0.45; cursor: not-allowed; }
.cp-btn-primary[b-971nov86lq] { background: var(--ink); color: white; border-color: var(--ink); }
.cp-btn-primary:hover:not(:disabled)[b-971nov86lq] { background: #1E4256; border-color: #1E4256; }
.cp-btn-outline[b-971nov86lq] { background: white; color: var(--ink); border-color: var(--neutral-border-strong); }
.cp-btn-outline:hover:not(:disabled)[b-971nov86lq] { border-color: var(--brand-200); background: var(--neutral-surface); }
.cp-btn-sm[b-971nov86lq] { height: 30px; padding: 0 10px; font-size: 12px; }
.cp-btn-danger[b-971nov86lq] { background: var(--error-text); color: white; border-color: var(--error-text); }
.cp-btn-danger:hover:not(:disabled)[b-971nov86lq] { background: #BE123C; border-color: #BE123C; }
.cp-btn-danger-outline[b-971nov86lq] { background: white; border-color: var(--error-border); color: var(--error-text); }
.cp-btn-danger-outline:hover:not(:disabled)[b-971nov86lq] { background: var(--error-bg); border-color: var(--error); color: var(--error-text); }

.cp-table-wrap[b-971nov86lq] {
    background: white; border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2); overflow: hidden; box-shadow: var(--shadow-sm);
}
.cp-table-scroll[b-971nov86lq] { overflow-x: auto; }
.cp-table[b-971nov86lq] { width: 100%; border-collapse: separate; border-spacing: 0; }
.cp-table thead th[b-971nov86lq] {
    background: var(--neutral-surface); border-bottom: 1px solid var(--neutral-border-strong);
    padding: 0; text-align: left; font-weight: var(--fw-semibold);
}
.cp-table tbody td[b-971nov86lq] { padding: 12px 16px; border-bottom: 1px solid var(--neutral-border); font-size: 13px; color: var(--ink); vertical-align: middle; }
.cp-table tbody tr:last-child td[b-971nov86lq] { border-bottom: none; }
.cp-table tbody tr:hover td[b-971nov86lq] { background: var(--neutral-surface); }
.cp-th[b-971nov86lq] { position: relative; display: flex; align-items: center; gap: 4px; padding: 12px 8px 12px 16px; }
.cp-th-right[b-971nov86lq] { justify-content: flex-end; }
.cp-th-label[b-971nov86lq] {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px; margin: -4px 0;
    font-family: var(--font-sans); font-size: 11px; font-weight: var(--fw-bold);
    color: var(--neutral-label); letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap;
}

.cp-name-cell[b-971nov86lq] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cp-avatar[b-971nov86lq] {
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 9999px; background: var(--ink); color: var(--brand-400);
    font-weight: var(--fw-bold); letter-spacing: 0.02em; flex-shrink: 0;
    width: 32px; height: 32px; font-size: 12px;
}

.cp-state[b-971nov86lq] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 64px 24px; text-align: center; }
.cp-state-title[b-971nov86lq] { font-size: 16px; font-weight: var(--fw-bold); color: var(--ink); }
.cp-state-body[b-971nov86lq] { font-size: 13px; color: var(--neutral-muted); max-width: 420px; }

.cp-modal-backdrop[b-971nov86lq] {
    position: fixed; inset: 0; background: rgba(13, 45, 63, 0.35); backdrop-filter: blur(2px);
    display: flex; align-items: center; justify-content: center; padding: 24px; z-index: 1400;
    animation: dc-fade-b-971nov86lq .15s ease;
}
@keyframes dc-fade-b-971nov86lq { from { opacity: 0; } to { opacity: 1; } }

/* dc- duplicate specifics */
.dc-title-icon[b-971nov86lq] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border-radius: var(--radius-lg2);
    background: var(--ink); color: var(--brand-400); flex-shrink: 0;
}
.dc-header[b-971nov86lq] { display: flex; align-items: center; gap: 16px; }
.dc-person[b-971nov86lq] { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.dc-person-name-row[b-971nov86lq] { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; max-width: 100%; }
.dc-person-id[b-971nov86lq] { font-size: 11.5px; color: var(--neutral-muted); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.dc-person-link[b-971nov86lq] { font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink); text-decoration: none; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.dc-person-link:hover[b-971nov86lq] { color: var(--brand-700); text-decoration: underline; }
.dc-person-sub[b-971nov86lq] { font-size: 11.5px; color: var(--neutral-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dc-existing[b-971nov86lq] { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dc-profiles[b-971nov86lq] {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 2px 8px 2px 7px; border-radius: var(--radius-full);
    background: var(--info-bg); color: var(--brand-700); border: 1px solid var(--brand-200);
    font-size: 11px; font-weight: var(--fw-bold); white-space: nowrap; font-variant-numeric: tabular-nums;
}
.dc-profiles i[b-971nov86lq] { color: var(--brand-500); }
.dc-email[b-971nov86lq] { font-size: 12.5px; color: var(--ink); font-variant-numeric: tabular-nums; }
.dc-src[b-971nov86lq] {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 3px 10px 3px 8px; border-radius: var(--radius-full);
    background: white; border: 1px solid var(--neutral-border-strong);
    color: var(--neutral-label); font-size: 11px; font-weight: var(--fw-semibold); white-space: nowrap;
}
.dc-src i[b-971nov86lq] { flex-shrink: 0; color: var(--neutral-placeholder); }
.dc-src-teamtailor[b-971nov86lq] { border-color: var(--brand-200); color: var(--brand-700); }
.dc-src-teamtailor i[b-971nov86lq] { color: var(--brand-500); }
.dc-detected[b-971nov86lq] { display: flex; flex-direction: column; font-variant-numeric: tabular-nums; }
.dc-detected-main[b-971nov86lq] { font-size: 13px; color: var(--ink); font-weight: var(--fw-medium); }
.dc-detected-sub[b-971nov86lq] { font-size: 11px; color: var(--neutral-placeholder); }
.dc-actions[b-971nov86lq] { display: inline-flex; align-items: center; gap: 8px; justify-content: flex-end; }
.dc-empty-icon[b-971nov86lq] {
    width: 56px; height: 56px; border-radius: var(--radius-full);
    background: var(--success-bg); border: 1px solid var(--success-border);
    color: #15803D; display: flex; align-items: center; justify-content: center;
}
.dc-dialog[b-971nov86lq] {
    position: relative; background: white;
    border: 1px solid var(--neutral-card-border); border-radius: var(--radius-xl);
    box-shadow: 0 24px 64px rgba(13,45,63,0.18); width: 100%; max-width: 420px; overflow: hidden;
}
.dc-dialog-body[b-971nov86lq] { padding: 22px 22px 18px; display: flex; flex-direction: column; gap: 14px; }
.dc-dialog-head[b-971nov86lq] { display: flex; align-items: center; gap: 12px; }
.dc-dialog-icon[b-971nov86lq] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: var(--radius-full);
    background: var(--error-bg); color: var(--error-text); border: 1px solid var(--error-border); flex-shrink: 0;
}
.dc-dialog-title[b-971nov86lq] { font-size: 15px; font-weight: var(--fw-bold); color: var(--ink); }
.dc-dialog-text[b-971nov86lq] { font-size: 13px; color: var(--neutral-muted); line-height: 1.55; margin: 0; }
.dc-dialog-text strong[b-971nov86lq] { color: var(--ink); font-weight: var(--fw-semibold); }
.dc-dialog-note[b-971nov86lq] {
    display: flex; align-items: flex-start; gap: 7px;
    font-size: 12.5px; line-height: 1.5; margin: 0;
    padding: 9px 11px; border-radius: var(--radius-md);
    background: var(--brand-50); color: var(--brand-700);
}
.dc-dialog-note i[b-971nov86lq] { margin-top: 1px; flex-shrink: 0; }
.dc-dialog-footer[b-971nov86lq] {
    display: flex; align-items: center; justify-content: flex-end; gap: 8px;
    padding: 14px 22px; border-top: 1px solid var(--neutral-border); background: var(--neutral-surface);
}
.dc-dialog-icon-brand[b-971nov86lq] { background: var(--brand-50); color: var(--brand-700); border-color: var(--brand-200); }

/* Add-as-profile: primary chooser + name fields */
.dc-choice[b-971nov86lq] { display: flex; flex-direction: column; gap: 8px; }
.dc-choice-opt[b-971nov86lq] {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--radius-md);
    border: 1.5px solid var(--neutral-border-strong); background: white; cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}
.dc-choice-opt:hover[b-971nov86lq] { border-color: var(--brand-200); }
.dc-choice-opt.is-active[b-971nov86lq] { border-color: var(--brand-400); background: var(--brand-50); }
.dc-choice-opt input[b-971nov86lq] { accent-color: var(--brand-500); flex-shrink: 0; }
.dc-choice-text[b-971nov86lq] { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.dc-choice-main[b-971nov86lq] { font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink); }
.dc-choice-sub[b-971nov86lq] { font-size: 11.5px; color: var(--neutral-muted); }
.dc-choice-meta[b-971nov86lq] { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--neutral-placeholder); font-variant-numeric: tabular-nums; margin-top: 1px; }
.dc-choice-link[b-971nov86lq] { display: inline-flex; align-items: center; color: var(--neutral-placeholder); line-height: 1; }
.dc-choice-link:hover[b-971nov86lq] { color: var(--brand-700); }

.dc-namefield[b-971nov86lq] { display: flex; flex-direction: column; gap: 5px; }
.dc-namefield-label[b-971nov86lq] { font-size: 10px; font-weight: var(--fw-bold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--neutral-placeholder); }
.dc-input[b-971nov86lq] {
    height: 36px; padding: 0 12px; border-radius: var(--radius-md);
    border: 1.5px solid var(--neutral-border-strong); background: white;
    font-family: var(--font-sans); font-size: 13px; color: var(--ink); outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.dc-input:focus[b-971nov86lq] { border-color: var(--brand-400); box-shadow: var(--focus-brand); }
/* /Components/Pages/CandidatePages/CandidatePreview.razor.rz.scp.css */
.dialog-overlay-preview[b-kqduzags1s] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    padding: 24px;
}

.preview-layout[b-kqduzags1s] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    background: transparent;
}

.pdf-preview-area[b-kqduzags1s] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-kqduzags1s] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-kqduzags1s] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}
/* /Components/Pages/CandidatePages/CandidateRequests/CandidateRequestsPage.razor.rz.scp.css */
.status-history-list[b-h4xk3s5v2e] {
    display: flex;
    flex-direction: column;
}

.history-row[b-h4xk3s5v2e] {
    display: grid;
    grid-template-columns: 120px 165px 110px 20px auto;
    align-items: center;
    gap: 8px;
}

.history-row .separator[b-h4xk3s5v2e] {
    text-align: center;
}

.drop-zone[b-h4xk3s5v2e] {
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.drop-zone[b-h4xk3s5v2e]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.drop-zone:hover[b-h4xk3s5v2e] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.drop-zone.mud-drop-zone-drag-over[b-h4xk3s5v2e] {
    transform: scale(1.02);
    box-shadow: 0 12px 40px rgba(0,0,0,0.2);
}

.drop-zone.mud-drop-zone-drag-over[b-h4xk3s5v2e]::before {
    opacity: 0.1;
}

.drop-zone-requested.mud-drop-zone-drag-over[b-h4xk3s5v2e]::before {
    background: #1976d2;
}

.drop-zone-progress.mud-drop-zone-drag-over[b-h4xk3s5v2e]::before {
    background: #f57c00;
}

.drop-zone-completed.mud-drop-zone-drag-over[b-h4xk3s5v2e]::before {
    background: #388e3c;
}

.drop-zone-cancelled.mud-drop-zone-drag-over[b-h4xk3s5v2e]::before {
    background: #d32f2f;
}

.request-card[b-h4xk3s5v2e] {
    transition: all 0.3s ease;
}

.request-card:hover[b-h4xk3s5v2e] {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.15);
}

.request-card.mud-dragging[b-h4xk3s5v2e] {
    transform: rotate(5deg) scale(1.05);
    box-shadow: 0 15px 50px rgba(0,0,0,0.3);
    z-index: 1000;
}

/* Status-based left borders */
.request-card.status-requested[b-h4xk3s5v2e] {
    border-left: 4px solid #1976d2;
}

.request-card.status-inprogress[b-h4xk3s5v2e] {
    border-left: 4px solid #f57c00;
}

.request-card.status-completed[b-h4xk3s5v2e] {
    border-left: 4px solid #388e3c;
}

.request-card.status-cancelled[b-h4xk3s5v2e] {
    border-left: 4px solid #d32f2f;
}

.text-primary[b-h4xk3s5v2e] { color: #1976d2 !important; }
.text-secondary[b-h4xk3s5v2e] { color: #7b1fa2 !important; }
.text-info[b-h4xk3s5v2e] { color: #0288d1 !important; }
.text-warning[b-h4xk3s5v2e] { color: #f57c00 !important; }
.text-success[b-h4xk3s5v2e] { color: #388e3c !important; }

.font-weight-bold[b-h4xk3s5v2e] { font-weight: 600 !important; }
.font-weight-medium[b-h4xk3s5v2e] { font-weight: 500 !important; }

.details-eye-button:hover[b-h4xk3s5v2e] {
    transform: scale(1.1);
    background-color: rgba(156, 39, 176, 0.4) !important;
    color: rgba(156, 39, 176, 0.4) !important;
    box-shadow: 0 4px 15px rgba(33, 150, 243, 0.4);
}

.ai-update-button:hover[b-h4xk3s5v2e] {
    transform: scale(1.1);
    background-color: rgba(33, 150, 243, 0.4) !important;
    color: rgba(33, 150, 243, 0.4) !important;
    animation: sparkle-b-h4xk3s5v2e 0.6s ease-in-out;
    box-shadow: 0 4px 15px rgba(156, 39, 176, 0.4);
}

@keyframes sparkle-b-h4xk3s5v2e {
    0%, 100% { transform: scale(1.1) rotate(0deg); }
    25% { transform: scale(1.15) rotate(5deg); }
    75% { transform: scale(1.15) rotate(-5deg); }
}

.gap-2[b-h4xk3s5v2e] {
    gap: 0.5rem;
}

/* Loading Animation */
.loader-container[b-h4xk3s5v2e] {
    background: transparent;
    backdrop-filter: blur(20px);
    padding: 40px;
    text-align: center;
}

.ai-brain[b-h4xk3s5v2e] {
    width: 80px;
    height: 80px;
    margin: 0 auto 30px;
    position: relative;
}

.brain-svg[b-h4xk3s5v2e] {
    width: 100%;
    height: 100%;
    animation: pulse-b-h4xk3s5v2e 2s ease-in-out infinite;
}

.neural-network[b-h4xk3s5v2e] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.6;
}

.neural-dot[b-h4xk3s5v2e] {
    width: 4px;
    height: 4px;
    background: #667eea;
    border-radius: 50%;
    position: absolute;
    animation: neuralPulse-b-h4xk3s5v2e 1.5s ease-in-out infinite;
}

.neural-dot:nth-child(1)[b-h4xk3s5v2e] { top: 20%; left: 30%; animation-delay: 0s; }
.neural-dot:nth-child(2)[b-h4xk3s5v2e] { top: 40%; left: 70%; animation-delay: 0.3s; }
.neural-dot:nth-child(3)[b-h4xk3s5v2e] { top: 60%; left: 20%; animation-delay: 0.6s; }
.neural-dot:nth-child(4)[b-h4xk3s5v2e] { top: 80%; left: 60%; animation-delay: 0.9s; }

.title[b-h4xk3s5v2e] {
    font-size: 28px;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 12px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.subtitle[b-h4xk3s5v2e] {
    font-size: 16px;
    color: #718096;
    margin-bottom: 40px;
}

.processing-steps[b-h4xk3s5v2e] {
    text-align: left;
    margin-bottom: 30px;
}

.step[b-h4xk3s5v2e] {
    display: flex;
    align-items: center;
    padding: 12px 0;
    transition: all 0.3s ease;
    border-radius: 8px;
    padding-left: 16px;
    margin-bottom: 8px;
}

.step.active[b-h4xk3s5v2e] {
    background: linear-gradient(90deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.1));
    transform: translateX(8px);
}

.step.completed[b-h4xk3s5v2e] {
    opacity: 0.6;
}

.step-icon[b-h4xk3s5v2e] {
    width: 24px;
    height: 24px;
    margin-right: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.3s ease;
}

.step.active .step-icon[b-h4xk3s5v2e] {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: white;
    animation: spin-b-h4xk3s5v2e 1s linear infinite;
}

.step.completed .step-icon[b-h4xk3s5v2e] {
    background: #48bb78;
    color: white;
}

.step.pending .step-icon[b-h4xk3s5v2e] {
    background: #e2e8f0;
    color: #a0aec0;
}

.step-text[b-h4xk3s5v2e] {
    font-size: 16px;
    font-weight: 500;
    color: #2d3748;
}

.step.active .step-text[b-h4xk3s5v2e] {
    color: #667eea;
    font-weight: 600;
}

.progress-bar[b-h4xk3s5v2e] {
    width: 100%;
    height: 6px;
    background: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 20px;
}

.progress-fill[b-h4xk3s5v2e] {
    width: 20%;
    height: 100%;
    background: linear-gradient(90deg, #667eea, #764ba2);
    border-radius: 3px;
    position: relative;
    animation: fill-b-h4xk3s5v2e 90s steps(10, end) forwards;
}

@keyframes fill-b-h4xk3s5v2e {
    from { width: 20%; }
    to   { width: 100%; }
}

.progress-fill[b-h4xk3s5v2e]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: load 2s infinite;
}

.estimated-time[b-h4xk3s5v2e] {
    margin-top: 16px;
    font-size: 14px;
    color: #718096;
}

@keyframes pulse-b-h4xk3s5v2e {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.05); opacity: 0.8; }
}

@keyframes neuralPulse-b-h4xk3s5v2e {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.2); }
}

@keyframes spin-b-h4xk3s5v2e {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes shimmer-b-h4xk3s5v2e {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

@media (max-width: 480px) {
    .loader-container[b-h4xk3s5v2e] {
        padding: 30px 20px;
    }

    .title[b-h4xk3s5v2e] {
        font-size: 24px;
    }

    .step-text[b-h4xk3s5v2e] {
        font-size: 14px;
    }
}

.cvb-arrow[b-h4xk3s5v2e] {
    fill: rgba(0,0,0,0.54);
    transition: transform .15s ease;
}

.cvb-rotate-180[b-h4xk3s5v2e] {
    transform: rotate(180deg);
}

.cvb-backdrop[b-h4xk3s5v2e] {
    position: fixed;
    inset: 0;
    z-index: 1045;
    background: transparent;
}

.cvb-dropdown[b-h4xk3s5v2e] {
    position: absolute;
    z-index: 1055;
    max-height: 380px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
}

.cvb-list[b-h4xk3s5v2e] {
    max-height: 280px;
    overflow: auto;
    padding-left: 4px;
}

.jobs-select-btn[b-h4xk3s5v2e] {
    height: 60px;
    padding-top: 8px;
    padding-bottom: 8px;
}
/* /Components/Pages/CandidatePages/CandidateRequests/CandidateRequestsStatistics.razor.rz.scp.css */
.stats-container[b-26cstsluhf] {
    border: 2px solid #000;
    border-radius: 8px;
    padding: 1.5rem;
    background-color: #f8f9fa;
    max-width: 1200px;
    margin: 0 auto;
}

.stats-content[b-26cstsluhf] {
    display: flex;
    gap: 4rem;
    align-items: stretch
}

.stats-middle[b-26cstsluhf] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    font-size: 1rem;
    align-items: center;
}

.requests-section[b-26cstsluhf] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    min-width: 180px;
}

.requests-section h4[b-26cstsluhf] {
    margin: 0 0 1rem 0;
    font-size: 0.95rem;
    font-weight: bold;
}

.request-item[b-26cstsluhf] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.request-item:last-child[b-26cstsluhf] {
    margin-bottom: 0;
}

.avg-section[b-26cstsluhf] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    flex: 1;
}

.avg-section h4[b-26cstsluhf] {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    font-weight: bold;
}

.avg-grid[b-26cstsluhf] {
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 0.63rem 0.9rem;
    align-items: center;
    font-size: 0.9rem;
}

.avg-label[b-26cstsluhf] {
    white-space: nowrap;
}

.avg-values[b-26cstsluhf] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.avg-value[b-26cstsluhf] {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    white-space: nowrap;
}
/* /Components/Pages/CandidatePages/CandidatesPage.razor.rz.scp.css */
/* ==========================================================================
   CandidatesPage.razor.css — Talents Design System
   Scoped to the component. Use ::deep to pierce into MudDataGrid / dropdowns.

   Tokens (--brand-*, --ink, --neutral-*, --space-*, --radius-*, --shadow-*)
   are defined globally in colors_and_type.css — make sure that stylesheet is
   referenced from your app's root layout.
   ========================================================================== */

/* ---------- Page chrome ---------- */
.cp-shell[b-wej760vr3o] {
    min-height: 100vh;
    background: var(--neutral-bg, #F8FBFD);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    padding: 1.5rem;
}
.cp-page[b-wej760vr3o] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ---------- Page header ---------- */
.cp-header[b-wej760vr3o] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.cp-header-text[b-wej760vr3o] { display: flex; flex-direction: column; gap: 6px; }
.cp-overline[b-wej760vr3o] {
    font-size: var(--fs-overline, 10px);
    font-weight: var(--fw-bold, 700);
    color: var(--neutral-placeholder, #9BB8C5);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.cp-title[b-wej760vr3o] {
    font-size: var(--fs-hero, 30px);
    font-weight: var(--fw-black, 800);
    color: var(--ink, #0D2D3F);
    letter-spacing: -0.01em;
    line-height: 1.1;
    margin: 0;
}
.cp-title-dot[b-wej760vr3o] { color: var(--brand-400, #4AC4FF); }
.cp-subtitle[b-wej760vr3o] {
    font-size: var(--fs-body, 14px);
    color: var(--neutral-muted, #7A9BAD);
}
.cp-header-actions[b-wej760vr3o] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* ---------- Buttons ---------- */
.cp-btn[b-wej760vr3o] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 38px;
    padding: 0 14px;
    border-radius: var(--radius-md, 8px);
    font-family: inherit;
    font-size: 13px;
    font-weight: var(--fw-semibold, 600);
    line-height: 1;
    border: 1.5px solid transparent;
    background: white;
    color: var(--ink, #0D2D3F);
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    white-space: nowrap;
}
.cp-btn:focus-visible[b-wej760vr3o] { outline: none; box-shadow: var(--focus-brand, 0 0 0 3px rgba(74,196,255,0.18)); }
.cp-btn-primary[b-wej760vr3o] { background: var(--ink, #0D2D3F); color: white; border-color: var(--ink, #0D2D3F); }
.cp-btn-primary:hover:not(:disabled)[b-wej760vr3o] { background: #1E4256; border-color: #1E4256; }
.cp-btn-outline[b-wej760vr3o] { background: white; color: var(--ink, #0D2D3F); border-color: var(--neutral-border-strong, #DDE8EE); }
.cp-btn-outline:hover:not(:disabled)[b-wej760vr3o] { border-color: var(--brand-200, #A8E3F7); background: var(--neutral-surface, #FAFCFD); }
.cp-btn-outline.has-value[b-wej760vr3o] { border-color: var(--brand-400, #4AC4FF); color: var(--brand-700, #0A5F8A); background: var(--brand-50, #E8F8FF); }
.cp-btn-ghost[b-wej760vr3o] { background: transparent; border-color: transparent; color: var(--neutral-label, #4A6878); }
.cp-btn-ghost:hover[b-wej760vr3o] { background: var(--neutral-pill-bg, #F2F5F7); }
.cp-btn-ai[b-wej760vr3o] { background: white; color: var(--ink, #0D2D3F); border-color: var(--brand-200, #A8E3F7); }
.cp-btn-ai:hover:not(:disabled)[b-wej760vr3o] { background: var(--brand-50, #E8F8FF); border-color: var(--brand-400, #4AC4FF); color: var(--brand-700, #0A5F8A); }
.cp-btn-ai span[b-wej760vr3o] { font-size: 11px; font-weight: var(--fw-bold, 700); letter-spacing: 0.04em; }
.cp-btn-icon[b-wej760vr3o] { padding: 0; width: 38px; }
.cp-btn-ai.cp-btn-icon[b-wej760vr3o] { width: auto; padding: 0 12px; }
.cp-btn:disabled[b-wej760vr3o] { opacity: 0.45; cursor: not-allowed; }
.cp-btn-label[b-wej760vr3o] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
.cp-search-actions .cp-btn[b-wej760vr3o] { height: 32px; }
.cp-search-actions .cp-btn-icon[b-wej760vr3o] { width: 32px; }
.cp-search-actions .cp-btn-ai.cp-btn-icon[b-wej760vr3o] { width: 32px; padding: 0; }

.cp-icon-btn[b-wej760vr3o] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: var(--radius-md, 8px);
    border: 1px solid transparent; background: transparent; color: var(--neutral-label, #4A6878);
    cursor: pointer; transition: background .15s ease, color .15s ease;
}
.cp-icon-btn:hover[b-wej760vr3o] { background: var(--neutral-pill-bg, #F2F5F7); color: var(--ink, #0D2D3F); }
.cp-link[b-wej760vr3o] {
    background: none; border: none; padding: 0;
    color: var(--brand-700, #0A5F8A); font-size: 12px; font-weight: var(--fw-semibold, 600);
    cursor: pointer;
}
.cp-link:hover[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); text-decoration: underline; }

/* ---------- Stats host (wraps the CandidatesStatistics component) ---------- */
.cp-stats-host[b-wej760vr3o] {
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-lg2, 12px);
    padding: 12px 16px;
    box-shadow: var(--shadow-sm, 0 1px 4px rgba(13,45,63,0.06));
}

/* ---------- Toolbar ---------- */
.cp-toolbar[b-wej760vr3o] {
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-lg2, 12px);
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: var(--shadow-sm, 0 1px 4px rgba(13,45,63,0.06));
}
.cp-toolbar-row[b-wej760vr3o] {
    display: flex; flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.cp-toolbar-divider[b-wej760vr3o] {
    width: 1px; height: 26px;
    background: var(--neutral-border, #EDF2F5);
    margin: 0 4px;
}
.cp-toolbar-spacer[b-wej760vr3o] { flex: 1; }
.cp-results-bar[b-wej760vr3o] {
    display: flex; align-items: center; flex-wrap: wrap;
    gap: 12px;
    padding: 0 4px;
}
.cp-result-meta[b-wej760vr3o] {
    font-size: 12px;
    color: var(--neutral-muted, #7A9BAD);
}
.cp-result-meta strong[b-wej760vr3o] { color: var(--ink, #0D2D3F); font-weight: var(--fw-semibold, 600); }

.cp-token-badge[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 5px 10px;
    background: var(--brand-50, #E8F8FF);
    border: 1px solid var(--brand-200, #A8E3F7);
    border-radius: var(--radius-full, 9999px);
    color: var(--brand-700, #0A5F8A);
    font-size: 11px;
    font-weight: var(--fw-medium, 500);
}
.cp-token-badge strong[b-wej760vr3o] { font-weight: var(--fw-bold, 700); color: var(--brand-800, #074260); }

/* ---------- Search ---------- */
.cp-search-wrap[b-wej760vr3o] { position: relative; flex: 1; min-width: 280px; }
.cp-search[b-wej760vr3o] {
    display: flex; align-items: center; gap: 10px;
    height: 44px;
    padding: 0 6px 0 14px;
    background: white;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.cp-search > i[b-wej760vr3o] { color: var(--neutral-placeholder, #9BB8C5); flex-shrink: 0; }
.cp-search:focus-within[b-wej760vr3o] { border-color: var(--brand-400, #4AC4FF); box-shadow: var(--focus-brand, 0 0 0 3px rgba(74,196,255,0.18)); }
.cp-search:focus-within > i[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); }
.cp-search-input[b-wej760vr3o] {
    flex: 1;
    border: none; outline: none; background: transparent;
    font-family: inherit;
    font-size: 14px; color: var(--ink, #0D2D3F);
    min-width: 0;
}
.cp-search-input[b-wej760vr3o]::placeholder { color: var(--neutral-placeholder, #9BB8C5); }
.cp-search-actions[b-wej760vr3o] { display: flex; align-items: center; gap: 6px; }

.cp-suggestions[b-wej760vr3o] {
    position: absolute; top: calc(100% + 4px); left: 0; right: 0;
    background: white;
    border: 1px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    box-shadow: var(--shadow-md, 0 2px 16px rgba(13,45,63,0.07));
    list-style: none; margin: 0; padding: 4px;
    max-height: 220px; overflow-y: auto;
    z-index: 30;
}
.cp-suggestions li[b-wej760vr3o] {
    padding: 8px 12px;
    border-radius: var(--radius-sm, 6px);
    font-size: 13px; color: var(--ink, #0D2D3F);
    cursor: pointer;
}
.cp-suggestions li:hover[b-wej760vr3o] { background: var(--neutral-surface, #FAFCFD); }

/* ---------- Excel-style filter popover ---------- */
.cp-dd[b-wej760vr3o] { position: relative; }
.cp-dd.is-open[b-wej760vr3o] { z-index: 50; }
.cp-dd.is-open .cp-btn[b-wej760vr3o] { position: relative; z-index: 52; }
.cp-dd-backdrop[b-wej760vr3o] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 50;
}
.cp-popover[b-wej760vr3o] {
    background: white;
    border: 1px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-lg, 10px);
    box-shadow: var(--shadow-md, 0 2px 16px rgba(13,45,63,0.07));
    z-index: 51;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    display: none;
    flex-direction: column;
    min-width: 280px;
    padding: 0;
}
.cp-popover.show[b-wej760vr3o] {
    display: flex;
}
.cp-popover-header[b-wej760vr3o] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
}
.cp-popover-title[b-wej760vr3o] {
    font-size: 13px; font-weight: var(--fw-semibold, 600); color: var(--ink, #0D2D3F);
}

.cp-search-inline[b-wej760vr3o] {
    display: flex; align-items: center; gap: 8px;
    margin: 10px 12px 6px;
    padding: 0 10px;
    height: 32px;
    background: var(--neutral-surface, #FAFCFD);
    border: 1px solid var(--neutral-border, #EDF2F5);
    border-radius: var(--radius-md, 8px);
}
.cp-search-inline:focus-within[b-wej760vr3o] { border-color: var(--brand-400, #4AC4FF); }
.cp-search-inline > i[b-wej760vr3o] { color: var(--neutral-placeholder, #9BB8C5); }
.cp-search-inline input[b-wej760vr3o] {
    flex: 1; min-width: 0;
    border: none; outline: none; background: transparent;
    font-size: 12px; font-family: inherit; color: var(--ink, #0D2D3F);
}
.cp-search-inline input[b-wej760vr3o]::placeholder { color: var(--neutral-placeholder, #9BB8C5); }

.cp-checklist[b-wej760vr3o] {
    max-height: 240px;
    overflow-y: auto;
    padding: 4px 6px 10px;
}
.cp-check[b-wej760vr3o] {
    display: flex; align-items: center; gap: 10px;
    padding: 6px 8px;
    border-radius: var(--radius-sm, 6px);
    cursor: pointer;
    position: relative;
}
.cp-check:hover[b-wej760vr3o] { background: var(--neutral-surface, #FAFCFD); }
.cp-check input[type="checkbox"][b-wej760vr3o] {
    position: absolute; opacity: 0; pointer-events: none;
    width: 0; height: 0;
}
.cp-check-box[b-wej760vr3o] {
    width: 16px; height: 16px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: 4px;
    background: white;
    display: inline-flex; align-items: center; justify-content: center;
    color: white;
    flex-shrink: 0;
    transition: background .12s ease, border-color .12s ease;
    font-size: 11px;
}
.cp-check-box i[b-wej760vr3o] { opacity: 0; }
.cp-check input:checked + .cp-check-box[b-wej760vr3o] {
    background: var(--ink, #0D2D3F);
    border-color: var(--ink, #0D2D3F);
}
.cp-check input:checked + .cp-check-box i[b-wej760vr3o] { opacity: 1; }
.cp-check-label[b-wej760vr3o] {
    font-size: 13px; color: var(--ink, #0D2D3F);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---------- Table wrap + native (loading) table ---------- */
.cp-table-wrap[b-wej760vr3o] {
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-lg2, 12px);
    overflow: hidden;
    box-shadow: var(--shadow-sm, 0 1px 4px rgba(13,45,63,0.06));
}
.cp-table[b-wej760vr3o] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
.cp-table thead th[b-wej760vr3o] {
    background: var(--neutral-surface, #FAFCFD);
    border-bottom: 1px solid var(--neutral-border-strong, #DDE8EE);
    padding: 0;
    text-align: left;
}
.cp-table tbody td[b-wej760vr3o] {
    padding: 12px 16px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
    font-size: 13px;
    color: var(--ink, #0D2D3F);
    vertical-align: middle;
}
.cp-table tbody tr:last-child td[b-wej760vr3o] { border-bottom: none; }

/* ---------- TH inner (sort + filter) ---------- */
.cp-th[b-wej760vr3o] {
    position: relative;
    display: flex; align-items: center; gap: 4px;
    padding: 12px 8px 12px 16px;
}
.cp-th-with-filter[b-wej760vr3o] {
    min-width: 0;
}
.cp-th-with-filter .cp-th-label[b-wej760vr3o] {
    flex: 1 1 auto;
    min-width: 0;
}
[b-wej760vr3o] .cp-th-with-filter .column-filter-button {
    width: 24px;
    height: 24px;
    padding: 0;
}
.cp-th-label[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 6px;
    background: none; border: none; padding: 4px;
    margin: -4px 0;
    border-radius: var(--radius-sm, 6px);
    font-family: inherit;
    font-size: 11px;
    font-weight: var(--fw-bold, 700);
    color: var(--neutral-label, #4A6878);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
}
.cp-th-label:hover[b-wej760vr3o] { color: var(--ink, #0D2D3F); }
.cp-th-label i[b-wej760vr3o] { color: var(--neutral-placeholder, #9BB8C5); flex-shrink: 0; font-size: 11px; }
.cp-th-label:hover i[b-wej760vr3o] { color: var(--neutral-label, #4A6878); }

.cp-th-filter[b-wej760vr3o] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px;
    border-radius: var(--radius-sm, 6px);
    border: none; background: transparent;
    color: var(--neutral-placeholder, #9BB8C5);
    cursor: pointer;
    position: relative;
    transition: background .12s ease, color .12s ease;
    font-size: 11px;
}
.cp-th-filter:hover[b-wej760vr3o] { background: white; color: var(--ink, #0D2D3F); }
.cp-th-filter.is-active[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); }
.cp-th-filter-dot[b-wej760vr3o] {
    position: absolute; top: 3px; right: 3px;
    width: 6px; height: 6px;
    border-radius: 9999px;
    background: var(--brand-400, #4AC4FF);
    border: 1.5px solid white;
}

/* ---------- Name cell ---------- */
.cp-name-cell[b-wej760vr3o] {
    display: flex; align-items: center; gap: 12px;
    min-width: 0;
}
.cp-name-cell.is-clickable[b-wej760vr3o] { cursor: pointer; }
.cp-avatar[b-wej760vr3o] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    border-radius: 9999px;
    background: var(--ink, #0D2D3F);
    color: var(--brand-400, #4AC4FF);
    font-weight: var(--fw-bold, 700);
    font-size: 11px;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}
.cp-name-text[b-wej760vr3o] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cp-name-line[b-wej760vr3o] { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.cp-profile-badge[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 3px;
    padding: 1px 7px; border-radius: 9999px;
    font-size: 11px; font-weight: var(--fw-semibold, 600);
    background: var(--brand-50, #E8F8FF);
    color: var(--brand-700, #0A5F8A);
    border: 1px solid var(--brand-200, #A8E3F7);
    flex: none;
}
.cp-profile-badge i[b-wej760vr3o] { font-size: 10px; }

.cp-profiles[b-wej760vr3o] { display: flex; flex-direction: column; gap: 6px; padding: 8px 16px 8px 52px; }
.cp-profile-row[b-wej760vr3o] { display: flex; align-items: center; gap: 10px; }
.cp-profile-name[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 6px;
    flex: 0 0 auto; min-width: 130px;
    font-size: 13px; font-weight: var(--fw-semibold, 600);
    color: var(--ink, #0D2D3F);
}
.cp-profile-name i[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); font-size: 12px; }
.cp-tag-muted[b-wej760vr3o] { background: var(--neutral-surface, #F1F5F8); color: var(--neutral-muted, #7A9BAD); }

/* Collapsed-row aggregated competences */
.cp-tags[b-wej760vr3o] { display: flex; flex-wrap: wrap; gap: 4px; }

/* Expanded profiles — summary on top */
.cp-profiles-summary[b-wej760vr3o] {
    display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
    padding: 8px 10px;
    margin-bottom: 4px;
    border-radius: var(--radius-sm, 6px);
    background: var(--neutral-surface, #F1F5F8);
}
.cp-profiles-summary-head[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px; font-weight: var(--fw-semibold, 600);
    color: var(--neutral-label, #4A6878);
}
.cp-profiles-summary-head i[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); }
.cp-profiles-summary-tags[b-wej760vr3o] { display: flex; flex-wrap: wrap; gap: 4px; }
.cp-profiles-summary-stats[b-wej760vr3o] { display: inline-flex; align-items: center; gap: 12px; }

/* Per-profile rows */
.cp-profile-row.is-clickable[b-wej760vr3o] { cursor: pointer; border-radius: var(--radius-sm, 6px); padding: 4px 8px; }
.cp-profile-row.is-clickable:hover[b-wej760vr3o] { background: var(--neutral-surface, #F1F5F8); }
.cp-profile-row.is-clickable:hover .cp-profile-name[b-wej760vr3o] { color: var(--brand-700, #0A5F8A); }
.cp-profile-row.is-clickable:hover .cp-profile-go[b-wej760vr3o] { color: var(--brand-700, #0A5F8A); }
.cp-profile-stats[b-wej760vr3o] { display: inline-flex; align-items: center; gap: 12px; }
.cp-profile-stat[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 12px; color: var(--neutral-muted, #7A9BAD);
}
.cp-profile-stat i[b-wej760vr3o] { font-size: 11px; }
.cp-stat-label[b-wej760vr3o] { font-size: 11px; color: var(--neutral-muted, #7A9BAD); font-weight: var(--fw-medium, 500); }
.cp-profile-go[b-wej760vr3o] { color: var(--neutral-muted, #C2D2DB); font-size: 12px; margin-left: auto; }
.cp-name-link[b-wej760vr3o] {
    font-size: 13px;
    font-weight: var(--fw-semibold, 600);
    color: var(--ink, #0D2D3F);
    text-decoration: none;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cp-name-cell.is-clickable:hover .cp-name-link[b-wej760vr3o] { color: var(--brand-700, #0A5F8A); text-decoration: underline; }
.cp-name-meta[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px;
    color: var(--neutral-muted, #7A9BAD);
}
.cp-name-meta i[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); font-size: 11px; }

.cp-dup-flag[b-wej760vr3o] {
    gap: 4px; padding: 1px 7px; border-radius: 999px;
    background: var(--warning-bg, #FFFBEB); color: #B45309;
    border: 1px solid var(--warning-border, #FDE68A);
    font-weight: var(--fw-semibold, 600); text-decoration: none;
    transition: background .15s ease;
}
.cp-dup-flag:hover[b-wej760vr3o] { background: #FEF3C7; }
.cp-dup-flag i[b-wej760vr3o] { color: #D97706; }

.cp-title-cell[b-wej760vr3o] {
    display: block;
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cp-muted[b-wej760vr3o] { color: var(--neutral-placeholder, #9BB8C5); }

/* ---------- Status pill ---------- */
.cp-status[b-wej760vr3o] {
    display: inline-flex; align-items: center;
    padding: 4px 10px;
    border-radius: 9999px;
    font-size: 11px;
    font-weight: var(--fw-bold, 700);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.cp-status[b-wej760vr3o]::before {
    content: ""; width: 6px; height: 6px; border-radius: 9999px;
    background: currentColor;
    margin-right: 6px;
    opacity: 0.9;
}
.cp-status-open[b-wej760vr3o]    { background: var(--success-bg, #F0FDF4); color: #15803D; border: 1px solid var(--success-border, #BBF7D0); }
.cp-status-hold[b-wej760vr3o]    { background: var(--warning-bg, #FFFBEB); color: #B45309; border: 1px solid var(--warning-border, #FDE68A); }
.cp-status-hired[b-wej760vr3o]   { background: var(--brand-50, #E8F8FF);   color: var(--brand-700, #0A5F8A); border: 1px solid var(--brand-200, #A8E3F7); }
.cp-status-closed[b-wej760vr3o],
.cp-status-neutral[b-wej760vr3o] { background: var(--neutral-pill-bg, #F2F5F7); color: var(--neutral-label, #4A6878); border: 1px solid var(--neutral-border-strong, #DDE8EE); }

/* ---------- Cooperation / source labels ---------- */
.cp-tag[b-wej760vr3o] {
    display: inline-flex; align-items: center;
    padding: 3px 8px;
    border-radius: var(--radius-sm, 6px);
    background: var(--neutral-pill-bg, #F2F5F7);
    color: var(--neutral-label, #4A6878);
    font-size: 11px;
    font-weight: var(--fw-semibold, 600);
}
.cp-source[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 12px;
    color: var(--ink, #0D2D3F);
}
.cp-source-kind[b-wej760vr3o] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 28px;
    padding: 2px 6px;
    background: var(--neutral-pill-bg, #F2F5F7);
    color: var(--neutral-label, #4A6878);
    border-radius: var(--radius-sm, 6px);
    font-size: 10px;
    font-weight: var(--fw-bold, 700);
    letter-spacing: 0.06em;
}
.cp-source-kind.is-otp[b-wej760vr3o] { background: var(--brand-50, #E8F8FF); color: var(--brand-700, #0A5F8A); }

/* ---------- Shared count ---------- */
.cp-shared[b-wej760vr3o] {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 24px; height: 24px; padding: 0 6px;
    border-radius: 9999px;
    background: var(--neutral-pill-bg, #F2F5F7);
    color: var(--neutral-label, #4A6878);
    font-size: 12px;
    font-weight: var(--fw-bold, 700);
    font-variant-numeric: tabular-nums;
}
.cp-shared.is-nonzero[b-wej760vr3o] { background: var(--info-bg, #E8F8FF); color: var(--brand-700, #0A5F8A); }

/* ---------- Date ---------- */
.cp-date[b-wej760vr3o] {
    display: flex; flex-direction: column;
    font-variant-numeric: tabular-nums;
}
.cp-date-main[b-wej760vr3o] { font-size: 13px; color: var(--ink, #0D2D3F); font-weight: var(--fw-medium, 500); }
.cp-date-sub[b-wej760vr3o]  { font-size: 11px; color: var(--neutral-placeholder, #9BB8C5); }

/* ---------- AI match badge ---------- */
.cp-ai[b-wej760vr3o] {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 4px 10px 4px 4px;
    border-radius: 9999px;
    background: white;
    border: 1px solid var(--neutral-border-strong, #DDE8EE);
    font-family: inherit;
    font-size: 12px;
    font-weight: var(--fw-semibold, 600);
    cursor: pointer;
    transition: transform .08s ease, box-shadow .15s ease;
}
.cp-ai:hover[b-wej760vr3o] { box-shadow: var(--shadow-sm, 0 1px 4px rgba(13,45,63,0.06)); transform: translateY(-1px); }
.cp-ai-score[b-wej760vr3o] {
    display: inline-flex; align-items: center;
    background: var(--ink, #0D2D3F);
    color: white;
    font-weight: var(--fw-bold, 700);
    font-size: 11px;
    min-width: 36px; height: 22px;
    padding: 0 6px;
    border-radius: 9999px;
    font-variant-numeric: tabular-nums;
}
.cp-ai-score sup[b-wej760vr3o] { font-size: 8px; margin-left: 1px; font-weight: var(--fw-bold, 700); }
.cp-ai-label[b-wej760vr3o] {
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: var(--fw-bold, 700);
}
.cp-ai-strong[b-wej760vr3o] { border-color: var(--brand-200, #A8E3F7); }
.cp-ai-strong .cp-ai-score[b-wej760vr3o] { background: var(--brand-500, #1AA3E8); }
.cp-ai-strong .cp-ai-label[b-wej760vr3o] { color: var(--brand-700, #0A5F8A); }
.cp-ai-good[b-wej760vr3o]   { border-color: var(--neutral-border-strong, #DDE8EE); }
.cp-ai-good   .cp-ai-score[b-wej760vr3o] { background: var(--ink, #0D2D3F); }
.cp-ai-good   .cp-ai-label[b-wej760vr3o] { color: var(--neutral-label, #4A6878); }
.cp-ai-empty[b-wej760vr3o] {
    color: var(--neutral-placeholder, #9BB8C5);
    font-size: 13px;
}

/* ---------- States: skeleton / empty / error ---------- */
.cp-skeleton[b-wej760vr3o] {
    display: inline-block;
    height: 12px;
    background: linear-gradient(90deg, var(--neutral-border, #EDF2F5) 0%, var(--neutral-pill-bg, #F2F5F7) 50%, var(--neutral-border, #EDF2F5) 100%);
    background-size: 200% 100%;
    border-radius: 4px;
    animation: cp-skeleton-shimmer-b-wej760vr3o 1.4s ease infinite;
}
@keyframes cp-skeleton-shimmer-b-wej760vr3o {
    0%   { background-position: 0% 0%; }
    100% { background-position: -200% 0%; }
}
.cp-state[b-wej760vr3o] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 12px;
    padding: 64px 24px;
    text-align: center;
}
.cp-state-icon[b-wej760vr3o] {
    width: 56px; height: 56px;
    border-radius: 9999px;
    background: var(--neutral-surface, #FAFCFD);
    border: 1px solid var(--neutral-border, #EDF2F5);
    color: var(--neutral-muted, #7A9BAD);
    display: flex; align-items: center; justify-content: center;
    font-size: 22px;
}
.cp-state-title[b-wej760vr3o] { font-size: 16px; font-weight: var(--fw-bold, 700); color: var(--ink, #0D2D3F); }
.cp-state-body[b-wej760vr3o]  { font-size: 13px; color: var(--neutral-muted, #7A9BAD); max-width: 420px; }
.cp-state-error .cp-state-icon[b-wej760vr3o] { background: var(--error-bg, #FFF1F2); border-color: var(--error-border, #FECDD3); color: var(--error-text, #E11D48); }

/* ---------- AI loader ---------- */
.cp-ai-loader[b-wej760vr3o] {
    display: flex; justify-content: center;
    padding: 32px 16px;
}
.cp-ai-loader-card[b-wej760vr3o] {
    width: 100%;
    max-width: 520px;
    background: white;
    border: 1px solid var(--brand-200, #A8E3F7);
    border-radius: var(--radius-xl, 14px);
    padding: 32px 28px;
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    text-align: center;
    box-shadow: var(--shadow-md, 0 2px 16px rgba(13,45,63,0.07));
}
.cp-ai-spinner[b-wej760vr3o] {
    position: relative;
    width: 64px; height: 64px;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--brand-500, #1AA3E8);
    font-size: 22px;
}
.cp-ai-spinner-ring[b-wej760vr3o] {
    position: absolute; inset: 0;
    border: 3px solid var(--brand-100, #C5EDFF);
    border-top-color: var(--brand-400, #4AC4FF);
    border-radius: 50%;
    animation: cp-ai-spin-b-wej760vr3o 1s linear infinite;
}
@keyframes cp-ai-spin-b-wej760vr3o { to { transform: rotate(360deg); } }
.cp-ai-loader-title[b-wej760vr3o] { font-size: 16px; font-weight: var(--fw-bold, 700); color: var(--ink, #0D2D3F); }
.cp-ai-loader-body[b-wej760vr3o]  { font-size: 13px; color: var(--neutral-muted, #7A9BAD); max-width: 360px; }
.cp-ai-funphrase[b-wej760vr3o] {
    margin-top: 6px;
    font-size: 12px;
    color: var(--neutral-muted, #7A9BAD);
    font-style: italic;
    min-height: 1.2em;
}
.cp-ai-funphrase-text[b-wej760vr3o] { animation: cp-ai-phrase-fade-b-wej760vr3o .45s ease-out; }
@keyframes cp-ai-phrase-fade-b-wej760vr3o { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

.cp-ai-steps[b-wej760vr3o] { display: flex; align-items: center; gap: 0; margin-top: 6px; }
.cp-ai-step[b-wej760vr3o] {
    display: inline-flex; flex-direction: column; align-items: center; gap: 6px;
    font-size: 11px;
    font-weight: var(--fw-semibold, 600);
    color: var(--neutral-placeholder, #9BB8C5);
    min-width: 100px;
}
.cp-ai-step-dot[b-wej760vr3o] {
    width: 28px; height: 28px;
    border-radius: 9999px;
    border: 1.5px solid currentColor;
    display: flex; align-items: center; justify-content: center;
    background: white;
    font-size: 11px;
    font-weight: var(--fw-bold, 700);
}
.cp-ai-step.is-active[b-wej760vr3o] { color: var(--brand-500, #1AA3E8); }
.cp-ai-step.is-active .cp-ai-step-dot[b-wej760vr3o] { background: var(--brand-50, #E8F8FF); box-shadow: var(--focus-brand, 0 0 0 3px rgba(74,196,255,0.18)); }
.cp-ai-step.is-done[b-wej760vr3o]   { color: var(--success, #22C55E); }
.cp-ai-step.is-done   .cp-ai-step-dot[b-wej760vr3o] { background: var(--success, #22C55E); color: white; border-color: var(--success, #22C55E); }
.cp-ai-step-line[b-wej760vr3o] {
    height: 2px; width: 40px;
    background: var(--neutral-border, #EDF2F5);
    margin-bottom: 22px;
}
.cp-ai-step-line.is-done[b-wej760vr3o] { background: var(--success, #22C55E); }

/* ---------- Pagination ---------- */
.cp-pagination[b-wej760vr3o] {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    padding: 16px;
}

/* ---------- Modal ---------- */
.cp-modal-backdrop[b-wej760vr3o] {
    position: fixed; inset: 0;
    background: rgba(13, 45, 63, 0.35);
    backdrop-filter: blur(2px);
    display: flex; align-items: center; justify-content: center;
    padding: 24px;
    z-index: 1050;
    animation: cp-fade-b-wej760vr3o .15s ease;
}
@keyframes cp-fade-b-wej760vr3o { from { opacity: 0; } to { opacity: 1; } }
.cp-modal[b-wej760vr3o] {
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-xl, 14px);
    box-shadow: 0 24px 64px rgba(13,45,63,0.18);
    width: 100%; max-width: 640px;
    max-height: calc(100vh - 48px);
    display: flex; flex-direction: column;
    overflow: hidden;
}
.cp-modal-header[b-wej760vr3o] {
    padding: 20px 24px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.cp-modal-title[b-wej760vr3o] {
    display: flex; align-items: center; gap: 10px;
    font-size: 16px; font-weight: var(--fw-bold, 700); color: var(--ink, #0D2D3F);
}
.cp-modal-title-meta[b-wej760vr3o] {
    font-size: 13px; color: var(--neutral-muted, #7A9BAD); font-weight: var(--fw-regular, 400);
}
.cp-modal-body[b-wej760vr3o] {
    padding: 20px 24px;
    overflow-y: auto;
    display: flex; flex-direction: column; gap: 20px;
}
.cp-modal-footer[b-wej760vr3o] {
    padding: 14px 24px;
    border-top: 1px solid var(--neutral-border, #EDF2F5);
    display: flex; align-items: center; justify-content: flex-end; gap: 8px;
}
.cp-modal-section[b-wej760vr3o] { display: flex; flex-direction: column; gap: 8px; }
.cp-modal-section-title[b-wej760vr3o] {
    font-size: 10px;
    font-weight: var(--fw-bold, 700);
    color: var(--neutral-placeholder, #9BB8C5);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    display: flex; align-items: center; gap: 6px;
    margin: 0;
}
.cp-modal-section-title.is-success[b-wej760vr3o] { color: #15803D; }
.cp-modal-section-title.is-warning[b-wej760vr3o] { color: #B45309; }
.cp-modal-section p[b-wej760vr3o] {
    margin: 0;
    font-size: 13px;
    color: var(--ink, #0D2D3F);
    line-height: 1.55;
}
.cp-modal-list[b-wej760vr3o] { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.cp-modal-list li[b-wej760vr3o] {
    display: flex; align-items: flex-start; gap: 8px;
    font-size: 13px; color: var(--ink, #0D2D3F); line-height: 1.5;
}
.cp-modal-list li[b-wej760vr3o]::before {
    content: ""; width: 5px; height: 5px;
    background: var(--brand-400, #4AC4FF); border-radius: 9999px;
    margin-top: 8px; flex-shrink: 0;
}
.cp-modal-list.is-warning li[b-wej760vr3o]::before { background: var(--warning, #F59E0B); }
.cp-modal-list.is-success li[b-wej760vr3o]::before { background: var(--success, #22C55E); }
.cp-modal-ai-summary[b-wej760vr3o] {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px;
    background: var(--brand-50, #E8F8FF);
    border: 1px solid var(--brand-200, #A8E3F7);
    border-radius: var(--radius-md, 8px);
}

/* ==========================================================================
   MudDataGrid overrides (use ::deep to pierce the component boundary)
   ========================================================================== */

[b-wej760vr3o] .mud-table { border-radius: 0; }
[b-wej760vr3o] .mud-table .mud-table-head .mud-table-cell {
    background: var(--neutral-surface, #FAFCFD);
    border-bottom: 1px solid var(--neutral-border-strong, #DDE8EE) !important;
    padding: 0;
    font-weight: var(--fw-semibold, 600);
    color: var(--neutral-label, #4A6878);
}
[b-wej760vr3o] .mud-table .mud-table-cell {
    padding: 12px 16px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
    font-family: var(--font-sans, "Inter", sans-serif);
    font-size: 13px;
    color: var(--ink, #0D2D3F);
}
[b-wej760vr3o] .mud-table .mud-table-row:hover > td {
    background: var(--neutral-surface, #FAFCFD);
}
[b-wej760vr3o] .cp-grid--clickable tbody tr {
    cursor: pointer;
}
/* ==========================================================================
   Bootstrap dropdown overrides (used by the toolbar filters)
   ========================================================================== */

[b-wej760vr3o] .dropdown-menu.cp-popover {
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 1100px) {
    .cp-shell[b-wej760vr3o] { padding: 1.5rem; }
}
@media (max-width: 720px) {
    .cp-shell[b-wej760vr3o] { padding: 1rem; }
    .cp-toolbar[b-wej760vr3o] { padding: 12px; }
    .cp-search-wrap[b-wej760vr3o] { flex-basis: 100%; min-width: 0; }
    .cp-toolbar-spacer[b-wej760vr3o] { display: none; }
    .cp-btn-ai span[b-wej760vr3o] { display: none; }
    .cp-btn-label[b-wej760vr3o] { max-width: 120px; }
    .cp-popover[b-wej760vr3o] { min-width: 240px; }
    .cp-modal-backdrop[b-wej760vr3o] { padding: 12px; }
}
/* /Components/Pages/CandidatePages/CandidatesStatistics.razor.rz.scp.css */
.cs-root[b-cxs7itfxxo] {
    width: 100%;
}

.cs-card[b-cxs7itfxxo] {
    background: #fff;
    border: 1px solid var(--neutral-card-border, #dfe8ee);
    border-radius: 12px;
    padding: 8px 10px;
    /* The strip (9 columns + date-range controls) scrolls inside the card,
       so the picker is always contained by the card background. */
    overflow-x: auto;
    overflow-y: hidden;
}

.cs-row[b-cxs7itfxxo] {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
    min-width: 0;
}

.cs-item[b-cxs7itfxxo] {
    padding: 2px 14px;
    border-left: 1px solid var(--neutral-border, #e2ebf0);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 98px;
    /* Never shrink below content — otherwise the Activity date overlaps Total. */
    flex: 0 0 auto;
}

.cs-item:first-child[b-cxs7itfxxo] {
    border-left: none;
}

.cs-item-activity[b-cxs7itfxxo] {
    min-width: 200px;
}

.cs-label[b-cxs7itfxxo] {
    font-size: 10px;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
    color: var(--neutral-placeholder, #9bb8c5);
    margin-bottom: 4px;
    white-space: nowrap;
}

.cs-value-single[b-cxs7itfxxo] {
    font-size: 16px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--ink, #0d2d3f);
    white-space: nowrap;
}

.cs-value-pair[b-cxs7itfxxo] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
}

.cs-main[b-cxs7itfxxo] {
    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    color: var(--ink, #0d2d3f);
    font-variant-numeric: tabular-nums;
}

.cs-total[b-cxs7itfxxo] {
    font-size: 14px;
    line-height: 1;
    font-weight: 600;
    color: var(--neutral-label, #4a6878);
    font-variant-numeric: tabular-nums;
}

.cs-controls[b-cxs7itfxxo] {
    margin-left: auto;
    border-left: 1px solid var(--neutral-border, #e2ebf0);
    padding-left: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.cs-nav[b-cxs7itfxxo] {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: var(--neutral-label, #6f8896);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 6px;
}

.cs-nav:hover[b-cxs7itfxxo] {
    background: var(--neutral-surface, #f8fbfd);
    color: var(--ink, #0d2d3f);
}

.cs-picker-shell[b-cxs7itfxxo] {
    height: 38px;
    width: 360px;
    min-width: 360px;
    border: 1px solid var(--neutral-border-strong, #d3e2ea);
    border-radius: 6px;
    background: #fff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
    /* Keep the date-range picker contained inside the pill (no spill past the border). */
    overflow: hidden;
}

.cs-picker-icon[b-cxs7itfxxo] {
    color: var(--neutral-label, #6f8896);
    font-size: 15px;
}

[b-cxs7itfxxo] .cs-date-picker {
    flex: 1 1 auto;
    min-width: 0;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input-control {
    margin: 0;
    width: 100%;
    min-width: 0;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input {
    width: 100%;
    min-width: 0;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input.mud-input-text-no-margin {
    margin: 0;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input-slot {
    height: 36px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: var(--ink, #0d2d3f);
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-cxs7itfxxo] .cs-date-picker input {
    font-weight: 700;
    width: 100%;
    min-width: 0;
    text-overflow: ellipsis;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input-underline:before,
[b-cxs7itfxxo] .cs-date-picker .mud-input-underline:after {
    display: none;
}

[b-cxs7itfxxo] .cs-date-picker .mud-input-adornment {
    display: none;
}

.cs-loading[b-cxs7itfxxo],
.cs-error[b-cxs7itfxxo] {
    min-height: 56px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--neutral-label, #4a6878);
}

.cs-error[b-cxs7itfxxo] {
    color: #dc3545;
}

/* /Components/Pages/CandidatePages/ClientCandidatePreview.razor.rz.scp.css */
.cp-page[b-bs89gkrukn], .cp-shell[b-bs89gkrukn], .cp-topbar[b-bs89gkrukn], .cp-modal-backdrop[b-bs89gkrukn], .cp-pin[b-bs89gkrukn], .cp-loading[b-bs89gkrukn], .cp-expired[b-bs89gkrukn] {
    --brand-50: #E8F8FF;
    --brand-100: #C5EDFF;
    --brand-200: #A8E3F7;
    --brand-400: #4AC4FF;
    --brand-500: #1AA3E8;
    --brand-600: #0D80BB;
    --brand-700: #0A5F8A;
    --brand-800: #074260;
    --ink: #0D2D3F;
    --bg: #F8FBFD;
    --surface: #FAFCFD;
    --border: #EDF2F5;
    --border-strong: #DDE8EE;
    --card-border: #E2EBF0;
    --muted: #7A9BAD;
    --placeholder: #9BB8C5;
    --label: #4A6878;
    --pill-bg: #F2F5F7;
    --warning: #F59E0B;
    --warning-bg: #FFFBEB;
    --warning-border: #FDE68A;
    --warning-text: #92400E;
    --error: #F43F5E;
    --error-bg: #FFF1F2;
    --error-border: #FECDD3;
    --error-text: #E11D48;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-lg2: 12px;
    --radius-xl: 14px;
    --radius-xl2: 16px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 4px rgba(13, 45, 63, .06);
    --shadow-md: 0 2px 16px rgba(13, 45, 63, .07);
    --shadow-lg: 0 12px 40px rgba(13, 45, 63, .18);
    --focus-brand: 0 0 0 3px rgba(74, 196, 255, .18);
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-family: var(--font-sans);
    color: var(--ink);
}

.cp-page *[b-bs89gkrukn], .cp-topbar *[b-bs89gkrukn], .cp-modal-backdrop *[b-bs89gkrukn], .cp-pin *[b-bs89gkrukn], .cp-loading *[b-bs89gkrukn], .cp-expired *[b-bs89gkrukn] {
    box-sizing: border-box;
}

.cp-page[b-bs89gkrukn] {
    min-height: 100vh;
    background: var(--bg);
}

.cp-topbar[b-bs89gkrukn] {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: saturate(140%) blur(8px);
    -webkit-backdrop-filter: saturate(140%) blur(8px);
    border-bottom: 1px solid var(--border);
}

.cp-topbar-inner[b-bs89gkrukn] {
    max-width: 1120px;
    margin: 0 auto;
    height: 64px;
    padding: 0 24px;
    display: flex;
    align-items: center;
    gap: 16px;
}

.cp-brand[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.cp-brand-logo[b-bs89gkrukn] {
    height: 28px;
    width: auto;
    display: block;
}

.cp-vsep[b-bs89gkrukn] {
    width: 1px;
    height: 24px;
    background: var(--border-strong);
}

.cp-brand-context[b-bs89gkrukn] {
    font-size: 11px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .09em;
    text-transform: uppercase;
}

.cp-actions[b-bs89gkrukn] {
    margin-left: auto;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.cp-btn[b-bs89gkrukn] {
    height: 38px;
    padding: 0 16px;
    border-radius: var(--radius-lg);
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1.5px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease-out, color 150ms ease-out,
                border-color 150ms ease-out, box-shadow 150ms ease-out;
}

.cp-btn:disabled[b-bs89gkrukn] {
    opacity: .45;
    cursor: default;
}

.cp-btn-primary[b-bs89gkrukn] {
    background: var(--ink);
    color: #fff;
}

.cp-btn-primary:hover:not(:disabled)[b-bs89gkrukn] {
    background: #1E4256;
}

.cp-btn-outline[b-bs89gkrukn] {
    background: #fff;
    color: var(--ink);
    border-color: var(--border-strong);
}

.cp-btn-outline:hover:not(:disabled)[b-bs89gkrukn] {
    background: var(--bg);
    border-color: var(--brand-200);
}

.cp-btn-destructive[b-bs89gkrukn] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}

.cp-btn-destructive:hover:not(:disabled)[b-bs89gkrukn] {
    background: #FFE4E6;
}

.cp-btn-warning[b-bs89gkrukn] {
    background: var(--warning-bg);
    color: var(--warning-text);
    border-color: var(--warning-border);
}

.cp-btn-warning:hover:not(:disabled)[b-bs89gkrukn] {
    background: #FEF3C7;
}

.cp-btn-lg[b-bs89gkrukn] {
    height: 46px;
    padding: 0 22px;
    font-size: 14px;
}

.cp-btn-icon[b-bs89gkrukn] {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: var(--radius-md);
    background: transparent;
    border: 1px solid transparent;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 150ms ease-out, color 150ms ease-out;
}

.cp-btn-icon:hover[b-bs89gkrukn] {
    background: var(--pill-bg);
    color: var(--ink);
}

.cp-shell[b-bs89gkrukn] {
    max-width: 1120px;
    margin: 0 auto;
    padding: 32px 24px 80px;
}

.cp-grid[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
}

@media (max-width: 980px) {
    .cp-grid[b-bs89gkrukn] {
        grid-template-columns: 1fr;
    }
}

.cp-header[b-bs89gkrukn] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    padding: 28px 30px;
    margin-bottom: 20px;
}

.cp-id-row[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.cp-id[b-bs89gkrukn] {
    font-size: 11px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .09em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.cp-id b[b-bs89gkrukn] {
    color: var(--label);
    font-weight: 700;
}

.cp-id .sep[b-bs89gkrukn] {
    width: 1px;
    height: 12px;
    background: var(--border-strong);
}

.cp-status-cluster[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.cp-status-meta[b-bs89gkrukn] {
    font-size: 11px;
    color: var(--placeholder);
    font-weight: 500;
}

.cp-status-meta b[b-bs89gkrukn] {
    color: var(--label);
    font-weight: 600;
}

.cp-job-title[b-bs89gkrukn] {
    font-size: 30px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1.15;
    margin: 0 0 18px;
}

.cp-summary-label[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .09em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.cp-summary-body[b-bs89gkrukn] {
    font-size: 14px;
    line-height: 1.6;
    color: var(--label);
    max-width: 780px;
    margin: 0;
}

.status-badge[b-bs89gkrukn] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: var(--radius-full);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    border: 1px solid transparent;
}

.status-badge .dot[b-bs89gkrukn] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
}

.status-under-review[b-bs89gkrukn] {
    background: var(--pill-bg);
    color: var(--label);
}

.status-under-review .dot[b-bs89gkrukn] {
    background: var(--muted);
}

.status-interview[b-bs89gkrukn] {
    background: var(--brand-50);
    color: var(--brand-700);
    border-color: var(--brand-200);
}

.status-interview .dot[b-bs89gkrukn] {
    background: var(--brand-400);
}

.status-hold[b-bs89gkrukn] {
    background: var(--warning-bg);
    color: var(--warning-text);
    border-color: var(--warning-border);
}

.status-hold .dot[b-bs89gkrukn] {
    background: var(--warning);
}

.status-pass[b-bs89gkrukn] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}

.status-pass .dot[b-bs89gkrukn] {
    background: var(--error);
}

.section-card[b-bs89gkrukn] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    margin-bottom: 14px;
    overflow: hidden;
}

.section-title[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 24px;
    cursor: pointer;
    user-select: none;
    transition: background 150ms ease-out;
}

.section-title:hover[b-bs89gkrukn] {
    background: #FBFDFE;
}

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

.section-icon[b-bs89gkrukn] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    background: var(--brand-50);
    color: var(--brand-600);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.section-label[b-bs89gkrukn] {
    font-size: 17px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.005em;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.section-count[b-bs89gkrukn] {
    font-size: 14px;
    font-weight: 600;
    color: var(--placeholder);
    line-height: 1;
}

.section-chevron[b-bs89gkrukn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: var(--muted);
    transition: transform 200ms ease-out;
}

.section-card.open .section-chevron[b-bs89gkrukn] {
    transform: rotate(180deg);
}

.section-content[b-bs89gkrukn] {
    display: none;
    padding: 4px 24px 24px;
    border-top: 1px solid var(--border);
}

.section-card.open .section-content[b-bs89gkrukn] {
    display: block;
}

.col-list[b-bs89gkrukn] {
    column-count: 3;
    column-gap: 24px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.col-list--2[b-bs89gkrukn] {
    column-count: 2;
}

@media (max-width: 780px) {
    .col-list[b-bs89gkrukn] {
        column-count: 2;
    }
}

@media (max-width: 520px) {
    .col-list[b-bs89gkrukn],
    .col-list--2[b-bs89gkrukn] {
        column-count: 1;
    }
}

.col-list li[b-bs89gkrukn] {
    break-inside: avoid;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: var(--ink);
    font-weight: 500;
    padding: 6px 0;
}

.col-list li[b-bs89gkrukn]::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--brand-400);
    flex-shrink: 0;
}

.ai-summary[b-bs89gkrukn] {
    margin-top: 18px;
    padding: 16px 18px;
    background: var(--brand-50);
    border: 1px solid var(--brand-200);
    border-radius: var(--radius-lg2);
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--brand-800);
}

.ai-summary-label[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--brand-600);
    letter-spacing: .10em;
    text-transform: uppercase;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.exp-list[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 8px;
}

.exp-item[b-bs89gkrukn] {
    position: relative;
    padding: 18px 0 22px 28px;
    border-left: 1.5px solid var(--border);
    margin-left: 8px;
}

.exp-item:last-child[b-bs89gkrukn] {
    padding-bottom: 6px;
}

.exp-item[b-bs89gkrukn]::before {
    content: "";
    position: absolute;
    left: -7px;
    top: 22px;
    width: 12px;
    height: 12px;
    border-radius: 9999px;
    background: #fff;
    border: 2.5px solid var(--brand-400);
}

.exp-item.current[b-bs89gkrukn]::before {
    background: var(--brand-400);
    border-color: var(--ink);
}

.exp-head[b-bs89gkrukn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.exp-role[b-bs89gkrukn] {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.3;
}

.exp-company[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--label);
    font-weight: 500;
    margin-top: 3px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.exp-company .nda-pill[b-bs89gkrukn] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: var(--ink);
    color: var(--brand-400);
    padding: 2px 8px;
    border-radius: 9999px;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: .10em;
}

.exp-dates[b-bs89gkrukn] {
    font-size: 11px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.exp-project[b-bs89gkrukn] {
    margin-top: 12px;
    padding: 12px 14px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

.exp-project-name[b-bs89gkrukn] {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
}

.exp-project-overview[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--label);
    line-height: 1.55;
    margin-top: 4px;
}

.exp-resp[b-bs89gkrukn] {
    margin: 12px 0 0;
    padding-left: 18px;
    font-size: 13.5px;
    color: var(--label);
    line-height: 1.65;
}

.exp-resp li[b-bs89gkrukn] {
    margin-bottom: 2px;
}

.exp-resp li[b-bs89gkrukn]::marker {
    color: var(--brand-400);
}

.exp-summary[b-bs89gkrukn] {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--muted);
    font-style: italic;
}

.exp-meta-grid[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--border);
}

.exp-meta-row[b-bs89gkrukn] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: flex-start;
}

.exp-meta-label[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .10em;
    text-transform: uppercase;
    min-width: 90px;
    padding-top: 5px;
    flex-shrink: 0;
}

.exp-meta-tags[b-bs89gkrukn] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    flex: 1;
}

.tag[b-bs89gkrukn] {
    display: inline-flex;
    align-items: center;
    background: var(--pill-bg);
    color: var(--label);
    font-size: 11.5px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--radius-sm);
}

.tag-brand[b-bs89gkrukn] {
    background: var(--brand-50);
    color: var(--brand-700);
}

.exp-achievements[b-bs89gkrukn] {
    margin: 6px 0 0;
    padding-left: 18px;
    font-size: 13.5px;
    color: var(--label);
    line-height: 1.65;
}

.exp-achievements li[b-bs89gkrukn]::marker {
    color: var(--brand-400);
}

.edu-list[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 8px;
}

.edu-item[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    gap: 14px;
    padding: 14px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg2);
    align-items: center;
}

.edu-icon[b-bs89gkrukn] {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-md);
    background: #fff;
    border: 1px solid var(--card-border);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--brand-600);
}

.edu-degree[b-bs89gkrukn] {
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
}

.edu-inst[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--label);
    margin-top: 2px;
}

.edu-years[b-bs89gkrukn] {
    font-size: 11px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .06em;
    text-transform: uppercase;
}

.lang-grid[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
    margin-top: 8px;
}

.lang-row[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-md);
    background: #fff;
}

.lang-name[b-bs89gkrukn] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}

.lang-level[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--brand-600);
    background: var(--brand-50);
    padding: 3px 9px;
    border-radius: 9999px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.cp-side[b-bs89gkrukn] {
    position: sticky;
    top: 88px;
    align-self: start;
}

.cp-side-card[b-bs89gkrukn] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    padding: 20px;
}

.cp-side-overline[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .10em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.cp-side-title[b-bs89gkrukn] {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.3;
}

.cp-side-sub[b-bs89gkrukn] {
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.5;
    margin-top: 4px;
}

.cp-side-actions[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
}

.cp-side-actions .cp-btn[b-bs89gkrukn] {
    width: 100%;
    height: 42px;
}

.cp-modal-backdrop[b-bs89gkrukn] {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(13, 45, 63, .40);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: cp-fadein-b-bs89gkrukn 150ms ease-out;
}

@keyframes cp-fadein-b-bs89gkrukn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes cp-slideup-b-bs89gkrukn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.cp-modal[b-bs89gkrukn] {
    background: #fff;
    border-radius: var(--radius-xl2);
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 520px;
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: cp-slideup-b-bs89gkrukn 180ms ease-out;
}

.cp-modal-lg[b-bs89gkrukn] {
    max-width: 680px;
}

.cp-modal-header[b-bs89gkrukn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 16px;
}

.cp-modal-title[b-bs89gkrukn] {
    font-size: 18px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -0.005em;
}

.cp-modal-sub[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--muted);
    margin-top: 4px;
    line-height: 1.5;
}

.cp-modal-body[b-bs89gkrukn] {
    padding: 8px 24px 20px;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.cp-modal-footer[b-bs89gkrukn] {
    padding: 16px 24px;
    border-top: 1px solid var(--border);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
}

.cp-modal-footer-helper[b-bs89gkrukn] {
    margin-right: auto;
    font-size: 12px;
    color: var(--placeholder);
    display: flex;
    align-items: center;
    gap: 6px;
}

.field[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.field-label[b-bs89gkrukn] {
    font-size: 12px;
    font-weight: 600;
    color: var(--label);
}

.field-required[b-bs89gkrukn] {
    color: var(--error);
}

.input[b-bs89gkrukn],
.select[b-bs89gkrukn],
.textarea[b-bs89gkrukn] {
    width: 100%;
    font-family: var(--font-sans);
    font-size: 14px;
    color: var(--ink);
    background: #fff;
    border: 1.5px solid var(--border-strong);
    border-radius: var(--radius-md);
    outline: none;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}

.input[b-bs89gkrukn],
.select[b-bs89gkrukn] {
    height: 42px;
    padding: 0 12px;
}

.textarea[b-bs89gkrukn] {
    padding: 10px 12px;
    min-height: 88px;
    line-height: 1.5;
    resize: vertical;
}

.input:focus[b-bs89gkrukn],
.select:focus[b-bs89gkrukn],
.textarea:focus[b-bs89gkrukn] {
    border-color: var(--brand-400);
    box-shadow: var(--focus-brand);
}

.input[b-bs89gkrukn]::placeholder,
.textarea[b-bs89gkrukn]::placeholder {
    color: var(--placeholder);
}

.select[b-bs89gkrukn] {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%237A9BAD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 34px;
}

.field-helper[b-bs89gkrukn] {
    font-size: 12px;
    color: var(--placeholder);
    line-height: 1.4;
}

.radio-group[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.radio-card[b-bs89gkrukn] {
    position: relative;
    border: 1.5px solid var(--border-strong);
    border-radius: var(--radius-lg);
    padding: 14px 14px 14px 40px;
    cursor: pointer;
    background: #fff;
    transition: border-color 150ms ease-out, background 150ms ease-out;
    display: block;
}

.radio-card:hover[b-bs89gkrukn] {
    border-color: var(--brand-200);
}

.radio-card.checked[b-bs89gkrukn] {
    border-color: var(--brand-400);
    background: var(--brand-50);
}

.radio-card .dot[b-bs89gkrukn] {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    border: 2px solid var(--border-strong);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 150ms;
}

.radio-card.checked .dot[b-bs89gkrukn] {
    border-color: var(--brand-400);
}

.radio-card.checked .dot[b-bs89gkrukn]::after {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background: var(--brand-400);
}

.radio-card .rc-title[b-bs89gkrukn] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
}

.radio-card .rc-sub[b-bs89gkrukn] {
    font-size: 11.5px;
    color: var(--muted);
    margin-top: 2px;
    line-height: 1.4;
}

.dt-row[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 32px;
    gap: 8px;
    align-items: end;
}

.dt-row .field-label[b-bs89gkrukn] {
    font-size: 11px;
}

.dt-row .cp-btn-icon[b-bs89gkrukn] {
    height: 42px;
    width: 42px;
    color: var(--muted);
}

.dt-row .cp-btn-icon:hover[b-bs89gkrukn] {
    background: var(--error-bg);
    color: var(--error-text);
}

.dt-add[b-bs89gkrukn] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--brand-600);
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 6px 0;
}

.dt-add:hover[b-bs89gkrukn] {
    color: var(--brand-700);
}

.rating-row[b-bs89gkrukn] {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 14px;
    align-items: center;
}

.rating-label[b-bs89gkrukn] {
    font-size: 13px;
    font-weight: 600;
    color: var(--label);
}

.rating-stars[b-bs89gkrukn] {
    display: inline-flex;
    gap: 4px;
}

.star-btn[b-bs89gkrukn] {
    background: transparent;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: var(--border-strong);
    font-size: 22px;
    line-height: 1;
    transition: color 120ms ease-out, transform 120ms ease-out;
}

.star-btn:hover[b-bs89gkrukn] {
    color: var(--brand-400);
    transform: scale(1.08);
}

.star-btn.filled[b-bs89gkrukn] {
    color: var(--brand-400);
}

.star-btn:focus-visible[b-bs89gkrukn] {
    outline: 2px solid var(--brand-400);
    outline-offset: 2px;
    border-radius: 4px;
}

.confirm-watermark[b-bs89gkrukn] {
    position: relative;
    padding: 32px 24px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-align: center;
}

.confirm-watermark[b-bs89gkrukn]::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 50% 30%, rgba(74, 196, 255, .12), transparent 60%);
    pointer-events: none;
}

.confirm-mark[b-bs89gkrukn] {
    width: 64px;
    height: 64px;
    border-radius: 9999px;
    background: var(--ink);
    color: var(--brand-400);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 22px;
    letter-spacing: -0.02em;
    box-shadow: 0 6px 20px rgba(13, 45, 63, .18);
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.confirm-mark img[b-bs89gkrukn] {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.confirm-title[b-bs89gkrukn] {
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -0.01em;
    position: relative;
    z-index: 1;
}

.confirm-sub[b-bs89gkrukn] {
    font-size: 13.5px;
    color: var(--muted);
    line-height: 1.55;
    max-width: 380px;
    position: relative;
    z-index: 1;
}

.confirm-recap[b-bs89gkrukn] {
    margin: 14px 24px 0;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

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

.recap-label[b-bs89gkrukn] {
    font-size: 10px;
    font-weight: 700;
    color: var(--placeholder);
    letter-spacing: .10em;
    text-transform: uppercase;
}

.recap-val[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--ink);
    line-height: 1.5;
}

.recap-slot[b-bs89gkrukn] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-md);
    padding: 6px 10px;
    font-size: 12.5px;
    color: var(--ink);
    margin: 2px 6px 2px 0;
}

.recap-slot i[b-bs89gkrukn] {
    color: var(--brand-600);
}

.muted[b-bs89gkrukn] {
    color: var(--muted);
}

.cp-pin[b-bs89gkrukn] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    padding: 24px;
}

.cp-pin-card[b-bs89gkrukn] {
    width: 100%;
    max-width: 380px;
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl2);
    padding: 32px;
    text-align: center;
    box-shadow: var(--shadow-sm);
}

.cp-pin-logo[b-bs89gkrukn] {
    width: 120px;
    margin: 0 auto 18px;
    display: block;
}

.cp-pin-title[b-bs89gkrukn] {
    font-size: 20px;
    font-weight: 700;
    color: var(--ink);
    margin: 0 0 6px;
    letter-spacing: -0.005em;
}

.cp-pin-sub[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--muted);
    margin: 0 0 18px;
    line-height: 1.5;
}

.cp-pin-form[b-bs89gkrukn] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cp-pin-form .input[b-bs89gkrukn] {
    text-align: center;
    letter-spacing: .2em;
    font-weight: 600;
}

.cp-pin-error[b-bs89gkrukn] {
    font-size: 12px;
    color: var(--error-text);
    background: var(--error-bg);
    border: 1px solid var(--error-border);
    border-radius: var(--radius-md);
    padding: 8px 12px;
    margin-top: 4px;
}

.cp-loading[b-bs89gkrukn] {
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cp-loading-spinner[b-bs89gkrukn] {
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    border: 3px solid var(--border-strong);
    border-top-color: var(--brand-400);
    animation: cp-spin-b-bs89gkrukn 700ms linear infinite;
}

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

.cp-expired[b-bs89gkrukn] {
    min-height: 60vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    text-align: center;
}

.cp-expired-mark[b-bs89gkrukn] {
    width: 96px;
    height: auto;
    margin-bottom: 18px;
    opacity: .7;
}

.cp-expired-title[b-bs89gkrukn] {
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    margin: 0 0 6px;
    letter-spacing: -0.01em;
}

.cp-expired-sub[b-bs89gkrukn] {
    font-size: 13px;
    color: var(--muted);
    max-width: 340px;
    margin: 0;
    line-height: 1.6;
}
/* /Components/Pages/CandidatePages/CvBuilder.razor.rz.scp.css */
.loader-container[b-257pu0td4h] {
    background: transparent;
    backdrop-filter: blur(20px);
    padding: 40px;
    text-align: center;
}

.ai-brain[b-257pu0td4h] {
    width: 80px;
    height: 80px;
    margin: 0 auto 30px;
    position: relative;
}

.brain-svg[b-257pu0td4h] {
    width: 100%;
    height: 100%;
    animation: pulse-b-257pu0td4h 2s ease-in-out infinite;
}

.neural-network[b-257pu0td4h] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.6;
}

.neural-dot[b-257pu0td4h] {
    width: 4px;
    height: 4px;
    background: #667eea;
    border-radius: 50%;
    position: absolute;
    animation: neuralPulse-b-257pu0td4h 1.5s ease-in-out infinite;
}

.neural-dot:nth-child(1)[b-257pu0td4h] { top: 20%; left: 30%; animation-delay: 0s; }
.neural-dot:nth-child(2)[b-257pu0td4h] { top: 40%; left: 70%; animation-delay: 0.3s; }
.neural-dot:nth-child(3)[b-257pu0td4h] { top: 60%; left: 20%; animation-delay: 0.6s; }
.neural-dot:nth-child(4)[b-257pu0td4h] { top: 80%; left: 60%; animation-delay: 0.9s; }

.title[b-257pu0td4h] {
    font-size: 28px;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 12px;
    background: linear-gradient(135deg, #667eea, #764ba2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.subtitle[b-257pu0td4h] {
    font-size: 16px;
    color: #718096;
    margin-bottom: 40px;
}

.processing-steps[b-257pu0td4h] {
    text-align: left;
    margin-bottom: 30px;
}

.step[b-257pu0td4h] {
    display: flex;
    align-items: center;
    padding: 12px 0;
    transition: all 0.3s ease;
    border-radius: 8px;
    padding-left: 16px;
    margin-bottom: 8px;
}

.step.active[b-257pu0td4h] {
    background: linear-gradient(90deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.1));
    transform: translateX(8px);
}

.step.completed[b-257pu0td4h] {
    opacity: 0.6;
}

.step-icon[b-257pu0td4h] {
    width: 24px;
    height: 24px;
    margin-right: 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.3s ease;
}

.step.active .step-icon[b-257pu0td4h] {
    background: linear-gradient(135deg, #667eea, #764ba2);
    color: white;
    animation: spin-b-257pu0td4h 1s linear infinite;
}

.step.completed .step-icon[b-257pu0td4h] {
    background: #48bb78;
    color: white;
}

.step.pending .step-icon[b-257pu0td4h] {
    background: #e2e8f0;
    color: #a0aec0;
}

.step-text[b-257pu0td4h] {
    font-size: 16px;
    font-weight: 500;
    color: #2d3748;
}

.step.active .step-text[b-257pu0td4h] {
    color: #667eea;
    font-weight: 600;
}

.progress-bar[b-257pu0td4h] {
    width: 100%;
    height: 6px;
    background: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
    margin-top: 20px;
}

.progress-fill[b-257pu0td4h] {
    width: 20%;
    height: 100%;
    background: linear-gradient(90deg, #667eea, #764ba2);
    border-radius: 3px;
    position: relative;
    animation: fill-b-257pu0td4h 90s steps(10, end) forwards;
}

@keyframes fill-b-257pu0td4h {
    from { width: 20%; }
    to   { width: 100%; }
}

.progress-fill[b-257pu0td4h]::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
    animation: load 2s infinite;
}

.estimated-time[b-257pu0td4h] {
    margin-top: 16px;
    font-size: 14px;
    color: #718096;
}

@keyframes pulse-b-257pu0td4h {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.05); opacity: 0.8; }
}

@keyframes neuralPulse-b-257pu0td4h {
    0%, 100% { opacity: 0.3; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.2); }
}

@keyframes spin-b-257pu0td4h {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes shimmer-b-257pu0td4h {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

@media (max-width: 480px) {
    .loader-container[b-257pu0td4h] {
        padding: 30px 20px;
    }

    .title[b-257pu0td4h] {
        font-size: 24px;
    }

    .step-text[b-257pu0td4h] {
        font-size: 14px;
    }
}

.cvb-arrow[b-257pu0td4h] {
    fill: rgba(0,0,0,0.54);
    transition: transform .15s ease;
}

.cvb-rotate-180[b-257pu0td4h] {
    transform: rotate(180deg);
}

.cvb-backdrop[b-257pu0td4h] {
    position: fixed;
    inset: 0;
    z-index: 1045;
    background: transparent;
}

.cvb-dropdown[b-257pu0td4h] {
    position: absolute;
    z-index: 1055;
    max-height: 380px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
}

.cvb-list[b-257pu0td4h] {
    max-height: 280px;
    overflow: auto;
    padding-left: 4px;
}

.jobs-select-btn[b-257pu0td4h] {
    height: 60px;
    padding-top: 8px;
    padding-bottom: 8px;
}
/* /Components/Pages/CandidatePages/EmployeeMatchingPage.razor.rz.scp.css */
/* ==========================================================================
   Candidates Page — Talents DS
   Prefix: .cp- (avoids clashing with bootstrap/mud)
   ========================================================================== */

/* ---------- Page chrome ---------- */
.cp-shell[b-2hx06gy56q] {
  min-height: 100vh;
  background: var(--neutral-bg);
  font-family: var(--font-sans);
  color: var(--ink);
  padding: 28px 32px 64px;
}
.cp-page[b-2hx06gy56q] {
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* ---------- Page header ---------- */
.cp-header[b-2hx06gy56q] {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.cp-header-text[b-2hx06gy56q] { display: flex; flex-direction: column; gap: 6px; }
.cp-overline[b-2hx06gy56q] {
  font-size: var(--fs-overline);
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.cp-title[b-2hx06gy56q] {
  font-size: var(--fs-hero);
  font-weight: var(--fw-black);
  color: var(--ink);
  letter-spacing: -0.01em;
  line-height: 1.1;
  margin: 0;
}
.cp-title-dot[b-2hx06gy56q] { color: var(--brand-400); }
.cp-subtitle[b-2hx06gy56q] {
  font-size: var(--fs-body);
  color: var(--neutral-muted);
}
.cp-header-actions[b-2hx06gy56q] {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

/* ---------- Buttons ---------- */
.cp-btn[b-2hx06gy56q] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 38px;
  padding: 0 14px;
  border-radius: var(--radius-md);
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: var(--fw-semibold);
  line-height: 1;
  border: 1.5px solid transparent;
  background: white;
  color: var(--ink);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  white-space: nowrap;
}
.cp-btn:focus-visible[b-2hx06gy56q] {
  outline: none;
  box-shadow: var(--focus-brand);
}
.cp-btn-primary[b-2hx06gy56q] { background: var(--ink); color: white; border-color: var(--ink); }
.cp-btn-primary:hover:not(:disabled)[b-2hx06gy56q] { background: #1E4256; border-color: #1E4256; }
.cp-btn-outline[b-2hx06gy56q] { background: white; color: var(--ink); border-color: var(--neutral-border-strong); }
.cp-btn-outline:hover:not(:disabled)[b-2hx06gy56q] { border-color: var(--brand-200); background: var(--neutral-surface); }
.cp-btn-outline.has-value[b-2hx06gy56q] { border-color: var(--brand-400); color: var(--brand-700); background: var(--brand-50); }
.cp-btn-outline.is-open[b-2hx06gy56q] { border-color: var(--brand-400); box-shadow: var(--focus-brand); }
.cp-btn-ghost[b-2hx06gy56q] { background: transparent; border-color: transparent; color: var(--neutral-label); }
.cp-btn-ghost:hover[b-2hx06gy56q] { background: var(--neutral-pill-bg); }
.cp-btn-ai[b-2hx06gy56q] {
  background: white;
  color: var(--ink);
  border-color: var(--brand-200);
}
.cp-btn-ai:hover:not(:disabled)[b-2hx06gy56q] { background: var(--brand-50); border-color: var(--brand-400); color: var(--brand-700); }
.cp-btn-sm[b-2hx06gy56q] { height: 30px; padding: 0 10px; font-size: 12px; }
.cp-btn-icon[b-2hx06gy56q] { padding: 0; width: 38px; }
.cp-btn-ai.cp-btn-icon[b-2hx06gy56q] { width: auto; padding: 0 12px; }
.cp-btn:disabled[b-2hx06gy56q] { opacity: 0.45; cursor: not-allowed; }
.cp-btn-label[b-2hx06gy56q] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 180px; }
.cp-icon-btn[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: var(--radius-md);
  border: 1px solid transparent; background: transparent; color: var(--neutral-label);
  cursor: pointer; transition: background .15s ease, color .15s ease;
}
.cp-icon-btn:hover[b-2hx06gy56q] { background: var(--neutral-pill-bg); color: var(--ink); }
.cp-link[b-2hx06gy56q] {
  background: none; border: none; padding: 0;
  color: var(--brand-700); font-size: 12px; font-weight: var(--fw-semibold);
  cursor: pointer;
}
.cp-link:hover[b-2hx06gy56q] { color: var(--brand-500); text-decoration: underline; }

/* ---------- Stats strip ---------- */
.cp-stats[b-2hx06gy56q] {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: stretch;
  gap: 24px;
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  padding: 16px 20px;
  box-shadow: var(--shadow-sm);
}
.cp-stats-meta[b-2hx06gy56q] {
  display: flex; flex-direction: column; justify-content: center;
  gap: 6px;
  padding-right: 22px;
  border-right: 1px solid var(--neutral-border);
  min-width: 130px;
}
.cp-stats-period[b-2hx06gy56q] {
  font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink);
}
.cp-stats-grid[b-2hx06gy56q] {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 4px;
}
.cp-stat[b-2hx06gy56q] {
  display: flex; flex-direction: column; gap: 4px;
  padding: 4px 10px;
  border-right: 1px solid var(--neutral-border);
}
.cp-stat:last-child[b-2hx06gy56q] { border-right: none; }
.cp-stat-label[b-2hx06gy56q] {
  font-size: 10px;
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.cp-stat-val[b-2hx06gy56q] {
  display: flex; align-items: baseline; gap: 4px;
  font-variant-numeric: tabular-nums;
}
.cp-stat-current[b-2hx06gy56q] {
  font-size: 18px; font-weight: var(--fw-bold); color: var(--ink); line-height: 1;
}
.cp-stat-sep[b-2hx06gy56q]   { color: var(--neutral-placeholder); font-size: 13px; }
.cp-stat-total[b-2hx06gy56q] { color: var(--neutral-muted); font-size: 12px; font-weight: var(--fw-medium); }
.cp-stats-range[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 4px;
  padding-left: 12px;
  border-left: 1px solid var(--neutral-border);
}
.cp-range-trigger[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 8px;
  height: 32px; padding: 0 12px;
  background: var(--neutral-surface);
  border: 1px solid var(--neutral-border);
  border-radius: var(--radius-md);
  font-family: var(--font-sans); font-size: 12px; font-weight: var(--fw-semibold);
  color: var(--ink); cursor: pointer;
  white-space: nowrap;
}
.cp-range-trigger:hover[b-2hx06gy56q] { border-color: var(--neutral-border-strong); }
.cp-range-trigger svg[b-2hx06gy56q] { color: var(--neutral-label); }

/* ---------- Toolbar (filters + search) ---------- */
.cp-toolbar[b-2hx06gy56q] {
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: var(--shadow-sm);
}
.cp-toolbar-row[b-2hx06gy56q] {
  display: flex; flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.cp-toolbar-divider[b-2hx06gy56q] {
  width: 1px; height: 26px;
  background: var(--neutral-border);
  margin: 0 4px;
}
.cp-toolbar-spacer[b-2hx06gy56q] { flex: 1; }
.cp-result-meta[b-2hx06gy56q] {
  font-size: 12px;
  color: var(--neutral-muted);
}
.cp-result-meta strong[b-2hx06gy56q] { color: var(--ink); font-weight: var(--fw-semibold); }

/* ---------- Search ---------- */
.cp-search-wrap[b-2hx06gy56q] { position: relative; flex: 1; min-width: 280px; }
.cp-search[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 10px;
  height: 44px;
  padding: 0 6px 0 14px;
  background: white;
  border: 1.5px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.cp-search > svg[b-2hx06gy56q] { color: var(--neutral-placeholder); flex-shrink: 0; }
.cp-search.is-focused[b-2hx06gy56q] { border-color: var(--brand-400); box-shadow: var(--focus-brand); }
.cp-search.is-focused > svg[b-2hx06gy56q] { color: var(--brand-500); }
.cp-search-input[b-2hx06gy56q] {
  flex: 1;
  border: none; outline: none; background: transparent;
  font-family: var(--font-sans);
  font-size: 14px; color: var(--ink);
  min-width: 0;
}
.cp-search-input[b-2hx06gy56q]::placeholder { color: var(--neutral-placeholder); }
.cp-search-actions[b-2hx06gy56q] { display: flex; align-items: center; gap: 6px; }
.cp-search-actions .cp-btn[b-2hx06gy56q] { height: 32px; }
.cp-search-actions .cp-btn-icon[b-2hx06gy56q] { width: 32px; }
.cp-search-actions .cp-btn-ai[b-2hx06gy56q] { gap: 4px; font-weight: var(--fw-bold); font-size: 11px; letter-spacing: 0.04em; }

.cp-suggestions[b-2hx06gy56q] {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: white;
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  list-style: none; margin: 0; padding: 4px;
  max-height: 220px; overflow-y: auto;
  z-index: 30;
}
.cp-suggestions li[b-2hx06gy56q] {
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  font-size: 13px; color: var(--ink);
  cursor: pointer;
}
.cp-suggestions li:hover[b-2hx06gy56q] { background: var(--neutral-surface); }

/* ---------- Dropdown / popover (shared) ---------- */
.cp-dd[b-2hx06gy56q] { position: relative; }
.cp-popover[b-2hx06gy56q] {
  position: absolute; top: calc(100% + 6px); left: 0;
  background: white;
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  z-index: 40;
  display: flex; flex-direction: column;
  min-width: 260px;
}
.cp-popover-md[b-2hx06gy56q] { width: 280px; }
.cp-popover-col[b-2hx06gy56q] {
  width: 260px;
  left: auto; right: 0;
  top: calc(100% + 4px);
}
.cp-popover-header[b-2hx06gy56q] {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--neutral-border);
}
.cp-popover-title[b-2hx06gy56q] {
  font-size: 13px; font-weight: var(--fw-semibold); color: var(--ink);
}
.cp-popover-footer[b-2hx06gy56q] {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid var(--neutral-border);
}

.cp-search-inline[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 8px;
  margin: 10px 12px 6px;
  padding: 0 10px;
  height: 32px;
  background: var(--neutral-surface);
  border: 1px solid var(--neutral-border);
  border-radius: var(--radius-md);
}
.cp-search-inline:focus-within[b-2hx06gy56q] { border-color: var(--brand-400); }
.cp-search-inline > svg[b-2hx06gy56q] { color: var(--neutral-placeholder); }
.cp-search-inline input[b-2hx06gy56q] {
  flex: 1; min-width: 0;
  border: none; outline: none; background: transparent;
  font-size: 12px; font-family: var(--font-sans); color: var(--ink);
}
.cp-search-inline input[b-2hx06gy56q]::placeholder { color: var(--neutral-placeholder); }

.cp-checklist[b-2hx06gy56q] {
  max-height: 240px;
  overflow-y: auto;
  padding: 4px 6px 10px;
}
.cp-check[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 8px;
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.cp-check:hover[b-2hx06gy56q] { background: var(--neutral-surface); }
.cp-check input[b-2hx06gy56q] { position: absolute; opacity: 0; pointer-events: none; }
.cp-check-box[b-2hx06gy56q] {
  width: 16px; height: 16px;
  border: 1.5px solid var(--neutral-border-strong);
  border-radius: 4px;
  background: white;
  display: inline-flex; align-items: center; justify-content: center;
  color: white;
  flex-shrink: 0;
  transition: background .12s ease, border-color .12s ease;
}
.cp-check-box svg[b-2hx06gy56q] { opacity: 0; }
.cp-check input:checked + .cp-check-box[b-2hx06gy56q] {
  background: var(--ink);
  border-color: var(--ink);
}
.cp-check input:checked + .cp-check-box svg[b-2hx06gy56q] { opacity: 1; }
.cp-check input:indeterminate + .cp-check-box[b-2hx06gy56q] {
  background: var(--ink);
  border-color: var(--ink);
}
.cp-check input:indeterminate + .cp-check-box[b-2hx06gy56q]::after {
  content: "";
  width: 8px; height: 2px; background: white; border-radius: 1px;
}
.cp-check input:indeterminate + .cp-check-box svg[b-2hx06gy56q] { display: none; }
.cp-check-label[b-2hx06gy56q] {
  font-size: 13px; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cp-check-all[b-2hx06gy56q] { font-weight: var(--fw-semibold); }
.cp-check-divider[b-2hx06gy56q] {
  height: 1px; background: var(--neutral-border);
  margin: 4px 6px;
}
.cp-check-empty[b-2hx06gy56q] {
  padding: 14px 12px;
  font-size: 12px; color: var(--neutral-placeholder); text-align: center;
}

/* ---------- Results header ---------- */
.cp-results-bar[b-2hx06gy56q] {
  display: flex; align-items: center; flex-wrap: wrap;
  gap: 12px;
  padding: 0 4px;
}
.cp-token-badge[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 10px;
  background: var(--brand-50);
  border: 1px solid var(--brand-200);
  border-radius: var(--radius-full);
  color: var(--brand-700);
  font-size: 11px;
  font-weight: var(--fw-medium);
}
.cp-token-badge strong[b-2hx06gy56q] { font-weight: var(--fw-bold); color: var(--brand-800); }

/* ---------- Table ---------- */
.cp-table-wrap[b-2hx06gy56q] {
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.cp-table-scroll[b-2hx06gy56q] {
  overflow-x: auto;
}
.cp-table[b-2hx06gy56q] {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1100px;
}
.cp-table thead th[b-2hx06gy56q] {
  position: sticky; top: 0;
  background: var(--neutral-surface);
  border-bottom: 1px solid var(--neutral-border-strong);
  padding: 0;
  text-align: left;
  font-weight: var(--fw-semibold);
  z-index: 1;
}
.cp-table tbody td[b-2hx06gy56q] {
  padding: 12px 16px;
  border-bottom: 1px solid var(--neutral-border);
  font-size: 13px;
  color: var(--ink);
  vertical-align: middle;
}
.cp-table tbody tr:last-child td[b-2hx06gy56q] { border-bottom: none; }
.cp-table tbody tr:hover td[b-2hx06gy56q] { background: var(--neutral-surface); }

/* ---------- TH inner (sort + filter) ---------- */
.cp-th[b-2hx06gy56q] {
  position: relative;
  display: flex; align-items: center; gap: 4px;
  padding: 12px 8px 12px 16px;
}
.cp-th-right[b-2hx06gy56q] { justify-content: flex-end; }
.cp-th-label[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 6px;
  background: none; border: none; padding: 4px 4px;
  margin: -4px 0;
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: var(--fw-bold);
  color: var(--neutral-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}
.cp-th-label:hover[b-2hx06gy56q] { color: var(--ink); }
.cp-th-label svg[b-2hx06gy56q] { color: var(--neutral-placeholder); flex-shrink: 0; }
.cp-th-label:hover svg[b-2hx06gy56q] { color: var(--neutral-label); }
.cp-th-filter[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  border-radius: var(--radius-sm);
  border: none; background: transparent;
  color: var(--neutral-placeholder);
  cursor: pointer;
  position: relative;
  transition: background .12s ease, color .12s ease;
}
.cp-th-filter:hover[b-2hx06gy56q] { background: white; color: var(--ink); }
.cp-th-filter.is-active[b-2hx06gy56q] { color: var(--brand-500); }
.cp-th-filter.is-open[b-2hx06gy56q] { background: white; color: var(--ink); box-shadow: inset 0 0 0 1px var(--neutral-border-strong); }
.cp-th-filter-dot[b-2hx06gy56q] {
  position: absolute; top: 3px; right: 3px;
  width: 6px; height: 6px;
  border-radius: 9999px;
  background: var(--brand-400);
  border: 1.5px solid white;
}

/* ---------- Name cell ---------- */
.cp-name-cell[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 12px;
  min-width: 0;
}
.cp-avatar[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  background: var(--ink);
  color: var(--brand-400);
  font-weight: var(--fw-bold);
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.cp-name-text[b-2hx06gy56q] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cp-name-link[b-2hx06gy56q] {
  font-size: 13px;
  font-weight: var(--fw-semibold);
  color: var(--ink);
  text-decoration: none;
  cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cp-name-link:hover[b-2hx06gy56q] { color: var(--brand-700); text-decoration: underline; }
.cp-name-meta[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11px;
  color: var(--neutral-muted);
}
.cp-name-meta svg[b-2hx06gy56q] { color: var(--brand-500); }
.cp-interviewer-pill[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 6px;
  border-radius: 9999px;
  background: var(--info-bg);
  color: var(--brand-700);
  font-size: 10px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ---------- Status pill ---------- */
.cp-status[b-2hx06gy56q] {
  display: inline-flex; align-items: center;
  padding: 4px 10px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.cp-status[b-2hx06gy56q]::before {
  content: ""; width: 6px; height: 6px; border-radius: 9999px;
  background: currentColor;
  margin-right: 6px;
  opacity: 0.9;
}
.cp-status-open[b-2hx06gy56q]    { background: var(--success-bg); color: #15803D; border: 1px solid var(--success-border); }
.cp-status-hold[b-2hx06gy56q]    { background: var(--warning-bg); color: #B45309; border: 1px solid var(--warning-border); }
.cp-status-hired[b-2hx06gy56q]   { background: var(--brand-50);   color: var(--brand-700); border: 1px solid var(--brand-200); }
.cp-status-closed[b-2hx06gy56q]  { background: var(--neutral-pill-bg); color: var(--neutral-label); border: 1px solid var(--neutral-border-strong); }
.cp-status-neutral[b-2hx06gy56q] { background: var(--neutral-pill-bg); color: var(--neutral-label); border: 1px solid var(--neutral-border-strong); }

/* ---------- Cooperation / source labels ---------- */
.cp-tag[b-2hx06gy56q] {
  display: inline-flex; align-items: center;
  padding: 3px 8px;
  border-radius: var(--radius-sm);
  background: var(--neutral-pill-bg);
  color: var(--neutral-label);
  font-size: 11px;
  font-weight: var(--fw-semibold);
}
.cp-source[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px;
  color: var(--ink);
}
.cp-source-kind[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 28px;
  padding: 2px 6px;
  background: var(--neutral-pill-bg);
  color: var(--neutral-label);
  border-radius: var(--radius-sm);
  font-size: 10px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.06em;
}
.cp-source-kind.is-otp[b-2hx06gy56q] { background: var(--brand-50); color: var(--brand-700); }

/* ---------- Shared count ---------- */
.cp-shared[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 24px; height: 24px; padding: 0 6px;
  border-radius: 9999px;
  background: var(--neutral-pill-bg);
  color: var(--neutral-label);
  font-size: 12px;
  font-weight: var(--fw-bold);
  font-variant-numeric: tabular-nums;
}
.cp-shared.is-nonzero[b-2hx06gy56q] { background: var(--info-bg); color: var(--brand-700); }

/* ---------- Date ---------- */
.cp-date[b-2hx06gy56q] {
  display: flex; flex-direction: column;
  font-variant-numeric: tabular-nums;
}
.cp-date-main[b-2hx06gy56q] { font-size: 13px; color: var(--ink); font-weight: var(--fw-medium); }
.cp-date-sub[b-2hx06gy56q]  { font-size: 11px; color: var(--neutral-placeholder); }

/* ---------- AI match ---------- */
.cp-ai[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 4px 10px 4px 4px;
  border-radius: 9999px;
  background: white;
  border: 1px solid var(--neutral-border-strong);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: var(--fw-semibold);
  cursor: pointer;
  transition: transform .08s ease, box-shadow .15s ease, border-color .15s ease;
}
.cp-ai:hover[b-2hx06gy56q] { box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.cp-ai-score[b-2hx06gy56q] {
  display: inline-flex; align-items: center;
  background: var(--ink);
  color: white;
  font-weight: var(--fw-bold);
  font-size: 11px;
  min-width: 36px; height: 22px;
  padding: 0 6px;
  border-radius: 9999px;
  font-variant-numeric: tabular-nums;
}
.cp-ai-score sup[b-2hx06gy56q] { font-size: 8px; margin-left: 1px; font-weight: var(--fw-bold); }
.cp-ai-label[b-2hx06gy56q] {
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: var(--fw-bold);
}
.cp-ai-strong[b-2hx06gy56q] { border-color: var(--brand-200); }
.cp-ai-strong .cp-ai-score[b-2hx06gy56q] { background: var(--brand-500); }
.cp-ai-strong .cp-ai-label[b-2hx06gy56q] { color: var(--brand-700); }
.cp-ai-good[b-2hx06gy56q]   { border-color: var(--neutral-border-strong); }
.cp-ai-good   .cp-ai-score[b-2hx06gy56q] { background: var(--ink); }
.cp-ai-good   .cp-ai-label[b-2hx06gy56q] { color: var(--neutral-label); }
.cp-ai-empty[b-2hx06gy56q] {
  color: var(--neutral-placeholder);
  font-size: 13px;
}

/* ---------- States: skeleton / empty / error ---------- */
.cp-skeleton[b-2hx06gy56q] {
  display: inline-block;
  height: 12px;
  background: linear-gradient(90deg, var(--neutral-border) 0%, var(--neutral-pill-bg) 50%, var(--neutral-border) 100%);
  background-size: 200% 100%;
  border-radius: 4px;
  animation: cp-skeleton-shimmer-b-2hx06gy56q 1.4s ease infinite;
}
@keyframes cp-skeleton-shimmer-b-2hx06gy56q {
  0% { background-position: 0% 0%; }
  100% { background-position: -200% 0%; }
}

.cp-state[b-2hx06gy56q] {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px;
  padding: 64px 24px;
  text-align: center;
}
.cp-state-icon[b-2hx06gy56q] {
  width: 56px; height: 56px;
  border-radius: 9999px;
  background: var(--neutral-surface);
  border: 1px solid var(--neutral-border);
  color: var(--neutral-muted);
  display: flex; align-items: center; justify-content: center;
}
.cp-state-title[b-2hx06gy56q] { font-size: 16px; font-weight: var(--fw-bold); color: var(--ink); }
.cp-state-body[b-2hx06gy56q]  { font-size: 13px; color: var(--neutral-muted); max-width: 420px; }
.cp-state-error .cp-state-icon[b-2hx06gy56q] { background: var(--error-bg); border-color: var(--error-border); color: var(--error-text); }

/* ---------- AI loader ---------- */
.cp-ai-loader[b-2hx06gy56q] {
  display: flex; justify-content: center;
  padding: 32px 16px;
}
.cp-ai-loader-card[b-2hx06gy56q] {
  width: 100%;
  max-width: 520px;
  background: white;
  border: 1px solid var(--brand-200);
  border-radius: var(--radius-xl);
  padding: 32px 28px;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-align: center;
  box-shadow: var(--shadow-md);
}
.cp-ai-spinner[b-2hx06gy56q] {
  position: relative;
  width: 64px; height: 64px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--brand-500);
}
.cp-ai-spinner-ring[b-2hx06gy56q] {
  position: absolute; inset: 0;
  border: 3px solid var(--brand-100);
  border-top-color: var(--brand-400);
  border-radius: 50%;
  animation: cp-ai-spin-b-2hx06gy56q 1s linear infinite;
}
@keyframes cp-ai-spin-b-2hx06gy56q { to { transform: rotate(360deg); } }
.cp-ai-loader-title[b-2hx06gy56q] { font-size: 16px; font-weight: var(--fw-bold); color: var(--ink); }
.cp-ai-loader-body[b-2hx06gy56q]  { font-size: 13px; color: var(--neutral-muted); max-width: 360px; }

.cp-ai-steps[b-2hx06gy56q] {
  display: flex; align-items: center;
  gap: 0;
  margin-top: 6px;
}
.cp-ai-step[b-2hx06gy56q] {
  display: inline-flex; flex-direction: column; align-items: center; gap: 6px;
  font-size: 11px;
  font-weight: var(--fw-semibold);
  color: var(--neutral-placeholder);
  min-width: 100px;
}
.cp-ai-step-dot[b-2hx06gy56q] {
  width: 28px; height: 28px;
  border-radius: 9999px;
  border: 1.5px solid currentColor;
  display: flex; align-items: center; justify-content: center;
  background: white;
  font-size: 11px;
  font-weight: var(--fw-bold);
}
.cp-ai-step.is-active[b-2hx06gy56q] { color: var(--brand-500); }
.cp-ai-step.is-active .cp-ai-step-dot[b-2hx06gy56q] { background: var(--brand-50); box-shadow: var(--focus-brand); }
.cp-ai-step.is-done[b-2hx06gy56q]   { color: var(--success); }
.cp-ai-step.is-done   .cp-ai-step-dot[b-2hx06gy56q] { background: var(--success); color: white; border-color: var(--success); }
.cp-ai-step-line[b-2hx06gy56q] {
  height: 2px; width: 40px;
  background: var(--neutral-border);
  margin-bottom: 22px;
}
.cp-ai-step-line.is-done[b-2hx06gy56q] { background: var(--success); }

/* ---------- Pagination ---------- */
.cp-pagination[b-2hx06gy56q] {
  display: flex; align-items: center; justify-content: center; gap: 4px;
  padding: 16px;
}
.cp-page-btn[b-2hx06gy56q] {
  min-width: 32px; height: 32px;
  padding: 0 8px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  background: transparent;
  color: var(--neutral-label);
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: var(--fw-semibold);
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 1px;
  transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.cp-page-btn:hover:not(:disabled)[b-2hx06gy56q] {
  background: var(--neutral-surface);
  color: var(--ink);
}
.cp-page-btn.is-active[b-2hx06gy56q] {
  background: var(--ink); color: white; border-color: var(--ink);
}
.cp-page-btn:disabled[b-2hx06gy56q] { opacity: 0.4; cursor: not-allowed; }
.cp-page-ellipsis[b-2hx06gy56q] { color: var(--neutral-placeholder); padding: 0 4px; }

/* ---------- Modal ---------- */
.cp-modal-backdrop[b-2hx06gy56q] {
  position: fixed; inset: 0;
  background: rgba(13, 45, 63, 0.35);
  backdrop-filter: blur(2px);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  z-index: 1200;
  animation: cp-fade-b-2hx06gy56q .15s ease;
}
@keyframes cp-fade-b-2hx06gy56q { from { opacity: 0; } to { opacity: 1; } }
.cp-modal[b-2hx06gy56q] {
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-xl);
  box-shadow: 0 24px 64px rgba(13,45,63,0.18);
  width: 100%; max-width: 640px;
  max-height: calc(100vh - 48px);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.cp-modal-header[b-2hx06gy56q] {
  padding: 20px 24px;
  border-bottom: 1px solid var(--neutral-border);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.cp-modal-title[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 10px;
  font-size: 16px; font-weight: var(--fw-bold); color: var(--ink);
}
.cp-modal-title-meta[b-2hx06gy56q] {
  font-size: 13px; color: var(--neutral-muted); font-weight: var(--fw-regular);
}
.cp-modal-body[b-2hx06gy56q] {
  padding: 20px 24px;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 20px;
}
.cp-modal-footer[b-2hx06gy56q] {
  padding: 14px 24px;
  border-top: 1px solid var(--neutral-border);
  display: flex; align-items: center; justify-content: flex-end; gap: 8px;
}
.cp-modal-section[b-2hx06gy56q] { display: flex; flex-direction: column; gap: 8px; }
.cp-modal-section-title[b-2hx06gy56q] {
  font-size: 10px;
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  display: flex; align-items: center; gap: 6px;
}
.cp-modal-section-title.is-success[b-2hx06gy56q] { color: #15803D; }
.cp-modal-section-title.is-warning[b-2hx06gy56q] { color: #B45309; }
.cp-modal-section p[b-2hx06gy56q] {
  margin: 0;
  font-size: 13px;
  color: var(--ink);
  line-height: 1.55;
}
.cp-modal-list[b-2hx06gy56q] {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex; flex-direction: column; gap: 6px;
}
.cp-modal-list li[b-2hx06gy56q] {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: var(--ink); line-height: 1.5;
}
.cp-modal-list li[b-2hx06gy56q]::before {
  content: ""; width: 5px; height: 5px;
  background: var(--brand-400); border-radius: 9999px;
  margin-top: 8px; flex-shrink: 0;
}
.cp-modal-list.is-warning li[b-2hx06gy56q]::before { background: var(--warning); }
.cp-modal-list.is-success li[b-2hx06gy56q]::before { background: var(--success); }
.cp-modal-ai-summary[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: var(--brand-50);
  border: 1px solid var(--brand-200);
  border-radius: var(--radius-md);
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
  .cp-stats[b-2hx06gy56q] { grid-template-columns: 1fr; }
  .cp-stats-meta[b-2hx06gy56q] { border-right: none; padding-right: 0; padding-bottom: 12px; border-bottom: 1px solid var(--neutral-border); }
  .cp-stats-range[b-2hx06gy56q] { border-left: none; padding-left: 0; padding-top: 12px; border-top: 1px solid var(--neutral-border); justify-content: flex-end; }
  .cp-stats-grid[b-2hx06gy56q] { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 720px) {
  .cp-shell[b-2hx06gy56q] { padding: 20px 16px 48px; }
  .cp-stats-grid[b-2hx06gy56q] { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .cp-stat[b-2hx06gy56q] { padding: 8px; border: 1px solid var(--neutral-border); border-radius: var(--radius-md); }
  .cp-toolbar[b-2hx06gy56q] { padding: 12px; }
  .cp-search-actions .cp-btn-ai span[b-2hx06gy56q] { display: none; }
  .cp-popover-col[b-2hx06gy56q] { left: 0; right: auto; }
}
/* ==========================================================================
   Employee Matching — extends candidates-page.css
   Prefix: .em- for net-new pieces; reuses .cp-* for shared shell/table/modal
   ========================================================================== */

/* ---------- Header layout: title block left, subtitle below ---------- */
.em-header[b-2hx06gy56q] {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.em-header-text[b-2hx06gy56q] { display: flex; flex-direction: column; gap: 6px; max-width: 720px; }
.em-meta[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px;
  color: var(--neutral-muted);
}
.em-meta-dot[b-2hx06gy56q] {
  width: 6px; height: 6px;
  border-radius: 9999px;
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-bg);
}
.em-meta strong[b-2hx06gy56q] { color: var(--ink); font-weight: var(--fw-semibold); }

/* ---------- Search row (narrower than candidates) ---------- */
.em-search-row[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 12px;
  flex-wrap: wrap;
}
.em-search-wrap[b-2hx06gy56q] { width: 480px; max-width: 100%; }
.em-search-wrap .cp-search[b-2hx06gy56q] { height: 40px; }
.em-result-meta[b-2hx06gy56q] {
  font-size: 12px;
  color: var(--neutral-muted);
}
.em-result-meta strong[b-2hx06gy56q] { color: var(--ink); font-weight: var(--fw-semibold); }
.em-spacer[b-2hx06gy56q] { flex: 1; }

/* ---------- Two-line person cell (Candidate / Employee) ---------- */
.em-person[b-2hx06gy56q] {
  display: flex; align-items: flex-start; gap: 12px;
  min-width: 0;
}
.em-person-text[b-2hx06gy56q] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.em-person-name-row[b-2hx06gy56q] { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; max-width: 100%; }
.em-person-id[b-2hx06gy56q] {
  font-size: 11px;
  color: var(--neutral-muted);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.em-person-name[b-2hx06gy56q] {
  font-size: 13px;
  font-weight: var(--fw-semibold);
  color: var(--ink);
  text-decoration: none;
  cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  max-width: 280px;
  min-width: 0;
}
.em-person-name:hover[b-2hx06gy56q] { color: var(--brand-700); text-decoration: underline; }
.em-person-sub[b-2hx06gy56q] {
  font-size: 12px;
  color: var(--neutral-muted);
  font-variant-numeric: tabular-nums;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  max-width: 280px;
}
.em-person-sub.is-title[b-2hx06gy56q] { color: var(--neutral-label); font-size: 11.5px; }

/* ---------- Matched-by chips: Email = strong, Name = weak ---------- */
.em-chip[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px 4px 8px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1;
}
.em-chip svg[b-2hx06gy56q] { flex-shrink: 0; }
.em-chip-email[b-2hx06gy56q] {
  background: var(--brand-50);
  color: var(--brand-700);
  border: 1px solid var(--brand-200);
}
.em-chip-email .em-chip-dot[b-2hx06gy56q] {
  width: 6px; height: 6px;
  border-radius: 9999px;
  background: var(--brand-400);
  box-shadow: 0 0 0 2px rgba(74,196,255,0.18);
}
.em-chip-name[b-2hx06gy56q] {
  background: var(--neutral-pill-bg);
  color: var(--neutral-label);
  border: 1px solid var(--neutral-border-strong);
  font-weight: var(--fw-semibold);
}
.em-chip-name .em-chip-dot[b-2hx06gy56q] {
  width: 5px; height: 5px;
  border-radius: 9999px;
  background: var(--neutral-placeholder);
}

/* ---------- Detected date ---------- */
.em-date[b-2hx06gy56q] {
  font-size: 13px;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  font-weight: var(--fw-medium);
}
.em-date-sub[b-2hx06gy56q] {
  display: block;
  font-size: 11px;
  color: var(--neutral-placeholder);
  font-weight: var(--fw-regular);
  margin-top: 2px;
}

/* ---------- Action buttons (Confirm / Ignore) ---------- */
.em-actions[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 6px;
  justify-content: flex-end;
}
.em-action[b-2hx06gy56q] {
  position: relative;
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  border-radius: var(--radius-md);
  background: white;
  border: 1px solid var(--neutral-border-strong);
  color: var(--neutral-label);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.em-action:focus-visible[b-2hx06gy56q] {
  outline: none;
  box-shadow: var(--focus-brand);
}
.em-action:disabled[b-2hx06gy56q] { opacity: 0.45; cursor: not-allowed; }
.em-action-confirm:hover:not(:disabled)[b-2hx06gy56q] {
  background: var(--success-bg);
  border-color: var(--success-border);
  color: var(--success);
}
.em-action-ignore:hover:not(:disabled)[b-2hx06gy56q] {
  background: var(--error-bg);
  border-color: var(--error-border);
  color: var(--error);
}

/* In-flight spinner replacement */
.em-action.is-busy svg[b-2hx06gy56q] { display: none; }
.em-action.is-busy[b-2hx06gy56q]::after {
  content: "";
  width: 14px; height: 14px;
  border-radius: 9999px;
  border: 2px solid var(--neutral-border-strong);
  border-top-color: var(--neutral-label);
  animation: cp-ai-spin-b-2hx06gy56q 0.8s linear infinite;
}

/* Conflict indicator on row (subtle, optional) */
.em-row-has-conflict td:first-child[b-2hx06gy56q] {
  box-shadow: inset 3px 0 0 var(--warning);
}

/* ---------- Tooltip (simple) ---------- */
.em-tooltip[b-2hx06gy56q] {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--ink);
  color: white;
  padding: 5px 9px;
  border-radius: var(--radius-sm);
  font-size: 11px;
  font-weight: var(--fw-semibold);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity .12s ease;
  z-index: 10;
}
.em-tooltip[b-2hx06gy56q]::after {
  content: "";
  position: absolute;
  top: 100%; left: 50%;
  margin-left: -4px;
  border: 4px solid transparent;
  border-top-color: var(--ink);
}
.em-action:hover .em-tooltip[b-2hx06gy56q] { opacity: 1; }

/* ---------- Empty state illustration ---------- */
.em-empty[b-2hx06gy56q] {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 16px;
  padding: 80px 24px 88px;
  text-align: center;
}
.em-empty-illus[b-2hx06gy56q] {
  width: 132px; height: 88px;
  position: relative;
}
.em-empty-title[b-2hx06gy56q] {
  font-size: 16px;
  font-weight: var(--fw-bold);
  color: var(--ink);
}
.em-empty-body[b-2hx06gy56q] {
  font-size: 13px;
  color: var(--neutral-muted);
  max-width: 380px;
  line-height: 1.55;
}
.em-empty-foot[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 4px;
  padding: 6px 12px;
  background: var(--neutral-surface);
  border: 1px solid var(--neutral-border);
  border-radius: 9999px;
  font-size: 11px;
  color: var(--neutral-muted);
}
.em-empty-foot strong[b-2hx06gy56q] { color: var(--ink); font-weight: var(--fw-semibold); }

/* ---------- Conflict modal extensions ---------- */
.em-modal[b-2hx06gy56q] {
  max-width: 580px;
}
.em-modal-title-icon[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border-radius: 9999px;
  background: var(--warning-bg);
  color: var(--warning);
  border: 1px solid var(--warning-border);
  flex-shrink: 0;
}
.em-modal-banner[b-2hx06gy56q] {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 12px 14px;
  background: var(--info-bg);
  border: 1px solid var(--info-border);
  border-radius: var(--radius-md);
  font-size: 13px;
  color: var(--ink);
  line-height: 1.5;
}
.em-modal-banner-icon[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px;
  border-radius: 9999px;
  color: var(--info);
  flex-shrink: 0;
  margin-top: 1px;
}
.em-modal-banner strong[b-2hx06gy56q] { font-weight: var(--fw-semibold); color: var(--ink); }
.em-modal-banner .em-modal-banner-name[b-2hx06gy56q] {
  color: var(--brand-700);
  font-weight: var(--fw-semibold);
}

.em-modal-summary[b-2hx06gy56q] {
  display: flex; flex-direction: column; gap: 10px;
  padding: 14px 16px;
  background: var(--neutral-surface);
  border: 1px solid var(--neutral-border);
  border-radius: var(--radius-md);
}
.em-modal-summary-label[b-2hx06gy56q] {
  font-size: 10px;
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.em-modal-summary-row[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 14px;
  flex-wrap: wrap;
}
.em-modal-summary-side[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 10px;
  min-width: 0;
}
.em-modal-summary-side .em-person-text[b-2hx06gy56q] { gap: 1px; }
.em-modal-summary-arrow[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border-radius: 9999px;
  background: white;
  border: 1px solid var(--neutral-border);
  color: var(--brand-500);
  flex-shrink: 0;
}

.em-modal-irreversible[b-2hx06gy56q] {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px;
  color: var(--neutral-muted);
  padding-top: 4px;
}
.em-modal-irreversible svg[b-2hx06gy56q] { color: var(--warning); }

.cp-btn-warning[b-2hx06gy56q] {
  background: var(--warning);
  color: white;
  border-color: var(--warning);
}
.cp-btn-warning:hover:not(:disabled)[b-2hx06gy56q] {
  background: #B45309;
  border-color: #B45309;
}

/* ---------- Loading row spinner ---------- */
.em-loading-cell[b-2hx06gy56q] {
  text-align: center;
  padding: 56px 0 !important;
  color: var(--neutral-muted);
  font-size: 12px;
}
.em-loading-spinner[b-2hx06gy56q] {
  display: inline-flex; align-items: center; gap: 10px;
}
.em-loading-spinner[b-2hx06gy56q]::before {
  content: "";
  width: 16px; height: 16px;
  border-radius: 9999px;
  border: 2px solid var(--brand-100);
  border-top-color: var(--brand-400);
  animation: cp-ai-spin-b-2hx06gy56q 0.9s linear infinite;
}

/* ---------- Avatar w/ image fallback ---------- */
.em-avatar-img[b-2hx06gy56q] {
  width: 32px; height: 32px;
  border-radius: 9999px;
  object-fit: cover;
  flex-shrink: 0;
  border: 1px solid var(--neutral-border);
}

/* ---------- Responsive tweaks ---------- */
@media (max-width: 900px) {
  .em-search-wrap[b-2hx06gy56q] { width: 100%; }
  .em-person-name[b-2hx06gy56q], .em-person-sub[b-2hx06gy56q] { max-width: 200px; }
}

/* ---------- Initials avatar (DS spec: ink bg, brand-blue text) ---------- */
.em-avatar-initials[b-2hx06gy56q] {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  flex-shrink: 0;
  border-radius: 9999px;
  background: var(--ink);
  color: var(--brand-400);
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: 12px;
  letter-spacing: 0.02em;
  user-select: none;
}

/* ---------- Header right-side actions ---------- */
.em-header-actions[b-2hx06gy56q] {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
/* /Components/Pages/CandidatePages/Nen.razor.rz.scp.css */
.toggle[b-6tszu8cela] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    user-select: none;
    margin-right: 24px;
    margin-top: 5px;
}

.toggle-ui[b-6tszu8cela] {
    width: 38px;
    height: 18px;
    border-radius: 999px;
    background: #e9ecef;
    position: relative;
    transition: background .2s ease;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

.toggle input[b-6tszu8cela] {
    display: none;
}

.toggle-ui[b-6tszu8cela]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    transition: transform .2s ease;
}

.toggle input:checked + .toggle-ui[b-6tszu8cela] {
    background: #00b4ff;
}

.toggle input:checked + .toggle-ui[b-6tszu8cela]::after {
    transform: translateX(20px);
}

.toggle-caption[b-6tszu8cela] {
    font-size: 1rem;
    font-weight: 500;
    color: #343a40;
}

.nen-mark-sent-icon[b-6tszu8cela] {
    border-radius: 999px;
    background-color: #E8F5E9;
    padding: 2px;
}
/* /Components/Pages/Company/CompaniesPage.razor.rz.scp.css */
/* ==========================================================================
   CompaniesPage.razor.css — cp-* design system
   ========================================================================== */

/* ---------- Shell ---------- */
.cp-shell[b-qzs25b1xa1] {
    min-height: 100vh;
    background: var(--neutral-bg, #F8FBFD);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    padding: 1.5rem;
}
.cp-page[b-qzs25b1xa1] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* ---------- Page header ---------- */
.cp-header[b-qzs25b1xa1] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.cp-header-text[b-qzs25b1xa1] { display: flex; flex-direction: column; gap: 6px; }
.cp-overline[b-qzs25b1xa1] {
    font-size: var(--fs-overline, 10px);
    font-weight: var(--fw-bold, 700);
    color: var(--neutral-placeholder, #9BB8C5);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.cp-h1[b-qzs25b1xa1] {
    font-size: var(--fs-hero, 30px);
    font-weight: var(--fw-black, 800);
    color: var(--ink, #0D2D3F);
    letter-spacing: -0.01em;
    line-height: 1.12;
    margin: 0;
}
.cp-subtitle[b-qzs25b1xa1] {
    font-size: var(--fs-body, 14px);
    color: var(--neutral-muted, #7A9BAD);
    margin-top: 7px;
}
.cp-header-actions[b-qzs25b1xa1] { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* ---------- Buttons ---------- */
.cp-btn[b-qzs25b1xa1] {
    height: 38px;
    padding: 0 16px;
    border-radius: var(--radius-md, 8px);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    border: 1.5px solid transparent;
    white-space: nowrap;
    transition: background .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
.cp-btn svg[b-qzs25b1xa1] { width: 16px; height: 16px; }
.cp-btn-primary[b-qzs25b1xa1] { background: var(--ink, #0D2D3F); color: white; border: none; }
.cp-btn-primary:hover[b-qzs25b1xa1] { background: #1E4256; }
.cp-btn-outline[b-qzs25b1xa1] { background: white; color: var(--ink, #0D2D3F); border-color: var(--neutral-border-strong, #DDE8EE); }
.cp-btn-outline:hover[b-qzs25b1xa1] { border-color: var(--brand-200, #A8E3F7); background: var(--neutral-bg, #F8FBFD); }
.cp-btn-ghost[b-qzs25b1xa1] { background: transparent; color: var(--neutral-label, #4A6878); border: none; padding: 0 10px; }
.cp-btn-ghost:hover[b-qzs25b1xa1] { color: var(--ink, #0D2D3F); background: var(--neutral-pill-bg, #F2F5F7); }
.cp-btn:disabled[b-qzs25b1xa1] { opacity: .45; cursor: not-allowed; }
.cp-btn-sm[b-qzs25b1xa1] { height: 32px; padding: 0 12px; font-size: 12px; }

/* ---------- Toolbar ---------- */
.cp-toolbar[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cp-search-wrap[b-qzs25b1xa1] {
    flex: 1 1 320px;
    min-width: 260px;
    position: relative;
    display: flex;
    align-items: center;
}
.cp-search-wrap svg[b-qzs25b1xa1] {
    position: absolute;
    left: 13px;
    width: 17px; height: 17px;
    color: var(--neutral-placeholder, #9BB8C5);
    pointer-events: none;
}
.cp-search-wrap input[b-qzs25b1xa1] {
    width: 100%;
    height: 40px;
    padding: 0 14px 0 38px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    background: white;
    font-size: var(--fs-body, 14px);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    outline: none;
    transition: border-color .15s ease-out, box-shadow .15s ease-out;
}
.cp-search-wrap input[b-qzs25b1xa1]::placeholder { color: var(--neutral-placeholder, #9BB8C5); }
.cp-search-wrap input:focus[b-qzs25b1xa1] { border-color: var(--brand-400, #4AC4FF); box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }

/* ---------- Filter dropdown ---------- */
/* Transparent full-screen catcher: any click outside an open popover closes it.
   Sits below the popover (z-index 60) but above page content. */
.cp-dd-backdrop[b-qzs25b1xa1] {
    position: fixed;
    inset: 0;
    z-index: 50;
    background: transparent;
}
.cp-dd[b-qzs25b1xa1] { position: relative; }
.cp-dd-trigger[b-qzs25b1xa1] {
    height: 40px;
    padding: 0 12px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    background: white;
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--neutral-label, #4A6878);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .15s ease-out, background .15s ease-out, color .15s ease-out;
}
.cp-dd-trigger:hover[b-qzs25b1xa1] { border-color: var(--brand-200, #A8E3F7); color: var(--ink, #0D2D3F); }
.cp-dd-trigger svg.chev[b-qzs25b1xa1] { width: 15px; height: 15px; color: var(--neutral-placeholder, #9BB8C5); transition: transform .15s ease-out; }
.cp-dd.is-open .cp-dd-trigger[b-qzs25b1xa1] { border-color: var(--brand-400, #4AC4FF); color: var(--ink, #0D2D3F); box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cp-dd.is-open .cp-dd-trigger svg.chev[b-qzs25b1xa1] { transform: rotate(180deg); }
.cp-dd.has-active .cp-dd-trigger[b-qzs25b1xa1] { border-color: var(--brand-200, #A8E3F7); color: var(--ink, #0D2D3F); }
.cp-dd-count[b-qzs25b1xa1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9999px;
    background: var(--ink, #0D2D3F);
    color: white;
    font-size: 10px;
    font-weight: 700;
}

/* ---------- Popover + checklist ---------- */
.cp-popover[b-qzs25b1xa1] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 248px;
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-lg2, 12px);
    box-shadow: 0 2px 16px rgba(13,45,63,0.07);
    padding: 8px;
    z-index: 60;
    animation: cp-pop-in-b-qzs25b1xa1 .14s ease-out;
}
.cp-popover.align-right[b-qzs25b1xa1] { left: auto; right: 0; }
@keyframes cp-pop-in-b-qzs25b1xa1 {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
.cp-popover-search[b-qzs25b1xa1] {
    width: 100%;
    height: 34px;
    padding: 0 10px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-sm, 6px);
    font-size: 13px;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    outline: none;
    margin-bottom: 6px;
}
.cp-popover-search:focus[b-qzs25b1xa1] { border-color: var(--brand-400, #4AC4FF); box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cp-checklist[b-qzs25b1xa1] {
    max-height: 240px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.cp-check[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: var(--radius-sm, 6px);
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    transition: background .12s ease-out;
    user-select: none;
}
.cp-check:hover[b-qzs25b1xa1] { background: var(--neutral-bg, #F8FBFD); }
.cp-check-box[b-qzs25b1xa1] {
    width: 17px; height: 17px;
    border-radius: 5px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    color: white;
    transition: background .12s ease-out, border-color .12s ease-out;
}
.cp-check-box svg[b-qzs25b1xa1] { width: 12px; height: 12px; opacity: 0; }
.cp-check.is-checked .cp-check-box[b-qzs25b1xa1] { background: var(--ink, #0D2D3F); border-color: var(--ink, #0D2D3F); }
.cp-check.is-checked .cp-check-box svg[b-qzs25b1xa1] { opacity: 1; }
.cp-check-label[b-qzs25b1xa1] { flex: 1; }
.cp-check-meta[b-qzs25b1xa1] { font-size: 11px; font-weight: 400; color: var(--neutral-placeholder, #9BB8C5); }
.cp-popover-foot[b-qzs25b1xa1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 6px 2px;
    margin-top: 6px;
    border-top: 1px solid var(--neutral-border, #EDF2F5);
}
.cp-foot-actions[b-qzs25b1xa1] { display: flex; align-items: center; gap: 2px; }
.cp-popover-empty[b-qzs25b1xa1] {
    padding: 16px 10px;
    text-align: center;
    font-size: 12px;
    color: var(--neutral-placeholder, #9BB8C5);
}

/* ---------- Results bar ---------- */
.cp-results-bar[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 2px;
}
.cp-results-count[b-qzs25b1xa1] {
    font-size: var(--fs-body, 14px);
    font-weight: 500;
    color: var(--neutral-muted, #7A9BAD);
}
.cp-results-count b[b-qzs25b1xa1] { color: var(--ink, #0D2D3F); font-weight: 700; }

/* ---------- Table ---------- */
.cp-table-wrap[b-qzs25b1xa1] {
    background: white;
    border: 1px solid var(--neutral-card-border, #E2EBF0);
    border-radius: var(--radius-xl, 14px);
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(13,45,63,0.06);
}
.cp-table-scroll[b-qzs25b1xa1] { overflow-x: auto; }
.cp-table[b-qzs25b1xa1] {
    width: 100%;
    border-collapse: collapse;
    min-width: 1000px;
}
.cp-table thead th[b-qzs25b1xa1] {
    position: sticky;
    top: 0;
    background: var(--neutral-surface, #FAFCFD);
    border-bottom: 1px solid var(--neutral-border-strong, #DDE8EE);
    padding: 0;
    text-align: left;
    white-space: nowrap;
    z-index: 2;
}
.cp-th[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 13px 16px;
    font-size: var(--fs-overline, 10px);
    font-weight: 700;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--neutral-label, #4A6878);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    user-select: none;
}
.cp-th.is-sortable[b-qzs25b1xa1] { cursor: pointer; }
.cp-th.is-sortable:hover[b-qzs25b1xa1] { color: var(--ink, #0D2D3F); }
.cp-th.align-right[b-qzs25b1xa1] { justify-content: flex-end; }
.cp-th.align-center[b-qzs25b1xa1] { justify-content: center; }
.cp-th-label[b-qzs25b1xa1] { white-space: nowrap; }
.cp-caret[b-qzs25b1xa1] {
    display: inline-flex;
    flex-direction: column;
    line-height: 0;
    color: var(--neutral-border-strong, #DDE8EE);
}
.cp-caret svg[b-qzs25b1xa1] { width: 9px; height: 9px; display: block; }
.cp-caret .up[b-qzs25b1xa1] { margin-bottom: -2px; }
.cp-th.sort-asc .cp-caret .up[b-qzs25b1xa1] { color: var(--ink, #0D2D3F); }
.cp-th.sort-desc .cp-caret .down[b-qzs25b1xa1] { color: var(--ink, #0D2D3F); }

.cp-table tbody td[b-qzs25b1xa1] {
    padding: 14px 16px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
    font-size: var(--fs-body, 14px);
    font-weight: 400;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    vertical-align: middle;
}
.cp-table tbody tr[b-qzs25b1xa1] { transition: background .12s ease-out; cursor: pointer; }
.cp-table tbody tr:hover[b-qzs25b1xa1] { background: var(--neutral-bg, #F8FBFD); }
.cp-table tbody tr:last-child td[b-qzs25b1xa1] { border-bottom: none; }
.td-right[b-qzs25b1xa1] { text-align: right; }
.td-center[b-qzs25b1xa1] { text-align: center; }

/* ---------- Name cell ---------- */
.cp-name-cell[b-qzs25b1xa1] { display: flex; align-items: center; gap: 12px; }
.cp-avatar[b-qzs25b1xa1] {
    width: 36px; height: 36px;
    border-radius: 9999px;
    background: var(--ink, #0D2D3F);
    color: var(--brand-400, #4AC4FF);
    font-size: 12px;
    font-weight: 700;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    letter-spacing: 0.02em;
}
.cp-name-main[b-qzs25b1xa1] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cp-name-link[b-qzs25b1xa1] {
    font-size: var(--fs-card, 15px);
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    text-decoration: none;
    cursor: pointer;
    line-height: 1.25;
}
.cp-name-link:hover[b-qzs25b1xa1] { color: var(--brand-600, #0D80BB); text-decoration: underline; text-underline-offset: 2px; }
.cp-name-meta[b-qzs25b1xa1] {
    font-size: var(--fs-overline, 10px);
    font-weight: 700;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--neutral-placeholder, #9BB8C5);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
}
.cp-name-sub[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    min-width: 0;
}
.cp-sub-sep[b-qzs25b1xa1] { color: var(--neutral-border-strong, #DDE8EE); font-weight: 700; font-size: 11px; }
.cp-sub-loc[b-qzs25b1xa1] { font-size: var(--fs-label, 12px); font-weight: 500; color: var(--neutral-muted, #7A9BAD); }
.cp-sub-link[b-qzs25b1xa1] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fs-label, 12px);
    font-weight: 500;
    color: var(--brand-600, #0D80BB);
    text-decoration: none;
}
.cp-sub-link:hover[b-qzs25b1xa1] { text-decoration: underline; text-underline-offset: 2px; }
.cp-sub-link svg[b-qzs25b1xa1] { width: 12px; height: 12px; opacity: .6; }

/* ---------- Data cell helpers ---------- */
.cp-muted[b-qzs25b1xa1] { color: var(--neutral-placeholder, #9BB8C5); }
.cp-emp[b-qzs25b1xa1] { white-space: nowrap; font-variant-numeric: tabular-nums; }
.cp-emp-active[b-qzs25b1xa1] { font-weight: 700; color: var(--ink, #0D2D3F); }
.cp-emp-sep[b-qzs25b1xa1] { color: var(--neutral-placeholder, #9BB8C5); margin: 0 3px; }
.cp-emp-total[b-qzs25b1xa1] { color: var(--neutral-muted, #7A9BAD); }
.cp-count[b-qzs25b1xa1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 24px;
    padding: 0 9px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    background: var(--neutral-pill-bg, #F2F5F7);
    color: var(--neutral-placeholder, #9BB8C5);
}
.cp-count.is-nonzero[b-qzs25b1xa1] { background: var(--brand-50, #E8F8FF); color: var(--brand-600, #0D80BB); }
.cp-count.is-accent.is-nonzero[b-qzs25b1xa1] { background: var(--ink, #0D2D3F); color: var(--brand-400, #4AC4FF); }
.cp-user[b-qzs25b1xa1] { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.cp-user-dot[b-qzs25b1xa1] {
    width: 22px; height: 22px; border-radius: 9999px;
    background: var(--neutral-pill-bg, #F2F5F7); color: var(--neutral-label, #4A6878);
    font-size: 9px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.cp-user-name[b-qzs25b1xa1] { font-size: var(--fs-body, 14px); font-weight: 500; color: var(--ink, #0D2D3F); }
.cp-date[b-qzs25b1xa1] { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--neutral-label, #4A6878); }

/* ---------- Action icon button ---------- */
.cp-icon-btn[b-qzs25b1xa1] {
    width: 32px; height: 32px;
    border-radius: var(--radius-md, 8px);
    border: 1.5px solid transparent;
    background: transparent;
    color: var(--neutral-muted, #7A9BAD);
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background .15s ease-out, color .15s ease-out, border-color .15s ease-out;
}
.cp-icon-btn svg[b-qzs25b1xa1] { width: 16px; height: 16px; }
.cp-icon-btn:hover[b-qzs25b1xa1] { background: white; border-color: var(--neutral-border-strong, #DDE8EE); color: var(--ink, #0D2D3F); }

/* ---------- Skeleton ---------- */
.cp-skel[b-qzs25b1xa1] {
    display: block;
    height: 12px;
    border-radius: var(--radius-sm, 6px);
    background: linear-gradient(90deg, var(--neutral-border, #EDF2F5) 25%, #F4F8FA 50%, var(--neutral-border, #EDF2F5) 75%);
    background-size: 200% 100%;
    animation: cp-shimmer-b-qzs25b1xa1 1.3s ease-in-out infinite;
}
.cp-skel-circle[b-qzs25b1xa1] { width: 36px; height: 36px; border-radius: 9999px; }
@keyframes cp-shimmer-b-qzs25b1xa1 {
    from { background-position: 200% 0; }
    to   { background-position: -200% 0; }
}

/* ---------- Empty state ---------- */
.cp-empty[b-qzs25b1xa1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 64px 24px;
    gap: 6px;
}
.cp-empty-icon[b-qzs25b1xa1] {
    width: 56px; height: 56px;
    border-radius: 9999px;
    background: var(--neutral-bg, #F8FBFD);
    border: 1px solid var(--neutral-border, #EDF2F5);
    display: flex; align-items: center; justify-content: center;
    color: var(--neutral-placeholder, #9BB8C5);
    margin-bottom: 10px;
}
.cp-empty-icon svg[b-qzs25b1xa1] { width: 24px; height: 24px; }
.cp-empty-title[b-qzs25b1xa1] { font-size: var(--fs-section, 18px); font-weight: 700; color: var(--ink, #0D2D3F); }
.cp-empty-body[b-qzs25b1xa1] { font-size: var(--fs-body, 14px); color: var(--neutral-muted, #7A9BAD); max-width: 340px; margin-bottom: 10px; }

/* ---------- Pagination ---------- */
.cp-pagination[b-qzs25b1xa1] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}
/* Page info sits at the far left without pulling the controls off-center. */
.cp-page-info[b-qzs25b1xa1] {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 13px;
    color: var(--neutral-muted, #7A9BAD);
}
.cp-page-ctrl[b-qzs25b1xa1] {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    max-width: 100%;
    padding: 2px;
}
.cp-page-btn[b-qzs25b1xa1] {
    min-width: 34px;
    height: 34px;
    padding: 0 9px;
    border-radius: var(--radius-md, 8px);
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    background: white;
    color: var(--neutral-label, #4A6878);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color .15s ease-out, background .15s ease-out, color .15s ease-out;
}
.cp-page-btn svg[b-qzs25b1xa1] { width: 15px; height: 15px; }
.cp-page-btn:hover:not(:disabled):not(.is-active)[b-qzs25b1xa1] { border-color: var(--brand-200, #A8E3F7); color: var(--ink, #0D2D3F); }
.cp-page-btn.is-active[b-qzs25b1xa1] { background: var(--ink, #0D2D3F); border-color: var(--ink, #0D2D3F); color: white; cursor: default; }
.cp-page-btn:disabled[b-qzs25b1xa1] { opacity: .4; cursor: not-allowed; }
.cp-page-ellipsis[b-qzs25b1xa1] { color: var(--neutral-placeholder, #9BB8C5); padding: 0 4px; font-weight: 700; flex-shrink: 0; }

/* ---------- Modal ---------- */
.cp-overlay[b-qzs25b1xa1] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.32);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 56px 20px;
    z-index: 1100;
    overflow-y: auto;
    animation: cp-fade-b-qzs25b1xa1 .15s ease-out;
}
@keyframes cp-fade-b-qzs25b1xa1 { from { opacity: 0; } to { opacity: 1; } }
.cp-modal[b-qzs25b1xa1] {
    background: white;
    border-radius: var(--radius-xl2, 16px);
    width: 100%;
    max-width: 680px;
    box-shadow: 0 12px 48px rgba(13,45,63,0.20);
    animation: cp-modal-in-b-qzs25b1xa1 .18s ease-out;
}
@keyframes cp-modal-in-b-qzs25b1xa1 {
    from { opacity: 0; transform: translateY(8px) scale(.99); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.cp-modal-head[b-qzs25b1xa1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
}
.cp-modal-title[b-qzs25b1xa1] { font-size: var(--fs-title, 23px); font-weight: 700; color: var(--ink, #0D2D3F); margin: 0; }
.cp-modal-sub[b-qzs25b1xa1] { margin-top: 4px; font-size: var(--fs-body, 14px); color: var(--neutral-muted, #7A9BAD); }
.cp-modal-close[b-qzs25b1xa1] {
    width: 34px; height: 34px;
    border-radius: var(--radius-md, 8px);
    border: none; background: transparent;
    color: var(--neutral-muted, #7A9BAD); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.cp-modal-close:hover[b-qzs25b1xa1] { background: var(--neutral-pill-bg, #F2F5F7); color: var(--ink, #0D2D3F); }
.cp-modal-close svg[b-qzs25b1xa1] { width: 18px; height: 18px; }
.cp-modal-body[b-qzs25b1xa1] { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }
.cp-modal-foot[b-qzs25b1xa1] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px 20px;
    border-top: 1px solid var(--neutral-border, #EDF2F5);
}

/* form fields */
.cp-field[b-qzs25b1xa1] { display: flex; flex-direction: column; gap: 6px; }
.cp-field-label[b-qzs25b1xa1] {
    font-size: var(--fs-label, 12px);
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--neutral-label, #4A6878);
}
.cp-field-label .req[b-qzs25b1xa1] { color: #E11D48; margin-left: 2px; }
.cp-input[b-qzs25b1xa1], .cp-select[b-qzs25b1xa1] {
    height: 40px;
    padding: 0 12px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    background: white;
    font-size: var(--fs-body, 14px);
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    outline: none;
    transition: border-color .15s ease-out, box-shadow .15s ease-out;
    width: 100%;
}
.cp-input[b-qzs25b1xa1]::placeholder { color: var(--neutral-placeholder, #9BB8C5); }
.cp-input:focus[b-qzs25b1xa1], .cp-select:focus[b-qzs25b1xa1] { border-color: var(--brand-400, #4AC4FF); box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cp-input.has-error[b-qzs25b1xa1] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }
.cp-select[b-qzs25b1xa1] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A9BAD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
    cursor: pointer;
}
.cp-field-err[b-qzs25b1xa1] {
    font-size: var(--fs-label, 12px);
    font-weight: 500;
    color: #E11D48;
    display: flex; align-items: center; gap: 5px;
}
.cp-field-err svg[b-qzs25b1xa1] { width: 13px; height: 13px; }
.cp-grid-3[b-qzs25b1xa1] { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.cp-grid-2[b-qzs25b1xa1] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* ---------- Status indicator ---------- */
.cp-name-row[b-qzs25b1xa1] { display: flex; align-items: center; gap: 7px; }
.cp-status-dot[b-qzs25b1xa1] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}
.cp-status-dot.is-active[b-qzs25b1xa1] { background: #22C55E; }
.cp-status-dot.is-inactive[b-qzs25b1xa1] { background: #9CA3AF; }
.cp-status-toggle[b-qzs25b1xa1] { display: flex; gap: 8px; }
.cp-status-toggle .cp-btn[b-qzs25b1xa1] { flex: 1; justify-content: center; }

@media (max-width: 720px) {
    .cp-shell[b-qzs25b1xa1] { padding: 1rem; }
    .cp-grid-3[b-qzs25b1xa1], .cp-grid-2[b-qzs25b1xa1] { grid-template-columns: 1fr; }
    .cp-search-wrap[b-qzs25b1xa1] { flex-basis: 100%; min-width: 0; }
    .cp-dd[b-qzs25b1xa1] { flex: 1 1 auto; }
    .cp-dd-trigger[b-qzs25b1xa1] { width: 100%; justify-content: space-between; }
    .cp-page-info[b-qzs25b1xa1] { position: static; transform: none; width: 100%; text-align: center; }
}
/* /Components/Pages/Company/CompanyDetails/CandidateFeedbacks.razor.rz.scp.css */
.candidates-container[b-5nmwzridor] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.candidates-title[b-5nmwzridor] {
    color: #2c3e50;
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.filter-container[b-5nmwzridor] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.search-box[b-5nmwzridor] {
    flex: 1;
    max-width: 400px;
}

.search-input[b-5nmwzridor] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #e1e5e9;
    border-radius: 8px;
    font-size: 0.9rem;
    transition: all 0.2s;
}

.search-input:focus[b-5nmwzridor] {
    outline: none;
    border-color: #3498db;
    box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.2);
}

.filter-buttons[b-5nmwzridor] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.filter-btn[b-5nmwzridor] {
    padding: 0.5rem 1rem;
    background: #f8f9fa;
    border: 1px solid #e1e5e9;
    border-radius: 6px;
    color: #6c757d;
    cursor: pointer;
    font-size: 0.875rem;
    transition: all 0.2s;
}

.filter-btn:hover[b-5nmwzridor] {
    background: #e9ecef;
}

.filter-btn.active[b-5nmwzridor] {
    background: #e9f5ff;
    color: #0b73c7;
    border-color: #9ad3ff;
    font-weight: 500;
}

.candidates-list[b-5nmwzridor] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.candidate-card[b-5nmwzridor] {
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    transition: all 0.3s;
}

.candidate-card:hover[b-5nmwzridor] {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.candidate-card.expanded[b-5nmwzridor] {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}

.candidate-header[b-5nmwzridor] {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    align-items: center;
    padding: 1rem 1.5rem;
    cursor: pointer;
    gap: 1rem;
}

.candidate-name[b-5nmwzridor] {
    font-weight: 600;
    color: #2c3e50;
    font-size: 1.1rem;
}

.candidate-status[b-5nmwzridor] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.status-icon[b-5nmwzridor] {
    display: flex;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
}

.status-icon.pending[b-5nmwzridor] {
    background-color: #fff4e5;
    color: #f59e0b;
}

.status-icon.confirmed[b-5nmwzridor] {
    background-color: #e6f7ed;
    color: #10b981;
}

.status-icon.rejected[b-5nmwzridor] {
    background-color: #feeced;
    color: #ef4444;
}

.status-text[b-5nmwzridor] {
    font-size: 0.875rem;
    font-weight: 500;
}

.status-text.pending[b-5nmwzridor] {
    color: #f59e0b;
}

.status-text.confirmed[b-5nmwzridor] {
    color: #10b981;
}

.status-text.rejected[b-5nmwzridor] {
    color: #ef4444;
}

.candidate-date[b-5nmwzridor] {
    color: #64748b;
    font-size: 0.875rem;
}

.expand-icon[b-5nmwzridor] {
    color: #94a3b8;
    transition: transform 0.3s;
}

.candidate-card.expanded .expand-icon[b-5nmwzridor] {
    transform: rotate(180deg);
}

.candidate-details[b-5nmwzridor] {
    padding: 0 1.5rem 1.5rem;
    border-top: 1px solid #f1f5f9;
    animation: fadeIn-b-5nmwzridor 0.3s ease-in-out;
}

.details-header[b-5nmwzridor] {
    margin-bottom: 1.5rem;
    padding-top: 1rem;
}

.details-header h3[b-5nmwzridor] {
    color: #334155;
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.candidate-metadata[b-5nmwzridor] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

.details-section[b-5nmwzridor] {
    margin-bottom: 1.5rem;
}

.details-section h4[b-5nmwzridor] {
    color: #475569;
    font-size: 1rem;
    margin-bottom: 0.75rem;
    font-weight: 500;
}

.selected-dates[b-5nmwzridor] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.date-card[b-5nmwzridor] {
    background: #f8fafc;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    min-width: 250px;
}

.date-header[b-5nmwzridor] {
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.5rem;
}

.time-slot[b-5nmwzridor] {
    display: flex;
    justify-content: space-between;
    color: #64748b;
    font-size: 0.875rem;
    margin-bottom: 0.5rem;
}

.date-comment[b-5nmwzridor] {
    font-size: 0.875rem;
    color: #64748b;
    font-style: italic;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.answer-box[b-5nmwzridor] {
    background: #f8fafc;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.875rem;
    white-space: pre-line;
}

.no-data[b-5nmwzridor] {
    color: #94a3b8;
    font-style: italic;
    font-size: 0.875rem;
}

.pending-message[b-5nmwzridor] {
    background: #f8fafc;
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    color: #64748b;
    text-align: center;
    font-style: italic;
}

.empty-state[b-5nmwzridor] {
    text-align: center;
    padding: 3rem 0;
    color: #94a3b8;
}

.empty-state i[b-5nmwzridor] {
    font-size: 3rem;
    margin-bottom: 1rem;
    opacity: 0.5;
}

@keyframes fadeIn-b-5nmwzridor {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .candidate-header[b-5nmwzridor] {
        grid-template-columns: 1fr auto;
        grid-template-rows: auto auto;
        gap: 0.5rem;
    }

    .candidate-status[b-5nmwzridor] {
        grid-row: 2;
        grid-column: 1;
    }

    .candidate-date[b-5nmwzridor] {
        grid-row: 2;
        grid-column: 2;
        text-align: right;
    }

    .expand-icon[b-5nmwzridor] {
        grid-row: 1;
        grid-column: 2;
    }
}
/* /Components/Pages/Company/CompanyDetails/CompanyBriefs.razor.rz.scp.css */
@keyframes cb-spin-b-qgmra33nvw { to { transform: rotate(360deg); } }
@keyframes cb-fade-b-qgmra33nvw { from { opacity: 0; } to { opacity: 1; } }
@keyframes cb-pop-b-qgmra33nvw  { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }

.cb-page[b-qgmra33nvw] { display: flex; flex-direction: column; gap: 16px; }

.cb-loading-state[b-qgmra33nvw] { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 440px; gap: 12px; }
.cb-spinner[b-qgmra33nvw] { width: 34px; height: 34px; border-radius: 50%; border: 3px solid #EDF2F5; border-top-color: #4AC4FF; animation: cb-spin-b-qgmra33nvw .7s linear infinite; }
.cb-loading-label[b-qgmra33nvw] { font-size: 13px; color: #9BB8C5; }

.cb-empty-state[b-qgmra33nvw] { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 440px; gap: 10px; text-align: center; }
.cb-empty-icon[b-qgmra33nvw] { width: 56px; height: 56px; border-radius: 14px; background: #F8FBFD; border: 1px solid #EDF2F5; color: #9BB8C5; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.cb-empty-heading[b-qgmra33nvw] { font-weight: 700; font-size: 16px; color: #0D2D3F; }
.cb-empty-sub[b-qgmra33nvw] { font-size: 13px; color: #7A9BAD; max-width: 300px; line-height: 1.5; margin-bottom: 6px; }

.cb-action-bar[b-qgmra33nvw] { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.cb-action-bar-left[b-qgmra33nvw] { display: flex; align-items: baseline; gap: 8px; }
.cb-action-bar-title[b-qgmra33nvw] { font-weight: 700; font-size: 18px; color: #0D2D3F; }
.cb-action-bar-count[b-qgmra33nvw] { font-size: 12px; color: #9BB8C5; font-weight: 500; }

.cb-form-card[b-qgmra33nvw] { border: 1px solid #DDE8EE; border-radius: 12px; padding: 18px 20px; background: #FAFCFD; display: flex; flex-direction: column; gap: 14px; animation: cb-pop-b-qgmra33nvw .18s ease-out; }
.cb-form-header[b-qgmra33nvw] { display: flex; align-items: center; }
.cb-form-title[b-qgmra33nvw] { font-weight: 700; font-size: 16px; color: #0D2D3F; }

.cb-field[b-qgmra33nvw] { display: flex; flex-direction: column; gap: 6px; }
.cb-field-label[b-qgmra33nvw] { font-weight: 600; font-size: 12px; color: #4A6878; }
.cb-req[b-qgmra33nvw] { color: #E11D48; margin-left: 2px; }

.cb-input[b-qgmra33nvw] { height: 40px; padding: 0 14px; border-radius: 8px; border: 1.5px solid #DDE8EE; background: white; font-size: 14px; color: #0D2D3F; outline: none; transition: border-color .15s, box-shadow .15s; width: 100%; font-family: inherit; }
.cb-input[b-qgmra33nvw]::placeholder { color: #9BB8C5; }
.cb-input:focus[b-qgmra33nvw] { border-color: #4AC4FF; box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cb-input--error[b-qgmra33nvw] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }

.cb-field-err[b-qgmra33nvw] { display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; color: #E11D48; }

.cb-md-wrap[b-qgmra33nvw] { border-radius: 10px; border: 1.5px solid #DDE8EE; overflow: hidden; transition: border-color .15s; }
.cb-md-wrap--error[b-qgmra33nvw] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }
.cb-md-wrap:focus-within[b-qgmra33nvw] { border-color: #4AC4FF; }

.cb-md-toolbar[b-qgmra33nvw] { background: #F8FBFD; border-bottom: 1px solid #DDE8EE; padding: 6px; display: flex; align-items: center; gap: 2px; }
.cb-tool[b-qgmra33nvw] { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 6px; border: none; background: none; color: #4A6878; cursor: pointer; font-size: 13px; font-family: inherit; padding: 0; transition: background .12s, color .12s; }
.cb-tool:hover[b-qgmra33nvw] { background: #EDF2F5; color: #0D2D3F; }
.cb-tool--bold[b-qgmra33nvw] { font-weight: 800; font-size: 14px; }
.cb-tool--italic[b-qgmra33nvw] { font-style: italic; font-weight: 600; }
.cb-tool--preview[b-qgmra33nvw] { width: auto; padding: 0 11px; gap: 5px; font-weight: 600; font-size: 12.5px; }
.cb-tool--preview-active[b-qgmra33nvw] { background: #0D2D3F; color: white; }
.cb-tool--preview-active:hover[b-qgmra33nvw] { background: #1E4256; color: white; }
.cb-md-sep[b-qgmra33nvw] { width: 1px; height: 18px; background: #DDE8EE; margin: 0 4px; flex-shrink: 0; }
.cb-md-spacer[b-qgmra33nvw] { flex: 1; }

.cb-md-textarea[b-qgmra33nvw] { display: block; width: 100%; border: none; outline: none; resize: vertical; min-height: 232px; padding: 14px 16px; font-family: inherit; font-size: 14px; line-height: 1.6; color: #0D2D3F; background: white; box-sizing: border-box; }
.cb-md-textarea[b-qgmra33nvw]::placeholder { color: #9BB8C5; }
.cb-md-preview[b-qgmra33nvw] { padding: 16px 18px; min-height: 232px; background: white; }

.cb-form-actions[b-qgmra33nvw] { display: flex; gap: 10px; margin-top: 4px; }

.cb-btn[b-qgmra33nvw] { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 18px; border-radius: 10px; font-weight: 600; font-size: 13px; font-family: inherit; border: 1.5px solid transparent; cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s, color .15s; }
.cb-btn:disabled[b-qgmra33nvw] { opacity: .55; cursor: not-allowed; }
.cb-btn--primary[b-qgmra33nvw] { background: #0D2D3F; color: white; border-color: transparent; }
.cb-btn--primary:hover:not(:disabled)[b-qgmra33nvw] { background: #1E4256; }
.cb-btn--outline[b-qgmra33nvw] { background: white; color: #0D2D3F; border-color: #DDE8EE; }
.cb-btn--outline:hover:not(:disabled)[b-qgmra33nvw] { border-color: #A8E3F7; background: #F8FBFD; }
.cb-btn--danger[b-qgmra33nvw] { background: #F43F5E; color: white; border-color: transparent; }
.cb-btn--danger:hover:not(:disabled)[b-qgmra33nvw] { background: #E11D48; }

.cb-list[b-qgmra33nvw] { display: flex; flex-direction: column; gap: 12px; }

.cb-brief-card[b-qgmra33nvw] { border: 1px solid #E2EBF0; border-radius: 12px; padding: 16px 18px; background: white; transition: border-color .15s; }
.cb-brief-card--editing[b-qgmra33nvw] { border-color: #A8E3F7; box-shadow: 0 0 0 3px rgba(74,196,255,0.10); }

.cb-brief-header[b-qgmra33nvw] { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.cb-brief-left[b-qgmra33nvw] { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.cb-brief-title[b-qgmra33nvw] { font-weight: 600; font-size: 15px; color: #0D2D3F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cb-brief-byline[b-qgmra33nvw] { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #9BB8C5; flex-wrap: wrap; }
.cb-brief-avatar[b-qgmra33nvw] { width: 18px; height: 18px; border-radius: 9999px; background: #0D2D3F; color: #4AC4FF; font-weight: 700; font-size: 8.5px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; letter-spacing: 0; }
.cb-brief-avatar--lg[b-qgmra33nvw] { width: 20px; height: 20px; font-size: 9px; }
.cb-brief-author[b-qgmra33nvw] { color: #4A6878; font-weight: 500; }
.cb-brief-dot[b-qgmra33nvw] { color: #DDE8EE; }
.cb-brief-edited[b-qgmra33nvw] { font-style: italic; color: #9BB8C5; }

.cb-brief-actions[b-qgmra33nvw] { display: flex; gap: 4px; flex-shrink: 0; }
.cb-iconbtn[b-qgmra33nvw] { width: 32px; height: 32px; border-radius: 8px; border: none; background: none; color: #7A9BAD; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; transition: background .12s, color .12s; }
.cb-iconbtn:hover[b-qgmra33nvw] { background: #F2F5F7; color: #0D2D3F; }
.cb-iconbtn--active[b-qgmra33nvw] { background: #E8F8FF; color: #0D80BB; }
.cb-iconbtn--active:hover[b-qgmra33nvw] { background: #D0F0FF; color: #0D80BB; }
.cb-iconbtn--danger:hover[b-qgmra33nvw] { background: #FFF0F3; color: #E11D48; }

.cb-brief-excerpt[b-qgmra33nvw] { position: relative; margin-top: 12px; max-height: 96px; overflow: hidden; }
.cb-brief-fade[b-qgmra33nvw] { position: absolute; bottom: 0; left: 0; right: 0; height: 42px; background: linear-gradient(to bottom, rgba(255,255,255,0), white); pointer-events: none; }

.cb-backdrop[b-qgmra33nvw] { position: fixed; inset: 0; background: rgba(13, 45, 63, 0.32); display: flex; align-items: flex-start; justify-content: center; padding: 56px 20px; z-index: 1100; overflow-y: auto; animation: cb-fade-b-qgmra33nvw .15s ease-out; }

.cb-modal[b-qgmra33nvw] { background: white; border-radius: 14px; width: 100%; display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(13,45,63,0.22); animation: cb-pop-b-qgmra33nvw .18s ease-out; max-height: 84vh; }
.cb-modal--view[b-qgmra33nvw] { max-width: 660px; }
.cb-modal--delete[b-qgmra33nvw] { max-width: 420px; }

.cb-modal-head[b-qgmra33nvw] { display: flex; align-items: flex-start; justify-content: space-between; padding: 22px 24px 16px; border-bottom: 1px solid #EDF2F5; flex-shrink: 0; }
.cb-modal-head--sm[b-qgmra33nvw] { padding: 20px 22px 14px; }
.cb-modal-title[b-qgmra33nvw] { font-weight: 700; font-size: 20px; color: #0D2D3F; letter-spacing: -0.01em; margin: 0; }
.cb-modal-title--sm[b-qgmra33nvw] { font-size: 17px; }
.cb-modal-close[b-qgmra33nvw] { width: 32px; height: 32px; border-radius: 8px; border: none; background: none; color: #7A9BAD; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 0; transition: background .12s, color .12s; }
.cb-modal-close:hover[b-qgmra33nvw] { background: #F2F5F7; color: #0D2D3F; }

.cb-modal-body[b-qgmra33nvw] { padding: 16px 24px 24px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 14px; }
.cb-modal-body--sm[b-qgmra33nvw] { padding: 0 22px 4px; }
.cb-modal-foot[b-qgmra33nvw] { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid #EDF2F5; flex-shrink: 0; }
.cb-modal-meta[b-qgmra33nvw] { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #9BB8C5; flex-wrap: wrap; }
/* /Components/Pages/Company/CompanyDetails/CompanyContacts.razor.rz.scp.css */
.cc-page[b-5mknnykf31] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.cc-header[b-5mknnykf31] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.cc-title[b-5mknnykf31] {
    font-size: 18px;
    font-weight: 600;
    color: var(--ink, #0D2D3F);
    margin: 0;
}

.cc-section[b-5mknnykf31] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cc-section-label[b-5mknnykf31] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--neutral-label, #4A6572);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-left: 2px;
    border-left: 3px solid var(--brand-400, #4AC4FF);
    padding-left: 8px;
}

.cc-section-count[b-5mknnykf31] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: var(--neutral-pill-bg, #EEF3F6);
    color: var(--neutral-muted, #7A9BAD);
    font-size: 11px;
    font-weight: 600;
}

.cc-cards[b-5mknnykf31] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
}

.cc-card[b-5mknnykf31] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: white;
    border: 1px solid var(--neutral-border, #DDE6EB);
    border-radius: 8px;
    transition: border-color 0.15s, background 0.15s;
}

.cc-card:hover[b-5mknnykf31] {
    border-color: var(--brand-200, #A8E8FF);
    background: #FAFCFF;
}

.cc-card-avatar[b-5mknnykf31] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--brand-400, #4AC4FF);
    color: var(--ink, #0D2D3F);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.cc-card-avatar--internal[b-5mknnykf31] {
    background: #7C6FD4;
    color: white;
}

.cc-card-body[b-5mknnykf31] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cc-card-name[b-5mknnykf31] {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink, #0D2D3F);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cc-card-role[b-5mknnykf31] {
    font-size: 12px;
    color: var(--neutral-muted, #7A9BAD);
}

.cc-card-email-row[b-5mknnykf31] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
}

.cc-card-email[b-5mknnykf31] {
    font-size: 13px;
    color: var(--brand-600, #0A7FA8);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.cc-card-email:hover[b-5mknnykf31] { text-decoration: underline; }

.cc-copy-btn[b-5mknnykf31] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px solid var(--neutral-border, #DDE6EB);
    border-radius: 4px;
    background: transparent;
    color: var(--neutral-muted, #7A9BAD);
    cursor: pointer;
    padding: 0;
    font-size: 12px;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}

.cc-copy-btn:hover[b-5mknnykf31] {
    background: var(--neutral-pill-bg, #EEF3F6);
    color: var(--ink, #0D2D3F);
    border-color: var(--brand-200, #A8E8FF);
}

.cc-card-comment[b-5mknnykf31] {
    font-size: 12px;
    color: var(--neutral-muted, #7A9BAD);
    margin-top: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cc-card-actions[b-5mknnykf31] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    opacity: 0;
    transition: opacity 0.15s;
}

.cc-card:hover .cc-card-actions[b-5mknnykf31] { opacity: 1; }

.cc-empty[b-5mknnykf31] {
    font-size: 13px;
    color: var(--neutral-muted, #7A9BAD);
    padding: 12px 0;
}

/* ---------- Buttons ---------- */
.cp-btn[b-5mknnykf31] {
    height: 38px;
    padding: 0 16px;
    border-radius: var(--radius-md, 8px);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    border: 1.5px solid transparent;
    white-space: nowrap;
    transition: background .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}
.cp-btn svg[b-5mknnykf31] { width: 16px; height: 16px; }
.cp-btn-primary[b-5mknnykf31] { background: var(--ink, #0D2D3F); color: white; border: none; }
.cp-btn-primary:hover[b-5mknnykf31] { background: #1E4256; }
.cp-btn-outline[b-5mknnykf31] { background: white; color: var(--ink, #0D2D3F); border-color: var(--neutral-border-strong, #DDE8EE); }
.cp-btn-outline:hover[b-5mknnykf31] { border-color: var(--brand-200, #A8E3F7); background: var(--neutral-bg, #F8FBFD); }
.cp-btn:disabled[b-5mknnykf31] { opacity: .45; cursor: not-allowed; }

/* ---------- Modal ---------- */
.cp-overlay[b-5mknnykf31] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.32);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 56px 20px;
    z-index: 1100;
    overflow-y: auto;
    animation: cc-fade-b-5mknnykf31 .15s ease-out;
}
@keyframes cc-fade-b-5mknnykf31 { from { opacity: 0; } to { opacity: 1; } }
.cp-modal[b-5mknnykf31] {
    background: white;
    border-radius: var(--radius-xl2, 16px);
    width: 100%;
    max-width: 680px;
    box-shadow: 0 12px 48px rgba(13,45,63,0.20);
    animation: cc-modal-in-b-5mknnykf31 .18s ease-out;
}
@keyframes cc-modal-in-b-5mknnykf31 {
    from { opacity: 0; transform: translateY(8px) scale(.99); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.cp-modal--sm[b-5mknnykf31] { max-width: 420px; }
.cp-modal-head[b-5mknnykf31] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--neutral-border, #EDF2F5);
}
.cp-modal-title[b-5mknnykf31] { font-size: 20px; font-weight: 700; color: var(--ink, #0D2D3F); margin: 0; }
.cp-modal-close[b-5mknnykf31] {
    width: 34px; height: 34px;
    border-radius: var(--radius-md, 8px);
    border: none; background: transparent;
    color: var(--neutral-muted, #7A9BAD); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.cp-modal-close:hover[b-5mknnykf31] { background: var(--neutral-pill-bg, #F2F5F7); color: var(--ink, #0D2D3F); }
.cp-modal-close svg[b-5mknnykf31] { width: 18px; height: 18px; }
.cp-modal-body[b-5mknnykf31] { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }
.cp-modal-foot[b-5mknnykf31] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px 20px;
    border-top: 1px solid var(--neutral-border, #EDF2F5);
}

/* ---------- Form fields ---------- */
.cp-grid-2[b-5mknnykf31] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cp-field[b-5mknnykf31] { display: flex; flex-direction: column; gap: 6px; }
.cp-field-label[b-5mknnykf31] {
    font-size: 12px;
    font-weight: 600;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--neutral-label, #4A6878);
}
.cp-field-label .req[b-5mknnykf31] { color: #E11D48; margin-left: 2px; }
.cp-input[b-5mknnykf31], .cp-select[b-5mknnykf31] {
    height: 40px;
    padding: 0 12px;
    border: 1.5px solid var(--neutral-border-strong, #DDE8EE);
    border-radius: var(--radius-md, 8px);
    background: white;
    font-size: 14px;
    font-family: var(--font-sans, "Inter", system-ui, sans-serif);
    color: var(--ink, #0D2D3F);
    outline: none;
    transition: border-color .15s ease-out, box-shadow .15s ease-out;
    width: 100%;
}
.cp-input[b-5mknnykf31]::placeholder { color: var(--neutral-placeholder, #9BB8C5); }
.cp-input:focus[b-5mknnykf31], .cp-select:focus[b-5mknnykf31] { border-color: var(--brand-400, #4AC4FF); box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cp-input.has-error[b-5mknnykf31] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }
.cp-select[b-5mknnykf31] {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A9BAD' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
    cursor: pointer;
}
textarea.cp-input[b-5mknnykf31] { height: auto; padding: 10px 12px; resize: vertical; }
.cp-field-err[b-5mknnykf31] {
    font-size: 12px;
    font-weight: 500;
    color: #E11D48;
    display: flex; align-items: center; gap: 5px;
}

.cp-btn-danger[b-5mknnykf31] {
    background: #E11D48;
    color: white;
    border-color: #E11D48;
}

.cp-btn-danger:hover[b-5mknnykf31] {
    background: #BE123C;
    border-color: #BE123C;
}

@media (max-width: 640px) {
    .cc-cards[b-5mknnykf31] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Company/CompanyDetails/CompanyDetailsPage.razor.rz.scp.css */
/* Scoped CSS for CompanyDetailsPage.razor. ::deep used to reach Dashboard / Employees / Feedbacks child components. Tokens come from talents-tokens.css. */

[b-dwyiqv8ol0] .cd-dashboard, [b-dwyiqv8ol0] .cd-employees, [b-dwyiqv8ol0] .cd-feedbacks { font-family: var(--font-sans); color: var(--ink); padding-bottom: var(--space-8); }
[b-dwyiqv8ol0] .cd-dashboard *, [b-dwyiqv8ol0] .cd-employees *, [b-dwyiqv8ol0] .cd-feedbacks * { box-sizing: border-box; }

/* ==========================================================================
   PAGE WRAPPER
   ========================================================================== */
.cp-page[b-dwyiqv8ol0] {
    width: 100%;
    padding: 0.5rem 1.5rem 2rem;
    background: white;
    font-family: var(--font-sans);
    color: var(--ink);
}

/* ==========================================================================
   BACK LINK
   ========================================================================== */
.cp-back-link[b-dwyiqv8ol0] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 12px -8px;
    padding: 5px 8px;
    border-radius: var(--radius-md);
    color: var(--neutral-muted);
    text-decoration: none;
    font-size: 12px;
    font-weight: var(--fw-medium);
    transition: background 150ms ease-out, color 150ms ease-out;
}
.cp-back-link:hover[b-dwyiqv8ol0] {
    color: var(--ink);
    background: var(--neutral-pill-bg);
}
.cp-back-link i[b-dwyiqv8ol0] { font-size: 13px; line-height: 1; }

/* ==========================================================================
   HEADER CARD
   ========================================================================== */
.cp-header[b-dwyiqv8ol0] {
    margin-bottom: 20px;
}
.cp-header-grid[b-dwyiqv8ol0] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: flex-start;
}
.cp-identity[b-dwyiqv8ol0] {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}
.cp-avatar[b-dwyiqv8ol0] {
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: var(--ink);
    color: var(--brand-400);
    font-weight: var(--fw-black);
    font-size: 22px;
    letter-spacing: -0.01em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cp-name-row[b-dwyiqv8ol0] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cp-name[b-dwyiqv8ol0] {
    font-size: 26px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.012em;
    line-height: 1.15;
    margin: 0;
}
.cp-meta-stack[b-dwyiqv8ol0] {
    display: flex;
    gap: 28px;
    margin-top: 10px;
    flex-wrap: wrap;
}
.cp-meta-item[b-dwyiqv8ol0] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.cp-meta-key[b-dwyiqv8ol0] {
    font-size: 10px;
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.cp-meta-val[b-dwyiqv8ol0] {
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
}
.cp-meta-row[b-dwyiqv8ol0] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--neutral-muted);
    margin-top: 4px;
}
.cp-meta-row a[b-dwyiqv8ol0] { color: var(--brand-600, #0A5F8A); text-decoration: none; }
.cp-meta-row a:hover[b-dwyiqv8ol0] { text-decoration: underline; }
.cp-meta-row i[b-dwyiqv8ol0] { font-size: 13px; }
.cp-stat-bar[b-dwyiqv8ol0] {
    display: flex;
    gap: 28px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--neutral-border);
    flex-wrap: wrap;
}
.cp-stat[b-dwyiqv8ol0] { display: flex; flex-direction: column; gap: 2px; }
.cp-stat-val[b-dwyiqv8ol0] {
    font-size: 20px;
    font-weight: var(--fw-black);
    color: var(--ink);
    line-height: 1.1;
    letter-spacing: -0.01em;
}
.cp-stat-lbl[b-dwyiqv8ol0] {
    font-size: 10px;
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    text-transform: uppercase;
    letter-spacing: 0.09em;
}
.cp-actions[b-dwyiqv8ol0] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

/* ==========================================================================
   TABS LAYOUT
   ========================================================================== */
.cp-tabs-layout[b-dwyiqv8ol0] {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    min-height: calc(100vh - 280px);
}
.cp-tabs-sidebar[b-dwyiqv8ol0] {
    position: sticky;
    top: 24px;
    flex-shrink: 0;
    width: 220px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cp-tab-item[b-dwyiqv8ol0] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px 10px 13px;
    border-radius: 8px;
    border: none;
    border-left: 3px solid transparent;
    background: transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-muted);
    cursor: pointer;
    text-align: left;
    transition: background 150ms ease-out, color 150ms ease-out;
}
.cp-tab-item:hover[b-dwyiqv8ol0] {
    background: var(--neutral-bg);
    color: var(--neutral-label);
}
.cp-tab-item.active[b-dwyiqv8ol0] {
    background: var(--brand-50);
    color: var(--ink);
    border-left-color: var(--brand-400);
}
.cp-tab-item i[b-dwyiqv8ol0] { font-size: 16px; flex-shrink: 0; }
.cp-tab-item > span[b-dwyiqv8ol0] { flex: 1; }
.cp-tab-badge[b-dwyiqv8ol0] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    flex: 0 0 22px !important;
    box-sizing: border-box !important;
    border-radius: 50%;
    font-size: 11px;
    font-weight: var(--fw-bold);
    background: var(--neutral-pill-bg);
    color: var(--neutral-label);
}
.cp-tab-item.active .cp-tab-badge[b-dwyiqv8ol0] {
    background: #C5EDFF;
    color: #0A5F8A;
}
.cp-tab-content[b-dwyiqv8ol0] {
    flex: 1;
    min-width: 0;
}

@media (max-width: 960px) {
    .cp-page[b-dwyiqv8ol0] { padding: 0.75rem 1rem 2rem; }
    .cp-header-grid[b-dwyiqv8ol0] { grid-template-columns: 1fr; gap: 16px; }
    .cp-actions[b-dwyiqv8ol0] { flex-wrap: wrap; }
    .cp-tabs-layout[b-dwyiqv8ol0] {
        flex-direction: column;
        gap: 0;
        min-height: 0;
    }
    .cp-tabs-sidebar[b-dwyiqv8ol0] {
        position: static;
        width: 100%;
        border-radius: var(--radius-lg);
        padding: 4px;
        flex-direction: row;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 0;
        margin-bottom: 16px;
    }
    .cp-tab-item[b-dwyiqv8ol0] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 8px 12px;
        border-left: none;
        border-bottom: 3px solid transparent;
        width: auto;
        flex-shrink: 0;
        gap: 4px;
        font-size: 11px;
        white-space: nowrap;
    }
    .cp-tab-item.active[b-dwyiqv8ol0] {
        border-left-color: transparent;
        border-bottom-color: var(--brand-400);
        background: var(--brand-50);
    }
    .cp-tab-badge[b-dwyiqv8ol0] { display: none; }
}

/* ==========================================================================
   PERIOD BAR
   ========================================================================== */
[b-dwyiqv8ol0] .cd-period-bar {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
  flex-wrap: wrap;
}
[b-dwyiqv8ol0] .cd-period-bar__spacer { flex: 1; }

/* segmented control */
[b-dwyiqv8ol0] .cd-seg {
  display: inline-flex;
  padding: 3px;
  background: var(--neutral-pill-bg);
  border-radius: var(--radius-md);
}
[b-dwyiqv8ol0] .cd-seg-btn {
  appearance: none;
  border: 0;
  background: transparent;
  font-family: inherit;
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  color: var(--neutral-muted);
  padding: 6px 14px;
  border-radius: 6px;
  cursor: pointer;
}
[b-dwyiqv8ol0] .cd-seg-btn:hover { color: var(--ink); }
[b-dwyiqv8ol0] .cd-seg-btn.is-active {
  background: white;
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}

[b-dwyiqv8ol0] .cd-period-stepper {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}
[b-dwyiqv8ol0] .cd-date-range {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  height: 36px;
  padding: 0 var(--space-3);
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  background: white;
  font-size: var(--fs-body);
  color: var(--ink);
  cursor: pointer;
  transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-date-range:hover { border-color: var(--brand-200); }
[b-dwyiqv8ol0] .cd-date-range:focus { border-color: var(--brand-400); box-shadow: var(--focus-brand); outline: none; }
[b-dwyiqv8ol0] .cd-date-range__val { font-weight: var(--fw-medium); }
[b-dwyiqv8ol0] .cd-date-range__arrow { color: var(--neutral-placeholder); }
[b-dwyiqv8ol0] .cd-date-range__icon { color: var(--neutral-muted); }

/* icon button */
[b-dwyiqv8ol0] .cd-icon-btn {
  appearance: none;
  background: white;
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  width: 32px; height: 32px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--ink);
  transition: background 150ms ease-out, border-color 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-icon-btn:hover { background: var(--neutral-pill-bg); border-color: var(--brand-200); }
[b-dwyiqv8ol0] .cd-icon-btn:disabled { opacity: 0.45; cursor: default; }
[b-dwyiqv8ol0] .cd-icon-btn--ghost { background: transparent; border-color: transparent; color: var(--neutral-muted); }
[b-dwyiqv8ol0] .cd-icon-btn--ghost:hover { background: var(--neutral-pill-bg); color: var(--ink); border-color: transparent; }

/* ==========================================================================
   BUTTONS
   ========================================================================== */
[b-dwyiqv8ol0] .cd-btn {
  appearance: none;
  font-family: inherit;
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  height: 38px;
  padding: 0 var(--space-4);
  border-radius: var(--radius-md);
  border: 1.5px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 150ms ease-out, border-color 150ms ease-out, color 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-btn--sm { height: 32px; padding: 0 12px; font-size: var(--fs-label); }
[b-dwyiqv8ol0] .cd-btn--primary  { background: var(--ink); color: white; }
[b-dwyiqv8ol0] .cd-btn--primary:hover  { background: #1E4256; }
[b-dwyiqv8ol0] .cd-btn--brand    { background: var(--brand-400); color: var(--ink); }
[b-dwyiqv8ol0] .cd-btn--brand:hover    { background: var(--brand-500); }
[b-dwyiqv8ol0] .cd-btn--outline  { background: white; color: var(--ink); border-color: var(--neutral-border-strong); }
[b-dwyiqv8ol0] .cd-btn--outline:hover  { background: var(--neutral-bg); border-color: var(--brand-200); }
[b-dwyiqv8ol0] .cd-btn--ghost    { background: transparent; color: var(--neutral-muted); }
[b-dwyiqv8ol0] .cd-btn--ghost:hover    { background: var(--neutral-pill-bg); color: var(--ink); }

/* ==========================================================================
   STATUS SWITCH (active / inactive)
   ========================================================================== */
[b-dwyiqv8ol0] .cd-status-switch { display: inline-flex; align-items: center; gap: 8px; }
[b-dwyiqv8ol0] .cd-status-switch-label {
  font-size: var(--fs-label, 12px);
  font-weight: var(--fw-semibold, 600);
  color: var(--neutral-label, #4A6878);
  min-width: 52px;
  text-align: right;
}
[b-dwyiqv8ol0] .cd-status-switch.is-active .cd-status-switch-label { color: #16A34A; }
[b-dwyiqv8ol0] .cd-switch {
  position: relative;
  width: 42px;
  height: 24px;
  border-radius: 9999px;
  border: none;
  background: var(--neutral-border-strong, #DDE8EE);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  transition: background 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-switch.on { background: #22C55E; }
[b-dwyiqv8ol0] .cd-switch:disabled { opacity: .6; cursor: not-allowed; }
[b-dwyiqv8ol0] .cd-switch-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 1px 2px rgba(13, 45, 63, 0.25);
  transition: transform 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-switch.on .cd-switch-thumb { transform: translateX(18px); }

/* ==========================================================================
   READ-ONLY PROFILE VALUES
   ========================================================================== */
[b-dwyiqv8ol0] .cp-readonly-value {
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  color: var(--ink);
  padding: 6px 0;
  min-height: 32px;
  word-break: break-word;
}

/* ==========================================================================
   KPI GRID
   ========================================================================== */
[b-dwyiqv8ol0] .cd-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
  margin-bottom: var(--space-5);
}
[b-dwyiqv8ol0] .cd-kpi {
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  padding: var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
[b-dwyiqv8ol0] .cd-kpi__overline {
  font-size: var(--fs-overline);
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
[b-dwyiqv8ol0] .cd-kpi__value {
  font-size: 32px;
  font-weight: var(--fw-black);
  color: var(--ink);
  line-height: 1.05;
  letter-spacing: -0.015em;
}
[b-dwyiqv8ol0] .cd-kpi__unit {
  font-size: 18px;
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  margin-left: 2px;
}
[b-dwyiqv8ol0] .cd-kpi__delta {
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
[b-dwyiqv8ol0] .cd-kpi__delta--up   { color: var(--success-text); }
[b-dwyiqv8ol0] .cd-kpi__delta--down { color: var(--error-text); }
[b-dwyiqv8ol0] .cd-kpi__delta--flat { color: var(--neutral-placeholder); }

/* ==========================================================================
   GRID HELPERS
   ========================================================================== */
[b-dwyiqv8ol0] .cd-grid-2-1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}
[b-dwyiqv8ol0] .cd-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

@media (max-width: 1024px) {
  .cd-kpi-grid[b-dwyiqv8ol0] { grid-template-columns: repeat(2, 1fr); }
  .cd-grid-2-1[b-dwyiqv8ol0], .cd-grid-3[b-dwyiqv8ol0] { grid-template-columns: 1fr; }
}

/* ==========================================================================
   CARDS
   ========================================================================== */
[b-dwyiqv8ol0] .cd-card {
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
[b-dwyiqv8ol0] .cd-card--flush { padding: 0; }
[b-dwyiqv8ol0] .cd-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
[b-dwyiqv8ol0] .cd-card__title {
  font-size: var(--fs-section);
  font-weight: var(--fw-bold);
  color: var(--ink);
  letter-spacing: -0.005em;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  line-height: 1.25;
}

/* breakdown rows (Overview) */
[b-dwyiqv8ol0] .cd-breakdown {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}
[b-dwyiqv8ol0] .cd-breakdown__row {
  display: grid;
  grid-template-columns: 200px 1fr 64px;
  align-items: center;
  gap: var(--space-4);
}
[b-dwyiqv8ol0] .cd-breakdown__label {
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
[b-dwyiqv8ol0] .cd-breakdown__bar {
  height: 8px;
  background: var(--neutral-border);
  border-radius: var(--radius-full);
  overflow: hidden;
}
[b-dwyiqv8ol0] .cd-breakdown__bar > span {
  display: block;
  height: 100%;
  border-radius: var(--radius-full);
}
[b-dwyiqv8ol0] .cd-breakdown__val {
  text-align: right;
  font-size: var(--fs-section);
  font-weight: var(--fw-bold);
  color: var(--ink);
}
[b-dwyiqv8ol0] .cd-dim { color: var(--neutral-placeholder); font-weight: var(--fw-semibold); }
[b-dwyiqv8ol0] .cd-muted { color: var(--neutral-placeholder); }

/* metric list (Engagement cards) */
[b-dwyiqv8ol0] .cd-metric-list { margin: 0; display: flex; flex-direction: column; }
[b-dwyiqv8ol0] .cd-metric-list__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--neutral-border);
}
[b-dwyiqv8ol0] .cd-metric-list__row:last-child { border-bottom: 0; padding-bottom: 0; }
[b-dwyiqv8ol0] .cd-metric-list__row:first-child { padding-top: 0; }
[b-dwyiqv8ol0] .cd-metric-list__row dt {
  font-size: var(--fs-body);
  font-weight: var(--fw-medium);
  color: var(--neutral-muted);
}
[b-dwyiqv8ol0] .cd-metric-list__row dd {
  margin: 0;
  font-size: var(--fs-card);
  font-weight: var(--fw-bold);
  color: var(--ink);
}

/* accent (left bar) cards — replaced with subtle top-line accent */
[b-dwyiqv8ol0] .cd-card--accent { position: relative; }
[b-dwyiqv8ol0] .cd-card--accent-success { box-shadow: inset 3px 0 0 var(--success); }
[b-dwyiqv8ol0] .cd-card--accent-error   { box-shadow: inset 3px 0 0 var(--error); }
[b-dwyiqv8ol0] .cd-card--accent-neutral { box-shadow: inset 3px 0 0 var(--neutral-border-strong); }

/* ==========================================================================
   DOTS
   ========================================================================== */
[b-dwyiqv8ol0] .cd-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 9999px;
  flex: 0 0 8px;
}
[b-dwyiqv8ol0] .cd-dot--success { background: var(--success); }
[b-dwyiqv8ol0] .cd-dot--warning { background: var(--warning); }
[b-dwyiqv8ol0] .cd-dot--error   { background: var(--error); }
[b-dwyiqv8ol0] .cd-dot--neutral { background: var(--neutral-placeholder); }
[b-dwyiqv8ol0] .cd-dot--brand   { background: var(--brand-400); }

/* ==========================================================================
   PILLS / BADGES
   ========================================================================== */
[b-dwyiqv8ol0] .cd-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: var(--radius-full);
  font-size: 10px;
  font-weight: var(--fw-bold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
[b-dwyiqv8ol0] .cd-pill--neutral { background: var(--neutral-pill-bg); color: var(--neutral-label); }
[b-dwyiqv8ol0] .cd-pill--success { background: var(--success-bg); color: var(--success-text); border: 1px solid var(--success-border); }
[b-dwyiqv8ol0] .cd-pill--warning { background: var(--warning-bg); color: var(--warning-text); border: 1px solid var(--warning-border); }
[b-dwyiqv8ol0] .cd-pill--error   { background: var(--error-bg);   color: var(--error-text);   border: 1px solid var(--error-border); }
[b-dwyiqv8ol0] .cd-pill--brand   { background: var(--brand-50);   color: var(--brand-600); }
[b-dwyiqv8ol0] .cd-pill--outline { background: white; color: var(--neutral-label); border: 1.5px solid var(--neutral-border-strong); }

/* ==========================================================================
   LIST TOOLBAR (search + filters)
   ========================================================================== */
[b-dwyiqv8ol0] .cd-list-toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
  flex-wrap: wrap;
}
[b-dwyiqv8ol0] .cd-list-toolbar__filters { display: inline-flex; gap: var(--space-2); flex-wrap: wrap; }
[b-dwyiqv8ol0] .cd-list-toolbar__spacer { flex: 1; }

[b-dwyiqv8ol0] .cd-search {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 1;
  min-width: 280px;
  max-width: 420px;
  height: 38px;
  background: white;
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  padding: 0 var(--space-3);
  gap: var(--space-2);
  transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-search:focus-within { border-color: var(--brand-400); box-shadow: var(--focus-brand); }
[b-dwyiqv8ol0] .cd-search__icon { color: var(--neutral-placeholder); flex: 0 0 16px; }
[b-dwyiqv8ol0] .cd-search__input {
  flex: 1; border: 0; outline: 0;
  font-family: inherit;
  font-size: var(--fs-body);
  color: var(--ink);
  background: transparent;
}
[b-dwyiqv8ol0] .cd-search__input::placeholder { color: var(--neutral-placeholder); }
[b-dwyiqv8ol0] .cd-kbd {
  display: inline-flex;
  align-items: center;
  font-family: inherit;
  font-size: 11px;
  font-weight: var(--fw-semibold);
  color: var(--neutral-muted);
  background: var(--neutral-pill-bg);
  border: 1px solid var(--neutral-border-strong);
  border-radius: 6px;
  padding: 2px 6px;
}

[b-dwyiqv8ol0] .cd-select {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 var(--space-3);
  background: white;
  border: 1px solid var(--neutral-border-strong);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color 150ms ease-out;
  font-size: var(--fs-body);
}
[b-dwyiqv8ol0] .cd-select:hover { border-color: var(--brand-200); }
[b-dwyiqv8ol0] .cd-select__label {
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  color: var(--neutral-placeholder);
}
[b-dwyiqv8ol0] .cd-select__val {
  font-weight: var(--fw-semibold);
  color: var(--ink);
}
[b-dwyiqv8ol0] .cd-select svg { color: var(--neutral-muted); }

/* ==========================================================================
   DATA TABLE
   ========================================================================== */
[b-dwyiqv8ol0] .cd-data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
[b-dwyiqv8ol0] .cd-data-table thead th {
  text-align: left;
  font-size: var(--fs-overline);
  font-weight: var(--fw-bold);
  color: var(--neutral-placeholder);
  letter-spacing: 0.09em;
  text-transform: uppercase;
  padding: var(--space-3) var(--space-5);
  background: var(--neutral-bg);
  border-bottom: 1px solid var(--neutral-border-strong);
}
[b-dwyiqv8ol0] .cd-data-table thead th:first-child { border-top-left-radius: var(--radius-lg2); }
[b-dwyiqv8ol0] .cd-data-table thead th:last-child  { border-top-right-radius: var(--radius-lg2); }
[b-dwyiqv8ol0] .cd-data-table th.cd-col-name { display: flex; align-items: center; gap: 6px; }
[b-dwyiqv8ol0] .cd-data-table .cd-sort-ind { color: var(--brand-600); }
[b-dwyiqv8ol0] .cd-data-table tbody td {
  padding: var(--space-3) var(--space-5);
  font-size: var(--fs-body);
  color: var(--neutral-label);
  border-bottom: 1px solid var(--neutral-border);
  vertical-align: middle;
}
[b-dwyiqv8ol0] .cd-data-table tbody tr:last-child td { border-bottom: 0; }
[b-dwyiqv8ol0] .cd-data-table tbody tr:hover td { background: var(--neutral-bg); }
[b-dwyiqv8ol0] .cd-data-table .cd-col-actions { width: 44px; text-align: right; }
[b-dwyiqv8ol0] .cd-data-table .cd-t-strong { font-weight: var(--fw-semibold); color: var(--ink); }
[b-dwyiqv8ol0] .cd-data-table .cd-t-mono__txt {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  font-size: 12.5px;
  color: var(--neutral-muted);
}

[b-dwyiqv8ol0] .cd-data-table__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--neutral-border);
  background: var(--neutral-surface);
  border-radius: 0 0 var(--radius-lg2) var(--radius-lg2);
}
[b-dwyiqv8ol0] .cd-data-table__footer--standalone {
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  background: white;
  margin-top: var(--space-4);
}
[b-dwyiqv8ol0] .cd-data-table__meta {
  font-size: var(--fs-label);
  color: var(--neutral-muted);
}
[b-dwyiqv8ol0] .cd-pager {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
[b-dwyiqv8ol0] .cd-pager__page {
  min-width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  color: var(--neutral-muted);
  border-radius: var(--radius-sm);
  padding: 0 8px;
  cursor: pointer;
}
[b-dwyiqv8ol0] .cd-pager__page:hover { background: var(--neutral-pill-bg); color: var(--ink); }
[b-dwyiqv8ol0] .cd-pager__page.is-active { background: var(--ink); color: white; }

/* ==========================================================================
   CELL: USER
   ========================================================================== */
[b-dwyiqv8ol0] .cd-cell-user {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
}
[b-dwyiqv8ol0] .cd-cell-user__txt { display: flex; flex-direction: column; gap: 2px; }
[b-dwyiqv8ol0] .cd-cell-user__name {
  font-size: var(--fs-body);
  font-weight: var(--fw-semibold);
  color: var(--ink);
}
[b-dwyiqv8ol0] .cd-cell-user__sub {
  font-size: var(--fs-caption);
  color: var(--neutral-placeholder);
}

[b-dwyiqv8ol0] .cd-avatar {
  width: 32px; height: 32px;
  border-radius: 9999px;
  background: var(--ink);
  color: var(--brand-400);
  font-size: 11px;
  font-weight: var(--fw-bold);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  letter-spacing: 0.02em;
}
[b-dwyiqv8ol0] .cd-avatar--lg {
  width: 42px; height: 42px; font-size: 13px; flex-basis: 42px;
}
[b-dwyiqv8ol0] .cd-avatar--muted {
  background: var(--neutral-pill-bg);
  color: var(--neutral-muted);
}

/* ==========================================================================
   CHIP ROW (status filters)
   ========================================================================== */
[b-dwyiqv8ol0] .cd-chip-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
  flex-wrap: wrap;
}
[b-dwyiqv8ol0] .cd-chip {
  appearance: none;
  border: 1px solid var(--neutral-border-strong);
  background: white;
  font-family: inherit;
  font-size: var(--fs-label);
  font-weight: var(--fw-semibold);
  color: var(--neutral-muted);
  padding: 6px 12px;
  border-radius: var(--radius-full);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background 150ms ease-out, border-color 150ms ease-out, color 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-chip:hover { color: var(--ink); border-color: var(--brand-200); }
[b-dwyiqv8ol0] .cd-chip.is-active {
  background: var(--ink);
  color: white;
  border-color: var(--ink);
}
[b-dwyiqv8ol0] .cd-chip__count {
  font-size: 10px;
  font-weight: var(--fw-bold);
  background: var(--neutral-pill-bg);
  color: var(--neutral-label);
  padding: 2px 7px;
  border-radius: 9999px;
}
[b-dwyiqv8ol0] .cd-chip.is-active .cd-chip__count {
  background: rgba(255,255,255,0.12);
  color: var(--brand-400);
}

/* ==========================================================================
   FEEDBACK LIST
   ========================================================================== */
[b-dwyiqv8ol0] .cd-fb-list { display: flex; flex-direction: column; gap: var(--space-3); }
[b-dwyiqv8ol0] .cd-fb-item {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: var(--space-2);
  background: white;
  border: 1px solid var(--neutral-card-border);
  border-radius: var(--radius-lg2);
  padding: var(--space-4) var(--space-5);
  transition: box-shadow 150ms ease-out, border-color 150ms ease-out;
}
[b-dwyiqv8ol0] .cd-fb-item:hover { box-shadow: var(--shadow-sm); border-color: var(--neutral-border-strong); }
[b-dwyiqv8ol0] .cd-fb-item__lead { padding-top: 2px; }
[b-dwyiqv8ol0] .cd-fb-item__main { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
[b-dwyiqv8ol0] .cd-fb-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
[b-dwyiqv8ol0] .cd-fb-item__candidate {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
[b-dwyiqv8ol0] .cd-fb-item__name {
  font-size: var(--fs-card);
  font-weight: var(--fw-bold);
  color: var(--ink);
}
[b-dwyiqv8ol0] .cd-fb-item__role {
  font-size: var(--fs-label);
  color: var(--neutral-muted);
}
[b-dwyiqv8ol0] .cd-fb-item__comment {
  font-size: var(--fs-body);
  color: var(--neutral-label);
  line-height: 1.55;
  margin: var(--space-1) 0 var(--space-2);
  text-wrap: pretty;
}
[b-dwyiqv8ol0] .cd-fb-item__meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
  padding-top: var(--space-2);
  border-top: 1px solid var(--neutral-border);
}
[b-dwyiqv8ol0] .cd-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--fs-caption);
  color: var(--neutral-muted);
  font-weight: var(--fw-medium);
}
[b-dwyiqv8ol0] .cd-meta-chip svg { color: var(--neutral-placeholder); }

/* ==========================================================================
   EMPTY STATE
   ========================================================================== */
[b-dwyiqv8ol0] .cd-empty {
  background: white;
  border: 1px dashed var(--neutral-border-strong);
  border-radius: var(--radius-xl);
  padding: var(--space-12) var(--space-8);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  text-align: center;
}
[b-dwyiqv8ol0] .cd-empty__icon {
  width: 56px; height: 56px;
  border-radius: var(--radius-full);
  background: var(--brand-50);
  color: var(--brand-600);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--space-2);
}
[b-dwyiqv8ol0] .cd-empty__title {
  font-size: var(--fs-section);
  font-weight: var(--fw-bold);
  color: var(--ink);
}
[b-dwyiqv8ol0] .cd-empty__body {
  font-size: var(--fs-body);
  color: var(--neutral-muted);
  max-width: 460px;
  line-height: 1.55;
}
[b-dwyiqv8ol0] .cd-empty__actions {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-3);
  flex-wrap: wrap;
  justify-content: center;
}

/* ==========================================================================
   ERROR BOX
   ========================================================================== */
[b-dwyiqv8ol0] .cd-errorbox {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  background: var(--error-bg);
  border: 1px solid var(--error-border);
  border-radius: var(--radius-lg2);
  padding: var(--space-4) var(--space-5);
}
[b-dwyiqv8ol0] .cd-errorbox__icon {
  color: var(--error-text);
  flex: 0 0 20px;
  margin-top: 2px;
}
[b-dwyiqv8ol0] .cd-errorbox__body { flex: 1; display: flex; flex-direction: column; gap: 4px; }
[b-dwyiqv8ol0] .cd-errorbox__title {
  font-size: var(--fs-card);
  font-weight: var(--fw-bold);
  color: var(--error-text);
}
[b-dwyiqv8ol0] .cd-errorbox__msg {
  font-size: var(--fs-body);
  color: #B91C3A;
}

/* ==========================================================================
   SKELETONS
   ========================================================================== */
@keyframes shimmer-b-dwyiqv8ol0 {
  0%   { background-position: -200px 0; }
  100% { background-position: calc(200px + 100%) 0; }
}
[b-dwyiqv8ol0] .cd-sk {
  background: linear-gradient(90deg, var(--neutral-border) 0%, #F4F8FA 50%, var(--neutral-border) 100%);
  background-size: 200px 100%;
  border-radius: var(--radius-md);
  animation: shimmer-b-dwyiqv8ol0 1.4s ease-in-out infinite;
}
[b-dwyiqv8ol0] .cd-sk--line   { height: 14px; width: 100%; border-radius: 7px; }
[b-dwyiqv8ol0] .cd-sk--xs     { height: 10px; width: 40%; border-radius: 6px; }
[b-dwyiqv8ol0] .cd-sk--sm     { height: 14px; width: 80%; }
[b-dwyiqv8ol0] .cd-sk--md     { height: 18px; width: 60%; }
[b-dwyiqv8ol0] .cd-sk--lg     { height: 28px; width: 70%; }
[b-dwyiqv8ol0] .cd-sk--block       { height: 120px; border-radius: var(--radius-md); }
[b-dwyiqv8ol0] .cd-sk--block-sm    { height: 90px; border-radius: var(--radius-md); }
[b-dwyiqv8ol0] .cd-sk--seg    { width: 160px; height: 36px; }
[b-dwyiqv8ol0] .cd-sk--range  { width: 280px; height: 36px; }
[b-dwyiqv8ol0] .cd-sk--search { width: 320px; height: 38px; }
[b-dwyiqv8ol0] .cd-sk--select { width: 160px; height: 38px; }
[b-dwyiqv8ol0] .cd-sk--chip   { width: 110px; height: 30px; border-radius: 9999px; }
[b-dwyiqv8ol0] .cd-sk--avatar { width: 32px; height: 32px; border-radius: 9999px; flex: 0 0 32px; }
[b-dwyiqv8ol0] .cd-sk--avatar-lg { width: 42px; height: 42px; border-radius: 9999px; }

[b-dwyiqv8ol0] .cd-list-toolbar--skeleton, [b-dwyiqv8ol0] .cd-chip-row--skeleton, [b-dwyiqv8ol0] .cd-period-bar--skeleton {
  margin-bottom: var(--space-4);
}
[b-dwyiqv8ol0] .cd-data-table--skeleton tbody td > .cd-sk { display: block; }

/* ==========================================================================
   PLACEHOLDER PANELS (non-redesigned tabs)
   ========================================================================== */
[b-dwyiqv8ol0] .cd-placeholder-note {
  background: white;
  border: 1px dashed var(--neutral-border-strong);
  border-radius: var(--radius-lg2);
  padding: var(--space-8);
  font-size: var(--fs-body);
  color: var(--neutral-muted);
  text-align: center;
}
[b-dwyiqv8ol0] .cd-placeholder-note code {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  font-size: 12.5px;
  background: var(--neutral-pill-bg);
  padding: 2px 6px;
  border-radius: 6px;
  color: var(--ink);
}

/* ==========================================================================
   RESPONSIVE TWEAKS
   ========================================================================== */
@media (max-width: 768px) {
  .cd-breakdown__row[b-dwyiqv8ol0] { grid-template-columns: 1fr; gap: var(--space-2); }
  .cd-breakdown__val[b-dwyiqv8ol0] { text-align: left; }
  .cd-fb-item[b-dwyiqv8ol0] { grid-template-columns: 1fr; }
  .cd-fb-item__lead[b-dwyiqv8ol0] { display: none; }
  .cd-data-table thead[b-dwyiqv8ol0] { display: none; }
  .cd-data-table[b-dwyiqv8ol0], .cd-data-table tbody[b-dwyiqv8ol0], .cd-data-table tr[b-dwyiqv8ol0], .cd-data-table td[b-dwyiqv8ol0] { display: block; width: 100%; }
  .cd-data-table tbody tr[b-dwyiqv8ol0] { padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--neutral-border); }
  .cd-data-table tbody td[b-dwyiqv8ol0] { padding: 4px 0; border: 0; }
}
/* /Components/Pages/Company/CompanyDetails/CompanyNotes.razor.rz.scp.css */
/* ---- Animations ---- */
@keyframes cn-spin-b-ogjefuuolj { to { transform: rotate(360deg); } }
@keyframes cn-fade-b-ogjefuuolj { from { opacity: 0; } to { opacity: 1; } }
@keyframes cn-pop-b-ogjefuuolj  { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }

/* ---- Page ---- */
.cn-page[b-ogjefuuolj] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* ---- Loading state ---- */
.cn-loading-state[b-ogjefuuolj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 440px;
    gap: 12px;
}

.cn-spinner[b-ogjefuuolj] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 3px solid #EDF2F5;
    border-top-color: #4AC4FF;
    animation: cn-spin-b-ogjefuuolj .7s linear infinite;
}

.cn-loading-label[b-ogjefuuolj] {
    font-size: 13px;
    color: #9BB8C5;
}

/* ---- Empty state ---- */
.cn-empty-state[b-ogjefuuolj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 440px;
    gap: 10px;
    text-align: center;
}

.cn-empty-icon[b-ogjefuuolj] {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: #F8FBFD;
    border: 1px solid #EDF2F5;
    color: #9BB8C5;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}

.cn-empty-heading[b-ogjefuuolj] {
    font-weight: 700;
    font-size: 16px;
    color: #0D2D3F;
}

.cn-empty-sub[b-ogjefuuolj] {
    font-size: 13px;
    color: #7A9BAD;
    max-width: 300px;
    line-height: 1.5;
    margin-bottom: 6px;
}

/* ---- Action bar ---- */
.cn-action-bar[b-ogjefuuolj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2px;
}

.cn-action-bar-left[b-ogjefuuolj] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.cn-action-bar-title[b-ogjefuuolj] {
    font-weight: 700;
    font-size: 18px;
    color: #0D2D3F;
}

.cn-action-bar-count[b-ogjefuuolj] {
    font-size: 12px;
    color: #9BB8C5;
    font-weight: 500;
}

/* ---- Inline form card ---- */
.cn-form-card[b-ogjefuuolj] {
    border: 1px solid #DDE8EE;
    border-radius: 12px;
    padding: 18px 20px;
    background: #FAFCFD;
    display: flex;
    flex-direction: column;
    gap: 14px;
    animation: cn-pop-b-ogjefuuolj .18s ease-out;
}

.cn-form-header[b-ogjefuuolj] {
    display: flex;
    align-items: center;
}

.cn-form-title[b-ogjefuuolj] {
    font-weight: 700;
    font-size: 16px;
    color: #0D2D3F;
}

/* ---- Form fields ---- */
.cn-field[b-ogjefuuolj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cn-field-label[b-ogjefuuolj] {
    font-weight: 600;
    font-size: 12px;
    color: #4A6878;
}

.cn-req[b-ogjefuuolj] {
    color: #E11D48;
    margin-left: 2px;
}

.cn-input[b-ogjefuuolj] {
    height: 40px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1.5px solid #DDE8EE;
    background: white;
    font-size: 14px;
    color: #0D2D3F;
    outline: none;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
    font-family: inherit;
}

.cn-input[b-ogjefuuolj]::placeholder { color: #9BB8C5; }
.cn-input:focus[b-ogjefuuolj] { border-color: #4AC4FF; box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.cn-input--error[b-ogjefuuolj] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }

.cn-field-err[b-ogjefuuolj] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #E11D48;
}

/* ---- Markdown editor block ---- */
.cn-md-wrap[b-ogjefuuolj] {
    border-radius: 10px;
    border: 1.5px solid #DDE8EE;
    overflow: hidden;
    transition: border-color .15s;
}

.cn-md-wrap--error[b-ogjefuuolj] { border-color: #F43F5E; box-shadow: 0 0 0 3px rgba(244,63,94,0.10); }
.cn-md-wrap:focus-within[b-ogjefuuolj] { border-color: #4AC4FF; }

.cn-md-toolbar[b-ogjefuuolj] {
    background: #F8FBFD;
    border-bottom: 1px solid #DDE8EE;
    padding: 6px;
    display: flex;
    align-items: center;
    gap: 2px;
}

.cn-tool[b-ogjefuuolj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    border: none;
    background: none;
    color: #4A6878;
    cursor: pointer;
    font-size: 13px;
    font-family: inherit;
    padding: 0;
    transition: background .12s, color .12s;
}

.cn-tool:hover[b-ogjefuuolj] { background: #EDF2F5; color: #0D2D3F; }

.cn-tool--bold[b-ogjefuuolj]  { font-weight: 800; font-size: 14px; }
.cn-tool--italic[b-ogjefuuolj] { font-style: italic; font-weight: 600; }

.cn-tool--preview[b-ogjefuuolj] {
    width: auto;
    padding: 0 11px;
    gap: 5px;
    font-weight: 600;
    font-size: 12.5px;
}

.cn-tool--preview-active[b-ogjefuuolj] { background: #0D2D3F; color: white; }
.cn-tool--preview-active:hover[b-ogjefuuolj] { background: #1E4256; color: white; }

.cn-md-sep[b-ogjefuuolj] {
    width: 1px;
    height: 18px;
    background: #DDE8EE;
    margin: 0 4px;
    flex-shrink: 0;
}

.cn-md-spacer[b-ogjefuuolj] { flex: 1; }

.cn-md-textarea[b-ogjefuuolj] {
    display: block;
    width: 100%;
    border: none;
    outline: none;
    resize: vertical;
    min-height: 232px;
    padding: 14px 16px;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.6;
    color: #0D2D3F;
    background: white;
    box-sizing: border-box;
}

.cn-md-textarea[b-ogjefuuolj]::placeholder { color: #9BB8C5; }

.cn-md-preview[b-ogjefuuolj] {
    padding: 16px 18px;
    min-height: 232px;
    background: white;
}

/* ---- Form actions ---- */
.cn-form-actions[b-ogjefuuolj] {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

/* ---- Buttons ---- */
.cn-btn[b-ogjefuuolj] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    height: 38px;
    padding: 0 18px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 13px;
    font-family: inherit;
    border: 1.5px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: background .15s, border-color .15s, color .15s;
}

.cn-btn:disabled[b-ogjefuuolj] { opacity: .55; cursor: not-allowed; }

.cn-btn--primary[b-ogjefuuolj] { background: #0D2D3F; color: white; border-color: transparent; }
.cn-btn--primary:hover:not(:disabled)[b-ogjefuuolj] { background: #1E4256; }

.cn-btn--outline[b-ogjefuuolj] { background: white; color: #0D2D3F; border-color: #DDE8EE; }
.cn-btn--outline:hover:not(:disabled)[b-ogjefuuolj] { border-color: #A8E3F7; background: #F8FBFD; }

.cn-btn--danger[b-ogjefuuolj] { background: #F43F5E; color: white; border-color: transparent; }
.cn-btn--danger:hover:not(:disabled)[b-ogjefuuolj] { background: #E11D48; }

/* ---- Note list ---- */
.cn-list[b-ogjefuuolj] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ---- Note card ---- */
.cn-note-card[b-ogjefuuolj] {
    border: 1px solid #E2EBF0;
    border-radius: 12px;
    padding: 16px 18px;
    background: white;
    transition: border-color .15s;
}

.cn-note-card--editing[b-ogjefuuolj] {
    border-color: #A8E3F7;
    box-shadow: 0 0 0 3px rgba(74,196,255,0.10);
}

.cn-note-header[b-ogjefuuolj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.cn-note-left[b-ogjefuuolj] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cn-note-title[b-ogjefuuolj] {
    font-weight: 600;
    font-size: 15px;
    color: #0D2D3F;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cn-note-byline[b-ogjefuuolj] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #9BB8C5;
    flex-wrap: wrap;
}

.cn-note-avatar[b-ogjefuuolj] {
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    background: #0D2D3F;
    color: #4AC4FF;
    font-weight: 700;
    font-size: 8.5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    letter-spacing: 0;
}

.cn-note-avatar--lg[b-ogjefuuolj] {
    width: 20px;
    height: 20px;
    font-size: 9px;
}

.cn-note-author[b-ogjefuuolj] {
    color: #4A6878;
    font-weight: 500;
}

.cn-note-dot[b-ogjefuuolj] {
    color: #DDE8EE;
}

.cn-note-edited[b-ogjefuuolj] {
    font-style: italic;
    color: #9BB8C5;
}

.cn-note-actions[b-ogjefuuolj] {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}

.cn-iconbtn[b-ogjefuuolj] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: none;
    color: #7A9BAD;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: background .12s, color .12s;
}

.cn-iconbtn:hover[b-ogjefuuolj] { background: #F2F5F7; color: #0D2D3F; }

.cn-iconbtn--active[b-ogjefuuolj] { background: #E8F8FF; color: #0D80BB; }
.cn-iconbtn--active:hover[b-ogjefuuolj] { background: #D0F0FF; color: #0D80BB; }

.cn-iconbtn--danger:hover[b-ogjefuuolj] { background: #FFF0F3; color: #E11D48; }

/* ---- Note excerpt ---- */
.cn-note-excerpt[b-ogjefuuolj] {
    position: relative;
    margin-top: 12px;
    max-height: 96px;
    overflow: hidden;
}

.cn-note-fade[b-ogjefuuolj] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 42px;
    background: linear-gradient(to bottom, rgba(255,255,255,0), white);
    pointer-events: none;
}

/* ---- Modal backdrop ---- */
.cn-backdrop[b-ogjefuuolj] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.32);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 56px 20px;
    z-index: 1100;
    overflow-y: auto;
    animation: cn-fade-b-ogjefuuolj .15s ease-out;
}

/* ---- Modal ---- */
.cn-modal[b-ogjefuuolj] {
    background: white;
    border-radius: 14px;
    width: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 60px rgba(13,45,63,0.22);
    animation: cn-pop-b-ogjefuuolj .18s ease-out;
    max-height: 84vh;
}

.cn-modal--view[b-ogjefuuolj] { max-width: 660px; }
.cn-modal--delete[b-ogjefuuolj] { max-width: 420px; }

.cn-modal-head[b-ogjefuuolj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 16px;
    border-bottom: 1px solid #EDF2F5;
    flex-shrink: 0;
}

.cn-modal-head--sm[b-ogjefuuolj] { padding: 20px 22px 14px; }

.cn-modal-title[b-ogjefuuolj] {
    font-weight: 700;
    font-size: 20px;
    color: #0D2D3F;
    letter-spacing: -0.01em;
    margin: 0;
}

.cn-modal-title--sm[b-ogjefuuolj] { font-size: 17px; }

.cn-modal-close[b-ogjefuuolj] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: none;
    background: none;
    color: #7A9BAD;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0;
    transition: background .12s, color .12s;
}

.cn-modal-close:hover[b-ogjefuuolj] { background: #F2F5F7; color: #0D2D3F; }

.cn-modal-body[b-ogjefuuolj] {
    padding: 16px 24px 24px;
    overflow-y: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cn-modal-body--sm[b-ogjefuuolj] { padding: 0 22px 4px; }

.cn-modal-foot[b-ogjefuuolj] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px;
    border-top: 1px solid #EDF2F5;
    flex-shrink: 0;
}

.cn-modal-meta[b-ogjefuuolj] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #9BB8C5;
    flex-wrap: wrap;
}
/* /Components/Pages/Company/OpenOpportunities/OpenOpportunitiesPage.razor.rz.scp.css */
.oo-page[b-9q173j8y09] { background: #F8FBFD; min-height: 100%; }
.oo-page__inner[b-9q173j8y09] { max-width: 1320px; margin: 0 auto; padding: 34px 36px 56px; display: flex; flex-direction: column; gap: 24px; font-family: Inter, system-ui, sans-serif; color: #0D2D3F; }

.oo-header__title[b-9q173j8y09] { margin: 0; font-weight: 800; font-size: 30px; letter-spacing: -0.01em; line-height: 1.15; }
.oo-header__subtitle[b-9q173j8y09] { margin: 8px 0 0; font-size: 14px; color: #7A9BAD; line-height: 1.5; max-width: 680px; }

.oo-stats[b-9q173j8y09] { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.oo-stat-card[b-9q173j8y09] { background: #fff; border: 1px solid #E2EBF0; border-radius: 12px; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.oo-stat-card--success[b-9q173j8y09] { background: #F0FDF4; border-color: #BBF7D0; }
.oo-stat-card--skel[b-9q173j8y09] { min-height: 80px; gap: 12px; }
.oo-stat-card__label[b-9q173j8y09] { display: flex; align-items: center; gap: 7px; font-weight: 700; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: #9BB8C5; }
.oo-stat-card__value[b-9q173j8y09] { font-weight: 800; font-size: 28px; letter-spacing: -0.01em; line-height: 1; color: #0D2D3F; }
.oo-stat-card__value--muted[b-9q173j8y09] { color: #7A9BAD; }
.oo-stat-card__value--success[b-9q173j8y09] { color: #16A34A; }

.oo-dot[b-9q173j8y09] { width: 8px; height: 8px; border-radius: 9999px; flex: none; display: inline-block; }
.oo-dot--neutral[b-9q173j8y09] { background: #C3D3DC; }
.oo-dot--positive[b-9q173j8y09] { background: #22C55E; }
.oo-dot--warning[b-9q173j8y09] { background: #F59E0B; }
.oo-dot--success[b-9q173j8y09] { background: #22C55E; }

.oo-table-card[b-9q173j8y09] { background: #fff; border: 1px solid #E2EBF0; border-radius: 14px; overflow: visible; }

.oo-toolbar[b-9q173j8y09] { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; border-bottom: 1px solid #EDF2F5; }
.oo-toolbar__right[b-9q173j8y09] { display: flex; align-items: center; gap: 14px; }
.oo-switch-row[b-9q173j8y09] { display: flex; align-items: center; gap: 11px; cursor: pointer; user-select: none; }
.oo-switch[b-9q173j8y09] { width: 38px; height: 22px; border-radius: 9999px; flex: none; padding: 2px; display: flex; align-items: center; background: #DDE8EE; justify-content: flex-start; transition: background 150ms ease-out, justify-content 150ms ease-out; }
.oo-switch--on[b-9q173j8y09] { background: #0D2D3F; justify-content: flex-end; }
.oo-switch__knob[b-9q173j8y09] { width: 18px; height: 18px; border-radius: 9999px; background: #fff; box-shadow: 0 1px 2px rgba(13,45,63,0.2); }
.oo-switch-label[b-9q173j8y09] { font-weight: 600; font-size: 13px; color: #0D2D3F; }
.oo-clear-btn[b-9q173j8y09] { background: none; border: none; padding: 0; cursor: pointer; font-family: Inter, system-ui, sans-serif; font-weight: 600; font-size: 13px; color: #0D80BB; }
.oo-count-label[b-9q173j8y09] { font-size: 13px; color: #7A9BAD; }

.oo-table-scroll[b-9q173j8y09] { overflow-x: auto; }
.oo-table[b-9q173j8y09] { width: 100%; border-collapse: collapse; table-layout: auto; }
.oo-thead-row[b-9q173j8y09] { background: #FAFCFD; }
.oo-th[b-9q173j8y09] { text-align: left; padding: 12px 18px; border-bottom: 1px solid #EDF2F5; white-space: nowrap; }
.oo-th--right[b-9q173j8y09] { text-align: right; }
.oo-th--link[b-9q173j8y09] { width: 44px; }
.oo-th__inner[b-9q173j8y09] { display: flex; align-items: center; gap: 6px; }
.oo-th__inner--right[b-9q173j8y09] { justify-content: flex-end; }
.oo-th__label[b-9q173j8y09] { font-weight: 700; font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: #4A6878; }

.oo-td[b-9q173j8y09] { padding: 15px 18px; border-bottom: 1px solid #F2F5F7; vertical-align: middle; font-size: 14px; }
.oo-td--muted[b-9q173j8y09] { color: #4A6878; }
.oo-td--right[b-9q173j8y09] { text-align: right; }
.oo-td--link[b-9q173j8y09] { text-align: center; width: 44px; }
.oo-td--scraped[b-9q173j8y09] { font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }

.oo-row[b-9q173j8y09] { transition: background 150ms ease-out; }
.oo-row:hover[b-9q173j8y09] { background: #F8FBFD; }

.oo-link[b-9q173j8y09] { background: none; border: none; padding: 0; cursor: pointer; font-family: inherit; font-weight: 600; font-size: 14px; color: #0D2D3F; text-align: left; }
.oo-link:hover[b-9q173j8y09] { color: #0D80BB; text-decoration: underline; }
.oo-link--normal[b-9q173j8y09] { font-weight: 500; }

.oo-pill[b-9q173j8y09] { display: inline-flex; align-items: center; gap: 7px; padding: 4px 11px 4px 9px; border-radius: 9999px; font-size: 12px; font-weight: 600; }
.oo-pill--active[b-9q173j8y09] { background: #E8F8FF; color: #0A5F8A; }
.oo-pill--disabled[b-9q173j8y09] { background: #F2F5F7; color: #7A9BAD; }
.oo-pill__dot[b-9q173j8y09] { width: 7px; height: 7px; border-radius: 9999px; }
.oo-pill__dot--active[b-9q173j8y09] { background: #4AC4FF; }
.oo-pill__dot--disabled[b-9q173j8y09] { background: #B6C7D1; }

.oo-scraped__date[b-9q173j8y09] { color: #0D2D3F; }
.oo-scraped__time[b-9q173j8y09] { color: #9BB8C5; margin-left: 5px; }

.oo-match--positive[b-9q173j8y09] { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; color: #16A34A; }
.oo-match--zero[b-9q173j8y09] { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; color: #B6C7D1; }

.oo-ext-link[b-9q173j8y09] { display: inline-flex; color: #9BB8C5; padding: 4px; border-radius: 6px; transition: color 150ms ease-out, background 150ms ease-out; }
.oo-ext-link:hover[b-9q173j8y09] { color: #0D80BB; background: #F2F5F7; }

.oo-empty-cell[b-9q173j8y09] { padding: 64px 24px; }
.oo-empty[b-9q173j8y09] { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; }
.oo-empty__icon[b-9q173j8y09] { width: 52px; height: 52px; border-radius: 9999px; background: #F2F5F7; display: flex; align-items: center; justify-content: center; color: #9BB8C5; }
.oo-empty__title[b-9q173j8y09] { font-weight: 700; font-size: 16px; color: #0D2D3F; }
.oo-empty__body[b-9q173j8y09] { font-size: 13px; color: #7A9BAD; max-width: 340px; line-height: 1.5; }
.oo-empty__clear[b-9q173j8y09] { height: 38px; padding: 0 18px; border-radius: 8px; border: 1.5px solid #DDE8EE; background: #fff; font-family: Inter, system-ui, sans-serif; font-weight: 600; font-size: 13px; color: #0D2D3F; cursor: pointer; margin-top: 2px; }
.oo-empty__clear:hover[b-9q173j8y09] { border-color: #A8E3F7; background: #F8FBFD; }

.oo-table-footer[b-9q173j8y09] { padding: 13px 20px; border-top: 1px solid #EDF2F5; font-size: 12px; color: #9BB8C5; }

.oo-pagination[b-9q173j8y09] { margin-top: 8px; display: flex; justify-content: center; }

.oo-skel-row td[b-9q173j8y09] { padding: 15px 18px; border-bottom: 1px solid #F2F5F7; }
@keyframes oo-shimmer-b-9q173j8y09 { 0% { background-position: -400px 0; } 100% { background-position: 400px 0; } }
.oo-skel[b-9q173j8y09] { height: 12px; border-radius: 6px; background: linear-gradient(90deg, #EDF2F5 25%, #F6FAFC 50%, #EDF2F5 75%); background-size: 800px 100%; animation: oo-shimmer-b-9q173j8y09 1.3s linear infinite; }
.oo-skel--label[b-9q173j8y09] { width: 60%; height: 10px; }
.oo-skel--value[b-9q173j8y09] { width: 40%; height: 28px; }
.oo-skel--70[b-9q173j8y09] { width: 70%; }
.oo-skel--88[b-9q173j8y09] { width: 88%; }
.oo-skel--30[b-9q173j8y09] { width: 30%; }
.oo-skel--pill[b-9q173j8y09] { width: 64px; }
/* /Components/Pages/Employees/AssessmentSessionPages/AssessmentCreatePage.razor.rz.scp.css */
.assessment-create-page[b-vq4b4sszbx] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f8fafc;
    color: #1e293b;
}

.assessment-create-inner[b-vq4b4sszbx] {
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
    padding: 0 16px 100px;
}

[b-vq4b4sszbx] .assessment-create-stepper-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    padding: 16px 0 !important;
}

[b-vq4b4sszbx] .assessment-create-stepper {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
}

[b-vq4b4sszbx] .assessment-create-stepper > .mud-stepper {
    width: 100% !important;
}

[b-vq4b4sszbx] .assessment-create-stepper .mud-stepper-content {
    width: 100% !important;
}

[b-vq4b4sszbx] .assessment-create-stepper .mud-stepper-header {
    width: 100% !important;
    justify-content: space-between !important;
}

[b-vq4b4sszbx] .assessment-create-stepper .mud-step {
    flex: 1 !important;
}

.assessment-create-footer[b-vq4b4sszbx] {
    position: fixed;
    bottom: 0;
    left: 225px;
    right: 0;
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
    padding: 16px 32px;
    z-index: 10;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
    transition: left 0.2s ease;
}

.assessment-create-footer-content[b-vq4b4sszbx] {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

.assessment-modal-backdrop[b-vq4b4sszbx] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    z-index: 1200;
}

.assessment-modal[b-vq4b4sszbx] {
    background: #ffffff;
    border-radius: 12px;
    width: min(640px, 96vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
}

.assessment-modal.assessment-modal-wide[b-vq4b4sszbx] {
    width: min(900px, 96vw);
}

.assessment-modal-header[b-vq4b4sszbx] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.assessment-modal-title[b-vq4b4sszbx] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}

.assessment-modal-subtitle[b-vq4b4sszbx] {
    margin: 6px 0 0;
    font-size: 13px;
    color: #6b7280;
}

.assessment-modal-close[b-vq4b4sszbx] {
    border: none;
    background: transparent;
    color: #6b7280;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 4px;
}

.assessment-modal-close:hover[b-vq4b4sszbx] {
    color: #111827;
}

.assessment-modal-close-wrap[b-vq4b4sszbx] {
    margin-left: auto;
    display: flex;
    align-items: center;
}

[b-vq4b4sszbx] .assessment-modal-close-icon {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    color: #64748b;
}

[b-vq4b4sszbx] .assessment-modal-close-icon:hover {
    color: #111827;
    background: #f3f4f6;
}

.assessment-modal-body[b-vq4b4sszbx] {
    padding: 16px 24px;
    overflow: auto;
}

.assessment-modal-footer[b-vq4b4sszbx] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

.question-kind-select[b-vq4b4sszbx] {
    min-width: 130px;
}

.regenerate-preview[b-vq4b4sszbx] {
    display: grid;
    gap: 12px;
}

.regenerate-preview-block[b-vq4b4sszbx] {
    border: 1px solid #d1d5db;
    border-radius: 10px;
    padding: 12px;
    background: #f8fafc;
}

.regenerate-preview-block-new[b-vq4b4sszbx] {
    border-color: #bfdbfe;
    background: #eff6ff;
}

.regenerate-preview-label[b-vq4b4sszbx] {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.regenerate-preview-text[b-vq4b4sszbx] {
    font-size: 14px;
    color: #0f172a;
    line-height: 1.5;
    white-space: normal;
}

.regenerate-preview-note[b-vq4b4sszbx] {
    font-size: 12px;
    color: #475569;
}

.regenerate-footer-row[b-vq4b4sszbx] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.regenerate-footer-actions[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html {
    line-height: 1.6;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html p {
    margin: 0 0 0.45rem;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html ul,
.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html ol {
    margin: 0.25rem 0 0.45rem;
    padding-left: 1.25rem;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-markdown-html li {
    margin-bottom: 0.2rem;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-code-block {
    margin: 0.5rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.regenerate-preview-text[b-vq4b4sszbx]  .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
}

@media (min-width: 961px) {
    .vertical-shell.is-mini ~ * .assessment-create-footer[b-vq4b4sszbx] {
        left: 90px;
    }
}


.wizard-header[b-vq4b4sszbx] {
    padding: 24px 32px;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.breadcrumb-link[b-vq4b4sszbx] {
    background: transparent;
    border: none;
    color: #64748b;
    font-size: 14px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    padding: 0;
    margin-bottom: 12px;
}

.breadcrumb-link:hover[b-vq4b4sszbx] {
    color: #1e3a8a;
}

.wizard-header-row[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.wizard-title[b-vq4b4sszbx] {
    margin: 0;
    font-size: 28px;
    font-weight: 700;
    color: #0f172a;
}

.wizard-subtitle[b-vq4b4sszbx] {
    margin: 6px 0 0;
    font-size: 14px;
    color: #64748b;
}

.btn-outline[b-vq4b4sszbx] {
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #1e293b;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.btn-outline:disabled[b-vq4b4sszbx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.wizard-progress[b-vq4b4sszbx] {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.progress-steps[b-vq4b4sszbx] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.progress-step[b-vq4b4sszbx] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #94a3b8;
}

.progress-step.active[b-vq4b4sszbx] {
    color: #0f172a;
    font-weight: 600;
}

.progress-step.completed[b-vq4b4sszbx] {
    color: #1d4ed8;
}

.progress-dot[b-vq4b4sszbx] {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
}

.progress-step.active .progress-dot[b-vq4b4sszbx] {
    background: #2e75b6;
    border-color: #2e75b6;
}

.progress-step.completed .progress-dot[b-vq4b4sszbx] {
    background: #1d4ed8;
    border-color: #1d4ed8;
}

.progress-bar[b-vq4b4sszbx] {
    height: 4px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.progress-bar-fill[b-vq4b4sszbx] {
    height: 100%;
    background: #2e75b6;
}

.progress-summary[b-vq4b4sszbx] {
    font-size: 13px;
    color: #475569;
}

.wizard-body[b-vq4b4sszbx] {
    flex: 1;
    padding: 24px 32px 140px;
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
}

.wizard-loading[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

.wizard-empty[b-vq4b4sszbx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 60px 0;
}

.wizard-empty-title[b-vq4b4sszbx] {
    font-size: 18px;
    font-weight: 600;
    color: #0f172a;
}

.wizard-card[b-vq4b4sszbx] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
    margin-bottom: 24px;
}

.card-header h2[b-vq4b4sszbx] {
    margin: 0;
    font-size: 20px;
    color: #0f172a;
}

.card-header p[b-vq4b4sszbx] {
    margin: 6px 0 0;
    font-size: 14px;
    color: #64748b;
}

.form-row[b-vq4b4sszbx] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.form-group[b-vq4b4sszbx] {
    margin-top: 16px;
}

.form-label[b-vq4b4sszbx] {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #1e293b;
}

.required[b-vq4b4sszbx] {
    color: #dc2626;
}

.option-row[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.option-pill[b-vq4b4sszbx] {
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    padding: 6px 12px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #1e293b;
    background: #ffffff;
}

.option-pill.selected[b-vq4b4sszbx] {
    border-color: #2e75b6;
    color: #1e3a8a;
    background: #eff6ff;
}

.helper-text[b-vq4b4sszbx] {
    margin-top: 6px;
    font-size: 12px;
    color: #64748b;
}

.form-control[b-vq4b4sszbx] {
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 10px 12px;
    background: #ffffff;
    color: #1e293b;
    min-height: 42px;
    display: flex;
    align-items: center;
}

.form-control.read-only[b-vq4b4sszbx] {
    background: #f8fafc;
    color: #475569;
}

.form-select[b-vq4b4sszbx],
.form-input[b-vq4b4sszbx] {
    width: 100%;
    height: 42px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 0 12px;
    background: #ffffff;
    color: #1e293b;
}

.info-grid[b-vq4b4sszbx] {
    margin-top: 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 16px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.info-label[b-vq4b4sszbx] {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    font-weight: 600;
}

.info-value[b-vq4b4sszbx] {
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
}

.summary-bar[b-vq4b4sszbx] {
    position: sticky;
    top: 12px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
    z-index: 5;
}

.summary-title[b-vq4b4sszbx] {
    font-size: 12px;
    text-transform: uppercase;
    color: #94a3b8;
    font-weight: 600;
}

.summary-value[b-vq4b4sszbx] {
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
}

.summary-metrics[b-vq4b4sszbx] {
    display: flex;
    gap: 16px;
    font-size: 13px;
    color: #475569;
}

.summary-actions[b-vq4b4sszbx] {
    display: flex;
    gap: 12px;
}

.link-button[b-vq4b4sszbx] {
    background: transparent;
    border: none;
    color: #1d4ed8;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
    font-size: 13px;
}

.link-button.muted[b-vq4b4sszbx] {
    color: #64748b;
}

.skill-category[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 12px;
    background: #ffffff;
}

.skill-category-header[b-vq4b4sszbx] {
    width: 100%;
    border: none;
    background: #f8fafc;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    color: #0f172a;
    cursor: pointer;
}

.category-meta[b-vq4b4sszbx] {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
}

.category-points[b-vq4b4sszbx] {
    margin-left: auto;
    color: #7c3aed;
    font-weight: 700;
}

.skill-category-body[b-vq4b4sszbx] {
    padding: 8px 16px 16px;
}

.skill-row[b-vq4b4sszbx] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    padding: 12px 8px;
    border-bottom: 1px solid #f1f5f9;
    cursor: pointer;
}

.skill-row:last-child[b-vq4b4sszbx] {
    border-bottom: none;
}

.skill-row.selected[b-vq4b4sszbx] {
    background: #eff6ff;
    border-radius: 8px;
}

.skill-row:hover[b-vq4b4sszbx] {
    filter: brightness(0.98);
}

.skill-checkbox input[b-vq4b4sszbx] {
    width: 16px;
    height: 16px;
}

.skill-name[b-vq4b4sszbx] {
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
}

.skill-roadmap[b-vq4b4sszbx] {
    margin: 6px 0 0;
    padding-left: 18px;
    color: #64748b;
    font-size: 12px;
}

.skill-score[b-vq4b4sszbx] {
    font-size: 13px;
    font-weight: 700;
    color: #7c3aed;
}

.add-skill-button[b-vq4b4sszbx] {
    margin-top: 16px;
    width: 100%;
    border: 2px dashed #cbd5e1;
    background: #ffffff;
    color: #64748b;
    padding: 12px;
    border-radius: 10px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.question-toolbar[b-vq4b4sszbx] {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 12px;
    margin: 16px 0 24px;
}

.question-search[b-vq4b4sszbx] {
    position: relative;
}

.question-search i[b-vq4b4sszbx] {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
}

.question-search .form-input[b-vq4b4sszbx] {
    padding-left: 34px;
}

.question-category[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 16px;
    background: #ffffff;
}

.question-category-header[b-vq4b4sszbx] {
    width: 100%;
    border: none;
    background: #f8fafc;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    cursor: pointer;
}

.question-category-body[b-vq4b4sszbx] {
    padding: 16px;
}

.question-skill[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-bottom: 12px;
    overflow: hidden;
}

.question-skill-header[b-vq4b4sszbx] {
    width: 100%;
    background: #ffffff;
    border: none;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    font-weight: 600;
    color: #0f172a;
    cursor: pointer;
}

.question-list[b-vq4b4sszbx] {
    border-top: 1px solid #e2e8f0;
}

.question-card[b-vq4b4sszbx] {
    padding: 16px;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.question-card:last-child[b-vq4b4sszbx] {
    border-bottom: none;
}

.assessment-markdown-preview[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #ffffff;
}

.assessment-markdown-preview .markdown-content[b-vq4b4sszbx] {
    line-height: 1.6;
    color: #0f172a;
}

.question-badges[b-vq4b4sszbx] {
    margin-bottom: 8px;
}

.badge[b-vq4b4sszbx] {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.badge-custom[b-vq4b4sszbx] {
    background: #e9d5ff;
    color: #7c3aed;
}

.question-text[b-vq4b4sszbx] {
    font-size: 14px;
    color: #0f172a;
    margin-bottom: 12px;
}

.question-actions[b-vq4b4sszbx] {
    display: flex;
    gap: 8px;
}

.icon-button[b-vq4b4sszbx] {
    border: none;
    background: #ffffff;
    border-radius: 6px;
    padding: 6px 8px;
    cursor: pointer;
    color: #64748b;
}

.icon-button:hover[b-vq4b4sszbx] {
    background: #e2e8f0;
    color: #0f172a;
}

.icon-button.danger:hover[b-vq4b4sszbx] {
    background: #fee2e2;
    color: #dc2626;
}

.add-question-button[b-vq4b4sszbx] {
    width: 100%;
    padding: 12px;
    border: 2px dashed #cbd5e1;
    background: #ffffff;
    border-radius: 8px;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
}

.duration-options[b-vq4b4sszbx] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: #1e293b;
}

.duration-custom[b-vq4b4sszbx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.duration-input[b-vq4b4sszbx] {
    width: 60px;
}

.interviewer-list[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-top: 12px;
    max-height: 220px;
    overflow: auto;
}

.interviewer-row[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 14px;
    color: #0f172a;
}

.interviewer-row:last-child[b-vq4b4sszbx] {
    border-bottom: none;
}

.form-textarea[b-vq4b4sszbx] {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 12px;
    font-size: 14px;
    background: #ffffff;
}

.review-card[b-vq4b4sszbx] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
    background: #ffffff;
}

.review-card.highlight[b-vq4b4sszbx] {
    background: #f0f9ff;
    border-color: #2e75b6;
}

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

.review-header h3[b-vq4b4sszbx] {
    margin: 0;
    font-size: 16px;
    color: #0f172a;
}

.review-grid[b-vq4b4sszbx] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}

.review-list[b-vq4b4sszbx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 12px;
}

.review-list-item[b-vq4b4sszbx] {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #475569;
}

.wizard-footer[b-vq4b4sszbx] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 16px 32px;
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    z-index: 10;
}

.footer-right[b-vq4b4sszbx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.btn-primary[b-vq4b4sszbx] {
    background: #2e75b6;
    color: #ffffff;
    border: none;
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.btn-primary:disabled[b-vq4b4sszbx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-secondary[b-vq4b4sszbx] {
    background: #ffffff;
    color: #1e293b;
    border: 1px solid #cbd5e1;
    padding: 10px 16px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.btn-ghost[b-vq4b4sszbx] {
    background: transparent;
    border: none;
    color: #64748b;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

@media (max-width: 960px) {
    .wizard-header-row[b-vq4b4sszbx] {
        flex-direction: column;
        align-items: flex-start;
    }

    .assessment-create-stepper-wrapper[b-vq4b4sszbx] {
        flex-basis: 100%;
        justify-content: flex-start;
        margin-top: 12px;
    }

    .wizard-body[b-vq4b4sszbx] {
        padding: 24px 16px 140px;
    }

    .assessment-create-footer[b-vq4b4sszbx] {
        padding: 12px 16px;
    }

    .form-row[b-vq4b4sszbx] {
        grid-template-columns: 1fr;
    }

    .info-grid[b-vq4b4sszbx],
    .review-grid[b-vq4b4sszbx] {
        grid-template-columns: 1fr;
    }

    .summary-bar[b-vq4b4sszbx] {
        flex-direction: column;
        align-items: flex-start;
    }

    .question-toolbar[b-vq4b4sszbx] {
        grid-template-columns: 1fr;
    }

    .wizard-footer[b-vq4b4sszbx] {
        flex-direction: column;
        align-items: stretch;
    }

    .footer-right[b-vq4b4sszbx],
    .footer-left[b-vq4b4sszbx] {
        width: 100%;
        justify-content: space-between;
    }
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html {
    line-height: 1.6;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html p {
    margin: 0 0 0.75rem;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html ul,
.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html ol {
    margin: 0.5rem 0 0.75rem;
    padding-left: 1.25rem;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-markdown-html li {
    margin-bottom: 0.35rem;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-block {
    margin: 0.75rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-language {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1e40af;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-copy {
    border: 1px solid #aabed9;
    background: #eef4ff;
    color: #1b3358;
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-copy:hover {
    background: #dbe8fb;
    border-color: #8fa9cc;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
    border-radius: 0;
}

.assessment-create-inner[b-vq4b4sszbx]  .ot-code-block pre code {
    display: block;
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre;
}
/* /Components/Pages/Employees/AssessmentSessionPages/AssessmentDetailsPage.razor.rz.scp.css */
/* Assessment Details Styles */
.assessment-details-container[b-qmfwki6ub4] {
    max-width: 100%;
    margin: 0 auto;
    padding: 24px 40px;
    min-height: 100vh;
}

.assessment-details-loading[b-qmfwki6ub4],
.assessment-details-error[b-qmfwki6ub4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
}

/* Breadcrumbs */
.assessment-breadcrumbs[b-qmfwki6ub4] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #64748b;
    margin-bottom: 24px;
}

.assessment-breadcrumbs span[b-qmfwki6ub4] {
    color: #94a3b8;
}

/* Header Card */
.assessment-header-card[b-qmfwki6ub4] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    gap: 24px;
}

.assessment-header-content[b-qmfwki6ub4] {
    display: flex;
    gap: 20px;
    flex: 1;
}

.assessment-header-avatar[b-qmfwki6ub4] {
    flex-shrink: 0;
}

.assessment-header-info h1[b-qmfwki6ub4] {
    font-size: 24px;
    font-weight: 700;
    margin: 0 0 4px 0;
    color: #1e293b;
}

.assessment-competence-text[b-qmfwki6ub4] {
    font-size: 16px;
    color: #64748b;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.assessment-competence-text .separator[b-qmfwki6ub4] {
    color: #e2e8f0;
}

.assessment-status-row[b-qmfwki6ub4] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.assessment-pass-badge[b-qmfwki6ub4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.assessment-pass-badge.pass[b-qmfwki6ub4] {
    background: #d1fae5;
    color: #059669;
}

.assessment-pass-badge.fail[b-qmfwki6ub4] {
    background: #fee2e2;
    color: #dc2626;
}

.assessment-pass-badge.pending[b-qmfwki6ub4] {
    background: #f3f4f6;
    color: #6b7280;
}

.assessment-promo-badge[b-qmfwki6ub4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.assessment-promo-badge.ready[b-qmfwki6ub4] {
    background: #d1fae5;
    color: #059669;
}

.assessment-promo-badge.blocked[b-qmfwki6ub4] {
    background: #fee2e2;
    color: #dc2626;
}

.assessment-promo-badge.pending[b-qmfwki6ub4] {
    background: #f3f4f6;
    color: #6b7280;
}

.assessment-signal-badge[b-qmfwki6ub4] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 700;
}

.assessment-signal-badge.warning[b-qmfwki6ub4] {
    background: #fef3c7;
    color: #92400e;
}

.assessment-signal-badge.info[b-qmfwki6ub4] {
    background: #dbeafe;
    color: #1d4ed8;
}

.assessment-date-info[b-qmfwki6ub4] {
    font-size: 14px;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 6px;
}

.assessment-header-actions[b-qmfwki6ub4] {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.interviewer-invite-actions[b-qmfwki6ub4] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.interviewer-invite-button[b-qmfwki6ub4] {
    min-width: 92px;
    text-transform: none;
}

.invite-popup-overlay[b-qmfwki6ub4] {
    background-color: rgba(17, 24, 39, 0.7);
    backdrop-filter: blur(4px);
}

.invite-popup-content[b-qmfwki6ub4] {
    border-radius: 14px;
}

.invite-popup-field[b-qmfwki6ub4] {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    border-radius: 10px;
    padding: 10px;
}

.invite-popup-label[b-qmfwki6ub4] {
    display: block;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
    font-size: 0.75rem;
    margin-bottom: 6px;
}

.invite-popup-value[b-qmfwki6ub4] {
    color: #0f172a;
    background: #fff;
}

.assessment-question-list[b-qmfwki6ub4] {
    margin: 0;
    padding-left: 18px;
    color: #64748b;
    font-size: 16px;
    line-height: 1.72;
}

.assessment-question-list .question-markdown[b-qmfwki6ub4] {
    font-size: 16px;
    line-height: 1.72;
    color: #334155;
}

.assessment-question-list .question-markdown p[b-qmfwki6ub4] {
    margin: 0;
}

.assessment-question-list > li.question-markdown[b-qmfwki6ub4] {
    margin-bottom: 0.95rem !important;
}

.assessment-question-list > li.question-markdown:last-child[b-qmfwki6ub4] {
    margin-bottom: 0 !important;
}

/* Main Layout */
.assessment-main-layout[b-qmfwki6ub4] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 24px;
}

/* Sidebar */
.assessment-sidebar[b-qmfwki6ub4] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.assessment-nav-tabs[b-qmfwki6ub4] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.assessment-nav-tab[b-qmfwki6ub4] {
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #64748b;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border-left: 3px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
}

.assessment-nav-tab:hover[b-qmfwki6ub4] {
    background: #f8fafc;
    color: #1e293b;
}

.assessment-nav-tab.active[b-qmfwki6ub4] {
    background: #f0f9ff;
    color: #2e75b6;
    border-left-color: #2e75b6;
}

.assessment-quick-actions[b-qmfwki6ub4] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.assessment-quick-actions .action-btn[b-qmfwki6ub4] {
    justify-content: flex-start;
    text-transform: none;
}

/* Content Area */
.assessment-content-area[b-qmfwki6ub4] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Summary Cards */
.assessment-summary-grid[b-qmfwki6ub4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.assessment-score-card[b-qmfwki6ub4] {
    margin-bottom: 24px;
}

.score-summary[b-qmfwki6ub4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.score-value[b-qmfwki6ub4] {
    font-size: 22px;
    font-weight: 700;
    color: #1e293b;
}

.score-recommendation[b-qmfwki6ub4] {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
}

.rec-pass[b-qmfwki6ub4] {
    background: #d1fae5;
    color: #059669;
}

.rec-fail[b-qmfwki6ub4] {
    background: #fee2e2;
    color: #dc2626;
}

.rec-pending[b-qmfwki6ub4] {
    background: #f3f4f6;
    color: #6b7280;
}

.score-progress[b-qmfwki6ub4] {
    height: 10px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 8px;
}

.score-progress-fill[b-qmfwki6ub4] {
    height: 100%;
    background: #059669;
}

.score-progress-fill.rec-pass[b-qmfwki6ub4] {
    background: #059669;
}

.score-progress-fill.rec-fail[b-qmfwki6ub4] {
    background: #dc2626;
}

.score-progress-fill.rec-pending[b-qmfwki6ub4] {
    background: #64748b;
}

.assessment-summary-card[b-qmfwki6ub4] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 8px;
}

.summary-label[b-qmfwki6ub4] {
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
}

.summary-value[b-qmfwki6ub4] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
}

.summary-sub[b-qmfwki6ub4] {
    font-size: 13px;
    color: #94a3b8;
}

.avatar-group[b-qmfwki6ub4] {
    display: flex;
    justify-content: center;
    margin-top: 4px;
}

.assessment-lifecycle[b-qmfwki6ub4] {
    display: flex;
    flex-direction: column;
}

.lifecycle-entry[b-qmfwki6ub4] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding-bottom: 18px;
}

.lifecycle-entry:not(:last-child)[b-qmfwki6ub4]::after {
    content: "";
    position: absolute;
    left: 15px;
    top: 34px;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
}

.lifecycle-icon[b-qmfwki6ub4] {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid transparent;
}

.lifecycle-content[b-qmfwki6ub4] {
    flex: 1;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}

.lifecycle-title[b-qmfwki6ub4] {
    font-weight: 600;
}

.lifecycle-meta[b-qmfwki6ub4] {
    margin-top: 8px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.lifecycle-actor[b-qmfwki6ub4] {
    color: #334155;
    font-weight: 600;
}

.lifecycle-success[b-qmfwki6ub4] {
    background: #d1fae5;
    color: #059669;
    border-color: #a7f3d0;
}

.lifecycle-info[b-qmfwki6ub4] {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #bfdbfe;
}

.lifecycle-warning[b-qmfwki6ub4] {
    background: #fef3c7;
    color: #b45309;
    border-color: #fde68a;
}

.lifecycle-default[b-qmfwki6ub4] {
    background: #e2e8f0;
    color: #475569;
    border-color: #cbd5e1;
}

/* Skills List */
.skill-list-item[b-qmfwki6ub4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #e2e8f0;
}

.skill-list-item:last-child[b-qmfwki6ub4] {
    border-bottom: none;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .assessment-details-container[b-qmfwki6ub4] {
        padding: 20px 24px;
    }

    .assessment-main-layout[b-qmfwki6ub4] {
        grid-template-columns: 240px 1fr;
    }
}

@media (max-width: 960px) {
    .assessment-details-container[b-qmfwki6ub4] {
        padding: 16px;
    }

    .assessment-header-card[b-qmfwki6ub4] {
        flex-direction: column;
    }

    .assessment-header-actions[b-qmfwki6ub4] {
        width: 100%;
        justify-content: flex-start;
    }

    .assessment-main-layout[b-qmfwki6ub4] {
        grid-template-columns: 1fr;
    }

    .assessment-nav-tabs[b-qmfwki6ub4] {
        flex-direction: row;
        overflow-x: auto;
    }

    .assessment-nav-tab[b-qmfwki6ub4] {
        border-left: none;
        border-bottom: 3px solid transparent;
        white-space: nowrap;
        min-width: fit-content;
    }

    .assessment-nav-tab.active[b-qmfwki6ub4] {
        border-left: none;
        border-bottom-color: #2e75b6;
    }

    .assessment-summary-grid[b-qmfwki6ub4] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 600px) {
    .assessment-header-content[b-qmfwki6ub4] {
        flex-direction: column;
    }

    .assessment-summary-grid[b-qmfwki6ub4] {
        grid-template-columns: 1fr;
    }

    .assessment-header-actions[b-qmfwki6ub4] {
        flex-direction: column;
        align-items: stretch;
    }

    .assessment-header-actions button[b-qmfwki6ub4] {
        width: 100%;
    }
}

.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html {
    line-height: 1.6;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html p {
    margin: 0 0 0.75rem;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html ul,
.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html ol {
    margin: 0.5rem 0 0.75rem;
    padding-left: 1.25rem;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-markdown-html li {
    margin-bottom: 0.35rem;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-block {
    margin: 0.75rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-language {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1e40af;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-copy {
    border: 1px solid #aabed9;
    background: #eef4ff;
    color: #1b3358;
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-copy:hover {
    background: #dbe8fb;
    border-color: #8fa9cc;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
    border-radius: 0;
}

.assessment-details-container[b-qmfwki6ub4]  .ot-code-block pre code {
    display: block;
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre;
}

.dialog-overlay[b-qmfwki6ub4] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
}

.preview-layout[b-qmfwki6ub4] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
}

.pdf-preview-area[b-qmfwki6ub4] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-qmfwki6ub4] {
    width: 100%;
    height: 100%;
    border: none;
}

.preview-sidebar[b-qmfwki6ub4] {
    width: 220px;
    flex-shrink: 0;
    background: #fff;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}

@media (max-width: 900px) {
    .preview-layout[b-qmfwki6ub4] {
        flex-direction: column;
        width: 96vw;
        height: 92vh;
        gap: 12px;
    }

    .preview-sidebar[b-qmfwki6ub4] {
        width: 100%;
        padding: 16px;
    }
}
/* /Components/Pages/Employees/AssessmentSessionPages/AssessmentResultsPage.razor.rz.scp.css */
/* Assessment Results Page */
.assessment-results-page[b-4s3ptjiqhh] {
    background: #f8fafc;
    min-height: 100vh;
    padding: 24px 40px 96px;
}

.results-container[b-4s3ptjiqhh] {
    max-width: 1200px;
    margin: 0 auto;
}

.assessment-results-loading[b-4s3ptjiqhh],
.assessment-results-error[b-4s3ptjiqhh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: 16px;
}

.results-breadcrumb[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #64748b;
    margin-bottom: 24px;
}

.results-breadcrumb a[b-4s3ptjiqhh] {
    color: #64748b;
    text-decoration: none;
    cursor: pointer;
}

.results-breadcrumb a:hover[b-4s3ptjiqhh] {
    color: #2e75b6;
}

.breadcrumb-sep[b-4s3ptjiqhh] {
    color: #94a3b8;
}

.results-header[b-4s3ptjiqhh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    gap: 16px;
}

.results-title[b-4s3ptjiqhh] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
}

.header-actions[b-4s3ptjiqhh] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.results-card[b-4s3ptjiqhh] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    position: relative;
    margin-bottom: 24px;
}

.pass-badge[b-4s3ptjiqhh] {
    position: absolute;
    top: 24px;
    right: 24px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.pass-badge.pass[b-4s3ptjiqhh] {
    background: #d1fae5;
    color: #059669;
}

.pass-badge.fail[b-4s3ptjiqhh] {
    background: #fee2e2;
    color: #dc2626;
}

.pass-badge.pending[b-4s3ptjiqhh] {
    background: #f3f4f6;
    color: #6b7280;
}

.candidate-header[b-4s3ptjiqhh] {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 20px;
}

.avatar[b-4s3ptjiqhh] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-weight: 700;
    color: #1e293b;
}

.avatar img[b-4s3ptjiqhh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.candidate-info h2[b-4s3ptjiqhh] {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 4px;
}

.candidate-role[b-4s3ptjiqhh] {
    color: #64748b;
    font-size: 14px;
    margin-bottom: 8px;
}

.candidate-meta[b-4s3ptjiqhh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: #64748b;
}

.results-dual-status[b-4s3ptjiqhh] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.meta-row[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.score-container[b-4s3ptjiqhh] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}

.score-text[b-4s3ptjiqhh] {
    font-size: 28px;
    font-weight: 700;
    color: #059669;
    margin-bottom: 12px;
}

.progress-bar[b-4s3ptjiqhh] {
    height: 10px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 8px;
}

.progress-fill[b-4s3ptjiqhh] {
    height: 100%;
    background: #059669;
}

.threshold-text[b-4s3ptjiqhh] {
    font-size: 13px;
    color: #64748b;
}

.grade-progression[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.grade-box[b-4s3ptjiqhh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.grade-label[b-4s3ptjiqhh] {
    font-size: 12px;
    text-transform: uppercase;
    color: #94a3b8;
    font-weight: 600;
}

.grade-value[b-4s3ptjiqhh] {
    font-size: 15px;
    font-weight: 600;
}

.achieved-badge[b-4s3ptjiqhh] {
    font-size: 12px;
    color: #059669;
    background: #d1fae5;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.stats-grid[b-4s3ptjiqhh] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.block-results-section[b-4s3ptjiqhh] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}

.promotion-summary[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.promotion-pill[b-4s3ptjiqhh],
.signal-pill[b-4s3ptjiqhh],
.block-type-chip[b-4s3ptjiqhh],
.outcome-chip[b-4s3ptjiqhh] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 700;
}

.promotion-pill.promotion-ready[b-4s3ptjiqhh] {
    background: #d1fae5;
    color: #047857;
}

.promotion-pill.promotion-blocked[b-4s3ptjiqhh] {
    background: #fee2e2;
    color: #b91c1c;
}

.promotion-pill.promotion-pending[b-4s3ptjiqhh] {
    background: #e5e7eb;
    color: #374151;
}

.signal-pill.signal-warning[b-4s3ptjiqhh] {
    background: #fef3c7;
    color: #92400e;
}

.signal-pill.signal-info[b-4s3ptjiqhh] {
    background: #dbeafe;
    color: #1d4ed8;
}

.block-results-list[b-4s3ptjiqhh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.block-result-item[b-4s3ptjiqhh] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px;
    background: #f8fafc;
}

.block-result-title-row[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.block-result-title-row h4[b-4s3ptjiqhh] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
}

.block-type-chip[b-4s3ptjiqhh] {
    background: #eef2ff;
    color: #3730a3;
}

.outcome-chip.outcome-pending[b-4s3ptjiqhh] {
    background: #e5e7eb;
    color: #374151;
}

.outcome-chip.outcome-hard[b-4s3ptjiqhh] {
    background: #d1fae5;
    color: #047857;
}

.outcome-chip.outcome-soft-standard[b-4s3ptjiqhh] {
    background: #fde68a;
    color: #92400e;
}

.outcome-chip.outcome-soft-exceptional[b-4s3ptjiqhh] {
    background: #fbcfe8;
    color: #9d174d;
}

.outcome-chip.outcome-not-met[b-4s3ptjiqhh] {
    background: #fee2e2;
    color: #b91c1c;
}

.block-result-meta[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 6px;
    color: #64748b;
    font-size: 12px;
}

.block-result-editor[b-4s3ptjiqhh] {
    margin-top: 12px;
}

.stat-card[b-4s3ptjiqhh] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 16px;
    text-align: center;
}

.stat-label[b-4s3ptjiqhh] {
    font-size: 11px;
    text-transform: uppercase;
    color: #94a3b8;
    font-weight: 600;
    margin-bottom: 6px;
}

.stat-value[b-4s3ptjiqhh] {
    font-size: 24px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 4px;
}

.stat-sub[b-4s3ptjiqhh] {
    font-size: 12px;
    color: #94a3b8;
}

.skills-section[b-4s3ptjiqhh] {
    margin-bottom: 24px;
}

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

.section-title[b-4s3ptjiqhh] {
    font-size: 18px;
    font-weight: 600;
}

.accordion-item[b-4s3ptjiqhh] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 12px;
    overflow: hidden;
}

.accordion-header[b-4s3ptjiqhh] {
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    background: #ffffff;
}

.accordion-header:hover[b-4s3ptjiqhh] {
    background: #f8fafc;
}

.accordion-title[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600;
    font-size: 15px;
}

.score-badge[b-4s3ptjiqhh] {
    font-size: 12px;
    color: #059669;
    background: #d1fae5;
    padding: 2px 8px;
    border-radius: 6px;
}

.performance-label[b-4s3ptjiqhh] {
    font-size: 13px;
    font-weight: 600;
}

.accordion-content[b-4s3ptjiqhh] {
    border-top: 1px solid #e2e8f0;
}

.skill-row[b-4s3ptjiqhh] {
    padding: 20px;
    border-bottom: 1px solid #e2e8f0;
}

.skill-row:last-child[b-4s3ptjiqhh] {
    border-bottom: none;
}

.skill-meta[b-4s3ptjiqhh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.skill-name[b-4s3ptjiqhh] {
    font-size: 15px;
    font-weight: 600;
}

.skill-score[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    flex-wrap: wrap;
}

.score-value[b-4s3ptjiqhh] {
    font-weight: 600;
}

.eval-badge[b-4s3ptjiqhh] {
    font-size: 11px;
    text-transform: uppercase;
    padding: 4px 8px;
    border-radius: 999px;
    font-weight: 700;
}

.badge-exceeds[b-4s3ptjiqhh] {
    background: #d1fae5;
    color: #059669;
}

.badge-meets[b-4s3ptjiqhh] {
    background: #dbeafe;
    color: #2563eb;
}

.badge-below[b-4s3ptjiqhh] {
    background: #fef3c7;
    color: #b45309;
}

.badge-na[b-4s3ptjiqhh] {
    background: #f3f4f6;
    color: #6b7280;
}

.ai-eval-chip[b-4s3ptjiqhh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.ai-eval-label[b-4s3ptjiqhh] {
    font-size: 11px;
    font-weight: 700;
    color: #7c3aed;
    text-transform: uppercase;
}

.qa-block[b-4s3ptjiqhh] {
    margin-top: 12px;
    padding-left: 12px;
}

.question-text[b-4s3ptjiqhh] {
    font-size: 14px;
    color: #64748b;
    margin-bottom: 6px;
    font-weight: 500;
}

.question-text[b-4s3ptjiqhh] {
    display: flex;
    gap: 6px;
}

.question-prefix[b-4s3ptjiqhh] {
    font-weight: 600;
    color: #64748b;
}

.question-markdown p[b-4s3ptjiqhh] {
    margin: 0;
}

.answer-box[b-4s3ptjiqhh] {
    background: #f8fafc;
    border-left: 3px solid #cbd5e1;
    padding: 12px;
    border-radius: 0 8px 8px 0;
    font-size: 14px;
    color: #1e293b;
    margin-bottom: 8px;
    line-height: 1.5;
    display: flex;
    gap: 6px;
    align-items: flex-start;
}

.answer-label[b-4s3ptjiqhh] {
    font-weight: 600;
    color: #64748b;
    margin-right: 6px;
}

.answer-content[b-4s3ptjiqhh] {
    flex: 1;
    min-width: 0;
}

.evidence-box[b-4s3ptjiqhh] {
    background: #fef3c7;
    border-left: 3px solid #f59e0b;
    padding: 10px;
    border-radius: 0 6px 6px 0;
    font-size: 13px;
    color: #92400e;
    display: flex;
    gap: 6px;
    align-items: flex-start;
}

.ai-evidence-box[b-4s3ptjiqhh] {
    margin-top: 8px;
    background: #ede9fe;
    border-left: 3px solid #7c3aed;
    padding: 10px;
    border-radius: 0 6px 6px 0;
    font-size: 13px;
    color: #4c1d95;
    display: flex;
    gap: 6px;
    align-items: flex-start;
}

.evidence-content[b-4s3ptjiqhh],
.ai-evidence-content[b-4s3ptjiqhh] {
    flex: 1;
    min-width: 0;
}

.evidence-content strong[b-4s3ptjiqhh],
.ai-evidence-content strong[b-4s3ptjiqhh] {
    display: block;
    margin-bottom: 4px;
}

.conclusion-card[b-4s3ptjiqhh],
.ai-section[b-4s3ptjiqhh] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}

.conclusion-header[b-4s3ptjiqhh] {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
}

.manual-session[b-4s3ptjiqhh] {
    border-top: 1px solid #e2e8f0;
    padding-top: 16px;
    margin-top: 16px;
}

.manual-session:first-of-type[b-4s3ptjiqhh] {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.manual-session-header[b-4s3ptjiqhh] {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 12px;
}

.manual-session-title[b-4s3ptjiqhh] {
    font-weight: 600;
    font-size: 16px;
    color: #1e293b;
}

.manual-session-meta[b-4s3ptjiqhh] {
    font-size: 12px;
    color: #64748b;
}

.manual-decision[b-4s3ptjiqhh] {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
}

.decision-pass[b-4s3ptjiqhh] {
    background: #d1fae5;
    color: #059669;
}

.decision-fail[b-4s3ptjiqhh] {
    background: #fee2e2;
    color: #dc2626;
}

.decision-pending[b-4s3ptjiqhh] {
    background: #f3f4f6;
    color: #6b7280;
}

.manual-notes[b-4s3ptjiqhh] {
    margin-top: 12px;
    background: #f8fafc;
    border-radius: 8px;
    padding: 12px;
    font-size: 13px;
    color: #334155;
}

.ai-section[b-4s3ptjiqhh] {
    border-color: #e9d5ff;
    background: #faf5ff;
}

.ai-header[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    color: #5b21b6;
}

.ai-title[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
}

.ai-generated-at[b-4s3ptjiqhh] {
    font-size: 12px;
    font-weight: 600;
    color: #6d28d9;
}

.ai-decision-row[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid #e9d5ff;
    border-radius: 10px;
    background: #f5f3ff;
}

.ai-decision-label[b-4s3ptjiqhh] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #6d28d9;
}

.ai-insights-grid[b-4s3ptjiqhh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
}

.ai-insight-box[b-4s3ptjiqhh] {
    border: 1px solid #e9d5ff;
    border-radius: 10px;
    background: #ffffff;
    padding: 12px;
}

.ai-insight-title[b-4s3ptjiqhh] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #6d28d9;
    margin-bottom: 8px;
}

.ai-insight-content[b-4s3ptjiqhh] {
    font-size: 14px;
    color: #1f2937;
    line-height: 1.6;
}

.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h1,
.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h2,
.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h3,
.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h4,
.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h5,
.ai-insight-content[b-4s3ptjiqhh]  .ot-markdown-html h6 {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    line-height: 1.35;
    color: #1f2937;
}

.ai-note[b-4s3ptjiqhh] {
    margin-top: 12px;
    font-size: 12px;
    color: #6d28d9;
}

.sticky-footer[b-4s3ptjiqhh] {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    border-top: 1px solid #e2e8f0;
    padding: 12px 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
    z-index: 100;
}

.footer-actions[b-4s3ptjiqhh] {
    display: flex;
    gap: 12px;
}

.empty-text[b-4s3ptjiqhh] {
    color: #94a3b8;
    font-size: 14px;
}

.text-success[b-4s3ptjiqhh] {
    color: #059669;
}

.text-info[b-4s3ptjiqhh] {
    color: #2563eb;
}

.text-warning[b-4s3ptjiqhh] {
    color: #f59e0b;
}

.text-danger[b-4s3ptjiqhh] {
    color: #dc2626;
}

@media (max-width: 1024px) {
    .stats-grid[b-4s3ptjiqhh] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .assessment-results-page[b-4s3ptjiqhh] {
        padding: 24px 20px 96px;
    }

    .results-header[b-4s3ptjiqhh] {
        flex-direction: column;
        align-items: flex-start;
    }

    .candidate-header[b-4s3ptjiqhh] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pass-badge[b-4s3ptjiqhh] {
        position: static;
        margin-bottom: 12px;
    }

    .stats-grid[b-4s3ptjiqhh] {
        grid-template-columns: 1fr;
    }

    .block-result-meta[b-4s3ptjiqhh] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .ai-insights-grid[b-4s3ptjiqhh] {
        grid-template-columns: 1fr;
    }

    .sticky-footer[b-4s3ptjiqhh] {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html {
    line-height: 1.6;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html p {
    margin: 0 0 0.75rem;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html ul,
.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html ol {
    margin: 0.5rem 0 0.75rem;
    padding-left: 1.25rem;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-markdown-html li {
    margin-bottom: 0.35rem;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-block {
    margin: 0.75rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-language {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1e40af;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-copy {
    border: 1px solid #aabed9;
    background: #eef4ff;
    color: #1b3358;
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-copy:hover {
    background: #dbe8fb;
    border-color: #8fa9cc;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
    border-radius: 0;
}

.assessment-results-page[b-4s3ptjiqhh]  .ot-code-block pre code {
    display: block;
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre;
}

.dialog-overlay[b-4s3ptjiqhh] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
}

.preview-layout[b-4s3ptjiqhh] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
}

.pdf-preview-area[b-4s3ptjiqhh] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-4s3ptjiqhh] {
    width: 100%;
    height: 100%;
    border: none;
}

.preview-sidebar[b-4s3ptjiqhh] {
    width: 220px;
    flex-shrink: 0;
    background: #fff;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}

@media (max-width: 900px) {
    .preview-layout[b-4s3ptjiqhh] {
        flex-direction: column;
        width: 96vw;
        height: 92vh;
        gap: 12px;
    }

    .preview-sidebar[b-4s3ptjiqhh] {
        width: 100%;
        padding: 16px;
    }
}

.skill-subgroup-header[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    margin-top: 8px;
    margin-bottom: 4px;
    background: #f1f5f9;
    border-left: 3px solid #4AC4FF;
    border-radius: 4px;
}

.skill-subgroup-name[b-4s3ptjiqhh] {
    font-size: 13px;
    font-weight: 600;
    color: #1e293b;
}

.skill-subgroup-meta[b-4s3ptjiqhh] {
    font-size: 12px;
    color: #64748b;
}

.signoff-info[b-4s3ptjiqhh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding: 6px 12px;
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 6px;
    font-size: 13px;
    color: #075985;
}

.signoff-info strong[b-4s3ptjiqhh] {
    font-weight: 600;
    color: #0c4a6e;
}

.block-help-card[b-4s3ptjiqhh] {
    background: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    color: #0c4a6e;
    font-size: 13px;
}

.block-help-title[b-4s3ptjiqhh] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 700;
    color: #075985;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    font-size: 12px;
}

.block-help-list[b-4s3ptjiqhh] {
    margin: 0;
    padding-left: 20px;
    line-height: 1.55;
}

.block-help-list li[b-4s3ptjiqhh] {
    margin-bottom: 4px;
}

.block-help-list li:last-child[b-4s3ptjiqhh] {
    margin-bottom: 0;
}

.block-help-list em[b-4s3ptjiqhh] {
    color: #0369a1;
    font-style: normal;
    font-weight: 600;
}

.outcome-row[b-4s3ptjiqhh] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
}

.outcome-select[b-4s3ptjiqhh] {
    flex: 1;
}

.outcome-tooltip[b-4s3ptjiqhh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-width: 320px;
    font-size: 12px;
    line-height: 1.4;
}

.outcome-tooltip strong[b-4s3ptjiqhh] {
    color: #ffffff;
}

.outcome-hint[b-4s3ptjiqhh] {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 6px;
    padding: 8px 10px;
    background: #f8fafc;
    border-left: 3px solid #94a3b8;
    border-radius: 4px;
    font-size: 12px;
    color: #475569;
    line-height: 1.45;
}

.outcome-hint .mud-icon-root[b-4s3ptjiqhh] {
    flex-shrink: 0;
    margin-top: 1px;
    color: #64748b;
}
/* /Components/Pages/Employees/AssessmentSessionPages/AssessmentSessionPreparation.razor.rz.scp.css */
.assessment-prep-page[b-fy9wghjrox] {
    background: #f8fafc;
    min-height: 100vh;
    padding: 0;
    font-family: "Inter", system-ui, -apple-system, sans-serif;
    color: #111827;
}

.assessment-prep-page .prep-loading[b-fy9wghjrox],
.assessment-prep-page .session-pin-wrapper[b-fy9wghjrox] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-fy9wghjrox] .assessment-prep-page .pin-card {
    padding: 40px 36px;
    max-width: 440px;
    width: 100%;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.12);
}

[b-fy9wghjrox] .assessment-prep-page .pin-icon {
    width: 64px;
    height: 64px;
    background: #2e75b6 !important;
}

[b-fy9wghjrox] .assessment-prep-page .pin-submit-btn {
    margin-top: 24px;
    height: 48px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 10px;
}

[b-fy9wghjrox] .assessment-prep-page .pin-input-field input {
    text-align: center !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: 2px;
}

[b-fy9wghjrox] .assessment-prep-page .pin-input-field .mud-input-root {
    width: 60px;
    height: 60px;
}

[b-fy9wghjrox] .assessment-prep-page .pin-input-field .mud-input-root-text {
    border-radius: 10px;
}

.assessment-prep-page .prep-wrapper[b-fy9wghjrox] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    transition: filter 0.18s ease;
}

.assessment-prep-page.page-blur-active .prep-wrapper[b-fy9wghjrox] {
    filter: blur(3px);
}

.assessment-prep-page .prep-header[b-fy9wghjrox] {
    height: 72px;
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    padding: 0 24px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    flex-shrink: 0;
}

.assessment-prep-page .header-logo[b-fy9wghjrox] {
    width: 40px;
    height: 40px;
    background: #1e3a8a;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-weight: 700;
    margin-right: 16px;
}

.assessment-prep-page .header-info[b-fy9wghjrox] {
    flex: 1;
    min-width: 0;
}

.assessment-prep-page .assessment-title[b-fy9wghjrox] {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 2px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.assessment-prep-page .assessment-meta[b-fy9wghjrox] {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

.assessment-prep-page .header-actions[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.assessment-prep-page .save-status[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #ecfdf3;
    border: 1px solid #10b981;
    color: #065f46;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
}

.assessment-prep-page .btn-exit[b-fy9wghjrox] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 1px solid transparent;
    color: #6b7280;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.assessment-prep-page .btn-exit:hover[b-fy9wghjrox] {
    background: #f3f4f6;
}

.assessment-prep-page .prep-content[b-fy9wghjrox] {
    display: flex;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.assessment-prep-page .prep-sidebar[b-fy9wghjrox] {
    width: 320px;
    background: #f9fafb;
    border-right: 1px solid #e5e7eb;
    padding: 24px 16px;
    overflow-y: auto;
    flex-shrink: 0;
}

.assessment-prep-page .sidebar-title[b-fy9wghjrox] {
    font-size: 11px;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}

.assessment-prep-page .sidebar-divider[b-fy9wghjrox] {
    height: 1px;
    background: #e5e7eb;
    margin: 12px 0;
}

.assessment-prep-page .category-group[b-fy9wghjrox] {
    margin-bottom: 8px;
}

.assessment-prep-page .category-header[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin: 16px 0 8px 0;
    padding: 0 8px;
}

.assessment-prep-page .category-dot[b-fy9wghjrox] {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    display: inline-block;
}

.assessment-prep-page .category-count[b-fy9wghjrox] {
    color: #9ca3af;
    font-weight: 400;
}

.assessment-prep-page .skill-item[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    border-radius: 6px;
    cursor: pointer;
    margin-bottom: 4px;
    transition: background 0.12s;
    position: relative;
}

.assessment-prep-page .skill-item:hover[b-fy9wghjrox] {
    background: #ffffff;
}

.assessment-prep-page .skill-item.active[b-fy9wghjrox] {
    background: #dbeafe;
    border-left: 3px solid #3b82f6;
    padding-left: 9px;
}

.assessment-prep-page .skill-item.active .skill-name[b-fy9wghjrox] {
    font-weight: 600;
}

.assessment-prep-page .skill-chevron[b-fy9wghjrox] {
    font-size: 12px;
    color: #9ca3af;
    margin-right: 8px;
    display: flex;
    align-items: center;
}

.assessment-prep-page .skill-name[b-fy9wghjrox] {
    font-size: 14px;
    color: #111827;
    flex: 1;
}

.assessment-prep-page .skill-count[b-fy9wghjrox] {
    font-size: 13px;
    color: #6b7280;
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: 4px;
}

.assessment-prep-page .modified-dot[b-fy9wghjrox] {
    width: 8px;
    height: 8px;
    background: #f59e0b;
    border-radius: 50%;
    margin-left: 8px;
}

.assessment-prep-page .question-preview-list[b-fy9wghjrox] {
    margin-left: 12px;
    border-left: 1px solid #e5e7eb;
    padding-left: 12px;
    margin-bottom: 8px;
}

.assessment-prep-page .question-preview-item[b-fy9wghjrox] {
    font-size: 13px;
    color: #6b7280;
    padding: 4px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    display: block;
    width: 100%;
    text-align: left;
    background: transparent;
    border: none;
    text-decoration: none;
}

.assessment-prep-page .question-preview-item:hover[b-fy9wghjrox] {
    color: #3b82f6;
}

.assessment-prep-page .preview-more[b-fy9wghjrox] {
    font-size: 12px;
    color: #3b82f6;
    font-weight: 600;
    margin-top: 4px;
    cursor: pointer;
    background: transparent;
    border: none;
    padding: 0;
}

.assessment-prep-page .prep-main[b-fy9wghjrox] {
    flex: 1;
    min-width: 0;
    min-height: 0;
    overflow-y: auto;
    padding: 0 0 40px 0;
    background: #ffffff;
}

.assessment-prep-page .skill-header-section[b-fy9wghjrox] {
    padding: 32px 40px 24px;
    background: #ffffff;
    position: sticky;
    top: 0;
    z-index: 50;
    border-bottom: 1px solid #e5e7eb;
}

.assessment-prep-page .skill-title[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 24px;
    font-weight: 700;
    color: #111827;
    margin-bottom: 8px;
}

.assessment-prep-page .skill-meta[b-fy9wghjrox] {
    font-size: 14px;
    color: #6b7280;
}

.assessment-prep-page .content-divider[b-fy9wghjrox] {
    height: 1px;
    background: #e5e7eb;
    margin: 24px 0;
}

.assessment-prep-page .roadmap-container[b-fy9wghjrox] {
    margin-bottom: 24px;
}

.assessment-prep-page .roadmap-toggle[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 600;
    color: #2563eb;
    background: none;
    border: none;
    padding: 12px 16px;
    border-radius: 8px;
    cursor: pointer;
    width: 100%;
    text-align: left;
    transition: background 0.15s;
}

.assessment-prep-page .roadmap-toggle:hover[b-fy9wghjrox] {
    background: #eff6ff;
}

.assessment-prep-page .roadmap-toggle-state[b-fy9wghjrox] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
}

.assessment-prep-page .roadmap-list[b-fy9wghjrox] {
    background: #ecfdf3;
    border: 1px solid #bbf7d0;
    border-radius: 8px;
    padding: 20px;
    margin: 12px 0 24px;
}

.assessment-prep-page .roadmap-item[b-fy9wghjrox] {
    display: flex;
    gap: 12px;
    margin-bottom: 16px;
}

.assessment-prep-page .roadmap-item:last-child[b-fy9wghjrox] {
    margin-bottom: 0;
}

.assessment-prep-page .roadmap-number[b-fy9wghjrox] {
    font-weight: 700;
    color: #065f46;
    font-size: 14px;
}

.assessment-prep-page .roadmap-content h4[b-fy9wghjrox] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #065f46;
}

.assessment-prep-page .questions-list[b-fy9wghjrox] {
    padding: 0 40px 40px;
}

.assessment-prep-page .question-card[b-fy9wghjrox] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 24px;
    margin-bottom: 24px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    transition: all 0.2s ease;
    scroll-margin-top: 260px;
}

.assessment-prep-page .question-card:target[b-fy9wghjrox] {
    border-color: #60a5fa;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.22);
}

.assessment-prep-page .question-card:hover[b-fy9wghjrox] {
    border-color: #dbeafe;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}

.assessment-prep-page .q-card-header[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}

.assessment-prep-page .drag-handle[b-fy9wghjrox] {
    color: #d1d5db;
    cursor: grab;
    margin-right: 8px;
    opacity: 0;
    transition: opacity 0.2s;
}

.assessment-prep-page .question-card:hover .drag-handle[b-fy9wghjrox] {
    opacity: 1;
}

.assessment-prep-page .q-badge[b-fy9wghjrox] {
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    margin-right: 12px;
}

.assessment-prep-page .q-badge-num[b-fy9wghjrox] {
    background: #1e3a8a;
    color: #ffffff;
}

.assessment-prep-page .type-badge[b-fy9wghjrox],
.assessment-prep-page .source-badge[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    margin-right: 8px;
}

.assessment-prep-page .type-theoretical[b-fy9wghjrox] {
    background: #dbeafe;
    color: #1e40af;
}

.assessment-prep-page .type-practical[b-fy9wghjrox] {
    background: #ecfdf3;
    color: #065f46;
}

.assessment-prep-page .source-ai[b-fy9wghjrox] {
    background: #f3f4f6;
    color: #374151;
}

.assessment-prep-page .source-custom[b-fy9wghjrox] {
    background: #eff6ff;
    color: #1e3a8a;
}

.assessment-prep-page .card-actions[b-fy9wghjrox] {
    margin-left: auto;
    display: flex;
    gap: 8px;
}

.assessment-prep-page .icon-btn[b-fy9wghjrox] {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    background: transparent;
    border: none;
    transition: background 0.15s;
}

.assessment-prep-page .icon-btn:disabled[b-fy9wghjrox] {
    opacity: 0.4;
    cursor: not-allowed;
}

.assessment-prep-page .btn-regenerate[b-fy9wghjrox] {
    color: #2563eb;
}

.assessment-prep-page .btn-regenerate:hover[b-fy9wghjrox] {
    background: #eff6ff;
}

.assessment-prep-page .btn-edit[b-fy9wghjrox] {
    color: #0369a1;
}

.assessment-prep-page .btn-edit:hover[b-fy9wghjrox] {
    background: #e0f2fe;
}

.assessment-prep-page .btn-edit.active[b-fy9wghjrox] {
    background: #e0f2fe;
}

.assessment-prep-page .btn-reorder[b-fy9wghjrox] {
    color: #6b7280;
}

.assessment-prep-page .btn-reorder:hover:not(:disabled)[b-fy9wghjrox] {
    background: #f3f4f6;
    color: #374151;
}

.assessment-prep-page .btn-delete[b-fy9wghjrox] {
    color: #ef4444;
}

.assessment-prep-page .btn-delete:hover[b-fy9wghjrox] {
    background: #fee2e2;
}

.assessment-prep-page .q-content[b-fy9wghjrox] {
    font-size: 15px;
    color: #111827;
    line-height: 1.7;
    margin-bottom: 16px;
    white-space: pre-wrap;
}

.assessment-prep-page .expected-answer-block[b-fy9wghjrox] {
    border: 1px solid #d6e6fb;
    border-radius: 10px;
    overflow: hidden;
    white-space: normal;
}

.assessment-prep-page .expected-answer-header[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: #eaf3ff;
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 700;
    border-bottom: 1px solid #dbeafe;
    width: 100%;
    text-align: left;
    border: none;
    cursor: pointer;
}

.assessment-prep-page .expected-answer-header-main[b-fy9wghjrox] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.assessment-prep-page .expected-answer-chevron[b-fy9wghjrox] {
    color: #64748b;
}

.assessment-prep-page .expected-answer-body[b-fy9wghjrox] {
    background: #f4f9ff;
    border-top: 1px solid #dbeafe;
    padding: 12px;
}

.assessment-prep-page .expected-answer-empty[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.assessment-prep-page .expected-answer-block[b-fy9wghjrox]  .mud-collapse-container,
.assessment-prep-page .expected-answer-block[b-fy9wghjrox]  .mud-collapse-wrapper,
.assessment-prep-page .expected-answer-block[b-fy9wghjrox]  .mud-collapse-wrapper-inner {
    margin: 0;
    padding: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  p {
    margin: 0 0 12px 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  p:last-child {
    margin-bottom: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  ul,
.assessment-prep-page .q-content[b-fy9wghjrox]  ol {
    margin: 0 0 12px 20px;
    padding: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  li {
    margin-bottom: 6px;
}

.assessment-prep-page .question-edit-inline[b-fy9wghjrox] {
    display: flex;
    flex-direction: column;
}

.assessment-prep-page .question-edit-actions[b-fy9wghjrox] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

[b-fy9wghjrox] .question-edit-btn {
    min-width: 78px;
    height: 34px;
    padding: 0 12px;
}

.assessment-prep-page .q-footer[b-fy9wghjrox] {
    border-top: 1px solid #f3f4f6;
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 12px;
    color: #9ca3af;
}

.assessment-prep-page .meta-item[b-fy9wghjrox] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.assessment-prep-page .related-roadmap[b-fy9wghjrox] {
    color: #7c3aed;
    cursor: pointer;
}

.assessment-prep-page .related-roadmap:hover[b-fy9wghjrox] {
    text-decoration: underline;
}

.assessment-prep-page .btn-add-question[b-fy9wghjrox] {
    width: 100%;
    height: 100px;
    background: #ffffff;
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
    text-align: center;
}

.assessment-prep-page .btn-add-question:hover[b-fy9wghjrox] {
    border-color: #2563eb;
    background: #eff6ff;
}

.assessment-prep-page .add-q-title[b-fy9wghjrox] {
    font-size: 16px;
    font-weight: 600;
    color: #2563eb;
    margin-bottom: 4px;
}

.assessment-prep-page .add-q-sub[b-fy9wghjrox] {
    font-size: 13px;
    color: #6b7280;
}

[b-fy9wghjrox] .prep-modal-backdrop {
    background-color: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 1200;
}

[b-fy9wghjrox] .prep-modal-content {
    border-radius: 14px;
}

[b-fy9wghjrox] .add-question-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

[b-fy9wghjrox] .modal-close-wrap {
    margin-left: auto;
    display: flex;
    align-items: center;
    padding-left: 12px;
}

[b-fy9wghjrox] .prep-modal-close {
    margin-left: auto;
}

[b-fy9wghjrox] .prep-regenerate-header {
    border-bottom: 1px solid #e5e7eb !important;
    padding-bottom: 14px;
    margin-bottom: 8px;
}

[b-fy9wghjrox] .prep-regenerate-footer {
    border-top: 1px solid #e5e7eb !important;
    padding-top: 12px;
    margin-top: 10px;
}

[b-fy9wghjrox] .regenerate-preview {
    display: grid;
    gap: 12px;
}

[b-fy9wghjrox] .regenerate-preview-block {
    border: 1px solid #d1d5db;
    border-radius: 10px;
    padding: 12px;
    background: #f8fafc;
}

[b-fy9wghjrox] .regenerate-preview-block-new {
    border-color: #bfdbfe;
    background: #eff6ff;
}

[b-fy9wghjrox] .regenerate-preview-label {
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

[b-fy9wghjrox] .regenerate-preview-text {
    font-size: 14px;
    color: #0f172a;
    line-height: 1.5;
    white-space: normal;
}

[b-fy9wghjrox] .regenerate-preview-note {
    font-size: 12px;
    color: #475569;
}

[b-fy9wghjrox] .regenerate-footer-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

[b-fy9wghjrox] .regenerate-footer-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html {
    line-height: 1.6;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html p {
    margin: 0 0 0.45rem;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html ul,
[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html ol {
    margin: 0.25rem 0 0.45rem;
    padding-left: 1.25rem;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-markdown-html li {
    margin-bottom: 0.2rem;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-code-block {
    margin: 0.5rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

[b-fy9wghjrox] .regenerate-preview-text .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

[b-fy9wghjrox] .regenerate-preview-text .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
}

[b-fy9wghjrox] .add-question-mode-radio {
    margin-top: 0;
    margin-bottom: 24px;
}

[b-fy9wghjrox] .add-question-mode-radio .mud-radio-group {
    gap: 4px;
}

[b-fy9wghjrox] .add-question-hint {
    color: #4b5563;
    margin-bottom: 16px;
}

[b-fy9wghjrox] .custom-question-input {
    resize: vertical;
    min-height: 150px;
}

[b-fy9wghjrox] .question-label-row {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 10px;
    margin-bottom: 8px;
}

[b-fy9wghjrox] .question-preview-btn-wrap {
    margin-left: auto;
    display: flex;
    align-items: center;
}

[b-fy9wghjrox] .preview-label-btn {
    background: #e0f2fe;
    border-color: #bae6fd;
    color: #0369a1;
    flex-shrink: 0;
}

[b-fy9wghjrox] .preview-label-btn:hover {
    background: #d0ecfc;
    border-color: #7dd3fc;
}

[b-fy9wghjrox] .question-type-select {
    margin-top: 8px;
}

[b-fy9wghjrox] .question-edit-type-select {
    margin-top: 0;
}

[b-fy9wghjrox] .markdown-preview-panel {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f9fafb;
    padding: 14px;
    margin-bottom: 12px;
}

[b-fy9wghjrox] .preview-title {
    font-size: 13px;
    font-weight: 700;
    color: #374151;
    margin-bottom: 10px;
}

[b-fy9wghjrox] .preview-content {
    font-size: 14px;
    color: #111827;
    line-height: 1.6;
}

[b-fy9wghjrox] .preview-content p {
    margin: 0 0 8px 0;
}

[b-fy9wghjrox] .preview-content p:last-child {
    margin-bottom: 0;
}

@media (max-width: 1100px) {
    .assessment-prep-page .prep-sidebar[b-fy9wghjrox] {
        width: 260px;
    }
}

@media (max-width: 900px) {
    .assessment-prep-page .prep-content[b-fy9wghjrox] {
        flex-direction: column;
    }

    .assessment-prep-page .prep-sidebar[b-fy9wghjrox] {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e5e7eb;
        max-height: 320px;
    }

    .assessment-prep-page .skill-header-section[b-fy9wghjrox] {
        position: static;
    }
}

@media (max-width: 640px) {
    .assessment-prep-page .prep-header[b-fy9wghjrox] {
        flex-direction: column;
        align-items: flex-start;
        height: auto;
        gap: 10px;
        padding: 12px 16px;
    }

    .assessment-prep-page .header-actions[b-fy9wghjrox] {
        width: 100%;
        justify-content: space-between;
    }

    .assessment-prep-page .questions-list[b-fy9wghjrox],
    .assessment-prep-page .skill-header-section[b-fy9wghjrox] {
        padding-left: 20px;
        padding-right: 20px;
    }

    [b-fy9wghjrox] .add-question-mode-radio .mud-radio-group {
        align-items: flex-start;
    }
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html {
    line-height: 1.6;
    white-space: normal;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html p,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html p {
    margin: 0 0 0.45rem;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html p:last-child,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html ul,
.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html ol,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html ul,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html ol {
    margin: 0.25rem 0 0.45rem;
    padding-left: 1.25rem;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html li,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html li {
    margin-bottom: 0.2rem;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-markdown-html li > p,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-markdown-html li > p {
    margin: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-block,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-block {
    margin: 0.5rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
    white-space: normal;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-toolbar,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-language,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-language {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1e40af;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-copy,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-copy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    white-space: nowrap;
    border: 1px solid #aabed9;
    background: #eef4ff;
    color: #1b3358;
    border-radius: 6px;
    height: 2rem;
    min-height: 0;
    min-width: 0;
    padding: 0 0.65rem;
    font-size: 0.7rem;
    line-height: 1;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-copy:hover,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-copy:hover {
    background: #dbe8fb;
    border-color: #8fa9cc;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-block pre,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-block pre {
    margin: 0;
    padding: 0.35rem 1rem 0.85rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
    border-radius: 0;
}

.assessment-prep-page .q-content[b-fy9wghjrox]  .ot-code-block pre code,
.assessment-prep-page .preview-content[b-fy9wghjrox]  .ot-code-block pre code {
    display: block;
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre;
}
/* /Components/Pages/Employees/AssessmentSessionPages/PublicAssessmentSession.razor.rz.scp.css */
.assessment-session-page[b-k7hm3bfeov] {
    background: #f8fafc;
    min-height: 100vh;
    padding: 0;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

.assessment-session-page .session-loading[b-k7hm3bfeov] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.assessment-session-page .session-pin-wrapper[b-k7hm3bfeov] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-k7hm3bfeov] .assessment-session-page .pin-card {
    padding: 40px 36px;
    max-width: 440px;
    width: 100%;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
}

[b-k7hm3bfeov] .assessment-session-page .pin-icon {
    width: 64px;
    height: 64px;
    background: #2e75b6 !important;
}

[b-k7hm3bfeov] .assessment-session-page .pin-submit-btn {
    margin-top: 24px;
    height: 48px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 10px;
}

[b-k7hm3bfeov] .pin-input-field input {
    text-align: center !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    letter-spacing: 2px;
}

[b-k7hm3bfeov] .pin-input-field .mud-input-root {
    width: 60px;
    height: 60px;
}

[b-k7hm3bfeov] .pin-input-field .mud-input-root-text {
    border-radius: 10px;
}

.assessment-session-page .session-header[b-k7hm3bfeov] {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #ffffff;
    border-bottom: 1px solid #e2e8f0;
    padding: 14px 28px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.assessment-session-page .session-header-left[b-k7hm3bfeov] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 280px;
}

.assessment-session-page .session-header-icon[b-k7hm3bfeov] {
    color: #2e75b6;
    font-size: 20px;
}

.assessment-session-page .session-header-title[b-k7hm3bfeov] {
    font-size: 17px;
    font-weight: 700;
    color: #1e293b;
}

.assessment-session-page .session-header-separator[b-k7hm3bfeov] {
    width: 1px;
    height: 22px;
    background: #e2e8f0;
    margin: 0 4px;
}

.assessment-session-page .session-header-subtitle[b-k7hm3bfeov] {
    font-size: 13px;
    color: #64748b;
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    align-items: center;
}

.assessment-session-page .session-header-subtitle span[b-k7hm3bfeov] {
    color: #94a3b8;
}

/* progress bar in header */
.assessment-session-page .session-header-progress[b-k7hm3bfeov] {
    flex: 1;
    max-width: 380px;
    margin: 0 auto;
}

.assessment-session-page .session-progress-label[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    margin-bottom: 5px;
}

.assessment-session-page .session-progress-track[b-k7hm3bfeov] {
    height: 5px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
}

.assessment-session-page .session-progress-fill[b-k7hm3bfeov] {
    height: 100%;
    background: #2e75b6;
    border-radius: 999px;
    transition: width 0.3s ease;
}

.assessment-session-page .session-header-actions[b-k7hm3bfeov] {
    display: flex;
    gap: 10px;
    margin-left: auto;
}

.assessment-session-page .session-layout[b-k7hm3bfeov] {
    display: grid;
    grid-template-columns: 230px 1fr 280px;
    gap: 0;
    width: 100%;
    margin: 0 auto;
    padding: 16px 20px;
    align-items: start;
}

.assessment-session-page .session-panel[b-k7hm3bfeov] {
    background: #ffffff;
    border: 1px solid #e8ecf0;
    border-radius: 10px;
    height: calc(100vh - 100px);
    overflow-y: auto;
    overflow-x: hidden;
}

.assessment-session-page .session-skills-panel[b-k7hm3bfeov] {
    padding: 14px 12px;
    margin-right: 12px;
}

.assessment-session-page .panel-title[b-k7hm3bfeov] {
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f1f3f6;
}

.assessment-session-page .skill-category[b-k7hm3bfeov] {
    margin-bottom: 4px;
}

.assessment-session-page .category-header[b-k7hm3bfeov] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    background: transparent;
    border: none;
    padding: 7px 6px;
    border-radius: 6px;
    color: #475569;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s;
}

.assessment-session-page .category-header:hover[b-k7hm3bfeov] {
    background: #f4f6f8;
}

.assessment-session-page .category-name[b-k7hm3bfeov] {
    font-weight: 700;
    color: #1e293b;
    font-size: 13px;
}

.assessment-session-page .category-count[b-k7hm3bfeov] {
    color: #94a3b8;
    font-size: 12px;
}

.assessment-session-page .category-score[b-k7hm3bfeov] {
    margin-left: auto;
    font-weight: 700;
    color: #7c3aed;
    font-size: 12px;
}

.assessment-session-page .category-content[b-k7hm3bfeov] {
    padding-left: 6px;
    margin-top: 2px;
}

.assessment-session-page .skill-card[b-k7hm3bfeov] {
    padding: 9px 10px;
    border-radius: 7px;
    border-left: 3px solid transparent;
    margin-bottom: 4px;
    cursor: pointer;
    position: relative;
    transition: background 0.15s, transform 0.15s;
    background: #fafbfc;
}

.assessment-session-page .skill-card:hover[b-k7hm3bfeov] {
    background: #f0f4f8;
    transform: translateX(3px);
}

.assessment-session-page .skill-card.completed[b-k7hm3bfeov] {
    background: #eef9f2;
    border-left-color: #059669;
}

.assessment-session-page .skill-card.in-progress[b-k7hm3bfeov] {
    background: #fef6ee;
    border-left-color: #ea580c;
}

.assessment-session-page .skill-card.not-started[b-k7hm3bfeov] {
    border-left-color: #dde2e8;
    background: #fafbfc;
}

.assessment-session-page .skill-card.current[b-k7hm3bfeov] {
    background: #eef2f6;
    border-left-color: #2e75b6;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.15);
}

.assessment-session-page .skill-card-header[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
}

.assessment-session-page .skill-name[b-k7hm3bfeov] {
    font-size: 13px;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.assessment-session-page .skill-status-icon[b-k7hm3bfeov] {
    color: #94a3b8;
    font-size: 16px;
    flex-shrink: 0;
}

.assessment-session-page .skill-card.completed .skill-status-icon[b-k7hm3bfeov] {
    color: #059669;
}

.assessment-session-page .skill-card.in-progress .skill-status-icon[b-k7hm3bfeov] {
    color: #ea580c;
}

.assessment-session-page .skill-meta[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: #64748b;
    margin-top: 4px;
}

.assessment-session-page .skill-progress-track[b-k7hm3bfeov] {
    height: 3px;
    background: #e2e8f0;
    border-radius: 999px;
    margin-top: 5px;
    overflow: hidden;
}

.assessment-session-page .skill-progress-fill[b-k7hm3bfeov] {
    height: 100%;
    background: #2e75b6;
    border-radius: 999px;
    transition: width 0.3s;
}

.assessment-session-page .skill-card.completed .skill-progress-fill[b-k7hm3bfeov] {
    background: #059669;
}

.assessment-session-page .skill-card.in-progress .skill-progress-fill[b-k7hm3bfeov] {
    background: #ea580c;
}


.assessment-session-page .session-questions-panel[b-k7hm3bfeov] {
    padding: 22px 28px;
    margin: 0 8px;
}

.assessment-session-page .question-container[b-k7hm3bfeov] {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.assessment-session-page .skill-header-card[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #eef0f3;
}

.assessment-session-page .skill-header-title[b-k7hm3bfeov] {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.assessment-session-page .points-badge[b-k7hm3bfeov] {
    font-size: 13px;
    color: #7c3aed;
    font-weight: 500;
}

.assessment-session-page .question-dots[b-k7hm3bfeov] {
    display: flex;
    gap: 7px;
}

.assessment-session-page .q-dot[b-k7hm3bfeov] {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: transparent;
    border: 2px solid #cbd5e1;
    cursor: pointer;
    transition: transform 0.15s;
}

.assessment-session-page .q-dot:hover[b-k7hm3bfeov] {
    transform: scale(1.25);
}

.assessment-session-page .q-dot.answered[b-k7hm3bfeov] {
    background: #059669;
    border-color: #059669;
}

.assessment-session-page .q-dot.current[b-k7hm3bfeov] {
    background: #2e75b6;
    border-color: #2e75b6;
    box-shadow: 0 0 0 3px rgba(46, 117, 182, 0.18);
}

.assessment-session-page .question-counter[b-k7hm3bfeov] {
    font-size: 13px;
    color: #64748b;
    font-weight: 600;
}

.assessment-session-page .question-text[b-k7hm3bfeov] {
    font-size: 15px;
    color: #1e293b;
    line-height: 1.6;
}

.assessment-session-page .question-text p[b-k7hm3bfeov] {
    margin: 0;
}

.assessment-session-page .question-meta[b-k7hm3bfeov] {
    display: flex;
    gap: 7px;
}

.assessment-session-page .input-group[b-k7hm3bfeov] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.assessment-session-page .expected-answer-block[b-k7hm3bfeov] {
    border: 1px solid #d6e6fb;
    border-radius: 10px;
    overflow: hidden;
}

.assessment-session-page .expected-answer-header[b-k7hm3bfeov] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: #eaf3ff;
    color: #1d4ed8;
    font-size: 13px;
    font-weight: 700;
    border-bottom: 1px solid #dbeafe;
    width: 100%;
    text-align: left;
    border: none;
    cursor: pointer;
}

.assessment-session-page .expected-answer-header-main[b-k7hm3bfeov] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.assessment-session-page .expected-answer-chevron[b-k7hm3bfeov] {
    color: #64748b;
}

.assessment-session-page .expected-answer-body[b-k7hm3bfeov] {
    background: #f4f9ff;
    border-top: 1px solid #dbeafe;
    padding: 12px;
}

.assessment-session-page .expected-answer-empty[b-k7hm3bfeov] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.assessment-session-page .expected-answer-block[b-k7hm3bfeov]  .mud-collapse-container,
.assessment-session-page .expected-answer-block[b-k7hm3bfeov]  .mud-collapse-wrapper,
.assessment-session-page .expected-answer-block[b-k7hm3bfeov]  .mud-collapse-wrapper-inner {
    margin: 0;
    padding: 0;
}

.assessment-session-page .input-label[b-k7hm3bfeov] {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.assessment-session-page .evaluation-section[b-k7hm3bfeov] {
    padding-top: 4px;
}

.assessment-session-page .required-mark[b-k7hm3bfeov] {
    color: #dc2626;
    margin-left: 3px;
}

.assessment-session-page .evaluation-grid[b-k7hm3bfeov] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 8px;
}

.assessment-session-page .eval-card[b-k7hm3bfeov] {
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    padding: 14px 8px;
    text-align: center;
    cursor: pointer;
    position: relative;
    color: #64748b;
    transition: all 0.2s;
    background: #fff;
}

.assessment-session-page .eval-card:hover[b-k7hm3bfeov] {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.assessment-session-page .eval-card.selected .eval-check[b-k7hm3bfeov] {
    opacity: 1;
}

.assessment-session-page .eval-check[b-k7hm3bfeov] {
    position: absolute;
    top: 7px;
    right: 7px;
    opacity: 0;
    transition: opacity 0.2s;
    font-size: 16px;
}

.assessment-session-page .eval-na.selected[b-k7hm3bfeov] {
    background: #f3f4f6;
    border-color: #94a3b8;
    color: #64748b;
}

.assessment-session-page .eval-below.selected[b-k7hm3bfeov] {
    background: #fee2e2;
    border-color: #dc2626;
    color: #dc2626;
}

.assessment-session-page .eval-meets.selected[b-k7hm3bfeov] {
    background: #dbeafe;
    border-color: #2563eb;
    color: #2563eb;
}

.assessment-session-page .eval-exceeds.selected[b-k7hm3bfeov] {
    background: #d1fae5;
    border-color: #059669;
    color: #059669;
}

.assessment-session-page .eval-label[b-k7hm3bfeov] {
    font-size: 12px;
    font-weight: 600;
}

.assessment-session-page .score-input-row[b-k7hm3bfeov] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.assessment-session-page .score-input[b-k7hm3bfeov] {
    max-width: 140px;
}

.assessment-session-page .score-hint[b-k7hm3bfeov] {
    font-size: 12px;
    color: #94a3b8;
    margin-top: 6px;
}

.assessment-session-page .nav-section[b-k7hm3bfeov] {
    border-top: 1px solid #eef0f3;
    padding-top: 14px;
    margin-top: 6px;
}

.assessment-session-page .section-subtitle[b-k7hm3bfeov] {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 8px;
}

.assessment-session-page .preview-scroll[b-k7hm3bfeov] {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

.assessment-session-page .preview-scroll[b-k7hm3bfeov]::-webkit-scrollbar {
    height: 4px;
}

.assessment-session-page .preview-scroll[b-k7hm3bfeov]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 2px;
}

.assessment-session-page .preview-card[b-k7hm3bfeov] {
    min-width: 200px;
    max-width: 230px;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-shrink: 0;
    transition: all 0.18s;
}

.assessment-session-page .preview-card:hover[b-k7hm3bfeov] {
    background: #f8fafc;
    border-color: #cbd5e1;
    transform: translateY(-2px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.assessment-session-page .preview-card.current[b-k7hm3bfeov] {
    border-color: #2e75b6;
    background: #eff6ff;
    box-shadow: 0 2px 6px rgba(46, 117, 182, 0.15);
}

.assessment-session-page .preview-card.answered[b-k7hm3bfeov] {
    border-color: #059669;
    background: #f0fdf4;
}

.assessment-session-page .preview-text[b-k7hm3bfeov] {
    font-size: 12px;
    color: #475569;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.assessment-session-page .preview-status[b-k7hm3bfeov] {
    display: flex;
    justify-content: center;
    color: #94a3b8;
    font-size: 16px;
}

.assessment-session-page .preview-card.answered .preview-status[b-k7hm3bfeov] {
    color: #059669;
}

.assessment-session-page .preview-card.current .preview-status[b-k7hm3bfeov] {
    color: #2e75b6;
}

.assessment-session-page .nav-buttons[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    margin-top: 14px;
}

.assessment-session-page .session-summary-panel[b-k7hm3bfeov] {
    padding: 14px 14px;
    margin-left: 8px;
}

.assessment-session-page .summary-card[b-k7hm3bfeov] {
    background: #f8fafc;
    border-radius: 8px;
    padding: 14px;
    margin-bottom: 12px;
    border: 1px solid #eef0f3;
}

.assessment-session-page .summary-score[b-k7hm3bfeov] {
    font-size: 20px;
    font-weight: 800;
    color: #ea580c;
    margin-top: 4px;
}

.assessment-session-page .summary-progress-track[b-k7hm3bfeov] {
    height: 6px;
    background: #e2e8f0;
    border-radius: 999px;
    margin: 8px 0;
    overflow: hidden;
}

.assessment-session-page .summary-progress-fill[b-k7hm3bfeov] {
    height: 100%;
    background: #ea580c;
    border-radius: 999px;
    transition: width 0.3s;
}

.assessment-session-page .summary-subtext[b-k7hm3bfeov] {
    font-size: 12px;
    color: #64748b;
}

.assessment-session-page .summary-divider[b-k7hm3bfeov] {
    height: 1px;
    background: #e2e8f0;
    margin: 10px 0;
}

.assessment-session-page .summary-group-title[b-k7hm3bfeov] {
    font-size: 10px;
    font-weight: 800;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-top: 8px;
    margin-bottom: 4px;
}

.assessment-session-page .mini-skill-item[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #64748b;
    padding: 5px 4px;
    border-radius: 4px;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f6;
    transition: background 0.12s;
}

.assessment-session-page .mini-skill-item:last-child[b-k7hm3bfeov] {
    border-bottom: none;
}

.assessment-session-page .mini-skill-item:hover[b-k7hm3bfeov] {
    background: #fff;
}

.assessment-session-page .mini-skill-item.current[b-k7hm3bfeov] {
    background: #ffffff;
    color: #1e293b;
    font-weight: 700;
}

.assessment-session-page .mini-skill-left[b-k7hm3bfeov] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.assessment-session-page .auto-save[b-k7hm3bfeov] {
    font-size: 11px;
    color: #94a3b8;
    margin-top: 5px;
    text-align: right;
}

.assessment-session-page .conclusion-wrapper[b-k7hm3bfeov] {
    max-width: 860px;
    margin: 0 auto;
    padding: 32px 24px 56px;
}

.assessment-session-page .conclusion-header[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 28px;
}

.assessment-session-page .conclusion-title[b-k7hm3bfeov] {
    font-size: 22px;
    font-weight: 700;
    color: #1e293b;
}

.assessment-session-page .conclusion-steps[b-k7hm3bfeov] {
    display: flex;
    gap: 16px;
    font-size: 13px;
    color: #64748b;
    align-items: center;
}

.assessment-session-page .conclusion-steps .step.completed[b-k7hm3bfeov] {
    color: #059669;
    font-weight: 500;
}

.assessment-session-page .conclusion-steps .step.active[b-k7hm3bfeov] {
    color: #2e75b6;
    font-weight: 700;
}

.assessment-session-page .score-card[b-k7hm3bfeov] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.assessment-session-page .score-grid[b-k7hm3bfeov] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 18px;
}

.assessment-session-page .score-box[b-k7hm3bfeov] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 18px;
    text-align: center;
    background: #fafbfc;
}

.assessment-session-page .score-value[b-k7hm3bfeov] {
    font-size: 30px;
    font-weight: 800;
    color: #1e293b;
}

.assessment-session-page .score-label[b-k7hm3bfeov] {
    font-size: 12px;
    color: #64748b;
    margin-top: 3px;
}

.assessment-session-page .score-progress[b-k7hm3bfeov] {
    height: 22px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 10px;
}

.assessment-session-page .score-progress-fill[b-k7hm3bfeov] {
    height: 100%;
    background: #059669;
    color: white;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 10px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 999px;
}

.assessment-session-page .score-subtext[b-k7hm3bfeov] {
    font-size: 12px;
    color: #64748b;
}

.assessment-session-page .conclusion-instructions[b-k7hm3bfeov] {
    background: #eff6ff;
    border-left: 4px solid #2e75b6;
    padding: 14px 18px;
    border-radius: 8px;
    font-size: 13px;
    color: #1e293b;
    line-height: 1.55;
    margin-bottom: 22px;
}

.assessment-session-page .conclusion-section[b-k7hm3bfeov] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px 22px;
    margin-bottom: 16px;
    position: relative;
    overflow: hidden;
}

.assessment-session-page .conclusion-section[b-k7hm3bfeov]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 12px 0 0 12px;
}

.assessment-session-page .conclusion-green[b-k7hm3bfeov]::before {
    background: #059669;
}

.assessment-session-page .conclusion-orange[b-k7hm3bfeov]::before {
    background: #ea580c;
}

.assessment-session-page .conclusion-blue[b-k7hm3bfeov]::before {
    background: #2e75b6;
}

.assessment-session-page .section-title[b-k7hm3bfeov] {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #1e293b;
}

.assessment-session-page .final-decision[b-k7hm3bfeov] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.assessment-session-page .decision-card[b-k7hm3bfeov] {
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    padding: 22px;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s;
    background: #fff;
}

.assessment-session-page .decision-card:hover[b-k7hm3bfeov] {
    border-color: #cbd5e1;
    background: #f8fafc;
    transform: translateY(-2px);
    box-shadow: 0 3px 8px rgba(0,0,0,0.07);
}

.assessment-session-page .decision-card.selected[b-k7hm3bfeov] {
    border-color: #2e75b6;
    background: #eff6ff;
    box-shadow: 0 2px 8px rgba(46,117,182,0.15);
}

.assessment-session-page .decision-title[b-k7hm3bfeov] {
    font-size: 17px;
    font-weight: 700;
    color: #1e293b;
    margin-top: 8px;
}

.assessment-session-page .decision-subtext[b-k7hm3bfeov] {
    font-size: 12px;
    color: #64748b;
    margin-top: 4px;
}

.assessment-session-page .conclusion-footer[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    margin-top: 28px;
}

/* Submitted view */
.assessment-session-page .export-wrapper[b-k7hm3bfeov] {
    font-family: "Inter", system-ui, -apple-system, sans-serif;
    background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
    color: #1e293b;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.assessment-session-page .success-card[b-k7hm3bfeov] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 48px;
    max-width: 580px;
    width: 100%;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.assessment-session-page .success-icon-wrapper[b-k7hm3bfeov] {
    width: 80px;
    height: 80px;
    background: #d1fae5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: #059669;
    font-size: 40px;
    animation: scaleIn-b-k7hm3bfeov 0.5s ease-out;
}

.assessment-session-page .success-icon[b-k7hm3bfeov] {
    color: #059669;
}

.assessment-session-page .success-card h1[b-k7hm3bfeov] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 12px;
}

.assessment-session-page .subtitle[b-k7hm3bfeov] {
    font-size: 16px;
    color: #64748b;
    line-height: 1.5;
    margin-bottom: 32px;
}

.assessment-session-page .summary-box[b-k7hm3bfeov] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 32px;
    text-align: left;
}

.assessment-session-page .summary-row[b-k7hm3bfeov] {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 14px;
    border-bottom: 1px solid #e2e8f0;
    gap: 12px;
}

.assessment-session-page .summary-row:last-child[b-k7hm3bfeov] {
    border-bottom: none;
}

.assessment-session-page .label[b-k7hm3bfeov] {
    color: #64748b;
}

.assessment-session-page .value[b-k7hm3bfeov] {
    font-weight: 600;
    color: #1e293b;
    text-align: right;
}

.assessment-session-page .score-value[b-k7hm3bfeov] {
    color: #059669;
    font-weight: 700;
}

.assessment-session-page .btn-close[b-k7hm3bfeov] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
    padding: 12px 24px;
    background: #2e75b6;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
    text-decoration: none;
}

.assessment-session-page .btn-close:hover[b-k7hm3bfeov] {
    background: #1e5a8e;
}

.assessment-session-page .footer-text[b-k7hm3bfeov] {
    margin-top: 24px;
    font-size: 12px;
    color: #94a3b8;
}

@keyframes scaleIn-b-k7hm3bfeov {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@media (max-width: 640px) {
    .assessment-session-page .success-card[b-k7hm3bfeov] {
        padding: 32px 24px;
    }
}


@media (max-width: 1280px) {
    .assessment-session-page .session-layout[b-k7hm3bfeov] {
        grid-template-columns: 220px 1fr 260px;
    }
}

@media (max-width: 1100px) {
    .assessment-session-page .session-layout[b-k7hm3bfeov] {
        grid-template-columns: 210px 1fr;
    }

    .assessment-session-page .session-summary-panel[b-k7hm3bfeov] {
        display: none;
    }
}

@media (max-width: 900px) {
    .assessment-session-page .session-layout[b-k7hm3bfeov] {
        grid-template-columns: 1fr;
    }

    .assessment-session-page .session-skills-panel[b-k7hm3bfeov] {
        display: none;
    }

    .assessment-session-page .session-panel[b-k7hm3bfeov] {
        height: auto;
    }

    .assessment-session-page .session-header[b-k7hm3bfeov] {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html {
    line-height: 1.6;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html p,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html p {
    margin: 0 0 0.75rem;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html p:last-child,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html p:last-child {
    margin-bottom: 0;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html ul,
.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html ol,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html ul,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html ol {
    margin: 0.5rem 0 0.75rem;
    padding-left: 1.25rem;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-markdown-html li,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-markdown-html li {
    margin-bottom: 0.35rem;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-block,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-block {
    margin: 0.75rem 0;
    border: 1px solid #bccde2;
    border-radius: 12px;
    overflow: hidden;
    background: #e8eef7;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-toolbar,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: linear-gradient(180deg, #e2eaf6 0%, #d4e0f1 100%);
    border-bottom: 1px solid #bccde2;
    padding: 0.35rem 0.7rem;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-language,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-language {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #1e40af;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-copy,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-copy {
    border: 1px solid #aabed9;
    background: #eef4ff;
    color: #1b3358;
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-copy:hover,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-copy:hover {
    background: #dbe8fb;
    border-color: #8fa9cc;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-block pre,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-block pre {
    margin: 0;
    padding: 0.85rem 1rem;
    background: #e8eef7;
    color: #0f172a;
    overflow-x: auto;
    border-radius: 0;
}

.assessment-session-page .question-text[b-k7hm3bfeov]  .ot-code-block pre code,
.assessment-session-page .expected-answer-body[b-k7hm3bfeov]  .ot-code-block pre code {
    display: block;
    color: inherit;
    font-size: 0.86rem;
    line-height: 1.55;
    white-space: pre;
}
/* /Components/Pages/Employees/CertificatePlanDetailsPage.razor.rz.scp.css */
.plan-details-page[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.plan-loading[b-nh8woyzpg2] {
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.plan-empty-not-found[b-nh8woyzpg2] {
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    padding: 2rem;
    text-align: center;
}

.plan-empty-not-found h4[b-nh8woyzpg2] {
    margin-bottom: 1rem;
}

.plan-breadcrumb[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #64748b;
    font-size: 0.88rem;
}

.breadcrumb-link[b-nh8woyzpg2] {
    border: none;
    background: transparent;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0;
}

.breadcrumb-link:hover[b-nh8woyzpg2] {
    color: #2e75b6;
}

.breadcrumb-separator[b-nh8woyzpg2] {
    color: #94a3b8;
}

.breadcrumb-current[b-nh8woyzpg2] {
    color: #1e293b;
    font-weight: 500;
}

.plan-alerts[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.plan-alert[b-nh8woyzpg2] {
    border-radius: 8px;
    padding: 0.65rem 0.9rem;
    font-size: 0.88rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.plan-alert-critical[b-nh8woyzpg2] {
    background: #fee2e2;
    border-left: 4px solid #dc2626;
    color: #991b1b;
}

.plan-alert-warning[b-nh8woyzpg2] {
    background: #fef3c7;
    border-left: 4px solid #f59e0b;
    color: #92400e;
}

.plan-card[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 1.2rem;
}

.plan-header-top[b-nh8woyzpg2] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.plan-header-actions[b-nh8woyzpg2] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.plan-title-row[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.vendor-badge[b-nh8woyzpg2] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
    background: #ff9900;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.plan-title[b-nh8woyzpg2] {
    margin: 0;
    font-size: 1.4rem;
    color: #1e293b;
    font-weight: 700;
}

.plan-sub-info[b-nh8woyzpg2] {
    padding-left: 3.2rem;
    margin-top: 0.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.plan-tier[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.88rem;
}

.plan-date[b-nh8woyzpg2] {
    color: #94a3b8;
    font-size: 0.82rem;
}

.status-badge[b-nh8woyzpg2] {
    border-radius: 999px;
    padding: 0.2rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.status-available[b-nh8woyzpg2] {
    background: #dbeafe;
    color: #1e4e8c;
}

.status-in-progress[b-nh8woyzpg2] {
    background: #1d4ed8;
    color: #ffffff;
}

.status-submitted[b-nh8woyzpg2] {
    background: #ede9fe;
    color: #6d28d9;
}

.status-acquired[b-nh8woyzpg2],
.status-met[b-nh8woyzpg2] {
    background: #d1fae5;
    color: #047857;
}

.status-expired[b-nh8woyzpg2],
.status-gap[b-nh8woyzpg2] {
    background: #fee2e2;
    color: #b91c1c;
}

.status-expiring[b-nh8woyzpg2] {
    background: #fef3c7;
    color: #b45309;
}

.status-muted[b-nh8woyzpg2] {
    background: #e2e8f0;
    color: #475569;
}

.status-shared[b-nh8woyzpg2] {
    background: #ccfbf1;
    color: #0f766e;
}

.summary-stats[b-nh8woyzpg2] {
    display: flex;
    gap: 0.65rem;
    margin-top: 1.1rem;
}

.summary-card[b-nh8woyzpg2] {
    flex: 1;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.8rem 0.9rem;
}

.summary-value[b-nh8woyzpg2] {
    font-size: 1.75rem;
    line-height: 1;
    font-weight: 700;
    color: #1e293b;
}

.summary-met[b-nh8woyzpg2] {
    color: #059669;
}

.summary-gaps[b-nh8woyzpg2] {
    color: #dc2626;
}

.summary-expiring[b-nh8woyzpg2] {
    color: #f59e0b;
}

.summary-label[b-nh8woyzpg2] {
    margin-top: 0.2rem;
    color: #64748b;
    font-size: 0.75rem;
}

.plan-progress-block[b-nh8woyzpg2] {
    margin-top: 0.9rem;
}

.plan-progress-text[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.82rem;
    margin-bottom: 0.35rem;
}

.plan-progress-track[b-nh8woyzpg2] {
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.plan-progress-value[b-nh8woyzpg2] {
    height: 100%;
    border-radius: 999px;
    background: #2e75b6;
}

.plan-section-header[b-nh8woyzpg2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 0.8rem;
    margin-bottom: 0.8rem;
    border-bottom: 1px solid #e2e8f0;
}

.plan-section-header.no-border[b-nh8woyzpg2] {
    border-bottom: none;
    margin-bottom: 0.25rem;
}

.plan-section-title[b-nh8woyzpg2] {
    margin: 0;
    font-size: 1.1rem;
    color: #1e293b;
}

.requirements-empty[b-nh8woyzpg2] {
    text-align: center;
    padding: 2.2rem 0.75rem 1.4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.requirements-empty-icon[b-nh8woyzpg2] {
    font-size: 2.4rem;
    color: #cbd5e1;
}

.requirements-empty h4[b-nh8woyzpg2] {
    margin: 0.5rem 0 0.2rem;
    color: #1e293b;
    font-size: 0.98rem;
}

.requirements-empty p[b-nh8woyzpg2] {
    margin: 0 0 0.8rem;
    color: #64748b;
    font-size: 0.85rem;
    max-width: 460px;
}

.table-wrapper[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.plan-table[b-nh8woyzpg2] {
    width: 100%;
    border-collapse: collapse;
}

.plan-table th[b-nh8woyzpg2] {
    background: #f8fafc;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 600;
    text-align: left;
    padding: 0.65rem 0.9rem;
    border-bottom: 1px solid #e2e8f0;
}

.plan-table td[b-nh8woyzpg2] {
    padding: 0.75rem 0.9rem;
    border-bottom: 1px solid #f1f5f9;
    color: #475569;
    font-size: 0.85rem;
    vertical-align: middle;
}

.plan-table tr:last-child td[b-nh8woyzpg2] {
    border-bottom: none;
}

.row-gap[b-nh8woyzpg2] {
    background: #fef2f2;
}

.row-expiring[b-nh8woyzpg2] {
    background: #fffbeb;
}

.requirement-message-cell[b-nh8woyzpg2] {
    font-size: 0.8rem !important;
    color: #475569 !important;
    padding-top: 0 !important;
}

.row-gap .requirement-message-cell[b-nh8woyzpg2] {
    color: #475569 !important;
}

.requirement-main[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.requirement-sub[b-nh8woyzpg2] {
    margin-top: 0.25rem;
    color: #64748b;
    font-size: 0.76rem;
}

.requirement-metric-line[b-nh8woyzpg2] {
    margin-top: 0.2rem;
    font-size: 0.76rem;
}

.requirement-type-badge[b-nh8woyzpg2] {
    border-radius: 999px;
    padding: 0.08rem 0.45rem;
    font-size: 0.67rem;
    font-weight: 600;
    line-height: 1.4;
    display: inline-flex;
    align-items: center;
}

.badge-single[b-nh8woyzpg2] {
    background: #f1f5f9;
    color: #64748b;
}

.badge-group[b-nh8woyzpg2] {
    background: #dbeafe;
    color: #1d4ed8;
}

.badge-distinct[b-nh8woyzpg2] {
    background: #fef3c7;
    color: #d97706;
    border-radius: 999px;
    padding: 0.08rem 0.45rem;
    font-size: 0.67rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.22rem;
}

.coverage-pills[b-nh8woyzpg2] {
    margin-top: 0.32rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.32rem;
}

.coverage-collapse[b-nh8woyzpg2] {
    margin-top: 0.32rem;
}

.coverage-collapse .coverage-pills[b-nh8woyzpg2] {
    margin-top: 0.24rem;
}

.coverage-collapse-assigned .type-names-collapse-summary[b-nh8woyzpg2],
.coverage-collapse-assigned .type-names-collapse-preview[b-nh8woyzpg2],
.coverage-collapse-assigned .type-names-collapse-content[b-nh8woyzpg2] {
    font-size: 0.78rem;
    color: #64748b;
}

.coverage-collapse-assigned[b-nh8woyzpg2] {
    margin-bottom: 0.38rem;
}

.coverage-pills-assigned[b-nh8woyzpg2] {
    margin-bottom: 0.6rem;
}

.cov-badge[b-nh8woyzpg2] {
    border-radius: 999px;
    padding: 0.08rem 0.45rem;
    font-size: 0.68rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}

.cov-badge-covered[b-nh8woyzpg2] {
    background: #d1fae5;
    color: #047857;
}

.cov-badge-missing[b-nh8woyzpg2] {
    background: #fee2e2;
    color: #b91c1c;
}

.text-right[b-nh8woyzpg2] {
    text-align: right !important;
}

.text-strong[b-nh8woyzpg2] {
    color: #1e293b !important;
    font-weight: 500;
}

.text-primary[b-nh8woyzpg2] {
    color: #2e75b6 !important;
    font-weight: 500;
}

.text-success[b-nh8woyzpg2] {
    color: #059669 !important;
}

.text-warning[b-nh8woyzpg2] {
    color: #b45309 !important;
}

.text-danger[b-nh8woyzpg2] {
    color: #dc2626 !important;
}

.table-link[b-nh8woyzpg2] {
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.8rem;
    padding: 0;
    margin-right: 0.75rem;
}

.table-link:hover[b-nh8woyzpg2] {
    color: #2e75b6;
}

.table-link-danger:hover[b-nh8woyzpg2] {
    color: #dc2626;
}

.assigned-empty-text[b-nh8woyzpg2] {
    text-align: center;
    font-size: 0.88rem;
    color: #94a3b8;
    padding: 1rem 0 0.4rem;
}

.assigned-group-header[b-nh8woyzpg2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0 0.55rem;
}

.assigned-group-title[b-nh8woyzpg2] {
    color: #1e293b;
    font-size: 0.88rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
}

.assigned-group-meta[b-nh8woyzpg2] {
    color: #64748b;
    font-weight: 400;
}

.assigned-group-types[b-nh8woyzpg2] {
    margin-top: -0.2rem;
    margin-bottom: 0.45rem;
    color: #64748b;
    font-size: 0.78rem;
}

.assignment-status-stack[b-nh8woyzpg2] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.linked-cell[b-nh8woyzpg2] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.linked-toggle-btn[b-nh8woyzpg2] {
    width: 24px;
    height: 24px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #ffffff;
    color: #2e75b6;
    font-size: 0.75rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.linked-toggle-btn:hover:not(:disabled)[b-nh8woyzpg2] {
    border-color: #93c5fd;
    background: #eff6ff;
    color: #1d4ed8;
}

.linked-toggle-btn:disabled[b-nh8woyzpg2] {
    border-color: #e2e8f0;
    background: #f8fafc;
    color: #94a3b8;
    cursor: default;
}

.linked-toggle-spinner[b-nh8woyzpg2] {
    display: inline-block;
    animation: linked-spin-b-nh8woyzpg2 0.8s linear infinite;
}

.assigned-group-btn[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    color: #2e75b6;
    height: 30px;
    padding: 0 0.75rem;
    font-size: 0.8rem;
}

.assigned-group-empty[b-nh8woyzpg2] {
    color: #94a3b8;
    font-size: 0.84rem;
    border: 1px dashed #e2e8f0;
    border-radius: 8px;
    padding: 0.8rem;
    text-align: center;
    margin-bottom: 0.7rem;
}

.notify-edit-btn[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    color: #2e75b6;
    font-size: 0.78rem;
    padding: 0.25rem 0.7rem;
    cursor: pointer;
}

.notify-edit-btn:hover[b-nh8woyzpg2] {
    background: #eff6ff;
}

.notify-list[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.notify-row[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
}

.notify-label[b-nh8woyzpg2] {
    width: 230px;
    color: #64748b;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.notify-value[b-nh8woyzpg2] {
    color: #1e293b;
    font-size: 0.85rem;
}

.notify-recipient-summary-list[b-nh8woyzpg2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.notify-recipient-summary-item[b-nh8woyzpg2] {
    border: 1px solid #dbeafe;
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 999px;
    padding: 0.12rem 0.55rem;
    font-size: 0.75rem;
}

.plan-modal-overlay[b-nh8woyzpg2] {
    position: fixed;
    inset: 0;
    z-index: 1500;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.plan-modal-content[b-nh8woyzpg2] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    width: min(600px, 100%);
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.assign-modal-content[b-nh8woyzpg2] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    width: min(720px, 100%);
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.plan-modal-header[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e2e8f0;
}

.plan-modal-header h4[b-nh8woyzpg2] {
    margin: 0;
    font-size: 1.02rem;
    color: #1e293b;
}

.plan-modal-close[b-nh8woyzpg2] {
    border: none;
    background: transparent;
    color: #94a3b8;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.plan-modal-close:hover[b-nh8woyzpg2] {
    background: #f1f5f9;
    color: #475569;
}

.plan-modal-body[b-nh8woyzpg2] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    flex: 1 1 auto;
    min-height: 0;
    overscroll-behavior: contain;
}

.assign-modal-body[b-nh8woyzpg2] {
    gap: 0.75rem;
}

.plan-form-group[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.plan-form-label[b-nh8woyzpg2] {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 600;
}

.plan-form-help[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.78rem;
}

.requirement-type-selector[b-nh8woyzpg2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.requirement-type-card[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    color: #334155;
    padding: 0.72rem 0.8rem;
    display: flex;
    gap: 0.6rem;
    align-items: center;
    text-align: left;
    width: 100%;
    cursor: pointer;
}

.requirement-type-card:hover[b-nh8woyzpg2] {
    border-color: #cbd5e1;
}

.requirement-type-card.selected[b-nh8woyzpg2] {
    border-color: #2e75b6;
    background: #eff6ff;
}

.requirement-type-card-radio[b-nh8woyzpg2] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #94a3b8;
    margin-top: 0;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.requirement-type-card.selected .requirement-type-card-radio[b-nh8woyzpg2] {
    border-color: #2e75b6;
}

.requirement-type-card.selected .requirement-type-card-radio[b-nh8woyzpg2]::after {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #2e75b6;
}

.requirement-type-card-content[b-nh8woyzpg2] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.requirement-type-card-title[b-nh8woyzpg2] {
    color: #1e293b;
    font-size: 0.82rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    line-height: 1.25;
}

.requirement-type-card-desc[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.74rem;
}

.distinct-toggle-row[b-nh8woyzpg2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    padding: 0;
}

.distinct-toggle-copy[b-nh8woyzpg2] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.distinct-toggle-title[b-nh8woyzpg2] {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 600;
}

.distinct-toggle-subtitle[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.74rem;
    line-height: 1.25;
    word-break: normal;
}

.distinct-toggle-help[b-nh8woyzpg2] {
    margin-top: 0.1rem;
    padding: 0.48rem 0.62rem;
    border-left: 3px solid #f97316;
    border-radius: 6px;
    background: #fffbeb;
    color: #8a3a00;
    line-height: 1.32;
}

.distinct-toggle-help strong[b-nh8woyzpg2] {
    font-weight: 700;
}

[b-nh8woyzpg2] .distinct-toggle-row .mud-input-control {
    width: auto !important;
    margin: 0;
    flex: 0 0 auto;
}

[b-nh8woyzpg2] .distinct-toggle-row .mud-switch {
    margin: 0;
}

.plan-notify-group[b-nh8woyzpg2] {
    margin-top: 0.25rem;
    padding-top: 0.75rem;
    border-top: 1px dashed #e2e8f0;
}

.notify-recipients[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.notify-input-row[b-nh8woyzpg2] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
    align-items: center;
}

.notify-employee-suggestions[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.notify-employee-option[b-nh8woyzpg2] {
    width: 100%;
    border: none;
    border-bottom: 1px solid #f1f5f9;
    background: #fff;
    text-align: left;
    padding: 0.55rem 0.7rem;
    display: flex;
    flex-direction: column;
}

.notify-employee-option:last-child[b-nh8woyzpg2] {
    border-bottom: none;
}

.notify-employee-option:hover[b-nh8woyzpg2] {
    background: #f8fafc;
}

.notify-employee-name[b-nh8woyzpg2] {
    color: #334155;
    font-size: 0.84rem;
    font-weight: 600;
}

.notify-employee-email[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.78rem;
}

.notify-empty[b-nh8woyzpg2] {
    color: #94a3b8;
    font-size: 0.8rem;
}

.notify-recipient-list[b-nh8woyzpg2] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.notify-recipient-chip[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    padding: 0.45rem 0.55rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.notify-recipient-meta[b-nh8woyzpg2] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.notify-recipient-name[b-nh8woyzpg2] {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 600;
}

.notify-recipient-email[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.74rem;
}

.notify-recipient-remove[b-nh8woyzpg2] {
    border: none;
    background: transparent;
    color: #94a3b8;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.notify-recipient-remove:hover[b-nh8woyzpg2] {
    background: #e2e8f0;
    color: #334155;
}

.notify-alert-days-grid[b-nh8woyzpg2] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.vendor-segments[b-nh8woyzpg2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.vendor-segment[b-nh8woyzpg2] {
    border: 1px solid #e2e8f0;
    background: #ffffff;
    border-radius: 8px;
    color: #475569;
    font-size: 0.86rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.7rem;
    cursor: pointer;
}

.vendor-segment.active[b-nh8woyzpg2] {
    border-color: #2e75b6;
    background: #eff6ff;
    color: #1e3a8a;
}

.vendor-dot[b-nh8woyzpg2] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
}

.vendor-dot-aws[b-nh8woyzpg2] {
    background: #ff9900;
}

.vendor-dot-azure[b-nh8woyzpg2] {
    background: #0078d4;
}

.vendor-dot-databricks[b-nh8woyzpg2] {
    background: #e11d48;
}

.vendor-dot-other[b-nh8woyzpg2] {
    background: #64748b;
}

.plan-modal-footer[b-nh8woyzpg2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e2e8f0;
    padding: 1rem 1.25rem;
}

.assign-context-strip[b-nh8woyzpg2] {
    background: #eff6ff;
    border-bottom: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
}

.assign-context-title[b-nh8woyzpg2] {
    color: #1e4e8c;
    font-size: 0.88rem;
    font-weight: 600;
}

.assign-context-subtitle[b-nh8woyzpg2] {
    margin-top: 0.1rem;
    color: #475569;
    font-size: 0.8rem;
}

.assign-context-types[b-nh8woyzpg2] {
    margin-top: 0.2rem;
    color: #64748b;
    font-size: 0.74rem;
}

.type-names-collapse[b-nh8woyzpg2] {
    width: 100%;
}

.type-names-collapse-summary[b-nh8woyzpg2] {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    flex-wrap: wrap;
    column-gap: 0.35rem;
    row-gap: 0.1rem;
    cursor: pointer;
    list-style: none;
}

.type-names-collapse-summary[b-nh8woyzpg2]::-webkit-details-marker {
    display: none;
}

.type-names-collapse-preview[b-nh8woyzpg2] {
    display: block;
    flex: 0 1 auto;
    min-width: 0;
    color: #64748b;
    line-height: 1.35;
}

.type-names-collapse-open-label[b-nh8woyzpg2],
.type-names-collapse-close-label[b-nh8woyzpg2] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    margin-top: 0;
    flex: 0 0 auto;
    white-space: nowrap;
    color: #2e75b6;
    font-weight: 600;
    font-size: 0.72rem;
}

.type-names-collapse-open-label[b-nh8woyzpg2]::after {
    content: "\25BE";
    font-size: 0.62rem;
    line-height: 1;
}

.type-names-collapse-close-label[b-nh8woyzpg2]::after {
    content: "\25B4";
    font-size: 0.62rem;
    line-height: 1;
}

.type-names-collapse-close-label[b-nh8woyzpg2] {
    display: none;
}

.type-names-collapse[open] .type-names-collapse-preview[b-nh8woyzpg2] {
    display: none;
}

.type-names-collapse[open] .type-names-collapse-open-label[b-nh8woyzpg2] {
    display: none;
}

.type-names-collapse[open] .type-names-collapse-close-label[b-nh8woyzpg2] {
    display: inline-flex;
    margin-top: 0;
}

.type-names-collapse-content[b-nh8woyzpg2] {
    margin-top: 0.2rem;
    color: #64748b;
    line-height: 1.35;
}

.assign-search-wrap[b-nh8woyzpg2] {
    position: relative;
}

.assign-search-wrap i[b-nh8woyzpg2] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
}

.assign-search-input[b-nh8woyzpg2] {
    width: 100%;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    height: 40px;
    padding: 0 0.75rem 0 2.2rem;
    outline: none;
    font-size: 0.88rem;
}

.assign-search-input:focus[b-nh8woyzpg2] {
    border-color: #2e75b6;
    box-shadow: 0 0 0 3px rgba(46, 117, 182, 0.12);
}

.assign-table .radio-col[b-nh8woyzpg2] {
    width: 38px;
}

.assign-table-wrapper[b-nh8woyzpg2] {
    max-height: min(44vh, 400px);
    overflow: auto;
}

.assign-row[b-nh8woyzpg2] {
    cursor: pointer;
}

.assign-row-selected[b-nh8woyzpg2] {
    background: #eff6ff !important;
}

.custom-checkbox[b-nh8woyzpg2] {
    width: 16px;
    height: 16px;
    border: 2px solid #cbd5e1;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.custom-checkbox i[b-nh8woyzpg2] {
    font-size: 0.65rem;
    line-height: 1;
}

.custom-checkbox.selected[b-nh8woyzpg2] {
    border-color: #2e75b6;
    background: #2e75b6;
    color: #ffffff;
}

.assign-note[b-nh8woyzpg2] {
    color: #64748b;
    font-size: 0.79rem;
    font-style: italic;
}

.assign-selected-count[b-nh8woyzpg2] {
    color: #2e75b6;
    font-size: 0.78rem;
    font-weight: 600;
}

.assign-loading[b-nh8woyzpg2] {
    min-height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.candidate-status-active[b-nh8woyzpg2] {
    color: #059669;
}

.candidate-status-expiring[b-nh8woyzpg2] {
    color: #b45309;
}

@keyframes linked-spin-b-nh8woyzpg2 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

[b-nh8woyzpg2] .plan-details-page .mud-button-root {
    text-transform: none;
    font-weight: 600;
}

[b-nh8woyzpg2] .plan-details-page .mud-input-control {
    width: 100%;
}

[b-nh8woyzpg2] .plan-modal-content .mud-input-control,
[b-nh8woyzpg2] .assign-modal-content .mud-input-control {
    width: 100%;
}

@media (max-width: 992px) {
    .summary-stats[b-nh8woyzpg2] {
        flex-wrap: wrap;
    }

    .summary-card[b-nh8woyzpg2] {
        min-width: calc(50% - 0.4rem);
    }

    .notify-label[b-nh8woyzpg2] {
        width: 180px;
    }

    .assigned-group-header[b-nh8woyzpg2] {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 768px) {
    .plan-card[b-nh8woyzpg2] {
        padding: 0.95rem;
    }

    .plan-header-top[b-nh8woyzpg2] {
        flex-direction: column;
        align-items: flex-start;
    }

    .plan-title-row[b-nh8woyzpg2] {
        flex-wrap: wrap;
    }

    .plan-sub-info[b-nh8woyzpg2] {
        padding-left: 0;
    }

    .plan-table[b-nh8woyzpg2] {
        min-width: 680px;
    }

    .notify-row[b-nh8woyzpg2] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .notify-label[b-nh8woyzpg2] {
        width: auto;
    }

    .plan-modal-footer[b-nh8woyzpg2] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }

    .notify-input-row[b-nh8woyzpg2],
    .notify-alert-days-grid[b-nh8woyzpg2] {
        grid-template-columns: 1fr;
    }

    .requirement-type-selector[b-nh8woyzpg2] {
        grid-template-columns: 1fr;
    }

    .distinct-toggle-row[b-nh8woyzpg2] {
        align-items: center;
    }
}
/* /Components/Pages/Employees/CertificatePlansTab.razor.rz.scp.css */
.certificate-plans-tab[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.plans-header[b-wv712stw0v] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.plans-loader[b-wv712stw0v] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 240px;
}

.plans-loader-inline[b-wv712stw0v] {
    min-height: 160px;
}

.plans-stats-row[b-wv712stw0v] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.75rem;
}

.plans-stat-card[b-wv712stw0v] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 0.9rem 1rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.plans-stat-card-clickable[b-wv712stw0v] {
    cursor: pointer;
    transition: box-shadow 0.15s, border-color 0.15s;
}

.plans-stat-card-clickable:hover[b-wv712stw0v] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
}

.plans-stat-card-active[b-wv712stw0v] {
    border-color: var(--mud-palette-primary) !important;
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
}

.plans-stat-value[b-wv712stw0v] {
    font-size: 1.7rem;
    font-weight: 700;
    line-height: 1.1;
}

.plans-stat-label[b-wv712stw0v] {
    margin-top: 0.25rem;
    font-size: 0.78rem;
    color: #64748b;
}

.plans-stat-total[b-wv712stw0v] {
    color: #1e293b;
}

.plans-stat-progress[b-wv712stw0v] {
    color: #2e75b6;
}

.plans-stat-submitted[b-wv712stw0v] {
    color: #7c3aed;
}

.plans-stat-acquired[b-wv712stw0v] {
    color: #059669;
}

.plans-stat-expiring[b-wv712stw0v] {
    color: #f59e0b;
}

.plans-stat-expired[b-wv712stw0v] {
    color: #94a3b8;
}

.plans-filters[b-wv712stw0v] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.filter-search[b-wv712stw0v] {
    flex: 1 1 320px;
    min-width: 240px;
}

.filter-vendors[b-wv712stw0v],
.filter-statuses[b-wv712stw0v] {
    width: 230px;
    max-width: 100%;
}

.filter-clear[b-wv712stw0v] {
    display: flex;
    align-items: center;
}

.certificate-plans-tab[b-wv712stw0v]  .filter-search .mud-input-control,
.certificate-plans-tab[b-wv712stw0v]  .filter-vendors .mud-input-control,
.certificate-plans-tab[b-wv712stw0v]  .filter-statuses .mud-input-control {
    width: 100%;
}

.plans-count[b-wv712stw0v] {
    color: #64748b;
}

.plans-empty-disabled-filters[b-wv712stw0v] {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.plans-empty-disabled-search[b-wv712stw0v] {
    flex: 1;
    min-height: 40px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f1f5f9;
    color: #94a3b8;
    padding: 0 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
}

.plans-empty-disabled-filter[b-wv712stw0v] {
    min-height: 40px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f1f5f9;
    color: #94a3b8;
    padding: 0 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
}

.plans-list[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.plan-card[b-wv712stw0v] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem 1.25rem;
}

.plan-card-clickable[b-wv712stw0v] {
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.plan-card-clickable:hover[b-wv712stw0v] {
    border-color: #cbd5e1;
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.08);
}

.vendor-badge[b-wv712stw0v] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.6rem;
    background: #2e75b6;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.plan-body[b-wv712stw0v] {
    flex: 1;
    min-width: 0;
}

.plan-right[b-wv712stw0v] {
    flex-shrink: 0;
}

.certificate-plans-tab[b-wv712stw0v]  .plan-menu .mud-icon-button {
    color: #64748b;
}

.certificate-plans-tab[b-wv712stw0v]  .plan-menu .mud-icon-button:hover {
    background: #f1f5f9;
}

.plan-top-row[b-wv712stw0v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.plan-name[b-wv712stw0v] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.plan-meta[b-wv712stw0v] {
    margin: 0.35rem 0 0;
    color: #64748b;
    font-size: 0.88rem;
}

.plan-progress[b-wv712stw0v] {
    margin-top: 0.7rem;
}

.plan-progress-label[b-wv712stw0v] {
    color: #64748b;
    font-size: 0.8rem;
    margin-bottom: 0.32rem;
}

.plan-progress-track[b-wv712stw0v] {
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.plan-progress-fill[b-wv712stw0v] {
    height: 100%;
    border-radius: 999px;
}

.plan-progress-fill-default[b-wv712stw0v] {
    background: #2e75b6;
}

.plan-progress-fill-complete[b-wv712stw0v] {
    background: #059669;
}

.plan-progress-fill-empty[b-wv712stw0v] {
    background: #cbd5e1;
}

.plan-warning[b-wv712stw0v] {
    margin-top: 0.6rem;
    font-size: 0.8rem;
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
}

.plan-warning-critical[b-wv712stw0v] {
    color: #dc2626;
}

.plan-warning-expiring[b-wv712stw0v] {
    color: #b45309;
}

.plan-notes[b-wv712stw0v] {
    margin: 0.6rem 0 0;
    color: #334155;
    font-size: 0.9rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.status-badge[b-wv712stw0v] {
    border-radius: 999px;
    padding: 0.2rem 0.7rem;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-available[b-wv712stw0v] {
    background: #dbeafe;
    color: #1e4e8c;
}

.status-in-progress[b-wv712stw0v] {
    background: #1d4ed8;
    color: #ffffff;
}

.status-submitted[b-wv712stw0v] {
    background: #ede9fe;
    color: #6d28d9;
}

.status-acquired[b-wv712stw0v] {
    background: #d1fae5;
    color: #047857;
}

.status-expired[b-wv712stw0v] {
    background: #fee2e2;
    color: #b91c1c;
}

.status-default[b-wv712stw0v] {
    background: #e2e8f0;
    color: #475569;
}

.certificate-plans-tab[b-wv712stw0v]  .plans-empty-state {
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    padding: 2.5rem 1rem;
    text-align: center;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.certificate-plans-tab[b-wv712stw0v]  .plans-empty-state h4 {
    margin: 0.75rem 0 0.25rem;
    color: #1e293b;
    font-size: 1.05rem;
    font-weight: 600;
}

.certificate-plans-tab[b-wv712stw0v]  .plans-empty-state p {
    margin: 0;
    color: #64748b;
    font-size: 0.9rem;
    max-width: 460px;
}

.empty-icon[b-wv712stw0v] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #e2e8f0;
    color: #475569;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-left: auto;
    margin-right: auto;
}

.certificate-plans-tab[b-wv712stw0v]  .plans-empty-state-large {
    min-height: 330px;
    padding: 3.25rem 1rem 3.75rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.65rem;
}

.plans-empty-state-large .empty-icon[b-wv712stw0v] {
    width: 72px;
    height: 72px;
    border-radius: 0;
    background: transparent;
    color: #c7d2e1;
    margin-bottom: 0.1rem;
}

.plans-empty-state-large .empty-icon i[b-wv712stw0v] {
    font-size: 3.8rem;
    line-height: 1;
}

.plans-empty-state-large p[b-wv712stw0v] {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.7rem;
}

.plans-empty-cta[b-wv712stw0v] {
    border: none;
    border-radius: 8px;
    padding: 0.58rem 1.1rem;
    background: #4ac4ff;
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.16);
    align-self: center;
    transition: background-color 0.18s ease, transform 0.18s ease;
}

.plans-empty-cta:hover[b-wv712stw0v] {
    background: #37bcfd;
}

.plans-empty-cta:active[b-wv712stw0v] {
    transform: translateY(1px);
}

.plans-pagination[b-wv712stw0v] {
    display: flex;
    justify-content: center;
    margin-top: 0.75rem;
}

.plan-modal-overlay[b-wv712stw0v] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1500;
    padding: 1rem;
}

.plan-modal-content[b-wv712stw0v] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    width: min(680px, 100%);
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
}

.plan-modal-header[b-wv712stw0v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    padding: 1rem 1.25rem;
}

.plan-modal-header h4[b-wv712stw0v] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: #1e293b;
}

.plan-modal-close[b-wv712stw0v] {
    border: none;
    background: transparent;
    color: #94a3b8;
    font-size: 1rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.plan-modal-close:hover[b-wv712stw0v] {
    background: #f1f5f9;
    color: #475569;
}

.plan-modal-body[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: 1rem 1.25rem;
    overflow: auto;
}

.plan-form-group[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.plan-form-label[b-wv712stw0v] {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 600;
}

.vendor-segments[b-wv712stw0v] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.vendor-segment[b-wv712stw0v] {
    border: 1px solid #e2e8f0;
    background: #ffffff;
    border-radius: 8px;
    color: #475569;
    font-size: 0.86rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.7rem;
    cursor: pointer;
}

.vendor-segment.active[b-wv712stw0v] {
    border-color: #2e75b6;
    background: #eff6ff;
    color: #1e3a8a;
}

.vendor-dot[b-wv712stw0v] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
}

.vendor-dot-aws[b-wv712stw0v] {
    background: #ff9900;
}

.vendor-dot-azure[b-wv712stw0v] {
    background: #0078d4;
}

.vendor-dot-databricks[b-wv712stw0v] {
    background: #e11d48;
}

.vendor-dot-other[b-wv712stw0v] {
    background: #64748b;
}

.plan-modal-footer[b-wv712stw0v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e2e8f0;
    padding: 1rem 1.25rem;
}

.plan-notify-group[b-wv712stw0v] {
    margin-top: 0.25rem;
    padding-top: 0.75rem;
    border-top: 1px dashed #e2e8f0;
}

.notify-recipients[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.notify-input-row[b-wv712stw0v] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
    align-items: center;
}

.notify-employee-suggestions[b-wv712stw0v] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.notify-employee-option[b-wv712stw0v] {
    width: 100%;
    border: none;
    border-bottom: 1px solid #f1f5f9;
    background: #fff;
    text-align: left;
    padding: 0.55rem 0.7rem;
    display: flex;
    flex-direction: column;
}

.notify-employee-option:last-child[b-wv712stw0v] {
    border-bottom: none;
}

.notify-employee-option:hover[b-wv712stw0v] {
    background: #f8fafc;
}

.notify-employee-name[b-wv712stw0v] {
    color: #334155;
    font-size: 0.84rem;
    font-weight: 600;
}

.notify-employee-email[b-wv712stw0v] {
    color: #64748b;
    font-size: 0.78rem;
}

.notify-empty[b-wv712stw0v] {
    color: #94a3b8;
    font-size: 0.8rem;
}

.notify-recipient-list[b-wv712stw0v] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.notify-recipient-chip[b-wv712stw0v] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    padding: 0.45rem 0.55rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.notify-recipient-meta[b-wv712stw0v] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.notify-recipient-name[b-wv712stw0v] {
    color: #334155;
    font-size: 0.82rem;
    font-weight: 600;
}

.notify-recipient-email[b-wv712stw0v] {
    color: #64748b;
    font-size: 0.74rem;
}

.notify-recipient-remove[b-wv712stw0v] {
    border: none;
    background: transparent;
    color: #94a3b8;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.notify-recipient-remove:hover[b-wv712stw0v] {
    background: #e2e8f0;
    color: #334155;
}

.notify-alert-days-grid[b-wv712stw0v] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (max-width: 1200px) {
    .plans-stats-row[b-wv712stw0v] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .plans-header[b-wv712stw0v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .plans-stats-row[b-wv712stw0v] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filter-vendors[b-wv712stw0v],
    .filter-statuses[b-wv712stw0v] {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .plans-stats-row[b-wv712stw0v] {
        grid-template-columns: 1fr;
    }

    .plan-card[b-wv712stw0v] {
        padding: 0.9rem;
    }

    .plan-top-row[b-wv712stw0v] {
        flex-direction: column;
        align-items: flex-start;
    }

    .plans-empty-disabled-filters[b-wv712stw0v] {
        flex-direction: column;
        align-items: stretch;
    }

    .plan-modal-footer[b-wv712stw0v] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }

    .notify-input-row[b-wv712stw0v],
    .notify-alert-days-grid[b-wv712stw0v] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Employees/CertificationDetailsPage.razor.rz.scp.css */
.certification-details-page[b-s9ob8u1k8b] {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 1.5rem;
    background-color: #f8fafc;
}

/* Timeline Styles */
[b-s9ob8u1k8b] .timeline-card {
    margin-top: 1.5rem;
}

[b-s9ob8u1k8b] .timeline-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

[b-s9ob8u1k8b] .timeline-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

[b-s9ob8u1k8b] .timeline-title > i {
    font-size: 1.5rem;
    color: #475569;
}

[b-s9ob8u1k8b] .timeline-count {
    font-size: 0.875rem;
    color: #64748b;
    font-weight: 500;
}

[b-s9ob8u1k8b] .timeline-body {
    position: relative;
    padding-left: 3.5rem;
}

[b-s9ob8u1k8b] .timeline-line {
    position: absolute;
    left: 1.75rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
}

[b-s9ob8u1k8b] .timeline-entry {
    position: relative;
    margin-bottom: 1.25rem;
}

[b-s9ob8u1k8b] .timeline-entry:last-child {
    margin-bottom: 0;
}

[b-s9ob8u1k8b] .timeline-icon {
    position: absolute;
    left: -3.25rem;
    top: 1.125rem;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 3px solid #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: #ffffff;
    box-shadow: 0 0 0 3px #e2e8f0;
}

[b-s9ob8u1k8b] .timeline-icon-created {
    background: #0284c7;
}

[b-s9ob8u1k8b] .timeline-icon-status {
    background: #3b82f6;
}

[b-s9ob8u1k8b] .timeline-icon-success {
    background: #059669;
}

[b-s9ob8u1k8b] .timeline-icon-upload {
    background: #6366f1;
}

[b-s9ob8u1k8b] .timeline-icon-danger {
    background: #dc2626;
}

[b-s9ob8u1k8b] .timeline-icon-default {
    background: #94a3b8;
}

[b-s9ob8u1k8b] .timeline-entry-inner {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    transition: all 0.2s;
}

[b-s9ob8u1k8b] .timeline-entry-inner:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

[b-s9ob8u1k8b] .timeline-entry-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 0.5rem;
}

[b-s9ob8u1k8b] .timeline-entry-text {
    font-size: 0.875rem;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 0.625rem;
}

[b-s9ob8u1k8b] .timeline-entry-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: #64748b;
}

[b-s9ob8u1k8b] .timeline-empty {
    text-align: center;
    padding: 4rem 1rem;
    color: #94a3b8;
}

[b-s9ob8u1k8b] .timeline-empty > i {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
    opacity: 0.5;
}

[b-s9ob8u1k8b] .timeline-empty > p {
    font-size: 0.9375rem;
    margin: 0;
    color: #64748b;
}

/* Breadcrumb */
.breadcrumb-bar[b-s9ob8u1k8b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #64748b;
    margin-bottom: 1.5rem;
}

.breadcrumb-link[b-s9ob8u1k8b] {
    color: #64748b;
    cursor: pointer;
    transition: color 0.2s;
}

.breadcrumb-link:hover[b-s9ob8u1k8b] {
    color: #475569;
}

.breadcrumb-separator[b-s9ob8u1k8b] {
    color: #cbd5e1;
}

.breadcrumb-strong[b-s9ob8u1k8b] {
    color: #1e293b;
    font-weight: 500;
}

/* Header Card */
.details-header-card[b-s9ob8u1k8b] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.header-main[b-s9ob8u1k8b] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1.5rem;
    gap: 1.5rem;
}

.header-left[b-s9ob8u1k8b] {
    flex: 1;
}

.status-badges[b-s9ob8u1k8b] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.status-badge[b-s9ob8u1k8b] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.025em;
    border: 1px solid;
}

.status-badge-active[b-s9ob8u1k8b] {
    background-color: #d1fae5;
    color: #059669;
    border-color: #a7f3d0;
}

.status-badge-exam[b-s9ob8u1k8b] {
    background-color: #dbeafe;
    color: #0284c7;
    border-color: #bfdbfe;
}

.status-badge-planned[b-s9ob8u1k8b] {
    background-color: #e0e7ff;
    color: #4f46e5;
    border-color: #c7d2fe;
}

.status-badge-failed[b-s9ob8u1k8b] {
    background-color: #fee2e2;
    color: #dc2626;
    border-color: #fecaca;
}

.status-badge-expired[b-s9ob8u1k8b] {
    background-color: #fed7aa;
    color: #c2410c;
    border-color: #fdba74;
}

.status-badge-warning[b-s9ob8u1k8b] {
    background-color: #fef3c7;
    color: #d97706;
    border-color: #fde68a;
}

.status-badge-linked[b-s9ob8u1k8b] {
    background-color: #d1fae5;
    color: #047857;
    border-color: #a7f3d0;
}

.status-badge-unlinked[b-s9ob8u1k8b] {
    background-color: #e2e8f0;
    color: #475569;
    border-color: #cbd5e1;
}

.header-title[b-s9ob8u1k8b] {
    font-size: 2rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 0.5rem 0;
    line-height: 1.2;
}

.header-subtitle[b-s9ob8u1k8b] {
    font-size: 1rem;
    color: #64748b;
    margin: 0;
}

.header-right[b-s9ob8u1k8b] {
    display: flex;
    gap: 0.75rem;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
}

.btn-header-action[b-s9ob8u1k8b] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    color: #475569;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-header-action:hover[b-s9ob8u1k8b] {
    background: #f8fafc;
    border-color: #94a3b8;
}

.btn-header-action:disabled[b-s9ob8u1k8b] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-header-action.btn-danger[b-s9ob8u1k8b] {
    color: #dc2626;
    border-color: #fca5a5;
}

.btn-header-action.btn-danger:hover[b-s9ob8u1k8b] {
    background: #fef2f2;
    border-color: #f87171;
}

.warning-banner[b-s9ob8u1k8b] {
    display: flex;
    gap: 0.875rem;
    padding: 1rem 1.5rem;
    background: #fef3c7;
    border-top: 1px solid #fde68a;
    border-bottom: 1px solid #fde68a;
    align-items: flex-start;
}

.warning-banner > i[b-s9ob8u1k8b] {
    color: #d97706;
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.warning-content[b-s9ob8u1k8b] {
    flex: 1;
}

.warning-title[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #92400e;
    margin-bottom: 0.25rem;
}

.warning-text[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #78350f;
}

/* Action Section */
.action-section[b-s9ob8u1k8b] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.action-section-title[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 1rem 0;
}

.action-buttons[b-s9ob8u1k8b] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.btn-primary[b-s9ob8u1k8b],
.btn-secondary[b-s9ob8u1k8b],
.btn-warning[b-s9ob8u1k8b] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
}

.btn-primary[b-s9ob8u1k8b] {
    background: #2e75b6;
    color: #ffffff;
}

.btn-primary:hover[b-s9ob8u1k8b] {
    background: #1e5a8e;
}

.btn-secondary[b-s9ob8u1k8b] {
    background: #ffffff;
    color: #475569;
    border: 1px solid #cbd5e1;
}

.btn-secondary:hover[b-s9ob8u1k8b] {
    background: #f8fafc;
    border-color: #94a3b8;
}

.btn-warning[b-s9ob8u1k8b] {
    background: #f59e0b;
    color: #ffffff;
}

.btn-warning:hover[b-s9ob8u1k8b] {
    background: #d97706;
}

/* Content Grid */
.content-grid[b-s9ob8u1k8b] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.content-column[b-s9ob8u1k8b] {
    display: flex;
    flex-direction: column;
}

/* Info Card */
.info-card[b-s9ob8u1k8b] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.info-card-header[b-s9ob8u1k8b] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.info-card-title[b-s9ob8u1k8b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
}

.info-card-title > i[b-s9ob8u1k8b] {
    color: #475569;
    font-size: 1.25rem;
}

.info-card-subtitle[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.25rem;
}

.btn-add-note[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #2e75b6;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color 0.2s;
}

.btn-add-note:hover[b-s9ob8u1k8b] {
    color: #1e5a8e;
}

.info-card-body[b-s9ob8u1k8b] {
    padding: 1.5rem;
}

/* Info Row */
.info-row[b-s9ob8u1k8b] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 0;
    border-bottom: 1px solid #f1f5f9;
}

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

.info-row > i[b-s9ob8u1k8b] {
    color: #94a3b8;
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.info-content[b-s9ob8u1k8b] {
    flex: 1;
    min-width: 0;
}

.info-label[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #64748b;
    margin-bottom: 0.25rem;
}

.info-value[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #1e293b;
}

.info-value-success[b-s9ob8u1k8b] {
    color: #059669;
    font-weight: 500;
}

.info-value-warning[b-s9ob8u1k8b] {
    color: #d97706;
    font-weight: 500;
}

.info-value-danger[b-s9ob8u1k8b] {
    color: #dc2626;
    font-weight: 500;
}

.info-value-primary[b-s9ob8u1k8b] {
    color: #2e75b6;
    font-weight: 500;
}

/* Info Detail */
.info-detail[b-s9ob8u1k8b] {
    padding: 1rem 0;
    border-bottom: 1px solid #f1f5f9;
}

.info-detail:last-child[b-s9ob8u1k8b] {
    border-bottom: none;
}

.info-detail-label[b-s9ob8u1k8b] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.375rem;
}

.info-detail-value[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #1e293b;
}

.badge-provider[b-s9ob8u1k8b] {
    display: inline-block;
    padding: 0.375rem 0.75rem;
    background: #dbeafe;
    color: #1e4e8c;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 6px;
}

/* Certificate File */
.certificate-file[b-s9ob8u1k8b] {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.certificate-file-icon[b-s9ob8u1k8b] {
    width: 3rem;
    height: 3rem;
    background: #fee2e2;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.certificate-file-icon > i[b-s9ob8u1k8b] {
    color: #dc2626;
    font-size: 1.5rem;
}

.certificate-file-info[b-s9ob8u1k8b] {
    flex: 1;
    min-width: 0;
}

.certificate-file-name[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 0.25rem;
}

.certificate-file-meta[b-s9ob8u1k8b] {
    font-size: 0.75rem;
    color: #64748b;
    margin-bottom: 0.75rem;
}

.certificate-file-actions[b-s9ob8u1k8b] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.btn-file-action[b-s9ob8u1k8b] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #ffffff;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-file-action:hover[b-s9ob8u1k8b] {
    background: #f8fafc;
    border-color: #94a3b8;
}

.btn-file-action > i[b-s9ob8u1k8b] {
    font-size: 0.875rem;
}

/* Notes */
.note-item[b-s9ob8u1k8b] {
    padding: 1rem 0;
    border-bottom: 1px solid #f1f5f9;
}

.note-item:last-child[b-s9ob8u1k8b] {
    border-bottom: none;
    padding-bottom: 0;
}

.note-text[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #1e293b;
    margin-bottom: 0.5rem;
    line-height: 1.5;
}

.note-meta[b-s9ob8u1k8b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: #64748b;
}

.note-author[b-s9ob8u1k8b] {
    font-weight: 500;
}

.empty-notes[b-s9ob8u1k8b] {
    text-align: center;
    padding: 2rem 1rem;
}

.empty-notes > i[b-s9ob8u1k8b] {
    font-size: 2.5rem;
    color: #cbd5e1;
    margin-bottom: 0.75rem;
    display: block;
}

.empty-notes > p[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0;
}

/* Modal Styles */
.modal[b-s9ob8u1k8b] {
    background: rgba(0, 0, 0, 0.5);
}

.modal-dialog[b-s9ob8u1k8b] {
    max-width: 600px;
}

.modal-content[b-s9ob8u1k8b] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.2), 0 10px 10px -5px rgba(15, 23, 42, 0.15);
}

.modal-header[b-s9ob8u1k8b] {
    padding: 1.5rem 1.5rem 1rem 1.5rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.modal-title[b-s9ob8u1k8b] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.modal-cert-info[b-s9ob8u1k8b] {
    margin-top: 0.5rem;
}

.modal-cert-name[b-s9ob8u1k8b] {
    font-size: 1rem;
    font-weight: 500;
    color: #475569;
    margin: 0;
}

.modal-cert-meta[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #64748b;
    margin: 0.25rem 0 0 0;
}

.btn-close[b-s9ob8u1k8b] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    background: transparent;
    border: none;
    opacity: 0.5;
    transition: opacity 0.2s;
}

.btn-close:hover[b-s9ob8u1k8b] {
    opacity: 1;
}

.modal-body[b-s9ob8u1k8b] {
    padding: 1.5rem;
    max-height: 70vh;
    overflow-y: auto;
    background: #ffffff;
}

.modal-footer[b-s9ob8u1k8b] {
    padding: 1.25rem 1.5rem 1.5rem 1.5rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
}

/* Form Sections */
.form-section[b-s9ob8u1k8b] {
    margin-bottom: 1.5rem;
}

.form-section:last-child[b-s9ob8u1k8b] {
    margin-bottom: 0;
}

.section-label[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
    margin-bottom: 1rem;
}

.section-header[b-s9ob8u1k8b] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 1rem;
}

.required-asterisk[b-s9ob8u1k8b] {
    color: #ef4444;
    margin-left: 0.125rem;
}

/* Result Cards */
.result-cards[b-s9ob8u1k8b] {
    display: flex;
    gap: 1rem;
}

.result-card[b-s9ob8u1k8b] {
    flex: 1;
    background: #ffffff;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    min-height: 140px;
}

.result-card:hover[b-s9ob8u1k8b] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

[b-s9ob8u1k8b] .result-card-selected-passed {
    border-color: #10b981 !important;
    background: #ecfdf5 !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.18) !important;
}

[b-s9ob8u1k8b] .result-card-selected-failed {
    border-color: #ef4444 !important;
    background: #fef2f2 !important;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.18) !important;
}
.result-icon[b-s9ob8u1k8b] {
    font-size: 2.5rem;
    margin-bottom: 0.75rem;
}

.result-label[b-s9ob8u1k8b] {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    color: #1e293b;
}

.result-label-passed[b-s9ob8u1k8b] {
    color: #10b981;
}

.result-label-failed[b-s9ob8u1k8b] {
    color: #ef4444;
}

.result-description[b-s9ob8u1k8b] {
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.4;
}

/* Form Fields */
.field[b-s9ob8u1k8b] {
    margin-bottom: 1.25rem;
}

.field:last-child[b-s9ob8u1k8b] {
    margin-bottom: 0;
}

.field-label[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
    margin-bottom: 0.5rem;
    display: block;
}

.form-control[b-s9ob8u1k8b] {
    width: 100%;
    height: 2.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    padding: 0 1rem;
    font-size: 0.875rem;
    color: #475569;
    transition: all 0.2s;
}

.form-control:focus[b-s9ob8u1k8b] {
    outline: none;
    border-color: #2e75b6;
    box-shadow: 0 0 0 3px rgba(46, 117, 182, 0.1);
}

.form-control[b-s9ob8u1k8b]::placeholder {
    color: #94a3b8;
}

.form-control.with-icon[b-s9ob8u1k8b] {
    padding-left: 2.5rem;
}

.input-icon-wrapper[b-s9ob8u1k8b] {
    position: relative;
}

.input-icon[b-s9ob8u1k8b] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1rem;
    color: #94a3b8;
    pointer-events: none;
}

textarea.form-control[b-s9ob8u1k8b] {
    height: auto;
    min-height: 5rem;
    padding: 0.75rem 1rem;
    resize: vertical;
    line-height: 1.5;
}

.help-text[b-s9ob8u1k8b] {
    margin-top: 0.375rem;
    font-size: 0.8125rem;
    color: #64748b;
}

.char-counter[b-s9ob8u1k8b] {
    margin-top: 0.25rem;
    font-size: 0.8125rem;
    color: #94a3b8;
    text-align: right;
}

/* Upload Area */
.upload-area[b-s9ob8u1k8b] {
    width: 100%;
    min-height: 6.25rem;
    border-radius: 8px;
    border: 2px dashed #e2e8f0;
    background: #f8fafc;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.upload-area:hover[b-s9ob8u1k8b],
.upload-area--active[b-s9ob8u1k8b] {
    border-color: #2e75b6;
    background: #f0f9ff;
}

.upload-icon[b-s9ob8u1k8b] {
    font-size: 1.5rem;
    color: #94a3b8;
    margin-bottom: 0.375rem;
}

.upload-title[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 0.125rem;
}

.upload-subtitle[b-s9ob8u1k8b] {
    font-size: 0.8125rem;
    color: #64748b;
}

/* Checkbox */
.checkbox-row[b-s9ob8u1k8b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.checkbox-box[b-s9ob8u1k8b] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: #2e75b6;
    cursor: pointer;
    transition: all 0.2s;
}

.checkbox-box:hover[b-s9ob8u1k8b] {
    border-color: #2e75b6;
}

.checkbox-checked[b-s9ob8u1k8b] {
    border-color: #2e75b6;
    background: #f0f9ff;
}

.checkbox-label[b-s9ob8u1k8b] {
    font-size: 0.875rem;
    color: #475569;
    cursor: pointer;
    user-select: none;
}

/* Divider */
.divider[b-s9ob8u1k8b] {
    border: none;
    border-top: 1px solid #f1f5f9;
    margin: 1.5rem 0;
}

/* Select */
.form-select[b-s9ob8u1k8b] {
    width: 100%;
    height: 2.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    padding: 0 1rem;
    font-size: 0.875rem;
    color: #475569;
    cursor: pointer;
    transition: all 0.2s;
}

.form-select:focus[b-s9ob8u1k8b] {
    outline: none;
    border-color: #2e75b6;
    box-shadow: 0 0 0 3px rgba(46, 117, 182, 0.1);
}

/* Info Banner */
.info-banner[b-s9ob8u1k8b] {
    background: #fffbeb;
    border-left: 3px solid #f59e0b;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    color: #475569;
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.info-banner-icon[b-s9ob8u1k8b] {
    font-size: 1rem;
    color: #f59e0b;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

/* Button Variants */
.btn-modal-cancel[b-s9ob8u1k8b] {
    height: 2.5rem;
    padding: 0 1.25rem;
    border-radius: 8px;
    border: none;
    background: transparent;
    color: #64748b;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-modal-cancel:hover[b-s9ob8u1k8b] {
    background: #f1f5f9;
    color: #475569;
}

.btn-modal-cancel:disabled[b-s9ob8u1k8b] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-modal-primary[b-s9ob8u1k8b] {
    height: 2.5rem;
    padding: 0 1.5rem;
    border-radius: 8px;
    border: none;
    background: #2e75b6;
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
    transition: all 0.2s;
}

.btn-modal-primary:hover:not(:disabled)[b-s9ob8u1k8b] {
    background: #1e5a8e;
}

.btn-modal-primary:active:not(:disabled)[b-s9ob8u1k8b] {
    background: #164e7f;
}

.btn-modal-primary:disabled[b-s9ob8u1k8b] {
    background: #e2e8f0;
    color: #94a3b8;
    cursor: not-allowed;
    box-shadow: none;
}

.btn-modal-primary.btn-success[b-s9ob8u1k8b] {
    background: #10b981;
}

.btn-modal-primary.btn-success:hover:not(:disabled)[b-s9ob8u1k8b] {
    background: #059669;
}

/* Suggested Value */
.suggested-value[b-s9ob8u1k8b] {
    margin-top: 0.5rem;
}

.suggested-link[b-s9ob8u1k8b] {
    color: #2e75b6;
    font-weight: 500;
    cursor: pointer;
    font-size: 0.875rem;
    transition: color 0.2s;
}

.suggested-link:hover[b-s9ob8u1k8b] {
    color: #1e5a8e;
    text-decoration: underline;
}

/* Grid Layout */
.form-row[b-s9ob8u1k8b] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

/* Responsive */
@media (max-width: 640px) {
    .result-cards[b-s9ob8u1k8b] {
        flex-direction: column;
    }

    .form-row[b-s9ob8u1k8b] {
        grid-template-columns: 1fr;
    }

    .modal-dialog[b-s9ob8u1k8b] {
        margin: 0.5rem;
        max-width: calc(100% - 1rem);
    }
}

/* Responsive */
@media (max-width: 1024px) {
    .content-grid[b-s9ob8u1k8b] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .certification-details-page[b-s9ob8u1k8b] {
        padding: 1rem;
    }

    .header-main[b-s9ob8u1k8b] {
        flex-direction: column;
    }

    .header-right[b-s9ob8u1k8b] {
        width: 100%;
    }

    .btn-header-action[b-s9ob8u1k8b] {
        flex: 1;
        justify-content: center;
    }

    .action-buttons[b-s9ob8u1k8b] {
        flex-direction: column;
    }

    .btn-primary[b-s9ob8u1k8b],
    .btn-secondary[b-s9ob8u1k8b],
    .btn-warning[b-s9ob8u1k8b] {
        width: 100%;
        justify-content: center;
    }

    .header-title[b-s9ob8u1k8b] {
        font-size: 1.5rem;
    }

    .certificate-file[b-s9ob8u1k8b] {
        flex-direction: column;
    }
}

/* MudBlazor Overrides */
[b-s9ob8u1k8b] .mud-overlay {
    z-index: 9999;
}

[b-s9ob8u1k8b] .mud-paper {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

[b-s9ob8u1k8b] .mud-button {
    text-transform: none;
}
/* /Components/Pages/Employees/CertificationsOverviewPage.razor.rz.scp.css */
.certifications-overview-page[b-lljnt59o2a] {
    padding: 0;
}

/* Stat cards layout */
.stat-cards-row[b-lljnt59o2a] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.stat-card-col[b-lljnt59o2a] {
    flex: 1 1 0;
    min-width: 150px;
}

/* Clickable stat cards */
.certifications-overview-stat-card[b-lljnt59o2a] {
    transition: box-shadow 0.2s, border-color 0.2s;
    border: 2px solid transparent;
}

.certifications-overview-stat-card[onclick][b-lljnt59o2a],
[b-lljnt59o2a] .stat-cards-row .stat-card-col .mud-card[onclick] {
    cursor: pointer;
}

.certifications-overview-stat-card:hover[b-lljnt59o2a] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

[b-lljnt59o2a] .stat-card-active {
    border: 2px solid var(--mud-palette-primary) !important;
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
}

[b-lljnt59o2a] .certifications-overview-stat-card .stat-card-content,
[b-lljnt59o2a] .certifications-overview-stat-card .mud-card-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    height: 100%;
    min-height: 140px;
    padding: 1rem 1.25rem !important;
}

.certifications-overview-stat-card .stat-icon[b-lljnt59o2a] {
    font-size: 2rem;
    opacity: 0.9;
    margin-bottom: 0.5rem;
}

.certifications-overview-stat-card .stat-value[b-lljnt59o2a] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0.25rem;
}

.certifications-overview-stat-card .stat-label[b-lljnt59o2a] {
    font-weight: 600;
    font-size: 0.95rem;
}

.certifications-overview-stat-card .stat-sublabel[b-lljnt59o2a] {
    font-size: 0.8rem;
    margin-top: 0.15rem;
}

.certifications-overview-page .filters-wrapper[b-lljnt59o2a] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.certifications-overview-page .filter-item[b-lljnt59o2a] {
    flex: 0 0 auto;
    width: 200px;
}

.certifications-overview-page .filter-search[b-lljnt59o2a] {
    flex: 1 1 200px;
    min-width: 180px;
}

[b-lljnt59o2a] .certifications-overview-page .filter-item .mud-input-control,
[b-lljnt59o2a] .certifications-overview-page .filter-item .mud-select,
[b-lljnt59o2a] .certifications-overview-page .filter-search .mud-input-control {
    width: 100%;
}

[b-lljnt59o2a] .certifications-overview-table .mud-table-cell {
    padding: 12px 16px;
}

[b-lljnt59o2a] .certifications-overview-table .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-lljnt59o2a] .certifications-overview-page .mud-table-container {
    overflow: visible !important;
}

[b-lljnt59o2a] .certifications-overview-page .mud-table-head,
[b-lljnt59o2a] .certifications-overview-page .mud-table-head tr,
[b-lljnt59o2a] .certifications-overview-page .mud-table-head .mud-table-cell,
[b-lljnt59o2a] .certifications-overview-page .certifications-overview-header-cell {
    overflow: visible !important;
}

[b-lljnt59o2a] .certifications-overview-table .mud-table-container {
    overflow-x: auto !important;
    overflow-y: visible !important;
}

[b-lljnt59o2a] .certifications-overview-table .mud-table-root {
    overflow: visible !important;
}

[b-lljnt59o2a] .certifications-overview-table .column-header {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
}

[b-lljnt59o2a] .certifications-overview-table .column-sort {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    user-select: none;
    flex: 1 1 auto;
    min-width: 0;
}

.seniority-stats-card[b-lljnt59o2a] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
}

.seniority-stats-header[b-lljnt59o2a] {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    cursor: pointer;
    border-radius: 12px;
    transition: background-color 0.2s ease-in-out;
}

.seniority-stats-header:hover[b-lljnt59o2a] {
    background: #f8fafc;
}

.seniority-stats-heading-wrap[b-lljnt59o2a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.seniority-stats-title[b-lljnt59o2a] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.seniority-stats-subtitle[b-lljnt59o2a] {
    font-size: 0.75rem;
    color: #64748b;
}

.seniority-stats-chevron[b-lljnt59o2a] {
    color: #64748b;
    transition: color 0.2s ease-in-out;
}

.seniority-stats-content[b-lljnt59o2a] {
    overflow: hidden;
    transition: max-height 0.2s ease-in-out;
}

.seniority-stats-content.expanded[b-lljnt59o2a] {
    max-height: 1000px;
}

.seniority-stats-content.collapsed[b-lljnt59o2a] {
    max-height: 0;
}

.seniority-stats-content-inner[b-lljnt59o2a] {
    padding: 4px 20px 16px;
}

.seniority-row[b-lljnt59o2a] {
    display: grid;
    grid-template-columns: 100px 1fr 70px 60px;
    gap: 12px;
    align-items: center;
    padding: 6px 0;
}

.seniority-label[b-lljnt59o2a] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
}

.seniority-bar-track[b-lljnt59o2a] {
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.seniority-bar-fill[b-lljnt59o2a] {
    height: 100%;
    border-radius: 999px;
}

.seniority-count[b-lljnt59o2a] {
    text-align: right;
    font-size: 0.875rem;
    color: #64748b;
    white-space: nowrap;
}

.seniority-percentage[b-lljnt59o2a] {
    text-align: right;
    font-size: 0.875rem;
    font-weight: 700;
    white-space: nowrap;
}

.seniority-row-clickable[b-lljnt59o2a] {
    cursor: pointer;
    border-radius: 6px;
    margin: 0 -8px;
    padding: 6px 8px;
    transition: background-color 0.15s ease-in-out;
}

.seniority-row-clickable:hover[b-lljnt59o2a] {
    background-color: #f1f5f9;
}

.seniority-row-active[b-lljnt59o2a] {
    background-color: #eff6ff;
    box-shadow: inset 0 0 0 1.5px var(--mud-palette-primary);
}

.seniority-total-divider[b-lljnt59o2a] {
    height: 1px;
    background: #e2e8f0;
    margin: 6px 0;
}

.seniority-row-total .seniority-label[b-lljnt59o2a] {
    font-weight: 700;
}

.seniority-footnote[b-lljnt59o2a] {
    margin-top: 8px;
    font-size: 0.6875rem;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    position: relative;
    z-index: 26;
}

.seniority-missing-backdrop[b-lljnt59o2a] {
    position: fixed;
    inset: 0;
    z-index: 25;
    border: none;
    background: transparent;
    padding: 0;
}

[b-lljnt59o2a] .seniority-missing-toggle {
    background: #eff6ff !important;
    color: #2e75b6 !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 999px !important;
    padding: 0 !important;
    flex-shrink: 0;
}

[b-lljnt59o2a] .seniority-missing-toggle:hover {
    background: #dbeafe !important;
}

[b-lljnt59o2a] .seniority-missing-toggle .mud-icon-root {
    font-size: 1rem;
}

.seniority-missing-popover[b-lljnt59o2a] {
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    min-width: 240px;
    max-width: min(340px, 80vw);
    max-height: 220px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.18);
    padding: 10px 12px;
    z-index: 30;
}

.seniority-missing-popover-title[b-lljnt59o2a] {
    color: #1e293b;
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 6px;
}

.seniority-missing-list[b-lljnt59o2a] {
    margin: 0;
    padding-left: 16px;
    color: #475569;
    font-size: 0.75rem;
}

.seniority-missing-list li + li[b-lljnt59o2a] {
    margin-top: 4px;
}

[b-lljnt59o2a] .seniority-missing-link {
    color: #2e75b6;
    text-decoration: none;
    font-size: 0.75rem !important;
    line-height: 1.25;
    font-weight: 500;
}

[b-lljnt59o2a] .seniority-missing-link:hover {
    text-decoration: underline;
}

@media (max-width: 900px) {
    .seniority-row[b-lljnt59o2a] {
        grid-template-columns: 80px 1fr 56px 50px;
        gap: 8px;
    }

    .seniority-missing-popover[b-lljnt59o2a] {
        left: 0;
        max-width: min(300px, 90vw);
    }
}
/* /Components/Pages/Employees/CertificationsPage.razor.rz.scp.css */
.certifications-page[b-z9fhvzhcrf] {
    padding: 1.5rem;
}

/* Gap between tab headers and tab content */
[b-z9fhvzhcrf] .certifications-tabs-panel {
    padding-top: 1.25rem;
}

[b-z9fhvzhcrf] .employee-certificates-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-z9fhvzhcrf] .employee-certificates-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-z9fhvzhcrf] .employee-certificates-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-z9fhvzhcrf] .employee-certificates-grid .mud-table-row:hover {
    background-color: #fafafa;
}

@media (max-width: 576px) {
    .certifications-page[b-z9fhvzhcrf] {
        padding: 1rem;
    }
}
/* /Components/Pages/Employees/CertificationTypesTab.razor.rz.scp.css */
.certification-types-tab[b-offsh0o478] {
    /* Tab content wrapper */
}

[b-offsh0o478] .certification-types-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-offsh0o478] .certification-types-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-offsh0o478] .certification-types-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-offsh0o478] .certification-types-grid .mud-table-row:hover {
    background-color: #fafafa;
}

.filters-wrapper[b-offsh0o478] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.filter-item[b-offsh0o478] {
    flex: 0 0 auto;
    width: 200px;
}

.filter-search[b-offsh0o478] {
    flex: 1 1 200px;
    min-width: 180px;
}

.filter-clear[b-offsh0o478] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.btn-submit:disabled[b-offsh0o478],
.btn-submit.disabled[b-offsh0o478] {
    background-color: #9ca3af !important;
    border-color: #9ca3af !important;
    color: #ffffff !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

.cert-type-name-wrap[b-offsh0o478] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.cert-name-validation-error[b-offsh0o478] {
    margin-top: 0.3rem;
    color: #b91c1c;
    font-size: 0.78rem;
    font-weight: 500;
}

.cert-type-name-wrap.has-multi-badge[b-offsh0o478] {
    padding-right: 88px;
}

.cert-type-name[b-offsh0o478] {
    min-width: 0;
}

[b-offsh0o478] .cert-type-multi-badge {
    position: absolute;
    top: 0;
    right: 0;
}

[b-offsh0o478] .filter-item .mud-input-control,
[b-offsh0o478] .filter-item .mud-select,
[b-offsh0o478] .filter-search .mud-input-control {
    width: 100%;
}

[b-offsh0o478] .filter-item .mud-select-input,
[b-offsh0o478] .filter-item .mud-input-slot,
[b-offsh0o478] .filter-search .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 576px) {
    .filter-item[b-offsh0o478],
    .filter-search[b-offsh0o478] {
        width: 100%;
        flex: 1 1 100%;
    }
}

@media (min-width: 577px) and (max-width: 992px) {
    .filter-item[b-offsh0o478] {
        width: calc(50% - 0.375rem);
    }

    .filter-search[b-offsh0o478] {
        width: 100%;
        flex: 1 1 100%;
    }
}
/* /Components/Pages/Employees/ClientFeedbackPages/ClientFeedbackPage.razor.rz.scp.css */
.cfp-page[b-wq4qhfbqsw] {
    min-height: 100vh;
    padding: var(--space-6, 24px);
    display: flex;
    flex-direction: column;
    gap: var(--space-6, 24px);
}

/* Tinted content area — kept out of .cfp-page so the tab bar sits on the page's
   default background above it, instead of looking boxed-in on the tint. */
.cfp-body[b-wq4qhfbqsw] {
    background: var(--talents-bg);
    border-radius: var(--radius-lg2, 14px);
    padding: var(--space-6, 24px);
    display: flex;
    flex-direction: column;
    gap: var(--space-6, 24px);
}

.cfp-title[b-wq4qhfbqsw] {
    font-size: var(--fs-title, 23px);
    font-weight: var(--fw-bold, 700);
    color: var(--talents-ink);
    margin: 0;
}

.cfp-stats-row[b-wq4qhfbqsw] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--space-4, 16px);
}

.cfp-stat-card[b-wq4qhfbqsw] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2, 14px);
    padding: var(--space-5, 20px);
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cfp-stat-label[b-wq4qhfbqsw] {
    font-size: var(--fs-label, 13px);
    color: var(--talents-muted);
}

.cfp-stat-value[b-wq4qhfbqsw] {
    font-size: var(--fs-hero, 30px);
    font-weight: var(--fw-bold, 700);
    color: var(--talents-ink);
    display: flex;
    align-items: center;
    gap: 4px;
}

.cfp-stat-unit[b-wq4qhfbqsw] {
    font-size: var(--fs-label, 13px);
    font-weight: var(--fw-medium, 500);
    color: var(--talents-muted);
}

.cfp-trend-up[b-wq4qhfbqsw] { color: var(--success-text); }
.cfp-trend-down[b-wq4qhfbqsw] { color: var(--error-text); }

.cfp-chart-card[b-wq4qhfbqsw] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2, 14px);
    padding: var(--space-5, 20px);
}

.cfp-chart-title[b-wq4qhfbqsw] {
    font-size: var(--fs-card, 16px);
    font-weight: var(--fw-semibold, 600);
    color: var(--talents-ink);
}

.cfp-chart-box[b-wq4qhfbqsw] {
    position: relative;
    width: 100%;
}

.cfp-chart-subtitle[b-wq4qhfbqsw] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
    margin-bottom: var(--space-4, 16px);
}

.cfp-table-card[b-wq4qhfbqsw] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2, 14px);
    padding: var(--space-5, 20px);
    overflow: visible;
}

.cfp-search-row[b-wq4qhfbqsw] {
    margin-bottom: var(--space-4, 16px);
}

.cfp-search-field[b-wq4qhfbqsw] {
    max-width: 340px;
}

.cfp-cell-sub[b-wq4qhfbqsw] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
}

.cfp-empty[b-wq4qhfbqsw] {
    text-align: center;
    padding: var(--space-8, 32px);
    color: var(--talents-muted);
}

.cfp-pagination[b-wq4qhfbqsw] {
    display: flex;
    justify-content: center;
    margin-top: var(--space-4, 16px);
}

/* ---------- Feedback table ---------- */
.cfp-table-wrap[b-wq4qhfbqsw] {
    overflow-x: auto;
    border: 1px solid var(--talents-border);
    border-radius: var(--radius-md, 10px);
}

.cfp-table[b-wq4qhfbqsw] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-label, 13px);
}

.cfp-table th[b-wq4qhfbqsw] {
    text-align: left;
    padding: 10px 14px;
    background: var(--talents-bg);
    color: var(--talents-label);
    font-weight: var(--fw-semibold, 600);
    font-size: var(--fs-caption, 12px);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--talents-border);
    white-space: nowrap;
}

.cfp-table td[b-wq4qhfbqsw] {
    padding: 10px 14px;
    border-bottom: 1px solid var(--talents-border);
    color: var(--talents-ink);
    vertical-align: top;
}

.cfp-table tr:last-child td[b-wq4qhfbqsw] {
    border-bottom: none;
}

.cfp-sort-btn[b-wq4qhfbqsw] {
    border: none;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
}

.cfp-sort-btn:hover[b-wq4qhfbqsw] { color: var(--talents-brand-strong); }
.cfp-sort-btn .bi[b-wq4qhfbqsw] { font-size: 11px; opacity: 0.75; }

.cfp-link[b-wq4qhfbqsw] {
    color: var(--talents-brand-strong);
    font-weight: var(--fw-medium, 500);
    text-decoration: none;
}

.cfp-link:hover[b-wq4qhfbqsw] { text-decoration: underline; }

.cfp-comment-cell[b-wq4qhfbqsw] {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    max-width: 260px;
}

.cfp-table-comment[b-wq4qhfbqsw] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cfp-comment-more[b-wq4qhfbqsw] {
    flex-shrink: 0;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--talents-brand-strong);
    font-weight: var(--fw-bold, 700);
    cursor: pointer;
    line-height: 1.4;
}

.cfp-comment-more:hover[b-wq4qhfbqsw] { text-decoration: underline; }

.cfp-status[b-wq4qhfbqsw] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: var(--radius-full, 999px);
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-semibold, 600);
    white-space: nowrap;
}

.cfp-status--pending[b-wq4qhfbqsw] { background: var(--info-bg); color: var(--talents-brand-strong); }
.cfp-status--reminded[b-wq4qhfbqsw] { background: var(--warning-bg); color: var(--warning-text); }
.cfp-status--responded[b-wq4qhfbqsw] { background: var(--success-bg); color: var(--success-text); }
.cfp-status--expired[b-wq4qhfbqsw] { background: var(--talents-pill-bg); color: var(--talents-muted); }

/* ---------- Comment modal ---------- */
.cfp-overlay[b-wq4qhfbqsw] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.32);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 56px 20px;
    z-index: 1100;
    overflow-y: auto;
}

.cfp-modal[b-wq4qhfbqsw] {
    background: white;
    border-radius: var(--radius-xl2, 20px);
    width: 100%;
    max-width: 420px;
    box-shadow: var(--shadow-md);
}

.cfp-modal-head[b-wq4qhfbqsw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--talents-border);
}

.cfp-modal-title[b-wq4qhfbqsw] { font-size: var(--fs-title, 23px); font-weight: var(--fw-bold, 700); color: var(--talents-ink); margin: 0; }

.cfp-modal-close[b-wq4qhfbqsw] {
    width: 34px; height: 34px;
    border-radius: var(--radius-md, 10px);
    border: none; background: transparent;
    color: var(--talents-muted); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.cfp-modal-close:hover[b-wq4qhfbqsw] { background: var(--talents-pill-bg); color: var(--talents-ink); }
.cfp-modal-close svg[b-wq4qhfbqsw] { width: 18px; height: 18px; }
.cfp-modal-body[b-wq4qhfbqsw] { padding: 20px 24px; }

.cfp-comment-full[b-wq4qhfbqsw] {
    white-space: pre-wrap;
    margin: 0;
    color: var(--talents-ink);
}
/* /Components/Pages/Employees/ClientFeedbackPages/PublicClientFeedbackShare.razor.rz.scp.css */
.pcf-page[b-gweqzqxwz2] {
    min-height: 100vh;
    padding: 48px 16px;
    background: var(--talents-border-card, #E2EBF0);
}

.pcf-state-screen[b-gweqzqxwz2] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
    width: 100%;
}

.pcf-result-card[b-gweqzqxwz2] {
    background: white;
    border-radius: var(--radius-xl2, 20px);
    box-shadow: var(--shadow-md);
    border: 1px solid var(--talents-border);
    padding: 40px 32px;
    max-width: 460px;
    width: 100%;
}

.pcf-loading[b-gweqzqxwz2], .pcf-result[b-gweqzqxwz2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
}

[b-gweqzqxwz2] .pcf-close-button {
    margin-top: 8px !important;
}

[b-gweqzqxwz2] .pcf-loading-title {
    color: var(--talents-label) !important;
}

[b-gweqzqxwz2] .pcf-result-icon {
    margin-bottom: 8px !important;
}

[b-gweqzqxwz2] .pcf-result-title {
    color: var(--talents-ink) !important;
    font-weight: var(--fw-bold, 700) !important;
}

[b-gweqzqxwz2] .pcf-result-body {
    color: var(--talents-label) !important;
}

[b-gweqzqxwz2] .pcf-footnote {
    color: var(--talents-placeholder) !important;
    margin-top: 12px !important;
}

.pcf-shell[b-gweqzqxwz2] {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
}

[b-gweqzqxwz2] .pcf-card {
    border-radius: var(--radius-xl2, 20px) !important;
    overflow: hidden !important;
    box-shadow: var(--shadow-md) !important;
    border: 1px solid var(--talents-border) !important;
}

[b-gweqzqxwz2] .pcf-card-header {
    background: linear-gradient(135deg, var(--talents-brand) 0%, var(--talents-brand-strong) 100%) !important;
    padding: 18px 24px !important;
}

.pcf-header-row[b-gweqzqxwz2] {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-gweqzqxwz2] .pcf-header-icon {
    color: white !important;
}

[b-gweqzqxwz2] .pcf-header-title {
    color: white !important;
    font-weight: var(--fw-semibold, 600) !important;
}

[b-gweqzqxwz2] .pcf-card-body {
    padding: 28px 24px 8px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

[b-gweqzqxwz2] .pcf-question {
    color: var(--talents-ink) !important;
    font-weight: var(--fw-semibold, 600) !important;
}

.pcf-question em[b-gweqzqxwz2] {
    font-style: italic;
    color: var(--talents-brand-strong);
}

.pcf-rating-scale[b-gweqzqxwz2] {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.pcf-face-option[b-gweqzqxwz2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 12px 4px;
    border: 2px solid var(--talents-border);
    border-radius: var(--radius-md, 10px);
    background: white;
    cursor: pointer;
    transition: border-color .15s ease-out, background .15s ease-out, transform .1s ease-out;
}

.pcf-face-option:hover[b-gweqzqxwz2] {
    border-color: var(--talents-brand);
    transform: translateY(-1px);
}

.pcf-face-option.selected[b-gweqzqxwz2] {
    border-color: var(--talents-brand-strong);
    background: var(--talents-brand-light);
    box-shadow: var(--focus-brand);
}

[b-gweqzqxwz2] .pcf-face-icon {
    color: var(--pcf-face-color, var(--talents-muted)) !important;
    font-size: 2rem !important;
}

.pcf-face-label[b-gweqzqxwz2] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
    text-align: center;
}

[b-gweqzqxwz2] .pcf-comment-label {
    color: var(--talents-label) !important;
    font-weight: var(--fw-semibold, 600) !important;
}

[b-gweqzqxwz2] .pcf-comment-input {
    margin-top: -8px !important;
}

[b-gweqzqxwz2] .pcf-card-actions {
    padding: 8px 24px 24px !important;
    justify-content: flex-end !important;
}

@media (max-width: 480px) {
    .pcf-rating-scale[b-gweqzqxwz2] {
        flex-wrap: wrap;
    }

    .pcf-face-option[b-gweqzqxwz2] {
        min-width: 60px;
    }
}
/* /Components/Pages/Employees/CvPages/PublicEmployeeCvUploadShare.razor.rz.scp.css */
/* ---------- Tokens ---------- */
.tlnts-page[b-ejcrqa5fil] {
    --brand-50:   #E8F8FF;
    --brand-100:  #C5EDFF;
    --brand-200:  #A8E3F7;
    --brand-400:  #4AC4FF;
    --brand-500:  #1AA3E8;
    --brand-600:  #0D80BB;
    --brand-700:  #0A5F8A;
    --ink:        #0D2D3F;

    --neutral-bg:            #F8FBFD;
    --neutral-surface:       #FAFCFD;
    --neutral-border:        #EDF2F5;
    --neutral-border-strong: #DDE8EE;
    --neutral-muted:         #7A9BAD;
    --neutral-placeholder:   #9BB8C5;
    --neutral-label:         #4A6878;
    --neutral-card-border:   #E2EBF0;
    --neutral-pill-bg:       #F2F5F7;

    --success:        #22C55E;
    --error:          #F43F5E;
    --error-bg:       #FFF1F2;
    --error-border:   #FECDD3;
    --error-text:     #E11D48;

    --radius-md:   8px;
    --radius-lg:   10px;
    --radius-lg2:  12px;
    --radius-xl:   14px;
    --radius-full: 9999px;

    --shadow-sm:   0 1px 4px rgba(13, 45, 63, 0.06);
    --shadow-md:   0 2px 16px rgba(13, 45, 63, 0.07);
    --focus-brand: 0 0 0 3px rgba(74, 196, 255, 0.18);
    --focus-error: 0 0 0 3px rgba(244, 63, 94, 0.10);

    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    --fw-regular:  400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;
    --fw-black:    800;

    --fs-overline: 10px;
}

/* ---------- Page shell ---------- */
.tlnts-page[b-ejcrqa5fil] {
    min-height: 100vh;
    width: 100%;
    background: var(--neutral-bg);
    color: var(--ink);
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
    box-sizing: border-box;
}

/* ---------- Frame ---------- */
.tlnts-frame[b-ejcrqa5fil] {
    position: relative;
    width: 100%;
    max-width: 1040px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    box-sizing: border-box;
}

.tlnts-toolbar[b-ejcrqa5fil] {
    width: 100%;
    display: flex;
    align-items: center;
    padding: 8px 14px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: 9999px;
    box-sizing: border-box;
}
.tlnts-toolbar-logo[b-ejcrqa5fil] {
    font-weight: var(--fw-black);
    font-size: 14px;
    color: var(--ink);
    letter-spacing: -0.01em;
    padding: 4px 6px;
}
.tlnts-toolbar-dot[b-ejcrqa5fil] { color: var(--brand-400); }

/* ---------- Split layout ---------- */
.tlnts-split[b-ejcrqa5fil] {
    width: 100%;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    display: grid;
    grid-template-columns: 42fr 58fr;
    min-height: 600px;
    box-shadow: var(--shadow-md);
    box-sizing: border-box;
}

.tlnts-left[b-ejcrqa5fil] {
    background: white;
    border-right: 1px solid var(--neutral-border);
    padding: 32px 30px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    box-sizing: border-box;
}
.tlnts-left-body[b-ejcrqa5fil] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 28px;
}

.tlnts-right[b-ejcrqa5fil] {
    background: var(--neutral-surface);
    padding: 36px 36px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    box-sizing: border-box;
}

/* ---------- Status pill ---------- */
.tlnts-pill[b-ejcrqa5fil] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: var(--fs-overline);
    font-weight: var(--fw-bold);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 5px 11px;
    border-radius: var(--radius-full);
    background: var(--neutral-pill-bg);
    color: var(--neutral-label);
    border: 1px solid transparent;
}
.tlnts-pill-dot[b-ejcrqa5fil] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--brand-400);
}
.tlnts-pill--success[b-ejcrqa5fil] {
    background: #F0FDF4;
    color: #15803D;
    border-color: #BBF7D0;
}
.tlnts-pill-dot--success[b-ejcrqa5fil] { background: var(--success); }
.tlnts-pill--error[b-ejcrqa5fil] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}
.tlnts-pill-dot--error[b-ejcrqa5fil] { background: var(--error); }

/* ---------- Hero ---------- */
.tlnts-hero[b-ejcrqa5fil] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tlnts-hero-title[b-ejcrqa5fil] {
    margin: 0;
    font-weight: var(--fw-black);
    font-size: 28px;
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
}
.tlnts-hero-accent[b-ejcrqa5fil] { color: var(--brand-400); }
.tlnts-hero-sub[b-ejcrqa5fil] {
    margin: 0;
    font-size: 13.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
    max-width: 360px;
}

/* ---------- Candidate strip ---------- */
.tlnts-candidate[b-ejcrqa5fil] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tlnts-candidate-label[b-ejcrqa5fil] {
    font-size: var(--fs-overline);
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.tlnts-candidate-row[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg2);
}
.tlnts-avatar[b-ejcrqa5fil] {
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    background: var(--ink);
    color: var(--brand-400);
    font-weight: var(--fw-bold);
    font-size: 12px;
    letter-spacing: 0.02em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.tlnts-candidate-name[b-ejcrqa5fil] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    line-height: 1.2;
}
.tlnts-candidate-role[b-ejcrqa5fil] {
    font-size: 12px;
    color: var(--neutral-muted);
    margin-top: 2px;
}

/* ---------- Right panel header ---------- */
.tlnts-refrow[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: var(--fw-bold);
    font-size: var(--fs-overline);
    color: var(--neutral-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.tlnts-refrow-sep[b-ejcrqa5fil] {
    width: 1px;
    height: 12px;
    background: var(--neutral-border-strong);
}

.tlnts-right-title[b-ejcrqa5fil] {
    margin: 0;
    font-weight: var(--fw-bold);
    font-size: 22px;
    letter-spacing: -0.005em;
    color: var(--ink);
    line-height: 1.2;
}
.tlnts-right-sub[b-ejcrqa5fil] {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--neutral-muted);
    line-height: 1.55;
}

/* ==========================================================================
   Dropzone
   ========================================================================== */
.tlnts-drop[b-ejcrqa5fil] {
    position: relative;
    border-radius: var(--radius-lg2);
    background: white;
    border: 1.5px dashed var(--neutral-border-strong);
    padding: 32px 24px;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    transition: border-color 150ms ease-out, background 150ms ease-out, box-shadow 150ms ease-out;
    cursor: pointer;
}

.tlnts-drop-icon[b-ejcrqa5fil] {
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    background: var(--neutral-bg);
    color: var(--neutral-label);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 6px;
    transition: background 150ms ease-out, color 150ms ease-out;
}

.tlnts-drop-title[b-ejcrqa5fil] {
    font-size: 15px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    letter-spacing: -0.005em;
}

.tlnts-drop-sub[b-ejcrqa5fil] {
    font-size: 13px;
    color: var(--neutral-muted);
    line-height: 1.5;
}
.tlnts-drop-link[b-ejcrqa5fil] {
    color: var(--ink);
    font-weight: var(--fw-semibold);
    border-bottom: 1px solid var(--neutral-border-strong);
    transition: border-color 150ms ease-out, color 150ms ease-out;
}

.tlnts-drop-meta[b-ejcrqa5fil] {
    margin-top: 6px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

.tlnts-drop--drag[b-ejcrqa5fil] {
    border-color: var(--brand-400);
    background: var(--brand-50);
    box-shadow: var(--focus-brand);
}
.tlnts-drop--drag .tlnts-drop-icon[b-ejcrqa5fil] {
    background: white;
    color: var(--brand-600);
}

.tlnts-drop--error[b-ejcrqa5fil] {
    border-color: var(--error);
    background: var(--error-bg);
    box-shadow: var(--focus-error);
}
.tlnts-drop--error .tlnts-drop-icon[b-ejcrqa5fil] {
    background: white;
    color: var(--error-text);
}
.tlnts-drop--error .tlnts-drop-title[b-ejcrqa5fil] {
    color: var(--error-text);
}
.tlnts-drop--error .tlnts-drop-sub[b-ejcrqa5fil] {
    color: var(--error-text);
    opacity: 0.85;
}
.tlnts-drop--error .tlnts-drop-meta[b-ejcrqa5fil] {
    color: var(--error-text);
    opacity: 0.7;
}

.tlnts-drop--selected[b-ejcrqa5fil] {
    border: 1.5px solid var(--neutral-border-strong);
    background: white;
    padding: 16px;
    min-height: 0;
    cursor: default;
}

.tlnts-file[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}
.tlnts-file-icon[b-ejcrqa5fil] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-lg);
    background: var(--ink);
    color: var(--brand-400);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.tlnts-file-icon--sm[b-ejcrqa5fil] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
}
.tlnts-file-meta[b-ejcrqa5fil] {
    flex: 1;
    min-width: 0;
}
.tlnts-file-name[b-ejcrqa5fil] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}
.tlnts-file-sub[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 3px;
    font-size: 12px;
    color: var(--neutral-muted);
}
.tlnts-file-sep[b-ejcrqa5fil] { color: var(--neutral-border-strong); }
.tlnts-file-ok[b-ejcrqa5fil] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #15803D;
    font-weight: var(--fw-semibold);
}
.tlnts-file-ok-dot[b-ejcrqa5fil] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--success);
}
.tlnts-file-remove[b-ejcrqa5fil] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: transparent;
    border: 1px solid var(--neutral-border-strong);
    color: var(--neutral-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out;
}
.tlnts-file-remove:hover[b-ejcrqa5fil] {
    background: var(--neutral-pill-bg);
    color: var(--ink);
}
.tlnts-file-remove:focus-visible[b-ejcrqa5fil] {
    outline: none;
    box-shadow: var(--focus-brand);
}

/* ==========================================================================
   Assurance row
   ========================================================================== */
.tlnts-assurance[b-ejcrqa5fil] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background: white;
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg);
    color: var(--brand-600);
}
.tlnts-assurance-text[b-ejcrqa5fil] {
    font-size: 12.5px;
    color: var(--neutral-muted);
    line-height: 1.5;
}
.tlnts-assurance-text b[b-ejcrqa5fil] {
    color: var(--ink);
    font-weight: var(--fw-semibold);
}

/* ==========================================================================
   CTAs
   ========================================================================== */
.tlnts-cta[b-ejcrqa5fil] {
    height: 48px;
    padding: 0 18px;
    border-radius: var(--radius-lg);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out;
}
.tlnts-cta:disabled[b-ejcrqa5fil] {
    opacity: 0.45;
    cursor: not-allowed;
}
.tlnts-cta:focus-visible[b-ejcrqa5fil] {
    outline: none;
    box-shadow: var(--focus-brand);
}

.tlnts-cta-primary[b-ejcrqa5fil] {
    background: var(--ink);
    color: white;
    width: 100%;
}
.tlnts-cta-primary:not(:disabled):hover[b-ejcrqa5fil] { background: #1E4256; }
.tlnts-cta-primary:not(:disabled):active[b-ejcrqa5fil] { background: #07212F; }

.tlnts-cta-outline[b-ejcrqa5fil] {
    background: white;
    color: var(--ink);
    border-color: var(--neutral-border-strong);
}
.tlnts-cta-outline:hover[b-ejcrqa5fil] {
    background: var(--neutral-bg);
    border-color: var(--brand-200);
}

.tlnts-spinner[b-ejcrqa5fil] {
    width: 14px;
    height: 14px;
    border-radius: 9999px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: white;
    animation: tlnts-spin-b-ejcrqa5fil 0.7s linear infinite;
}
@keyframes tlnts-spin-b-ejcrqa5fil { to { transform: rotate(360deg); } }

/* ==========================================================================
   Success state
   ========================================================================== */
.tlnts-success[b-ejcrqa5fil] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}
.tlnts-success-mark[b-ejcrqa5fil] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--ink);
    color: var(--brand-400);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.tlnts-success-mark[b-ejcrqa5fil]::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 9999px;
    border: 1.5px solid var(--brand-200);
    opacity: 0.6;
}
.tlnts-success-foot[b-ejcrqa5fil] {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--neutral-placeholder);
}
.tlnts-success-actions[b-ejcrqa5fil] {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}
.tlnts-success-actions .tlnts-cta-outline[b-ejcrqa5fil] {
    flex: 1;
}

.tlnts-receipt[b-ejcrqa5fil] {
    display: flex;
    flex-direction: column;
    background: white;
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg2);
    overflow: hidden;
}
.tlnts-receipt-row[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--neutral-border);
}
.tlnts-receipt-row:last-child[b-ejcrqa5fil] { border-bottom: 0; }
.tlnts-receipt-key[b-ejcrqa5fil] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.tlnts-receipt-val[b-ejcrqa5fil] {
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    font-variant-numeric: tabular-nums;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-left: 12px;
}

/* ==========================================================================
   Error state (request-level)
   ========================================================================== */
.tlnts-error-state[b-ejcrqa5fil] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}
.tlnts-error-mark[b-ejcrqa5fil] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--error-bg);
    color: var(--error-text);
    border: 1px solid var(--error-border);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ==========================================================================
   Confirmation modal
   ========================================================================== */
.tlnts-modal-scrim[b-ejcrqa5fil] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.55);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 24px;
    box-sizing: border-box;
    animation: tlnts-fade-b-ejcrqa5fil 160ms ease-out;
}
@keyframes tlnts-fade-b-ejcrqa5fil {
    from { opacity: 0; }
    to { opacity: 1; }
}

.tlnts-modal[b-ejcrqa5fil] {
    width: 100%;
    max-width: 440px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 28px;
    box-shadow: 0 24px 60px rgba(13, 45, 63, 0.25);
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-sizing: border-box;
    animation: tlnts-rise-b-ejcrqa5fil 200ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes tlnts-rise-b-ejcrqa5fil {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

.tlnts-modal-icon[b-ejcrqa5fil] {
    width: 40px;
    height: 40px;
    border-radius: 9999px;
    background: var(--brand-50);
    color: var(--brand-600);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.tlnts-modal-title[b-ejcrqa5fil] {
    margin: 0;
    font-weight: var(--fw-bold);
    font-size: 20px;
    letter-spacing: -0.005em;
    color: var(--ink);
}
.tlnts-modal-sub[b-ejcrqa5fil] {
    margin: 0;
    font-size: 13.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
}

.tlnts-modal-file[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg);
    margin-top: 4px;
}
.tlnts-modal-file-meta[b-ejcrqa5fil] {
    min-width: 0;
    flex: 1;
}
.tlnts-modal-file-name[b-ejcrqa5fil] {
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tlnts-modal-file-sub[b-ejcrqa5fil] {
    font-size: 11.5px;
    color: var(--neutral-muted);
    margin-top: 2px;
}

.tlnts-modal-error[b-ejcrqa5fil] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: var(--error-bg);
    border: 1px solid var(--error-border);
    border-radius: var(--radius-md);
    color: var(--error-text);
    font-size: 12.5px;
    font-weight: var(--fw-semibold);
}
.tlnts-modal-error svg[b-ejcrqa5fil] { flex-shrink: 0; }

.tlnts-modal-actions[b-ejcrqa5fil] {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}
.tlnts-modal-actions .tlnts-cta-outline[b-ejcrqa5fil] { flex: 1; }
.tlnts-modal-actions .tlnts-cta-primary[b-ejcrqa5fil] { flex: 1.4; width: auto; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1080px) {
    .tlnts-left[b-ejcrqa5fil] { padding: 28px 24px; }
    .tlnts-right[b-ejcrqa5fil] { padding: 28px 24px; }
    .tlnts-hero-title[b-ejcrqa5fil] { font-size: 26px; }
}

@media (max-width: 820px) {
    .tlnts-page[b-ejcrqa5fil] { padding: 16px; }
    .tlnts-split[b-ejcrqa5fil] {
        grid-template-columns: 1fr;
        min-height: 0;
    }
    .tlnts-left[b-ejcrqa5fil] {
        border-right: 0;
        border-bottom: 1px solid var(--neutral-border);
        padding: 24px 22px;
        gap: 18px;
    }
    .tlnts-left-body[b-ejcrqa5fil] { gap: 18px; }
    .tlnts-right[b-ejcrqa5fil] { padding: 24px 22px; gap: 16px; }
    .tlnts-hero-title[b-ejcrqa5fil] { font-size: 24px; }
    .tlnts-right-title[b-ejcrqa5fil] { font-size: 20px; }
}

@media (max-width: 480px) {
    .tlnts-frame[b-ejcrqa5fil] { gap: 14px; }
    .tlnts-toolbar[b-ejcrqa5fil] { padding: 6px 12px; }
    .tlnts-left[b-ejcrqa5fil] { padding: 20px 18px; gap: 16px; }
    .tlnts-right[b-ejcrqa5fil] { padding: 20px 18px; gap: 14px; }
    .tlnts-hero-title[b-ejcrqa5fil] { font-size: 22px; line-height: 1.2; }
    .tlnts-hero-sub[b-ejcrqa5fil] { font-size: 13px; }
    .tlnts-right-title[b-ejcrqa5fil] { font-size: 19px; }
    .tlnts-drop[b-ejcrqa5fil] { padding: 24px 16px; min-height: 160px; }
    .tlnts-drop-icon[b-ejcrqa5fil] { width: 40px; height: 40px; }
    .tlnts-drop-title[b-ejcrqa5fil] { font-size: 14px; }
    .tlnts-drop-sub[b-ejcrqa5fil] { font-size: 12.5px; }
    .tlnts-modal[b-ejcrqa5fil] { padding: 22px; }
    .tlnts-modal-title[b-ejcrqa5fil] { font-size: 18px; }
    .tlnts-modal-actions[b-ejcrqa5fil] { flex-direction: column-reverse; }
    .tlnts-modal-actions .tlnts-cta[b-ejcrqa5fil] { width: 100%; flex: none; }
    .tlnts-receipt-row[b-ejcrqa5fil] { padding: 10px 14px; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .tlnts-drop[b-ejcrqa5fil],
    .tlnts-cta[b-ejcrqa5fil],
    .tlnts-drop-link[b-ejcrqa5fil],
    .tlnts-file-remove[b-ejcrqa5fil] {
        transition: none;
    }
    .tlnts-modal[b-ejcrqa5fil],
    .tlnts-modal-scrim[b-ejcrqa5fil] {
        animation: none;
    }
    .tlnts-spinner[b-ejcrqa5fil] {
        animation: none;
    }
}

/* ==========================================================================
   PIN access view (PublicPinAccessView) — shared style for the cells.
   Only piped through when ViewState == Pin.
   ========================================================================== */
[b-ejcrqa5fil] .pin-cell {
    width: 56px;
    height: 64px;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #ffffff;
    color: #0d2d3f;
    transition: border-color 120ms ease, box-shadow 120ms ease;
    outline: none;
}
[b-ejcrqa5fil] .pin-cell:focus {
    border-color: #4AC4FF;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.2);
}
[b-ejcrqa5fil] .pin-cell--filled {
    background: #E8F8FF;
    border-color: #4AC4FF;
}
[b-ejcrqa5fil] .pin-cell--error {
    border-color: #F43F5E;
    background: #FFF1F2;
}
/* /Components/Pages/Employees/EmployeeAssessmentTab.razor.rz.scp.css */
.tab-no-access[b-b22famsvxt] {
    padding: 2rem;
    text-align: center;
}

.employee-assessments-page[b-b22famsvxt] {
    background: #f8fafc;
    padding: 32px;
}

.assessments-content[b-b22famsvxt] {
    width: 100%;
    max-width: 100%;
}

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

.content-title[b-b22famsvxt] {
    font-size: 24px;
    font-weight: 600;
    color: #1e293b;
}

.controls-bar[b-b22famsvxt] {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.search-field[b-b22famsvxt] {
    width: 300px;
}

.filter-field[b-b22famsvxt] {
    min-width: 160px;
}

.summary-grid[b-b22famsvxt] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 32px;
}

.summary-card[b-b22famsvxt] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    text-align: center;
}

.summary-label[b-b22famsvxt] {
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    margin-bottom: 8px;
}

.summary-value[b-b22famsvxt] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 4px;
    line-height: 1.2;
}

.summary-sub[b-b22famsvxt] {
    font-size: 13px;
    color: #94a3b8;
}

.badge-status[b-b22famsvxt] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-success[b-b22famsvxt] {
    background: #d1fae5;
    color: #059669;
}

.badge-planned[b-b22famsvxt] {
    background: #e9d5ff;
    color: #7c3aed;
}

.badge-warning[b-b22famsvxt] {
    background: #fed7aa;
    color: #ea580c;
}

.badge-danger[b-b22famsvxt] {
    background: #fee2e2;
    color: #dc2626;
}

.badge-info[b-b22famsvxt] {
    background: #dbeafe;
    color: #1d4ed8;
}

.badge-neutral[b-b22famsvxt] {
    background: #e2e8f0;
    color: #64748b;
}

.timeline-container[b-b22famsvxt] {
    position: relative;
    padding-left: 16px;
}

.timeline-line[b-b22famsvxt] {
    position: absolute;
    left: 23px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e2e8f0;
    z-index: 0;
}

.year-marker[b-b22famsvxt] {
    font-size: 16px;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    display: inline-block;
    background: #f8fafc;
    padding: 0 8px;
}

.timeline-item[b-b22famsvxt] {
    display: flex;
    gap: 24px;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
}

.timeline-date[b-b22famsvxt] {
    width: 60px;
    text-align: right;
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    padding-top: 18px;
    flex-shrink: 0;
}

.timeline-node[b-b22famsvxt] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #f8fafc;
    border: 2px solid #94a3b8;
    flex-shrink: 0;
    margin-top: 20px;
    box-shadow: 0 0 0 4px #f8fafc;
}

.timeline-node.completed[b-b22famsvxt] {
    background: #059669;
    border-color: #059669;
}

.timeline-node.planned[b-b22famsvxt] {
    border-color: #7c3aed;
    background: #f8fafc;
}

.timeline-node.warning[b-b22famsvxt] {
    border-color: #ea580c;
    background: #f8fafc;
}

.timeline-node.danger[b-b22famsvxt] {
    border-color: #dc2626;
    background: #dc2626;
}

.timeline-node.draft[b-b22famsvxt] {
    border-color: #94a3b8;
    background: #f8fafc;
}

.assessment-card[b-b22famsvxt] {
    flex: 1;
    background: #ffffff;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid #e2e8f0;
    border-left: 4px solid #94a3b8;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.assessment-card.completed[b-b22famsvxt] {
    border-left-color: #059669;
}

.assessment-card.planned[b-b22famsvxt] {
    border-left-color: #7c3aed;
}

.assessment-card.warning[b-b22famsvxt] {
    border-left-color: #ea580c;
}

.assessment-card.cancelled[b-b22famsvxt] {
    border-left-color: #dc2626;
}

.card-content h3[b-b22famsvxt] {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.status-text[b-b22famsvxt] {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #94a3b8;
}

.status-text.success[b-b22famsvxt] {
    color: #059669;
}

.status-text.planned[b-b22famsvxt] {
    color: #7c3aed;
}

.status-text.warning[b-b22famsvxt] {
    color: #ea580c;
}

.status-text.danger[b-b22famsvxt] {
    color: #dc2626;
}

.status-text.neutral[b-b22famsvxt] {
    color: #94a3b8;
}

.card-details[b-b22famsvxt] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 14px;
    color: #64748b;
}

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

.btn-outline[b-b22famsvxt] {
    background: transparent;
    border: 1px solid #e2e8f0;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #1e293b;
    cursor: pointer;
    transition: background 0.1s;
}

.btn-outline:hover[b-b22famsvxt] {
    background: #f8fafc;
    border-color: #94a3b8;
}

.load-more[b-b22famsvxt] {
    display: block;
    width: 100%;
    text-align: center;
    padding: 16px;
    color: #64748b;
    font-weight: 500;
    font-size: 14px;
    cursor: pointer;
    border-top: 1px solid #e2e8f0;
    margin-top: 24px;
}

.load-more:hover[b-b22famsvxt] {
    color: #2e75b6;
}

[b-b22famsvxt] .assessments-empty-state-card {
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 12px;
    min-height: 400px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 24px;
    text-align: center;
}

[b-b22famsvxt] .assessments-empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
}

[b-b22famsvxt] .assessments-empty-heading {
    font-weight: 600;
    margin-bottom: 8px;
}

[b-b22famsvxt] .assessments-empty-description {
    color: rgba(0,0,0,0.6);
    max-width: 480px;
    margin-bottom: 24px;
}

.assessment-modal-backdrop[b-b22famsvxt] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    z-index: 1200;
}

.assessment-modal[b-b22famsvxt] {
    background: #ffffff;
    border-radius: 12px;
    width: min(720px, 96vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
}

.assessment-modal-header[b-b22famsvxt] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.assessment-modal-title[b-b22famsvxt] {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 4px;
}

.assessment-modal-subtitle[b-b22famsvxt] {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
}

.assessment-modal-close[b-b22famsvxt] {
    border: none;
    background: transparent;
    font-size: 18px;
    cursor: pointer;
    color: #64748b;
}

.assessment-modal-body[b-b22famsvxt] {
    padding: 24px;
    overflow: auto;
}

.assessment-modal-footer[b-b22famsvxt] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

.assessment-duration-input[b-b22famsvxt] {
    width: 120px;
}

@media (max-width: 1024px) {
    .summary-grid[b-b22famsvxt] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .employee-assessments-page[b-b22famsvxt] {
        padding: 16px;
    }

    .controls-bar[b-b22famsvxt] {
        flex-direction: column;
    }

    .search-field[b-b22famsvxt],
    .filter-field[b-b22famsvxt] {
        width: 100%;
    }

    .timeline-item[b-b22famsvxt] {
        flex-direction: column;
        gap: 8px;
        padding-left: 32px;
    }

    .timeline-date[b-b22famsvxt] {
        text-align: left;
        width: auto;
        padding-top: 0;
        font-size: 13px;
    }

    .timeline-node[b-b22famsvxt] {
        position: absolute;
        left: 0;
        top: 0;
        margin-top: 4px;
    }

    .timeline-line[b-b22famsvxt] {
        left: 7px;
    }

    .assessment-card[b-b22famsvxt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .card-actions[b-b22famsvxt] {
        width: 100%;
    }

    .btn-outline[b-b22famsvxt] {
        flex: 1;
        text-align: center;
    }
}
/* /Components/Pages/Employees/EmployeeCertificatesListTab.razor.rz.scp.css */
.certification-types-page[b-71ybkebat2] {
    padding: 1.5rem;
}

[b-71ybkebat2] .certification-types-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-71ybkebat2] .certification-types-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-71ybkebat2] .certification-types-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-71ybkebat2] .certification-types-grid .mud-table-row:hover,
[b-71ybkebat2] .employee-certificates-grid .mud-table-row:hover {
    background-color: #fafafa;
}

[b-71ybkebat2] .employee-certificates-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-71ybkebat2] .employee-certificates-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-71ybkebat2] .employee-certificates-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-71ybkebat2] .employee-certificates-table .mud-table-cell {
    padding: 12px 16px;
}

[b-71ybkebat2] .employee-certificates-table .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-71ybkebat2] .employee-certificates-list-tab .mud-table-container {
    overflow: visible !important;
}

[b-71ybkebat2] .employee-certificates-list-tab .mud-table-head,
[b-71ybkebat2] .employee-certificates-list-tab .mud-table-head tr,
[b-71ybkebat2] .employee-certificates-list-tab .mud-table-head .mud-table-cell,
[b-71ybkebat2] .employee-certificates-list-tab .employee-certificates-header-cell {
    overflow: visible !important;
}

[b-71ybkebat2] .employee-certificates-table .mud-table-container {
    overflow-x: auto !important;
    overflow-y: visible !important;
}

[b-71ybkebat2] .employee-certificates-table .mud-table-root {
    overflow: visible !important;
}

[b-71ybkebat2] .employee-certificates-table .column-header {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
}

[b-71ybkebat2] .employee-certificates-table .column-sort {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    user-select: none;
    flex: 1 1 auto;
    min-width: 0;
}

.filters-wrapper[b-71ybkebat2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.filter-item[b-71ybkebat2] {
    flex: 0 0 auto;
    width: 200px;
}

.filter-search[b-71ybkebat2] {
    flex: 1 1 200px;
    min-width: 180px;
}

.filter-clear[b-71ybkebat2] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.btn-submit:disabled[b-71ybkebat2],
.btn-submit.disabled[b-71ybkebat2] {
    background-color: #9ca3af !important;
    border-color: #9ca3af !important;
    color: #ffffff !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}

[b-71ybkebat2] .filter-item .mud-input-control,
[b-71ybkebat2] .filter-item .mud-select,
[b-71ybkebat2] .filter-search .mud-input-control {
    width: 100%;
}

[b-71ybkebat2] .filter-item .mud-select-input,
[b-71ybkebat2] .filter-item .mud-input-slot,
[b-71ybkebat2] .filter-search .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 576px) {
    .certification-types-page[b-71ybkebat2] {
        padding: 1rem;
    }

    .filter-item[b-71ybkebat2],
    .filter-search[b-71ybkebat2] {
        width: 100%;
        flex: 1 1 100%;
    }
}

@media (min-width: 577px) and (max-width: 992px) {
    .filter-item[b-71ybkebat2] {
        width: calc(50% - 0.375rem);
    }

    .filter-search[b-71ybkebat2] {
        width: 100%;
        flex: 1 1 100%;
    }
}
/* /Components/Pages/Employees/EmployeeCertificationsTab.razor.rz.scp.css */
.tab-no-access[b-sbw3lng02g] {
    padding: 2rem;
    text-align: center;
}

/* Empty State */
.certifications-empty-state[b-sbw3lng02g] {
    max-width: 600px;
    margin: 2rem auto;
    padding: 1rem;
}

.result-card-selected-passed[b-sbw3lng02g] {
    border-color: #10b981 !important;
    background: #ecfdf5 !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.18) !important;
}

.result-card-selected-failed[b-sbw3lng02g] {
    border-color: #ef4444 !important;
    background: #fef2f2 !important;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.18) !important;
}

.empty-state-card[b-sbw3lng02g] {
    background-color: #fafafa;
    border-radius: 12px;
    padding: 3rem 2rem;
}

.empty-state-icon[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    background-color: #f0f0f0;
    border-radius: 12px;
    margin-bottom: 1rem;
}

.empty-state-icon i[b-sbw3lng02g] {
    font-size: 2.5rem;
    color: #bdbdbd;
}

.empty-state-title[b-sbw3lng02g] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 0.5rem 0;
}

.empty-state-subtitle[b-sbw3lng02g] {
    font-size: 0.9375rem;
    color: #757575;
    margin: 0 0 1.5rem 0;
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
}

/* Add Certification Button */
.btn-add-certification[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background-color: #4f6bed;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-add-certification:hover[b-sbw3lng02g] {
    background-color: #3d5bd9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 107, 237, 0.3);
}

.btn-add-certification i[b-sbw3lng02g] {
    font-size: 1.125rem;
}

/* Certifications Container */
.certifications-container[b-sbw3lng02g] {
    max-width: none;
    width: 100%;
    margin: 0;
}

/* Card */
.cert-card[b-sbw3lng02g] {
    width: 100%;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 16px;
    transition: all 0.2s ease;
}

.cert-card:hover[b-sbw3lng02g] {
    border-color: #c0c0c0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Header */
.cert-card-header[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

/* Status pill (more rounded, on top) */
.cert-status-stack[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.cert-status-pill[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    padding: 0 12px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: 9999px;
}

.cert-linked-pill[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 10px;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: 9999px;
}

.linked-badge-linked[b-sbw3lng02g] {
    background-color: #d1fae5;
    color: #047857;
}

.linked-badge-unlinked[b-sbw3lng02g] {
    background-color: #e2e8f0;
    color: #475569;
}

/* Header actions (icons) */
.cert-header-actions[b-sbw3lng02g] {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.btn-cert-icon[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-cert-icon:hover[b-sbw3lng02g] {
    background: #f5f5f5;
    border-color: #c0c0c0;
}

/* Body */
.cert-card-body[b-sbw3lng02g] {
    min-width: 0;
}

/* Footer buttons row */
.cert-card-footer[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #f1f5f9;
}

.cert-footer-left[b-sbw3lng02g],
.cert-footer-right[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

[b-sbw3lng02g] .mud-popover {
    min-width: 260px;
}

[b-sbw3lng02g] .mud-list-item-text,
[b-sbw3lng02g] .mud-list-item-text > span {
    white-space: normal;
}

.btn-cert-primary[b-sbw3lng02g] {
    height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    border: none;
    background: #2e75b6;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.btn-cert-primary:hover[b-sbw3lng02g] {
    background: #1e5a8e;
}

.btn-cert-secondary[b-sbw3lng02g] {
    height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    border: none;
    background: transparent;
    color: #475569;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.btn-cert-secondary:hover[b-sbw3lng02g] {
    background: #f1f5f9;
    color: #475569;
}

.btn-linked-toggle[b-sbw3lng02g] {
    height: 36px;
    padding: 0 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    font-size: 0.8125rem;
    color: #334155;
}

.btn-linked-toggle:disabled[b-sbw3lng02g] {
    opacity: 0.65;
    cursor: not-allowed;
}

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

    .cert-footer-left[b-sbw3lng02g],
    .cert-footer-right[b-sbw3lng02g] {
        width: 100%;
        justify-content: flex-start;
    }

    .btn-cert-primary[b-sbw3lng02g],
    .btn-cert-secondary[b-sbw3lng02g] {
        width: 100%;
        justify-content: center;
    }
}


.certifications-header[b-sbw3lng02g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.certifications-title[b-sbw3lng02g] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

/* Filters */
.certifications-filters[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    background-color: #f5f5f5;
    border-radius: 8px;
}

.filter-group[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-label[b-sbw3lng02g] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #555555;
    margin: 0;
}

.filter-item[b-sbw3lng02g] {
    min-width: 280px;
}

[b-sbw3lng02g] .status-filter {
    width: 280px;
    max-width: 100%;
}

.filter-select[b-sbw3lng02g] {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    background-color: #ffffff;
    color: #1a1a1a;
    cursor: pointer;
    transition: all 0.2s ease;
}

.filter-select:hover[b-sbw3lng02g] {
    border-color: #c0c0c0;
}

.filter-select:focus[b-sbw3lng02g] {
    outline: none;
    border-color: #4f6bed;
    box-shadow: 0 0 0 3px rgba(79, 107, 237, 0.1);
}

.certifications-count[b-sbw3lng02g] {
    margin-left: auto;
    font-size: 0.875rem;
    color: #757575;
}

/* Certifications List */
.certifications-list[b-sbw3lng02g] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.certification-item[b-sbw3lng02g] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.certification-item:hover[b-sbw3lng02g] {
    border-color: #c0c0c0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Status Badge */
.cert-status-badge[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    height: 28px;
    padding: 0 0.75rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: 4px;
    flex-shrink: 0;
}

.cert-badge-planned[b-sbw3lng02g] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.cert-badge-exam-scheduled[b-sbw3lng02g] {
    background-color: #fff3e0;
    color: #f57c00;
}

.cert-badge-active[b-sbw3lng02g] {
    background-color: #e8f5e9;
    color: #388e3c;
}

.cert-badge-failed[b-sbw3lng02g] {
    background-color: #ffebee;
    color: #d32f2f;
}

.cert-badge-expired[b-sbw3lng02g] {
    background-color: #fce4ec;
    color: #c2185b;
}

.cert-badge-default[b-sbw3lng02g] {
    background-color: #f5f5f5;
    color: #757575;
}

/* Certification Details */
.cert-details[b-sbw3lng02g] {
    flex: 1;
    min-width: 0;
}

.cert-name[b-sbw3lng02g] {
    font-size: 1rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 0.25rem 0;
}

.cert-code[b-sbw3lng02g] {
    font-size: 0.8125rem;
    color: #757575;
    margin: 0 0 0.75rem 0;
}

/* Certification Info */
.cert-info[b-sbw3lng02g] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cert-info-item[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #555555;
}

.cert-info-item i[b-sbw3lng02g] {
    font-size: 1rem;
    color: #757575;
    flex-shrink: 0;
}

.exam-countdown[b-sbw3lng02g] {
    color: #f57c00;
    font-weight: 500;
}

.expiring-soon[b-sbw3lng02g] {
    color: #f57c00;
    font-weight: 500;
}

.expired-text[b-sbw3lng02g] {
    color: #d32f2f;
    font-weight: 500;
}

.action-needed[b-sbw3lng02g] {
    color: #c2185b;
    font-weight: 500;
}

/* Certification Actions */
.cert-actions[b-sbw3lng02g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.btn-cert-action[b-sbw3lng02g] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: #ffffff;
    color: #555555;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-cert-action:hover[b-sbw3lng02g] {
    background-color: #f5f5f5;
    border-color: #c0c0c0;
}

.btn-cert-action i[b-sbw3lng02g] {
    font-size: 1rem;
}

/* Responsive */
@media (max-width: 768px) {
    .certification-item[b-sbw3lng02g] {
        flex-wrap: wrap;
    }

    .cert-status-badge[b-sbw3lng02g] {
        order: 1;
    }

    .cert-details[b-sbw3lng02g] {
        order: 3;
        flex: 1 1 100%;
    }

    .cert-actions[b-sbw3lng02g] {
        order: 2;
        margin-left: auto;
    }

    .certifications-filters[b-sbw3lng02g] {
        flex-wrap: wrap;
    }

    .certifications-count[b-sbw3lng02g] {
        flex: 1 1 100%;
        margin-left: 0;
        margin-top: 0.5rem;
        text-align: left;
    }

    .certifications-header[b-sbw3lng02g] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .btn-add-certification[b-sbw3lng02g] {
        width: 100%;
        justify-content: center;
    }
}

/* Scenario Cards Styling */
.scenario-card[b-sbw3lng02g] {
    transition: all 0.2s ease;
}

.scenario-card:not(.selected)[b-sbw3lng02g] {
    border-color: #e2e8f0 !important;
    background: white !important;
}

.scenario-card:not(.selected):hover[b-sbw3lng02g] {
    border-color: #cbd5e1 !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.scenario-card.selected[b-sbw3lng02g] {
    border-color: #2e75b6 !important;
    background: #f0f9ff !important;
    box-shadow: 0 4px 12px rgba(46, 117, 182, 0.15);
}
/* /Components/Pages/Employees/EmployeeClientFeedbackTab.razor.rz.scp.css */
.cf-page[b-k00dzpe0k2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-6, 24px);
}

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

.cf-title[b-k00dzpe0k2] {
    font-size: var(--fs-section, 18px);
    font-weight: var(--fw-semibold, 600);
    color: var(--talents-ink);
    margin: 0;
}

.cf-section[b-k00dzpe0k2] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3, 12px);
}

.cf-section-label[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    gap: var(--space-2, 8px);
    font-size: var(--fs-label, 13px);
    font-weight: var(--fw-semibold, 600);
    color: var(--talents-label);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-left: 3px solid var(--talents-brand);
    padding-left: var(--space-2, 8px);
}

.cf-section-count[b-k00dzpe0k2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: var(--radius-full, 999px);
    background: var(--talents-pill-bg);
    color: var(--talents-muted);
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-semibold, 600);
}

.cf-section-head[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3, 12px);
    flex-wrap: wrap;
}

.cf-history-search[b-k00dzpe0k2] {
    max-width: 280px;
}

.cf-pagination[b-k00dzpe0k2] {
    display: flex;
    justify-content: center;
    margin-top: var(--space-3, 12px);
}

.cf-cards[b-k00dzpe0k2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: var(--space-3, 12px);
}

.cf-card[b-k00dzpe0k2] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3, 12px);
    padding: 14px 16px;
    background: var(--talents-surface);
    border: 1px solid var(--talents-border);
    border-radius: var(--radius-md, 10px);
    transition: border-color 0.15s, background 0.15s;
}

.cf-card:hover[b-k00dzpe0k2] {
    border-color: var(--talents-brand);
    background: var(--talents-brand-light);
}

.cf-card-avatar[b-k00dzpe0k2] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--talents-brand);
    color: var(--talents-ink);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: var(--fw-bold, 700);
    letter-spacing: 0.03em;
}

.cf-card-body[b-k00dzpe0k2] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.cf-card-name-row[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    gap: var(--space-2, 8px);
}

.cf-card-name[b-k00dzpe0k2] {
    font-size: var(--fs-body, 14px);
    font-weight: var(--fw-semibold, 600);
    color: var(--talents-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cf-card-role[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
}

.cf-card-email-row[b-k00dzpe0k2] {
    margin-top: 2px;
}

.cf-card-email[b-k00dzpe0k2] {
    font-size: var(--fs-label, 13px);
    color: var(--talents-brand-strong);
    text-decoration: none;
}

.cf-card-email:hover[b-k00dzpe0k2] {
    text-decoration: underline;
}

.cf-card-reminder[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
}

.cf-card-sending[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-medium, 500);
}

.cf-card-sending--paused[b-k00dzpe0k2] { color: #E11D48; }
.cf-card-sending--scheduled[b-k00dzpe0k2] { color: var(--talents-brand-strong); }

.cf-card-comment[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
    margin-top: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cf-card-actions[b-k00dzpe0k2] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    opacity: 0;
    transition: opacity 0.15s;
}

.cf-card:hover .cf-card-actions[b-k00dzpe0k2] {
    opacity: 1;
}

.cf-icon-btn[b-k00dzpe0k2] {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--talents-border-strong);
    border-radius: var(--radius-sm, 6px);
    background: white;
    color: var(--talents-muted);
    cursor: pointer;
}

.cf-icon-btn:hover[b-k00dzpe0k2] {
    background: var(--talents-pill-bg);
    color: var(--talents-ink);
}

.cf-icon-btn:disabled[b-k00dzpe0k2] {
    opacity: .55;
    cursor: not-allowed;
}

.cf-spin[b-k00dzpe0k2] {
    animation: cf-spin-b-k00dzpe0k2 0.8s linear infinite;
}

@keyframes cf-spin-b-k00dzpe0k2 {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.cf-icon-btn--danger:hover[b-k00dzpe0k2] {
    color: #E11D48;
    border-color: #E11D48;
}

.cf-empty[b-k00dzpe0k2] {
    font-size: var(--fs-label, 13px);
    color: var(--talents-muted);
    padding: var(--space-3, 12px) 0;
}

.cf-chart-card[b-k00dzpe0k2] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border);
    border-radius: var(--radius-md, 10px);
    padding: var(--space-4, 16px);
}

.cf-chart-box[b-k00dzpe0k2] {
    position: relative;
    width: 100%;
}

/* ---------- History table ---------- */
.cf-table-wrap[b-k00dzpe0k2] {
    overflow-x: auto;
    border: 1px solid var(--talents-border);
    border-radius: var(--radius-md, 10px);
}

.cf-table[b-k00dzpe0k2] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--fs-label, 13px);
}

.cf-table th[b-k00dzpe0k2] {
    text-align: left;
    padding: 10px 14px;
    background: var(--talents-bg);
    color: var(--talents-label);
    font-weight: var(--fw-semibold, 600);
    font-size: var(--fs-caption, 12px);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--talents-border);
}

.cf-table td[b-k00dzpe0k2] {
    padding: 10px 14px;
    border-bottom: 1px solid var(--talents-border);
    color: var(--talents-ink);
    vertical-align: top;
}

.cf-table tr:last-child td[b-k00dzpe0k2] {
    border-bottom: none;
}

.cf-table-contact[b-k00dzpe0k2] {
    font-weight: var(--fw-medium, 500);
}

.cf-table-contact-email[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
}

.cf-comment-cell[b-k00dzpe0k2] {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    max-width: 280px;
}

.cf-table-comment[b-k00dzpe0k2] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.cf-comment-more[b-k00dzpe0k2] {
    flex-shrink: 0;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--talents-brand-strong);
    font-weight: var(--fw-bold, 700);
    cursor: pointer;
    line-height: 1.4;
}

.cf-comment-more:hover[b-k00dzpe0k2] { text-decoration: underline; }

.cf-comment-full[b-k00dzpe0k2] {
    white-space: pre-wrap;
    margin: 0;
}

.cf-status[b-k00dzpe0k2] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: var(--radius-full, 999px);
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-semibold, 600);
}

.cf-status--pending[b-k00dzpe0k2] { background: var(--info-bg); color: var(--talents-brand-strong); }
.cf-status--reminded[b-k00dzpe0k2] { background: var(--warning-bg); color: var(--warning-text); }
.cf-status--responded[b-k00dzpe0k2] { background: var(--success-bg); color: var(--success-text); }
.cf-status--expired[b-k00dzpe0k2] { background: var(--talents-pill-bg); color: var(--talents-muted); }

/* ---------- Buttons ---------- */
.cf-btn[b-k00dzpe0k2] {
    height: 38px;
    padding: 0 16px;
    border-radius: var(--radius-md, 10px);
    font-size: var(--fs-label, 13px);
    font-weight: var(--fw-semibold, 600);
    font-family: var(--font-sans);
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    border: 1.5px solid transparent;
    white-space: nowrap;
    transition: background .15s ease-out, border-color .15s ease-out, color .15s ease-out;
}

.cf-btn-primary[b-k00dzpe0k2] { background: var(--talents-ink); color: white; border: none; }
.cf-btn-primary:hover[b-k00dzpe0k2] { background: #1E4256; }
.cf-btn-outline[b-k00dzpe0k2] { background: white; color: var(--talents-ink); border-color: var(--talents-border-strong); }
.cf-btn-outline:hover[b-k00dzpe0k2] { border-color: var(--talents-brand); background: var(--talents-bg); }
.cf-btn-danger[b-k00dzpe0k2] { background: #E11D48; color: white; border-color: #E11D48; }
.cf-btn-danger:hover[b-k00dzpe0k2] { background: #BE123C; border-color: #BE123C; }

/* ---------- Modal ---------- */
.cf-overlay[b-k00dzpe0k2] {
    position: fixed;
    inset: 0;
    background: rgba(13, 45, 63, 0.32);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 56px 20px;
    z-index: 1100;
    overflow-y: auto;
}

.cf-modal[b-k00dzpe0k2] {
    background: white;
    border-radius: var(--radius-xl2, 20px);
    width: 100%;
    max-width: 680px;
    box-shadow: var(--shadow-md);
}

.cf-modal--sm[b-k00dzpe0k2] { max-width: 420px; }

.cf-modal-head[b-k00dzpe0k2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 22px 24px 16px;
    border-bottom: 1px solid var(--talents-border);
}

.cf-modal-title[b-k00dzpe0k2] { font-size: var(--fs-title, 23px); font-weight: var(--fw-bold, 700); color: var(--talents-ink); margin: 0; }

.cf-modal-close[b-k00dzpe0k2] {
    width: 34px; height: 34px;
    border-radius: var(--radius-md, 10px);
    border: none; background: transparent;
    color: var(--talents-muted); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}

.cf-modal-close:hover[b-k00dzpe0k2] { background: var(--talents-pill-bg); color: var(--talents-ink); }
.cf-modal-close svg[b-k00dzpe0k2] { width: 18px; height: 18px; }
.cf-modal-body[b-k00dzpe0k2] { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }
.cf-modal-foot[b-k00dzpe0k2] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 24px 20px;
    border-top: 1px solid var(--talents-border);
}

/* ---------- Form fields ---------- */
.cf-grid-2[b-k00dzpe0k2] { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cf-field[b-k00dzpe0k2] { display: flex; flex-direction: column; gap: 6px; }
.cf-field--switch[b-k00dzpe0k2] { justify-content: center; }
.cf-field-label[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-semibold, 600);
    font-family: var(--font-sans);
    color: var(--talents-label);
}
.cf-field-label .req[b-k00dzpe0k2] { color: #E11D48; margin-left: 2px; }
.cf-input[b-k00dzpe0k2] {
    height: 40px;
    padding: 0 12px;
    border: 1.5px solid var(--talents-border-strong);
    border-radius: var(--radius-md, 10px);
    background: white;
    font-size: var(--fs-body, 14px);
    font-family: var(--font-sans);
    color: var(--talents-ink);
    outline: none;
    transition: border-color .15s ease-out, box-shadow .15s ease-out;
    width: 100%;
}
.cf-input[b-k00dzpe0k2]::placeholder { color: var(--talents-placeholder); }
.cf-input:focus[b-k00dzpe0k2] { border-color: var(--talents-brand); box-shadow: var(--focus-brand); }
.cf-input.has-error[b-k00dzpe0k2] { border-color: #F43F5E; box-shadow: var(--focus-error); }
.cf-input:disabled[b-k00dzpe0k2] { opacity: .55; cursor: not-allowed; }
textarea.cf-input[b-k00dzpe0k2] { height: auto; padding: 10px 12px; resize: vertical; }
.cf-field-err[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-medium, 500);
    color: #E11D48;
}

.cf-field-counter[b-k00dzpe0k2] {
    font-size: var(--fs-caption, 12px);
    color: var(--talents-muted);
    text-align: right;
}

/* ---------- Reminder switch ---------- */
.cf-switch[b-k00dzpe0k2] {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    cursor: pointer;
    user-select: none;
}
.cf-switch input[b-k00dzpe0k2] { display: none; }
.cf-switch-track[b-k00dzpe0k2] {
    position: relative;
    width: 36px;
    height: 20px;
    border-radius: var(--radius-full, 999px);
    background: var(--talents-border-strong);
    transition: background .15s ease-out;
    flex-shrink: 0;
}
.cf-switch-thumb[b-k00dzpe0k2] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: white;
    transition: transform .15s ease-out;
    box-shadow: var(--shadow-sm);
}
.cf-switch input:checked + .cf-switch-track[b-k00dzpe0k2] {
    background: var(--talents-brand);
}
.cf-switch input:checked + .cf-switch-track .cf-switch-thumb[b-k00dzpe0k2] {
    transform: translateX(16px);
}
.cf-switch-text[b-k00dzpe0k2] {
    font-size: var(--fs-label, 13px);
    color: var(--talents-ink);
}

@media (max-width: 640px) {
    .cf-cards[b-k00dzpe0k2] { grid-template-columns: 1fr; }
    .cf-grid-2[b-k00dzpe0k2] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Employees/EmployeeCVsTab.razor.rz.scp.css */
.tab-no-access[b-gm3sg1cvt3] {
    padding: 2rem;
    text-align: center;
}

/* Empty State */
.cv-empty-state[b-gm3sg1cvt3] {
    max-width: 600px;
    margin: 2rem auto;
    padding: 1rem;
}

.empty-state-card[b-gm3sg1cvt3] {
    background-color: #fafafa;
    border-radius: 12px;
    padding: 3rem 2rem;
}

.empty-state-icon[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    background-color: #f0f0f0;
    border-radius: 12px;
    margin-bottom: 1rem;
}

.empty-state-icon i[b-gm3sg1cvt3] {
    font-size: 2.5rem;
    color: #bdbdbd;
}

.empty-state-title[b-gm3sg1cvt3] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0 0 0.5rem 0;
}

.empty-state-subtitle[b-gm3sg1cvt3] {
    font-size: 0.9375rem;
    color: #757575;
    margin: 0 0 1.5rem 0;
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
}

/* Upload CV Button */
.btn-upload-cv[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background-color: #4f6bed;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-upload-cv:hover[b-gm3sg1cvt3] {
    background-color: #3d5bd9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(79, 107, 237, 0.3);
}

.btn-upload-cv i[b-gm3sg1cvt3] {
    font-size: 1.125rem;
}

.cv-actions[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
}

.btn-request-cv[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 1.25rem;
    background-color: #ffffff;
    color: #4f6bed;
    border: 1px solid #c8d2ff;
    border-radius: 6px;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-request-cv:hover:not(:disabled)[b-gm3sg1cvt3] {
    background-color: #eef2ff;
    border-color: #4f6bed;
}

.btn-request-cv:disabled[b-gm3sg1cvt3] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* CVs Container */
.cvs-container[b-gm3sg1cvt3] {
    max-width: 900px;
    margin: 0 auto;
}

.cvs-header[b-gm3sg1cvt3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.cvs-title[b-gm3sg1cvt3] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

/* Pending request banner */
.cv-pending-banner[b-gm3sg1cvt3] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1.25rem;
    margin-bottom: 1rem;
    background-color: #fff8e6;
    border: 1px solid #ffe1a3;
    border-radius: 8px;
}

.cv-pending-icon[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background-color: #fff0cc;
    flex-shrink: 0;
}

.cv-pending-icon i[b-gm3sg1cvt3] {
    font-size: 1.125rem;
    color: #b7791f;
}

.cv-pending-details[b-gm3sg1cvt3] {
    flex: 1;
    min-width: 0;
}

.cv-pending-title[b-gm3sg1cvt3] {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #7a5b12;
    margin: 0 0 0.15rem 0;
}

.cv-pending-meta[b-gm3sg1cvt3] {
    font-size: 0.8125rem;
    color: #97791f;
    margin: 0;
}

.cv-pending-status[b-gm3sg1cvt3] {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #b7791f;
    background-color: #fff0cc;
    border-radius: 999px;
    padding: 0.25rem 0.75rem;
}

/* CV List */
.cv-list[b-gm3sg1cvt3] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cv-item[b-gm3sg1cvt3] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    transition: all 0.2s ease;
}

.cv-item:hover[b-gm3sg1cvt3] {
    border-color: #c0c0c0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* File Badge */
.cv-file-badge[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 28px;
    padding: 0 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-radius: 4px;
    flex-shrink: 0;
}

.cv-badge-pdf[b-gm3sg1cvt3] {
    background-color: #ffebee;
    color: #d32f2f;
}

.cv-badge-doc[b-gm3sg1cvt3] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.cv-badge-default[b-gm3sg1cvt3] {
    background-color: #f5f5f5;
    color: #757575;
}

/* CV Details */
.cv-details[b-gm3sg1cvt3] {
    flex: 1;
    min-width: 0;
}

.cv-filename[b-gm3sg1cvt3] {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #1a1a1a;
    margin: 0 0 0.25rem 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cv-meta[b-gm3sg1cvt3] {
    font-size: 0.8125rem;
    color: #757575;
    margin: 0;
}

.cv-download-meta[b-gm3sg1cvt3] {
    font-size: 0.75rem;
    color: #6a6a6a;
    margin: 0.2rem 0 0 0;
}

.cv-download-history-more[b-gm3sg1cvt3] {
    font-size: 0.7rem;
    color: #4f6bed;
    margin: 0.08rem 0 0 0;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
}

.cv-download-history-more:hover[b-gm3sg1cvt3] {
    color: #3d5bd9;
    text-decoration: underline;
}

.cv-download-history-more--inline[b-gm3sg1cvt3] {
    margin-left: 0.35rem;
    vertical-align: baseline;
}

.download-history-modal[b-gm3sg1cvt3] {
    width: min(560px, 92vw);
    max-height: 82vh;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 16px 32px rgba(15, 23, 42, 0.24);
    display: flex;
    flex-direction: column;
    padding: 1rem 1rem 0.75rem 1rem;
}

.download-history-modal__header[b-gm3sg1cvt3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.25rem;
}

.download-history-modal__header h3[b-gm3sg1cvt3] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a1a;
}

.download-history-modal__close[b-gm3sg1cvt3] {
    border: none;
    background: transparent;
    color: #7a7a7a;
    padding: 0.25rem;
    border-radius: 6px;
    cursor: pointer;
}

.download-history-modal__close:hover[b-gm3sg1cvt3] {
    background: #f4f6fb;
    color: #1f2937;
}

.download-history-modal__file[b-gm3sg1cvt3] {
    font-size: 0.8rem;
    color: #667085;
    margin: 0 0 0.75rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-history-modal__list[b-gm3sg1cvt3] {
    border-top: 1px solid #eaecf0;
    margin-top: 0.1rem;
    padding-top: 0.45rem;
    overflow: auto;
}

.download-history-item[b-gm3sg1cvt3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.125rem;
    border-bottom: 1px solid #f2f4f7;
}

.download-history-item__date[b-gm3sg1cvt3] {
    font-size: 0.82rem;
    color: #344054;
}

.download-history-item__user[b-gm3sg1cvt3] {
    font-size: 0.82rem;
    color: #667085;
    text-align: right;
}

.cv-filesize[b-gm3sg1cvt3] {
    font-size: 0.75rem;
    color: #9e9e9e;
    margin: 0.25rem 0 0 0;
}

/* Download Button */
.btn-download[b-gm3sg1cvt3] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background-color: #ffffff;
    color: #555555;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.btn-download:hover:not(:disabled)[b-gm3sg1cvt3] {
    background-color: #f5f5f5;
    border-color: #c0c0c0;
}

.btn-download:disabled[b-gm3sg1cvt3] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-download.downloading[b-gm3sg1cvt3] {
    background-color: #f5f5f5;
    border-color: #e0e0e0;
}

.btn-download i[b-gm3sg1cvt3] {
    font-size: 1rem;
    color: #4f6bed;
}

.btn-download .spinner-border-sm[b-gm3sg1cvt3] {
    border-color: #4f6bed;
    border-right-color: transparent;
}

/* Upload Zone */
.upload-zone[b-gm3sg1cvt3] {
    transition: all 0.3s ease;
    background-color: #ffffff;
}

.upload-zone:hover[b-gm3sg1cvt3] {
    border-color: #4f6bed !important;
    background-color: #f5f9ff !important;
}

.upload-zone.drag-over[b-gm3sg1cvt3] {
    border-color: #4f6bed !important;
    background-color: #e3f2fd !important;
}

/* PDF Preview Modal */
.dialog-overlay[b-gm3sg1cvt3] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    animation: fadeIn-b-gm3sg1cvt3 0.2s ease-in-out;
}

@keyframes fadeIn-b-gm3sg1cvt3 {
    from { opacity: 0; }
    to { opacity: 1; }
}

.preview-layout[b-gm3sg1cvt3] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    animation: slideIn-b-gm3sg1cvt3 0.3s ease-out;
}

@keyframes slideIn-b-gm3sg1cvt3 {
    from { transform: translateY(-40px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.pdf-preview-area[b-gm3sg1cvt3] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-gm3sg1cvt3] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-gm3sg1cvt3] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}

/* Responsive */
@media (max-width: 600px) {
    .cv-item[b-gm3sg1cvt3] {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    
    .cv-details[b-gm3sg1cvt3] {
        flex: 1 1 calc(100% - 60px);
        order: 2;
    }
    
    .cv-file-badge[b-gm3sg1cvt3] {
        order: 1;
    }
    
    .btn-download[b-gm3sg1cvt3] {
        order: 3;
        width: 100%;
        justify-content: center;
    }
    
    .cvs-header[b-gm3sg1cvt3] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .btn-upload-cv[b-gm3sg1cvt3] {
        width: 100%;
        justify-content: center;
    }

    .cv-actions[b-gm3sg1cvt3] {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .btn-request-cv[b-gm3sg1cvt3] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/Employees/EmployeeDashboardPage.razor.rz.scp.css */
/* ==========================================================================
   Employee Dashboard — Talents visual language (ported from the approved design).
   ========================================================================== */
.employee-dashboard[b-cf0jkfr97d] {
    --ink: #0D2D3F;
    --neutral-bg: #F8FBFD;
    --neutral-border: #EDF2F5;
    --neutral-border-strong: #DDE8EE;
    --neutral-muted: #7A9BAD;
    --neutral-placeholder: #9BB8C5;
    --neutral-label: #4A6878;
    --neutral-card-border: #E2EBF0;
    --neutral-pill-bg: #F2F5F7;
    --brand-50: #E8F8FF;
    --brand-400: #4AC4FF;
    --brand-600: #0D80BB;
    --success-bg: #F0FDF4;
    --success-text: #15803D;
    --error-bg: #FFF1F2;
    --error-text: #E11D48;
    --radius-md: 8px;
    --radius-lg2: 12px;
    --radius-full: 9999px;

    max-width: 1280px;
    margin: 0 auto;
    padding: 28px 24px 64px;
    color: var(--ink);
    background: var(--neutral-bg);
    min-height: 100vh;
}

/* ---------- Page header ---------- */
.page-head[b-cf0jkfr97d] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
}

.page-title[b-cf0jkfr97d] {
    font-weight: 800;
    font-size: 28px;
    letter-spacing: -.01em;
    line-height: 1.15;
    margin: 0;
}

.page-title span[b-cf0jkfr97d] {
    color: var(--brand-400);
}

.page-sub[b-cf0jkfr97d] {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--neutral-muted);
}

.page-meta[b-cf0jkfr97d] {
    display: flex;
    align-items: center;
    gap: 18px;
}

.meta-block[b-cf0jkfr97d] {
    text-align: right;
}

.meta-k[b-cf0jkfr97d] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

.meta-v[b-cf0jkfr97d] {
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    margin-top: 3px;
}

/* ---------- Layer section header ---------- */
.layer[b-cf0jkfr97d] {
    margin-top: 36px;
}

.layer-head[b-cf0jkfr97d] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.layer-num[b-cf0jkfr97d] {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
    border-radius: var(--radius-md);
    background: var(--ink);
    color: var(--brand-400);
    font-weight: 700;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.layer-titles[b-cf0jkfr97d] {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.layer-title[b-cf0jkfr97d] {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.layer-desc[b-cf0jkfr97d] {
    font-size: 12px;
    color: var(--neutral-muted);
}

.layer-rule[b-cf0jkfr97d] {
    flex: 1;
    height: 1px;
    background: var(--neutral-border);
    margin-left: 4px;
}

/* ---------- Card shell ---------- */
.card[b-cf0jkfr97d] {
    background: #fff;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    padding: 18px 20px;
}

.card-head[b-cf0jkfr97d] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.card-title[b-cf0jkfr97d] {
    font-size: 15px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.3;
}

.pill[b-cf0jkfr97d] {
    font-size: 11px;
    font-weight: 600;
    color: var(--neutral-label);
    background: var(--neutral-pill-bg);
    padding: 3px 10px;
    border-radius: var(--radius-full);
    white-space: nowrap;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

/* ---------- Grids ---------- */
.grid-donuts[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 16px;
}

.grid-metrics[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 16px;
}

.grid-flow[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.grid-kpi[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.grid-balance[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.stack[b-cf0jkfr97d] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 16px;
}

/* ---------- Layer 1: doughnut card ---------- */
.donut-body[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: 152px 1fr;
    gap: 18px;
    align-items: center;
}

.donut-wrap[b-cf0jkfr97d] {
    position: relative;
    width: 152px;
    height: 152px;
}

/* Canvas must paint ABOVE the centered total so the Chart.js tooltip (drawn on
   the canvas) is never hidden behind the number. The total still shows through
   the doughnut's transparent center hole. */
.donut-wrap canvas[b-cf0jkfr97d] {
    position: relative;
    z-index: 2;
}

.donut-center[b-cf0jkfr97d] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.donut-total[b-cf0jkfr97d] {
    font-size: 24px;
    font-weight: 800;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -.02em;
}

.donut-total-lab[b-cf0jkfr97d] {
    font-size: 10px;
    font-weight: 600;
    color: var(--neutral-placeholder);
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-top: 3px;
}

.legend[b-cf0jkfr97d] {
    list-style: none;
    max-height: 152px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    padding: 0 6px 0 0;
    margin: 0;
    scrollbar-width: thin;
    scrollbar-color: var(--neutral-border-strong) transparent;
}

.legend li[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 9px;
    padding: 5px 0;
    border-bottom: 1px solid var(--neutral-border);
}

.legend li:last-child[b-cf0jkfr97d] {
    border-bottom: none;
}

.legend-dot[b-cf0jkfr97d] {
    width: 9px;
    height: 9px;
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

.legend-lab[b-cf0jkfr97d] {
    font-size: 13px;
    font-weight: 500;
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.legend-cnt[b-cf0jkfr97d] {
    font-size: 13px;
    font-weight: 600;
    color: var(--neutral-label);
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.legend-cnt small[b-cf0jkfr97d] {
    font-size: 11px;
    font-weight: 500;
    color: var(--neutral-placeholder);
    margin-left: 5px;
}

.legend[b-cf0jkfr97d]::-webkit-scrollbar {
    width: 6px;
}

.legend[b-cf0jkfr97d]::-webkit-scrollbar-thumb {
    background: var(--neutral-border-strong);
    border-radius: var(--radius-full);
}

.legend[b-cf0jkfr97d]::-webkit-scrollbar-track {
    background: transparent;
}

/* ---------- Layer 2: progress metric card ---------- */
.metric-card[b-cf0jkfr97d] {
    display: flex;
    flex-direction: column;
}

.metric-label[b-cf0jkfr97d] {
    font-size: 13px;
    font-weight: 500;
    color: var(--neutral-label);
    line-height: 1.35;
    min-height: 36px;
}

.metric-value[b-cf0jkfr97d] {
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
    margin-top: 10px;
}

.metric-value small[b-cf0jkfr97d] {
    font-size: 14px;
    font-weight: 500;
    color: var(--neutral-muted);
    letter-spacing: 0;
}

.progress-track[b-cf0jkfr97d] {
    height: 6px;
    background: var(--neutral-border);
    border-radius: var(--radius-full);
    overflow: hidden;
    margin-top: 14px;
}

.progress-fill[b-cf0jkfr97d] {
    height: 100%;
    border-radius: var(--radius-full);
}

.metric-count[b-cf0jkfr97d] {
    font-size: 12px;
    font-weight: 600;
    color: var(--neutral-muted);
    margin-top: 9px;
    font-variant-numeric: tabular-nums;
}

.metric-sub[b-cf0jkfr97d] {
    font-size: 11px;
    color: var(--neutral-placeholder);
    margin-top: 9px;
    line-height: 1.4;
}

/* ---------- Layer 3: workforce flow ---------- */
.kpi-big[b-cf0jkfr97d] {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
}

.kpi-big small[b-cf0jkfr97d] {
    font-size: 15px;
    font-weight: 500;
    color: var(--neutral-muted);
    letter-spacing: 0;
}

.badge[b-cf0jkfr97d] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: var(--radius-full);
    margin-top: 10px;
}

.badge-pos[b-cf0jkfr97d] {
    background: var(--success-bg);
    color: var(--success-text);
}

.badge-neg[b-cf0jkfr97d] {
    background: var(--error-bg);
    color: var(--error-text);
}

.badge-neu[b-cf0jkfr97d] {
    background: var(--brand-50);
    color: var(--brand-600);
}

.tenure-bands[b-cf0jkfr97d] {
    margin-top: 14px;
}

.band-row[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: 60px 1fr 34px;
    align-items: center;
    gap: 10px;
    margin-top: 9px;
}

.band-lab[b-cf0jkfr97d] {
    font-size: 12px;
    color: var(--neutral-label);
}

.band-track[b-cf0jkfr97d] {
    height: 6px;
    background: var(--neutral-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.band-fill[b-cf0jkfr97d] {
    height: 100%;
    border-radius: var(--radius-full);
    background: var(--brand-600);
}

.band-val[b-cf0jkfr97d] {
    font-size: 12px;
    color: var(--neutral-label);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* ---------- Layer 5: KPI cards ---------- */
.kpi-label[b-cf0jkfr97d] {
    font-size: 13px;
    font-weight: 500;
    color: var(--neutral-label);
    line-height: 1.35;
    min-height: 36px;
}

.kpi-value[b-cf0jkfr97d] {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
    margin-top: 8px;
}

.kpi-value small[b-cf0jkfr97d] {
    font-size: 15px;
    font-weight: 500;
    color: var(--neutral-muted);
    letter-spacing: 0;
}

.kpi-count[b-cf0jkfr97d] {
    font-size: 12px;
    font-weight: 600;
    color: var(--neutral-muted);
    margin-top: 6px;
}

.kpi-meter[b-cf0jkfr97d] {
    height: 5px;
    background: var(--neutral-border);
    border-radius: var(--radius-full);
    overflow: hidden;
    margin-top: 12px;
}

.kpi-meter-fill[b-cf0jkfr97d] {
    height: 100%;
    border-radius: var(--radius-full);
}

.kpi-sub[b-cf0jkfr97d] {
    font-size: 11px;
    color: var(--neutral-placeholder);
    margin-top: 9px;
    line-height: 1.4;
}

/* ---------- Layer 5: balance by type ---------- */
.balance-card[b-cf0jkfr97d] {
    display: flex;
    flex-direction: column;
    padding: 16px 18px;
}

.balance-head[b-cf0jkfr97d] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.balance-name[b-cf0jkfr97d] {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
}

.balance-bar[b-cf0jkfr97d] {
    display: flex;
    height: 10px;
    border-radius: var(--radius-full);
    overflow: hidden;
    background: var(--neutral-border);
    margin: 14px 0 12px;
}

.balance-seg[b-cf0jkfr97d] {
    height: 100%;
}

.balance-stats[b-cf0jkfr97d] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.balance-stat-k[b-cf0jkfr97d] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

.balance-stat-v[b-cf0jkfr97d] {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    margin-top: 3px;
    font-variant-numeric: tabular-nums;
}

.balance-legend[b-cf0jkfr97d] {
    display: flex;
    gap: 14px;
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid var(--neutral-border);
}

.balance-legend span[b-cf0jkfr97d] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--neutral-muted);
}

.balance-legend i[b-cf0jkfr97d] {
    width: 9px;
    height: 9px;
    border-radius: 2px;
    display: inline-block;
}

/* ---------- Charts ---------- */
.chart-cap[b-cf0jkfr97d] {
    font-size: 12px;
    color: var(--neutral-muted);
    margin-bottom: 14px;
}

.chart-box[b-cf0jkfr97d] {
    position: relative;
    width: 100%;
    height: 220px;
}

/* ---------- States ---------- */
.employee-state[b-cf0jkfr97d] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 200px;
    padding: 32px;
    background: #fff;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    text-align: center;
}

.employee-state-emoji[b-cf0jkfr97d] {
    font-size: 32px;
}

.employee-state-title[b-cf0jkfr97d] {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    margin: 4px 0 0;
}

.employee-state-desc[b-cf0jkfr97d] {
    font-size: 13px;
    color: var(--neutral-muted);
    margin: 0;
    max-width: 420px;
}

.employee-card-empty[b-cf0jkfr97d] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    font-size: 13px;
    color: var(--neutral-placeholder);
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .grid-flow[b-cf0jkfr97d] {
        grid-template-columns: 1fr;
    }

    .grid-kpi[b-cf0jkfr97d] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .grid-balance[b-cf0jkfr97d] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .donut-body[b-cf0jkfr97d] {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .donut-wrap[b-cf0jkfr97d] {
        margin: 0 auto;
    }

    .legend[b-cf0jkfr97d] {
        max-height: none;
        width: 100%;
    }

    .grid-kpi[b-cf0jkfr97d] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Employees/EmployeeDetailsPage.razor.rz.scp.css */
.employee-profile-page[b-kqkyfsxlg1] {
    width: 100%;
    margin: 0;
    padding: 0.25rem 1.5rem 1.5rem;
    background-color: #ffffff;
    font-family: var(--font-sans);
    color: var(--ink);
}

/* ---------- Back link (quiet ghost link above the card) ---------- */
.eh-back-link[b-kqkyfsxlg1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    margin: 0 0 6px -10px;
    border-radius: var(--radius-md);
    color: var(--neutral-muted);
    text-decoration: none;
    font-size: 12px;
    font-weight: var(--fw-medium);
    line-height: 1.4;
    cursor: pointer;
    transition: background-color 150ms ease-out, color 150ms ease-out;
}

.eh-back-link:hover[b-kqkyfsxlg1] {
    color: var(--ink);
    background-color: var(--neutral-pill-bg);
}

.eh-back-link i[b-kqkyfsxlg1] {
    font-size: 13px;
    line-height: 1;
}

/* ---------- Buttons (Talents flavor: ink primary, white outlined) ---------- */
.eh-btn[b-kqkyfsxlg1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: var(--fw-semibold);
    border: 1px solid var(--neutral-border-strong);
    background: white;
    color: var(--ink);
    cursor: pointer;
    transition: background 150ms ease-out, border-color 150ms ease-out;
    white-space: nowrap;
    text-decoration: none;
}

.eh-btn:hover[b-kqkyfsxlg1] {
    background: var(--neutral-bg);
}

.eh-btn-ghost[b-kqkyfsxlg1] {
    border-color: transparent;
    background: transparent;
}

.eh-btn-ghost:hover[b-kqkyfsxlg1] {
    background: var(--neutral-pill-bg);
}

.eh-btn-icon[b-kqkyfsxlg1] {
    width: 32px;
    padding: 0;
    justify-content: center;
}

.eh-btn-primary[b-kqkyfsxlg1] {
    background: var(--ink);
    border-color: var(--ink);
    color: white;
}

.eh-btn-primary:hover[b-kqkyfsxlg1] {
    background: #1a3e54;
    border-color: #1a3e54;
    color: white;
}

.eh-btn i[b-kqkyfsxlg1] {
    font-size: 14px;
    line-height: 1;
}

/* ---------- Card shell ---------- */
.eh-card[b-kqkyfsxlg1] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: var(--space-5) var(--space-6);
}

/* 2-column header grid: identity (left, grows) | actions (right, hugs content) */
.eh-header-grid[b-kqkyfsxlg1] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: flex-start;
}

.eh-header-grid > *[b-kqkyfsxlg1] {
    min-width: 0;
}

/* Right column: Prev/Next cards on top (horizontal row), View Candidate below */
.eh-actions[b-kqkyfsxlg1] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: stretch;
    min-width: 460px;
}

/* ---------- Identity column ---------- */
.eh-identity[b-kqkyfsxlg1] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.eh-identity-text[b-kqkyfsxlg1] {
    min-width: 0;
}

.eh-avatar[b-kqkyfsxlg1] {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-full);
    background: var(--ink);
    color: var(--brand-400);
    display: grid;
    place-items: center;
    font-weight: var(--fw-bold);
    font-size: 22px;
    letter-spacing: -0.01em;
    flex-shrink: 0;
    overflow: hidden;
}

.eh-avatar img[b-kqkyfsxlg1] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.eh-avatar.eh-avatar-lg[b-kqkyfsxlg1] {
    width: 72px;
    height: 72px;
    font-size: 24px;
}

.eh-avatar.eh-avatar-sm[b-kqkyfsxlg1] {
    width: 28px;
    height: 28px;
    font-size: 11px;
}

.eh-name-row[b-kqkyfsxlg1] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.eh-name[b-kqkyfsxlg1] {
    font-size: 26px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.012em;
    line-height: 1.15;
    margin: 0;
}

.eh-job[b-kqkyfsxlg1] {
    font-size: 14px;
    color: var(--neutral-muted);
    margin: 4px 0 0;
    font-weight: var(--fw-regular);
}

/* Stacked meta — one item per line */
.eh-meta-stack[b-kqkyfsxlg1] {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.eh-meta-line[b-kqkyfsxlg1] {
    font-size: 12px;
    color: var(--neutral-label);
    font-weight: var(--fw-semibold);
    line-height: 1.45;
}

.eh-meta-line .eh-meta-key[b-kqkyfsxlg1] {
    color: var(--neutral-placeholder);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 0.08em;
    margin-right: 4px;
}

.eh-meta-line .eh-meta-val[b-kqkyfsxlg1] {
    color: var(--ink);
    font-weight: var(--fw-semibold);
    font-size: 13px;
}

/* ---------- Pills ---------- */
.eh-pill[b-kqkyfsxlg1] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: var(--fw-semibold);
    border: 1px solid var(--neutral-border-strong);
    background: white;
    color: var(--neutral-label);
    letter-spacing: 0.01em;
    line-height: 1.4;
    white-space: nowrap;
}

.eh-pill .eh-dot[b-kqkyfsxlg1] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.eh-pill-active[b-kqkyfsxlg1] {
    background: var(--success-bg);
    border-color: var(--success-border);
    color: #166534;
}

.eh-pill-active .eh-dot[b-kqkyfsxlg1] {
    background: var(--success);
}

.eh-pill-terminated[b-kqkyfsxlg1] {
    background: var(--error-bg);
    border-color: var(--error-border);
    color: var(--error-text);
}

.eh-pill-fulltime[b-kqkyfsxlg1] {
    background: white;
    border-color: var(--neutral-border-strong);
    color: var(--neutral-label);
}

/* ---------- Prev/next nav cards (compact horizontal row in top-right) ---------- */
.eh-nav-previews[b-kqkyfsxlg1] {
    display: flex;
    flex-direction: row;
    gap: 8px;
    justify-content: flex-end;
    min-width: 0;
}

.eh-nav-card[b-kqkyfsxlg1] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg);
    background: white;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: var(--ink);
    flex: 1 1 0;
    min-width: 0;
    max-width: 240px;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}

/* View Candidate sits under the nav cards, matched to one nav card's width and aligned right */
.eh-view-candidate[b-kqkyfsxlg1] {
    justify-content: center;
    align-self: flex-end;
    width: 240px;
}

.eh-nav-card:hover[b-kqkyfsxlg1] {
    border-color: var(--brand-400);
    box-shadow: var(--shadow-sm);
}

.eh-nav-card:focus-visible[b-kqkyfsxlg1] {
    outline: none;
    box-shadow: var(--focus-brand);
    border-color: var(--brand-400);
}

.eh-nav-card .eh-nav-chev[b-kqkyfsxlg1] {
    width: 16px;
    height: 16px;
    color: var(--neutral-placeholder);
    flex-shrink: 0;
    font-size: 16px;
    line-height: 1;
}

.eh-nav-card .eh-nav-text[b-kqkyfsxlg1] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 0;
    overflow: hidden;
}

.eh-nav-card .eh-nav-dir[b-kqkyfsxlg1] {
    display: block;
    max-width: 100%;
    font-size: 9px;
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eh-nav-card .eh-nav-name[b-kqkyfsxlg1] {
    display: block;
    max-width: 100%;
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    line-height: 1.3;
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eh-nav-card .eh-nav-job[b-kqkyfsxlg1] {
    display: block;
    max-width: 100%;
    font-size: 11px;
    color: var(--neutral-muted);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.eh-nav-card-next[b-kqkyfsxlg1] {
    flex-direction: row-reverse;
}

.eh-nav-card-next .eh-nav-text[b-kqkyfsxlg1] {
    align-items: flex-end;
    text-align: right;
}

/* Tabs + Content Layout */
.tabs-layout[b-kqkyfsxlg1] {
    display: flex;
    align-items: stretch;
    gap: 1.5rem;
    min-height: calc(100vh - 250px);
}

/* Tabs Container — vertical sidebar */
.tabs-container[b-kqkyfsxlg1] {
    flex-shrink: 0;
    width: 220px;
    border-right: 1px solid #e0e0e0;
    background-color: #ffffff;
}

.custom-tabs[b-kqkyfsxlg1] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tab-item[b-kqkyfsxlg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: transparent;
    border: none;
    border-left: 2px solid transparent;
    color: #666666;
    font-size: 0.9375rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    position: relative;
    width: 100%;
    text-align: left;
    justify-content: flex-start;
}

.tab-item:hover[b-kqkyfsxlg1] {
    color: #333333;
    background-color: #f5f5f5;
}

.tab-item.active[b-kqkyfsxlg1] {
    color: #4f6bed;
    border-left-color: #4f6bed;
    background-color: #f5f8ff;
}

.tab-item i[b-kqkyfsxlg1] {
    font-size: 1rem;
}

.tab-item span[b-kqkyfsxlg1] {
    flex-grow: 1;
}

.tab-badge[b-kqkyfsxlg1] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 2rem !important;
    min-width: 2rem !important;
    max-width: 2rem !important;
    height: 1.25rem !important;
    padding: 0 !important;
    flex: 0 0 2rem !important;
    box-sizing: border-box !important;
    font-size: 0.75rem;
    font-weight: 600;
    background-color: #e3f2fd;
    color: #1976d2;
    border-radius: 10px;
}

/* Tab Content */
.tab-content-container[b-kqkyfsxlg1] {
    padding: 0;
    background-color: #ffffff;
    min-height: auto;
    height: auto;
    overflow: visible;
    flex: 1;
    min-width: 0;
}

[b-kqkyfsxlg1] .mud-grid {
    height: auto !important;
    max-height: none !important;
}

[b-kqkyfsxlg1] .mud-stack {
    height: auto !important;
    max-height: none !important;
}

/* Original Styles */
.breadcrumb[b-kqkyfsxlg1] {
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: 0.875rem;
}

.breadcrumb-item[b-kqkyfsxlg1] {
    display: flex;
    align-items: center;
}

.breadcrumb-item + .breadcrumb-item[b-kqkyfsxlg1]::before {
    content: "›";
    padding: 0 0.5rem;
    color: #757575;
    font-size: 1.2rem;
}

.breadcrumb-item a[b-kqkyfsxlg1] {
    color: #757575;
    text-decoration: none;
    transition: color 0.2s ease;
}

.breadcrumb-item a:hover[b-kqkyfsxlg1] {
    color: #1976d2;
}

.breadcrumb-item.active[b-kqkyfsxlg1] {
    color: #212121;
    font-weight: 500;
}

[b-kqkyfsxlg1] .mud-card {
    border-radius: 8px;
    transition: box-shadow 0.3s ease, transform 0.2s ease;
    border: 1px solid #e0e0e0;
    background-color: #ffffff;
}

[b-kqkyfsxlg1] .mud-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

[b-kqkyfsxlg1] .mud-card-content {
    padding: 1.5rem !important;
    background-color: #ffffff;
}

[b-kqkyfsxlg1] .mud-card-header {
    padding: 1.5rem 1.5rem 0 1.5rem !important;
    background-color: #ffffff;
}

.profile-card[b-kqkyfsxlg1]  .mud-card-content {
    padding: 2rem !important;
}

[b-kqkyfsxlg1] .mud-avatar {
    border: 3px solid #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

[b-kqkyfsxlg1] .mud-avatar img {
    object-fit: cover;
}

[b-kqkyfsxlg1] .mud-chip {
    font-weight: 500;
    font-size: 0.75rem;
    text-transform: capitalize;
    border-radius: 6px;
    padding: 0.25rem 0.75rem;
}

[b-kqkyfsxlg1] .mud-chip.mud-chip-color-success {
    background-color: #e8f5e9;
    color: #2e7d32;
}

[b-kqkyfsxlg1] .mud-chip.mud-chip-color-primary {
    background-color: #e3f2fd;
    color: #1976d2;
}

[b-kqkyfsxlg1] .mud-chip.mud-chip-color-warning {
    background-color: #fff3e0;
    color: #f57c00;
}

[b-kqkyfsxlg1] .mud-chip.mud-chip-color-error {
    background-color: #ffebee;
    color: #c62828;
}

.mud-card-content h6[b-kqkyfsxlg1] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: #1a1a1a;
}

.text-uppercase[b-kqkyfsxlg1] {
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
    font-size: 0.6875rem;
}

[b-kqkyfsxlg1] .mud-button {
    text-transform: none;
    font-weight: 500;
    border-radius: 6px;
    transition: all 0.2s ease;
}

[b-kqkyfsxlg1] .mud-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

[b-kqkyfsxlg1] .mud-button-outlined {
    border-width: 1.5px;
}

[b-kqkyfsxlg1] .mud-icon-button {
    transition: all 0.2s ease;
    border-radius: 6px;
}

[b-kqkyfsxlg1] .mud-icon-button:hover {
    transform: scale(1.05);
    background-color: rgba(0, 0, 0, 0.04);
}

.timeline-marker[b-kqkyfsxlg1] {
    position: relative;
    padding-top: 0px;
    flex-shrink: 0;
    display: flex;
    align-items: flex-start;
}

[b-kqkyfsxlg1] .mud-progress-linear {
    border-radius: 4px;
    height: 8px;
    background-color: #f5f5f5;
}

[b-kqkyfsxlg1] .mud-progress-linear-bar {
    border-radius: 4px;
    background: linear-gradient(
        90deg,
        #1976d2 0%,
        #1565c0 100%
    );
}

.d-flex.justify-content-between .mud-icon-button[b-kqkyfsxlg1] {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.d-flex.justify-content-between:hover .mud-icon-button[b-kqkyfsxlg1] {
    opacity: 1;
}

[b-kqkyfsxlg1] .mud-grid-item {
    padding: 0.75rem;
}

.border-top[b-kqkyfsxlg1] {
    border-top: 1px solid #e0e0e0 !important;
}

[b-kqkyfsxlg1] .mud-icon {
    transition: color 0.2s ease;
}

[b-kqkyfsxlg1] .mud-icon.mud-icon-size-small {
    font-size: 1.25rem;
}

[b-kqkyfsxlg1] .mud-menu {
    border-radius: 8px;
}

[b-kqkyfsxlg1] .mud-menu-item {
    transition: background-color 0.2s ease;
}

@media (max-width: 960px) {
    .employee-profile-page[b-kqkyfsxlg1] {
        padding: 1rem;
    }

    [b-kqkyfsxlg1] .mud-card-content {
        padding: 1.25rem !important;
    }

    .profile-card[b-kqkyfsxlg1]  .mud-card-content {
        padding: 1.5rem !important;
    }

    .eh-header-grid[b-kqkyfsxlg1] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .eh-actions[b-kqkyfsxlg1] {
        align-items: stretch;
        min-width: 0;
    }

    .eh-nav-previews[b-kqkyfsxlg1] {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

@media (max-width: 960px) {
    .tabs-layout[b-kqkyfsxlg1] {
        flex-direction: column;
        gap: 1rem;
        min-height: 0;
    }

    .tabs-container[b-kqkyfsxlg1] {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }

    .custom-tabs[b-kqkyfsxlg1] {
        flex-direction: row;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tab-item[b-kqkyfsxlg1] {
        width: auto;
        border-left: none;
        border-bottom: 2px solid transparent;
        padding: 1rem 1.25rem;
    }

    .tab-item.active[b-kqkyfsxlg1] {
        border-left-color: transparent;
        border-bottom-color: #4f6bed;
        background-color: transparent;
    }
}

@media (max-width: 600px) {
    .employee-profile-page[b-kqkyfsxlg1] {
        padding: 0.75rem;
    }

    [b-kqkyfsxlg1] .mud-card-content {
        padding: 1rem !important;
    }

    .profile-card[b-kqkyfsxlg1]  .mud-card-content {
        padding: 1.25rem !important;
    }

    .d-flex.gap-2[b-kqkyfsxlg1] {
        flex-direction: column;
        gap: 0.5rem !important;
    }

    [b-kqkyfsxlg1] .mud-button {
        width: 100%;
    }

    .eh-avatar.eh-avatar-lg[b-kqkyfsxlg1] {
        width: 60px;
        height: 60px;
        font-size: 20px;
    }

    .eh-name[b-kqkyfsxlg1] {
        font-size: 22px;
    }

    .eh-nav-card[b-kqkyfsxlg1] {
        min-width: 0;
        flex: 1 1 100%;
    }

    .tab-item[b-kqkyfsxlg1] {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
    }
}

@media print {
    .employee-profile-page[b-kqkyfsxlg1] {
        padding: 0;
        width: 100%;
    }

    [b-kqkyfsxlg1] .mud-button,
    [b-kqkyfsxlg1] .mud-icon-button,
    [b-kqkyfsxlg1] .mud-menu,
    .breadcrumb[b-kqkyfsxlg1],
    .tabs-container[b-kqkyfsxlg1] {
        display: none !important;
    }

    [b-kqkyfsxlg1] .mud-card {
        box-shadow: none !important;
        border: 1px solid #e0e0e0;
        page-break-inside: avoid;
        margin-bottom: 1rem;
    }

    [b-kqkyfsxlg1] .mud-chip {
        border: 1px solid currentColor;
    }

    .timeline-marker[b-kqkyfsxlg1]::after {
        background: #e0e0e0 !important;
    }
}

.mud-progress-circular[b-kqkyfsxlg1] {
    color: #1976d2;
}

.text-center.my-5[b-kqkyfsxlg1] {
    padding: 3rem 1rem;
}

.mud-card[b-kqkyfsxlg1] {
    cursor: default;
}

[b-kqkyfsxlg1] .mud-button:focus,
[b-kqkyfsxlg1] .mud-icon-button:focus {
    outline: 2px solid #1976d2;
    outline-offset: 2px;
}

*[b-kqkyfsxlg1] {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
/* /Components/Pages/Employees/EmployeeFeedbackTab.razor.rz.scp.css */
.tab-no-access[b-t6dm09p8xx] {
    padding: 2rem;
    text-align: center;
}

.feedback-page[b-t6dm09p8xx] {
    --brand-sky: #4AC4FF;
}

.btn-sky[b-t6dm09p8xx] {
    background-color: #4AC4FF;
    border-color: #4AC4FF;
    color: #fff !important;
    font-weight: 500;
}

.btn-sky:hover[b-t6dm09p8xx], .btn-sky:focus[b-t6dm09p8xx] {
    background-color: #36b5f2;
    border-color: #36b5f2;
    color: #fff !important;
}

.feedback-question-header[b-t6dm09p8xx] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

[b-t6dm09p8xx] .feedback-question-chip {
    text-transform: none !important;
    margin: 0;
}

[b-t6dm09p8xx] .feedback-question-chip .mud-chip-content {
    text-transform: none !important;
}

/* Top-level layout: top menu moved up, then filter, then two panels */
.feedback-tab-layout[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: calc(100svh - 100px);
}

.feedback-tab-top-menu[b-t6dm09p8xx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 1rem 0;
    margin-bottom: 0.5rem;
    flex-shrink: 0;
}

.feedback-tab-title[b-t6dm09p8xx] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #374151;
    margin: 0;
    line-height: 1.3;
}

.feedback-tab-actions[b-t6dm09p8xx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.feedback-shell[b-t6dm09p8xx] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.sessions-panel[b-t6dm09p8xx] {
    flex: 3 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.sessions-panel-section[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.sessions-panel-dropdown[b-t6dm09p8xx] {
    flex-shrink: 0;
    padding: 16px 16px 12px 16px;
    border-bottom: 1px solid #e0e0e0;
}

.sessions-panel-list[b-t6dm09p8xx] {
    padding: 16px;
}

/* Quick Feedback modal: drag-and-drop file zone (match Figma) */
.quick-feedback-upload-zone[b-t6dm09p8xx] {
    border-color: #e0e0e0 !important;
    background-color: #fafafa;
    cursor: pointer;
}

.quick-feedback-upload-zone.mud-border-primary[b-t6dm09p8xx] {
    border-color: var(--mud-palette-primary) !important;
    background-color: rgba(var(--mud-palette-primary-rgb), 0.04);
}

[b-t6dm09p8xx] .sessions-panel-dropdown .feedback-type-select,
[b-t6dm09p8xx] .sessions-panel-dropdown .mud-input-root {
    max-width: 100%;
}

[b-t6dm09p8xx] .sessions-panel-dropdown .mud-input-slot {
    font-size: 0.9375rem;
}

.responses-panel[b-t6dm09p8xx] {
    flex: 7 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 16px;
    align-self: flex-start;
    height: calc(100vh - 32px);
}

.sessions-panel .card-body[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
}

.responses-panel .card-body[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.responses-panel .card-body[b-t6dm09p8xx]::-webkit-scrollbar {
    width: 8px;
}

.responses-panel .card-body[b-t6dm09p8xx]::-webkit-scrollbar-track {
    background: #f8f9fa;
    border-radius: 4px;
}

.responses-panel .card-body[b-t6dm09p8xx]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.responses-panel .card-body[b-t6dm09p8xx]::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

.s-list[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.s-item[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    background: white;
    transition: all 0.2s ease;
}

.s-item:hover[b-t6dm09p8xx] {
    border-color: #b0b8c1;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .08);
}

.s-item.is-active[b-t6dm09p8xx] {
    background: var(--brand-sky);
    border-color: var(--brand-sky);
    box-shadow: 0 4px 12px rgba(74, 196, 255, 0.3);
}

.s-item.is-active .fw-bold[b-t6dm09p8xx],
.s-item.is-active .small[b-t6dm09p8xx] {
    color: white !important;
}

.s-item.is-active .bi-chat-quote-fill[b-t6dm09p8xx] {
    color: white !important;
}

.s-item.is-active .badge[b-t6dm09p8xx] {
    background-color: rgba(255, 255, 255, 0.25) !important;
    color: white !important;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.s-title[b-t6dm09p8xx] {
    font-weight: 600;
    font-size: 1rem;
}

.s-meta[b-t6dm09p8xx] {
    font-size: 0.875rem;
    color: #666;
}

.s-item.is-active .s-meta[b-t6dm09p8xx] {
    color: rgba(255, 255, 255, .85) !important;
}

.r-list[b-t6dm09p8xx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.r-item[b-t6dm09p8xx] {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 16px;
    background: #fff;
}

.r-header[b-t6dm09p8xx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e9ecef;
}

.r-answer[b-t6dm09p8xx] {
    margin-bottom: 12px;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 6px;
}

.r-answer:last-child[b-t6dm09p8xx] {
    margin-bottom: 0;
}

[b-t6dm09p8xx] .card-header {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #fff;
}

[b-t6dm09p8xx] .session-card,
[b-t6dm09p8xx] .session-card-active {
    transition: all 0.2s ease-in-out;
    overflow: hidden;
}

[b-t6dm09p8xx] .session-card:hover,
[b-t6dm09p8xx] .mud-paper.session-card:hover {
    border-color: #4AC4FF !important;
    box-shadow: 0 4px 12px rgba(74, 196, 255, 0.15) !important;
    transform: translateY(-2px);
}

[b-t6dm09p8xx] .session-card-active,
[b-t6dm09p8xx] .mud-paper.session-card-active {
    border-color: #4AC4FF !important;
    box-shadow: 0 4px 12px rgba(74, 196, 255, 0.15) !important;
    transform: translateY(-2px);
}

[b-t6dm09p8xx] .session-card-active:hover,
[b-t6dm09p8xx] .mud-paper.session-card-active:hover {
    border-color: #4AC4FF !important;
    box-shadow: 0 4px 12px rgba(74, 196, 255, 0.15) !important;
    transform: translateY(-2px);
}

/* Lightbox */
.lightbox-overlay[b-t6dm09p8xx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    cursor: zoom-out;
    animation: lightbox-fade-in-b-t6dm09p8xx 0.2s ease;
}

.lightbox-content[b-t6dm09p8xx] {
    position: relative;
    max-width: 95vw;
    max-height: 95vh;
    animation: lightbox-scale-in-b-t6dm09p8xx 0.25s ease;
}

.lightbox-img[b-t6dm09p8xx] {
    display: block;
    max-width: 90w;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.lightbox-close[b-t6dm09p8xx] {
    position: absolute;
    top: -48px;
    right: 0;
    background: rgba(255, 255, 255, 0.15);
    border: none;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    transition: background 0.2s;
}

.lightbox-close:hover[b-t6dm09p8xx] {
    background: rgba(255, 255, 255, 0.3);
}

@keyframes lightbox-fade-in-b-t6dm09p8xx {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes lightbox-scale-in-b-t6dm09p8xx {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* Attachment image preview */
.attachment-image-preview[b-t6dm09p8xx] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: #f8f9fa;
    display: block;
    max-width: fit-content;
    margin-bottom: 1rem;
}

.attachment-preview-img[b-t6dm09p8xx] {
    display: block;
    max-width: 100%;
    max-height: 320px;
    object-fit: contain;
}

@media (max-width: 990px) {
    .feedback-shell[b-t6dm09p8xx] {
        flex-direction: column;
    }
    .sessions-panel[b-t6dm09p8xx] {
        flex-basis: auto;
    }
    .responses-panel[b-t6dm09p8xx] {
        position: relative;
        top: auto;
        height: auto;
    }
}
/* /Components/Pages/Employees/EmployeeIntegrationsTab.razor.rz.scp.css */
.eh-integrations[b-4qmlp7zpum] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    max-width: 720px;
    font-family: var(--font-sans);
    color: var(--ink);
}

.eh-integration-card[b-4qmlp7zpum] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: var(--space-5) var(--space-6);
}

.eh-integration-head[b-4qmlp7zpum] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}

.eh-integration-title[b-4qmlp7zpum] {
    margin: 0;
    font-size: 16px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.005em;
}

.eh-integration-sub[b-4qmlp7zpum] {
    margin: 4px 0 0;
    font-size: 13px;
    color: var(--neutral-muted);
    max-width: 460px;
}

.eh-integration-meta[b-4qmlp7zpum] {
    display: flex;
    gap: var(--space-6);
    margin-top: var(--space-4);
    padding-top: var(--space-3);
    border-top: 1px solid var(--neutral-border);
    flex-wrap: wrap;
}

.eh-integration-meta > div[b-4qmlp7zpum] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.eh-integration-meta .eh-meta-key[b-4qmlp7zpum] {
    font-size: 10px;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--neutral-placeholder);
}

.eh-integration-meta .eh-meta-val[b-4qmlp7zpum] {
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
}

/* Button styling — local to this scoped component */
.eh-btn[b-4qmlp7zpum] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: var(--fw-semibold);
    border: 1px solid var(--neutral-border-strong);
    background: white;
    color: var(--ink);
    cursor: pointer;
    transition: background 150ms ease-out, border-color 150ms ease-out;
    white-space: nowrap;
}

.eh-btn:hover:not(:disabled)[b-4qmlp7zpum] {
    background: var(--neutral-bg);
}

.eh-btn-primary[b-4qmlp7zpum] {
    background: var(--ink);
    border-color: var(--ink);
    color: white;
}

.eh-btn-primary:hover:not(:disabled)[b-4qmlp7zpum] {
    background: #1a3e54;
    border-color: #1a3e54;
    color: white;
}

.eh-btn:disabled[b-4qmlp7zpum] {
    opacity: 0.65;
    cursor: not-allowed;
}

.eh-btn i[b-4qmlp7zpum] {
    font-size: 14px;
    line-height: 1;
}
/* /Components/Pages/Employees/EmployeeLearningPathsTab.razor.rz.scp.css */
:host[b-7v7x73un48] {
}

[b-7v7x73un48] .employee-learning-paths-tab {
  width: 100% !important;
}

[b-7v7x73un48] .lp-auto-001 {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  margin-bottom: 20px !important;
}

[b-7v7x73un48] .lp-auto-002 {
  font-weight: 600 !important;
}

[b-7v7x73un48] .lp-auto-003 {
  background: #ffffff !important;
  border: 1px solid color-mix(in srgb, #4AC4FF 12%, rgba(0, 0, 0, 0.12)) !important;
  border-radius: 14px !important;
  padding: 52px 42px !important;
  text-align: center !important;
}

[b-7v7x73un48] .lp-auto-004 {
  width: 84px !important;
  height: 84px !important;
  border-radius: 50% !important;
  background: rgba(74, 196, 255, 0.22) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 18px !important;
}

[b-7v7x73un48] .lp-auto-004-icon {
  color: #4ac4ff !important;
  font-size: 40px !important;
}

[b-7v7x73un48] .lp-auto-005 {
  margin: 0 0 12px !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

[b-7v7x73un48] .lp-auto-006 {
  color: rgba(0, 0, 0, 0.6) !important;
  max-width: 760px !important;
  margin: 0 auto 28px !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

[b-7v7x73un48] .lp-auto-007 {
  display: flex !important;
  gap: 28px !important;
  justify-content: center !important;
  margin-bottom: 32px !important;
  flex-wrap: wrap !important;
}

[b-7v7x73un48] .lp-auto-008 {
  flex: 0 0 230px !important;
  max-width: 230px !important;
  padding: 0 8px !important;
  text-align: center !important;
}

[b-7v7x73un48] .lp-auto-009 {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: #4ac4ff !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 10px !important;
  font-weight: 600 !important;
  font-size: 18px !important;
}

[b-7v7x73un48] .lp-auto-010 {
  margin: 0 0 6px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  line-height: 1.25 !important;
}

[b-7v7x73un48] .lp-auto-011 {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-7v7x73un48] .lp-list-filters-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 12px !important;
}

[b-7v7x73un48] .lp-list-search-box {
  min-width: 320px !important;
  flex: 0 1 420px !important;
}

[b-7v7x73un48] .lp-list-status-box {
  min-width: 220px !important;
  flex: 0 1 260px !important;
}

[b-7v7x73un48] .lp-list-input .mud-input-control {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

[b-7v7x73un48] .lp-list-input .mud-input-outlined {
  min-height: 44px !important;
  border-radius: 8px !important;
}

[b-7v7x73un48] .lp-list-clear-btn {
  min-height: 44px !important;
  font-weight: 600 !important;
}

[b-7v7x73un48] .lp-list-results-caption {
  margin-bottom: 12px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-7v7x73un48] .lp-list-empty {
  padding: 40px !important;
  text-align: center !important;
  border: 1px dashed rgba(0, 0, 0, 0.12) !important;
  border-radius: 8px !important;
}

[b-7v7x73un48] .lp-list-empty-caption {
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-7v7x73un48] .lp-list-table-shell {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  border-radius: 10px !important;
  overflow-x: auto !important;
}

[b-7v7x73un48] .lp-list-table .mud-table-container {
  overflow-x: auto !important;
}

[b-7v7x73un48] .lp-list-table .mud-table-container table {
  width: 100% !important;
  border-collapse: collapse !important;
  min-width: 980px !important;
}

[b-7v7x73un48] .lp-list-table thead th {
  padding: 0 24px !important;
  height: 72px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  text-align: left !important;
  background: color-mix(in srgb, #f5f5f5 65%, #ffffff) !important;
}

[b-7v7x73un48] .lp-list-table tbody td {
  padding: 0 24px !important;
  height: 78px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  font-size: 14px !important;
  color: rgba(0, 0, 0, 0.87) !important;
  vertical-align: middle !important;
}

[b-7v7x73un48] .lp-list-table tbody tr:last-child td {
  border-bottom: none !important;
}

[b-7v7x73un48] .lp-list-sort-header {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

[b-7v7x73un48] .lp-list-sort-header-active {
  color: rgba(0, 0, 0, 0.87) !important;
}

[b-7v7x73un48] .lp-list-title-link {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  text-align: left !important;
  color: rgba(0, 0, 0, 0.87) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

[b-7v7x73un48] .lp-list-title-link:hover {
  color: #4AC4FF !important;
}

[b-7v7x73un48] .lp-list-period-text {
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 15px !important;
  white-space: nowrap !important;
}

[b-7v7x73un48] .lp-list-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

[b-7v7x73un48] .lp-list-badge-draft {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-7v7x73un48] .lp-list-badge-active {
  background: rgba(30, 111, 255, 0.12) !important;
  color: #1e6fff !important;
}

[b-7v7x73un48] .lp-list-badge-completed {
  background: rgba(22, 163, 74, 0.12) !important;
  color: #16a34a !important;
}

[b-7v7x73un48] .lp-list-badge-expired {
  background: rgba(249, 115, 22, 0.12) !important;
  color: #f97316 !important;
}

[b-7v7x73un48] .lp-list-badge-cancelled {
  background: rgba(0, 0, 0, 0.04) !important;
  color: #f44336 !important;
}

[b-7v7x73un48] .lp-list-badge-opened {
  background: rgba(22, 163, 74, 0.12) !important;
  color: #16a34a !important;
}

[b-7v7x73un48] .lp-list-badge-not-opened {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-7v7x73un48] .lp-list-feedback-cell {
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 15px !important;
}

[b-7v7x73un48] .lp-list-feedback-score {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(0, 0, 0, 0.87) !important;
  font-weight: 500 !important;
}

[b-7v7x73un48] .lp-list-feedback-star {
  color: #f59e0b !important;
}

[b-7v7x73un48] .lp-list-actions-cell {
  text-align: center !important;
  white-space: nowrap !important;
}

[b-7v7x73un48] .lp-list-view-btn {
  font-weight: 600 !important;
  text-transform: none !important;
}


/* /Components/Pages/Employees/EmployeeNotesTab.razor.rz.scp.css */
.employee-notes-tab .editor-container[b-wp5vsae70j] {
    border-radius: 8px;
    overflow: hidden;
}

.employee-notes-tab[b-wp5vsae70j] (.notes-container) {
    border-radius: 10px !important;
}

.employee-notes-tab[b-wp5vsae70j] (.note-card) {
    border-radius: 8px !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
    background-color: #fff !important;
}

.employee-notes-tab .note-header[b-wp5vsae70j] {
    gap: 0.75rem;
}

.employee-notes-tab[b-wp5vsae70j] (.note-actions .mud-button-root) {
    width: 34px !important;
    height: 34px !important;
    padding: 4px !important;
}

.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] {
    line-height: 1.6;
    color: #1f2937;
}

.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (p) {
    margin: 0 0 0.5rem 0 !important;
}

.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (p:last-child) {
    margin-bottom: 0 !important;
}

.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (ul),
.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (ol) {
    margin: 0.5rem 0 0.75rem 1.25rem !important;
    padding: 0 !important;
}

.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (code) {
    background: rgba(0, 0, 0, 0.06) !important;
    padding: 0.05rem 0.35rem !important;
    border-radius: 4px !important;
}

.employee-notes-tab .note-meta[b-wp5vsae70j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #6b7280;
}

.employee-notes-tab .note-date[b-wp5vsae70j] {
    white-space: nowrap;
}

.employee-notes-tab .modal-backdrop-custom[b-wp5vsae70j] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    z-index: 2000 !important;
    padding: 1rem;
    overflow-y: auto;
}

.employee-notes-tab .note-modal[b-wp5vsae70j] {
    width: 100%;
    position: relative;
    z-index: 2001;
}

.employee-notes-tab .note-modal-lg[b-wp5vsae70j] {
    max-width: 900px;
    max-height: calc(100vh - 2rem);
}

.employee-notes-tab .note-modal-lg .note-modal-paper[b-wp5vsae70j] {
    max-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
}

.employee-notes-tab .note-modal-form[b-wp5vsae70j] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    gap: 0.5rem;
    flex: 1;
}

.employee-notes-tab .note-modal-content[b-wp5vsae70j] {
    overflow-y: auto;
    min-height: 0;
    padding-right: 0.25rem;
}

.employee-notes-tab .note-modal-actions[b-wp5vsae70j] {
    position: sticky;
    bottom: 0;
    background: #fff;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    z-index: 1;
}

.employee-notes-tab .note-modal-sm[b-wp5vsae70j] {
    max-width: 500px;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] {
    padding: 1rem;
    min-height: 240px;
    border: 1px solid rgba(0, 0, 0, 0.16);
    border-radius: 0.5rem;
    background: #f8fafc;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (p) {
    margin: 0 0 0.6rem 0 !important;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (p:last-child) {
    margin-bottom: 0 !important;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (h1),
.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (h1) {
    margin: 0 0 0.75rem !important;
    font-size: 1.75rem !important;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (h2),
.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (h2) {
    margin: 0 0 0.65rem !important;
    font-size: 1.4rem !important;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (h3),
.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (h3) {
    margin: 0 0 0.55rem !important;
    font-size: 1.15rem !important;
}

.employee-notes-tab .markdown-preview[b-wp5vsae70j] (blockquote),
.employee-notes-tab .notes-markdown-content[b-wp5vsae70j] (blockquote) {
    margin: 0.75rem 0 !important;
    padding: 0.25rem 0 0.25rem 0.85rem !important;
    border-left: 3px solid #94a3b8;
    color: #475569;
}

.employee-notes-tab .empty-state[b-wp5vsae70j] {
    color: #6c757d;
    padding: 1.5rem 1rem;
    background: #f8f9fa;
    border-radius: 0.5rem;
}
/* /Components/Pages/Employees/EmployeeOctoCoinsTab.razor.rz.scp.css */
.balance-actions[b-h658xkshpe] { display: flex; gap: 10px; }

.kudos-comment-cell[b-h658xkshpe] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.kudos-comment-cell > span[b-h658xkshpe] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.kudos-icon-btn[b-h658xkshpe] {
    width: 28px;
    height: 28px;
    border: 1px solid #DDE8EE;
    border-radius: 8px;
    background: #fff;
    color: #7A9BAD;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: 0 0 auto;
}

.kudos-icon-btn:hover[b-h658xkshpe] {
    background: #F8FBFD;
    color: #0D80BB;
    border-color: #A8E3F7;
}

/* ---------- Buttons ---------- */
.kudos-btn[b-h658xkshpe] {
    height: 38px;
    padding: 0 16px;
    border-radius: 10px;
    font-family: Inter, sans-serif;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: all 150ms ease-out;
    white-space: nowrap;
}

.kudos-btn:disabled[b-h658xkshpe] { opacity: 0.5; cursor: default; }

.kudos-btn-primary[b-h658xkshpe] { background: #0D2D3F; color: #fff; border: none; }
.kudos-btn-primary:hover:not(:disabled)[b-h658xkshpe] { background: #1E4256; }

.kudos-btn-outline[b-h658xkshpe] { background: #fff; color: #0D2D3F; border-color: #DDE8EE; }
.kudos-btn-outline:hover:not(:disabled)[b-h658xkshpe] { background: #F8FBFD; border-color: #A8E3F7; }

.kudos-btn-danger[b-h658xkshpe] { background: #E11D48; color: #fff; border: none; }
.kudos-btn-danger:hover:not(:disabled)[b-h658xkshpe] { background: #BE123C; }

/* ---------- Modal ---------- */
.kudos-modal-backdrop[b-h658xkshpe] {
    position: fixed;
    inset: 0;
    background: rgba(13,45,63,0.32);
    z-index: 1400;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 72px 20px 40px;
    overflow-y: auto;
}

.kudos-modal[b-h658xkshpe] {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #E2EBF0;
    box-shadow: 0 2px 16px rgba(13,45,63,0.07);
    width: 100%;
    max-width: 460px;
    font-family: Inter, sans-serif;
}

.kudos-modal-head[b-h658xkshpe] {
    padding: 22px 24px 18px;
    border-bottom: 1px solid #EDF2F5;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.kudos-modal-titles[b-h658xkshpe] { flex: 1; }
.kudos-modal-title[b-h658xkshpe] { font-weight: 700; font-size: 18px; color: #0D2D3F; line-height: 1.25; }
.kudos-modal-sub[b-h658xkshpe] { font-size: 13px; color: #7A9BAD; margin-top: 3px; }

.kudos-modal-close[b-h658xkshpe] { background: transparent; border: none; cursor: pointer; color: #9BB8C5; padding: 4px; font-size: 16px; }

.kudos-modal-body[b-h658xkshpe] { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }

.kudos-field[b-h658xkshpe] { display: flex; flex-direction: column; gap: 6px; }
.kudos-field > label[b-h658xkshpe] { font-weight: 600; font-size: 12px; color: #4A6878; }
.kudos-field-row[b-h658xkshpe] { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; }

.kudos-input[b-h658xkshpe] {
    height: 44px;
    border-radius: 8px;
    border: 1.5px solid #DDE8EE;
    padding: 0 14px;
    font-family: Inter, sans-serif;
    font-size: 14px;
    color: #0D2D3F;
    outline: none;
    box-sizing: border-box;
    background: #fff;
    width: 100%;
}

.kudos-input:focus[b-h658xkshpe] { border-color: #4AC4FF; box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.kudos-textarea[b-h658xkshpe] { height: auto; min-height: 82px; padding: 12px 14px; resize: vertical; line-height: 1.5; }

.kudos-error[b-h658xkshpe] { font-size: 12px; color: #E11D48; }

.kudos-balance-pill[b-h658xkshpe] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: #F8FBFD;
    border: 1px solid #EDF2F5;
    border-radius: 8px;
    font-size: 12.5px;
    color: #7A9BAD;
    font-weight: 500;
}
.kudos-balance-pill .bal[b-h658xkshpe] { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; color: #0D2D3F; }

.kudos-modal-note[b-h658xkshpe] { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #9BB8C5; }

.kudos-modal-foot[b-h658xkshpe] {
    padding: 16px 24px;
    border-top: 1px solid #EDF2F5;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
/* /Components/Pages/Employees/EmployeePdpTab.razor.rz.scp.css */
.employee-pdp-tab[b-w1w51jkadc] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    color: #0f172a;
}

.tab-no-access[b-w1w51jkadc] {
    padding: 2rem;
    text-align: center;
}

.pdp-tab-header[b-w1w51jkadc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.pdp-header-actions[b-w1w51jkadc] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.pdp-back-row[b-w1w51jkadc] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pdp-back-link[b-w1w51jkadc] {
    border: none;
    background: transparent;
    color: #334155;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    padding: 0;
}

.pdp-back-link:hover[b-w1w51jkadc] {
    text-decoration: underline;
}

.pdp-exclude-toggle[b-w1w51jkadc] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.pdp-exclude-toggle-label[b-w1w51jkadc] {
    font-size: 13px;
    font-weight: 500;
    color: #475569;
}

.pdp-exclude-switch[b-w1w51jkadc] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}

.pdp-exclude-switch.is-disabled[b-w1w51jkadc] {
    cursor: default;
    opacity: 0.6;
}

.pdp-exclude-switch input[type="checkbox"][b-w1w51jkadc] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pdp-exclude-switch-track[b-w1w51jkadc] {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    background-color: #cbd5e1;
    border-radius: 999px;
    transition: background-color 150ms ease;
    flex-shrink: 0;
}

.pdp-exclude-switch-thumb[b-w1w51jkadc] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background-color: #ffffff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    transition: transform 150ms ease;
}

.pdp-exclude-switch input[type="checkbox"]:checked + .pdp-exclude-switch-track[b-w1w51jkadc] {
    background-color: #4AC4FF;
}

.pdp-exclude-switch input[type="checkbox"]:checked + .pdp-exclude-switch-track .pdp-exclude-switch-thumb[b-w1w51jkadc] {
    transform: translateX(16px);
}



[b-w1w51jkadc] .pdp-title {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: #1e293b;
}

[b-w1w51jkadc] .pdp-create-btn.mud-button-root {
    height: 38px;
    border-radius: 8px;
    text-transform: none;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.pdp-loading[b-w1w51jkadc] {
    min-height: 260px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdp-loading-inline[b-w1w51jkadc] {
    min-height: 120px;
}

[b-w1w51jkadc] .pdp-empty-state {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 56px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
}

.pdp-empty-icon-wrap[b-w1w51jkadc] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
}

[b-w1w51jkadc] .pdp-empty-state h4 {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

[b-w1w51jkadc] .pdp-empty-state p {
    margin: 0;
    max-width: 640px;
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
}

.pdp-empty-features[b-w1w51jkadc] {
    width: 100%;
    max-width: 640px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    padding: 18px 20px;
    text-align: left;
}

.pdp-empty-features ul[b-w1w51jkadc] {
    margin: 0;
    padding-left: 20px;
    color: #475569;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5;
}

[b-w1w51jkadc] .pdp-empty-create-btn.mud-button-root {
    margin-top: 4px;
    height: 40px;
    border-radius: 8px;
    text-transform: none;
    font-weight: 600;
    padding: 0 20px;
}

.pdp-empty-steps[b-w1w51jkadc] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}

.pdp-empty-step-card[b-w1w51jkadc] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pdp-empty-step-number[b-w1w51jkadc] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #eef2ff;
    color: #2563eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
}

.pdp-empty-step-card h5[b-w1w51jkadc] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.3;
}

.pdp-empty-step-card p[b-w1w51jkadc] {
    margin: 0;
    color: #64748b;
    font-size: 14px;
    line-height: 1.5;
}

.pdp-filters[b-w1w51jkadc] {
    display: grid;
    align-items: center;
    gap: 12px;
    grid-template-columns: minmax(280px, 1fr) minmax(220px, 280px) auto;
    width: 100%;
}

.pdp-filter-actions[b-w1w51jkadc] {
    display: flex;
    justify-content: flex-end;
}

.pdp-count[b-w1w51jkadc] {
    color: #64748b;
    font-size: 13px;
    width: 100%;
}

.pdp-list[b-w1w51jkadc] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
}

[b-w1w51jkadc] .pdp-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.04);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pdp-card-header[b-w1w51jkadc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.pdp-card-meta[b-w1w51jkadc] {
    display: grid;
    gap: 6px;
    color: #475569;
    font-size: 13px;
}

.pdp-card-actions[b-w1w51jkadc] {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

[b-w1w51jkadc] .pdp-status-chip.mud-chip {
    font-weight: 600;
}

[b-w1w51jkadc] .pdp-card-btn-secondary.mud-button-root,
[b-w1w51jkadc] .pdp-card-btn-primary.mud-button-root {
    text-transform: none;
    font-weight: 600;
    border-radius: 8px;
}

.pdp-pagination[b-w1w51jkadc] {
    display: flex;
    justify-content: center;
    margin-top: 14px;
    width: 100%;
}

[b-w1w51jkadc] .pdp-empty-state-small {
    padding: 26px 20px;
}

.pdp-create-method-overlay[b-w1w51jkadc] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.44);
    backdrop-filter: blur(2px);
    z-index: 1500;
    display: grid;
    place-items: center;
    padding: 16px;
}

[b-w1w51jkadc] .pdp-create-method-modal {
    width: min(560px, calc(100vw - 32px));
    max-height: 90vh;
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
    padding: 0;
    display: flex;
    flex-direction: column;
}

[b-w1w51jkadc] .pdp-invite-confirm-modal {
    width: min(540px, calc(100vw - 32px));
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #ffffff;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
    padding: 0;
    display: flex;
    flex-direction: column;
}

.pdp-invite-confirm-header[b-w1w51jkadc] {
    padding: 20px 24px 8px;
}

.pdp-invite-confirm-title[b-w1w51jkadc] {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
    color: #111827;
}

.pdp-invite-confirm-subtitle[b-w1w51jkadc] {
    margin: 8px 0 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.pdp-create-method-header[b-w1w51jkadc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.pdp-create-method-title[b-w1w51jkadc] {
    margin: 0;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #111827;
}

.pdp-create-method-subtitle[b-w1w51jkadc] {
    margin: 6px 0 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.pdp-create-method-close[b-w1w51jkadc] {
    width: 32px;
    height: 32px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #ffffff;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
}

.pdp-create-method-close:hover[b-w1w51jkadc] {
    background: #f8fafc;
    color: #111827;
}

.pdp-ai-options[b-w1w51jkadc] {
    padding: 18px 24px 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    overflow: auto;
}

.pdp-ai-option[b-w1w51jkadc] {
    width: 100%;
    margin: 0;
    border: none;
    border-radius: 10px;
    background: transparent;
    padding: 2px 0;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start !important;
    gap: 12px;
    text-align: left !important;
    color: #0f172a;
    cursor: pointer;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.pdp-ai-option > div:last-child[b-w1w51jkadc] {
    text-align: left !important;
}

.pdp-ai-option.selected[b-w1w51jkadc] {
    background: transparent;
    box-shadow: none;
}

.pdp-ai-option.disabled[b-w1w51jkadc] {
    opacity: 0.55;
    cursor: not-allowed;
}

.pdp-ai-option-radio[b-w1w51jkadc] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #cbd5e1;
    margin-top: 2px;
    flex-shrink: 0;
    background: #ffffff;
}

.pdp-ai-option.selected .pdp-ai-option-radio[b-w1w51jkadc] {
    border-color: #2563eb;
    box-shadow: inset 0 0 0 4px #2563eb;
}

.pdp-ai-option-title[b-w1w51jkadc] {
    margin: 0;
    color: #0f172a;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

.pdp-ai-option-subtitle[b-w1w51jkadc] {
    margin: 2px 0 0;
    color: #64748b;
    font-size: 13px;
    line-height: 1.45;
}

.pdp-ai-inline-field[b-w1w51jkadc] {
    margin-left: 30px;
}

.pdp-ai-disabled-hint[b-w1w51jkadc] {
    margin-left: 30px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    color: #64748b;
    padding: 10px 12px;
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.45;
}

[b-w1w51jkadc] .pdp-ai-input .mud-input-control {
    margin-top: 0;
}

[b-w1w51jkadc] .pdp-ai-input .mud-input-outlined {
    background: #ffffff;
}

.pdp-ai-modal-actions[b-w1w51jkadc] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
    margin-top: 16px;
    border-top: 1px solid #e5e7eb;
}

[b-w1w51jkadc] .pdp-modal-btn-ghost.mud-button-root {
    margin-right: auto;
    text-transform: none;
    font-weight: 500;
    color: #64748b;
}

[b-w1w51jkadc] .pdp-modal-btn-primary.mud-button-root {
    height: 40px;
    border-radius: 6px;
    text-transform: none;
    font-weight: 600;
}

@media (max-width: 1100px) {
    .pdp-empty-steps[b-w1w51jkadc] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .pdp-filters[b-w1w51jkadc] {
        grid-template-columns: 1fr;
    }

    .pdp-filter-actions[b-w1w51jkadc] {
        justify-content: flex-start;
    }

    .pdp-empty-state[b-w1w51jkadc] {
        padding: 36px 18px;
    }
}

@media (max-width: 640px) {
    .pdp-ai-options[b-w1w51jkadc] {
        padding-left: 16px;
        padding-right: 16px;
    }

    .pdp-ai-modal-actions[b-w1w51jkadc] {
        padding-left: 16px;
        padding-right: 16px;
        flex-direction: column-reverse;
        align-items: stretch;
    }

    [b-w1w51jkadc] .pdp-modal-btn-ghost.mud-button-root {
        margin-right: 0;
    }

    .pdp-ai-inline-field[b-w1w51jkadc],
    .pdp-ai-disabled-hint[b-w1w51jkadc] {
        margin-left: 0;
    }
}
/* /Components/Pages/Employees/EmployeesPage.razor.rz.scp.css */
.employees-page[b-zpddjpwkgq] {
    padding: 1.5rem;
}

/* Statistics badges */
.stat-badge[b-zpddjpwkgq] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.9rem;
}

.stat-badge.active[b-zpddjpwkgq] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.stat-badge.terminated[b-zpddjpwkgq] {
    background-color: #fce4ec;
    color: #c2185b;
}

.stat-badge i[b-zpddjpwkgq] {
    font-size: 0.6rem;
}

/* Status badges in select */
.status-badge[b-zpddjpwkgq] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.status-badge.active[b-zpddjpwkgq] {
    background-color: #1976d2;
}

.status-badge.terminated[b-zpddjpwkgq] {
    background-color: #c2185b;
}

/* Data Grid Styling */
[b-zpddjpwkgq] .employees-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-zpddjpwkgq] .employees-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-zpddjpwkgq] .employees-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
    text-align: left;
}

.employees-column-header[b-zpddjpwkgq] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.employees-sort-btn[b-zpddjpwkgq] {
    border: none;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    color: inherit;
    cursor: pointer;
    font-family: var(--mud-typography-default-family);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.43;
    letter-spacing: 0.01071em;
    text-align: left;
}

.employees-sort-btn--grow[b-zpddjpwkgq] {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
}

[b-zpddjpwkgq] .employees-grid .mud-table-row:hover {
    background-color: #fafafa;
}

/* Filters responsive layout */
.filters-wrapper[b-zpddjpwkgq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.filter-item[b-zpddjpwkgq] {
    flex: 0 0 auto;
    width: 200px;
}

.filter-search[b-zpddjpwkgq] {
    flex: 1 1 200px;
    min-width: 180px;
}

.filter-clear[b-zpddjpwkgq] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

/* Prevent filter width changes from text content */
[b-zpddjpwkgq] .filter-item .mud-input-control,
[b-zpddjpwkgq] .filter-item .mud-select,
[b-zpddjpwkgq] .filter-search .mud-input-control {
    width: 100%;
}

[b-zpddjpwkgq] .filter-item .mud-select-input,
[b-zpddjpwkgq] .filter-item .mud-input-slot,
[b-zpddjpwkgq] .filter-search .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .employees-page[b-zpddjpwkgq] {
        padding: 1rem;
    }

    .filter-item[b-zpddjpwkgq],
    .filter-search[b-zpddjpwkgq] {
        width: 100%;
        flex: 1 1 100%;
    }
}

@media (min-width: 577px) and (max-width: 992px) {
    .filter-item[b-zpddjpwkgq] {
        width: calc(50% - 0.375rem);
    }

    .filter-search[b-zpddjpwkgq] {
        width: 100%;
        flex: 1 1 100%;
    }
}

/* /Components/Pages/Employees/EmployeeStaffingHistoryTab.razor.rz.scp.css */
.staffing-history[b-ri1x12uq3t]  .staffing-row {
    display: flex !important;
    align-items: stretch;
    overflow: hidden;
    border-radius: 8px;
    transition: box-shadow .15s ease, border-color .15s ease;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row--clickable {
    cursor: pointer;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row--clickable:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border-color: #1976d2;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row--clickable:hover .staffing-row__company {
    color: #1976d2;
    text-decoration: underline;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__indicator {
    width: 4px;
    flex-shrink: 0;
    background-color: #cfcfcf;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__indicator--current {
    background-color: #2ecc71;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__indicator--upcoming {
    background-color: #3498db;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__indicator--past {
    background-color: #cfcfcf;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__body {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    width: 100%;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__main {
    min-width: 0;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__period {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__status {
    justify-self: end;
}

.staffing-history[b-ri1x12uq3t]  .staffing-row__icon {
    color: #757575;
}

.staffing-history[b-ri1x12uq3t]  .staffing-empty {
    text-align: center;
    padding: 2rem 1rem;
}

@media (max-width: 768px) {
    .staffing-history[b-ri1x12uq3t]  .staffing-row__body {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    .staffing-history[b-ri1x12uq3t]  .staffing-row__status {
        justify-self: start;
    }
}
/* /Components/Pages/Employees/EmployeeTimeOffTab.razor.rz.scp.css */
.tab-no-access[b-29ih7curbt] {
    padding: 2rem;
    text-align: center;
}

.time-off-container[b-29ih7curbt] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    border-radius: 12px;
    min-height: 200px;
}

.time-off-loading[b-29ih7curbt],
.time-off-error[b-29ih7curbt] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 320px;
    background-color: #f8fafc;
    border-radius: 12px;
}

.time-off-error .empty-state-content[b-29ih7curbt] {
    padding: 40px 24px;
}

/* Cards */
.time-off-card[b-29ih7curbt] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

.time-off-card.empty-state-card[b-29ih7curbt] {
    padding: 0;
}

/* Empty state */
.empty-state-content[b-29ih7curbt] {
    padding: 48px 64px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.empty-state-icon[b-29ih7curbt] {
    margin-bottom: 20px;
}

.emoji-icon[b-29ih7curbt] {
    font-size: 56px;
    line-height: 1;
    opacity: 0.9;
}

.empty-state-title[b-29ih7curbt] {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 12px 0;
    letter-spacing: -0.02em;
}

.empty-state-description[b-29ih7curbt] {
    font-size: 14px;
    font-weight: 400;
    color: #64748b;
    line-height: 1.6;
    margin: 0 0 20px 0;
    letter-spacing: -0.01em;
}

.empty-state-description.centered[b-29ih7curbt] {
    max-width: 480px;
}

.empty-state-reasons[b-29ih7curbt] {
    list-style: none;
    padding: 0;
    margin: 0 0 24px 0;
    text-align: left;
    width: 100%;
    max-width: 440px;
}

.empty-state-reasons li[b-29ih7curbt] {
    position: relative;
    padding-left: 20px;
    font-size: 14px;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 8px;
}

.empty-state-reasons li[b-29ih7curbt]::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #64748b;
}

.empty-state-reasons li:last-child[b-29ih7curbt] {
    margin-bottom: 0;
}

/* Buttons */
.btn-view-bamboo[b-29ih7curbt] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none;
    background-color: #0369a1;
    color: #ffffff;
}

.btn-view-bamboo.primary[b-29ih7curbt] {
    background-color: #0369a1;
    color: #ffffff;
}

.btn-view-bamboo.primary:hover[b-29ih7curbt] {
    background-color: #0284c7;
}

.btn-view-bamboo.secondary[b-29ih7curbt] {
    background-color: #ffffff;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.btn-view-bamboo.secondary:hover[b-29ih7curbt] {
    background-color: #f8fafc;
    border-color: #cbd5e1;
}

.btn-view-bamboo.small[b-29ih7curbt] {
    padding: 8px 16px;
    font-size: 13px;
}

.btn-view-bamboo i[b-29ih7curbt] {
    font-size: 14px;
}

/* Section title */
.section-title[b-29ih7curbt] {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 16px 0;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.section-title-icon[b-29ih7curbt] {
    font-size: 1em;
    line-height: 1;
}

/* Balance section */
.time-off-balance-section[b-29ih7curbt] {
    margin-bottom: 8px;
}

.balance-cards-grid[b-29ih7curbt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

@media (max-width: 1024px) {
    .balance-cards-grid[b-29ih7curbt] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .balance-cards-grid[b-29ih7curbt] {
        grid-template-columns: 1fr;
    }
}

.balance-card[b-29ih7curbt] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.2s ease;
}

.balance-card:hover[b-29ih7curbt] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.balance-card-header[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.balance-card-icon[b-29ih7curbt] {
    font-size: 24px;
    line-height: 1;
}

.balance-card-title[b-29ih7curbt] {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.balance-values[b-29ih7curbt] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.balance-value-item[b-29ih7curbt] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.balance-value-label[b-29ih7curbt] {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.balance-value-amount[b-29ih7curbt] {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.balance-available-green[b-29ih7curbt] { color: #10b981; }
.balance-available-blue[b-29ih7curbt] { color: #0369a1; }
.balance-available-gray[b-29ih7curbt] { color: #64748b; }
.balance-available-warn[b-29ih7curbt] { color: #f59e0b; }

.balance-used[b-29ih7curbt] {
    color: #64748b;
}

.balance-pending[b-29ih7curbt] {
    color: #f59e0b;
}

.balance-progress-wrap[b-29ih7curbt] {
    margin-bottom: 8px;
}

.balance-progress-bar[b-29ih7curbt] {
    height: 8px;
    background-color: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
}

.balance-progress-fill[b-29ih7curbt] {
    height: 100%;
    border-radius: 999px;
    transition: width 0.3s ease;
}

.balance-fill-green[b-29ih7curbt] {
    background: linear-gradient(90deg, #10b981 0%, #059669 100%);
}

.balance-fill-blue[b-29ih7curbt] {
    background: linear-gradient(90deg, #0ea5e9 0%, #0369a1 100%);
}

.balance-fill-gray[b-29ih7curbt] {
    background: linear-gradient(90deg, #64748b 0%, #475569 100%);
}

.balance-percent[b-29ih7curbt] {
    font-size: 12px;
    font-weight: 500;
    color: #64748b;
    text-align: right;
    margin-bottom: 4px;
}

.balance-note[b-29ih7curbt] {
    font-size: 12px;
    color: #64748b;
    font-style: italic;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e2e8f0;
}

/* Requests / History – Figma layout */
.time-off-requests-section[b-29ih7curbt] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06);
}

.history-header-row[b-29ih7curbt] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e2e8f0;
}

.history-title[b-29ih7curbt] {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    letter-spacing: -0.02em;
}

.history-filters[b-29ih7curbt] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.history-filter-group[b-29ih7curbt] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.history-filter-select[b-29ih7curbt] {
    appearance: none;
    padding: 10px 36px 10px 14px;
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.history-filter-select:hover[b-29ih7curbt] {
    border-color: #cbd5e1;
}

.history-filter-select:focus[b-29ih7curbt] {
    outline: none;
    border-color: #0369a1;
    box-shadow: 0 0 0 2px rgba(3, 105, 161, 0.2);
}

.history-filter-chevron[b-29ih7curbt] {
    position: absolute;
    right: 12px;
    font-size: 14px;
    color: #64748b;
    pointer-events: none;
}

.history-filter-label[b-29ih7curbt] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 36px 10px 14px;
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}

/* Fixed width for select input fields */
.history-select-filter[b-29ih7curbt] {
    width: 180px;
    min-width: 180px;
}

/* Smaller width for date picker input */
.history-date-picker[b-29ih7curbt] {
    width: 200px;
    min-width: 200px;
}

/* Ensure dropdown menu adapts to content width - targets the popover paper */
.history-select-filter[b-29ih7curbt]  .mud-popover-paper {
    min-width: fit-content !important;
    width: auto !important;
    max-width: none !important;
}

/* Ensure dropdown menu items can display full text */
.history-select-filter[b-29ih7curbt]  .mud-list-item {
    white-space: nowrap;
}

.popular-days-widget .chart-container[b-29ih7curbt] {
    height: 340px;
}

.requests-timeline[b-29ih7curbt] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.timeline-entry[b-29ih7curbt] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 20px 12px;
    border-bottom: 1px solid #e2e8f0;
    transition: background-color 0.15s ease;
    border-radius: 8px;
    margin: 0 -12px;
}

.timeline-entry:hover[b-29ih7curbt] {
    background-color: #f8fafc;
}

.timeline-entry-last[b-29ih7curbt] {
    border-bottom: none;
}

.timeline-date-badge[b-29ih7curbt] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 600;
    color: #0369a1;
    min-width: 100px;
}

.timeline-details[b-29ih7curbt] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.timeline-header[b-29ih7curbt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.timeline-type[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.timeline-type-icon[b-29ih7curbt] {
    font-size: 24px;
    line-height: 1;
}

.timeline-type-name[b-29ih7curbt] {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
}

.timeline-meta[b-29ih7curbt] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    font-size: 14px;
    color: #64748b;
    margin-bottom: 8px;
}

.timeline-meta-item[b-29ih7curbt] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.timeline-meta-item i[b-29ih7curbt] {
    font-size: 14px;
    opacity: 0.9;
}

.timeline-comment[b-29ih7curbt] {
    margin-top: 12px;
}

.timeline-comment-label[b-29ih7curbt] {
    font-size: 14px;
    font-weight: 500;
    color: #475569;
    margin-bottom: 6px;
}

.timeline-comment-text[b-29ih7curbt] {
    font-size: 14px;
    color: #64748b;
    line-height: 1.5;
    background-color: #f8fafc;
    border-left: 3px solid #2e75b6;
    border-radius: 0 6px 6px 0;
    padding: 12px 16px;
}

.timeline-approval[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #059669;
    margin-top: 10px;
}

.timeline-approval-icon[b-29ih7curbt] {
    font-size: 14px;
    flex-shrink: 0;
}

.timeline-denial[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #dc2626;
    margin-top: 10px;
}

.timeline-denial-icon[b-29ih7curbt] {
    font-size: 14px;
    flex-shrink: 0;
}

.timeline-denial-reason[b-29ih7curbt] {
    margin-top: 10px;
}

.timeline-denial-reason-label[b-29ih7curbt] {
    font-size: 14px;
    font-weight: 600;
    color: #dc2626;
    margin-bottom: 6px;
}

.timeline-denial-reason-text[b-29ih7curbt] {
    font-size: 14px;
    color: #dc2626;
    line-height: 1.5;
    background-color: #fef2f2;
    border-left: 3px solid #dc2626;
    border-radius: 0 6px 6px 0;
    padding: 12px 16px;
}

.timeline-requested[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: #94a3b8;
    margin-top: 6px;
}

.timeline-requested-icon[b-29ih7curbt] {
    font-size: 12px;
    flex-shrink: 0;
}

.status-icon[b-29ih7curbt] {
    font-size: 12px;
    flex-shrink: 0;
}

/* Status badges */
.status-badge[b-29ih7curbt] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 999px;
    text-transform: capitalize;
}

.status-approved[b-29ih7curbt] {
    background-color: #d1fae5;
    color: #059669;
    border: 1px solid #6ee7b7;
}

.status-pending[b-29ih7curbt] {
    background-color: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.status-denied[b-29ih7curbt] {
    background-color: #fee2e2;
    color: #dc2626;
    border: 1px solid #fca5a5;
}

.status-completed[b-29ih7curbt] {
    background-color: #dbeafe;
    color: #1e40af;
    border: 1px solid #93c5fd;
}

.status-cancelled[b-29ih7curbt] {
    background-color: #f1f5f9;
    color: #64748b;
    border: 1px solid #cbd5e1;
}

.status-default[b-29ih7curbt] {
    background-color: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

/* Info banner */
.time-off-info-banner[b-29ih7curbt] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    background-color: #f0f9ff;
    border: 1px solid #bae6fd;
    border-radius: 10px;
    margin-top: 8px;
}

.info-banner-icon[b-29ih7curbt] {
    font-size: 20px;
    color: #0369a1;
    flex-shrink: 0;
    margin-top: 2px;
}

.info-banner-text[b-29ih7curbt] {
    font-size: 14px;
    color: #0369a1;
    line-height: 1.5;
    margin: 0;
}

/* History pagination */
.history-pagination[b-29ih7curbt] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #e2e8f0;
}

.history-pagination-summary[b-29ih7curbt] {
    font-size: 14px;
    color: #64748b;
}

.history-pagination-controls[b-29ih7curbt] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.history-page-btn[b-29ih7curbt] {
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}

.history-page-btn:hover:not(:disabled)[b-29ih7curbt] {
    background-color: #f8fafc;
    border-color: #cbd5e1;
}

.history-page-btn.active[b-29ih7curbt] {
    background-color: #0369a1;
    color: #ffffff;
    border-color: #0369a1;
}

.history-page-btn:disabled[b-29ih7curbt] {
    opacity: 0.5;
    cursor: not-allowed;
}

.history-page-ellipsis[b-29ih7curbt] {
    padding: 0 4px;
    font-size: 14px;
    color: #64748b;
}

/* Responsive */
@media (max-width: 1200px) {
    .empty-state-content[b-29ih7curbt] {
        padding: 40px 48px;
    }

    .balance-cards-grid[b-29ih7curbt] {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }
}

@media (max-width: 960px) {
    .time-off-container[b-29ih7curbt] {
        padding: 16px;
    }

    .empty-state-content[b-29ih7curbt] {
        padding: 40px 32px;
    }

    .balance-cards-grid[b-29ih7curbt] {
        grid-template-columns: 1fr;
    }

    .timeline-entry[b-29ih7curbt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .timeline-date-badge[b-29ih7curbt] {
        min-width: auto;
    }
}

@media (max-width: 600px) {
    .empty-state-content[b-29ih7curbt] {
        padding: 32px 20px;
    }

    .empty-state-reasons[b-29ih7curbt] {
        max-width: 100%;
        padding-left: 8px;
    }

    .history-header-row[b-29ih7curbt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .history-filters[b-29ih7curbt] {
        width: 100%;
    }

    .timeline-header[b-29ih7curbt] {
        flex-direction: column;
        align-items: flex-start;
    }

    .time-off-info-banner[b-29ih7curbt] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackOverviewPage.razor.rz.scp.css */
/* ==========================================================================
   FeedbackOverviewPage — scoped visual layer aligned to Talents design system.
   Tokens come from wwwroot/css/talents-tokens.css.
   ========================================================================== */

.feedback-overview-page[b-awe70sjiyg] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Page header ---------- */

.tlt-page-header[b-awe70sjiyg] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.tlt-page-header__titles[b-awe70sjiyg] { min-width: 0; }

.tlt-page-header__overline[b-awe70sjiyg] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
    margin-bottom: var(--space-2);
}

.tlt-page-header__title[b-awe70sjiyg] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    color: var(--talents-ink);
}

.tlt-page-header__subtitle[b-awe70sjiyg] {
    margin: 4px 0 0;
    color: var(--talents-muted);
    font-size: 14px;
    line-height: 1.45;
}

.tlt-page-header__actions[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-awe70sjiyg] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-awe70sjiyg] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-awe70sjiyg] {
    background: #1E4256;
}

.tlt-btn--secondary[b-awe70sjiyg] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-awe70sjiyg] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--text[b-awe70sjiyg] {
    background: transparent;
    color: var(--talents-label);
    padding-inline: 8px;
}

.tlt-btn--text:hover:not(:disabled)[b-awe70sjiyg] {
    color: var(--talents-ink);
}

/* ---------- Stat row ---------- */

.tlt-stat-row[b-awe70sjiyg] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.tlt-stat[b-awe70sjiyg] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    padding: var(--space-4) var(--space-5);
    cursor: pointer;
    text-align: left;
    font-family: var(--font-sans);
    transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

.tlt-stat:hover[b-awe70sjiyg] { box-shadow: var(--shadow-sm); }

.tlt-stat--active[b-awe70sjiyg] {
    border-color: var(--talents-brand);
    background: var(--talents-brand-light);
    box-shadow: var(--focus-brand);
}

.tlt-stat__main[b-awe70sjiyg] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tlt-stat__value[b-awe70sjiyg] {
    font-size: 26px;
    font-weight: 700;
    color: var(--talents-ink);
    line-height: 1.1;
    letter-spacing: -0.01em;
}

.tlt-stat__label[b-awe70sjiyg] {
    margin-top: 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--talents-ink);
}

.tlt-stat__sub[b-awe70sjiyg] {
    margin-top: 2px;
    font-size: 11px;
    color: var(--talents-muted);
}

.tlt-stat__icon[b-awe70sjiyg] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    flex: none;
}

.tlt-stat--active .tlt-stat__icon[b-awe70sjiyg] {
    background: var(--talents-surface);
    color: var(--talents-brand-strong);
}

@media (max-width: 1100px) {
    .tlt-stat-row[b-awe70sjiyg] { grid-template-columns: repeat(2, 1fr); }
}

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

/* ---------- Sessions switch row ---------- */

.overview-switch-row[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: var(--space-3);
}

.overview-switch[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.overview-switch__sep[b-awe70sjiyg] {
    color: var(--talents-placeholder);
}

.overview-switch__desc[b-awe70sjiyg] {
    color: var(--talents-muted);
    font-size: 13px;
    flex: 1;
    min-width: 0;
}

.overview-switch__cta[b-awe70sjiyg] {
    margin-left: auto;
    flex-shrink: 0;
}

.tlt-tab[b-awe70sjiyg] {
    padding: 4px 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--talents-label);
    border: 0;
    background: transparent;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: color 150ms ease, border-color 150ms ease;
}

.tlt-tab:hover[b-awe70sjiyg] { color: var(--talents-ink); }

.tlt-tab--active[b-awe70sjiyg] {
    color: var(--talents-ink);
    border-bottom-color: var(--talents-brand);
}

/* ---------- Filters wrapper ---------- */

.filters-wrapper[b-awe70sjiyg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.filter-search[b-awe70sjiyg] {
    flex: 1 1 200px;
    min-width: 180px;
}

.filter-item[b-awe70sjiyg] {
    flex: 0 0 auto;
    width: 200px;
}

[b-awe70sjiyg] .filter-search .mud-input-control,
[b-awe70sjiyg] .filter-item .mud-input-control,
[b-awe70sjiyg] .filter-item .mud-select {
    width: 100%;
}

/* ---------- Result summary / muted ---------- */

.tlt-result-summary[b-awe70sjiyg] {
    font-size: 12px;
    color: var(--talents-muted);
    margin-bottom: var(--space-3);
}

.tlt-muted[b-awe70sjiyg] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Table card ---------- */

.tlt-table-card[b-awe70sjiyg] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

.tlt-table[b-awe70sjiyg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.tlt-table thead th[b-awe70sjiyg] {
    text-align: left;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--talents-label);
    background: var(--talents-pill-bg);
    padding: 10px 16px;
    border-bottom: 1px solid var(--talents-border);
    white-space: nowrap;
    position: relative;
    overflow: visible;
}

.tlt-table thead th:first-child[b-awe70sjiyg] {
    border-top-left-radius: var(--radius-lg2);
}

.tlt-table thead th:last-child[b-awe70sjiyg] {
    border-top-right-radius: var(--radius-lg2);
}

.tlt-table tbody td[b-awe70sjiyg] {
    padding: 14px 16px;
    border-bottom: 1px solid var(--talents-border);
    color: var(--talents-ink);
    vertical-align: middle;
}

.tlt-table tbody tr:last-child td[b-awe70sjiyg] {
    border-bottom: 0;
}

.tlt-table tbody tr:hover td[b-awe70sjiyg] {
    background: var(--talents-brand-light);
}

.column-header[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
}

.column-sort[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    user-select: none;
    flex: 1 1 auto;
    min-width: 0;
}

/* ---------- Cell content ---------- */

.tlt-row[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.tlt-col[b-awe70sjiyg] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tlt-avatar[b-awe70sjiyg] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: var(--talents-ink);
    color: var(--talents-brand);
    font-weight: 700;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    overflow: hidden;
}

/* ---------- Reviewers (Feedback from) ---------- */

.tlt-reviewers[b-awe70sjiyg] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.tlt-reviewer[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.tlt-avatar--xs[b-awe70sjiyg] {
    width: 22px;
    height: 22px;
    font-size: 9px;
}

.tlt-reviewer__name[b-awe70sjiyg] {
    color: var(--talents-ink);
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

.tlt-reviewer__done[b-awe70sjiyg] {
    color: #16a34a;
    width: 15px !important;
    height: 15px !important;
    flex: none;
}

.tlt-reviewer__more[b-awe70sjiyg] {
    color: var(--talents-brand-strong);
    font-size: 12px;
    font-weight: 600;
    cursor: default;
}

.tlt-reviewer__all-done[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: #16a34a;
    font-weight: 600;
}

.tlt-reviewer__anon[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--talents-muted);
    font-weight: 600;
}

.tlt-reviewer__anon-icon[b-awe70sjiyg] {
    width: 14px !important;
    height: 14px !important;
    flex: none;
}

.tlt-reviewer-tip[b-awe70sjiyg] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    text-align: left;
    padding: 2px;
    max-height: 260px;
    overflow-y: auto;
}

.tlt-reviewer-tip__row[b-awe70sjiyg] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    white-space: nowrap;
}

.tlt-reviewer-tip__icon[b-awe70sjiyg] {
    width: 14px !important;
    height: 14px !important;
    flex: none;
}

.tlt-link[b-awe70sjiyg] {
    color: var(--talents-brand-strong);
    text-decoration: none;
    font-weight: 600;
}

.tlt-link:hover[b-awe70sjiyg] {
    color: var(--talents-ink);
    text-decoration: underline;
}

.tlt-strong[b-awe70sjiyg] {
    color: var(--talents-ink);
    font-weight: 600;
}

.tlt-cell-muted[b-awe70sjiyg] {
    color: var(--talents-muted);
    font-size: 11px;
}

/* ---------- Pills ---------- */

.tlt-pill[b-awe70sjiyg] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 10px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    border: 1px solid transparent;
    white-space: nowrap;
    width: fit-content;
}

.tlt-pill--info[b-awe70sjiyg] {
    background: var(--info-bg);
    color: var(--brand-700);
    border-color: var(--info-border);
}

.tlt-pill--success[b-awe70sjiyg] {
    background: var(--success-bg);
    color: var(--success-text);
    border-color: var(--success-border);
}

.tlt-pill--warning[b-awe70sjiyg] {
    background: var(--warning-bg);
    color: var(--warning-text);
    border-color: var(--warning-border);
}

.tlt-pill--danger[b-awe70sjiyg] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}

.tlt-pill--outline[b-awe70sjiyg] {
    background: var(--talents-surface);
    border-color: var(--talents-border-card);
    color: var(--talents-label);
}

.tlt-pill--brand[b-awe70sjiyg] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    border-color: var(--info-border);
}

/* ---------- Progress ---------- */

.tlt-progress[b-awe70sjiyg] {
    height: 4px;
    background: var(--talents-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.tlt-progress--cell[b-awe70sjiyg] {
    margin-top: 4px;
    max-width: 80px;
}

.tlt-progress__fill[b-awe70sjiyg] {
    height: 100%;
    background: var(--talents-brand);
    border-radius: var(--radius-full);
}

/* ---------- Empty state ---------- */

.tlt-empty[b-awe70sjiyg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-awe70sjiyg] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-awe70sjiyg] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-awe70sjiyg] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackPresetDetails.razor.rz.scp.css */
/* ==========================================================================
   FeedbackPresetDetails — scoped visual layer aligned to Talents design system.
   Tokens come from wwwroot/css/talents-tokens.css.
   ========================================================================== */

.preset-details-page[b-zlqph8cl3p],
.tlt-page[b-zlqph8cl3p] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Detail header ---------- */

.tlt-detail-header[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.tlt-detail-header__titles[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.tlt-detail-header__title-row[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.tlt-detail-header__title[b-zlqph8cl3p] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: var(--talents-ink);
}

.tlt-detail-header__subtitle[b-zlqph8cl3p] {
    margin: 0;
    color: var(--talents-muted);
    font-size: 13px;
}

/* ---------- Icon-only button ---------- */

.tlt-icon-btn[b-zlqph8cl3p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 8px;
    border: 1px solid var(--talents-border-card);
    background: var(--talents-surface);
    color: var(--talents-label);
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.tlt-icon-btn:hover:not(:disabled)[b-zlqph8cl3p] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
    color: var(--talents-ink);
}

.tlt-icon-btn:disabled[b-zlqph8cl3p] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-icon-btn--active[b-zlqph8cl3p] {
    background: var(--talents-ink);
    border-color: var(--talents-ink);
    color: var(--talents-brand);
}

.tlt-icon-btn--active:hover:not(:disabled)[b-zlqph8cl3p] {
    background: #1E4256;
    border-color: #1E4256;
    color: var(--talents-brand);
}

/* ---------- Two-column layout ---------- */

.tlt-detail-layout[b-zlqph8cl3p] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 20px;
    align-items: start;
}

.tlt-rail[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (max-width: 1100px) {
    .tlt-detail-layout[b-zlqph8cl3p] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Card ---------- */

.tlt-card[b-zlqph8cl3p] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
}

.tlt-card__head[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--talents-border);
}

.tlt-card__title-row[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
}

.tlt-card__body[b-zlqph8cl3p] {
    padding: var(--space-5);
}

.tlt-card__foot[b-zlqph8cl3p] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px var(--space-5);
    border-top: 1px solid var(--talents-border);
    font-size: 12px;
    color: var(--talents-muted);
}

.tlt-overline[b-zlqph8cl3p] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
    line-height: 1.2;
}

.tlt-section-title[b-zlqph8cl3p] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
    line-height: 1.3;
}

/* ---------- Question rows ---------- */

.tlt-q-row[b-zlqph8cl3p] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--talents-border);
}

.tlt-q-row:last-child[b-zlqph8cl3p] {
    border-bottom: 0;
}

.tlt-q-row--dragging[b-zlqph8cl3p] {
    opacity: 0.4;
}

.tlt-q-row__grip[b-zlqph8cl3p] {
    color: var(--talents-placeholder);
    padding-top: 2px;
    cursor: grab;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 22px;
}

.tlt-q-row__index[b-zlqph8cl3p] {
    min-width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--talents-ink);
    color: var(--talents-brand);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex: none;
}

.tlt-q-row__body[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.tlt-q-row__text[b-zlqph8cl3p] {
    font-weight: 500;
    color: var(--talents-ink);
    font-size: 14px;
}

.tlt-q-row__meta[b-zlqph8cl3p] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

/* ---------- Grouped question sub-rows ---------- */

.tlt-group-rows[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 2px;
    padding-left: 10px;
    border-left: 2px solid var(--talents-border-card);
}

.tlt-group-row[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--talents-label);
}

/* ---------- Pills + tags ---------- */

.tlt-pill[b-zlqph8cl3p] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 10px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    border: 1px solid transparent;
    white-space: nowrap;
}

.tlt-pill--outline[b-zlqph8cl3p] {
    background: var(--talents-surface);
    border-color: var(--talents-border-card);
    color: var(--talents-label);
}

.tlt-pill--brand[b-zlqph8cl3p] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    border-color: var(--info-border);
}

.tlt-pill--danger[b-zlqph8cl3p] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}

.tlt-tag[b-zlqph8cl3p] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--radius-sm);
    font-size: 11px;
    font-weight: 500;
    background: var(--talents-surface);
    border: 1px solid var(--info-border);
    color: var(--brand-700);
}

/* ---------- Avatar ---------- */

.tlt-avatar[b-zlqph8cl3p] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: var(--talents-ink);
    color: var(--talents-brand);
    font-weight: 700;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.tlt-avatar--square[b-zlqph8cl3p] {
    border-radius: var(--radius-sm);
    width: 38px;
    height: 42px;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-zlqph8cl3p] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-zlqph8cl3p] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--secondary[b-zlqph8cl3p] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-zlqph8cl3p] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

/* ---------- Meta list ---------- */

.tlt-meta-list[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tlt-meta-item__label[b-zlqph8cl3p] {
    font-size: 11px;
    color: var(--talents-label);
    font-weight: 600;
    display: block;
}

.tlt-meta-item__value[b-zlqph8cl3p] {
    font-size: 13px;
    color: var(--talents-ink);
    display: block;
    margin-top: 2px;
}

/* ---------- Utility ---------- */

.tlt-row[b-zlqph8cl3p] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.tlt-col[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tlt-muted[b-zlqph8cl3p] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Empty state ---------- */

.tlt-empty[b-zlqph8cl3p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-zlqph8cl3p] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-zlqph8cl3p] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-zlqph8cl3p] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackPresetsPage.razor.rz.scp.css */
/* ==========================================================================
   FeedbackPresetsPage — scoped visual layer aligned to Talents design system.
   Tokens come from wwwroot/css/talents-tokens.css.
   ========================================================================== */

.feedback-presets-page[b-5xxg2nf6l9] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Page header ---------- */

.tlt-page-header[b-5xxg2nf6l9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.tlt-page-header__titles[b-5xxg2nf6l9] { min-width: 0; }

.tlt-page-header__overline[b-5xxg2nf6l9] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
    margin-bottom: var(--space-2);
}

.tlt-page-header__title[b-5xxg2nf6l9] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    color: var(--talents-ink);
}

.tlt-page-header__subtitle[b-5xxg2nf6l9] {
    margin: 4px 0 0;
    color: var(--talents-muted);
    font-size: 14px;
    line-height: 1.45;
}

.tlt-page-header__actions[b-5xxg2nf6l9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-5xxg2nf6l9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-5xxg2nf6l9] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-5xxg2nf6l9] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-5xxg2nf6l9] {
    background: #1E4256;
}

.tlt-btn--secondary[b-5xxg2nf6l9] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-5xxg2nf6l9] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--text[b-5xxg2nf6l9] {
    background: transparent;
    color: var(--talents-label);
    padding-inline: 8px;
}

.tlt-btn--text:hover:not(:disabled)[b-5xxg2nf6l9] {
    color: var(--talents-ink);
}

.tlt-btn--sm[b-5xxg2nf6l9] {
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}

/* ---------- Icon-only button (matches Preset details) ---------- */

.tlt-icon-btn[b-5xxg2nf6l9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 8px;
    border: 1px solid var(--talents-border-card);
    background: var(--talents-surface);
    color: var(--talents-label);
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.tlt-icon-btn:hover:not(:disabled)[b-5xxg2nf6l9] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
    color: var(--talents-ink);
}

.tlt-icon-btn:disabled[b-5xxg2nf6l9] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-icon-btn--active[b-5xxg2nf6l9] {
    background: var(--talents-ink);
    border-color: var(--talents-ink);
    color: var(--talents-brand);
}

.tlt-icon-btn--active:hover:not(:disabled)[b-5xxg2nf6l9] {
    background: #1E4256;
    border-color: #1E4256;
    color: var(--talents-brand);
}

/* ---------- Icon-only button ---------- */

.tlt-icon-btn[b-5xxg2nf6l9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 8px;
    border: 1px solid var(--talents-border-card);
    background: var(--talents-surface);
    color: var(--talents-label);
    cursor: pointer;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
}

.tlt-icon-btn:hover:not(:disabled)[b-5xxg2nf6l9] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
    color: var(--talents-ink);
}

.tlt-icon-btn:disabled[b-5xxg2nf6l9] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-icon-btn--active[b-5xxg2nf6l9] {
    background: var(--talents-ink);
    border-color: var(--talents-ink);
    color: var(--talents-brand);
}

.tlt-icon-btn--active:hover:not(:disabled)[b-5xxg2nf6l9] {
    background: #1E4256;
    border-color: #1E4256;
    color: var(--talents-brand);
}

/* ---------- Card + preset row ---------- */

.tlt-card[b-5xxg2nf6l9] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
}

.tlt-preset-row[b-5xxg2nf6l9] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: 14px 18px;
    border-bottom: 1px solid var(--talents-border);
}

.tlt-preset-row:last-child[b-5xxg2nf6l9] {
    border-bottom: 0;
}

.tlt-preset-row__main[b-5xxg2nf6l9] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
    margin-left: 4px;
}

.tlt-preset-row__name[b-5xxg2nf6l9] {
    font-size: 15px;
    font-weight: 600;
    color: var(--talents-ink);
}

.tlt-preset-row__meta[b-5xxg2nf6l9] {
    color: var(--talents-muted);
    font-size: 12px;
    margin-top: 2px;
}

.tlt-preset-row__actions[b-5xxg2nf6l9] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ---------- Avatar ---------- */

.tlt-avatar[b-5xxg2nf6l9] {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: var(--talents-ink);
    color: var(--talents-brand);
    font-weight: 700;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.tlt-avatar--square[b-5xxg2nf6l9] {
    border-radius: var(--radius-sm);
    width: 38px;
    height: 42px;
}

/* ---------- Result summary + empty state + muted ---------- */

.tlt-result-summary[b-5xxg2nf6l9] {
    font-size: 12px;
    color: var(--talents-muted);
    margin-bottom: var(--space-3);
}

.tlt-muted[b-5xxg2nf6l9] {
    color: var(--talents-muted);
    font-size: 12px;
}

.tlt-empty[b-5xxg2nf6l9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-5xxg2nf6l9] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-5xxg2nf6l9] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-5xxg2nf6l9] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackQuestionEditor.razor.rz.scp.css */
/* ==========================================================================
   FeedbackQuestionEditor — dedicated create/edit page for feedback questions.
   Tokens come from wwwroot/css/talents-tokens.css.
   ========================================================================== */

.feedback-question-editor[b-31ox228chj] {
    padding: var(--space-6);
    background: var(--talents-bg);
    max-width: 860px;
    margin: 0 auto;
}

/* ---------- Page header ---------- */

.tlt-page-header[b-31ox228chj] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.tlt-page-header__titles[b-31ox228chj] { min-width: 0; }

.tlt-page-header__title[b-31ox228chj] {
    margin: 8px 0 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    color: var(--talents-ink);
}

.tlt-page-header__subtitle[b-31ox228chj] {
    margin: 4px 0 0;
    color: var(--talents-muted);
    font-size: 14px;
    line-height: 1.45;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-31ox228chj] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-31ox228chj] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-31ox228chj] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-31ox228chj] {
    background: #1E4256;
}

.tlt-btn--secondary[b-31ox228chj] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-31ox228chj] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--text[b-31ox228chj] {
    background: transparent;
    color: var(--talents-label);
    padding-inline: 8px;
    height: auto;
}

.tlt-btn--text:hover:not(:disabled)[b-31ox228chj] {
    color: var(--talents-ink);
}

.tlt-muted[b-31ox228chj] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Empty / error state ---------- */

.tlt-empty[b-31ox228chj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-31ox228chj] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-31ox228chj] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-31ox228chj] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}

/* ---------- Editor card ---------- */

.editor-card[b-31ox228chj] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
    padding: var(--space-6);
}

.editor-actions[b-31ox228chj] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    margin-top: var(--space-5);
    padding-top: var(--space-4);
    border-top: 1px solid var(--talents-border);
}

/* ---------- Question type cards ---------- */

.question-type-card[b-31ox228chj] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0.25rem;
    align-items: flex-start;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.75rem 1rem;
    background-color: #ffffff;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    text-align: left;
    outline: none;
}

.question-type-card-header[b-31ox228chj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.question-type-card-main[b-31ox228chj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.question-type-card .mud-icon-root[b-31ox228chj] {
    font-size: 1.2rem;
}

.question-type-card .fw-semibold[b-31ox228chj] {
    font-size: 0.95rem;
}

.question-type-card .text-muted[b-31ox228chj] {
    font-size: 0.8rem;
}

.question-type-card:hover[b-31ox228chj] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.2);
    background-color: #f5f9ff;
}

.question-type-card.selected[b-31ox228chj] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.25);
    background-color: #e3f2fd;
}

.question-type-card.selected .fw-semibold[b-31ox228chj] {
    color: #0d47a1;
}

.question-type-row > [class^="col-"][b-31ox228chj],
.question-type-row > [class*=" col-"][b-31ox228chj] {
    display: flex;
}

.question-type-row .question-type-card[b-31ox228chj] {
    height: 100%;
}

/* ---------- Fixed-scale previews (Rating / Choice) ---------- */

.rating-options-container[b-31ox228chj] {
    padding: 0;
    border-radius: 0;
    background-color: transparent;
    border: none;
}

.rating-option-card[b-31ox228chj] {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.5rem 0.75rem;
    background-color: #f7f7f7;
    cursor: default;
    transition: none;
}

.rating-option-card .mud-icon-root[b-31ox228chj] {
    font-size: 1.4rem;
}

.rating-option-card .fw-semibold[b-31ox228chj] {
    font-size: 0.95rem;
}

.rating-option-card .text-muted[b-31ox228chj] {
    font-size: 0.8rem;
}

/* ---------- Agreement / numeric scale previews ---------- */

.scale-preview[b-31ox228chj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.scale-preview-card[b-31ox228chj] {
    flex: 1 1 0;
    min-width: 96px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    background-color: #f7f7f7;
    padding: 0.5rem 0.5rem;
    text-align: center;
}

.scale-preview-score[b-31ox228chj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: var(--radius-full);
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    font-weight: 700;
    font-size: 0.85rem;
    margin-bottom: 0.35rem;
}

.scale-preview-label[b-31ox228chj] {
    font-size: 0.78rem;
    color: var(--talents-label);
    line-height: 1.25;
}

.scale-preview--numeric .scale-preview-chip[b-31ox228chj] {
    flex: 1 1 0;
    min-width: 44px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    background-color: #f7f7f7;
    padding: 0.55rem 0;
    text-align: center;
    font-weight: 600;
    color: var(--talents-ink);
}

/* ---------- Grouped (matrix) row picker ---------- */

.group-rows[b-31ox228chj] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.group-row[b-31ox228chj] {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--talents-border-card);
    border-radius: 8px;
    padding: 6px 10px;
    background: #ffffff;
}

.group-row-index[b-31ox228chj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border-radius: var(--radius-full);
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    font-weight: 700;
    font-size: 0.78rem;
}

.group-row-text[b-31ox228chj] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.9rem;
    color: var(--talents-ink);
}

@media (max-width: 576px) {
    .feedback-question-editor[b-31ox228chj] {
        padding: 1rem;
    }

    .editor-card[b-31ox228chj] {
        padding: var(--space-4);
    }
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackQuestionsPage.razor.rz.scp.css */
/* ==========================================================================
   FeedbackQuestionsPage — scoped visual layer aligned to Talents design system.
   Tokens come from wwwroot/css/talents-tokens.css.
   Modal-related styles (question-type-card, rating-option-card, etc.) are kept
   intact — the user-asked to leave the question create/edit modals unchanged.
   ========================================================================== */

.feedback-questions-page[b-s5jnppu1g4] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Page header ---------- */

.tlt-page-header[b-s5jnppu1g4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-5);
}

.tlt-page-header__titles[b-s5jnppu1g4] { min-width: 0; }

.tlt-page-header__overline[b-s5jnppu1g4] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
    margin-bottom: var(--space-2);
}

.tlt-page-header__title[b-s5jnppu1g4] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    color: var(--talents-ink);
}

.tlt-page-header__subtitle[b-s5jnppu1g4] {
    margin: 4px 0 0;
    color: var(--talents-muted);
    font-size: 14px;
    line-height: 1.45;
}

.tlt-page-header__actions[b-s5jnppu1g4] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-s5jnppu1g4] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-s5jnppu1g4] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-s5jnppu1g4] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-s5jnppu1g4] {
    background: #1E4256;
}

.tlt-btn--secondary[b-s5jnppu1g4] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-s5jnppu1g4] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--text[b-s5jnppu1g4] {
    background: transparent;
    color: var(--talents-label);
    padding-inline: 8px;
}

.tlt-btn--text:hover:not(:disabled)[b-s5jnppu1g4] {
    color: var(--talents-ink);
}

/* ---------- Search + filter row ---------- */

.filters-wrapper[b-s5jnppu1g4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.filter-search[b-s5jnppu1g4] {
    flex: 1 1 200px;
    min-width: 180px;
}

[b-s5jnppu1g4] .filter-search .mud-input-control {
    width: 100%;
}

/* ---------- Result summary + muted ---------- */

.tlt-result-summary[b-s5jnppu1g4] {
    font-size: 12px;
    color: var(--talents-muted);
    margin-bottom: var(--space-3);
}

.tlt-muted[b-s5jnppu1g4] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Table card ---------- */

.tlt-table-card[b-s5jnppu1g4] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

.tlt-table[b-s5jnppu1g4] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.tlt-table thead th[b-s5jnppu1g4] {
    text-align: left;
    font-size: 11px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--talents-label);
    background: var(--talents-pill-bg);
    padding: 10px 16px;
    border-bottom: 1px solid var(--talents-border);
    white-space: nowrap;
    position: relative;
    overflow: visible;
}

.tlt-table thead th:first-child[b-s5jnppu1g4] {
    border-top-left-radius: var(--radius-lg2);
}

.tlt-table thead th:last-child[b-s5jnppu1g4] {
    border-top-right-radius: var(--radius-lg2);
}

.tlt-table tbody td[b-s5jnppu1g4] {
    padding: 14px 16px;
    border-bottom: 1px solid var(--talents-border);
    color: var(--talents-ink);
    vertical-align: middle;
}

.tlt-table tbody tr:last-child td[b-s5jnppu1g4] {
    border-bottom: 0;
}

.tlt-table tbody tr:hover td[b-s5jnppu1g4] {
    background: var(--talents-brand-light);
}

.column-header[b-s5jnppu1g4] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
}

.column-sort[b-s5jnppu1g4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    user-select: none;
    flex: 1 1 auto;
    min-width: 0;
}

/* ---------- Question cell content ---------- */

.tlt-col[b-s5jnppu1g4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.tlt-q-text[b-s5jnppu1g4] {
    font-weight: 600;
    color: var(--talents-ink);
    font-size: 13px;
    line-height: 1.4;
}

.tlt-q-desc[b-s5jnppu1g4] {
    color: var(--talents-muted);
    font-size: 12px;
    line-height: 1.4;
}

.tlt-q-tags[b-s5jnppu1g4] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 2px;
}

/* ---------- Pills ---------- */

.tlt-pill-group[b-s5jnppu1g4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.tlt-pill[b-s5jnppu1g4] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 10px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    border: 1px solid transparent;
    white-space: nowrap;
}

.tlt-pill[b-s5jnppu1g4]  .mud-icon-root {
    font-size: 14px;
    width: 14px;
    height: 14px;
}

.tlt-pill--info[b-s5jnppu1g4] {
    background: var(--info-bg);
    color: var(--brand-700);
    border-color: var(--info-border);
}

.tlt-pill--success[b-s5jnppu1g4] {
    background: var(--success-bg);
    color: var(--success-text);
    border-color: var(--success-border);
}

.tlt-pill--warning[b-s5jnppu1g4] {
    background: var(--warning-bg);
    color: var(--warning-text);
    border-color: var(--warning-border);
}

.tlt-pill--outline[b-s5jnppu1g4] {
    background: var(--talents-surface);
    border-color: var(--talents-border-card);
    color: var(--talents-label);
}

.tlt-pill--brand[b-s5jnppu1g4] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    border-color: var(--info-border);
}

/* ---------- Tag ---------- */

.tlt-tag[b-s5jnppu1g4] {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--radius-sm);
    font-size: 11px;
    font-weight: 500;
    background: var(--talents-surface);
    border: 1px solid var(--info-border);
    color: var(--brand-700);
}

/* ---------- Empty state ---------- */

.tlt-empty[b-s5jnppu1g4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-s5jnppu1g4] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-s5jnppu1g4] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-s5jnppu1g4] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}

/* ==========================================================================
   Modal styles — left untouched per user request (don't redesign modals).
   ========================================================================== */

.question-type-card[b-s5jnppu1g4] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0.25rem;
    align-items: flex-start;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.75rem 1rem;
    background-color: #ffffff;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    text-align: left;
    outline: none;
}

.question-type-card-header[b-s5jnppu1g4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.question-type-card-main[b-s5jnppu1g4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.question-type-card .mud-icon-root[b-s5jnppu1g4] {
    font-size: 1.2rem;
}

.question-type-card .fw-semibold[b-s5jnppu1g4] {
    font-size: 0.95rem;
}

.question-type-card .text-muted[b-s5jnppu1g4] {
    font-size: 0.8rem;
}

.question-type-card:hover[b-s5jnppu1g4] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.2);
    background-color: #f5f9ff;
}

.question-type-card.selected[b-s5jnppu1g4] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.25);
    background-color: #e3f2fd;
}

.question-type-card.selected .fw-semibold[b-s5jnppu1g4] {
    color: #0d47a1;
}

.rating-options-container[b-s5jnppu1g4] {
    padding: 0;
    border-radius: 0;
    background-color: transparent;
    border: none;
}

.rating-option-card[b-s5jnppu1g4] {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.5rem 0.75rem;
    background-color: #f7f7f7;
    cursor: default;
    transition: none;
}

.rating-option-card .mud-icon-root[b-s5jnppu1g4] {
    font-size: 1.4rem;
}

.rating-option-card .fw-semibold[b-s5jnppu1g4] {
    font-size: 0.95rem;
}

.rating-option-card .text-muted[b-s5jnppu1g4] {
    font-size: 0.8rem;
}

.question-type-row > [class^="col-"][b-s5jnppu1g4],
.question-type-row > [class*=" col-"][b-s5jnppu1g4] {
    display: flex;
}

.question-type-row .question-type-card[b-s5jnppu1g4] {
    height: 100%;
}

.rating-option-card.selected[b-s5jnppu1g4] {
    border-color: #ffa000;
    background-color: #fff3cd;
    box-shadow: 0 0 0 1px rgba(255, 160, 0, 0.25);
}

.feedback-questions-modal[b-s5jnppu1g4] {
    max-width: 720px;
}

@media (max-width: 768px) {
    .feedback-questions-modal[b-s5jnppu1g4] {
        max-width: 100%;
        margin: 0 1rem;
    }
}

@media (max-width: 576px) {
    .feedback-questions-page[b-s5jnppu1g4] {
        padding: 1rem;
    }

    .filter-search[b-s5jnppu1g4] {
        width: 100%;
        flex: 1 1 100%;
    }
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackSession.razor.rz.scp.css */
/* ==========================================================================
   FeedbackSession — scoped tlt-* atoms for the redesigned page.
   Tokens come from wwwroot/css/talents-tokens.css. Modal/Quill/etc. styles
   below are kept untouched.
   ========================================================================== */

/* Full-screen custom-question editor (replaces the old modal popup). Keeps the
   builder's in-memory state — it's the same component, just a full-page surface. */
.cq-page[b-y9uuy7txk1] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: flex;
    flex-direction: column;
    background: var(--talents-bg);
}

.cq-page__bar[b-y9uuy7txk1] {
    flex: 0 0 auto;
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--talents-border);
    background: var(--talents-surface);
}

.cq-page__titles[b-y9uuy7txk1] {
    max-width: 860px;
    margin: 0 auto;
    width: 100%;
}

.cq-page__back[b-y9uuy7txk1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--talents-label);
    font-size: 13px;
    font-weight: 600;
}

.cq-page__back:hover[b-y9uuy7txk1] {
    color: var(--talents-ink);
}

.cq-page__title[b-y9uuy7txk1] {
    margin: 6px 0 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--talents-ink);
}

.cq-page__subtitle[b-y9uuy7txk1] {
    margin: 2px 0 0;
    font-size: 13px;
    color: var(--talents-muted);
}

.cq-page__body[b-y9uuy7txk1] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: var(--space-5) var(--space-6);
}

.cq-page__content[b-y9uuy7txk1] {
    max-width: 860px;
    margin: 0 auto;
    width: 100%;
}

.cq-page__footer[b-y9uuy7txk1] {
    flex: 0 0 auto;
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-6);
    border-top: 1px solid var(--talents-border);
    background: var(--talents-surface);
}

.feedback-session-page[b-y9uuy7txk1] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

.tlt-page[b-y9uuy7txk1] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Detail header ---------- */

.tlt-detail-header[b-y9uuy7txk1] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-bottom: var(--space-5);
}

.tlt-detail-header__titles[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.tlt-detail-header__title[b-y9uuy7txk1] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.005em;
    line-height: 1.2;
    color: var(--talents-ink);
}

.tlt-page-header__overline[b-y9uuy7txk1] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
}

/* ---------- Two-column layout (narrow sidebar) ---------- */

.tlt-detail-layout[b-y9uuy7txk1] {
    display: grid;
    gap: 20px;
    align-items: start;
}

.tlt-detail-layout--narrow-rail[b-y9uuy7txk1] {
    grid-template-columns: 260px 1fr;
}

.tlt-rail[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tlt-rail--sticky[b-y9uuy7txk1] {
    position: sticky;
    top: 20px;
    align-self: flex-start;
}

.tlt-rail__note[b-y9uuy7txk1] {
    margin: 0;
    padding: 0 4px;
    font-size: 12px;
    color: var(--talents-muted);
}

@media (max-width: 1100px) {
    .tlt-detail-layout--narrow-rail[b-y9uuy7txk1] {
        grid-template-columns: 1fr;
    }

    .tlt-rail--sticky[b-y9uuy7txk1] {
        position: static;
    }
}

/* ---------- Checklist sidebar ---------- */

.tlt-checklist[b-y9uuy7txk1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tlt-checklist__item[b-y9uuy7txk1] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 0;
    background: transparent;
    cursor: pointer;
    color: var(--talents-label);
    font-size: 13px;
    font-weight: 600;
    text-align: left;
    transition: background 150ms ease, color 150ms ease;
}

.tlt-checklist__item:hover[b-y9uuy7txk1] {
    background: var(--talents-pill-bg);
    color: var(--talents-ink);
}

.tlt-checklist__item--done[b-y9uuy7txk1] {
    color: var(--talents-ink);
}

.tlt-checklist__icon[b-y9uuy7txk1] {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.tlt-checklist__icon--done[b-y9uuy7txk1] {
    background: var(--success-bg);
    color: var(--success-text);
}

.tlt-checklist__label[b-y9uuy7txk1] {
    flex: 1;
    min-width: 0;
}

/* ---------- Card ---------- */

.tlt-card[b-y9uuy7txk1] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
}

.tlt-card__head[b-y9uuy7txk1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--talents-border);
}

.tlt-card__title-row[b-y9uuy7txk1] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.tlt-card-icon[b-y9uuy7txk1] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
}

.tlt-card__body[b-y9uuy7txk1] {
    padding: var(--space-5);
}

.tlt-section-title[b-y9uuy7txk1] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
    line-height: 1.3;
}

/* ---------- Buttons ---------- */

.tlt-btn[b-y9uuy7txk1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-y9uuy7txk1] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-y9uuy7txk1] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-y9uuy7txk1] {
    background: #1E4256;
}

.tlt-btn--secondary[b-y9uuy7txk1] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-y9uuy7txk1] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--sm[b-y9uuy7txk1] {
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}

/* ---------- Pills ---------- */

.tlt-pill[b-y9uuy7txk1] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 10px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    border: 1px solid transparent;
    white-space: nowrap;
    width: fit-content;
}

.tlt-pill--brand[b-y9uuy7txk1] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    border-color: var(--info-border);
}

.tlt-pill--outline[b-y9uuy7txk1] {
    background: var(--talents-surface);
    border-color: var(--talents-border-card);
    color: var(--talents-label);
}

/* ---------- Utility ---------- */

.tlt-row[b-y9uuy7txk1] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.tlt-col[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tlt-cell-muted[b-y9uuy7txk1] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Empty state ---------- */

.tlt-empty[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty__icon[b-y9uuy7txk1] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-y9uuy7txk1] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-y9uuy7txk1] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}

/* ==========================================================================
   Existing modal / question-type-card / rating-option-card / group-reviewers
   styles — kept untouched (modals are not redesigned).
   ========================================================================== */

.feedback-questions-modal[b-y9uuy7txk1] {
    max-width: 720px;
}

@media (max-width: 768px) {
    .feedback-questions-modal[b-y9uuy7txk1] {
        max-width: 100%;
        margin: 0 1rem;
    }
}

.question-type-card[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0.25rem;
    align-items: flex-start;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.75rem 1rem;
    background-color: #ffffff;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    text-align: left;
    outline: none;
}

.question-type-card-header[b-y9uuy7txk1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.question-type-card-main[b-y9uuy7txk1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.question-type-card .mud-icon-root[b-y9uuy7txk1] {
    font-size: 1.2rem;
}

.question-type-card .fw-semibold[b-y9uuy7txk1] {
    font-size: 0.95rem;
}

.question-type-card .text-muted[b-y9uuy7txk1] {
    font-size: 0.8rem;
}

.question-type-card:hover[b-y9uuy7txk1] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.2);
    background-color: #f5f9ff;
}

/* Nested rows shown under a grouped question in the session questions list */
.cq-group-rows[b-y9uuy7txk1] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-left: 8px;
    padding-left: 12px;
    border-left: 2px solid rgba(25, 118, 210, 0.2);
}

.cq-group-row[b-y9uuy7txk1] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #4a4a4a;
}

.cq-group-row-required[b-y9uuy7txk1] {
    color: #d32f2f;
    font-weight: 600;
}

.question-type-card.selected[b-y9uuy7txk1] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px rgba(25, 118, 210, 0.25);
    background-color: #e3f2fd;
}

.question-type-card.selected .fw-semibold[b-y9uuy7txk1] {
    color: #0d47a1;
}

.question-type-row > [class^="col-"][b-y9uuy7txk1],
.question-type-row > [class*=" col-"][b-y9uuy7txk1] {
    display: flex;
}

.question-type-row .question-type-card[b-y9uuy7txk1] {
    height: 100%;
}

.rating-options-container[b-y9uuy7txk1] {
    padding: 0;
    border-radius: 0;
    background-color: transparent;
    border: none;
}

.rating-option-card[b-y9uuy7txk1] {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    padding: 0.5rem 0.75rem;
    background-color: #f7f7f7;
    cursor: default;
    transition: none;
    text-align: center;
}

.rating-option-card .mud-icon-root[b-y9uuy7txk1] {
    font-size: 1.4rem;
}

.rating-option-card .fw-semibold[b-y9uuy7txk1] {
    font-size: 0.95rem;
}

.rating-option-card .text-muted[b-y9uuy7txk1] {
    font-size: 0.8rem;
}

.rating-option-card.disabled[b-y9uuy7txk1] {
    opacity: 0.9;
    cursor: not-allowed;
}

.group-reviewers-list[b-y9uuy7txk1] {
    max-height: 240px;
    overflow-y: auto;
}

.group-departments-select[b-y9uuy7txk1] {
    min-width: 320px;
    flex: 1;
}

.group-reviewer-row[b-y9uuy7txk1] {
    gap: 0.75rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid #eeeeee;
}

.group-reviewer-row:last-child[b-y9uuy7txk1] {
    border-bottom: none;
}

.preview-question-chips[b-y9uuy7txk1] {
    min-width: 0;
}

[b-y9uuy7txk1] .preview-question-chip {
    max-width: 100%;
    min-width: 0;
}

[b-y9uuy7txk1] .preview-question-chip .mud-chip-content {
    display: flex;
    align-items: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.2;
}
/* /Components/Pages/Employees/FeedbackPages/FeedbackSessionDetails.razor.rz.scp.css */
/* ==========================================================================
   FeedbackSessionDetails — scoped visual layer aligned to Talents design system.
   Tokens come from wwwroot/css/talents-tokens.css. Dialog/modal/lightbox
   styles below are kept untouched.
   ========================================================================== */

.feedback-session-details[b-pmjrafxdlh] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

.tlt-page[b-pmjrafxdlh] {
    padding: var(--space-6);
    background: var(--talents-bg);
}

/* ---------- Detail header ---------- */

.tlt-detail-header[b-pmjrafxdlh] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

.tlt-detail-header__titles[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.tlt-detail-header__title-row[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.tlt-detail-header__title[b-pmjrafxdlh] {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    color: var(--talents-ink);
}

.tlt-session-id[b-pmjrafxdlh] {
    font-size: 12px;
    color: var(--talents-placeholder);
    font-weight: 600;
}

.tlt-detail-header__pills[b-pmjrafxdlh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tlt-detail-header__actions[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: wrap;
    flex-shrink: 0;
}

.tlt-divider[b-pmjrafxdlh] {
    height: 1px;
    background: var(--talents-border);
    border: 0;
    margin: 16px 0 20px;
}

/* ---------- Two-column layout ---------- */

.tlt-detail-layout[b-pmjrafxdlh] {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 20px;
    align-items: start;
}

.tlt-rail[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (max-width: 1100px) {
    .tlt-detail-layout[b-pmjrafxdlh] {
        grid-template-columns: 1fr;
    }
}

/* ---------- Buttons ---------- */

.tlt-btn[b-pmjrafxdlh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
    text-decoration: none;
}

.tlt-btn:disabled[b-pmjrafxdlh] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tlt-btn--primary[b-pmjrafxdlh] {
    background: var(--talents-ink);
    color: #fff;
}

.tlt-btn--primary:hover:not(:disabled)[b-pmjrafxdlh] {
    background: #1E4256;
}

.tlt-btn--secondary[b-pmjrafxdlh] {
    background: var(--talents-surface);
    color: var(--talents-ink);
    border-color: var(--talents-border-card);
}

.tlt-btn--secondary:hover:not(:disabled)[b-pmjrafxdlh] {
    border-color: var(--talents-muted);
    background: var(--talents-pill-bg);
}

.tlt-btn--danger[b-pmjrafxdlh] {
    background: var(--talents-surface);
    color: var(--error);
    border-color: var(--error);
}

.tlt-btn--danger:hover:not(:disabled)[b-pmjrafxdlh] {
    background: var(--error);
    color: #fff;
    border-color: var(--error);
}

.tlt-btn--sm[b-pmjrafxdlh] {
    height: 30px;
    padding: 0 10px;
    font-size: 12px;
}

/* ---------- Card ---------- */

.tlt-card[b-pmjrafxdlh] {
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
}

.tlt-card__head[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--talents-border);
}

.tlt-card__title-row[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
}

.tlt-card__body[b-pmjrafxdlh] {
    padding: var(--space-5);
}

.tlt-card__body--tight[b-pmjrafxdlh] {
    padding: var(--space-3) var(--space-4);
}

.tlt-overline[b-pmjrafxdlh] {
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-size: 10px;
    font-weight: 700;
    color: var(--talents-placeholder);
    line-height: 1.2;
}

.tlt-section-title[b-pmjrafxdlh] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
    line-height: 1.3;
}

/* ---------- Meta list (left rail Session overview) ---------- */

.tlt-meta-list[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 13px;
}

.tlt-meta-row[b-pmjrafxdlh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.tlt-meta-row__label[b-pmjrafxdlh] {
    color: var(--talents-label);
    font-size: 12px;
}

.tlt-meta-row__value[b-pmjrafxdlh] {
    color: var(--talents-ink);
    font-size: 13px;
    text-align: right;
}

/* ---------- Action stack (left rail Actions card) ---------- */

.tlt-action-stack[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.tlt-action-stack .tlt-btn[b-pmjrafxdlh] {
    justify-content: flex-start;
}

/* ---------- Response progress card ---------- */

.tlt-progress-card[b-pmjrafxdlh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

.tlt-progress-card__value[b-pmjrafxdlh] {
    font-size: 28px;
    font-weight: 700;
    color: var(--talents-ink);
    letter-spacing: -0.01em;
    line-height: 1;
}

.tlt-progress-card__bar[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 260px;
    max-width: 100%;
}

/* ---------- Progress ---------- */

.tlt-progress[b-pmjrafxdlh] {
    height: 4px;
    background: var(--talents-border);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.tlt-progress__fill[b-pmjrafxdlh] {
    height: 100%;
    background: var(--talents-brand);
    border-radius: var(--radius-full);
}

/* ---------- Export rows ---------- */

.tlt-export-row[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--talents-border-card);
    border-radius: 10px;
    background: var(--talents-surface);
}

.tlt-export-row__main[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

/* ---------- Pills ---------- */

.tlt-pill[b-pmjrafxdlh] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 0 10px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    background: var(--talents-pill-bg);
    color: var(--talents-label);
    border: 1px solid transparent;
    white-space: nowrap;
    width: fit-content;
}

.tlt-pill--info[b-pmjrafxdlh] {
    background: var(--info-bg);
    color: var(--brand-700);
    border-color: var(--info-border);
}

.tlt-pill--success[b-pmjrafxdlh] {
    background: var(--success-bg);
    color: var(--success-text);
    border-color: var(--success-border);
}

.tlt-pill--warning[b-pmjrafxdlh] {
    background: var(--warning-bg);
    color: var(--warning-text);
    border-color: var(--warning-border);
}

.tlt-pill--danger[b-pmjrafxdlh] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}

.tlt-pill--outline[b-pmjrafxdlh] {
    background: var(--talents-surface);
    border-color: var(--talents-border-card);
    color: var(--talents-label);
}

.tlt-pill--brand[b-pmjrafxdlh] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
    border-color: var(--info-border);
}

/* ---------- Utility ---------- */

.tlt-row[b-pmjrafxdlh] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.tlt-col[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.tlt-strong[b-pmjrafxdlh] {
    color: var(--talents-ink);
    font-weight: 600;
}

.tlt-cell-muted[b-pmjrafxdlh] {
    color: var(--talents-muted);
    font-size: 12px;
}

/* ---------- Empty state ---------- */

.tlt-empty[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--space-10) var(--space-6);
    gap: var(--space-2);
    background: var(--talents-surface);
    border: 1px solid var(--talents-border-card);
    border-radius: var(--radius-lg2);
}

.tlt-empty--dashed[b-pmjrafxdlh] {
    border-style: dashed;
    box-shadow: none;
}

.tlt-empty__icon[b-pmjrafxdlh] {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-full);
    background: var(--talents-pill-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--talents-brand-strong);
    margin-bottom: var(--space-2);
}

.tlt-empty__title[b-pmjrafxdlh] {
    font-size: 16px;
    font-weight: 600;
    color: var(--talents-ink);
    margin: 0;
}

.tlt-empty__body[b-pmjrafxdlh] {
    font-size: 13px;
    color: var(--talents-muted);
    margin: 0;
    max-width: 42ch;
}

/* ==========================================================================
   Existing dialog / preview / lightbox styles — kept untouched.
   ========================================================================== */

.dialog-overlay[b-pmjrafxdlh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    animation: fadeIn-b-pmjrafxdlh 0.2s ease-in-out;
}

.dialog-container[b-pmjrafxdlh] {
    width: 90%;
    max-width: 800px;
    min-width: 600px;
    max-height: 90vh;
    display: flex;
    animation: slideIn-b-pmjrafxdlh 0.3s ease-out;
}

.dialog-content[b-pmjrafxdlh] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    max-height: 90vh;
    border-radius: 8px;
    overflow: hidden;
    background-color: white;
}

.dialog-header[b-pmjrafxdlh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    background-color: white;
    flex-shrink: 0;
}

.dialog-body[b-pmjrafxdlh] {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px;
    background-color: white;
    min-height: 0;
}

.dialog-footer[b-pmjrafxdlh] {
    display: flex;
    justify-content: flex-end;
    padding: 16px 24px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    background-color: white;
    flex-shrink: 0;
}

/* Animations */

@keyframes fadeIn-b-pmjrafxdlh {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideIn-b-pmjrafxdlh {
    from {
        transform: translateY(-40px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Scrollbar styling */

.dialog-body[b-pmjrafxdlh]::-webkit-scrollbar {
    width: 8px;
}

.dialog-body[b-pmjrafxdlh]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.dialog-body[b-pmjrafxdlh]::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.dialog-body[b-pmjrafxdlh]::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Participants */
[b-pmjrafxdlh] .participant-row {
    width: 100%;
    min-width: 0;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: start !important;
    gap: 12px;
}

[b-pmjrafxdlh] .participant-main {
    min-width: 0;
    flex: 1 1 180px;
    display: flex;
    flex-direction: column;
}

[b-pmjrafxdlh] .participant-name {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    font-weight: 600;
}

[b-pmjrafxdlh] .participant-email {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

[b-pmjrafxdlh] .participant-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}

[b-pmjrafxdlh] .participant-status-chip,
[b-pmjrafxdlh] .participant-resend-btn {
    flex-shrink: 0;
}

/* When the rail is too narrow the whole right cluster (status + resend + close)
   wraps below the name as one unit. */
@media (max-width: 960px) {
    [b-pmjrafxdlh] .participant-actions {
        flex-basis: 100%;
        margin-left: 0;
        margin-top: 4px;
        justify-content: flex-start;
    }
}

/* Lightbox */
.lightbox-overlay[b-pmjrafxdlh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    cursor: zoom-out;
    animation: lightbox-fade-in-b-pmjrafxdlh 0.2s ease;
}

.lightbox-content[b-pmjrafxdlh] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    animation: lightbox-scale-in-b-pmjrafxdlh 0.25s ease;
}

.lightbox-img[b-pmjrafxdlh] {
    display: block;
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.lightbox-close[b-pmjrafxdlh] {
    position: absolute;
    top: -40px;
    right: 0;
    background: rgba(255, 255, 255, 0.15);
    border: none;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    transition: background 0.2s;
}

.lightbox-close:hover[b-pmjrafxdlh] {
    background: rgba(255, 255, 255, 0.3);
}

@keyframes lightbox-fade-in-b-pmjrafxdlh {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes lightbox-scale-in-b-pmjrafxdlh {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* Attachment image preview */
.attachment-image-preview[b-pmjrafxdlh] {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    background: #f8f9fa;
    display: block;
    max-width: fit-content;
    margin-bottom: 1rem;
}

.attachment-preview-img[b-pmjrafxdlh] {
    display: block;
    max-width: 100%;
    max-height: 320px;
    object-fit: contain;
}

/* Export modal */
.export-modal-container[b-pmjrafxdlh] {
    max-width: 700px;
}

.export-response-card[b-pmjrafxdlh] {
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    transition: border-color 0.2s;
}

.export-response-card:hover[b-pmjrafxdlh] {
    border-color: rgba(25, 118, 210, 0.3);
}

.export-selection-answers[b-pmjrafxdlh] {
    padding-left: 28px;
}

.export-selection-item[b-pmjrafxdlh] {
    margin-bottom: 0;
}

/* Preview layout */
.preview-layout[b-pmjrafxdlh] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    animation: slideIn-b-pmjrafxdlh 0.3s ease-out;
}

.pdf-preview-area[b-pmjrafxdlh] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-pmjrafxdlh] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-pmjrafxdlh] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}
/* /Components/Pages/Employees/FeedbackPages/FeedbacksPage.razor.rz.scp.css */
.feedbacks-page[b-meyk4etrcq] {
    padding: 1.5rem;
}

/* Gap between tab headers and tab content */
[b-meyk4etrcq] .feedbacks-tabs-panel {
    padding-top: 1.25rem;
}
/* /Components/Pages/Employees/FeedbackPages/PublicFeedbackShare.razor.rz.scp.css */
.feedback-share-page[b-fzacp3m8kw] {
    min-height: 100vh;
    padding: 40px 24px 64px;
    background: #f8fbfd;
}

.pf-shell[b-fzacp3m8kw] {
    max-width: 880px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pf-state-screen[b-fzacp3m8kw] {
    min-height: calc(100vh - 104px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pf-loading[b-fzacp3m8kw] {
    max-width: 880px;
    margin: 0;
    padding: 88px 24px;
    border-radius: 14px;
    border: 1px solid #e2ebf0;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
}

[b-fzacp3m8kw] .pf-loading-spinner {
    color: #4ac4ff !important;
}

.pf-loading-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 600;
}

.pf-loading-subtitle[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
}

.pf-header[b-fzacp3m8kw] {
    border-radius: 14px;
    border: 1px solid #e2ebf0;
    background: #ffffff;
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.pf-overline[b-fzacp3m8kw] {
    margin: 0;
    color: #9bb8c5;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    font-weight: 700;
}

.pf-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

.pf-title-accent[b-fzacp3m8kw] {
    color: #4ac4ff;
    margin: 0 4px;
}

.pf-title-subject[b-fzacp3m8kw] {
    font-weight: 700;
}

.pf-instructions[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
    line-height: 1.55;
    max-width: 72ch;
    white-space: pre-line;
}

.pf-meta[b-fzacp3m8kw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

[b-fzacp3m8kw] .pf-meta-chip {
    border-radius: 9999px !important;
    background: #f2f5f7 !important;
    color: #4a6878 !important;
    font-weight: 600 !important;
    padding-inline: 8px !important;
}

[b-fzacp3m8kw] .pf-meta-chip .mud-icon-root {
    color: #7a9bad;
}

[b-fzacp3m8kw] .pf-meta-chip--brand {
    background: #e8f8ff !important;
    color: #0a5f8a !important;
}

[b-fzacp3m8kw] .pf-meta-chip--brand .mud-icon-root {
    color: #0d80bb;
}

.pf-alert[b-fzacp3m8kw] {
    border-radius: 12px;
    border: 1px solid #fde68a;
    background: #fffbeb;
    padding: 12px 16px;
    display: flex;
    gap: 10px;
}

[b-fzacp3m8kw] .pf-alert-icon {
    color: #f59e0b;
    margin-top: 2px;
}

.pf-alert-content[b-fzacp3m8kw] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pf-alert-title[b-fzacp3m8kw] {
    margin: 0;
    color: #78350f;
}

.pf-alert-body[b-fzacp3m8kw] {
    margin: 0;
    color: #92400e;
}

.pf-section-label[b-fzacp3m8kw] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #9bb8c5;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.pf-section-label[b-fzacp3m8kw]::before,
.pf-section-label[b-fzacp3m8kw]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #edf2f5;
}

.pf-question[b-fzacp3m8kw] {
    border-radius: 14px;
    border: 1px solid #e2ebf0;
    background: #ffffff;
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

[b-fzacp3m8kw] .pf-question + .pf-question {
    margin-top: 10px !important;
}

.pf-question:hover[b-fzacp3m8kw] {
    border-color: #d8e5ec;
    box-shadow: 0 1px 6px rgba(13, 45, 63, 0.08);
}

.pf-question--answered[b-fzacp3m8kw] {
    border-color: #cfe9f5;
}

.pf-question-header[b-fzacp3m8kw] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.pf-question-number[b-fzacp3m8kw] {
    min-width: 32px;
    height: 32px;
    padding: 0 10px;
    border-radius: 8px;
    background: #0d2d3f;
    color: #4ac4ff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
}

.pf-question-meta[b-fzacp3m8kw] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pf-question-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 600;
    line-height: 1.45;
}

.pf-question-description[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
    white-space: pre-wrap;
}

.pf-question-type[b-fzacp3m8kw] {
    align-self: flex-start;
    border-radius: 9999px;
    background: #f2f5f7;
    color: #9bb8c5;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 4px 10px;
}

.pf-required-star[b-fzacp3m8kw] {
    color: #f43f5e;
    margin-left: 4px;
    font-weight: 700;
}

.pf-rating-scale[b-fzacp3m8kw] {
    display: flex;
    align-items: stretch;
    gap: 14px;
    flex-wrap: wrap;
}

.pf-face-option[b-fzacp3m8kw] {
    min-width: 132px;
    border: 1.5px solid #edf2f5;
    border-radius: 10px;
    padding: 0;
    transition: all 150ms ease;
}

.pf-face-option:hover[b-fzacp3m8kw] {
    border-color: #d8e5ec;
    background: #f8fbfd;
}

.pf-face-option.selected[b-fzacp3m8kw] {
    border-color: #4ac4ff;
    background: #ffffff;
}

[b-fzacp3m8kw] .pf-face-radio {
    margin: 0 !important;
    width: 100%;
}

[b-fzacp3m8kw] .pf-face-radio .mud-radio {
    margin-right: 6px;
}

[b-fzacp3m8kw] .pf-face-radio .mud-radio-content {
    width: 100%;
    padding: 10px 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: center;
    justify-content: center;
}

.pf-face-icon[b-fzacp3m8kw] {
    font-size: 28px;
}

.pf-face-option--low .pf-face-icon[b-fzacp3m8kw] {
    color: #ef4444;
}

.pf-face-option--mid .pf-face-icon[b-fzacp3m8kw] {
    color: #f59e0b;
}

.pf-face-option--high .pf-face-icon[b-fzacp3m8kw] {
    color: #22c55e;
}

.pf-face-option--low .pf-face-label[b-fzacp3m8kw] {
    color: #ef4444;
}

.pf-face-option--mid .pf-face-label[b-fzacp3m8kw] {
    color: #f59e0b;
}

.pf-face-option--high .pf-face-label[b-fzacp3m8kw] {
    color: #22c55e;
}

.pf-face-option.selected.pf-face-option--low .pf-face-icon[b-fzacp3m8kw] {
    color: #f43f5e;
}

.pf-face-option.selected.pf-face-option--mid .pf-face-icon[b-fzacp3m8kw] {
    color: #f59e0b;
}

.pf-face-option.selected.pf-face-option--high .pf-face-icon[b-fzacp3m8kw] {
    color: #22c55e;
}

.pf-face-label[b-fzacp3m8kw] {
    font-size: 12px;
    font-weight: 600;
    color: #7a9bad;
}

.pf-face-option.selected .pf-face-label[b-fzacp3m8kw] {
    color: #0d2d3f;
    font-weight: 700;
}

[b-fzacp3m8kw] .pf-textarea .mud-input-control,
[b-fzacp3m8kw] .pf-textarea .mud-input-slot {
    border-radius: 8px !important;
}

[b-fzacp3m8kw] .pf-textarea .mud-input-outlined-border {
    border: none !important;
}

[b-fzacp3m8kw] .pf-textarea .mud-input-slot {
    border: 1.5px solid #dde8ee !important;
    background: #ffffff;
    padding: 12px 14px !important;
}

[b-fzacp3m8kw] .pf-textarea textarea.mud-input-slot {
    line-height: 1.55 !important;
    min-height: 132px !important;
    overflow-y: hidden !important;
}

[b-fzacp3m8kw] .pf-textarea .mud-input-slot:focus-within {
    border-color: #4ac4ff !important;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.pf-options[b-fzacp3m8kw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ---------- Agreement matrix (grouped) ---------- */

.pf-matrix[b-fzacp3m8kw] {
    display: flex;
    flex-direction: column;
    border: 1px solid #edf2f5;
    border-radius: 10px;
    overflow: hidden;
}

.pf-matrix-row[b-fzacp3m8kw] {
    display: grid;
    grid-template-columns: minmax(150px, 1.8fr) repeat(5, minmax(64px, 1fr));
    align-items: stretch;
}

.pf-matrix-row + .pf-matrix-row[b-fzacp3m8kw] {
    border-top: 1px solid #edf2f5;
}

.pf-matrix-row:not(.pf-matrix-row--head):nth-child(even)[b-fzacp3m8kw] {
    background: #fafcfe;
}

.pf-matrix-row--answered[b-fzacp3m8kw] {
    background: #f3fbff !important;
}

.pf-matrix-row--head[b-fzacp3m8kw] {
    background: #f5f8fa;
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
}

.pf-matrix-label[b-fzacp3m8kw] {
    padding: 12px 14px;
    font-size: 13px;
    color: #1f2d3d;
    display: flex;
    align-items: center;
    border-right: 1px solid #edf2f5;
}

.pf-matrix-col[b-fzacp3m8kw] {
    padding: 10px 6px;
    text-align: center;
    align-self: center;
    line-height: 1.2;
}

.pf-matrix-cell[b-fzacp3m8kw] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 6px;
    cursor: pointer;
}

.pf-matrix-cell input[b-fzacp3m8kw] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.pf-matrix-dot[b-fzacp3m8kw] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid #cbd5e1;
    transition: all 120ms ease;
}

.pf-matrix-cell:hover .pf-matrix-dot[b-fzacp3m8kw] {
    border-color: #4ac4ff;
}

.pf-matrix-cell input:checked + .pf-matrix-dot[b-fzacp3m8kw] {
    border-color: #4ac4ff;
    background: #4ac4ff;
    box-shadow: inset 0 0 0 3px #ffffff;
}

/* ---------- Agreement compact scale ---------- */

.pf-agreement-scale[b-fzacp3m8kw] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pf-agreement-btn[b-fzacp3m8kw] {
    flex: 1 1 0;
    min-width: 96px;
    min-height: 46px;
    padding: 8px 12px;
    border: 1.5px solid #edf2f5;
    border-radius: 10px;
    background: #ffffff;
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    cursor: pointer;
    transition: all 150ms ease;
}

.pf-agreement-btn:not(.pf-agreement-btn--selected):hover[b-fzacp3m8kw] {
    border-color: #d8e5ec;
    background: #f8fbfd;
}

.pf-agreement-btn--selected[b-fzacp3m8kw] {
    border-color: #4ac4ff;
    background: #4ac4ff;
    color: #ffffff;
}

.pf-agreement-btn--selected:hover[b-fzacp3m8kw] {
    border-color: #2bb4f5;
    background: #2bb4f5;
}

/* ---------- 1-10 numeric scale ---------- */

.pf-scale10[b-fzacp3m8kw] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pf-scale10-btn[b-fzacp3m8kw] {
    flex: 1 1 0;
    min-width: 52px;
    height: 52px;
    border: 1.5px solid #edf2f5;
    border-radius: 10px;
    background: #ffffff;
    color: #334155;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 150ms ease;
}

.pf-scale10-btn:not(.pf-scale10-btn--selected):hover[b-fzacp3m8kw] {
    border-color: #d8e5ec;
    background: #f8fbfd;
}

.pf-scale10-btn--selected[b-fzacp3m8kw] {
    border-color: #4ac4ff;
    background: #4ac4ff;
    color: #ffffff;
}

.pf-scale10-btn--selected:hover[b-fzacp3m8kw] {
    border-color: #2bb4f5;
    background: #2bb4f5;
}

[b-fzacp3m8kw] .pf-options.mud-radio-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

[b-fzacp3m8kw] .pf-choice-group,
[b-fzacp3m8kw] .pf-choice-group.mud-radio-group,
[b-fzacp3m8kw] .pf-choice-group .mud-radio-group {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

[b-fzacp3m8kw] .pf-choice-scale .mud-radio-group {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

[b-fzacp3m8kw] .pf-option {
    margin: 0 !important;
    border: 1.5px solid #edf2f5;
    border-radius: 10px;
    padding: 12px 14px;
    background: #ffffff;
    transition: all 150ms ease;
    min-height: 60px;
    width: 100%;
}

[b-fzacp3m8kw] .pf-option:hover {
    border-color: #d8e5ec;
    background: #f8fbfd;
}

[b-fzacp3m8kw] .pf-option .mud-radio-content,
[b-fzacp3m8kw] .pf-option .mud-checkbox {
    width: 100%;
}

[b-fzacp3m8kw] .pf-option .mud-radio,
[b-fzacp3m8kw] .pf-option .mud-checkbox {
    color: #0d2d3f;
}

[b-fzacp3m8kw] .pf-option .mud-typography {
    color: #0d2d3f;
    font-size: 14px;
    font-weight: 500;
}

[b-fzacp3m8kw] .pf-option:not(.pf-option--choice) .mud-radio.mud-checked,
[b-fzacp3m8kw] .pf-option .mud-checkbox.mud-checked {
    color: #4ac4ff !important;
}

[b-fzacp3m8kw] .pf-option:has(.mud-radio.mud-checked),
[b-fzacp3m8kw] .pf-option:has(.mud-checkbox.mud-checked) {
    border-color: #4ac4ff;
    background: #ffffff;
}

[b-fzacp3m8kw] .pf-option--choice:has(.mud-radio.mud-checked) {
    border-color: #4ac4ff !important;
    background: #ffffff;
}

[b-fzacp3m8kw] .pf-option--choice.mud-checked {
    border-color: #4ac4ff !important;
}

[b-fzacp3m8kw] .pf-option--selected-choice {
    border-color: #4ac4ff !important;
    background: #ffffff !important;
}

[b-fzacp3m8kw] .pf-face-option--low .mud-icon-root,
[b-fzacp3m8kw] .pf-face-option--low .pf-face-label {
    color: #ef4444 !important;
}

[b-fzacp3m8kw] .pf-face-option--mid .mud-icon-root,
[b-fzacp3m8kw] .pf-face-option--mid .pf-face-label {
    color: #f59e0b !important;
}

[b-fzacp3m8kw] .pf-face-option--high .mud-icon-root,
[b-fzacp3m8kw] .pf-face-option--high .pf-face-label {
    color: #22c55e !important;
}

[b-fzacp3m8kw] .pf-option--choice .mud-icon-root {
    font-size: 22px !important;
}

[b-fzacp3m8kw] .pf-option--low .mud-icon-root {
    color: #ef4444 !important;
}

[b-fzacp3m8kw] .pf-option--mid .mud-icon-root {
    color: #f59e0b !important;
}

[b-fzacp3m8kw] .pf-option--high .mud-icon-root {
    color: #22c55e !important;
}

[b-fzacp3m8kw] .pf-option-inline {
    width: 100%;
}

[b-fzacp3m8kw] .pf-options--single .pf-option,
[b-fzacp3m8kw] .pf-options--multi .pf-option {
    min-height: 56px;
}

[b-fzacp3m8kw] .pf-options--single.mud-radio-group,
[b-fzacp3m8kw] .pf-options--multi {
    gap: 12px !important;
}

[b-fzacp3m8kw] .pf-options--single,
[b-fzacp3m8kw] .pf-options--single.mud-radio-group,
[b-fzacp3m8kw] .pf-options--single .mud-radio-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

[b-fzacp3m8kw] .pf-options--single.mud-radio-group > .mud-radio {
    margin: 0 0 12px 0 !important;
}

[b-fzacp3m8kw] .pf-options--single.mud-radio-group > .mud-radio:last-child {
    margin-bottom: 0 !important;
}

[b-fzacp3m8kw] .pf-options--single .pf-option {
    display: flex !important;
    width: 100% !important;
}

[b-fzacp3m8kw] .pf-options--single .pf-option .mud-radio-content {
    width: 100% !important;
}

[b-fzacp3m8kw] .pf-options--single .mud-radio {
    margin: 0 !important;
}

.pf-other-field[b-fzacp3m8kw] {
    margin-left: 32px;
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pf-other-label[b-fzacp3m8kw] {
    color: #4a6878;
    font-weight: 600;
}

[b-fzacp3m8kw] .pf-other-input .mud-input-slot {
    border-radius: 8px !important;
    border: 1.5px solid #4ac4ff !important;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.18);
}

.pf-submit[b-fzacp3m8kw] {
    border-radius: 14px;
    border: 1px solid #e2ebf0;
    background: #ffffff;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    position: sticky;
    bottom: 16px;
    box-shadow: 0 2px 16px rgba(13, 45, 63, 0.07);
    margin-top: 4px;
}

.pf-submit-info[b-fzacp3m8kw] {
    min-width: 260px;
}

.pf-submit-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 600;
}

.pf-submit-subtitle[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
}

.pf-submit-subtitle--ok[b-fzacp3m8kw] {
    color: #22c55e;
}

.pf-submit-subtitle--warning[b-fzacp3m8kw] {
    color: #e11d48;
}

.pf-submit-progress[b-fzacp3m8kw] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.pf-progress-track[b-fzacp3m8kw] {
    width: 120px;
    height: 4px;
    border-radius: 9999px;
    background: #edf2f5;
    overflow: hidden;
}

.pf-progress-fill[b-fzacp3m8kw] {
    height: 100%;
    border-radius: 9999px;
    background: #4ac4ff;
    transition: width 200ms ease;
}

.pf-progress-count[b-fzacp3m8kw] {
    font-size: 12px;
    font-weight: 700;
    color: #0d2d3f;
}

.pf-progress-count span[b-fzacp3m8kw] {
    color: #9bb8c5;
    font-weight: 600;
}

[b-fzacp3m8kw] .pf-submit-button {
    background: #0d2d3f !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    text-transform: none !important;
    padding-inline: 22px !important;
}

[b-fzacp3m8kw] .pf-submit-button:hover:not(:disabled) {
    background: #1e4256 !important;
}

[b-fzacp3m8kw] .pf-submit-button:disabled {
    opacity: 0.45;
}

.pf-result[b-fzacp3m8kw] {
    max-width: 880px;
    margin: 0;
    border-radius: 16px;
    border: 1px solid #e2ebf0;
    background: #ffffff;
    padding: 56px 48px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    text-align: center;
}

.pf-result-icon[b-fzacp3m8kw] {
    width: 64px !important;
    height: 64px !important;
}

.pf-result-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.pf-result-body[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
    max-width: 60ch;
    line-height: 1.6;
}

.pf-result-meta[b-fzacp3m8kw] {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}

.pf-result-footnote[b-fzacp3m8kw] {
    margin-top: 14px;
    color: #9bb8c5;
}

[b-fzacp3m8kw] .pf-dialog .mud-dialog {
    border-radius: 16px;
    border: 1px solid #e2ebf0;
    box-shadow: 0 20px 60px rgba(13, 45, 63, 0.22);
    overflow: hidden;
}

.pf-dialog-body[b-fzacp3m8kw] {
    padding: 36px 32px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
}

.pf-dialog-icon[b-fzacp3m8kw] {
    width: 56px !important;
    height: 56px !important;
}

.pf-dialog-title[b-fzacp3m8kw] {
    margin: 0;
    color: #0d2d3f;
    font-weight: 800;
}

.pf-dialog-text[b-fzacp3m8kw] {
    margin: 0;
    color: #7a9bad;
}

[b-fzacp3m8kw] .pf-dialog .mud-dialog-actions {
    border-top: 1px solid #edf2f5;
    padding: 16px 24px;
}

[b-fzacp3m8kw] .pf-dialog-button {
    background: #0d2d3f !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    text-transform: none !important;
}

[b-fzacp3m8kw] .pf-dialog-button:hover {
    background: #1e4256 !important;
}

@media (max-width: 1024px) {
    .feedback-share-page[b-fzacp3m8kw] {
        padding: 24px 16px 40px;
    }

    .pf-header[b-fzacp3m8kw],
    .pf-question[b-fzacp3m8kw],
    .pf-submit[b-fzacp3m8kw],
    .pf-result[b-fzacp3m8kw] {
        padding-inline: 20px;
    }

    .pf-submit[b-fzacp3m8kw] {
        flex-wrap: wrap;
    }
}
/* /Components/Pages/Employees/KudosOverviewPage.razor.rz.scp.css */
.kudos-page[b-hfn6nh1jtc] {
    width: 100%;
    box-sizing: border-box;
    padding: 1.5rem;
    font-family: Inter, sans-serif;
}

/* Tinted content area — lives inside each tab panel so the tab bar sits on the
   page background above it, instead of looking boxed-in on the tint. */
.kudos-body[b-hfn6nh1jtc] {
    background: #F8FBFD;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* ---------- Header ---------- */
.kudos-header[b-hfn6nh1jtc] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
}

.kudos-title[b-hfn6nh1jtc] {
    margin: 0;
    font-weight: 800;
    font-size: 30px;
    color: #0D2D3F;
    letter-spacing: -0.015em;
    line-height: 1.1;
    display: flex;
    align-items: center;
    gap: 11px;
}

.kudos-subtitle[b-hfn6nh1jtc] {
    margin: 7px 0 0;
    font-size: 14px;
    color: #7A9BAD;
}

.kudos-actions[b-hfn6nh1jtc] {
    display: flex;
    gap: 10px;
}

/* ---------- Buttons ---------- */
.kudos-btn[b-hfn6nh1jtc] {
    height: 38px;
    padding: 0 16px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: all 150ms ease-out;
    white-space: nowrap;
}

.kudos-btn:disabled[b-hfn6nh1jtc] { opacity: 0.5; cursor: default; }

.kudos-btn-primary[b-hfn6nh1jtc] { background: #0D2D3F; color: #fff; border: none; }
.kudos-btn-primary:hover:not(:disabled)[b-hfn6nh1jtc] { background: #1E4256; }

.kudos-btn-outline[b-hfn6nh1jtc] { background: #fff; color: #0D2D3F; border-color: #DDE8EE; }
.kudos-btn-outline:hover:not(:disabled)[b-hfn6nh1jtc] { background: #F8FBFD; border-color: #A8E3F7; }

.kudos-btn-danger[b-hfn6nh1jtc] { background: #E11D48; color: #fff; border: none; }
.kudos-btn-danger:hover:not(:disabled)[b-hfn6nh1jtc] { background: #BE123C; }

/* ---------- Stat cards ---------- */
.stat-grid[b-hfn6nh1jtc] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.stat-card[b-hfn6nh1jtc] {
    background: #fff;
    border: 1px solid #E2EBF0;
    border-radius: 12px;
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: box-shadow 150ms ease-out;
}

.stat-card:hover[b-hfn6nh1jtc] { box-shadow: 0 1px 4px rgba(13,45,63,0.06); }

.stat-card-top[b-hfn6nh1jtc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-icon[b-hfn6nh1jtc] {
    width: 44px;
    height: 44px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.stat-icon-balance[b-hfn6nh1jtc] { background: #FBF3DE; color: #B57F12; }
.stat-icon-deposit[b-hfn6nh1jtc] { background: #F0FDF4; color: #16A34A; }
.stat-icon-withdrawal[b-hfn6nh1jtc] { background: #FFF1F2; color: #E11D48; }

.stat-overline[b-hfn6nh1jtc] {
    font-weight: 700;
    font-size: 10px;
    color: #9BB8C5;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.stat-figure[b-hfn6nh1jtc] { display: flex; align-items: center; gap: 8px; }
.stat-figure-value[b-hfn6nh1jtc] { font-weight: 800; font-size: 30px; color: #0D2D3F; letter-spacing: -0.02em; line-height: 1; }
.stat-sub[b-hfn6nh1jtc] { font-size: 12px; color: #7A9BAD; font-weight: 500; }

.stat-stack[b-hfn6nh1jtc] { display: flex; flex-direction: column; gap: 12px; }
.stat-stack-row[b-hfn6nh1jtc] { display: flex; align-items: baseline; gap: 9px; }
.stat-stack-row .val[b-hfn6nh1jtc] { font-weight: 700; font-size: 17px; letter-spacing: -0.01em; line-height: 1; }
.stat-stack-row.stat-stack-big .val[b-hfn6nh1jtc] { font-weight: 800; font-size: 26px; }
.stat-stack-row .lbl[b-hfn6nh1jtc] { font-size: 11.5px; color: #9BB8C5; font-weight: 500; }
.stat-divider[b-hfn6nh1jtc] { height: 1px; background: #EDF2F5; }

/* ---------- Activity card ---------- */
.activity-card[b-hfn6nh1jtc] {
    background: #fff;
    border: 1px solid #E2EBF0;
    border-radius: 12px;
    overflow: hidden;
}

.activity-head[b-hfn6nh1jtc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
    border-bottom: 1px solid #EDF2F5;
    flex-wrap: wrap;
}

.activity-title[b-hfn6nh1jtc] { font-weight: 700; font-size: 18px; color: #0D2D3F; }
.activity-count[b-hfn6nh1jtc] { font-size: 12.5px; color: #9BB8C5; margin-top: 2px; }

.activity-filters[b-hfn6nh1jtc] { display: flex; gap: 10px; align-items: center; }

.search-wrap[b-hfn6nh1jtc] { position: relative; }
.search-wrap .bi[b-hfn6nh1jtc] { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #9BB8C5; font-size: 14px; }
.search-wrap .kudos-input[b-hfn6nh1jtc] { padding-left: 34px; width: 220px; }

.kudos-input[b-hfn6nh1jtc] {
    height: 40px;
    border-radius: 8px;
    border: 1.5px solid #DDE8EE;
    padding: 0 12px;
    font-family: Inter, sans-serif;
    font-size: 13.5px;
    color: #0D2D3F;
    outline: none;
    box-sizing: border-box;
    background: #fff;
}

.kudos-input:focus[b-hfn6nh1jtc] { border-color: #4AC4FF; box-shadow: 0 0 0 3px rgba(74,196,255,0.18); }
.kudos-select[b-hfn6nh1jtc] { min-width: 168px; cursor: pointer; }
.category-filter[b-hfn6nh1jtc] { min-width: 210px; }

/* ---------- Feed ---------- */
.feed-table[b-hfn6nh1jtc] {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

.feed-header[b-hfn6nh1jtc],
.feed-row[b-hfn6nh1jtc],
.feed-empty[b-hfn6nh1jtc] {
    min-width: 1004px;
    box-sizing: border-box;
}

.feed-header[b-hfn6nh1jtc],
.feed-grid[b-hfn6nh1jtc] {
    display: grid;
    grid-template-columns: minmax(200px, 2.1fr) 150px 190px 130px 110px 100px;
    gap: 16px;
    align-items: center;
}

.feed-header[b-hfn6nh1jtc] {
    padding: 11px 22px;
    background: #FAFCFD;
    border-bottom: 1px solid #EDF2F5;
    font-weight: 700;
    font-size: 10px;
    color: #9BB8C5;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.feed-row[b-hfn6nh1jtc] { border-bottom: 1px solid #EDF2F5; transition: background 120ms ease-out; }
.feed-row:hover[b-hfn6nh1jtc] { background: #F8FBFD; }
.feed-grid[b-hfn6nh1jtc] { padding: 11px 22px; }

.ta-right[b-hfn6nh1jtc] { text-align: right; justify-self: end; }

.feed-emp[b-hfn6nh1jtc] { display: flex; align-items: center; gap: 12px; min-width: 0; }
.feed-emp-text[b-hfn6nh1jtc] { min-width: 0; }
.feed-emp-name[b-hfn6nh1jtc] { font-weight: 600; font-size: 14px; color: #0D2D3F; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.feed-emp-name:hover[b-hfn6nh1jtc] { color: #0D80BB; text-decoration: underline; }
.feed-emp-title[b-hfn6nh1jtc] { font-size: 12px; color: #7A9BAD; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.feed-trail[b-hfn6nh1jtc] { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.feed-trail .bal-before[b-hfn6nh1jtc] { font-size: 12px; color: #9BB8C5; font-weight: 500; }
.feed-trail .bi[b-hfn6nh1jtc] { color: #C3D4DD; font-size: 12px; }
.feed-trail .bal-after[b-hfn6nh1jtc] { font-size: 13.5px; color: #0D2D3F; font-weight: 700; }

.feed-date[b-hfn6nh1jtc] { font-size: 12.5px; color: #7A9BAD; white-space: nowrap; }

.feed-comment[b-hfn6nh1jtc] {
    padding: 0 22px 11px 58px;
    margin-top: -4px;
    font-size: 12.5px;
    color: #7A9BAD;
    display: flex;
    align-items: center;
    gap: 7px;
}
.feed-comment .bi[b-hfn6nh1jtc] { color: #C3D4DD; flex: 0 0 auto; }
.feed-comment span[b-hfn6nh1jtc] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 560px; }
.feed-comment-empty[b-hfn6nh1jtc] { color: #9BB8C5; }

.kudos-icon-btn[b-hfn6nh1jtc] {
    width: 28px;
    height: 28px;
    border: 1px solid #DDE8EE;
    border-radius: 8px;
    background: #fff;
    color: #7A9BAD;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex: 0 0 auto;
}

.kudos-icon-btn:hover[b-hfn6nh1jtc] {
    background: #F8FBFD;
    color: #0D80BB;
    border-color: #A8E3F7;
}

.feed-empty[b-hfn6nh1jtc] { padding: 56px 22px; text-align: center; }
.feed-empty-title[b-hfn6nh1jtc] { font-size: 14px; color: #0D2D3F; font-weight: 600; }
.feed-empty-sub[b-hfn6nh1jtc] { font-size: 13px; color: #9BB8C5; margin-top: 4px; }

/* ---------- Tabs ---------- */
[b-hfn6nh1jtc] .kudos-tabs-panel {
    padding: 0;
}

/* ---------- Balances table ---------- */
.bal-header[b-hfn6nh1jtc],
.bal-row[b-hfn6nh1jtc] { min-width: 720px; box-sizing: border-box; }
.bal-header[b-hfn6nh1jtc],
.bal-grid[b-hfn6nh1jtc] {
    display: grid;
    grid-template-columns: minmax(200px, 2fr) minmax(140px, 1.2fr) minmax(180px, 1.6fr) 120px;
    gap: 16px;
    align-items: center;
}
.bal-header[b-hfn6nh1jtc] {
    padding: 11px 22px;
    background: #FAFCFD;
    border-bottom: 1px solid #EDF2F5;
    font-weight: 700;
    font-size: 10px;
    color: #9BB8C5;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}
.bal-row[b-hfn6nh1jtc] { border-bottom: 1px solid #EDF2F5; transition: background 120ms ease-out; }
.bal-row:hover[b-hfn6nh1jtc] { background: #F8FBFD; }
.bal-grid[b-hfn6nh1jtc] { padding: 11px 22px; }
.bal-dept[b-hfn6nh1jtc],
.bal-email[b-hfn6nh1jtc] { font-size: 13px; color: #4A6878; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bal-amount[b-hfn6nh1jtc] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: Inter, sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #0D2D3F;
    white-space: nowrap;
}

.bal-sort[b-hfn6nh1jtc] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}
.bal-sort:hover[b-hfn6nh1jtc] { color: #0D80BB; }
.bal-sort .bi[b-hfn6nh1jtc] { font-size: 11px; opacity: 0.75; }
.bal-header .ta-right .bal-sort[b-hfn6nh1jtc] { justify-content: flex-end; }

/* ---------- Modal ---------- */
.kudos-modal-backdrop[b-hfn6nh1jtc] {
    position: fixed;
    inset: 0;
    background: rgba(13,45,63,0.32);
    z-index: 1400;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 72px 20px 40px;
    overflow-y: auto;
}

.kudos-modal[b-hfn6nh1jtc] {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #E2EBF0;
    box-shadow: 0 2px 16px rgba(13,45,63,0.07);
    width: 100%;
    max-width: 460px;
}

.kudos-modal-head[b-hfn6nh1jtc] {
    padding: 22px 24px 18px;
    border-bottom: 1px solid #EDF2F5;
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.kudos-modal-icon[b-hfn6nh1jtc] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #FBF3DE;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #B57F12;
    font-size: 20px;
}
.kudos-modal-icon.danger[b-hfn6nh1jtc] { background: #FFF1F2; color: #E11D48; }

.kudos-modal-titles[b-hfn6nh1jtc] { flex: 1; }
.kudos-modal-title[b-hfn6nh1jtc] { font-weight: 700; font-size: 18px; color: #0D2D3F; line-height: 1.25; }
.kudos-modal-sub[b-hfn6nh1jtc] { font-size: 13px; color: #7A9BAD; margin-top: 3px; }

.kudos-modal-close[b-hfn6nh1jtc] { background: transparent; border: none; cursor: pointer; color: #9BB8C5; padding: 4px; font-size: 16px; }

.kudos-modal-body[b-hfn6nh1jtc] { padding: 20px 24px; display: flex; flex-direction: column; gap: 16px; }

.kudos-field[b-hfn6nh1jtc] { display: flex; flex-direction: column; gap: 6px; }
.kudos-field > label[b-hfn6nh1jtc] { font-weight: 600; font-size: 12px; color: #4A6878; }
.kudos-field-row[b-hfn6nh1jtc] { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px; }

.kudos-field .kudos-input[b-hfn6nh1jtc] { width: 100%; height: 44px; font-size: 14px; padding: 0 14px; }
.kudos-textarea[b-hfn6nh1jtc] { height: auto; min-height: 82px; padding: 12px 14px; resize: vertical; line-height: 1.5; }

.kudos-error[b-hfn6nh1jtc] { font-size: 12px; color: #E11D48; }

.kudos-balance-pill[b-hfn6nh1jtc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: #F8FBFD;
    border: 1px solid #EDF2F5;
    border-radius: 8px;
    font-size: 12.5px;
    color: #7A9BAD;
    font-weight: 500;
}
.kudos-balance-pill .bal[b-hfn6nh1jtc] { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 14px; color: #0D2D3F; }

.kudos-modal-note[b-hfn6nh1jtc] { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #9BB8C5; }

.kudos-modal-foot[b-hfn6nh1jtc] {
    padding: 16px 24px;
    border-top: 1px solid #EDF2F5;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
/* /Components/Pages/Employees/LearningPathPages/EmployeeLearningPathDetailPage.razor.rz.scp.css */
:host[b-9a1j8es6o4] {
}

.lp-detail-page[b-9a1j8es6o4],
[b-9a1j8es6o4] .lp-detail-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 16px 10px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 26px !important;
}

[b-9a1j8es6o4] .lp-detail-header-block {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  margin-bottom: 8px !important;
}

[b-9a1j8es6o4] .lp-detail-back-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

[b-9a1j8es6o4] .lp-detail-header-row {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
}

[b-9a1j8es6o4] .lp-detail-title {
  margin: 0 !important;
  font-size: 28px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}

[b-9a1j8es6o4] .lp-detail-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  padding-bottom: 4px !important;
}

[b-9a1j8es6o4] .lp-detail-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

[b-9a1j8es6o4] .lp-detail-badge-draft {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-badge-active {
  background: rgba(30, 111, 255, 0.12) !important;
  color: #1e6fff !important;
}

[b-9a1j8es6o4] .lp-detail-badge-completed {
  background: rgba(22, 163, 74, 0.12) !important;
  color: #16a34a !important;
}

[b-9a1j8es6o4] .lp-detail-badge-expired {
  background: rgba(249, 115, 22, 0.12) !important;
  color: #f97316 !important;
}

[b-9a1j8es6o4] .lp-detail-badge-cancelled {
  background: rgba(0, 0, 0, 0.04) !important;
  color: #f44336 !important;
}

[b-9a1j8es6o4] .lp-detail-info-cards {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
  margin-bottom: 4px !important;
}

[b-9a1j8es6o4] .lp-detail-info-card {
  padding: 20px 24px !important;
  border-radius: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

[b-9a1j8es6o4] .lp-detail-info-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.6) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
}

[b-9a1j8es6o4] .lp-detail-info-value {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}

[b-9a1j8es6o4] .lp-detail-info-value-success {
  color: #16a34a !important;
}

.lp-detail-section[b-9a1j8es6o4],
[b-9a1j8es6o4] .lp-detail-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin-top: 10px !important;
}

.lp-detail-section-title[b-9a1j8es6o4],
[b-9a1j8es6o4] .lp-detail-section-title {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.lp-detail-section + .lp-detail-section[b-9a1j8es6o4],
[b-9a1j8es6o4] .lp-detail-section + .lp-detail-section {
  margin-top: 16px !important;
}

[b-9a1j8es6o4] .lp-detail-rich-text {
  padding: 24px !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: rgba(0, 0, 0, 0.87) !important;
  white-space: pre-wrap !important;
}

[b-9a1j8es6o4] .lp-detail-materials-list {
  border-radius: 8px !important;
  overflow: hidden !important;
}

[b-9a1j8es6o4] .lp-detail-empty-materials {
  padding: 28px 24px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-material-group-header {
  padding: 14px 24px 10px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.12) !important;
}

[b-9a1j8es6o4] .lp-detail-materials-list > .lp-detail-material-group-header:first-child {
  border-top: none !important;
}

[b-9a1j8es6o4] .lp-detail-material-group-badge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  border: 1px solid #d7dce7 !important;
  background: #f7f9fc !important;
  color: #5b6477 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

[b-9a1j8es6o4] .lp-detail-material-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
}

[b-9a1j8es6o4] .lp-detail-material-item:last-child {
  border-bottom: none !important;
}

[b-9a1j8es6o4] .lp-detail-material-icon {
  width: 40px !important;
  height: 40px !important;
  border-radius: 6px !important;
  background: rgba(0, 0, 0, 0.04) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-material-info {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

[b-9a1j8es6o4] .lp-detail-material-name {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.87) !important;
}

[b-9a1j8es6o4] .lp-detail-material-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-placeholder {
  padding: 36px 24px !important;
  background: rgba(0, 0, 0, 0.04) !important;
  border: 1px dashed rgba(0, 0, 0, 0.12) !important;
  color: rgba(0, 0, 0, 0.6) !important;
  text-align: center !important;
  border-radius: 8px !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-card {
  padding: 24px !important;
  border-radius: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-rating-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-rating-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-question {
  font-size: 14px !important;
  font-weight: 500 !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-stars {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-score {
  margin-left: 2px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-star-filled {
  color: #f59e0b !important;
}

[b-9a1j8es6o4] .lp-detail-star-empty {
  color: rgba(0, 0, 0, 0.12) !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-comment-block {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 14px !important;
  border-radius: 6px !important;
  background: #f5f5f5 !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-comment-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.6) !important;
  text-transform: uppercase !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-comment-text {
  font-size: 14px !important;
  line-height: 1.6 !important;
}

[b-9a1j8es6o4] .lp-detail-feedback-submitted-date {
  font-size: 13px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-card {
  padding: 24px !important;
  border-radius: 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-item {
  display: flex !important;
  gap: 14px !important;
  align-items: stretch !important;
  min-height: 56px !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-marker {
  width: 32px !important;
  flex: 0 0 32px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-line {
  width: 2px !important;
  flex: 1 1 auto !important;
  background: rgba(0, 0, 0, 0.12) !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-line-top {
  margin-bottom: 6px !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-line-bottom {
  margin-top: 6px !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-item:first-child .lp-detail-timeline-line-top {
  opacity: 0 !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-item:last-child .lp-detail-timeline-line-bottom {
  opacity: 0 !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 32px !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-icon-primary {
  background: rgba(30, 111, 255, 0.12) !important;
  color: #1e6fff !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-icon-success {
  background: rgba(22, 163, 74, 0.12) !important;
  color: #16a34a !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-content {
  flex: 1 !important;
  padding-top: 4px !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-header {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-event {
  font-size: 14px !important;
  font-weight: 500 !important;
}

[b-9a1j8es6o4] .lp-detail-timeline-date {
  font-size: 13px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

.dialog-overlay[b-9a1j8es6o4] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-9a1j8es6o4] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-9a1j8es6o4] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-9a1j8es6o4] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-9a1j8es6o4] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 960px) {
  .preview-layout[b-9a1j8es6o4] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-9a1j8es6o4] {
    width: 100%;
    padding: 16px;
  }
}

/* /Components/Pages/Employees/LearningPathPages/EmployeeLearningPathFormPage.razor.rz.scp.css */
:host[b-webaowwwsd] {
}

[b-webaowwwsd] .lp-source-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 2px 0 !important;
}

[b-webaowwwsd] .lp-source-item-title {
  font-weight: 500 !important;
}

[b-webaowwwsd] .lp-source-item-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

[b-webaowwwsd] .lp-source-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1px 8px !important;
  border-radius: 999px !important;
  background: #e8f4fd !important;
  color: #1976d2 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}

[b-webaowwwsd] .lp-auto-001 {
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 40px !important;
}

[b-webaowwwsd] .lp-auto-002 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-bottom: 16px !important;
}

[b-webaowwwsd] .lp-auto-003 {
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 24px !important;
}

[b-webaowwwsd] .lp-auto-004 {
  padding: 24px !important;
  border-radius: 8px !important;
  margin-bottom: 24px !important;
}

[b-webaowwwsd] .lp-auto-005 {
  font-weight: 600 !important;
  margin-bottom: 16px !important;
}

[b-webaowwwsd] .lp-auto-006 {
  flex: 1 !important;
}

[b-webaowwwsd] .lp-auto-007 {
  font-weight: 600 !important;
  margin-bottom: 16px !important;
}

[b-webaowwwsd] .lp-material-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

[b-webaowwwsd] .lp-material-header-text {
  min-width: 0 !important;
}

[b-webaowwwsd] .lp-material-title {
  margin-bottom: 4px !important;
}

[b-webaowwwsd] .lp-material-subtitle {
  display: block !important;
  margin-bottom: 0 !important;
}

[b-webaowwwsd] .lp-material-section-title {
  margin: 0 0 12px 0 !important;
}

[b-webaowwwsd] .lp-material-add-group {
  white-space: nowrap !important;
}

[b-webaowwwsd] .lp-auto-012 {
  position: sticky !important;
  bottom: 0 !important;
  background: #f5f5f5 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.12) !important;
  padding: 16px 0 !important;
  margin-top: 24px !important;
}

[b-webaowwwsd] .lp-auto-013 {
  margin-top: 6px !important;
}

[b-webaowwwsd] .lp-auto-014 {
  max-width: 240px !important;
  margin-top: 6px !important;
}

[b-webaowwwsd] .lp-auto-015 {
  margin-top: 2px !important;
  display: block !important;
}

[b-webaowwwsd] .lp-form-date-row {
  flex-wrap: wrap !important;
}

[b-webaowwwsd] .lp-material-empty {
  padding: 28px !important;
  border-style: dashed !important;
  text-align: center !important;
  margin-bottom: 16px !important;
}

[b-webaowwwsd] .lp-material-empty-icon {
  color: #4AC4FF !important;
  margin-bottom: 10px !important;
}

[b-webaowwwsd] .lp-material-card {
  border-radius: 10px !important;
  padding: 14px !important;
  margin-bottom: 12px !important;
}

[b-webaowwwsd] .lp-material-card-content {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}

[b-webaowwwsd] .lp-material-icon-wrap {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 8px !important;
  background: #f1f4f9 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #27364d !important;
  margin-top: 4px !important;
}

[b-webaowwwsd] .lp-material-body {
  flex: 1 !important;
  min-width: 0 !important;
}

[b-webaowwwsd] .lp-material-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}

[b-webaowwwsd] .lp-material-name-input {
  flex: 1 !important;
}

[b-webaowwwsd] .lp-material-link-input {
  margin-bottom: 4px !important;
}

[b-webaowwwsd] .lp-material-type-chip {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  border: 1px solid #d7dce7 !important;
  background: #f7f9fc !important;
  color: #5b6477 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

[b-webaowwwsd] .lp-material-actions-row,
[b-webaowwwsd] .lp-material-file-info {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

[b-webaowwwsd] .lp-material-toolbar {
  display: flex !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

[b-webaowwwsd] .lp-material-hint {
  margin-top: 10px !important;
  display: block !important;
}

@media (max-width: 900px) {
  [b-webaowwwsd] .lp-auto-001 {
    padding: 20px !important;
  }
}

@media (max-width: 700px) {
  [b-webaowwwsd] .lp-material-header {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  [b-webaowwwsd] .lp-material-add-group {
    align-self: flex-start !important;
  }

  [b-webaowwwsd] .lp-material-title-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  [b-webaowwwsd] .lp-material-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

.dialog-overlay[b-webaowwwsd] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-webaowwwsd] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-webaowwwsd] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-webaowwwsd] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-webaowwwsd] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 960px) {
  .preview-layout[b-webaowwwsd] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-webaowwwsd] {
    width: 100%;
    padding: 16px;
  }
}

/* /Components/Pages/Employees/LearningPathPages/LearningPathGroupDetailPage.razor.rz.scp.css */
:host[b-2wimqg1x6i] {
}

[b-2wimqg1x6i] .lp-group-detail-page {
  max-width: 1220px !important;
  margin: 0 auto !important;
  padding: 36px 24px 56px !important;
  display: flex;
  flex-direction: column;
  gap: 20px !important;
}

[b-2wimqg1x6i] .lp-group-detail-page > * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

[b-2wimqg1x6i] .lp-group-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px !important;
  margin-bottom: 10px !important;
}

[b-2wimqg1x6i] .lp-group-detail-header-left {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

[b-2wimqg1x6i] .lp-group-detail-back {
  border: none;
  background: transparent;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(0, 0, 0, 0.6);
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
}

[b-2wimqg1x6i] .lp-group-detail-title {
  margin: 0;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

[b-2wimqg1x6i] .lp-group-detail-subtitle {
  margin: 10px 0 0 !important;
  color: rgba(0, 0, 0, 0.6);
  font-size: 15px;
}

[b-2wimqg1x6i] .lp-group-detail-add-panel {
  border-radius: 10px;
  padding: 16px;
}

[b-2wimqg1x6i] .lp-group-detail-add-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

[b-2wimqg1x6i] .lp-group-detail-add-panel-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

[b-2wimqg1x6i] .lp-group-detail-add-search .mud-input-control {
  margin-top: 0;
  margin-bottom: 0;
}

[b-2wimqg1x6i] .lp-group-detail-panel-section-title {
  margin-top: 12px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-panel-section-count {
  display: inline-flex;
  min-width: 20px;
  height: 20px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  background: #f2f6fb;
  color: rgba(0, 0, 0, 0.7);
  font-size: 12px;
  font-weight: 600;
}

[b-2wimqg1x6i] .lp-group-detail-add-list {
  margin-top: 10px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 8px;
  max-height: 230px;
  overflow-y: auto;
}

[b-2wimqg1x6i] .lp-group-detail-add-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  gap: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

[b-2wimqg1x6i] .lp-group-detail-add-row:last-child {
  border-bottom: none;
}

[b-2wimqg1x6i] .lp-group-detail-add-row-copy {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

[b-2wimqg1x6i] .lp-group-detail-add-row-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

[b-2wimqg1x6i] .lp-group-detail-add-name {
  font-size: 14px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.87);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[b-2wimqg1x6i] .lp-group-detail-add-email {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-add-empty {
  padding: 16px;
  text-align: center;
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px !important;
  margin-top: 4px !important;
  margin-bottom: 12px !important;
}

[b-2wimqg1x6i] .lp-group-detail-stat-card {
  padding: 16px;
}

[b-2wimqg1x6i] .lp-group-detail-stat-label {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 8px;
}

[b-2wimqg1x6i] .lp-group-detail-stat-value {
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
}

[b-2wimqg1x6i] .lp-group-detail-table-shell {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px !important;
}

[b-2wimqg1x6i] .lp-group-detail-table-scroll {
  overflow-x: auto;
}

[b-2wimqg1x6i] .lp-group-detail-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 860px;
}

[b-2wimqg1x6i] .lp-group-detail-table th {
  padding: 14px 16px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.6);
  background: #f2f6fb;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  text-align: left;
}

[b-2wimqg1x6i] .lp-group-detail-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  font-size: 14px;
}

[b-2wimqg1x6i] .lp-group-detail-table tr:last-child td {
  border-bottom: none;
}

[b-2wimqg1x6i] .lp-group-detail-sort-btn {
  border: none;
  background: transparent;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
}

[b-2wimqg1x6i] .lp-group-detail-employee-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}

[b-2wimqg1x6i] .lp-group-detail-employee-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

[b-2wimqg1x6i] .lp-group-detail-employee-name {
  font-weight: 500;
}

[b-2wimqg1x6i] .lp-group-detail-employee-name-link {
  border: none;
  background: transparent;
  padding: 0;
  display: block;
  width: 100%;
  font-weight: 500;
  color: #1e6fff;
  text-decoration: underline;
  cursor: pointer;
  text-align: left !important;
  justify-content: flex-start !important;
  align-self: flex-start;
}

[b-2wimqg1x6i] .lp-group-detail-employee-name-link:hover {
  color: #155ad1;
}

[b-2wimqg1x6i] .lp-group-detail-employee-role {
  color: rgba(0, 0, 0, 0.6);
  font-size: 13px;
}

[b-2wimqg1x6i] .lp-group-detail-status-chip,
[b-2wimqg1x6i] .lp-group-detail-ack-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

[b-2wimqg1x6i] .lp-group-detail-status-active {
  background: rgba(30, 111, 255, 0.12);
  color: #1e6fff;
}

[b-2wimqg1x6i] .lp-group-detail-status-completed {
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
}

[b-2wimqg1x6i] .lp-group-detail-status-expired {
  background: rgba(249, 115, 22, 0.12);
  color: #f97316;
}

[b-2wimqg1x6i] .lp-group-detail-status-cancelled,
[b-2wimqg1x6i] .lp-group-detail-status-draft {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-ack-opened {
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
}

[b-2wimqg1x6i] .lp-group-detail-ack-not-opened {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-stars {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #f59e0b;
}

[b-2wimqg1x6i] .lp-group-detail-muted {
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-actions-cell {
  text-align: right;
  white-space: nowrap;
}

[b-2wimqg1x6i] .lp-group-detail-empty-cell {
  text-align: center;
  color: rgba(0, 0, 0, 0.6);
  padding: 24px;
}

[b-2wimqg1x6i] .lp-group-detail-course-card {
  border-radius: 10px;
  overflow: hidden;
  margin-top: 4px !important;
}

[b-2wimqg1x6i] .lp-group-detail-course-header {
  width: 100%;
  border: none;
  background: #ffffff;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  cursor: pointer;
}

[b-2wimqg1x6i] .lp-group-detail-course-label {
  font-size: 13px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 2px;
}

[b-2wimqg1x6i] .lp-group-detail-course-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

[b-2wimqg1x6i] .lp-group-detail-course-body {
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

[b-2wimqg1x6i] .lp-group-detail-course-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[b-2wimqg1x6i] .lp-group-detail-course-block-label {
  font-size: 13px;
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-course-description {
  margin: 0;
  line-height: 1.55;
  color: rgba(0, 0, 0, 0.87);
  white-space: pre-wrap;
}

[b-2wimqg1x6i] .lp-group-detail-course-empty {
  color: rgba(0, 0, 0, 0.6);
}

[b-2wimqg1x6i] .lp-group-detail-materials-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

[b-2wimqg1x6i] .lp-group-detail-material-row {
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 8px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

[b-2wimqg1x6i] .lp-group-detail-material-copy {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

[b-2wimqg1x6i] .lp-group-detail-material-icon {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background: #f2f6fb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

[b-2wimqg1x6i] .lp-group-detail-material-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

[b-2wimqg1x6i] .lp-group-detail-material-name {
  font-size: 14px;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[b-2wimqg1x6i] .lp-group-detail-material-badge {
  display: inline-flex;
  width: fit-content;
  min-height: 22px;
  align-items: center;
  padding: 0 8px;
  border-radius: 4px;
  background: #f2f6fb;
  color: rgba(0, 0, 0, 0.6);
  font-size: 12px;
}

.lp-group-detail-confirm-overlay[b-2wimqg1x6i] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.46);
  z-index: 1299;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

[b-2wimqg1x6i] .lp-group-detail-confirm-dialog {
  width: min(520px, 100%);
  border-radius: 10px;
  padding: 20px;
}

[b-2wimqg1x6i] .lp-group-detail-confirm-title {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 700;
}

[b-2wimqg1x6i] .lp-group-detail-confirm-text {
  margin: 0;
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.76);
}

[b-2wimqg1x6i] .lp-group-detail-confirm-actions {
  margin-top: 18px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.dialog-overlay[b-2wimqg1x6i] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-2wimqg1x6i] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-2wimqg1x6i] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-2wimqg1x6i] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-2wimqg1x6i] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 1000px) {
  [b-2wimqg1x6i] .lp-group-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 780px) {
  [b-2wimqg1x6i] .lp-group-detail-page {
    padding: 20px 12px 36px !important;
  }

  [b-2wimqg1x6i] .lp-group-detail-title {
    font-size: 26px;
  }

  [b-2wimqg1x6i] .lp-group-detail-header {
    flex-direction: column;
  }

  [b-2wimqg1x6i] .lp-group-detail-stats {
    grid-template-columns: 1fr;
  }

  .preview-layout[b-2wimqg1x6i] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-2wimqg1x6i] {
    width: 100%;
    padding: 16px;
  }
}
/* /Components/Pages/Employees/LearningPathPages/LearningPathOverviewPage.razor.rz.scp.css */
:host[b-6ttul38zry] {
}

.lp-overview-page[b-6ttul38zry] {
  max-width: none;
  margin: 0;
  width: 100%;
  padding: 16px 12px 32px !important;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 20px !important;
}

[b-6ttul38zry] .lp-overview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px !important;
  margin-bottom: 8px !important;
}

[b-6ttul38zry] .lp-overview-header-copy {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[b-6ttul38zry] .lp-overview-title {
  margin: 0;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: rgba(0, 0, 0, 0.87);
}

[b-6ttul38zry] .lp-overview-subtitle {
  margin: 0;
  font-size: 15px;
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px !important;
  margin-bottom: 8px !important;
}

[b-6ttul38zry] .lp-overview-stat-card {
  padding: 18px 20px;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.14) !important;
  cursor: pointer;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

[b-6ttul38zry] .lp-overview-stat-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

[b-6ttul38zry] .lp-overview-stat-card-active {
  border: 2px solid var(--mud-palette-primary) !important;
  box-shadow: 0 0 0 1px var(--mud-palette-primary);
  background: rgba(30, 111, 255, 0.03);
}

[b-6ttul38zry] .lp-overview-stat-label {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  margin-bottom: 8px;
}

[b-6ttul38zry] .lp-overview-stat-card-body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

[b-6ttul38zry] .lp-overview-stat-value {
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  color: rgba(0, 0, 0, 0.87);
}

[b-6ttul38zry] .lp-overview-stat-icon {
  font-size: 34px;
  opacity: 0.92;
  margin-top: 2px;
}

[b-6ttul38zry] .lp-overview-stat-card--total .lp-overview-stat-icon {
  color: #1f78ff;
}

[b-6ttul38zry] .lp-overview-stat-card--active .lp-overview-stat-icon {
  color: #1e6fff;
}

[b-6ttul38zry] .lp-overview-stat-card--completed .lp-overview-stat-icon {
  color: #16a34a;
}

[b-6ttul38zry] .lp-overview-stat-card--expired .lp-overview-stat-icon {
  color: #f97316;
}

[b-6ttul38zry] .lp-overview-filters {
  display: grid;
  grid-template-columns: minmax(320px, 1.7fr) minmax(180px, 320px) auto;
  column-gap: 14px !important;
  row-gap: 14px !important;
  align-items: end !important;
  margin-top: 6px !important;
  margin-bottom: 14px !important;
}

[b-6ttul38zry] .lp-overview-filter-search {
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-filter-course {
  width: 100%;
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-filter-status {
  width: 100%;
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-filter-period {
  width: min(100%, 320px);
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-filters .mud-input-control {
  margin-top: 0;
  margin-bottom: 0;
}

[b-6ttul38zry] .lp-overview-filters .mud-button-root {
  justify-self: end;
}

[b-6ttul38zry] .lp-overview-view-toggle {
  display: flex;
  align-items: center;
  gap: 12px !important;
  flex-wrap: wrap;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
}

[b-6ttul38zry] .lp-overview-view-switch {
  display: flex;
  align-items: center;
  gap: 10px !important;
  margin: 0 !important;
}

[b-6ttul38zry] .lp-overview-view-switch-link {
  border: none;
  background: none;
  padding: 0;
  font-weight: 700;
  color: #6b7280;
  cursor: pointer;
  text-decoration: none;
  font-size: 27px;
  line-height: 1.1;
}

[b-6ttul38zry] .lp-overview-view-switch-link.active {
  color: #111827;
  text-decoration: underline;
  text-underline-offset: 4px;
}

[b-6ttul38zry] .lp-overview-view-switch-separator {
  color: #9ca3af;
  font-weight: 600;
  font-size: 24px;
  line-height: 1;
}

[b-6ttul38zry] .lp-overview-groups-launch-btn {
  margin-left: auto !important;
}

[b-6ttul38zry] .lp-overview-table-shell {
  border-radius: 10px;
  overflow: hidden;
  margin-top: 4px !important;
}

[b-6ttul38zry] .lp-overview-table-caption {
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
  background: #ffffff;
}

[b-6ttul38zry] .lp-overview-table-scroll {
  overflow-x: auto;
}

[b-6ttul38zry] .lp-overview-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 980px;
}

[b-6ttul38zry] .lp-overview-table thead th {
  padding: 14px 16px;
  font-size: 13px;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.6);
  text-align: left;
  background: #f2f6fb;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  position: relative;
  overflow: visible;
}

[b-6ttul38zry] .lp-overview-column-header {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-sort-btn {
  border: none;
  background: transparent;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-weight: inherit;
  text-align: left;
}

[b-6ttul38zry] .lp-overview-sort-btn--grow {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  vertical-align: middle;
  font-size: 14px;
}

[b-6ttul38zry] .lp-overview-table tbody tr:last-child td {
  border-bottom: none;
}

[b-6ttul38zry] .lp-overview-table tbody tr:nth-child(even) td {
  background: #f9fbfe;
}

[b-6ttul38zry] .lp-overview-empty {
  padding: 36px 20px;
  text-align: center;
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-employee-cell {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

[b-6ttul38zry] .lp-overview-employee-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

[b-6ttul38zry] .lp-overview-employee-name {
  font-size: 14px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.87);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[b-6ttul38zry] .lp-overview-employee-name-link {
  border: none;
  background: transparent;
  padding: 0;
  display: block;
  width: 100%;
  font-size: 14px;
  font-weight: 500;
  color: #1e6fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: underline;
  cursor: pointer;
  text-align: left !important;
  justify-content: flex-start !important;
  align-self: flex-start;
}

[b-6ttul38zry] .lp-overview-employee-name-link:hover {
  color: #155ad1;
}

[b-6ttul38zry] .lp-overview-employee-role {
  font-size: 13px;
  color: rgba(0, 0, 0, 0.6);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[b-6ttul38zry] .lp-overview-course-link {
  border: none;
  background: transparent;
  color: #1e6fff;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  text-align: left;
}

[b-6ttul38zry] .lp-overview-muted {
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-status-chip,
[b-6ttul38zry] .lp-overview-ack-badge,
[b-6ttul38zry] .lp-overview-group-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

[b-6ttul38zry] .lp-overview-status-active,
[b-6ttul38zry] .lp-overview-group-chip-active {
  background: rgba(30, 111, 255, 0.12);
  color: #1e6fff;
}

[b-6ttul38zry] .lp-overview-status-completed,
[b-6ttul38zry] .lp-overview-group-chip-completed {
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
}

[b-6ttul38zry] .lp-overview-status-expired,
[b-6ttul38zry] .lp-overview-group-chip-expired {
  background: rgba(249, 115, 22, 0.12);
  color: #f97316;
}

[b-6ttul38zry] .lp-overview-status-cancelled {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-status-draft {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-ack-opened {
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
}

[b-6ttul38zry] .lp-overview-ack-not-opened {
  background: rgba(0, 0, 0, 0.06);
  color: rgba(0, 0, 0, 0.6);
}

[b-6ttul38zry] .lp-overview-stars {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #f59e0b;
}

[b-6ttul38zry] .lp-overview-actions-cell {
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  [b-6ttul38zry] .lp-overview-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [b-6ttul38zry] .lp-overview-filters {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }

  [b-6ttul38zry] .lp-overview-filters .mud-button-root {
    justify-self: start;
  }
}

@media (max-width: 760px) {
  .lp-overview-page[b-6ttul38zry] {
    padding: 12px 8px 24px !important;
  }

  [b-6ttul38zry] .lp-overview-title {
    font-size: 26px;
  }

  [b-6ttul38zry] .lp-overview-view-switch-link {
    font-size: 22px;
  }

  [b-6ttul38zry] .lp-overview-view-switch-separator {
    font-size: 20px;
  }

  [b-6ttul38zry] .lp-overview-stats {
    grid-template-columns: 1fr;
  }

  [b-6ttul38zry] .lp-overview-filter-search,
  [b-6ttul38zry] .lp-overview-filter-course,
  [b-6ttul38zry] .lp-overview-filter-status,
  [b-6ttul38zry] .lp-overview-filter-period {
    width: 100%;
    min-width: 0;
  }

  [b-6ttul38zry] .lp-overview-filters {
    grid-template-columns: 1fr;
  }

  [b-6ttul38zry] .lp-overview-groups-launch-btn {
    margin-left: 0;
    width: 100%;
  }
}
/* /Components/Pages/Employees/LearningPathPages/LearningPathsPage.razor.rz.scp.css */
:host[b-ongc2kqmis] {
}

.learning-paths-page[b-ongc2kqmis] {
  padding: 10px !important;
  box-sizing: border-box;
  width: 100%;
}

[b-ongc2kqmis] .learning-paths-page .mud-tabs-panels {
  padding-top: 18px !important;
}

[b-ongc2kqmis] .learning-paths-page .learning-paths-tabs-panel {
  padding-top: 14px !important;
}

[b-ongc2kqmis] .learning-paths-page .mud-tabs-tabbar {
  margin-bottom: 6px !important;
}

@media (max-width: 760px) {
  .learning-paths-page[b-ongc2kqmis] {
    padding: 8px !important;
  }
}
/* /Components/Pages/Employees/LearningPathPages/Library/LibrariesPage.razor.rz.scp.css */
:host[b-b5qnrljklm] {
}

[b-b5qnrljklm] .lp-auto-003 {
  font-size: 15px !important;
}

.lp-auto-001[b-b5qnrljklm] {
  max-width: none;
  margin: 0;
  width: 100%;
  padding: 16px 12px 32px !important;
  box-sizing: border-box;
}

[b-b5qnrljklm] .lp-auto-004 {
  gap: 16px !important;
  flex-wrap: wrap !important;
}

[b-b5qnrljklm] .lp-auto-013 {
  font-weight: 600 !important;
  font-size: 14px !important;
  margin-bottom: 4px !important;
}

[b-b5qnrljklm] .lp-auto-014 {
  font-size: 13px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  max-width: 400px !important;
}

[b-b5qnrljklm] .lp-auto-007 {
  padding: 60px !important;
  text-align: center !important;
  border-style: dashed !important;
  border-radius: 8px !important;
}

[b-b5qnrljklm] .lp-auto-016 {
  margin-right: 6px !important;
  opacity: 0.5 !important;
}

[b-b5qnrljklm] .lp-auto-012 {
  display: grid !important;
  grid-template-columns: minmax(320px, 1.7fr) 180px 180px 250px !important;
  gap: 16px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  cursor: pointer !important;
  transition: background 0.15s !important;
}

[b-b5qnrljklm] .lp-auto-017 {
  font-size: 13px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-b5qnrljklm] .lp-auto-011 {
  display: grid !important;
  grid-template-columns: minmax(320px, 1.7fr) 180px 180px 250px !important;
  gap: 16px !important;
  padding: 14px 20px !important;
  background: #ffffff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-b5qnrljklm] .lp-library-sort-btn {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  gap: 4px !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-align: left !important;
  cursor: pointer !important;
}

[b-b5qnrljklm] .lp-auto-002 {
  font-size: 32px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

[b-b5qnrljklm] .lp-auto-008 {
  opacity: 0.4 !important;
  font-size: 48px !important;
}

[b-b5qnrljklm] .lp-auto-009 {
  font-weight: 600 !important;
}

[b-b5qnrljklm] .lp-auto-005 {
  max-width: 420px !important;
  width: 100% !important;
}

[b-b5qnrljklm] .lp-auto-022 {
  min-width: 240px !important;
  max-width: 320px !important;
  width: 100% !important;
}

[b-b5qnrljklm] .lp-auto-024 {
  margin-left: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

[b-b5qnrljklm] .lp-auto-006 {
  color: rgba(0, 0, 0, 0.6) !important;
  white-space: nowrap !important;
}

[b-b5qnrljklm] .lp-auto-015 {
  font-size: 14px !important;
}

[b-b5qnrljklm] .lp-auto-018 {
  background-color: rgba(17,24,39,.7) !important;
  backdrop-filter: blur(4px) !important;
}

[b-b5qnrljklm] .lp-auto-019 {
  border-radius: 12px !important;
}

[b-b5qnrljklm] .lp-auto-010 {
  border-radius: 8px !important;
  overflow: hidden !important;
}

[b-b5qnrljklm] .lp-auto-020 .mud-button-root {
  min-width: auto !important;
  padding-inline: 10px !important;
}

[b-b5qnrljklm] .lp-auto-021 {
  color: var(--mud-palette-error) !important;
}

[b-b5qnrljklm] .lp-library-launches-link {
  border: none !important;
  background: none !important;
  padding: 0 !important;
  color: var(--mud-palette-primary) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  cursor: pointer !important;
}

@media (max-width: 760px) {
  .lp-auto-001[b-b5qnrljklm] {
    padding: 12px 8px 24px !important;
  }
}


/* /Components/Pages/Employees/LearningPathPages/Library/LibraryDetailPage.razor.rz.scp.css */
:host[b-397t34miil] {
}

[b-397t34miil] .lp-auto-013 {
  border-radius: 8px !important;
  overflow: hidden !important;
}

[b-397t34miil] .lp-auto-009 {
  opacity: 0.6 !important;
}

[b-397t34miil] .lp-auto-004 {
  font-size: 13px !important;
}

[b-397t34miil] .lp-auto-018 {
  display: grid !important;
  grid-template-columns: 1fr 1fr 120px 120px 120px 120px !important;
  gap: 12px !important;
  padding: 14px 24px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
}

[b-397t34miil] .lp-library-launch-link-row {
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

[b-397t34miil] .lp-library-launch-link-row:hover {
  background-color: rgba(30, 111, 255, 0.04) !important;
}

[b-397t34miil] .lp-auto-010 {
  flex: 1 !important;
}

[b-397t34miil] .lp-auto-005 {
  border-radius: 8px !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
}

[b-397t34miil] .lp-auto-016 {
  padding: 40px !important;
  text-align: center !important;
}

[b-397t34miil] .lp-auto-008 {
  padding: 10px 14px !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  border-radius: 6px !important;
}

[b-397t34miil] .lp-auto-006 {
  font-weight: 600 !important;
  margin-bottom: 12px !important;
}

[b-397t34miil] .lp-auto-003 {
  font-size: 28px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 4px !important;
}

[b-397t34miil] .lp-auto-020 {
  font-size: 14px !important;
  font-weight: 600 !important;
}

[b-397t34miil] .lp-library-launch-status {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 24px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

[b-397t34miil] .lp-library-launch-status--active {
  background: rgba(33, 150, 243, 0.08) !important;
  color: rgb(33, 150, 243) !important;
}

[b-397t34miil] .lp-library-launch-status--completed {
  background: rgba(76, 175, 80, 0.08) !important;
  color: rgb(56, 142, 60) !important;
}

[b-397t34miil] .lp-library-launch-status--expired {
  background: rgba(255, 152, 0, 0.1) !important;
  color: rgb(239, 108, 0) !important;
}

[b-397t34miil] .lp-auto-017 {
  display: grid !important;
  grid-template-columns: 1fr 1fr 120px 120px 120px 120px !important;
  gap: 12px !important;
  padding: 12px 24px !important;
  background: #ffffff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-397t34miil] .lp-auto-017 > span:nth-child(n + 3),
[b-397t34miil] .lp-auto-018 > span:nth-child(n + 3) {
  display: flex !important;
  justify-content: center !important;
}

[b-397t34miil] .lp-auto-015 {
  font-weight: 600 !important;
  margin: 0 !important;
}

[b-397t34miil] .lp-auto-001 {
  max-width: 1220px !important;
  margin: 0 auto !important;
  padding: 40px 32px 64px !important;
}

[b-397t34miil] .lp-auto-014 {
  padding: 20px 24px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
}

[b-397t34miil] .lp-auto-019 {
  font-size: 14px !important;
}

[b-397t34miil] .lp-auto-011 {
  font-weight: 500 !important;
  font-size: 14px !important;
}

[b-397t34miil] .lp-auto-002 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-bottom: 16px !important;
}

[b-397t34miil] .lp-auto-012 {
  font-size: 12px !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-397t34miil] .lp-auto-021 {
  background-color: rgba(17,24,39,.7) !important;
  backdrop-filter: blur(4px) !important;
}

[b-397t34miil] .lp-auto-022 {
  border-radius: 12px !important;
}

[b-397t34miil] .lp-auto-023 {
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

[b-397t34miil] .lp-auto-007 {
  white-space: pre-wrap !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

.dialog-overlay[b-397t34miil] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-397t34miil] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-397t34miil] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-397t34miil] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-397t34miil] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 960px) {
  .preview-layout[b-397t34miil] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-397t34miil] {
    width: 100%;
    padding: 16px;
  }
}


/* /Components/Pages/Employees/LearningPathPages/Library/LibraryFormPage.razor.rz.scp.css */
:host[b-n1hem7kkne] {
}

[b-n1hem7kkne] .lp-auto-002 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-bottom: 16px !important;
}

[b-n1hem7kkne] .lp-auto-005 {
  font-weight: 600 !important;
  margin-bottom: 16px !important;
}

[b-n1hem7kkne] .lp-auto-003 {
  font-size: 32px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 24px !important;
}

[b-n1hem7kkne] .lp-auto-006 {
  font-weight: 600 !important;
  margin: 0 !important;
}

[b-n1hem7kkne] .lp-material-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

[b-n1hem7kkne] .lp-material-header-text {
  min-width: 0 !important;
}

[b-n1hem7kkne] .lp-material-title {
  margin-bottom: 4px !important;
}

[b-n1hem7kkne] .lp-material-subtitle {
  display: block !important;
  margin-bottom: 0 !important;
}

[b-n1hem7kkne] .lp-material-section-title {
  margin: 0 0 12px 0 !important;
}

[b-n1hem7kkne] .lp-material-add-group {
  white-space: nowrap !important;
}

[b-n1hem7kkne] .lp-auto-001 {
  max-width: 800px !important;
  margin: 0 auto !important;
  padding: 40px !important;
}

[b-n1hem7kkne] .lp-auto-012 {
  position: sticky !important;
  bottom: 0 !important;
  background: #f5f5f5 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.12) !important;
  padding: 16px 0 !important;
  margin-top: 24px !important;
}

[b-n1hem7kkne] .lp-auto-009 {
  font-weight: 600 !important;
}

[b-n1hem7kkne] .lp-material-empty {
  padding: 28px !important;
  border-style: dashed !important;
  text-align: center !important;
  margin-bottom: 16px !important;
}

[b-n1hem7kkne] .lp-material-empty-icon {
  color: #4AC4FF !important;
  margin-bottom: 10px !important;
}

[b-n1hem7kkne] .lp-auto-004 {
  padding: 24px !important;
  border-radius: 8px !important;
  margin-bottom: 24px !important;
}

[b-n1hem7kkne] .lp-material-card {
  border-radius: 10px !important;
  padding: 14px !important;
  margin-bottom: 12px !important;
}

[b-n1hem7kkne] .lp-material-card-content {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}

[b-n1hem7kkne] .lp-material-icon-wrap {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 8px !important;
  background: #f1f4f9 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #27364d !important;
  margin-top: 4px !important;
}

[b-n1hem7kkne] .lp-material-body {
  flex: 1 !important;
  min-width: 0 !important;
}

[b-n1hem7kkne] .lp-material-title-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 8px !important;
}

[b-n1hem7kkne] .lp-material-name-input {
  flex: 1 !important;
}

[b-n1hem7kkne] .lp-material-link-input {
  margin-bottom: 4px !important;
}

[b-n1hem7kkne] .lp-material-type-chip {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  border: 1px solid #d7dce7 !important;
  background: #f7f9fc !important;
  color: #5b6477 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

[b-n1hem7kkne] .lp-material-actions-row,
[b-n1hem7kkne] .lp-material-file-info {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

[b-n1hem7kkne] .lp-material-toolbar {
  display: flex !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

[b-n1hem7kkne] .lp-material-hint {
  margin-top: 10px !important;
  display: block !important;
}

@media (max-width: 700px) {
  [b-n1hem7kkne] .lp-material-header {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  [b-n1hem7kkne] .lp-material-add-group {
    align-self: flex-start !important;
  }

  [b-n1hem7kkne] .lp-material-title-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  [b-n1hem7kkne] .lp-material-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
  }
}

.dialog-overlay[b-n1hem7kkne] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-n1hem7kkne] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-n1hem7kkne] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-n1hem7kkne] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-n1hem7kkne] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 960px) {
  .preview-layout[b-n1hem7kkne] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-n1hem7kkne] {
    width: 100%;
    padding: 16px;
  }
}

/* /Components/Pages/Employees/LearningPathPages/Library/LibraryLaunchPage.razor.rz.scp.css */
:host[b-k5uq1j7w0q] {
}

[b-k5uq1j7w0q] .lp-launch-page {
  max-width: 860px !important;
  margin: 0 auto !important;
  padding: 40px 32px 0 !important;
}

[b-k5uq1j7w0q] .lp-launch-shell {
  display: flex !important;
  flex-direction: column !important;
  min-height: calc(100vh - 40px) !important;
}

[b-k5uq1j7w0q] .lp-launch-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  padding-bottom: 24px !important;
  flex: 1 !important;
}

[b-k5uq1j7w0q] .lp-launch-header {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  margin-bottom: 4px !important;
}

[b-k5uq1j7w0q] .lp-launch-back-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  width: fit-content !important;
}

[b-k5uq1j7w0q] .lp-launch-header-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

[b-k5uq1j7w0q] .lp-launch-title {
  margin: 0 !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

[b-k5uq1j7w0q] .lp-launch-subtitle {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

[b-k5uq1j7w0q] .lp-launch-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

[b-k5uq1j7w0q] .lp-launch-card {
  border-radius: 8px !important;
  padding: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

[b-k5uq1j7w0q] .lp-launch-card-title {
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

[b-k5uq1j7w0q] .lp-launch-description {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: rgba(0, 0, 0, 0.6) !important;
  white-space: pre-wrap !important;
}

[b-k5uq1j7w0q] .lp-launch-materials-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

[b-k5uq1j7w0q] .lp-launch-material-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  border-radius: 6px !important;
  padding: 10px 12px !important;
  background: #f7f8fa !important;
}

[b-k5uq1j7w0q] .lp-launch-material-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 6px !important;
  background: #f3f4f6 !important;
  color: rgba(0, 0, 0, 0.6) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

[b-k5uq1j7w0q] .lp-launch-material-info {
  flex: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

[b-k5uq1j7w0q] .lp-launch-material-name {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.87) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

[b-k5uq1j7w0q] .lp-launch-material-badge {
  width: fit-content !important;
  display: inline-flex !important;
  align-items: center !important;
  height: 22px !important;
  padding: 0 8px !important;
  border-radius: 4px !important;
  font-size: 12px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  background: #f1f4f9 !important;
}

[b-k5uq1j7w0q] .lp-launch-row-2 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
}

[b-k5uq1j7w0q] .lp-launch-date-field {
  min-width: 0 !important;
}

[b-k5uq1j7w0q] .lp-launch-helper-text {
  margin-top: -8px !important;
}

[b-k5uq1j7w0q] .lp-launch-reminder {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

[b-k5uq1j7w0q] .lp-launch-reminder-days {
  max-width: 220px !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 6px !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  border-radius: 6px !important;
  background: #f7f8fa !important;
  padding: 10px 12px !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-profile {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-copy {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-name {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.87) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

[b-k5uq1j7w0q] .lp-launch-selected-role {
  font-size: 13px !important;
  color: rgba(0, 0, 0, 0.6) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

[b-k5uq1j7w0q] .lp-launch-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 5 !important;
  margin-top: 8px !important;
  padding: 16px 0 28px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.12) !important;
  background: #f7f8fa !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.dialog-overlay[b-k5uq1j7w0q] {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.preview-layout[b-k5uq1j7w0q] {
  width: min(1200px, 95vw);
  height: min(90vh, 860px);
  display: flex;
  gap: 24px;
}

.pdf-preview-area[b-k5uq1j7w0q] {
  flex: 1;
  background: #525659;
  border-radius: 8px;
  overflow: hidden;
}

.pdf-iframe[b-k5uq1j7w0q] {
  width: 100%;
  height: 100%;
  border: none;
}

.preview-sidebar[b-k5uq1j7w0q] {
  width: 240px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

@media (max-width: 900px) {
  [b-k5uq1j7w0q] .lp-launch-page {
    padding: 24px 16px 0 !important;
  }

  [b-k5uq1j7w0q] .lp-launch-title {
    font-size: 28px !important;
  }

  [b-k5uq1j7w0q] .lp-launch-row-2 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  [b-k5uq1j7w0q] .lp-launch-footer {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
  }

  [b-k5uq1j7w0q] .lp-launch-footer .mud-button-root {
    width: 100% !important;
  }

  .preview-layout[b-k5uq1j7w0q] {
    flex-direction: column;
    height: 92vh;
    gap: 16px;
  }

  .preview-sidebar[b-k5uq1j7w0q] {
    width: 100%;
    padding: 16px;
  }
}
/* /Components/Pages/Employees/LearningPathPages/PublicLearningPathShare.razor.rz.scp.css */
.public-learning-share-page[b-3d594n5dxy] {
    background: #f7f8fa;
    min-height: 100vh;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    font-family: "Inter", system-ui, -apple-system, sans-serif;
}

[b-3d594n5dxy] .public-learning-share-page.mud-container {
    padding-left: 0;
    padding-right: 0;
}

.lp-loading[b-3d594n5dxy] {
    min-height: 100vh;
    width: 100%;
}

[b-3d594n5dxy] .lp-pin-card {
    width: 100%;
}

[b-3d594n5dxy] .pin-input-field input {
    text-align: center !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    letter-spacing: 2px;
}

[b-3d594n5dxy] .pin-input-field .mud-input-root {
    height: 60px;
}

.lp-share-shell[b-3d594n5dxy] {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 28px 24px 56px;
}

.lp-share-header[b-3d594n5dxy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}

.lp-share-brand[b-3d594n5dxy] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #0f1724;
}

.lp-share-brand-icon[b-3d594n5dxy] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #1e6fff;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 8px rgba(30, 111, 255, 0.28);
}

.lp-share-page-title[b-3d594n5dxy] {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: #0f1724;
}

.lp-share-card[b-3d594n5dxy] {
    background: #ffffff;
    border: 1px solid #00000014;
    border-radius: 12px;
    box-shadow: 0 14px 36px rgba(15, 23, 36, 0.07);
    padding: 36px;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.lp-share-section[b-3d594n5dxy] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lp-share-overview[b-3d594n5dxy] {
    gap: 10px;
}

.lp-share-chip[b-3d594n5dxy] {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 12px;
    background: #e6f0ff;
    color: #1e6fff;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.lp-share-title[b-3d594n5dxy] {
    margin: 0;
    color: #0f1724;
    font-size: 32px;
    line-height: 1.15;
    font-weight: 650;
    letter-spacing: -0.02em;
}

.lp-share-date[b-3d594n5dxy] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
}

.lp-share-section-title[b-3d594n5dxy] {
    margin: 0;
    color: #0f1724;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.lp-share-body[b-3d594n5dxy] {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.8;
    white-space: pre-wrap;
}

.lp-share-materials-header[b-3d594n5dxy] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.lp-share-materials-icon[b-3d594n5dxy] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: #f3f4f6;
    color: #0f1724;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lp-share-materials-list[b-3d594n5dxy] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.lp-share-material-item[b-3d594n5dxy] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid #00000014;
    border-radius: 10px;
    background: #ffffff;
}

.lp-share-material-icon[b-3d594n5dxy] {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #f2f6fb;
    color: #0f1724;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lp-share-material-info[b-3d594n5dxy] {
    flex: 1;
    min-width: 0;
}

.lp-share-material-name[b-3d594n5dxy] {
    color: #0f1724;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
}

.lp-share-material-meta[b-3d594n5dxy] {
    color: #6b7280;
    font-size: 12px;
    margin-top: 2px;
}

[b-3d594n5dxy] .lp-share-material-action {
    border-radius: 6px;
}

.lp-share-action-area[b-3d594n5dxy] {
    margin-top: 6px;
    padding-top: 26px;
    border-top: 1px solid #00000014;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

[b-3d594n5dxy] .lp-share-complete-btn {
    min-width: 220px;
    border-radius: 999px;
    background: #1e6fff;
    box-shadow: 0 8px 18px rgba(30, 111, 255, 0.28);
}

.lp-share-action-hint[b-3d594n5dxy] {
    margin: 0;
    text-align: center;
    color: #6b7280;
    font-size: 14px;
}

.lp-modal-overlay[b-3d594n5dxy] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lp-preview-overlay[b-3d594n5dxy] {
    position: fixed;
    inset: 0;
    z-index: 1500;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.lp-preview-layout[b-3d594n5dxy] {
    width: min(1200px, 95vw);
    height: min(90vh, 860px);
    display: flex;
    gap: 24px;
}

.lp-preview-area[b-3d594n5dxy] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
}

.lp-preview-iframe[b-3d594n5dxy] {
    width: 100%;
    height: 100%;
    border: none;
}

.lp-preview-sidebar[b-3d594n5dxy] {
    width: 240px;
    background: #ffffff;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.lp-modal-card[b-3d594n5dxy] {
    width: 100%;
    max-width: 520px;
    background: #ffffff;
    border: 1px solid #00000014;
    border-radius: 12px;
    box-shadow: 0 20px 44px rgba(15, 23, 36, 0.24);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.lp-modal-header[b-3d594n5dxy] {
    padding: 28px 28px 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.lp-modal-title[b-3d594n5dxy] {
    margin: 0;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 650;
    color: #0f1724;
}

.lp-modal-subtitle[b-3d594n5dxy] {
    margin: 6px 0 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.lp-modal-close[b-3d594n5dxy] {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.lp-modal-divider[b-3d594n5dxy] {
    height: 1px;
    background: #00000014;
    margin: 22px 28px;
}

.lp-modal-body[b-3d594n5dxy] {
    padding: 0 28px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.lp-rating-row[b-3d594n5dxy] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.lp-rating-label[b-3d594n5dxy] {
    color: #0f1724;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    padding-top: 5px;
}

.lp-rating-stars-wrap[b-3d594n5dxy] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
}

.lp-rating-stars[b-3d594n5dxy] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.lp-rating-star-shell[b-3d594n5dxy] {
    width: 38px;
    height: 38px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.lp-rating-hit[b-3d594n5dxy] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 50%;
    border: 0;
    background: transparent;
    cursor: pointer;
    z-index: 2;
}

.lp-rating-hit-left[b-3d594n5dxy] {
    left: 0;
}

.lp-rating-hit-right[b-3d594n5dxy] {
    right: 0;
}

[b-3d594n5dxy] .lp-rating-star {
    font-size: 32px;
    color: #cbd5e1;
    pointer-events: none;
    transition: color 120ms ease;
}

[b-3d594n5dxy] .lp-rating-star-filled {
    color: #f59e0b;
}

.lp-rating-value[b-3d594n5dxy] {
    color: #6b7280;
    font-size: 12px;
    font-weight: 600;
}

[b-3d594n5dxy] .lp-modal-comment {
    margin-top: -4px;
}

.lp-modal-footer[b-3d594n5dxy] {
    padding: 0 28px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.lp-btn[b-3d594n5dxy] {
    height: 40px;
    border-radius: 6px;
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 600;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: 120ms ease;
}

.lp-btn:disabled[b-3d594n5dxy] {
    cursor: not-allowed;
    opacity: 0.65;
}

.lp-btn-primary[b-3d594n5dxy] {
    background: #1e6fff;
    border-color: #1e6fff;
    color: #ffffff;
    min-width: 158px;
}

.lp-btn-secondary[b-3d594n5dxy] {
    background: #f2f6fb;
    border-color: #00000014;
    color: #0f1724;
    min-width: 120px;
}

.lp-btn-outline[b-3d594n5dxy] {
    background: #ffffff;
    border-color: #1e6fff;
    color: #1e6fff;
    min-width: 180px;
}

.lp-btn-ghost[b-3d594n5dxy] {
    background: transparent;
    border-color: transparent;
    color: #6b7280;
    padding-left: 0;
    padding-right: 0;
}

.lp-submit-spinner[b-3d594n5dxy] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid #ffffff66;
    border-top-color: #ffffff;
    animation: lp-spin-b-3d594n5dxy 0.8s linear infinite;
}

.lp-success-screen[b-3d594n5dxy] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 36px 24px;
}

.lp-success-modal[b-3d594n5dxy] {
    width: 100%;
    max-width: 430px;
    background: #ffffff;
    border: 1px solid #00000014;
    border-radius: 12px;
    box-shadow: 0 22px 40px rgba(15, 23, 36, 0.18);
    overflow: hidden;
    position: relative;
}

.lp-success-close[b-3d594n5dxy] {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 8px;
    background: #f3f4f6;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.lp-success-modal-body[b-3d594n5dxy] {
    padding: 42px 28px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
}

.lp-success-icon-wrap[b-3d594n5dxy] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #16a34a1f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

[b-3d594n5dxy] .lp-success-icon {
    font-size: 30px;
    color: #16a34a;
}

.lp-success-title[b-3d594n5dxy] {
    margin: 0;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 650;
    color: #0f1724;
}

.lp-success-subtitle[b-3d594n5dxy] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.lp-success-summary[b-3d594n5dxy] {
    width: 100%;
    margin-top: 2px;
    border: 1px solid #00000014;
    border-radius: 10px;
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    text-align: left;
}

.lp-success-summary-item[b-3d594n5dxy] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lp-success-summary-label[b-3d594n5dxy] {
    font-size: 12px;
    color: #6b7280;
}

.lp-success-summary-value[b-3d594n5dxy] {
    font-size: 13px;
    color: #0f1724;
    font-weight: 600;
    line-height: 1.4;
}

.lp-success-note[b-3d594n5dxy] {
    width: 100%;
    margin-top: 2px;
    color: #6b7280;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.lp-success-footer[b-3d594n5dxy] {
    border-top: 1px solid #00000014;
    padding: 18px 24px 22px;
    display: flex;
    justify-content: center;
}

.lp-error-screen[b-3d594n5dxy] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 36px 24px;
}

.lp-error-modal[b-3d594n5dxy] {
    width: 100%;
    max-width: 680px;
    border-radius: 10px;
    border: 1px solid #00000014;
    background: #ffffff;
    box-shadow: 0 20px 48px rgba(15, 23, 36, 0.1);
    padding: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
}

.lp-error-modal.already-completed .lp-error-icon-wrap[b-3d594n5dxy] {
    background: #e6f0ff;
}

.lp-error-modal.already-completed[b-3d594n5dxy]  .lp-error-icon {
    color: #1e6fff;
}

.lp-error-modal.unavailable .lp-error-icon-wrap[b-3d594n5dxy] {
    background: #fee2e2;
}

.lp-error-modal.unavailable[b-3d594n5dxy]  .lp-error-icon {
    color: #dc2626;
}

.lp-error-icon-wrap[b-3d594n5dxy] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-3d594n5dxy] .lp-error-icon {
    font-size: 36px;
}

.lp-error-title[b-3d594n5dxy] {
    margin: 0;
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    color: #0f1724;
}

.lp-error-message[b-3d594n5dxy] {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.5;
    max-width: 560px;
}

@keyframes lp-spin-b-3d594n5dxy {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 768px) {
    .lp-share-shell[b-3d594n5dxy] {
        padding: 20px 12px 42px;
    }

    .lp-share-card[b-3d594n5dxy] {
        padding: 20px;
        border-radius: 10px;
        gap: 22px;
    }

    .lp-share-title[b-3d594n5dxy] {
        font-size: 27px;
    }

    .lp-share-section-title[b-3d594n5dxy] {
        font-size: 18px;
    }

    .lp-share-material-item[b-3d594n5dxy] {
        gap: 12px;
        padding: 12px;
    }

    .lp-rating-row[b-3d594n5dxy] {
        flex-direction: column;
        gap: 8px;
    }

    .lp-rating-stars-wrap[b-3d594n5dxy] {
        width: 100%;
        align-items: flex-start;
    }

    .lp-rating-star-shell[b-3d594n5dxy] {
        width: 34px;
        height: 34px;
    }

    [b-3d594n5dxy] .lp-rating-star {
        font-size: 28px;
    }

    .lp-modal-overlay[b-3d594n5dxy] {
        padding: 14px;
    }

    .lp-preview-overlay[b-3d594n5dxy] {
        padding: 14px;
    }

    .lp-preview-layout[b-3d594n5dxy] {
        flex-direction: column;
        height: 92vh;
        gap: 16px;
    }

    .lp-preview-sidebar[b-3d594n5dxy] {
        width: 100%;
        padding: 16px;
    }

    .lp-modal-header[b-3d594n5dxy],
    .lp-modal-body[b-3d594n5dxy],
    .lp-modal-footer[b-3d594n5dxy] {
        padding-left: 18px;
        padding-right: 18px;
    }

    .lp-modal-divider[b-3d594n5dxy] {
        margin-left: 18px;
        margin-right: 18px;
    }

    .lp-modal-footer[b-3d594n5dxy] {
        flex-direction: column;
        align-items: stretch;
    }

    .lp-btn[b-3d594n5dxy] {
        width: 100%;
    }

    .lp-btn-ghost[b-3d594n5dxy] {
        order: 2;
        justify-content: center;
        padding: 0 18px;
    }

    .lp-success-summary[b-3d594n5dxy] {
        grid-template-columns: 1fr;
    }

    .lp-error-modal[b-3d594n5dxy] {
        padding: 22px;
    }

    .lp-error-title[b-3d594n5dxy] {
        font-size: 30px;
    }

    [b-3d594n5dxy] .pin-input-field .mud-input-root {
        width: 52px;
        height: 52px;
    }

    [b-3d594n5dxy] .pin-input-field input {
        font-size: 20px !important;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpDetailsPage.razor.rz.scp.css */
.pdp-details-loading[b-3ncyrgbs0b] {
    min-height: 320px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pdp-details-empty[b-3ncyrgbs0b] {
    margin-top: 16px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    padding: 28px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

.pdp-details-page[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 1.5rem;
}

.pdp-details-breadcrumb[b-3ncyrgbs0b] {
    display: flex;
    align-items: center;
}

.pdp-back-link[b-3ncyrgbs0b] {
    border: none;
    background: transparent;
    color: #334155;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    padding: 0;
}

.pdp-back-link:hover[b-3ncyrgbs0b] {
    text-decoration: underline;
}

.pdp-header-block[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pdp-header-main[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    flex-wrap: wrap;
}

.pdp-header-info[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pdp-title-row[b-3ncyrgbs0b] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.pdp-title-row h2[b-3ncyrgbs0b] {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
    color: #0f172a;
}

.pdp-meta-row[b-3ncyrgbs0b] {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    color: #64748b;
    font-size: 13px;
    font-weight: 500;
}

.pdp-meta-row span[b-3ncyrgbs0b] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pdp-header-actions[b-3ncyrgbs0b] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.pdp-layout[b-3ncyrgbs0b] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 28px;
}

.section-title[b-3ncyrgbs0b] {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e8f0;
}

.goals-list[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 28px;
}

.goal-card[b-3ncyrgbs0b] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    background: #ffffff;
}

.goal-header[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.goal-title[b-3ncyrgbs0b] {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}

.goal-progress[b-3ncyrgbs0b] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.progress-val[b-3ncyrgbs0b] {
    font-size: 13px;
    font-weight: 600;
    width: 40px;
    text-align: right;
}

.progress-bar[b-3ncyrgbs0b] {
    width: 110px;
    height: 8px;
    background: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar .fill[b-3ncyrgbs0b] {
    height: 100%;
    background: #111827;
}

.goal-body[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: -6px;
}

.gb-col[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.gb-label[b-3ncyrgbs0b] {
    font-size: 12px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.goal-body-markdown[b-3ncyrgbs0b] {
    line-height: 1.5;
    color: #1f2937;
}

.goal-markdown :deep(p)[b-3ncyrgbs0b] {
    margin: 0;
}

.goal-markdown :deep(ul)[b-3ncyrgbs0b],
.goal-markdown :deep(ol)[b-3ncyrgbs0b] {
    margin: 0;
    padding-left: 1.2rem;
}

.goal-markdown :deep(li + li)[b-3ncyrgbs0b] {
    margin-top: 0.2rem;
}

.goal-footer[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px dashed #e2e8f0;
    font-size: 13px;
}

.notes-preview[b-3ncyrgbs0b] {
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 70%;
}

.notes-preview strong[b-3ncyrgbs0b] {
    color: #111827;
    font-weight: 500;
}

.last-updated[b-3ncyrgbs0b] {
    color: #64748b;
    white-space: nowrap;
}

.timeline[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 22px;
    position: relative;
    padding-left: 12px;
}

.timeline[b-3ncyrgbs0b]::before {
    content: "";
    position: absolute;
    left: 24px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: #e2e8f0;
}

.timeline-item[b-3ncyrgbs0b] {
    display: flex;
    gap: 18px;
    position: relative;
    z-index: 1;
}

.tl-icon[b-3ncyrgbs0b] {
    width: 26px;
    min-width: 26px;
    height: 26px;
    background: #ffffff;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tl-content[b-3ncyrgbs0b] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 2px;
}

.tl-header[b-3ncyrgbs0b] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.tl-title[b-3ncyrgbs0b] {
    font-size: 14px;
    font-weight: 600;
}

.status-pending[b-3ncyrgbs0b] {
    color: #64748b;
    font-size: 13px;
}

.status-submitted[b-3ncyrgbs0b] {
    color: #16a34a;
    font-size: 13px;
    font-weight: 600;
}

.tl-meta[b-3ncyrgbs0b] {
    color: #64748b;
    font-size: 13px;
}

.tl-summary[b-3ncyrgbs0b] {
    display: inline-block;
    width: fit-content;
    background: #f3f4f6;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.tl-actions[b-3ncyrgbs0b] {
    padding-top: 2px;
}

.checkin-empty[b-3ncyrgbs0b] {
    color: #64748b;
    font-size: 14px;
    padding: 8px 0;
}

.activity-timeline[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    padding-left: 6px;
}

.activity-timeline[b-3ncyrgbs0b]::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 2px;
    bottom: 2px;
    width: 2px;
    background: #e2e8f0;
}

.activity-item[b-3ncyrgbs0b] {
    display: flex;
    gap: 12px;
    position: relative;
    z-index: 1;
}

.activity-icon[b-3ncyrgbs0b] {
    width: 20px;
    min-width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}

.activity-content[b-3ncyrgbs0b] {
    flex: 1;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.activity-header[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
}

.activity-type[b-3ncyrgbs0b] {
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}

.activity-date[b-3ncyrgbs0b] {
    font-size: 12px;
    color: #64748b;
    white-space: nowrap;
}

.activity-details[b-3ncyrgbs0b] {
    font-size: 13px;
    color: #334155;
    line-height: 1.45;
}

.summary-panel[b-3ncyrgbs0b] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    background: #ffffff;
    position: sticky;
    top: 20px;
}

.panel-title[b-3ncyrgbs0b] {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
}

.summary-list[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.summary-item[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.summary-item span[b-3ncyrgbs0b] {
    color: #64748b;
}

.summary-item strong[b-3ncyrgbs0b] {
    color: #111827;
    font-weight: 600;
}

.summary-alert[b-3ncyrgbs0b] {
    border: 1px solid #fde68a;
    border-radius: 8px;
    background: #fffbeb;
    color: #92400e;
    padding: 12px;
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.summary-alert i[b-3ncyrgbs0b] {
    margin-top: 2px;
}

.summary-alert strong[b-3ncyrgbs0b] {
    font-size: 13px;
}

.summary-alert p[b-3ncyrgbs0b] {
    margin: 4px 0 0;
    font-size: 12px;
}

.summary-activity-section[b-3ncyrgbs0b] {
    border-top: 1px solid #e2e8f0;
    padding-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.summary-activity-header[b-3ncyrgbs0b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.summary-activity-header h4[b-3ncyrgbs0b] {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #0f172a;
}

.summary-activity-empty[b-3ncyrgbs0b] {
    color: #64748b;
    font-size: 13px;
}

.summary-activity-list[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.summary-activity-item[b-3ncyrgbs0b] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 8px 10px;
    background: #f8fafc;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.summary-activity-item-head[b-3ncyrgbs0b] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.summary-activity-type[b-3ncyrgbs0b] {
    font-size: 12px;
    font-weight: 600;
    color: #1e293b;
}

.summary-activity-date[b-3ncyrgbs0b] {
    font-size: 11px;
    color: #64748b;
    white-space: nowrap;
}

.summary-activity-details[b-3ncyrgbs0b] {
    font-size: 12px;
    color: #475569;
    line-height: 1.4;
}

.summary-activity-show-more[b-3ncyrgbs0b] {
    align-self: flex-start;
    padding-left: 0;
}

.summary-panel :deep(.mud-button-root)[b-3ncyrgbs0b] {
    text-transform: none;
}

.checkin-modal-backdrop[b-3ncyrgbs0b] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 1500;
    overflow: hidden;
}

.checkin-modal[b-3ncyrgbs0b] {
    width: min(620px, calc(100vw - 40px));
    max-height: 90vh;
    overflow: hidden;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
}

.checkin-modal-header[b-3ncyrgbs0b] {
    padding: 20px 22px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.checkin-modal-header h3[b-3ncyrgbs0b] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
}

.checkin-modal-subtitle[b-3ncyrgbs0b] {
    margin-top: 4px;
    color: #64748b;
    font-size: 13px;
}

.checkin-modal-body[b-3ncyrgbs0b] {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow: auto;
}

.activity-history-modal[b-3ncyrgbs0b] {
    max-height: 90vh;
}

.activity-history-body[b-3ncyrgbs0b] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.checkin-goal-detail[b-3ncyrgbs0b] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.checkin-goal-row[b-3ncyrgbs0b] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

.checkin-goal-title[b-3ncyrgbs0b] {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
}

.checkin-goal-row span[b-3ncyrgbs0b] {
    font-size: 13px;
    font-weight: 600;
    color: #111827;
}

.checkin-goal-notes[b-3ncyrgbs0b] {
    background: #f3f4f6;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.45;
    color: #374151;
}

.checkin-modal-footer[b-3ncyrgbs0b] {
    padding: 16px 22px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.complete-confirmation-modal[b-3ncyrgbs0b] {
    width: min(700px, calc(100vw - 40px));
}

.cancel-confirmation-modal[b-3ncyrgbs0b] {
    width: min(560px, calc(100vw - 40px));
}

.invite-confirmation-modal[b-3ncyrgbs0b] {
    width: min(620px, calc(100vw - 40px));
}

.complete-confirmation-list[b-3ncyrgbs0b] {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.complete-confirmation-item[b-3ncyrgbs0b] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.complete-confirmation-goal[b-3ncyrgbs0b] {
    font-size: 13px;
    color: #1e293b;
}

.complete-confirmation-progress[b-3ncyrgbs0b] {
    font-size: 12px;
    font-weight: 700;
    color: #0f172a;
    white-space: nowrap;
}

@media (max-width: 1024px) {
    .pdp-layout[b-3ncyrgbs0b] {
        grid-template-columns: 1fr;
    }

    .summary-panel[b-3ncyrgbs0b] {
        position: static;
    }
}

@media (max-width: 768px) {
    .pdp-title-row h2[b-3ncyrgbs0b] {
        font-size: 20px;
    }

    .goal-body[b-3ncyrgbs0b] {
        grid-template-columns: 1fr;
    }

    .goal-footer[b-3ncyrgbs0b] {
        flex-direction: column;
        align-items: flex-start;
    }

    .notes-preview[b-3ncyrgbs0b] {
        max-width: 100%;
    }

    .timeline-item[b-3ncyrgbs0b] {
        flex-direction: column;
        gap: 8px;
        padding-left: 34px;
    }

    .tl-icon[b-3ncyrgbs0b] {
        position: absolute;
        left: 0;
        top: 0;
    }

    .tl-actions[b-3ncyrgbs0b] {
        padding-top: 0;
    }

    .activity-header[b-3ncyrgbs0b] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpEditorModal.razor.rz.scp.css */
.pdp-editor-page-loading[b-z501ne6mjl] {
    min-height: 360px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pdp-editor-page[b-z501ne6mjl] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.pdp-back-link[b-z501ne6mjl] {
    border: none;
    background: transparent;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    padding: 0;
    width: fit-content;
}

.pdp-back-link:hover[b-z501ne6mjl] {
    text-decoration: underline;
}

.pdp-editor-header-block[b-z501ne6mjl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.pdp-editor-header-actions[b-z501ne6mjl] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pdp-editor-header-block h1[b-z501ne6mjl] {
    margin: 0;
    font-size: 1.55rem;
}

.pdp-editor-header-block p[b-z501ne6mjl] {
    margin: 6px 0 0;
    color: #64748b;
}

.pdp-editor-header-save-btn[b-z501ne6mjl] {
    white-space: nowrap;
}

.pdp-editor-section[b-z501ne6mjl] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pdp-editor-section-head[b-z501ne6mjl] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pdp-editor-section-head h2[b-z501ne6mjl] {
    margin: 0;
    font-size: 1.15rem;
}

.pdp-editor-section-head p[b-z501ne6mjl] {
    margin: 0;
    color: #64748b;
}

.pdp-goals-header[b-z501ne6mjl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.pdp-goals-header h2[b-z501ne6mjl] {
    margin: 0;
    font-size: 1.15rem;
}

.pdp-goals-header p[b-z501ne6mjl] {
    margin: 2px 0 0;
    color: #64748b;
}

.pdp-goal-card[b-z501ne6mjl] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fbfdff;
}

.pdp-goal-card-header[b-z501ne6mjl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.pdp-goal-card-actions[b-z501ne6mjl] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.pdp-goal-markdown-preview[b-z501ne6mjl] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    overflow: hidden;
}

.pdp-goal-markdown-preview-header[b-z501ne6mjl] {
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    padding: 10px 12px;
}

.pdp-goal-markdown-preview-body[b-z501ne6mjl] {
    padding: 12px;
    color: #1f2937;
    line-height: 1.6;
}

.pdp-goal-markdown-preview-empty[b-z501ne6mjl] {
    padding: 12px;
    color: #64748b;
    font-size: 13px;
}

.pdp-goal-markdown-preview-body :deep(p)[b-z501ne6mjl] {
    margin: 0 0 10px;
}

.pdp-goal-markdown-preview-body :deep(p:last-child)[b-z501ne6mjl] {
    margin-bottom: 0;
}

.pdp-goal-markdown-preview-body :deep(ul)[b-z501ne6mjl],
.pdp-goal-markdown-preview-body :deep(ol)[b-z501ne6mjl] {
    margin: 0 0 10px;
    padding-left: 20px;
}

.pdp-goal-markdown-preview-body :deep(li)[b-z501ne6mjl] {
    margin-bottom: 4px;
}

.pdp-goal-markdown-preview-body :deep(code)[b-z501ne6mjl] {
    background: #f1f5f9;
    border-radius: 4px;
    padding: 1px 4px;
    font-size: 12px;
}

.pdp-goal-markdown-preview-body :deep(pre)[b-z501ne6mjl] {
    background: #0f172a;
    color: #f8fafc;
    border-radius: 8px;
    padding: 10px 12px;
    overflow: auto;
    margin: 0 0 10px;
}

.pdp-goal-divider[b-z501ne6mjl] {
    margin: 4px 0 8px;
    border-color: #e2e8f0;
}

.btn-add-question[b-z501ne6mjl] {
    width: 100%;
    height: 100px;
    background: #ffffff;
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
    text-align: center;
}

.btn-add-question:hover[b-z501ne6mjl] {
    border-color: #2563eb;
    background: #eff6ff;
}

.btn-add-question:disabled[b-z501ne6mjl] {
    cursor: not-allowed;
    opacity: 0.6;
    background: #f8fafc;
}

.add-q-title[b-z501ne6mjl] {
    font-size: 16px;
    font-weight: 600;
    color: #2563eb;
    margin-bottom: 4px;
}

.btn-add-question:disabled .add-q-title[b-z501ne6mjl] {
    color: #64748b;
}

.add-q-sub[b-z501ne6mjl] {
    font-size: 13px;
    color: #6b7280;
}

.pdp-add-goal-btn[b-z501ne6mjl] {
    margin-top: 8px;
}

.pdp-goals-generating-alert[b-z501ne6mjl] {
    margin: 0;
}

.pdp-goals-generating-content[b-z501ne6mjl] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pdp-editor-actions[b-z501ne6mjl] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 8px;
    border-top: 1px solid #e5e7eb;
}

.pdp-modal-backdrop[b-z501ne6mjl] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    z-index: 1200;
}

.pdp-modal[b-z501ne6mjl] {
    background: #ffffff;
    border-radius: 12px;
    width: min(640px, 96vw);
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.18);
}

.pdp-modal-header[b-z501ne6mjl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
}

.pdp-modal-title[b-z501ne6mjl] {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}

.pdp-modal-subtitle[b-z501ne6mjl] {
    margin: 6px 0 0;
    font-size: 13px;
    color: #6b7280;
}

.pdp-modal-close[b-z501ne6mjl] {
    border: none;
    background: transparent;
    color: #6b7280;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 4px;
}

.pdp-modal-close:hover[b-z501ne6mjl] {
    color: #111827;
}

.pdp-modal-body[b-z501ne6mjl] {
    padding: 16px 24px;
    overflow: auto;
}

.pdp-modal-footer[b-z501ne6mjl] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e5e7eb;
}

@media (max-width: 768px) {
    .pdp-editor-header-block[b-z501ne6mjl] {
        flex-direction: column;
        align-items: stretch;
    }

    .pdp-editor-header-actions[b-z501ne6mjl] {
        flex-direction: column;
        align-items: stretch;
    }

    .pdp-editor-header-block h1[b-z501ne6mjl] {
        font-size: 1.3rem;
    }

    .pdp-editor-header-save-btn[b-z501ne6mjl] {
        width: 100%;
    }

    .pdp-goals-header[b-z501ne6mjl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdp-goal-card-header[b-z501ne6mjl] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdp-editor-actions[b-z501ne6mjl] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .pdp-modal-backdrop[b-z501ne6mjl] {
        padding: 12px;
        align-items: flex-end;
    }

    .pdp-modal[b-z501ne6mjl] {
        width: 100%;
        max-height: 92vh;
        border-radius: 12px 12px 0 0;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpGoalsLibraryPages/PdpGoalsLibrariesPage.razor.rz.scp.css */
.pdp-goals-library-page[b-iaxpu4zir9] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.pdp-goals-library-header[b-iaxpu4zir9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.pdp-goals-library-filters[b-iaxpu4zir9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.pdp-goals-library-loading[b-iaxpu4zir9] {
    min-height: 220px;
    display: flex;
    justify-content: center;
    align-items: center;
}

[b-iaxpu4zir9] .pdp-goals-library-empty {
    border: 1px solid #dbe5f1 !important;
    border-radius: 12px;
    padding: 40px 24px;
    background: #ffffff !important;
}

.pdp-goals-library-list[b-iaxpu4zir9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-iaxpu4zir9] .pdp-goals-library-card {
    border: 1px solid #dbe5f1 !important;
    border-radius: 12px;
    padding: 16px 18px !important;
    display: flex;
    flex-direction: column;
    gap: 10px;
    cursor: pointer;
    background: #ffffff !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

[b-iaxpu4zir9] .pdp-goals-library-card:hover {
    border-color: #bfdbfe;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

.pdp-goals-library-card-row[b-iaxpu4zir9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pdp-goals-library-card-row-top h4[b-iaxpu4zir9] {
    margin: 0;
    font-size: 17px;
    font-weight: 600;
    color: #0f172a;
}

.pdp-goals-library-card-meta[b-iaxpu4zir9] {
    color: #64748b;
    font-size: 13px;
    white-space: nowrap;
}

.pdp-goals-library-card-actions[b-iaxpu4zir9] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}

.pdp-goals-library-pagination[b-iaxpu4zir9] {
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

.pdp-goals-library-modal-overlay[b-iaxpu4zir9] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    z-index: 1500;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.pdp-goals-library-delete-modal[b-iaxpu4zir9] {
    width: min(520px, calc(100vw - 40px));
    border-radius: 12px;
    border: 1px solid #dbe5f1;
    background: #ffffff;
    overflow: hidden;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.pdp-goals-library-delete-header[b-iaxpu4zir9] {
    padding: 20px 22px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pdp-goals-library-delete-modal h4[b-iaxpu4zir9] {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    color: #0f172a;
}

.pdp-goals-library-delete-modal p[b-iaxpu4zir9] {
    margin: 0;
    color: #475569;
    font-size: 16px;
    line-height: 1.45;
}

.pdp-goals-library-modal-footer[b-iaxpu4zir9] {
    border-top: 1px solid #e2e8f0;
    padding: 14px 18px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

[b-iaxpu4zir9] .pdp-goals-library-card .mud-chip-root {
    font-weight: 600;
}

[b-iaxpu4zir9] .pdp-goals-library-card-actions .mud-button-root {
    min-width: 0;
}

[b-iaxpu4zir9] .pdp-goals-library-modal-footer .mud-button-root {
    text-transform: none !important;
    font-weight: 600;
    min-width: 96px;
}

[b-iaxpu4zir9] .pdp-goals-library-delete-confirm.mud-button-root {
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.35);
}

[b-iaxpu4zir9] .pdp-goals-library-filters .mud-input-control {
    min-width: min(520px, 100%);
}

@media (max-width: 700px) {
    .pdp-goals-library-filters[b-iaxpu4zir9] {
        flex-direction: column;
        align-items: stretch;
    }

    .pdp-goals-library-card-row[b-iaxpu4zir9] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdp-goals-library-card-actions[b-iaxpu4zir9] {
        margin-left: 0;
        justify-content: flex-start;
    }

    .pdp-goals-library-card-meta[b-iaxpu4zir9] {
        white-space: normal;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpGoalsLibraryPages/PdpGoalsLibraryDetailPage.razor.rz.scp.css */
.pdp-goals-library-detail-page[b-h2jsojw25k] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: min(1100px, 100%);
    margin: 0 auto;
    padding: 12px 0 32px;
}

.pdp-goals-library-detail-loading[b-h2jsojw25k] {
    min-height: 360px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pdp-goals-library-back-link[b-h2jsojw25k] {
    border: none;
    background: transparent;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    padding: 0;
    width: fit-content;
}

.pdp-goals-library-back-link:hover[b-h2jsojw25k] {
    text-decoration: underline;
}

.pdp-goals-library-detail-header[b-h2jsojw25k] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.pdp-goals-library-detail-header h1[b-h2jsojw25k] {
    margin: 0;
    font-size: 1.65rem;
    color: #0f172a;
}

.pdp-goals-library-detail-header p[b-h2jsojw25k] {
    margin: 6px 0 0;
    color: #64748b;
}

[b-h2jsojw25k] .pdp-goals-library-detail-card {
    border: 1px solid #dbe5f1 !important;
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04);
    border-radius: 12px;
    padding: 18px 20px !important;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.pdp-goals-library-detail-card h3[b-h2jsojw25k] {
    margin: 0;
    font-size: 1.15rem;
    color: #0f172a;
}

.pdp-goals-library-detail-goal[b-h2jsojw25k] {
    border: 1px solid #dbe5f1;
    border-radius: 10px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #f8fbff;
}

.pdp-goals-library-detail-goal-title[b-h2jsojw25k] {
    font-size: 14px;
    font-weight: 700;
    color: #334155;
}

.pdp-goals-library-detail-goal-block[b-h2jsojw25k] {
    border: 1px solid #dbe5f1;
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
}

.pdp-goals-library-detail-goal-block-label[b-h2jsojw25k] {
    border-bottom: 1px solid #dbe5f1;
    background: #f3f7fd;
    color: #334155;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    padding: 10px 12px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] {
    padding: 12px;
    color: #1f2937;
    line-height: 1.6;
}

.pdp-goals-library-markdown-empty[b-h2jsojw25k] {
    padding: 12px;
    color: #64748b;
    font-size: 13px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (p) {
    margin: 0 0 10px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (p:last-child) {
    margin-bottom: 0;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (ul),
.pdp-goals-library-markdown-body[b-h2jsojw25k] (ol) {
    margin: 0 0 10px;
    padding-left: 20px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (li) {
    margin-bottom: 4px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (code) {
    background: #f1f5f9;
    border-radius: 4px;
    padding: 1px 4px;
    font-size: 12px;
}

.pdp-goals-library-markdown-body[b-h2jsojw25k] (pre) {
    background: #0f172a;
    color: #f8fafc;
    border-radius: 8px;
    padding: 10px 12px;
    overflow: auto;
    margin: 0 0 10px;
}

@media (max-width: 768px) {
    .pdp-goals-library-detail-page[b-h2jsojw25k] {
        padding: 8px 0 24px;
    }

    .pdp-goals-library-detail-header[b-h2jsojw25k] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpGoalsLibraryPages/PdpGoalsLibraryFormPage.razor.rz.scp.css */
.pdp-goals-library-form-loading[b-9aik4j7bxe] {
    min-height: 360px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pdp-goals-library-form-page[b-9aik4j7bxe] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 1.5rem;
}

.pdp-goals-library-back-link[b-9aik4j7bxe] {
    border: none;
    background: transparent;
    color: #2563eb;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    padding: 0;
    width: fit-content;
}

.pdp-goals-library-back-link:hover[b-9aik4j7bxe] {
    text-decoration: underline;
}

.pdp-goals-library-form-header h1[b-9aik4j7bxe] {
    margin: 0;
    font-size: 1.55rem;
}

.pdp-goals-library-form-header p[b-9aik4j7bxe] {
    margin: 6px 0 0;
    color: #64748b;
}

.pdp-goals-library-form-section[b-9aik4j7bxe] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pdp-goals-library-form-section-head[b-9aik4j7bxe] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pdp-goals-library-form-section-head h2[b-9aik4j7bxe] {
    margin: 0;
    font-size: 1.15rem;
}

.pdp-goals-library-form-section-head p[b-9aik4j7bxe] {
    margin: 0;
    color: #64748b;
}

.pdp-goals-library-form-description-head[b-9aik4j7bxe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.pdp-goals-library-goals-head[b-9aik4j7bxe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.pdp-goals-library-goals-head h2[b-9aik4j7bxe] {
    margin: 0;
    font-size: 1.15rem;
}

.pdp-goals-library-goals-head p[b-9aik4j7bxe] {
    margin: 2px 0 0;
    color: #64748b;
}

.pdp-goals-library-goal-card[b-9aik4j7bxe] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fbfdff;
}

.pdp-goals-library-goal-head[b-9aik4j7bxe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.pdp-goals-library-goal-actions[b-9aik4j7bxe] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.pdp-goals-library-markdown-preview[b-9aik4j7bxe] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    overflow: hidden;
}

.pdp-goals-library-markdown-preview-header[b-9aik4j7bxe] {
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    padding: 10px 12px;
}

.pdp-goals-library-markdown-preview-body[b-9aik4j7bxe] {
    padding: 12px;
    color: #1f2937;
    line-height: 1.6;
}

.pdp-goals-library-markdown-preview-empty[b-9aik4j7bxe] {
    padding: 12px;
    color: #64748b;
    font-size: 13px;
}

.pdp-goals-library-markdown-preview-body :deep(p)[b-9aik4j7bxe] {
    margin: 0 0 10px;
}

.pdp-goals-library-markdown-preview-body :deep(p:last-child)[b-9aik4j7bxe] {
    margin-bottom: 0;
}

.pdp-goals-library-markdown-preview-body :deep(ul)[b-9aik4j7bxe],
.pdp-goals-library-markdown-preview-body :deep(ol)[b-9aik4j7bxe] {
    margin: 0 0 10px;
    padding-left: 20px;
}

.pdp-goals-library-markdown-preview-body :deep(li)[b-9aik4j7bxe] {
    margin-bottom: 4px;
}

.pdp-goals-library-markdown-preview-body :deep(code)[b-9aik4j7bxe] {
    background: #f1f5f9;
    border-radius: 4px;
    padding: 1px 4px;
    font-size: 12px;
}

.pdp-goals-library-markdown-preview-body :deep(pre)[b-9aik4j7bxe] {
    background: #0f172a;
    color: #f8fafc;
    border-radius: 8px;
    padding: 10px 12px;
    overflow: auto;
    margin: 0 0 10px;
}

.pdp-goals-library-goal-divider[b-9aik4j7bxe] {
    margin: 4px 0 8px;
    border-color: #e2e8f0;
}

.pdp-goals-library-add-goal-btn[b-9aik4j7bxe] {
    width: 100%;
    height: 100px;
    background: #ffffff;
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    padding: 0;
    text-align: center;
    margin-top: 8px;
}

.pdp-goals-library-add-goal-btn:hover[b-9aik4j7bxe] {
    border-color: #2563eb;
    background: #eff6ff;
}

.pdp-goals-library-add-goal-title[b-9aik4j7bxe] {
    font-size: 16px;
    font-weight: 600;
    color: #2563eb;
    margin-bottom: 4px;
}

.pdp-goals-library-add-goal-sub[b-9aik4j7bxe] {
    font-size: 13px;
    color: #6b7280;
}

.pdp-goals-library-form-actions[b-9aik4j7bxe] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 8px;
    border-top: 1px solid #e5e7eb;
}

@media (max-width: 768px) {
    .pdp-goals-library-form-page[b-9aik4j7bxe] {
        padding: 1rem;
    }

    .pdp-goals-library-goals-head[b-9aik4j7bxe] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdp-goals-library-goal-head[b-9aik4j7bxe] {
        flex-direction: column;
        align-items: flex-start;
    }

    .pdp-goals-library-form-actions[b-9aik4j7bxe] {
        flex-direction: column-reverse;
        align-items: stretch;
    }
}
/* /Components/Pages/Employees/PdpPages/PdpOverviewPage.razor.rz.scp.css */
.pdp-overview-page[b-ch15uzwupx] {
    padding: 0;
}

.stat-cards-row[b-ch15uzwupx] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.stat-card-col[b-ch15uzwupx] {
    flex: 1 1 0;
    min-width: 150px;
}

.pdp-overview-stat-card[b-ch15uzwupx] {
    border: 2px solid transparent;
    transition: box-shadow 0.2s, border-color 0.2s;
}

.pdp-overview-stat-card[onclick][b-ch15uzwupx],
[b-ch15uzwupx] .stat-cards-row .stat-card-col .mud-card[onclick] {
    cursor: pointer;
}

.pdp-overview-stat-card:hover[b-ch15uzwupx] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

[b-ch15uzwupx] .stat-card-active {
    border: 2px solid var(--mud-palette-primary) !important;
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
}

[b-ch15uzwupx] .pdp-overview-stat-card .stat-card-content,
[b-ch15uzwupx] .pdp-overview-stat-card .mud-card-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    padding: 0.75rem 0.9rem !important;
}

.pdp-overview-stat-card .stat-head-row[b-ch15uzwupx] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.1rem;
}

.pdp-overview-stat-card .stat-icon[b-ch15uzwupx] {
    font-size: 1.1rem;
    margin: 0;
}

.pdp-overview-stat-card .stat-value[b-ch15uzwupx] {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
}

.pdp-overview-stat-card .stat-label[b-ch15uzwupx] {
    font-weight: 600;
    font-size: 0.95rem;
    margin-top: 0.15rem;
}

.pdp-overview-stat-card .stat-sublabel[b-ch15uzwupx] {
    margin-top: 0.35rem;
    font-size: 0.78rem;
    line-height: 1.25;
}

.pdp-overview-stat-card .active-metric-row[b-ch15uzwupx] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-ch15uzwupx] .pdp-overview-stat-card .active-metric-progress {
    flex: 1 1 auto;
    margin-top: 0;
}

.pdp-overview-stat-card .active-metric-percent[b-ch15uzwupx] {
    font-size: 0.74rem;
    font-weight: 600;
    min-width: 2.25rem;
    text-align: right;
    white-space: nowrap;
}

.pdp-overview-page .filters-wrapper[b-ch15uzwupx] {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pdp-overview-page .filter-item[b-ch15uzwupx] {
    flex: 0 0 auto;
    width: 220px;
}

.pdp-overview-page .filter-item.filter-item-employment-status[b-ch15uzwupx] {
    width: 280px;
}

.pdp-overview-page .filter-search[b-ch15uzwupx] {
    flex: 1 1 260px;
    min-width: 220px;
}

.pdp-overview-page .filter-actions[b-ch15uzwupx] {
    display: flex;
    align-items: center;
}

[b-ch15uzwupx] .pdp-overview-page .filter-item .mud-input-control,
[b-ch15uzwupx] .pdp-overview-page .filter-item .mud-select,
[b-ch15uzwupx] .pdp-overview-page .filter-search .mud-input-control {
    width: 100%;
}

.pdp-overview-table-wrapper[b-ch15uzwupx] {
    position: relative;
}

[b-ch15uzwupx] .pdp-overview-table-progress {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
    height: 3px;
}

[b-ch15uzwupx] .pdp-overview-table .mud-table-container {
    overflow-x: hidden;
}

[b-ch15uzwupx] .pdp-overview-table .mud-table-cell {
    padding: 12px 14px;
    vertical-align: top;
}

[b-ch15uzwupx] .pdp-overview-table .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
    white-space: nowrap;
    text-align: left;
}

.pdp-overview-column-header[b-ch15uzwupx] {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.pdp-overview-sort-btn[b-ch15uzwupx] {
    border: none;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    color: inherit;
    cursor: pointer;
    font-size: inherit;
    font-weight: inherit;
    text-align: left;
}

.pdp-overview-sort-btn--grow[b-ch15uzwupx] {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
}

.employee-cell[b-ch15uzwupx] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
}

.employee-meta[b-ch15uzwupx] {
    min-width: 0;
}

.plan-title-cell[b-ch15uzwupx] {
    min-width: 0;
}

.progress-cell[b-ch15uzwupx] {
    width: 92px;
}

.progress-value[b-ch15uzwupx] {
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.progress-track[b-ch15uzwupx] {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.progress-fill[b-ch15uzwupx] {
    height: 100%;
    background: #2e75b6;
    border-radius: 999px;
}

.pdp-status-badge[b-ch15uzwupx] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.pdp-status-badge .status-dot[b-ch15uzwupx] {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    display: inline-block;
}

.pdp-status-badge.status-draft[b-ch15uzwupx] {
    background: #e0f2fe;
    color: #0c4a6e;
}

.pdp-status-badge.status-draft .status-dot[b-ch15uzwupx] {
    background: #0284c7;
}

.pdp-status-badge.status-active[b-ch15uzwupx] {
    background: #dcfce7;
    color: #166534;
}

.pdp-status-badge.status-active .status-dot[b-ch15uzwupx] {
    background: #16a34a;
}

.pdp-status-badge.status-invited[b-ch15uzwupx] {
    background: #fff7ed;
    color: #9a3412;
}

.pdp-status-badge.status-invited .status-dot[b-ch15uzwupx] {
    background: #ea580c;
}

.pdp-status-badge.status-pending[b-ch15uzwupx] {
    background: #fef9c3;
    color: #854d0e;
}

.pdp-status-badge.status-pending .status-dot[b-ch15uzwupx] {
    background: #ca8a04;
}

.pdp-status-badge.status-completed[b-ch15uzwupx] {
    background: rgba(74, 196, 255, 0.15);
    color: #0369a1;
}

.pdp-status-badge.status-completed .status-dot[b-ch15uzwupx] {
    background: #4AC4FF;
}

.pdp-status-badge.status-cancelled[b-ch15uzwupx] {
    background: rgba(244, 67, 54, 0.12);
    color: #c62828;
}

.pdp-status-badge.status-cancelled .status-dot[b-ch15uzwupx] {
    background: #f44336;
}

.pdp-status-badge.status-default[b-ch15uzwupx] {
    background: #f1f5f9;
    color: #334155;
}

.pdp-status-badge.status-default .status-dot[b-ch15uzwupx] {
    background: #64748b;
}

[b-ch15uzwupx] .pdp-overview-empty {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    padding: 28px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

[b-ch15uzwupx] .pdp-overview-empty h4 {
    margin: 0;
}

[b-ch15uzwupx] .pdp-overview-empty p {
    margin: 0;
    color: #64748b;
}
/* /Components/Pages/Employees/PdpPages/PdpsPage.razor.rz.scp.css */
.pdps-page[b-0i9pcdk1ws] {
    padding: 1.5rem;
}

[b-0i9pcdk1ws] .pdps-tabs-panel {
    padding-top: 1.25rem;
}

@media (max-width: 576px) {
    .pdps-page[b-0i9pcdk1ws] {
        padding: 1rem;
    }
}
/* /Components/Pages/Employees/PdpPages/PublicPdpCheckInShare.razor.rz.scp.css */
/* ---------- Tokens ---------- */
.tci-page[b-ww8wtx2aih],
.tci-loading-screen[b-ww8wtx2aih] {
    --brand-50:   #E8F8FF;
    --brand-100:  #C5EDFF;
    --brand-200:  #A8E3F7;
    --brand-400:  #4AC4FF;
    --brand-500:  #1AA3E8;
    --brand-600:  #0D80BB;
    --brand-700:  #0A5F8A;
    --ink:        #0D2D3F;

    --neutral-bg:            #F8FBFD;
    --neutral-surface:       #FAFCFD;
    --neutral-border:        #EDF2F5;
    --neutral-border-strong: #DDE8EE;
    --neutral-muted:         #7A9BAD;
    --neutral-placeholder:   #9BB8C5;
    --neutral-label:         #4A6878;
    --neutral-card-border:   #E2EBF0;
    --neutral-pill-bg:       #F2F5F7;

    --warning:        #F59E0B;
    --error:          #F43F5E;
    --error-bg:       #FFF1F2;
    --error-border:   #FECDD3;
    --error-text:     #E11D48;

    --radius-sm:  6px;
    --radius-md:  8px;
    --radius-lg:  10px;
    --radius-xl:  14px;
    --radius-full: 9999px;

    --shadow-sm:   0 1px 4px rgba(13, 45, 63, 0.06);
    --focus-brand: 0 0 0 3px rgba(74, 196, 255, 0.18);

    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;
    --fw-black:    800;
}

.tci-loading-screen[b-ww8wtx2aih] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--neutral-bg);
}

/* ---------- Page shell ---------- */
.tci-page[b-ww8wtx2aih] {
    min-height: 100vh;
    background: var(--neutral-bg);
    color: var(--ink);
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    display: flex;
    flex-direction: column;
}

/* ---------- Top bar ---------- */
.tci-topbar[b-ww8wtx2aih] {
    height: 64px;
    background: white;
    border-bottom: 1px solid var(--neutral-border);
    display: flex;
    align-items: center;
    padding: 0 40px;
    flex: 0 0 auto;
}
.tci-topbar-inner[b-ww8wtx2aih] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tci-logo[b-ww8wtx2aih] {
    font-size: 18px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.01em;
    user-select: none;
}
.tci-logo-dot[b-ww8wtx2aih] { color: var(--brand-400); }

.tci-topbar-meta[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tci-topbar-meta-icon[b-ww8wtx2aih] {
    width: 14px;
    height: 14px;
    color: var(--brand-400);
}

/* ---------- Main canvas ---------- */
.tci-main[b-ww8wtx2aih] {
    flex: 1;
    display: flex;
    justify-content: center;
    padding: 40px 40px 96px;
}
.tci-container[b-ww8wtx2aih] {
    width: 100%;
    max-width: 1200px;
}

/* ==========================================================================
   Document header
   ========================================================================== */
.tci-doc-header[b-ww8wtx2aih] { margin-bottom: 24px; }

.tci-overline[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    margin-bottom: 16px;
}
.tci-overline-rule[b-ww8wtx2aih] {
    width: 24px;
    height: 1px;
    background: var(--neutral-border-strong);
    display: inline-block;
}
.tci-title[b-ww8wtx2aih] {
    font-size: 32px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.018em;
    line-height: 1.15;
    margin: 0 0 10px 0;
    text-wrap: pretty;
}
.tci-title-dot[b-ww8wtx2aih] { color: var(--brand-400); }

.tci-subtitle[b-ww8wtx2aih] {
    font-size: 14.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
    margin: 0;
    max-width: 640px;
}

/* ==========================================================================
   Context card
   ========================================================================== */
.tci-context[b-ww8wtx2aih] {
    margin-top: 24px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 22px 26px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.8fr) minmax(0, 1.1fr) auto;
    gap: 0 28px;
    align-items: center;
}
.tci-context-cell[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.tci-context-cell + .tci-context-cell[b-ww8wtx2aih] {
    padding-left: 28px;
    border-left: 1px solid var(--neutral-border);
}
.tci-context-label[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tci-context-value[b-ww8wtx2aih] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    line-height: 1.35;
    font-variant-numeric: tabular-nums;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tci-context-id[b-ww8wtx2aih] {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    color: var(--neutral-label);
    font-weight: var(--fw-medium);
    letter-spacing: 0;
}
.tci-context-type[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 4px 10px;
    background: var(--brand-50);
    color: var(--brand-700);
    border: 1px solid var(--brand-100);
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tci-context-type-dot[b-ww8wtx2aih] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--brand-400);
}

/* ==========================================================================
   Section header
   ========================================================================== */
.tci-section-head[b-ww8wtx2aih] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--neutral-border);
    margin: 36px 0 22px 0;
    gap: 16px;
}
.tci-section-title[b-ww8wtx2aih] {
    font-size: 18px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.005em;
    margin: 0;
}
.tci-section-title-count[b-ww8wtx2aih] {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    font-variant-numeric: tabular-nums;
    vertical-align: 1px;
}
.tci-section-progress[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-label);
    font-variant-numeric: tabular-nums;
}
.tci-section-progress-bar[b-ww8wtx2aih] {
    width: 140px;
    height: 6px;
    background: var(--neutral-border);
    border-radius: 9999px;
    overflow: hidden;
    position: relative;
}
.tci-section-progress-fill[b-ww8wtx2aih] {
    position: absolute;
    inset: 0 auto 0 0;
    background: linear-gradient(90deg, var(--brand-500), var(--brand-400));
    border-radius: 9999px;
    transition: width 220ms ease-out;
}
.tci-section-progress-text[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--brand-700);
}

/* ==========================================================================
   Workspace — three columns: nav · main · helper
   ========================================================================== */
.tci-workspace[b-ww8wtx2aih] {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr) 260px;
    gap: 22px;
    align-items: start;
}

/* ---------- Left rail: goal navigation ---------- */
.tci-nav[b-ww8wtx2aih] {
    position: sticky;
    top: 24px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 16px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.tci-nav-head[b-ww8wtx2aih] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2px 6px 10px;
    border-bottom: 1px solid var(--neutral-border);
    margin-bottom: 8px;
}
.tci-nav-title[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-label);
    margin: 0;
}
.tci-nav-count[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    color: var(--neutral-placeholder);
    font-variant-numeric: tabular-nums;
}

.tci-nav-item[b-ww8wtx2aih] {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    padding: 10px 12px;
    display: grid;
    grid-template-columns: 26px 1fr auto;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    text-align: left;
    font-family: var(--font-sans);
    color: var(--ink);
    text-decoration: none;
    transition: background 120ms ease-out, border-color 120ms ease-out;
}
.tci-nav-item:hover[b-ww8wtx2aih] {
    background: var(--neutral-bg);
}
.tci-nav-item.is-active[b-ww8wtx2aih] {
    background: var(--brand-50);
    border-color: var(--brand-200);
}
.tci-nav-item:focus-visible[b-ww8wtx2aih] {
    outline: none;
    box-shadow: var(--focus-brand);
    border-color: var(--brand-400);
}

.tci-nav-num[b-ww8wtx2aih] {
    width: 26px;
    height: 26px;
    border-radius: 9999px;
    background: var(--neutral-pill-bg);
    color: var(--neutral-label);
    font-size: 11.5px;
    font-weight: var(--fw-bold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
    transition: background 120ms ease-out, color 120ms ease-out;
}
.tci-nav-item.is-active .tci-nav-num[b-ww8wtx2aih] {
    background: var(--ink);
    color: var(--brand-400);
}
.tci-nav-item.is-ready .tci-nav-num[b-ww8wtx2aih] {
    background: var(--brand-500);
    color: white;
}
.tci-nav-item.is-active.is-ready .tci-nav-num[b-ww8wtx2aih] {
    background: var(--ink);
    color: var(--brand-400);
}

.tci-nav-label[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.tci-nav-label-name[b-ww8wtx2aih] {
    font-size: 13px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tci-nav-label-progress[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    color: var(--neutral-placeholder);
    font-variant-numeric: tabular-nums;
}
.tci-nav-item.is-ready .tci-nav-label-progress[b-ww8wtx2aih] {
    color: var(--brand-700);
}

.tci-nav-tick[b-ww8wtx2aih] {
    width: 14px;
    height: 14px;
    color: var(--brand-500);
    opacity: 0;
    transition: opacity 120ms ease-out;
}
.tci-nav-item.is-ready .tci-nav-tick[b-ww8wtx2aih] { opacity: 1; }

/* ---------- Right helper panel ---------- */
.tci-help[b-ww8wtx2aih] {
    position: sticky;
    top: 24px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 18px 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.tci-help-title[b-ww8wtx2aih] {
    font-size: 13px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.tci-help-title svg[b-ww8wtx2aih] { width: 14px; height: 14px; color: var(--brand-400); }
.tci-help-block[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.tci-help-key[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-label);
}
.tci-help-text[b-ww8wtx2aih] {
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--neutral-muted);
    margin: 0;
}
.tci-help-divider[b-ww8wtx2aih] {
    height: 1px;
    background: var(--neutral-border);
    margin: 2px -2px;
}

/* ---------- Main column: stack of goal cards ---------- */
.tci-main-stack[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* ==========================================================================
   Goal card
   ========================================================================== */
.tci-goal[b-ww8wtx2aih] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 28px 32px 30px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    scroll-margin-top: 80px;
}
.tci-goal-head[b-ww8wtx2aih] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--neutral-border);
}
.tci-goal-index[b-ww8wtx2aih] {
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    background: var(--brand-50);
    color: var(--brand-700);
    border: 1px solid var(--brand-100);
    font-size: 13px;
    font-weight: var(--fw-bold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
    margin-top: 2px;
}
.tci-goal-title-block[b-ww8wtx2aih] {
    flex: 1;
    min-width: 0;
}
.tci-goal-eyebrow[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    margin-bottom: 4px;
}
.tci-goal-title[b-ww8wtx2aih] {
    font-size: 20px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1.25;
    margin: 0;
    text-wrap: pretty;
}
[b-ww8wtx2aih] .tci-goal-title.tci-md p {
    font-size: 20px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    line-height: 1.25;
    margin: 0;
}
[b-ww8wtx2aih] .tci-goal-title.tci-md > *:only-child { margin: 0; }

/* ---------- Goal body sections ---------- */
.tci-goal-section[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tci-goal-section-label[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-label);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.tci-readonly[b-ww8wtx2aih] {
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-md);
    padding: 14px 18px;
}
.tci-readonly--keyactions[b-ww8wtx2aih] {
    border-left: 3px solid var(--brand-400);
    padding-left: 16px;
}

.tci-md[b-ww8wtx2aih] {
    font-size: 14px;
    line-height: 1.6;
    color: var(--neutral-label);
}
[b-ww8wtx2aih] .tci-md > *:first-child { margin-top: 0; }
[b-ww8wtx2aih] .tci-md > *:last-child  { margin-bottom: 0; }
[b-ww8wtx2aih] .tci-md p { margin: 0 0 10px 0; text-wrap: pretty; }
[b-ww8wtx2aih] .tci-md h1, [b-ww8wtx2aih] .tci-md h2, [b-ww8wtx2aih] .tci-md h3, [b-ww8wtx2aih] .tci-md h4 {
    color: var(--ink);
    font-weight: var(--fw-bold);
    letter-spacing: -0.005em;
    margin: 14px 0 6px 0;
    line-height: 1.3;
}
[b-ww8wtx2aih] .tci-md h1 { font-size: 16px; }
[b-ww8wtx2aih] .tci-md h2 { font-size: 15px; }
[b-ww8wtx2aih] .tci-md h3 { font-size: 14px; }
[b-ww8wtx2aih] .tci-md ul, [b-ww8wtx2aih] .tci-md ol { margin: 0 0 10px 0; padding-left: 20px; }
[b-ww8wtx2aih] .tci-md li { margin: 3px 0; padding-left: 2px; }
[b-ww8wtx2aih] .tci-md ul li::marker { color: var(--brand-400); }
[b-ww8wtx2aih] .tci-md ol li::marker { color: var(--neutral-placeholder); font-weight: 600; }
[b-ww8wtx2aih] .tci-md a {
    color: var(--brand-600);
    text-decoration: none;
    border-bottom: 1px solid var(--brand-200);
}
[b-ww8wtx2aih] .tci-md a:hover { color: var(--brand-700); border-color: var(--brand-400); }
[b-ww8wtx2aih] .tci-md strong { color: var(--ink); font-weight: var(--fw-semibold); }
[b-ww8wtx2aih] .tci-md em { font-style: italic; }
[b-ww8wtx2aih] .tci-md code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    background: var(--neutral-pill-bg);
    color: var(--ink);
    padding: 1px 6px;
    border-radius: 4px;
    border: 1px solid var(--neutral-border);
}

/* ==========================================================================
   Progress segmented control
   ========================================================================== */
.tci-progress[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.tci-progress-row[b-ww8wtx2aih] {
    display: flex;
    align-items: stretch;
    gap: 12px;
}
.tci-progress-track-wrap[b-ww8wtx2aih] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}
.tci-progress-track[b-ww8wtx2aih] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg);
    padding: 6px;
}
.tci-progress-btn[b-ww8wtx2aih] {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    padding: 12px 0;
    cursor: pointer;
    font-family: var(--font-sans);
    font-size: 14px;
    font-weight: var(--fw-bold);
    color: var(--neutral-label);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.005em;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    transition: background 120ms ease-out, color 120ms ease-out, border-color 120ms ease-out, transform 120ms ease-out;
}
.tci-progress-btn:hover[b-ww8wtx2aih] {
    background: white;
    color: var(--ink);
    border-color: var(--neutral-border-strong);
}
.tci-progress-btn:focus-visible[b-ww8wtx2aih] {
    outline: none;
    box-shadow: var(--focus-brand);
    border-color: var(--brand-400);
}
.tci-progress-btn-pip[b-ww8wtx2aih] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--neutral-border-strong);
    transition: background 120ms ease-out, transform 120ms ease-out;
}
.tci-progress-btn.is-active[b-ww8wtx2aih] {
    background: var(--ink);
    color: white;
    border-color: var(--ink);
    box-shadow: 0 1px 6px rgba(13, 45, 63, 0.18);
}
.tci-progress-btn.is-active .tci-progress-btn-pip[b-ww8wtx2aih] {
    background: var(--brand-400);
    transform: scale(1.4);
}
.tci-progress-btn.is-active:hover[b-ww8wtx2aih] {
    background: #1E4256;
    border-color: #1E4256;
}

.tci-progress-readout[b-ww8wtx2aih] {
    width: 96px;
    flex: 0 0 auto;
    align-self: flex-start;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-md);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.tci-progress-readout-num[b-ww8wtx2aih] {
    font-size: 22px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.02em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.tci-progress-readout-label[b-ww8wtx2aih] {
    font-size: 9.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

.tci-progress-scale[b-ww8wtx2aih] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    padding: 0 6px;
}
.tci-progress-scale-step[b-ww8wtx2aih] {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 4px 2px;
    cursor: pointer;
    font-family: var(--font-sans);
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    text-align: center;
    border-radius: var(--radius-sm);
    transition: color 120ms ease-out, background 120ms ease-out;
}
.tci-progress-scale-step:hover[b-ww8wtx2aih] {
    color: var(--ink);
    background: var(--neutral-pill-bg);
}
.tci-progress-scale-step:focus-visible[b-ww8wtx2aih] {
    outline: none;
    color: var(--ink);
    box-shadow: var(--focus-brand);
}
.tci-progress-scale-step.is-current[b-ww8wtx2aih] {
    color: var(--brand-700);
}

/* ==========================================================================
   Notes textarea + counter
   ========================================================================== */
.tci-notes[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tci-notes-headline[b-ww8wtx2aih] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.tci-notes-label[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-label);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.tci-notes-hint-group[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.tci-notes-preview-btn[b-ww8wtx2aih] {
    appearance: none;
    background: var(--brand-500);
    border: 1px solid var(--brand-500);
    border-radius: var(--radius-md);
    padding: 2px 10px;
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: var(--fw-bold);
    color: #fff;
    cursor: pointer;
}
.tci-notes-preview-btn:hover:not(:disabled)[b-ww8wtx2aih] {
    background: var(--brand-600);
    border-color: var(--brand-600);
}
.tci-notes-preview-btn:disabled[b-ww8wtx2aih] {
    opacity: 0.4;
    cursor: not-allowed;
}
.tci-notes-optional[b-ww8wtx2aih] {
    font-size: 10px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    color: var(--neutral-placeholder);
    background: var(--neutral-pill-bg);
    border-radius: 9999px;
    padding: 2px 8px;
    text-transform: uppercase;
}
.tci-notes-hint[b-ww8wtx2aih] {
    font-size: 11.5px;
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
}
.tci-notes-textarea[b-ww8wtx2aih] {
    appearance: none;
    width: 100%;
    box-sizing: border-box;
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.55;
    color: var(--ink);
    background: white;
    border: 1px solid var(--neutral-border-strong);
    border-radius: var(--radius-md);
    padding: 12px 14px;
    min-height: 160px;
    resize: vertical;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
.tci-notes-textarea[b-ww8wtx2aih]::placeholder { color: var(--neutral-placeholder); }
.tci-notes-textarea:hover[b-ww8wtx2aih] { border-color: var(--neutral-muted); }
.tci-notes-textarea:focus[b-ww8wtx2aih],
.tci-notes-textarea:focus-visible[b-ww8wtx2aih] {
    outline: none;
    border-color: var(--brand-400);
    box-shadow: var(--focus-brand);
}
.tci-notes-foot[b-ww8wtx2aih] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 11px;
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
    font-variant-numeric: tabular-nums;
}
.tci-notes-md[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.tci-notes-md svg[b-ww8wtx2aih] { width: 12px; height: 12px; }
.tci-notes-counter--warn[b-ww8wtx2aih] { color: var(--warning); font-weight: var(--fw-semibold); }
.tci-notes-counter--max[b-ww8wtx2aih]  { color: var(--error-text); font-weight: var(--fw-semibold); }

/* ==========================================================================
   Submit footer
   ========================================================================== */
.tci-footer[b-ww8wtx2aih] {
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid var(--neutral-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.tci-footer-meta[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.tci-footer-assurance[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-label);
}
.tci-footer-assurance svg[b-ww8wtx2aih] {
    width: 14px;
    height: 14px;
    color: var(--brand-400);
}
.tci-footer-note[b-ww8wtx2aih] {
    font-size: 11.5px;
    color: var(--neutral-placeholder);
    line-height: 1.45;
}

.tci-submit[b-ww8wtx2aih] {
    appearance: none;
    height: 48px;
    padding: 0 28px;
    min-width: 240px;
    border: 1.5px solid transparent;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: 14px;
    background: var(--ink);
    color: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: background 150ms ease-out;
}
.tci-submit svg[b-ww8wtx2aih] { width: 14px; height: 14px; }
.tci-submit:hover[b-ww8wtx2aih] { background: #1E4256; }
.tci-submit:active[b-ww8wtx2aih] { background: #07212F; }
.tci-submit:focus-visible[b-ww8wtx2aih] {
    outline: none;
    box-shadow: var(--focus-brand);
}
.tci-submit:disabled[b-ww8wtx2aih] {
    opacity: 0.45;
    cursor: not-allowed;
}
.tci-submit--loading[b-ww8wtx2aih] {
    background: #1E4256;
    cursor: progress;
}
.tci-spinner[b-ww8wtx2aih] {
    width: 14px;
    height: 14px;
    border-radius: 9999px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: white;
    animation: tci-spin-b-ww8wtx2aih 0.7s linear infinite;
}
@keyframes tci-spin-b-ww8wtx2aih { to { transform: rotate(360deg); } }

/* ==========================================================================
   Stage (success/error centered card)
   ========================================================================== */
.tci-stage[b-ww8wtx2aih] {
    flex: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 64px 40px 96px;
}
.tci-card[b-ww8wtx2aih] {
    width: 100%;
    max-width: 640px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}
.tci-card-body[b-ww8wtx2aih] {
    padding: 48px 48px 32px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.tci-success-mark[b-ww8wtx2aih] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--ink);
    color: var(--brand-400);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 4px;
}
.tci-success-mark[b-ww8wtx2aih]::after {
    content: "";
    position: absolute;
    inset: -7px;
    border-radius: 9999px;
    border: 1.5px solid var(--brand-200);
    opacity: 0.55;
}
.tci-success-mark svg[b-ww8wtx2aih] { width: 26px; height: 26px; }

.tci-card-title[b-ww8wtx2aih] {
    margin: 0;
    font-size: 28px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.012em;
    line-height: 1.15;
}
.tci-card-title-dot[b-ww8wtx2aih] { color: var(--brand-400); }
.tci-card-sub[b-ww8wtx2aih] {
    margin: 0;
    font-size: 14.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
    max-width: 460px;
}

.tci-receipt[b-ww8wtx2aih] {
    width: 100%;
    margin-top: 22px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg);
    padding: 20px 22px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 24px;
    text-align: left;
}
.tci-receipt-cell[b-ww8wtx2aih] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.tci-receipt-key[b-ww8wtx2aih] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tci-receipt-val[b-ww8wtx2aih] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    font-variant-numeric: tabular-nums;
    word-break: break-word;
}
.tci-receipt-type[b-ww8wtx2aih] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 3px 10px;
    background: var(--brand-50);
    color: var(--brand-700);
    border: 1px solid var(--brand-100);
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tci-receipt-type-dot[b-ww8wtx2aih] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--brand-400);
}

.tci-notice[b-ww8wtx2aih] {
    width: 100%;
    margin-top: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-md);
    color: var(--neutral-label);
    font-size: 13px;
    text-align: left;
}
.tci-notice svg[b-ww8wtx2aih] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: var(--brand-500);
}
.tci-notice b[b-ww8wtx2aih] {
    color: var(--ink);
    font-weight: var(--fw-semibold);
}

.tci-locknote[b-ww8wtx2aih] {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-muted);
}
.tci-locknote svg[b-ww8wtx2aih] {
    width: 14px;
    height: 14px;
    color: var(--neutral-placeholder);
}

.tci-card-foot[b-ww8wtx2aih] {
    border-top: 1px solid var(--neutral-border);
    padding: 20px 48px 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tci-card-foot--split[b-ww8wtx2aih] {
    justify-content: space-between;
    gap: 16px;
}
.tci-done[b-ww8wtx2aih] {
    appearance: none;
    height: 44px;
    padding: 0 36px;
    border: 0;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: 14px;
    background: var(--ink);
    color: white;
    cursor: pointer;
    transition: background 150ms ease-out;
}
.tci-done:hover[b-ww8wtx2aih] { background: #1E4256; }
.tci-done:focus-visible[b-ww8wtx2aih] {
    outline: none;
    box-shadow: var(--focus-brand);
}
.tci-done--outline[b-ww8wtx2aih] {
    background: white;
    color: var(--ink);
    border: 1.5px solid var(--neutral-border-strong);
}
.tci-done--outline:hover[b-ww8wtx2aih] {
    background: var(--neutral-bg);
    border-color: var(--brand-200);
}

.tci-foot-note[b-ww8wtx2aih] {
    font-size: 11.5px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.04em;
    color: var(--neutral-placeholder);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.tci-foot-note svg[b-ww8wtx2aih] {
    width: 12px;
    height: 12px;
    color: var(--brand-400);
}

/* ==========================================================================
   Error variants
   ========================================================================== */
.tci-error-mark[b-ww8wtx2aih] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--error-bg);
    color: var(--error-text);
    border: 1px solid var(--error-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.tci-error-mark svg[b-ww8wtx2aih] { width: 26px; height: 26px; }
.tci-error-overline[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--error-text);
}

.tci-info-mark[b-ww8wtx2aih] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--neutral-bg);
    color: var(--neutral-label);
    border: 1px solid var(--neutral-border-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.tci-info-mark svg[b-ww8wtx2aih] { width: 26px; height: 26px; }
.tci-info-overline[b-ww8wtx2aih] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--neutral-label);
}

/* ==========================================================================
   Page footer (always visible)
   ========================================================================== */
.tci-page-footer[b-ww8wtx2aih] {
    border-top: 1px solid var(--neutral-border);
    background: white;
    padding: 22px 40px;
    display: flex;
    justify-content: center;
    flex: 0 0 auto;
}
.tci-page-footer-inner[b-ww8wtx2aih] {
    max-width: 1280px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.06em;
    color: var(--neutral-placeholder);
}
.tci-page-footer-powered[b-ww8wtx2aih] {
    text-transform: none;
    letter-spacing: 0.02em;
}
.tci-page-footer-powered b[b-ww8wtx2aih] {
    color: var(--neutral-label);
    font-weight: var(--fw-bold);
}

/* ==========================================================================
   PIN cells
   ========================================================================== */
[b-ww8wtx2aih] .pin-cell {
    width: 56px;
    height: 64px;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #ffffff;
    color: #0d2d3f;
    transition: border-color 120ms ease, box-shadow 120ms ease;
    outline: none;
}
[b-ww8wtx2aih] .pin-cell:focus {
    border-color: #4AC4FF;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.2);
}
[b-ww8wtx2aih] .pin-cell--filled {
    background: #E8F8FF;
    border-color: #4AC4FF;
}
[b-ww8wtx2aih] .pin-cell--error {
    border-color: #F43F5E;
    background: #FFF1F2;
}

/* ==========================================================================
   Focus reset
   ========================================================================== */
.tci-page :focus-visible[b-ww8wtx2aih] {
    outline: none;
}
/* /Components/Pages/Employees/PdpPages/PublicPdpInviteShare.razor.rz.scp.css */
/* ---------- Tokens (root for all .tinv-* containers) ---------- */
.tinv-page[b-8j1qua5qkq],
.tinv-loading-screen[b-8j1qua5qkq] {
    --brand-50:   #E8F8FF;
    --brand-100:  #C5EDFF;
    --brand-200:  #A8E3F7;
    --brand-400:  #4AC4FF;
    --brand-500:  #1AA3E8;
    --brand-600:  #0D80BB;
    --brand-700:  #0A5F8A;
    --ink:        #0D2D3F;

    --neutral-bg:            #F8FBFD;
    --neutral-surface:       #FAFCFD;
    --neutral-border:        #EDF2F5;
    --neutral-border-strong: #DDE8EE;
    --neutral-muted:         #7A9BAD;
    --neutral-placeholder:   #9BB8C5;
    --neutral-label:         #4A6878;
    --neutral-card-border:   #E2EBF0;
    --neutral-pill-bg:       #F2F5F7;

    --warning:        #F59E0B;
    --error:          #F43F5E;
    --error-bg:       #FFF1F2;
    --error-border:   #FECDD3;
    --error-text:     #E11D48;

    --radius-sm:  6px;
    --radius-md:  8px;
    --radius-lg:  10px;
    --radius-xl:  14px;
    --radius-full: 9999px;

    --shadow-sm:   0 1px 4px rgba(13, 45, 63, 0.06);
    --focus-brand: 0 0 0 3px rgba(74, 196, 255, 0.18);
    --focus-error: 0 0 0 3px rgba(244, 63, 94, 0.10);

    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;
    --fw-black:    800;
}

.tinv-loading-screen[b-8j1qua5qkq] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--neutral-bg);
}

/* ---------- Page shell ---------- */
.tinv-page[b-8j1qua5qkq] {
    min-height: 100vh;
    background: var(--neutral-bg);
    color: var(--ink);
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    display: flex;
    flex-direction: column;
}

/* ---------- Top bar ---------- */
.tinv-topbar[b-8j1qua5qkq] {
    height: 64px;
    background: white;
    border-bottom: 1px solid var(--neutral-border);
    display: flex;
    align-items: center;
    padding: 0 40px;
    flex: 0 0 auto;
}
.tinv-topbar-inner[b-8j1qua5qkq] {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.tinv-logo[b-8j1qua5qkq] {
    font-size: 18px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.01em;
    user-select: none;
}
.tinv-logo-dot[b-8j1qua5qkq] { color: var(--brand-400); }

.tinv-topbar-meta[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tinv-topbar-meta-icon[b-8j1qua5qkq] {
    width: 14px;
    height: 14px;
    color: var(--brand-400);
}

/* ---------- Main canvas ---------- */
.tinv-main[b-8j1qua5qkq] {
    flex: 1;
    display: flex;
    justify-content: center;
    padding: 48px 40px 96px;
}
.tinv-container[b-8j1qua5qkq] {
    width: 100%;
    max-width: 880px;
}

/* ==========================================================================
   Document header
   ========================================================================== */
.tinv-doc-header[b-8j1qua5qkq] { margin-bottom: 32px; }

.tinv-overline[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    margin-bottom: 18px;
}
.tinv-overline-rule[b-8j1qua5qkq] {
    width: 24px;
    height: 1px;
    background: var(--neutral-border-strong);
    display: inline-block;
}

.tinv-title[b-8j1qua5qkq] {
    font-size: 32px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.018em;
    line-height: 1.15;
    margin: 0 0 12px 0;
    text-wrap: pretty;
}
.tinv-title-dot[b-8j1qua5qkq] { color: var(--brand-400); }

.tinv-subtitle[b-8j1qua5qkq] {
    font-size: 14.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
    margin: 0;
    max-width: 620px;
}

/* ==========================================================================
   Context card
   ========================================================================== */
.tinv-context[b-8j1qua5qkq] {
    margin-top: 28px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 22px 24px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto auto;
    gap: 0 28px;
    align-items: center;
}
.tinv-context-cell[b-8j1qua5qkq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.tinv-context-cell + .tinv-context-cell[b-8j1qua5qkq] {
    padding-left: 28px;
    border-left: 1px solid var(--neutral-border);
}
.tinv-context-label[b-8j1qua5qkq] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tinv-context-value[b-8j1qua5qkq] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    line-height: 1.35;
    font-variant-numeric: tabular-nums;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tinv-context-id[b-8j1qua5qkq] {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    color: var(--neutral-label);
    font-weight: var(--fw-medium);
    letter-spacing: 0;
}
.tinv-context-type[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 4px 10px;
    background: var(--brand-50);
    color: var(--brand-700);
    border: 1px solid var(--brand-100);
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tinv-context-type-dot[b-8j1qua5qkq] {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--brand-400);
}
.tinv-context-count[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-variant-numeric: tabular-nums;
}
.tinv-context-count-num[b-8j1qua5qkq] {
    font-size: 22px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.01em;
    line-height: 1;
}
.tinv-context-count-unit[b-8j1qua5qkq] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

/* ==========================================================================
   Section header (Goals)
   ========================================================================== */
.tinv-section-head[b-8j1qua5qkq] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--neutral-border);
    margin: 40px 0 24px 0;
}
.tinv-section-title[b-8j1qua5qkq] {
    font-size: 18px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.005em;
    margin: 0;
}
.tinv-section-title-count[b-8j1qua5qkq] {
    display: inline-block;
    margin-left: 10px;
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
    font-variant-numeric: tabular-nums;
    vertical-align: 1px;
}

/* ==========================================================================
   Goals list & cards
   ========================================================================== */
.tinv-goals[b-8j1qua5qkq] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.tinv-goal[b-8j1qua5qkq] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    padding: 22px 26px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
.tinv-goal:focus-within[b-8j1qua5qkq] {
    border-color: var(--brand-200);
    box-shadow: var(--focus-brand);
}

.tinv-goal-head[b-8j1qua5qkq] {
    display: flex;
    align-items: center;
    gap: 12px;
}
.tinv-goal-index[b-8j1qua5qkq] {
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    background: var(--brand-50);
    color: var(--brand-700);
    font-size: 12.5px;
    font-weight: var(--fw-bold);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}
.tinv-goal-name[b-8j1qua5qkq] {
    font-size: 15px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.005em;
    line-height: 1.2;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 320px;
}
.tinv-goal-spacer[b-8j1qua5qkq] { flex: 1; }

.tinv-toggle[b-8j1qua5qkq] {
    display: inline-flex;
    background: var(--neutral-pill-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-md);
    padding: 3px;
    gap: 2px;
}
.tinv-toggle-btn[b-8j1qua5qkq] {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 5px 12px;
    font: inherit;
    font-size: 12px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-muted);
    border-radius: 5px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background 120ms ease-out, color 120ms ease-out;
}
.tinv-toggle-btn svg[b-8j1qua5qkq] {
    width: 13px;
    height: 13px;
}
.tinv-toggle-btn:hover[b-8j1qua5qkq] {
    color: var(--ink);
}
.tinv-toggle-btn.is-active[b-8j1qua5qkq] {
    background: white;
    color: var(--ink);
    box-shadow: 0 1px 2px rgba(13, 45, 63, 0.06);
}
.tinv-toggle-btn:focus-visible[b-8j1qua5qkq] {
    outline: none;
    box-shadow: var(--focus-brand);
}

.tinv-goal-remove[b-8j1qua5qkq] {
    appearance: none;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-md);
    background: transparent;
    border: 1px solid var(--neutral-border);
    color: var(--neutral-muted);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out;
}
.tinv-goal-remove svg[b-8j1qua5qkq] { width: 15px; height: 15px; }
.tinv-goal-remove:hover[b-8j1qua5qkq] {
    background: var(--error-bg);
    color: var(--error-text);
    border-color: var(--error-border);
}
.tinv-goal-remove:focus-visible[b-8j1qua5qkq] {
    outline: none;
    box-shadow: var(--focus-brand);
    border-color: var(--brand-400);
}
.tinv-goal-remove:disabled[b-8j1qua5qkq] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* ==========================================================================
   Field
   ========================================================================== */
.tinv-field[b-8j1qua5qkq] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tinv-field-headline[b-8j1qua5qkq] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.tinv-field-label[b-8j1qua5qkq] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-label);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.tinv-field-label-required[b-8j1qua5qkq] {
    color: var(--brand-500);
    font-weight: var(--fw-bold);
}
.tinv-field-hint[b-8j1qua5qkq] {
    font-size: 11px;
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
}

.tinv-input[b-8j1qua5qkq],
.tinv-textarea[b-8j1qua5qkq] {
    appearance: none;
    width: 100%;
    box-sizing: border-box;
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.5;
    color: var(--ink);
    background: white;
    border: 1px solid var(--neutral-border-strong);
    border-radius: var(--radius-md);
    padding: 10px 14px;
    transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}
.tinv-input[b-8j1qua5qkq]::placeholder,
.tinv-textarea[b-8j1qua5qkq]::placeholder {
    color: var(--neutral-placeholder);
}
.tinv-input:hover[b-8j1qua5qkq],
.tinv-textarea:hover[b-8j1qua5qkq] {
    border-color: var(--neutral-muted);
}
.tinv-input:focus[b-8j1qua5qkq],
.tinv-input:focus-visible[b-8j1qua5qkq],
.tinv-textarea:focus[b-8j1qua5qkq],
.tinv-textarea:focus-visible[b-8j1qua5qkq] {
    outline: none;
    border-color: var(--brand-400);
    box-shadow: var(--focus-brand);
}
.tinv-textarea[b-8j1qua5qkq] {
    min-height: 120px;
    padding: 12px 14px;
    line-height: 1.55;
    resize: vertical;
}
.tinv-textarea--tall[b-8j1qua5qkq] {
    min-height: 160px;
}

.tinv-field-foot[b-8j1qua5qkq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 11px;
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
    font-variant-numeric: tabular-nums;
}
.tinv-field-md-hint[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.tinv-field-md-hint svg[b-8j1qua5qkq] {
    width: 12px;
    height: 12px;
}
.tinv-field-counter--warn[b-8j1qua5qkq] { color: var(--warning); }

/* ==========================================================================
   Markdown preview block
   ========================================================================== */
.tinv-preview[b-8j1qua5qkq] {
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-md);
    padding: 16px 18px;
    min-height: 64px;
}
.tinv-preview-empty[b-8j1qua5qkq] {
    font-size: 13px;
    color: var(--neutral-placeholder);
    font-style: italic;
}
.tinv-preview-title[b-8j1qua5qkq] {
    font-size: 17px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    letter-spacing: -0.005em;
    margin-bottom: 10px;
}
.tinv-md[b-8j1qua5qkq] {
    font-size: 14px;
    line-height: 1.6;
    color: var(--neutral-label);
}
[b-8j1qua5qkq] .tinv-md > *:first-child { margin-top: 0; }
[b-8j1qua5qkq] .tinv-md > *:last-child { margin-bottom: 0; }
[b-8j1qua5qkq] .tinv-md p { margin: 0 0 10px 0; text-wrap: pretty; }
[b-8j1qua5qkq] .tinv-md h1,
[b-8j1qua5qkq] .tinv-md h2,
[b-8j1qua5qkq] .tinv-md h3,
[b-8j1qua5qkq] .tinv-md h4 {
    color: var(--ink);
    font-weight: var(--fw-bold);
    letter-spacing: -0.005em;
    margin: 16px 0 6px 0;
    line-height: 1.3;
}
[b-8j1qua5qkq] .tinv-md h1 { font-size: 17px; }
[b-8j1qua5qkq] .tinv-md h2 { font-size: 15px; }
[b-8j1qua5qkq] .tinv-md h3 { font-size: 14px; }
[b-8j1qua5qkq] .tinv-md h4 {
    font-size: 12px;
    color: var(--neutral-label);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
[b-8j1qua5qkq] .tinv-md ul,
[b-8j1qua5qkq] .tinv-md ol {
    margin: 0 0 10px 0;
    padding-left: 20px;
}
[b-8j1qua5qkq] .tinv-md li { margin: 3px 0; padding-left: 2px; }
[b-8j1qua5qkq] .tinv-md ul li::marker { color: var(--brand-400); }
[b-8j1qua5qkq] .tinv-md ol li::marker { color: var(--neutral-placeholder); font-weight: 600; }
[b-8j1qua5qkq] .tinv-md a {
    color: var(--brand-600);
    text-decoration: none;
    border-bottom: 1px solid var(--brand-200);
}
[b-8j1qua5qkq] .tinv-md a:hover { color: var(--brand-700); border-color: var(--brand-400); }
[b-8j1qua5qkq] .tinv-md strong { color: var(--ink); font-weight: var(--fw-semibold); }
[b-8j1qua5qkq] .tinv-md em { font-style: italic; }
[b-8j1qua5qkq] .tinv-md code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    background: var(--neutral-pill-bg);
    color: var(--ink);
    padding: 1px 6px;
    border-radius: 4px;
    border: 1px solid var(--neutral-border);
}
[b-8j1qua5qkq] .tinv-md blockquote {
    margin: 10px 0;
    padding: 4px 0 4px 14px;
    border-left: 2px solid var(--brand-400);
    color: var(--neutral-label);
}
[b-8j1qua5qkq] .tinv-md hr {
    border: none;
    border-top: 1px solid var(--neutral-border);
    margin: 16px 0;
}
[b-8j1qua5qkq] .tinv-preview-title p {
    font-size: 17px;
    font-weight: var(--fw-bold);
    color: var(--ink);
    margin: 0;
    line-height: 1.3;
}

/* ==========================================================================
   Add-goal CTA card
   ========================================================================== */
.tinv-add-goal[b-8j1qua5qkq] {
    appearance: none;
    width: 100%;
    background: white;
    border: 1.5px dashed var(--neutral-border-strong);
    border-radius: var(--radius-xl);
    padding: 22px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    cursor: pointer;
    font-family: var(--font-sans);
    color: var(--ink);
    transition: border-color 150ms ease-out, background 150ms ease-out, color 150ms ease-out;
    margin-top: 18px;
}
.tinv-add-goal-row[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
}
.tinv-add-goal-row svg[b-8j1qua5qkq] {
    width: 16px;
    height: 16px;
    color: var(--brand-500);
}
.tinv-add-goal-hint[b-8j1qua5qkq] {
    font-size: 12px;
    color: var(--neutral-placeholder);
    margin-top: 2px;
}
.tinv-add-goal:hover[b-8j1qua5qkq] {
    border-color: var(--brand-400);
    background: var(--brand-50);
}
.tinv-add-goal:focus-visible[b-8j1qua5qkq] {
    outline: none;
    border-color: var(--brand-400);
    box-shadow: var(--focus-brand);
}

/* ==========================================================================
   Form-level validation banner
   ========================================================================== */
.tinv-formerror[b-8j1qua5qkq] {
    margin-top: 22px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background: var(--error-bg);
    border: 1px solid var(--error-border);
    border-radius: var(--radius-md);
    color: var(--error-text);
    font-size: 13px;
    line-height: 1.45;
}
.tinv-formerror svg[b-8j1qua5qkq] {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    margin-top: 1px;
}
.tinv-formerror b[b-8j1qua5qkq] { font-weight: var(--fw-bold); }

/* ==========================================================================
   Footer / submit
   ========================================================================== */
.tinv-footer[b-8j1qua5qkq] {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--neutral-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.tinv-footer-meta[b-8j1qua5qkq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.tinv-footer-assurance[b-8j1qua5qkq] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: var(--fw-semibold);
    color: var(--neutral-label);
}
.tinv-footer-assurance svg[b-8j1qua5qkq] {
    width: 14px;
    height: 14px;
    color: var(--brand-400);
}
.tinv-footer-note[b-8j1qua5qkq] {
    font-size: 11.5px;
    color: var(--neutral-placeholder);
    line-height: 1.45;
}

.tinv-submit[b-8j1qua5qkq] {
    appearance: none;
    height: 48px;
    padding: 0 24px;
    min-width: 220px;
    border: 1.5px solid transparent;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: 14px;
    background: var(--ink);
    color: white;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: background 150ms ease-out;
}
.tinv-submit svg[b-8j1qua5qkq] {
    width: 14px;
    height: 14px;
}
.tinv-submit:hover[b-8j1qua5qkq] { background: #1E4256; }
.tinv-submit:active[b-8j1qua5qkq] { background: #07212F; }
.tinv-submit:focus-visible[b-8j1qua5qkq] {
    outline: none;
    box-shadow: var(--focus-brand);
}
.tinv-submit:disabled[b-8j1qua5qkq] {
    opacity: 0.45;
    cursor: not-allowed;
}
.tinv-submit--loading[b-8j1qua5qkq] {
    background: #1E4256;
    cursor: progress;
}
.tinv-spinner[b-8j1qua5qkq] {
    width: 14px;
    height: 14px;
    border-radius: 9999px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: white;
    animation: tinv-spin-b-8j1qua5qkq 0.7s linear infinite;
}
@keyframes tinv-spin-b-8j1qua5qkq { to { transform: rotate(360deg); } }

/* ==========================================================================
   Stage (success/error centered card)
   ========================================================================== */
.tinv-stage[b-8j1qua5qkq] {
    flex: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 64px 40px 96px;
}
.tinv-card[b-8j1qua5qkq] {
    width: 100%;
    max-width: 640px;
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}
.tinv-card-body[b-8j1qua5qkq] {
    padding: 48px 48px 32px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.tinv-success-mark[b-8j1qua5qkq] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--ink);
    color: var(--brand-400);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 4px;
}
.tinv-success-mark[b-8j1qua5qkq]::after {
    content: "";
    position: absolute;
    inset: -7px;
    border-radius: 9999px;
    border: 1.5px solid var(--brand-200);
    opacity: 0.55;
}
.tinv-success-mark svg[b-8j1qua5qkq] {
    width: 26px;
    height: 26px;
}

.tinv-card-title[b-8j1qua5qkq] {
    margin: 0;
    font-size: 28px;
    font-weight: var(--fw-black);
    color: var(--ink);
    letter-spacing: -0.012em;
    line-height: 1.15;
}
.tinv-card-sub[b-8j1qua5qkq] {
    margin: 0;
    font-size: 14.5px;
    color: var(--neutral-muted);
    line-height: 1.55;
    max-width: 460px;
}

.tinv-receipt[b-8j1qua5qkq] {
    width: 100%;
    margin-top: 22px;
    background: var(--neutral-bg);
    border: 1px solid var(--neutral-border);
    border-radius: var(--radius-lg);
    padding: 20px 22px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px 24px;
    text-align: left;
}
.tinv-receipt-cell[b-8j1qua5qkq] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.tinv-receipt-key[b-8j1qua5qkq] {
    font-size: 10.5px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}
.tinv-receipt-val[b-8j1qua5qkq] {
    font-size: 14px;
    font-weight: var(--fw-semibold);
    color: var(--ink);
    font-variant-numeric: tabular-nums;
    word-break: break-word;
}

.tinv-card-foot[b-8j1qua5qkq] {
    border-top: 1px solid var(--neutral-border);
    padding: 20px 48px 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tinv-card-foot--split[b-8j1qua5qkq] {
    justify-content: space-between;
    gap: 16px;
}
.tinv-done[b-8j1qua5qkq] {
    appearance: none;
    height: 44px;
    padding: 0 36px;
    border: 0;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: 14px;
    background: var(--ink);
    color: white;
    cursor: pointer;
    transition: background 150ms ease-out;
}
.tinv-done:hover[b-8j1qua5qkq] { background: #1E4256; }
.tinv-done:focus-visible[b-8j1qua5qkq] {
    outline: none;
    box-shadow: var(--focus-brand);
}
.tinv-done--outline[b-8j1qua5qkq] {
    background: white;
    color: var(--ink);
    border: 1.5px solid var(--neutral-border-strong);
}
.tinv-done--outline:hover[b-8j1qua5qkq] {
    background: var(--neutral-bg);
    border-color: var(--brand-200);
}

.tinv-foot-note[b-8j1qua5qkq] {
    font-size: 11.5px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.04em;
    color: var(--neutral-placeholder);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.tinv-foot-note svg[b-8j1qua5qkq] {
    width: 12px;
    height: 12px;
    color: var(--brand-400);
}

/* ==========================================================================
   Error variants
   ========================================================================== */
.tinv-error-mark[b-8j1qua5qkq] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--error-bg);
    color: var(--error-text);
    border: 1px solid var(--error-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.tinv-error-mark svg[b-8j1qua5qkq] {
    width: 26px;
    height: 26px;
}
.tinv-error-overline[b-8j1qua5qkq] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--error-text);
}

.tinv-info-mark[b-8j1qua5qkq] {
    width: 56px;
    height: 56px;
    border-radius: 9999px;
    background: var(--neutral-bg);
    color: var(--neutral-label);
    border: 1px solid var(--neutral-border-strong);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.tinv-info-mark svg[b-8j1qua5qkq] {
    width: 26px;
    height: 26px;
}
.tinv-info-overline[b-8j1qua5qkq] {
    font-size: 11px;
    font-weight: var(--fw-bold);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--neutral-label);
}

/* ==========================================================================
   Page footer (always visible)
   ========================================================================== */
.tinv-page-footer[b-8j1qua5qkq] {
    border-top: 1px solid var(--neutral-border);
    background: white;
    padding: 22px 40px;
    display: flex;
    justify-content: center;
    flex: 0 0 auto;
}
.tinv-page-footer-inner[b-8j1qua5qkq] {
    max-width: 1080px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.06em;
    color: var(--neutral-placeholder);
}
.tinv-page-footer-powered[b-8j1qua5qkq] {
    text-transform: none;
    letter-spacing: 0.02em;
}
.tinv-page-footer-powered b[b-8j1qua5qkq] {
    color: var(--neutral-label);
    font-weight: var(--fw-bold);
}

/* ==========================================================================
   PIN cells (shared across public pages)
   ========================================================================== */
[b-8j1qua5qkq] .pin-cell {
    width: 56px;
    height: 64px;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    background: #ffffff;
    color: #0d2d3f;
    transition: border-color 120ms ease, box-shadow 120ms ease;
    outline: none;
}
[b-8j1qua5qkq] .pin-cell:focus {
    border-color: #4AC4FF;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, 0.2);
}
[b-8j1qua5qkq] .pin-cell--filled {
    background: #E8F8FF;
    border-color: #4AC4FF;
}
[b-8j1qua5qkq] .pin-cell--error {
    border-color: #F43F5E;
    background: #FFF1F2;
}

/* ==========================================================================
   Focus reset
   ========================================================================== */
.tinv-page :focus-visible[b-8j1qua5qkq] {
    outline: none;
}
/* /Components/Pages/Employees/PdpPages/PublicPdpShare.razor.rz.scp.css */
/* ---------- Tokens ---------- */
.pdp-page[b-bg9ah1zt68] {
    --pdp-brand-50:   #E8F8FF;
    --pdp-brand-100:  #C5EDFF;
    --pdp-brand-200:  #A8E3F7;
    --pdp-brand-400:  #4AC4FF;
    --pdp-brand-500:  #1AA3E8;
    --pdp-brand-600:  #0D80BB;
    --pdp-brand-700:  #0A5F8A;
    --pdp-ink:        #0D2D3F;

    --pdp-bg:               #F8FBFD;
    --pdp-surface:          #FAFCFD;
    --pdp-border:           #EDF2F5;
    --pdp-border-strong:    #DDE8EE;
    --pdp-muted:            #7A9BAD;
    --pdp-placeholder:      #9BB8C5;
    --pdp-label:            #4A6878;
    --pdp-card-border:      #E2EBF0;
    --pdp-pill-bg:          #F2F5F7;

    --pdp-error:        #F43F5E;
    --pdp-error-bg:     #FFF1F2;
    --pdp-error-border: #FECDD3;
    --pdp-error-text:   #E11D48;

    --pdp-radius-sm:  6px;
    --pdp-radius-md:  8px;
    --pdp-radius-lg:  10px;
    --pdp-radius-xl:  14px;

    --pdp-shadow-sm:   0 1px 4px rgba(13, 45, 63, 0.06);
    --pdp-focus-brand: 0 0 0 3px rgba(74, 196, 255, 0.18);

    --pdp-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ==========================================================================
   Page shell
   ========================================================================== */
.pdp-page[b-bg9ah1zt68] {
    min-height: 100vh;
    background: var(--pdp-bg);
    color: var(--pdp-ink);
    font-family: var(--pdp-font);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    display: flex;
    flex-direction: column;
}

/* ---------- Top bar ---------- */
.pdp-topbar[b-bg9ah1zt68] {
    height: 64px;
    background: white;
    border-bottom: 1px solid var(--pdp-border);
    display: flex;
    align-items: center;
    padding: 0 40px;
    flex: 0 0 auto;
}
.pdp-topbar-inner[b-bg9ah1zt68] {
    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.pdp-logo[b-bg9ah1zt68] {
    font-family: var(--pdp-font);
    font-size: 18px;
    font-weight: 800;
    color: var(--pdp-ink);
    letter-spacing: -0.01em;
    user-select: none;
}
.pdp-logo-dot[b-bg9ah1zt68] { color: var(--pdp-brand-400); }

.pdp-topbar-meta[b-bg9ah1zt68] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--pdp-placeholder);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.pdp-topbar-meta-icon[b-bg9ah1zt68] {
    width: 14px;
    height: 14px;
    color: var(--pdp-brand-400);
}

/* ---------- Main canvas ---------- */
.pdp-main[b-bg9ah1zt68] {
    flex: 1;
    display: flex;
    justify-content: center;
    padding: 56px 40px 80px;
}
.pdp-container[b-bg9ah1zt68] {
    width: 100%;
    max-width: 880px;
}

/* ==========================================================================
   Document header
   ========================================================================== */
.pdp-doc-header[b-bg9ah1zt68] { margin-bottom: 32px; }

.pdp-overline[b-bg9ah1zt68] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pdp-placeholder);
    margin-bottom: 18px;
}
.pdp-overline-rule[b-bg9ah1zt68] {
    width: 24px;
    height: 1px;
    background: var(--pdp-border-strong);
    display: inline-block;
}

.pdp-title[b-bg9ah1zt68] {
    font-size: 36px;
    font-weight: 800;
    color: var(--pdp-ink);
    letter-spacing: -0.018em;
    line-height: 1.15;
    margin: 0 0 24px 0;
    text-wrap: pretty;
}
.pdp-title-dot[b-bg9ah1zt68] { color: var(--pdp-brand-400); }

.pdp-meta-row[b-bg9ah1zt68] {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.pdp-meta-item[b-bg9ah1zt68] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--pdp-label);
}
.pdp-meta-stack[b-bg9ah1zt68] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.pdp-meta-icon[b-bg9ah1zt68] {
    width: 18px;
    height: 18px;
    color: var(--pdp-placeholder);
    flex: 0 0 auto;
}
.pdp-meta-label[b-bg9ah1zt68] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pdp-placeholder);
}
.pdp-meta-value[b-bg9ah1zt68] {
    font-size: 13px;
    font-weight: 600;
    color: var(--pdp-ink);
    font-variant-numeric: tabular-nums;
}
.pdp-meta-divider[b-bg9ah1zt68] {
    width: 1px;
    height: 22px;
    background: var(--pdp-border);
}
.pdp-avatar[b-bg9ah1zt68] {
    width: 28px;
    height: 28px;
    border-radius: 9999px;
    background: var(--pdp-ink);
    color: var(--pdp-brand-400);
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
    flex: 0 0 auto;
}

/* ==========================================================================
   Section header
   ========================================================================== */
.pdp-section[b-bg9ah1zt68] { margin-top: 40px; }

.pdp-section-head[b-bg9ah1zt68] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--pdp-border);
    margin-bottom: 24px;
}
.pdp-section-title[b-bg9ah1zt68] {
    font-size: 18px;
    font-weight: 700;
    color: var(--pdp-ink);
    letter-spacing: -0.005em;
    margin: 0;
}
.pdp-section-count[b-bg9ah1zt68] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pdp-placeholder);
    font-variant-numeric: tabular-nums;
}

.pdp-empty[b-bg9ah1zt68] {
    background: white;
    border: 1px dashed var(--pdp-border-strong);
    border-radius: var(--pdp-radius-xl);
    padding: 40px;
    text-align: center;
    color: var(--pdp-placeholder);
    font-size: 14px;
}

/* ==========================================================================
   Goal cards
   ========================================================================== */
.pdp-goals[b-bg9ah1zt68] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.pdp-goal[b-bg9ah1zt68] {
    background: white;
    border: 1px solid var(--pdp-card-border);
    border-radius: var(--pdp-radius-xl);
    padding: 28px 32px;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 4px 24px;
    transition: box-shadow 150ms ease-out, border-color 150ms ease-out;
}
.pdp-goal:hover[b-bg9ah1zt68] {
    border-color: var(--pdp-border-strong);
    box-shadow: var(--pdp-shadow-sm);
}
.pdp-goal-index[b-bg9ah1zt68] {
    grid-row: 1 / span 2;
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    background: var(--pdp-brand-50);
    color: var(--pdp-brand-700);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.02em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
    margin-top: 2px;
}
.pdp-goal-body[b-bg9ah1zt68] {
    min-width: 0;
}
.pdp-goal-title[b-bg9ah1zt68] {
    font-size: 17px;
    font-weight: 700;
    color: var(--pdp-ink);
    letter-spacing: -0.005em;
    line-height: 1.35;
    margin: 6px 0 14px 0;
    text-wrap: pretty;
}

.pdp-keyactions[b-bg9ah1zt68] {
    margin-top: 16px;
    padding: 16px 18px 18px;
    background: var(--pdp-bg);
    border: 1px solid var(--pdp-border);
    border-radius: var(--pdp-radius-lg);
}
.pdp-keyactions-label[b-bg9ah1zt68] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pdp-label);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.pdp-keyactions-label[b-bg9ah1zt68]::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: var(--pdp-brand-400);
    display: inline-block;
}

/* ==========================================================================
   Markdown content
   ::deep — needed for MarkupString-rendered children (no scope attribute).
   ========================================================================== */
.pdp-md[b-bg9ah1zt68] {
    font-size: 14px;
    line-height: 1.65;
    color: var(--pdp-label);
}
[b-bg9ah1zt68] .pdp-md > *:first-child { margin-top: 0; }
[b-bg9ah1zt68] .pdp-md > *:last-child  { margin-bottom: 0; }
[b-bg9ah1zt68] .pdp-md p {
    margin: 0 0 12px 0;
    text-wrap: pretty;
}
[b-bg9ah1zt68] .pdp-md h1,
[b-bg9ah1zt68] .pdp-md h2,
[b-bg9ah1zt68] .pdp-md h3,
[b-bg9ah1zt68] .pdp-md h4 {
    color: var(--pdp-ink);
    font-weight: 700;
    letter-spacing: -0.005em;
    margin: 20px 0 8px 0;
    line-height: 1.3;
}
[b-bg9ah1zt68] .pdp-md h1 { font-size: 18px; }
[b-bg9ah1zt68] .pdp-md h2 { font-size: 16px; }
[b-bg9ah1zt68] .pdp-md h3 { font-size: 14px; }
[b-bg9ah1zt68] .pdp-md h4 {
    font-size: 13px;
    color: var(--pdp-label);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
[b-bg9ah1zt68] .pdp-md ul,
[b-bg9ah1zt68] .pdp-md ol {
    margin: 0 0 12px 0;
    padding-left: 20px;
}
[b-bg9ah1zt68] .pdp-md li {
    margin: 4px 0;
    padding-left: 4px;
}
[b-bg9ah1zt68] .pdp-md ul li::marker { color: var(--pdp-brand-400); }
[b-bg9ah1zt68] .pdp-md ol li::marker { color: var(--pdp-placeholder); font-weight: 600; }
[b-bg9ah1zt68] .pdp-md a {
    color: var(--pdp-brand-600);
    text-decoration: none;
    border-bottom: 1px solid var(--pdp-brand-200);
    transition: border-color 150ms ease-out, color 150ms ease-out;
}
[b-bg9ah1zt68] .pdp-md a:hover {
    color: var(--pdp-brand-700);
    border-color: var(--pdp-brand-400);
}
[b-bg9ah1zt68] .pdp-md a:focus-visible {
    outline: none;
    box-shadow: var(--pdp-focus-brand);
    border-radius: 2px;
}
[b-bg9ah1zt68] .pdp-md strong { color: var(--pdp-ink); font-weight: 600; }
[b-bg9ah1zt68] .pdp-md em { font-style: italic; }
[b-bg9ah1zt68] .pdp-md code {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 12.5px;
    background: var(--pdp-pill-bg);
    color: var(--pdp-ink);
    padding: 1px 6px;
    border-radius: 4px;
    border: 1px solid var(--pdp-border);
}
[b-bg9ah1zt68] .pdp-md pre {
    margin: 12px 0;
    padding: 14px 16px;
    background: var(--pdp-ink);
    color: #E8F8FF;
    border-radius: var(--pdp-radius-lg);
    overflow-x: auto;
    font-size: 12.5px;
    line-height: 1.55;
}
[b-bg9ah1zt68] .pdp-md pre code {
    background: transparent;
    border: none;
    color: inherit;
    padding: 0;
    font-size: inherit;
}
[b-bg9ah1zt68] .pdp-md blockquote {
    margin: 12px 0;
    padding: 4px 0 4px 16px;
    border-left: 2px solid var(--pdp-brand-400);
    color: var(--pdp-label);
    font-style: normal;
}
[b-bg9ah1zt68] .pdp-md blockquote p { margin: 4px 0; }
[b-bg9ah1zt68] .pdp-md hr {
    border: none;
    border-top: 1px solid var(--pdp-border);
    margin: 20px 0;
}
[b-bg9ah1zt68] .pdp-md table {
    border-collapse: collapse;
    width: 100%;
    margin: 12px 0;
    font-size: 13px;
}
[b-bg9ah1zt68] .pdp-md th,
[b-bg9ah1zt68] .pdp-md td {
    text-align: left;
    padding: 8px 12px;
    border-bottom: 1px solid var(--pdp-border);
}
[b-bg9ah1zt68] .pdp-md th {
    font-weight: 600;
    color: var(--pdp-ink);
    background: var(--pdp-bg);
}

/* The goal title may be markdown but should still read as a title */
[b-bg9ah1zt68] .pdp-goal-title.pdp-md p {
    font-size: 17px;
    font-weight: 700;
    color: var(--pdp-ink);
    line-height: 1.35;
    margin: 0;
}
[b-bg9ah1zt68] .pdp-goal-title.pdp-md > *:only-child { margin: 0; }

/* ==========================================================================
   Footer
   ========================================================================== */
.pdp-footer[b-bg9ah1zt68] {
    border-top: 1px solid var(--pdp-border);
    background: white;
    padding: 22px 40px;
    display: flex;
    justify-content: center;
    flex: 0 0 auto;
}
.pdp-footer-inner[b-bg9ah1zt68] {
    max-width: 1080px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--pdp-placeholder);
}
.pdp-footer-powered[b-bg9ah1zt68] {
    text-transform: none;
    letter-spacing: 0.02em;
}
.pdp-footer-powered b[b-bg9ah1zt68] {
    color: var(--pdp-label);
    font-weight: 700;
}

/* ==========================================================================
   Loading state — skeleton blocks
   ========================================================================== */
.pdp-skeleton[b-bg9ah1zt68] {
    background: linear-gradient(90deg,
        var(--pdp-pill-bg) 0%,
        #E8EEF2 50%,
        var(--pdp-pill-bg) 100%);
    background-size: 200% 100%;
    border-radius: var(--pdp-radius-sm);
    animation: pdp-shimmer-b-bg9ah1zt68 1.4s ease-in-out infinite;
}
@keyframes pdp-shimmer-b-bg9ah1zt68 {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.pdp-sk-overline[b-bg9ah1zt68] { width: 140px; height: 11px; margin-bottom: 18px; }
.pdp-sk-title[b-bg9ah1zt68]    { width: 70%;   height: 36px; margin-bottom: 24px; }
.pdp-sk-meta-row[b-bg9ah1zt68] { display: flex; gap: 24px; }
.pdp-sk-meta[b-bg9ah1zt68]     { width: 180px; height: 28px; border-radius: 9999px; }
.pdp-sk-section[b-bg9ah1zt68]  { width: 200px; height: 18px; margin: 40px 0 24px 0; }
.pdp-skeleton-cards[b-bg9ah1zt68] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.pdp-sk-card[b-bg9ah1zt68] {
    background: white;
    border: 1px solid var(--pdp-card-border);
    border-radius: var(--pdp-radius-xl);
    padding: 28px 32px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.pdp-sk-line[b-bg9ah1zt68]   { height: 12px; }
.pdp-sk-line-1[b-bg9ah1zt68] { width: 60%; }
.pdp-sk-line-2[b-bg9ah1zt68] { width: 90%; }
.pdp-sk-line-3[b-bg9ah1zt68] { width: 75%; }
.pdp-sk-block[b-bg9ah1zt68]  { height: 80px; border-radius: var(--pdp-radius-lg); margin-top: 8px; }

/* ==========================================================================
   Error state
   ========================================================================== */
.pdp-error-wrap[b-bg9ah1zt68] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 56px 40px;
}
.pdp-error[b-bg9ah1zt68] {
    max-width: 480px;
    width: 100%;
    background: white;
    border: 1px solid var(--pdp-card-border);
    border-radius: var(--pdp-radius-xl);
    padding: 40px 40px 36px;
    text-align: left;
}
.pdp-error-icon[b-bg9ah1zt68] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--pdp-error-bg);
    border: 1px solid var(--pdp-error-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pdp-error-text);
    margin-bottom: 20px;
}
.pdp-error-icon svg[b-bg9ah1zt68] { width: 22px; height: 22px; }

.pdp-error-overline[b-bg9ah1zt68] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pdp-error-text);
    margin-bottom: 8px;
}
.pdp-error-title[b-bg9ah1zt68] {
    font-size: 22px;
    font-weight: 700;
    color: var(--pdp-ink);
    letter-spacing: -0.005em;
    margin: 0 0 10px 0;
    line-height: 1.25;
}
.pdp-error-body[b-bg9ah1zt68] {
    font-size: 14px;
    color: var(--pdp-muted);
    line-height: 1.55;
    margin: 0;
}
.pdp-error-meta[b-bg9ah1zt68] {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--pdp-border);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--pdp-placeholder);
}
.pdp-error-meta svg[b-bg9ah1zt68] {
    width: 14px;
    height: 14px;
    color: var(--pdp-brand-400);
}

/* ==========================================================================
   Focus
   ========================================================================== */
.pdp-page :focus-visible[b-bg9ah1zt68] {
    outline: none;
    box-shadow: var(--pdp-focus-brand);
    border-radius: 2px;
}
/* /Components/Pages/Employees/TimeOffStatisticsPage.razor.rz.scp.css */
.time-off-statistics-page[b-lzcuxfd6oo] {
    width: 100%;
    margin: 0;
    padding: 24px 32px;
    background-color: #f5f5f5;
    min-height: 100vh;
}

/* Header Section */
.stats-header[b-lzcuxfd6oo] {
    background-color: #ffffff;
    padding: 24px 32px;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
}

.header-content[b-lzcuxfd6oo] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.header-left[b-lzcuxfd6oo] {
    flex: 1;
}

.page-title[b-lzcuxfd6oo] {
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 8px 0;
    letter-spacing: -0.5px;
}

.page-subtitle[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    margin: 0;
    letter-spacing: -0.15px;
}

.title-with-tabs[b-lzcuxfd6oo] {
    display: flex;
    align-items: baseline;
    gap: 20px;
    margin-bottom: 8px;
}

.stats-tabs[b-lzcuxfd6oo] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px;
    border: 1px solid #d6deea;
    border-radius: 12px;
    background-color: #f8fafc;
}

.stats-tab-btn[b-lzcuxfd6oo] {
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    padding: 9px 18px;
    color: #334155;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.stats-tab-btn:hover[b-lzcuxfd6oo] {
    color: #1e293b;
    background-color: #f1f5f9;
}

.stats-tab-btn.active[b-lzcuxfd6oo] {
    color: #2f6fb2;
    background-color: #ffffff;
    border-color: #c7d2e4;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.stats-tab-divider[b-lzcuxfd6oo] {
    color: #c0cad9;
    font-weight: 600;
    line-height: 1;
    user-select: none;
}

.header-right[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.sync-status[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #64748b;
    font-size: 12px;
}

.sync-icon[b-lzcuxfd6oo] {
    color: #10b981;
    font-size: 16px;
}

.sync-text[b-lzcuxfd6oo] {
    letter-spacing: -0.15px;
}

/* Filter Section */
.filter-section[b-lzcuxfd6oo] {
    background-color: #ffffff;
    padding: 24px 32px;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 24px;
}

.filter-container[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.filter-label[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #1e293b;
    white-space: nowrap;
}

.filter-buttons[b-lzcuxfd6oo] {
    display: flex;
    gap: 8px;
    flex: 1;
}

.filter-btn[b-lzcuxfd6oo] {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    color: #64748b;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    letter-spacing: -0.15px;
}

.filter-btn:hover[b-lzcuxfd6oo] {
    background-color: #f8fafc;
    border-color: #cbd5e1;
}

.filter-btn.active[b-lzcuxfd6oo] {
    background-color: #2e75b6;
    color: #ffffff;
    border-color: #2e75b6;
}

.filter-note[b-lzcuxfd6oo] {
    font-size: 13px;
    color: #64748b;
    white-space: nowrap;
    margin-left: auto;
    letter-spacing: -0.08px;
}

/* Stats Grid */
.stats-grid[b-lzcuxfd6oo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 24px;
}

/* Widget Card */
.widget-card[b-lzcuxfd6oo] {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    padding: 24px;
    display: flex;
    flex-direction: column;
}

.widget-header[b-lzcuxfd6oo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e2e8f0;
}

/* Vertical separator between filter groups */
.filter-divider[b-lzcuxfd6oo] {
    width: 1px;
    height: 32px;
    background-color: #e2e8f0;
    flex-shrink: 0;
}


/* Year select needs less width */
.year-select[b-lzcuxfd6oo] {
    width: 100px;
    min-width: 100px;
}

.popular-days-widget .chart-container[b-lzcuxfd6oo] {
    height: 340px;
}

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

.widget-icon[b-lzcuxfd6oo] {
    font-size: 20px;
    color: #2e75b6;
}

.widget-title[b-lzcuxfd6oo] {
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    letter-spacing: -0.44px;
}

.widget-content[b-lzcuxfd6oo] {
    flex: 1;
}

.widget-footer[b-lzcuxfd6oo] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
    font-size: 14px;
    color: #64748b;
}

/* Right Column Container */
.right-column[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Top Employees Widget */
.top-employees-widget[b-lzcuxfd6oo] {
    /* Takes left column, stretches to match right column height */
}

.employees-table[b-lzcuxfd6oo] {
    width: 100%;
}

.table-header[b-lzcuxfd6oo] {
    display: grid;
    grid-template-columns: 50px minmax(200px, 1.4fr) minmax(140px, 1fr) minmax(130px, 1fr) 110px;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid #e2e8f0;
    font-size: 14px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.table-body[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.table-row[b-lzcuxfd6oo] {
    display: grid;
    grid-template-columns: 50px minmax(200px, 1.4fr) minmax(140px, 1fr) minmax(130px, 1fr) 110px;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid #f1f5f9;
    align-items: center;
}

.table-row:last-child[b-lzcuxfd6oo] {
    border-bottom: none;
}

.col-rank[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.medal[b-lzcuxfd6oo] {
    font-size: 20px;
    line-height: 1;
}

.rank-number[b-lzcuxfd6oo] {
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
}

.col-employee[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.employee-avatar[b-lzcuxfd6oo] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    flex-shrink: 0;
}

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

.employee-name[b-lzcuxfd6oo] {
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.employee-location[b-lzcuxfd6oo] {
    font-size: 12px;
    color: #94a3b8;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-department[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.department-primary[b-lzcuxfd6oo] {
    color: #1e293b;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.department-secondary[b-lzcuxfd6oo] {
    font-size: 12px;
    color: #94a3b8;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.col-client[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.table-row .col-client[b-lzcuxfd6oo] {
    color: #0f172a;
    font-weight: 500;
}

.col-location[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
}

.col-days[b-lzcuxfd6oo] {
    font-size: 14px;
    text-align: right;
}

.table-row .col-days[b-lzcuxfd6oo] {
    color: #1e293b;
    font-weight: 500;
}

.col-usage[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.usage-percent[b-lzcuxfd6oo] {
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
    min-width: 40px;
}

.usage-bar[b-lzcuxfd6oo] {
    flex: 1;
    height: 6px;
    background-color: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
    max-width: 64px;
}

.usage-bar-fill[b-lzcuxfd6oo] {
    height: 100%;
    background-color: #2e75b6;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.unused-pto-list-widget[b-lzcuxfd6oo] {
    min-height: 520px;
}

.unused-pto-list-widget .widget-header[b-lzcuxfd6oo] {
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
}

.unused-pto-search[b-lzcuxfd6oo] {
    width: 280px;
    max-width: 100%;
}

.unused-pto-search-input[b-lzcuxfd6oo] {
    width: 100%;
}

.unused-pto-controls[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.unused-pto-filter[b-lzcuxfd6oo] {
    width: 200px;
    max-width: 100%;
}

.unused-pto-filter-select[b-lzcuxfd6oo] {
    width: 100%;
}

.unused-pto-table .table-header[b-lzcuxfd6oo],
.unused-pto-table .table-row[b-lzcuxfd6oo] {
    grid-template-columns: 50px minmax(220px, 1.3fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(120px, 0.9fr) 150px;
}

.unused-pto-pagination-row[b-lzcuxfd6oo] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
}

.unused-pto-pager[b-lzcuxfd6oo] {
    display: flex;
    justify-content: center;
}

.unused-pto-meta[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    white-space: nowrap;
}

.unused-pto-total[b-lzcuxfd6oo] {
    text-align: right;
}

/* Popular Days Widget */
.popular-days-widget[b-lzcuxfd6oo] {
    /* Inside right-column, no grid-column needed */
}

.popular-days-chart[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px 0;
}

.day-bar-row[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.day-label[b-lzcuxfd6oo] {
    min-width: 90px;
    font-size: 14px;
    font-weight: 500;
    color: #1e293b;
}

.day-bar-container[b-lzcuxfd6oo] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    height: 36px;
    background-color: #f1f5f9;
    border-radius: 6px;
    position: relative;
}

.day-bar[b-lzcuxfd6oo] {
    height: 100%;
    background: linear-gradient(90deg, #3b82f6 0%, #2563eb 100%);
    border-radius: 6px;
    min-width: 4px;
    transition: width 0.3s ease;
}

.day-count[b-lzcuxfd6oo] {
    position: absolute;
    right: 12px;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
}

.day-bar-container:has(.day-bar[style*="width: 0%"]) .day-count[b-lzcuxfd6oo],
.day-bar-container:has(.day-bar[style="width: 0%"]) .day-count[b-lzcuxfd6oo] {
    color: #64748b;
}

.empty-state-placeholder[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 24px;
    text-align: center;
    min-height: 300px;
}

.empty-state-designed[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 48px 24px;
    min-height: 240px;
}

.empty-state-designed .empty-state-icon[b-lzcuxfd6oo] {
    margin-bottom: 16px;
}

.empty-state-designed .empty-state-emoji[b-lzcuxfd6oo] {
    font-size: 56px;
    line-height: 1;
    opacity: 0.9;
}

.empty-state-designed .empty-state-title[b-lzcuxfd6oo] {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
    margin: 0 0 8px 0;
    letter-spacing: -0.02em;
}

.empty-state-designed .empty-state-description[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    line-height: 1.5;
    margin: 0;
    max-width: 400px;
}

.empty-state .empty-state-designed[b-lzcuxfd6oo] {
    min-height: 200px;
}

.empty-state-placeholder.empty-state-designed[b-lzcuxfd6oo] {
    min-height: 300px;
}

.calendar-icon-large[b-lzcuxfd6oo] {
    font-size: 60px;
    margin-bottom: 20px;
    opacity: 0.5;
}

.placeholder-text[b-lzcuxfd6oo] {
    font-size: 16px;
    font-weight: 500;
    color: #1e293b;
    margin: 0 0 8px 0;
}

.placeholder-subtext[b-lzcuxfd6oo] {
    font-size: 14px;
    color: #64748b;
    margin: 0;
    max-width: 400px;
    line-height: 1.5;
}

/* Popular Months Widget */
.popular-months-widget[b-lzcuxfd6oo] {
    /* Inside right-column, no grid-column needed */
}

.chart-container[b-lzcuxfd6oo] {
    position: relative;
    height: 300px;
    width: 100%;
    margin-bottom: 16px;
}

.chart-container canvas[b-lzcuxfd6oo] {
    max-height: 300px;
}

.chart-footer[b-lzcuxfd6oo] {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: #64748b;
    padding-top: 16px;
    border-top: 1px solid #e2e8f0;
}

/* Unused Paid Time Off Widget */
.unused-pto-widget[b-lzcuxfd6oo] {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #bae6fd;
    margin-top: 24px;
}

.unused-pto-content-centered[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.unused-pto-icon-large[b-lzcuxfd6oo] {
    font-size: 64px;
    margin-bottom: 16px;
}

.unused-pto-title-centered[b-lzcuxfd6oo] {
    font-size: 14px;
    font-weight: 600;
    color: #1e3a8a;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 24px 0;
}

.unused-pto-value-centered[b-lzcuxfd6oo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.value-number-large[b-lzcuxfd6oo] {
    font-size: 80px;
    font-weight: 300;
    color: #1e293b;
    line-height: 1;
    letter-spacing: -2px;
}

.value-label-large[b-lzcuxfd6oo] {
    font-size: 18px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.unused-pto-divider[b-lzcuxfd6oo] {
    width: 80px;
    height: 2px;
    background-color: #cbd5e1;
    margin-bottom: 24px;
}

.unused-pto-metrics-centered[b-lzcuxfd6oo] {
    display: flex;
    gap: 48px;
    flex-wrap: wrap;
    justify-content: center;
}

.metric-item-centered[b-lzcuxfd6oo] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    color: #475569;
}

.metric-icon-centered[b-lzcuxfd6oo] {
    font-size: 18px;
    color: #64748b;
}

/* Empty State */
.empty-state[b-lzcuxfd6oo] {
    padding: 40px 20px;
    text-align: center;
}

/* Responsive Styles */
@media (max-width: 1200px) {
    .stats-grid[b-lzcuxfd6oo] {
        grid-template-columns: 1fr;
    }

    .right-column[b-lzcuxfd6oo] {
        /* Stack normally on smaller screens */
    }
}

@media (max-width: 960px) {
    .time-off-statistics-page[b-lzcuxfd6oo] {
        padding: 16px;
    }

    .title-with-tabs[b-lzcuxfd6oo] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .stats-tabs[b-lzcuxfd6oo] {
        width: fit-content;
    }
    
    .header-content[b-lzcuxfd6oo] {
        flex-direction: column;
        gap: 16px;
    }
    
    .header-right[b-lzcuxfd6oo] {
        width: 100%;
        justify-content: space-between;
    }
    
    .filter-container[b-lzcuxfd6oo] {
        flex-wrap: wrap;
    }
    
    .filter-buttons[b-lzcuxfd6oo] {
        width: 100%;
        flex-wrap: wrap;
    }
    
    .table-header[b-lzcuxfd6oo],
    .table-row[b-lzcuxfd6oo] {
        grid-template-columns: 40px minmax(150px, 1.4fr) minmax(110px, 1fr) minmax(110px, 1fr) 90px;
        gap: 8px;
        font-size: 12px;
    }

    .unused-pto-table .table-header[b-lzcuxfd6oo],
    .unused-pto-table .table-row[b-lzcuxfd6oo] {
        grid-template-columns: 40px minmax(160px, 1.3fr) minmax(120px, 1fr) minmax(120px, 1fr) minmax(100px, 0.9fr) 130px;
    }

    .unused-pto-search[b-lzcuxfd6oo] {
        width: 100%;
    }

    .unused-pto-filter[b-lzcuxfd6oo] {
        width: 100%;
    }

    .unused-pto-pagination-row[b-lzcuxfd6oo] {
        grid-template-columns: 1fr;
        justify-items: start;
        gap: 10px;
    }

    .unused-pto-pager[b-lzcuxfd6oo] {
        width: 100%;
        justify-content: flex-start;
    }
    
    .unused-pto-content[b-lzcuxfd6oo] {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
}

@media (max-width: 600px) {
    .table-header[b-lzcuxfd6oo],
    .table-row[b-lzcuxfd6oo] {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    
    .col-rank[b-lzcuxfd6oo],
    .col-employee[b-lzcuxfd6oo],
    .col-department[b-lzcuxfd6oo],
    .col-client[b-lzcuxfd6oo],
    .col-location[b-lzcuxfd6oo],
    .col-days[b-lzcuxfd6oo],
    .col-usage[b-lzcuxfd6oo] {
        display: flex;
        justify-content: space-between;
        padding: 4px 0;
    }

    .col-department[b-lzcuxfd6oo] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 6px;
    }
    
    .table-header[b-lzcuxfd6oo] {
        display: none;
    }
    
    .table-row[b-lzcuxfd6oo] {
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 12px;
        margin-bottom: 8px;
    }
    
    .chart-container[b-lzcuxfd6oo] {
        height: 250px;
    }
}
/* /Components/Pages/InterviewPages/Interviewer/InterviewerDetails/FeedbackList.razor.rz.scp.css */
.feedback-tab-page[b-v4nojcqee0] {
    background: #f8fafc;
    padding: 32px;
}

.feedback-content[b-v4nojcqee0] {
    margin-top: 15px;
    width: 100%;
    max-width: 100%;
}

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

.content-title[b-v4nojcqee0] {
    font-size: 24px;
    font-weight: 600;
    color: #1e293b;
}

[b-v4nojcqee0] .feedback-empty-state {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 56px 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
}

.feedback-empty-icon-wrap[b-v4nojcqee0] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
}

[b-v4nojcqee0] .feedback-empty-heading {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    color: #1e293b;
}

[b-v4nojcqee0] .feedback-empty-description {
    margin: 0;
    max-width: 640px;
    color: #64748b;
    font-size: 15px;
    line-height: 1.55;
}

.feedback-list[b-v4nojcqee0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

[b-v4nojcqee0] .feedback-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 0;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

[b-v4nojcqee0] .feedback-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.feedback-card-body[b-v4nojcqee0] {
    padding: 20px 20px 12px;
}

[b-v4nojcqee0] .feedback-comment {
    color: #334155;
    font-size: 15px;
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
}

.feedback-card-footer[b-v4nojcqee0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-top: 1px solid #f1f5f9;
}

.feedback-meta[b-v4nojcqee0] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.feedback-meta-item[b-v4nojcqee0] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.feedback-card-actions[b-v4nojcqee0] {
    display: flex;
    align-items: center;
    gap: 4px;
}

[b-v4nojcqee0] .feedback-action-btn.mud-button-root {
    height: 38px;
    border-radius: 8px;
    text-transform: none;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}
/* /Components/Pages/InterviewPages/Interviewer/InterviewerRequests/InterviewerRequestPage.razor.rz.scp.css */
.status-history-list[b-hf7wpuknqw] {
    display: flex;
    flex-direction: column;
}

.history-row[b-hf7wpuknqw] {
    display: grid;
    grid-template-columns: 120px 165px 110px 20px auto;
    align-items: center;
    gap: 8px;
}

.history-row .separator[b-hf7wpuknqw] {
    text-align: center;
}

.drop-zone[b-hf7wpuknqw] {
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.drop-zone[b-hf7wpuknqw]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.drop-zone:hover[b-hf7wpuknqw] {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.drop-zone.mud-drop-zone-drag-over[b-hf7wpuknqw] {
    transform: scale(1.02);
    box-shadow: 0 12px 40px rgba(0,0,0,0.2);
}

.drop-zone.mud-drop-zone-drag-over[b-hf7wpuknqw]::before {
    opacity: 0.1;
}

.drop-zone-requested.mud-drop-zone-drag-over[b-hf7wpuknqw]::before {
    background: #1976d2;
}

.drop-zone-progress.mud-drop-zone-drag-over[b-hf7wpuknqw]::before {
    background: #f57c00;
}

.drop-zone-completed.mud-drop-zone-drag-over[b-hf7wpuknqw]::before {
    background: #388e3c;
}

.drop-zone-cancelled.mud-drop-zone-drag-over[b-hf7wpuknqw]::before {
    background: #d32f2f;
}

.request-card[b-hf7wpuknqw] {
    transition: all 0.3s ease;
}

.request-card:hover[b-hf7wpuknqw] {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.15);
}

.request-card.mud-dragging[b-hf7wpuknqw] {
    transform: rotate(5deg) scale(1.05);
    box-shadow: 0 15px 50px rgba(0,0,0,0.3);
    z-index: 1000;
}

/* Status-based left borders */
.request-card.status-requested[b-hf7wpuknqw] {
    border-left: 4px solid #1976d2;
}

.request-card.status-inprogress[b-hf7wpuknqw] {
    border-left: 4px solid #f57c00;
}

.request-card.status-completed[b-hf7wpuknqw] {
    border-left: 4px solid #388e3c;
}

.request-card.status-cancelled[b-hf7wpuknqw] {
    border-left: 4px solid #d32f2f;
}

.text-primary[b-hf7wpuknqw] { color: #1976d2 !important; }
.text-secondary[b-hf7wpuknqw] { color: #7b1fa2 !important; }
.text-info[b-hf7wpuknqw] { color: #0288d1 !important; }
.text-warning[b-hf7wpuknqw] { color: #f57c00 !important; }
.text-success[b-hf7wpuknqw] { color: #388e3c !important; }

.font-weight-bold[b-hf7wpuknqw] { font-weight: 600 !important; }
.font-weight-medium[b-hf7wpuknqw] { font-weight: 500 !important; }

.details-eye-button:hover[b-hf7wpuknqw] {
    transform: scale(1.1);
    background-color: rgba(156, 39, 176, 0.4) !important;
    color: rgba(156, 39, 176, 0.4) !important;
    box-shadow: 0 4px 15px rgba(33, 150, 243, 0.4);
}

.ai-update-button:hover[b-hf7wpuknqw] {
    transform: scale(1.1);
    background-color: rgba(33, 150, 243, 0.4) !important;
    color: rgba(33, 150, 243, 0.4) !important;
    animation: sparkle-b-hf7wpuknqw 0.6s ease-in-out;
    box-shadow: 0 4px 15px rgba(156, 39, 176, 0.4);
}

@keyframes sparkle-b-hf7wpuknqw {
    0%, 100% { transform: scale(1.1) rotate(0deg); }
    25% { transform: scale(1.15) rotate(5deg); }
    75% { transform: scale(1.15) rotate(-5deg); }
}

.gap-2[b-hf7wpuknqw] {
    gap: 0.5rem;
}
/* /Components/Pages/InterviewPages/Interviewer/InterviewerRequests/InterviewerRequestsStatistics.razor.rz.scp.css */
.stats-container[b-rfux6nbem1] {
    border: 2px solid #000;
    border-radius: 8px;
    padding: 1.5rem;
    background-color: #f8f9fa;
    max-width: 1200px;
    margin: 0 auto;
}

.stats-content[b-rfux6nbem1] {
    display: flex;
    gap: 4rem;
    align-items: stretch
}

.stats-middle[b-rfux6nbem1] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    font-size: 1rem;
    align-items: center;
}

.requests-section[b-rfux6nbem1] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    min-width: 180px;
}

.requests-section h4[b-rfux6nbem1] {
    margin: 0 0 1rem 0;
    font-size: 0.95rem;
    font-weight: bold;
}

.request-item[b-rfux6nbem1] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.request-item:last-child[b-rfux6nbem1] {
    margin-bottom: 0;
}

.avg-section[b-rfux6nbem1] {
    border: 1px solid #000;
    border-radius: 4px;
    padding: 1rem;
    background-color: white;
    flex: 1;
}

.avg-section h4[b-rfux6nbem1] {
    margin: 0 0 1rem 0;
    font-size: 1rem;
    font-weight: bold;
}

.avg-grid[b-rfux6nbem1] {
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 0.63rem 0.9rem;
    align-items: center;
    font-size: 0.9rem;
}

.avg-label[b-rfux6nbem1] {
    white-space: nowrap;
}

.avg-values[b-rfux6nbem1] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.avg-value[b-rfux6nbem1] {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    white-space: nowrap;
}
/* /Components/Pages/InterviewPages/Interviewer/InterviewersPage.razor.rz.scp.css */
.interviewers-page[b-1ehfdxhutw] {
    padding: 1.5rem;
}

/* Data Grid Styling */
[b-1ehfdxhutw] .interviewers-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-1ehfdxhutw] .interviewers-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-1ehfdxhutw] .interviewers-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-1ehfdxhutw] .interviewers-grid .mud-table-row:hover {
    background-color: #fafafa;
}

/* Filters responsive layout */
.filters-wrapper[b-1ehfdxhutw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    width: 100%;
    align-items: flex-start;
}

.filter-item[b-1ehfdxhutw] {
    flex: 1 1 180px;
    min-width: 180px;
}

.filter-search[b-1ehfdxhutw] {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
}

.filter-clear[b-1ehfdxhutw] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    width: 100%;
}

/* Ensure full width for inputs */
[b-1ehfdxhutw] .filter-item .mud-input-control,
[b-1ehfdxhutw] .filter-item .mud-select,
[b-1ehfdxhutw] .filter-search .mud-input-control {
    width: 100%;
}

[b-1ehfdxhutw] .filter-item .mud-select-input,
[b-1ehfdxhutw] .filter-item .mud-input-slot,
[b-1ehfdxhutw] .filter-search .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .interviewers-page[b-1ehfdxhutw] {
        padding: 1rem;
    }

    .filter-item[b-1ehfdxhutw] {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .filter-item[b-1ehfdxhutw] {
        flex: 1 1 calc(33.333% - 0.75rem);
    }
}



/* /Components/Pages/InterviewPages/Interviews/InterviewsPage.razor.rz.scp.css */
.interviews-page[b-jmvuwvvozq] {
    padding: 1.5rem;
}

/* Data Grid Styling */
[b-jmvuwvvozq] .interviews-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-jmvuwvvozq] .interviews-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-jmvuwvvozq] .interviews-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-jmvuwvvozq] .interviews-grid .mud-table-row:hover {
    background-color: #fafafa;
}

/* Filters responsive layout */
.filters-wrapper[b-jmvuwvvozq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    width: 100%;
    align-items: flex-start;
}

.filter-search[b-jmvuwvvozq] {
    flex: 1 1 100%;
    width: 100%;
    min-width: 0;
}

.filter-item[b-jmvuwvvozq] {
    flex: 1 1 calc(20% - 0.75rem);
    min-width: 180px;
}

.filter-clear[b-jmvuwvvozq] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    width: 100%;
}

/* Ensure full width for inputs */
[b-jmvuwvvozq] .filter-item .mud-input-control,
[b-jmvuwvvozq] .filter-item .mud-select,
[b-jmvuwvvozq] .filter-search .mud-input-control {
    width: 100%;
}

[b-jmvuwvvozq] .filter-item .mud-select-input,
[b-jmvuwvvozq] .filter-item .mud-input-slot,
[b-jmvuwvvozq] .filter-search .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .interviews-page[b-jmvuwvvozq] {
        padding: 1rem;
    }

    .filter-item[b-jmvuwvvozq] {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .filter-item[b-jmvuwvvozq] {
        flex: 1 1 calc(33.333% - 0.75rem);
    }
}
/* /Components/Pages/InterviewPages/Interviews/InterviewsReportPage.razor.rz.scp.css */
.interviews-report-page[b-eexabx75rd] {
    padding: 1.5rem;
}

/* Statistics badges */
.stat-badge[b-eexabx75rd] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.9rem;
}

.stat-badge.total[b-eexabx75rd] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.stat-badge.with-feedback[b-eexabx75rd] {
    background-color: #e8f5e9;
    color: #388e3c;
}

.stat-badge.without-feedback[b-eexabx75rd] {
    background-color: #fff3e0;
    color: #f57c00;
}

.stat-badge i[b-eexabx75rd] {
    font-size: 0.6rem;
}

/* Data Grid Styling */
[b-eexabx75rd] .interviews-grid {
    border-radius: 8px;
    overflow: hidden;
}

[b-eexabx75rd] .interviews-grid .mud-table-cell {
    padding: 12px 16px;
}

[b-eexabx75rd] .interviews-grid .mud-table-head .mud-table-cell {
    font-weight: 600;
    background-color: #f5f5f5;
}

[b-eexabx75rd] .interviews-grid .mud-table-row:hover {
    background-color: #fafafa;
}

/* Filters responsive layout */
.filters-wrapper[b-eexabx75rd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    width: 100%;
    align-items: flex-start;
}

.filter-item[b-eexabx75rd] {
    flex: 1 1 180px;
    min-width: 180px;
}

.filter-clear[b-eexabx75rd] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    width: 100%;
}

/* Ensure full width for inputs */
[b-eexabx75rd] .filter-item .mud-input-control,
[b-eexabx75rd] .filter-item .mud-select,
[b-eexabx75rd] .filter-item .mud-select-extended {
    width: 100%;
}

[b-eexabx75rd] .filter-item .mud-select-input,
[b-eexabx75rd] .filter-item .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* PDF Preview Modal */
.dialog-overlay[b-eexabx75rd] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    animation: fadeIn-b-eexabx75rd 0.2s ease-in-out;
}

@keyframes fadeIn-b-eexabx75rd {
    from { opacity: 0; }
    to { opacity: 1; }
}

.preview-layout[b-eexabx75rd] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    animation: slideIn-b-eexabx75rd 0.3s ease-out;
}

@keyframes slideIn-b-eexabx75rd {
    from { transform: translateY(-40px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.pdf-preview-area[b-eexabx75rd] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-eexabx75rd] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-eexabx75rd] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .interviews-report-page[b-eexabx75rd] {
        padding: 1rem;
    }

    .filter-item[b-eexabx75rd] {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .filter-item[b-eexabx75rd] {
        flex: 1 1 calc(33.333% - 0.75rem);
    }
}
/* /Components/Pages/JobDescription/Jobs/ClientJobPreview.razor.rz.scp.css */
body[b-9krd47hbh8] {
    font-family: 'Montserrat', sans-serif;
    background-color: #f8f9fa;
    color: #343a40;
    line-height: 1.6;
}

.resume-container[b-9krd47hbh8] {
    max-width: 854px;
    width: 100%;
    background-color: transparent;
    border-radius: 12px;
    padding: 30px;
    margin: 20px auto;
}

.header[b-9krd47hbh8] {
    margin-bottom: 25px;
}

.candidate-id[b-9krd47hbh8] {
    color: #4A5460;
    font-weight: 500;
    font-size: 24px;
    margin-bottom: 10px;
}

.status-badge[b-9krd47hbh8] {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
}

.status-review[b-9krd47hbh8] {
    background-color: #EAFAE4;
    color: #5a8f44;
}

.status-interview[b-9krd47hbh8] {
    background-color: #DBF2FF;
    color: #23A8E8;
}

.status-later[b-9krd47hbh8] {
    background-color: #FBE7D9;
    color: #F97316;
}

.status-reject[b-9krd47hbh8] {
    background-color: #FAC7C7;
    color: #E13535;
}

.job-title[b-9krd47hbh8] {
    font-size: 36px;
    font-weight: 800;
    text-transform: uppercase;
    margin: 15px 0;
    color: #262626;
}

.section-card[b-9krd47hbh8] {
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
}

.section-title[b-9krd47hbh8] {
    background-color: transparent;
    padding: 18px 25px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-transform: uppercase;
    color: #262626;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    transition: background-color 0.2s ease-in-out, border-color 0.35s ease;
}

.section-title:hover[b-9krd47hbh8] {
    background-color: #e9ecef;
}

.section-title[b-9krd47hbh8]:after {
    content: "";
    border: solid #495057;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: rotate(45deg);
    transition: transform 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.section-title.expanded[b-9krd47hbh8] {
    border-bottom-color: #dee2e6;
}

.section-title.expanded[b-9krd47hbh8]:after {
    transform: rotate(-135deg);
}

.section-content[b-9krd47hbh8] {
    padding: 0 24px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    opacity 0.3s ease-in-out,
    padding-top 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    padding-bottom 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.section-content.active[b-9krd47hbh8] {
    padding: 15px 24px 15px 24px;
    max-height: 2000px;
    opacity: 1;
}

.summary-section-content[b-9krd47hbh8] {
    padding: 0 24px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    opacity 0.3s ease-in-out,
    padding-top 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    padding-bottom 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.summary-section-content.active[b-9krd47hbh8] {
    padding: 24px;
    max-height: 2000px;
    opacity: 1;
}

.responsibilities[b-9krd47hbh8] {
    padding-left: 20px;
    margin-top: 10px;
}

.responsibilities li[b-9krd47hbh8] {
    margin-bottom: 8px;
}

ul.responsibilities[style*="column-count"][b-9krd47hbh8] {
    padding-left: 20px;
}

.experience-item[b-9krd47hbh8] {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e9ecef;
}

.experience-item:last-child[b-9krd47hbh8] {
    border-bottom: none;
    margin-bottom: 0;
}

.job-header[b-9krd47hbh8] {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

.job-position[b-9krd47hbh8] {
    font-weight: bold;
    margin-right: 5px;
}

.edu-header[b-9krd47hbh8] {
    color: #262626;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

.edu-info[b-9krd47hbh8] {
    color: #2D3648;
    font-size: 16px;
    font-weight: 400;
}

.company[b-9krd47hbh8] {
    color: #495057;
}

.date[b-9krd47hbh8] {
    color: #797979;
    font-size: 16px;
    font-weight: 400;
}

.project-name[b-9krd47hbh8] {
    margin-top: 10px;
}

.tech-stack[b-9krd47hbh8] {
    margin: 10px 0;
    color: #343a40;
}

.section-text[b-9krd47hbh8] {
    color: #262626;
    font-size: 16px;
    font-weight: 400;
}

.section-summary[b-9krd47hbh8] {
    color: #262626;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    padding: 10px 0;
    text-transform: uppercase;
}


.top-nav-bar[b-9krd47hbh8] {
    position: sticky !important;
    height: 82px;
    z-index: 1000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #ffffff;
    border-bottom: 1px solid #e0e0e0;
    width: 100%;
    box-sizing: border-box;
}

.expired-logo-container[b-9krd47hbh8] {
    height: 115px;
    width: 121px;
    margin-bottom: 2.5rem;
}

.logo-container-nav[b-9krd47hbh8] {
    margin-left: 30px;
    display: flex;
    align-items: center;
    padding: 0;
}

.nav-logo-opinov8[b-9krd47hbh8],
.nav-logo-client[b-9krd47hbh8] {
    height: 35px;
    width: auto;
}

.logo-separator[b-9krd47hbh8] {
    display: block;
    width: 1px;
    height: 28px;
    background-color: #ccc;
    margin: 0 15px;
}

.nav-actions[b-9krd47hbh8] {
    display: flex;
    align-items: center;
    gap: 24px;
}

.nav-action-button[b-9krd47hbh8] {
    height: 48px;
    margin-left: 10px;
    border-radius: 20px;
    padding: 8px 15px;
    font-size: 16px;
}

.btn-pass[b-9krd47hbh8] {
    color: #E13535;
    font-weight: 700;
}

.btn-later[b-9krd47hbh8] {
    background-color: #FFFFFF;
    color: #4AC4FF !important;
    font-weight: 700;
    line-height: 1;
    border: 2px solid #4AC4FF;
    border-radius: 30px;
    padding: 8px 24px;
    display: inline-block;
    text-align: center;
    box-shadow: none;
    outline: none;
}

.btn-later:hover[b-9krd47hbh8] {
    background-color: rgba(74, 196, 255, 0.1);
}

.btn-interview[b-9krd47hbh8] {
    background-color: #4AC4FF;
    color: #FFFFFF !important;
    font-weight: 700;
    line-height: 1;
    border: none;
    border-radius: 30px;
    padding: 8px 24px;
    display: inline-block;
    text-align: center;
    box-shadow: none;
    outline: none;
}

.btn-interview:hover[b-9krd47hbh8] {
    background-color: #3AB0E6;
}

.modal-footer .btn[b-9krd47hbh8] {
    border-radius: 30px;
    padding: 8px 24px;
    font-weight: 700;
    font-size: 14px;
}

.modal-footer .btn-outline-secondary[b-9krd47hbh8] {
    color: #4AC4FF !important;
    background-color: transparent !important;
    border: 2px solid #4AC4FF !important;
}
.modal-footer .btn-outline-secondary:hover[b-9krd47hbh8] {
    background-color: rgba(74, 196, 255, 0.1) !important;
}

.modal-footer .btn-primary[b-9krd47hbh8] {
    color: #FFFFFF !important;
    background-color: #4AC4FF !important;
    border: none !important;
}
.modal-footer .btn-primary:hover[b-9krd47hbh8] {
    background-color: #3AB0E6 !important;
}

.btn-add-date-time[b-9krd47hbh8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    font-weight: 700;
    font-size: 14px;
    color: #4A5460;
    cursor: pointer;
    outline: none;
}

.btn-add-date-time:hover[b-9krd47hbh8],
.btn-add-date-time:focus[b-9krd47hbh8],
.btn-add-date-time:active[b-9krd47hbh8] {
    text-decoration: none;
    background: none;
    border: none;
    outline: none;
}

.b5[b-9krd47hbh8] {
    font-size: 16px;
    font-weight: 600;
    color: #4A5460;
}

.b4[b-9krd47hbh8] {
    font-size: 16px;
    font-weight: 400;
    color: #4A5460;
}

.b2[b-9krd47hbh8] {
    font-size: 14px;
    font-weight: 500;
    color: #262626;
}

.b1[b-9krd47hbh8] {
    font-size: 14px;
    font-weight: 400;
    color: #4A5460
}

.h5[b-9krd47hbh8] {
    font-size: 24px;
    font-weight: 800;
    color: #262626;
}

.custom-radio[b-9krd47hbh8] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.form-check-label[b-9krd47hbh8] {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    user-select: none;
}

.custom-radio:checked ~ .form-check-label[b-9krd47hbh8]::before {
    border-color: #2196F3;
}

.custom-radio:not(:checked):hover ~ .form-check-label[b-9krd47hbh8]::before {
    border-color: #aaa;
}

.form-check-label[b-9krd47hbh8]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 20px;
    width: 20px;
    background-color: white;
    border: 2px solid #ccc;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.form-check-label[b-9krd47hbh8]::after {
    content: "";
    position: absolute;
    display: none;
    top: 50%;
    left: 10px;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #2196F3;
    transition: all 0.2s ease;
}

.custom-radio:checked ~ .form-check-label[b-9krd47hbh8]::after {
    display: block;
}

.form-check[b-9krd47hbh8] {
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    padding-left: 0 !important;
}

.custom-radio:focus ~ .form-check-label[b-9krd47hbh8]::before {
    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.25);
}

.custom-height[b-9krd47hbh8] {
    height: 40px !important;
    line-height: 40px;
    padding-top: 0;
    padding-bottom: 0;
}

.custom-rating-gap .mud-ripple[b-9krd47hbh8] {
    margin-left: 15px !important;
}

.custom-rating-gap .mud-svg-icon path:not([fill="none"])[b-9krd47hbh8] {
    fill: #4AC4FF !important;
}

.custom-rating-gap .mud-svg-icon[b-9krd47hbh8] {
    height: 30px !important;
    width: 30px !important;
}

.nav-action-button[disabled][b-9krd47hbh8] {
    border-color: #D7D7D7 !important;
    color: #868686 !important;
    cursor: not-allowed;
    background-color: transparent;
}

.btn-interview[disabled][b-9krd47hbh8] {
    background-color: #D7D7D7 !important;
    border-color: #D7D7D7 !important;
    color: #868686 !important;
}
/* /Components/Pages/JobDescription/Jobs/JobDetails/JobDetailsPage.razor.rz.scp.css */
.template-header[b-71fuoeawt5] {
    border-radius: 12px;
    background-image: linear-gradient(135deg, #4361ee, #3f37c9);
    color: white;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

.template-header h2[b-71fuoeawt5] {
    color: white;
    font-weight: 600;
}

.section-card[b-71fuoeawt5] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    border: none;
    margin-bottom: 2rem;
    overflow: hidden;
    transition: all 0.3s ease;
}

.section-card:hover[b-71fuoeawt5] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.section-header[b-71fuoeawt5] {
    display: flex;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.section-icon[b-71fuoeawt5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    margin-right: 1rem;
}

.section-icon i[b-71fuoeawt5] {
    color: #4361ee;
    font-size: 1.2rem;
}

.section-title[b-71fuoeawt5] {
    font-weight: 600;
    margin: 0;
    color: #212529;
}

.section-content[b-71fuoeawt5] {
    padding: 1.5rem;
}

.custom-input[b-71fuoeawt5] {
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
    transition: all 0.3s ease;
}

.custom-input:focus[b-71fuoeawt5] {
    border-color: #4361ee;
    box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.15);
}

.custom-textarea[b-71fuoeawt5] {
    min-height: 120px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    padding: 0.75rem 6.5rem 0.75rem 1rem;
    transition: all 0.3s ease;
}

.custom-textarea:focus[b-71fuoeawt5] {
    border-color: #4361ee;
    box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.15);
}

.btn-custom-primary[b-71fuoeawt5] {
    background-color: #4361ee;
    border-color: #4361ee;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-primary:hover[b-71fuoeawt5] {
    background-color: #3a56d4;
    border-color: #3a56d4;
    transform: translateY(-2px);
}

.btn-custom-secondary[b-71fuoeawt5] {
    background-color: white;
    border: 1px solid #6c757d;
    color: #212529;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

/* Header action row (Sync / Request interviewer / Status / Template / Export / Save / Cancel):
   keep every button on one line and the same height instead of wrapping mid-text. */
.jd-header-actions[b-71fuoeawt5] {
    row-gap: 0.5rem;
}

.jd-header-actions[b-71fuoeawt5]  .mud-button-root,
.jd-header-actions .btn-custom-secondary[b-71fuoeawt5],
.jd-header-actions > .dropdown .btn[b-71fuoeawt5] {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
}

.btn-custom-secondary:hover[b-71fuoeawt5] {
    background-color: #f8f9fa;
    border-color: #d4d7dc;
    transform: translateY(-2px);
}

.btn-custom-success[b-71fuoeawt5] {
    background-color: #0cce6b;
    border-color: #0cce6b;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-success:hover[b-71fuoeawt5] {
    background-color: #0ab55e;
    border-color: #0ab55e;
    transform: translateY(-2px);
}

.btn-custom-danger[b-71fuoeawt5] {
    background-color: white;
    border: 0.5px solid #6c757d;
    color: #e5383b;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-danger:hover[b-71fuoeawt5] {
    background-color: #fef2f2;
    color: #dc2626;
    transform: translateY(-2px);
}

.btn-custom-info[b-71fuoeawt5] {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-info:hover[b-71fuoeawt5] {
    background-color: #0d6efd;
    border-color: #0d6efd;
    transform: translateY(-2px);
}

.item-row[b-71fuoeawt5] {
    background-color: #f9fafb;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
    transition: all 0.3s ease;
}

.item-row p[b-71fuoeawt5] {
    margin-bottom: 0;
}

.item-row:hover[b-71fuoeawt5] {
    background-color: #f3f4f6;
}

.empty-state[b-71fuoeawt5] {
    background-color: #f9fafb;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    color: #6b7280;
}

.empty-state i[b-71fuoeawt5] {
    font-size: 2rem;
    margin-bottom: 1rem;
    color: #d1d5db;
}

.footer-actions[b-71fuoeawt5] {
    background-color: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

/* Custom loading spinner */
.spinner-container[b-71fuoeawt5] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spinner-container-block[b-71fuoeawt5] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-spinner[b-71fuoeawt5] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    border-top-color: #4361ee;
    animation: spinner-b-71fuoeawt5 1s linear infinite;
}

@keyframes spinner-b-71fuoeawt5 {
    to {
        transform: rotate(360deg);
    }
}

.form-label[b-71fuoeawt5] {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #4b5563;
}

.col-form-label[b-71fuoeawt5] {
    font-weight: 500;
    color: #4b5563;
}

.fixed-sidebar-actions[b-71fuoeawt5] {
    position: fixed;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1000;
}

.fixed-sidebar-actions .btn[b-71fuoeawt5] {
    width: 6rem;
    text-align: center;
}

/* Loader */

.ai-loading-container[b-71fuoeawt5] {
    border-radius: 16px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.ai-loading-card[b-71fuoeawt5] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

.ai-loading-header[b-71fuoeawt5] {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    padding: 20px;
    color: white;
}

.ai-loading-icon[b-71fuoeawt5] {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #ffeaa7 0%, #fab1a0 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #2d3436;
    animation: iconSpin-b-71fuoeawt5 3s linear infinite;
    box-shadow: 0 4px 15px rgba(255, 234, 167, 0.4);
}

.loading-subtitle[b-71fuoeawt5] {
    opacity: 0.9;
    font-size: 13px;
}

.ai-loading-content[b-71fuoeawt5] {
    padding: 30px 20px;
    background: rgba(255, 255, 255, 0.05);
}

.loading-animation-wrapper[b-71fuoeawt5] {
    text-align: center;
}

.typing-animation[b-71fuoeawt5] {
    margin-bottom: 25px;
}

.typing-dots[b-71fuoeawt5] {
    display: inline-flex;
    gap: 8px;
}

.typing-dots span[b-71fuoeawt5] {
    width: 12px;
    height: 12px;
    background: #74b9ff;
    border-radius: 50%;
    animation: typingBounce-b-71fuoeawt5 1.4s ease-in-out infinite;
    box-shadow: 0 2px 8px rgba(116, 185, 255, 0.4);
}

.typing-dots span:nth-child(2)[b-71fuoeawt5] {
    animation-delay: 0.2s;
}

.typing-dots span:nth-child(3)[b-71fuoeawt5] {
    animation-delay: 0.4s;
}

.shimmer-lines[b-71fuoeawt5] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 300px;
    margin: 0 auto;
}

.shimmer-line[b-71fuoeawt5] {
    height: 8px;
    background: linear-gradient(90deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0.3) 50%,
    rgba(255, 255, 255, 0.1) 100%);
    border-radius: 4px;
    animation: shimmer-b-71fuoeawt5 2s ease-in-out infinite;
}

.shimmer-line-1[b-71fuoeawt5] {
    width: 100%;
    animation-delay: 0s;
}

.shimmer-line-2[b-71fuoeawt5] {
    width: 75%;
    animation-delay: 0.3s;
}

.shimmer-line-3[b-71fuoeawt5] {
    width: 90%;
    animation-delay: 0.6s;
}

.ai-loading-footer[b-71fuoeawt5] {
    padding: 20px;
    background: rgba(255, 255, 255, 0.1);
    color: white;
}

.progress-wrapper[b-71fuoeawt5] {
    text-align: center;
}

.ai-progress-bar[b-71fuoeawt5] {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 8px;
}

.progress-fill[b-71fuoeawt5] {
    height: 100%;
    background: linear-gradient(90deg, #00cec9 0%, #55efc4 100%);
    border-radius: 3px;
    animation: progressFill-b-71fuoeawt5 2.5s ease-in-out infinite;
    box-shadow: 0 0 10px rgba(0, 206, 201, 0.5);
}

/* Animations */
@keyframes cardPulse-b-71fuoeawt5 {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 8px 32px rgba(102, 126, 234, 0.3);
    }
    50% {
        transform: scale(1.02);
        box-shadow: 0 12px 40px rgba(102, 126, 234, 0.4);
    }
}

@keyframes iconSpin-b-71fuoeawt5 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes typingBounce-b-71fuoeawt5 {
    0%, 60%, 100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-15px);
    }
}

@keyframes shimmer-b-71fuoeawt5 {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@keyframes progressFill-b-71fuoeawt5 {
    0% {
        width: 0;
        transform: translateX(-100%);
    }
    50% {
        width: 70%;
        transform: translateX(0%);
    }
    100% {
        width: 100%;
        transform: translateX(0%);
    }
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .ai-loading-card[b-71fuoeawt5] {
        border-radius: 12px;
    }

    .ai-loading-header[b-71fuoeawt5] {
        padding: 16px;
    }

    .ai-loading-content[b-71fuoeawt5] {
        padding: 20px 16px;
    }

    .ai-loading-icon[b-71fuoeawt5] {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

/* jds page */
.template-card[b-71fuoeawt5] {
    width: 22rem;
    height: 180px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}

.template-card:hover[b-71fuoeawt5] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.card-title[b-71fuoeawt5] {
    font-weight: 600;
    color: #212529;
}

.card-subtitle[b-71fuoeawt5] {
    font-size: 0.9rem;
    color: #6c757d;
}

.card-text[b-71fuoeawt5] {
    color: #6b7280;
    font-size: 1rem;
}

/* Style for aligning icons to the right side and keeping them in a column */
.template-card .d-flex.flex-column.align-items-end[b-71fuoeawt5] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;  /* Aligns the icons to the right side */
}

.template-card .btn-link[b-71fuoeawt5] {
    padding: 0;
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.template-card .btn-link i[b-71fuoeawt5] {
    font-size: 1.5rem;
}

.template-info[b-71fuoeawt5] {
    max-width: 75%;
}

.template-actions .btn-link[b-71fuoeawt5] {
    font-size: 1.5rem;
}

.template-actions .btn-link:not(:last-child)[b-71fuoeawt5] {
    margin-bottom: 0.5rem;
}

.template-options[b-71fuoeawt5] {
    display: flex;
    gap: 16px;
}

.template-option[b-71fuoeawt5] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    background-color: #f9fafb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    position: relative;
    overflow: hidden;
}

.template-option:hover[b-71fuoeawt5] {
    background-color: #f3f4f6;
    transform: translateY(-2px);
}

.template-option.selected[b-71fuoeawt5] {
    border-color: #6366f1;
    background-color: rgba(99, 102, 241, 0.05);
}

.template-option.selected[b-71fuoeawt5]::after {
    content: '';
    position: absolute;
    top: 14px;
    right: 14px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #6366f1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white' stroke-width='3'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7' /%3E%3C/svg%3E");
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
}

.icon-container[b-71fuoeawt5] {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    background-color: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

.icon-container i[b-71fuoeawt5] {
    font-size: 1.5rem;
}

.btn-primary[b-71fuoeawt5] {
    background-color: #6366f1;
    border-color: #6366f1;
}

.btn-primary:hover[b-71fuoeawt5] {
    background-color: #4f46e5;
    border-color: #4f46e5;
}

.btn-primary:disabled[b-71fuoeawt5] {
    background-color: #a5b4fc;
    border-color: #a5b4fc;
}

.custom-select[b-71fuoeawt5] {
    height: 50px;
    background-color: #f8f9fa;
    border-radius: 8px;
    transition: all 0.2s ease;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0.625rem 40px 0.625rem 1rem;
}

.custom-select:focus[b-71fuoeawt5] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15);
    background-color: #fff;
    outline: none;
}

.custom-select:hover[b-71fuoeawt5] {
    background-color: #f1f3f5;
}

.dropdown-container[b-71fuoeawt5] {
    margin-bottom: 0.5rem;
}

.select-icon[b-71fuoeawt5] {
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.form-label[b-71fuoeawt5] {
    margin-bottom: 0.5rem;
    color: #495057;
}

/* Add animation for dropdown */
.custom-select:focus + .select-icon i[b-71fuoeawt5] {
    transform: translateY(-50%) rotate(180deg);
    transition: transform 0.3s ease;
}

/* Add style for upload*/
@keyframes fadeIn-b-71fuoeawt5 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-71fuoeawt5 {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes pulse-b-71fuoeawt5 {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.upload-modal[b-71fuoeawt5] {
    border-radius: 12px;
    background-color: white;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
    animation: fadeIn-b-71fuoeawt5 0.3s ease-out;
    margin: 0 auto;
}

.btn-close[b-71fuoeawt5] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6c757d;
    transition: color 0.2s;
    padding: 0.25rem;
    line-height: 1;
}

.btn-close:hover[b-71fuoeawt5] {
    color: #343a40;
}

.form-label[b-71fuoeawt5] {
    display: block;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.75rem;
}

.file-upload-container[b-71fuoeawt5] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s;
    background-color: #f8f9fa;
    cursor: pointer;
}

.file-upload-container:hover[b-71fuoeawt5] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
}

.file-upload-container.drag-active[b-71fuoeawt5] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
    animation: pulse-b-71fuoeawt5 1s infinite;
}

.upload-icon[b-71fuoeawt5] {
    font-size: 2.5rem;
    color: #6c63ff;
    margin-bottom: 1rem;
}

.upload-text[b-71fuoeawt5] {
    font-size: 1rem;
    color: #495057;
    margin-bottom: 0.5rem;
}

.upload-formats[b-71fuoeawt5] {
    font-size: 0.85rem;
    color: #6c757d;
}

.file-input[b-71fuoeawt5] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.loading-container[b-71fuoeawt5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    animation: fadeIn-b-71fuoeawt5 0.3s ease-out;
}

.spinner[b-71fuoeawt5] {
    border: 4px solid rgba(108, 99, 255, 0.1);
    border-radius: 50%;
    border-top: 4px solid #6c63ff;
    width: 40px;
    height: 40px;
    animation: spin-b-71fuoeawt5 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-71fuoeawt5 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-71fuoeawt5] {
    color: #495057;
    font-weight: 500;
}

.btn-fixed[b-71fuoeawt5] {
    height: 43px;
    width: 150px;
}

/* Custom loading spinner */
.spinner-container[b-71fuoeawt5] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spinner-container-block[b-71fuoeawt5] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-spinner[b-71fuoeawt5] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    border-top-color: #4361ee;
    animation: spinner-b-71fuoeawt5 1s linear infinite;
}

@keyframes spinner-b-71fuoeawt5 {
    to {
        transform: rotate(360deg);
    }
}

.form-label[b-71fuoeawt5] {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #4b5563;
}

.col-form-label[b-71fuoeawt5] {
    font-weight: 500;
    color: #4b5563;
}

.fixed-sidebar-actions[b-71fuoeawt5] {
    position: fixed;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1000;
}

.fixed-sidebar-actions .btn[b-71fuoeawt5] {
    width: 6rem;
    text-align: center;
}


.skill-group[b-71fuoeawt5] {
    margin-bottom: 28px;
    position: relative;
}

.skill-group:last-child[b-71fuoeawt5] {
    margin-bottom: 16px;
}

.skill-icon[b-71fuoeawt5] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    color: white;
    font-weight: 600;
}

.help-text[b-71fuoeawt5] {
    font-size: 0.85rem;
    color: #718096;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.help-text i[b-71fuoeawt5] {
    color: #a0aec0;
}

.btn-fixed[b-71fuoeawt5] {
    min-width: 100px;
    height: 44px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    border: none;
}

.mud-chart-bar[b-71fuoeawt5] {
    stroke-width: 10px;
}

.btn-status[b-71fuoeawt5] {
    width: 150px;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}

.btn-status:focus[b-71fuoeawt5],
.btn-status:active[b-71fuoeawt5] {
    outline: none !important;
    box-shadow: none !important;
}

.btn-status[b-71fuoeawt5]::-moz-focus-inner {
    border: 0;
}

.cvb-arrow[b-71fuoeawt5] {
    fill: rgba(0,0,0,0.54);
    transition: transform .15s ease;
}

.cvb-rotate-180[b-71fuoeawt5] {
    transform: rotate(180deg);
}

.cvb-backdrop[b-71fuoeawt5] {
    position: fixed;
    inset: 0;
    z-index: 1045;
    background: transparent;
}

.cvb-dropdown[b-71fuoeawt5] {
    position: absolute;
    z-index: 1055;
    max-height: 380px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 0.25rem;
}

.cvb-list[b-71fuoeawt5] {
    max-height: 280px;
    overflow: auto;
    padding-left: 4px;
}

.jobs-select-btn[b-71fuoeawt5] {
    height: 60px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.dialog-overlay[b-71fuoeawt5] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1300;
    animation: fadeIn-b-71fuoeawt5 0.2s ease-in-out;
}

.preview-layout[b-71fuoeawt5] {
    display: flex;
    width: 95vw;
    max-width: 1200px;
    height: 90vh;
    gap: 24px;
    animation: slideIn-b-71fuoeawt5 0.3s ease-out;
}

@keyframes slideIn-b-71fuoeawt5 {
    from { transform: translateY(-40px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.pdf-preview-area[b-71fuoeawt5] {
    flex: 1;
    background: #525659;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-iframe[b-71fuoeawt5] {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 8px;
}

.preview-sidebar[b-71fuoeawt5] {
    width: 220px;
    flex-shrink: 0;
    background: white;
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    align-self: flex-start;
}

/* Profile view mode — info grid */
.profile-view-grid[b-71fuoeawt5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.profile-view-item[b-71fuoeawt5] {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f0f0f0;
}

.profile-view-item:nth-child(odd)[b-71fuoeawt5] {
    border-right: 1px solid #f0f0f0;
}

.profile-view-label[b-71fuoeawt5] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #9ca3af;
    margin-bottom: 0.2rem;
}

.profile-view-value[b-71fuoeawt5] {
    font-size: 0.95rem;
    color: #1f2937;
    font-weight: 500;
}

/* Profile view mode — summary blocks */
.profile-view-summary[b-71fuoeawt5] {
    padding: 1rem;
    border-bottom: 1px solid #f0f0f0;
}

.profile-view-summary-label[b-71fuoeawt5] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #9ca3af;
    margin-bottom: 0.35rem;
}

.profile-view-summary-text[b-71fuoeawt5] {
    font-size: 0.95rem;
    color: #374151;
    line-height: 1.6;
    white-space: pre-line;
}

/* Profile edit mode — section groups */
.profile-edit-group[b-71fuoeawt5] {
    background-color: #fafbfc;
    border: 1px solid #f0f0f0;
    border-radius: 8px;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
}

.profile-edit-group-title[b-71fuoeawt5] {
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

/* AI suggestion box */
.ai-suggestion-box[b-71fuoeawt5] {
    background-color: #f0fdf4;
    border: 1px solid #86efac;
    border-radius: 8px;
    padding: 0.875rem;
}

.ai-suggestion-label[b-71fuoeawt5] {
    display: flex;
    align-items: center;
    font-size: 0.8rem;
    font-weight: 600;
    color: #16a34a;
    margin-bottom: 0.4rem;
}

.ai-suggestion-content[b-71fuoeawt5] {
    font-size: 0.9rem;
    color: #374151;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .profile-view-grid[b-71fuoeawt5] {
        grid-template-columns: 1fr;
    }

    .profile-view-item:nth-child(odd)[b-71fuoeawt5] {
        border-right: none;
    }
}
/* /Components/Pages/JobDescription/Jobs/JobDetails/JobRecommendations.razor.rz.scp.css */
/* ==============================
   AI Matched Candidates - Talents Design System
   ============================== */

.mc-tab[b-96tycfmluy] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    font-family: Inter, system-ui, sans-serif;
    color: var(--talents-ink);
}

.mc-tab *[b-96tycfmluy], .mc-tab *[b-96tycfmluy]::before, .mc-tab *[b-96tycfmluy]::after {
    box-sizing: border-box;
}

/* ---------- Buttons ---------- */
.mc-btn[b-96tycfmluy] {
    height: 38px;
    padding: 0 16px;
    border-radius: 10px;
    font-family: Inter, system-ui, sans-serif;
    font-weight: 600;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
    white-space: nowrap;
}

.mc-btn:disabled[b-96tycfmluy] {
    opacity: 0.45;
    cursor: not-allowed;
}

.mc-btn-primary[b-96tycfmluy] {
    background: var(--talents-ink);
    color: white;
}

.mc-btn-primary:hover:not(:disabled)[b-96tycfmluy] {
    background: #1E4256;
}

.mc-btn-outline[b-96tycfmluy] {
    background: white;
    color: var(--talents-ink);
    border-color: var(--talents-border-strong);
}

.mc-btn-outline:hover:not(:disabled)[b-96tycfmluy] {
    background: var(--talents-bg);
    border-color: #A8E3F7;
}

/* ---------- Header ---------- */
.mc-header[b-96tycfmluy] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    flex-wrap: wrap;
    background: white;
    border: 1px solid var(--talents-border-card);
    border-radius: 12px;
    padding: 20px 22px;
}

.mc-header-text[b-96tycfmluy] {
    min-width: 0;
    flex: 1 1 280px;
}

.mc-header-title[b-96tycfmluy] {
    margin: 0 0 6px;
    font-family: Inter, system-ui, sans-serif;
    font-weight: 800;
    font-size: 22px;
    color: var(--talents-ink);
    letter-spacing: -0.01em;
    line-height: 1.2;
}

.mc-header-subtitle[b-96tycfmluy] {
    margin: 0;
    color: var(--talents-muted);
    font-size: 13px;
    line-height: 1.5;
    max-width: 540px;
}

.mc-token-badge[b-96tycfmluy] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 6px;
    padding: 2px 10px;
    border-radius: 999px;
    background: #eef2ff;
    color: #4338ca;
    border: 1px solid #c7d2fe;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
}

.mc-token-badge i[b-96tycfmluy] {
    font-size: 13px;
    opacity: 0.8;
}

.mc-token-badge strong[b-96tycfmluy] {
    font-weight: 600;
}

/* ---------- Card ---------- */
.mc-card[b-96tycfmluy] {
    background: white;
    border: 1px solid var(--talents-border-card);
    border-radius: 12px;
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.mc-card-flush[b-96tycfmluy] {
    padding: 0;
    overflow: hidden;
}

.mc-card-head[b-96tycfmluy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.mc-card-title[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 600;
    font-size: 15px;
    color: var(--talents-ink);
}

.mc-overline[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 10px;
    color: var(--talents-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.mc-prose[b-96tycfmluy] {
    margin: 0;
    font-family: Inter, system-ui, sans-serif;
    font-size: 14px;
    color: var(--talents-ink);
    line-height: 1.6;
}

.mc-prose-muted[b-96tycfmluy] {
    color: var(--talents-muted);
    font-style: italic;
    font-size: 13px;
}

.mc-list[b-96tycfmluy], .mc-list-gaps[b-96tycfmluy] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.mc-list li[b-96tycfmluy], .mc-list-gaps li[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 13.5px;
    color: var(--talents-ink);
    line-height: 1.5;
    padding-left: 22px;
    position: relative;
}

.mc-list > li[b-96tycfmluy]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    background: var(--talents-brand);
}

.mc-list-gaps > li[b-96tycfmluy]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 11px;
    width: 10px;
    height: 2px;
    border-radius: 9999px;
    background: var(--talents-placeholder);
}

.mc-twocol[b-96tycfmluy] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

/* ---------- Badge ---------- */
.mc-badge[b-96tycfmluy] {
    display: inline-flex;
    align-items: center;
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 9999px;
    border: 1.5px solid transparent;
    line-height: 1.4;
    white-space: nowrap;
}

.mc-badge-lg[b-96tycfmluy] {
    font-size: 11px;
    padding: 6px 14px;
}

.mc-badge-darkbrand[b-96tycfmluy] {
    background: var(--talents-ink);
    color: var(--talents-brand);
}

.mc-badge-brandlight[b-96tycfmluy] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
}

.mc-badge-outline[b-96tycfmluy] {
    background: white;
    color: var(--talents-label);
    border-color: var(--talents-border-strong);
}

.mc-badge-neutral[b-96tycfmluy] {
    background: var(--talents-pill-bg);
    color: var(--talents-label);
}

/* Count pill — for "6" / "3" etc. on Strengths / Gaps card heads */
.mc-count[b-96tycfmluy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 24px;
    padding: 0 9px;
    border-radius: 9999px;
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.mc-count-brandlight[b-96tycfmluy] {
    background: var(--talents-brand-light);
    color: var(--talents-brand-strong);
}

.mc-count-neutral[b-96tycfmluy] {
    background: var(--talents-pill-bg);
    color: var(--talents-label);
}

/* ---------- Legend ---------- */
.mc-legend[b-96tycfmluy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 0 2px;
}

.mc-legend-count[b-96tycfmluy] {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
}

.mc-legend-num[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--talents-ink);
}

.mc-legend-label[b-96tycfmluy] {
    font-size: 13px;
    color: var(--talents-muted);
}

.mc-legend-items[b-96tycfmluy] {
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.mc-legend-overline[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 10px;
    color: var(--talents-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.mc-legend-item[b-96tycfmluy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--talents-muted);
}

.mc-legend-range[b-96tycfmluy] {
    font-weight: 600;
}

/* ---------- Table ---------- */
.mc-thead[b-96tycfmluy], .mc-row[b-96tycfmluy] {
    display: grid;
    grid-template-columns: minmax(240px, 2fr) 130px 150px 110px 130px 110px 56px;
    gap: 16px;
    align-items: center;
}

.mc-thead[b-96tycfmluy] {
    padding: 14px 20px;
    background: var(--talents-bg);
    border-bottom: 1px solid var(--talents-border);
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 10px;
    color: var(--talents-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.mc-row[b-96tycfmluy] {
    padding: 16px 20px;
    background: white;
    cursor: pointer;
    border-top: 1px solid var(--talents-border);
    transition: background 120ms ease;
}

.mc-row:hover[b-96tycfmluy] {
    background: var(--talents-surface);
}

.mc-row:focus-visible[b-96tycfmluy] {
    outline: 2px solid var(--talents-brand);
    outline-offset: -2px;
}

.mc-cell[b-96tycfmluy] {
    min-width: 0;
}

.mc-cell-name[b-96tycfmluy] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mc-name-block[b-96tycfmluy] {
    min-width: 0;
}

.mc-name[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 13.5px;
    color: var(--talents-ink);
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mc-title[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 12px;
    color: var(--talents-muted);
    margin-top: 2px;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mc-cell-text[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 13px;
    color: var(--talents-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mc-cell-muted[b-96tycfmluy] {
    color: var(--talents-placeholder);
    font-size: 13px;
}

.mc-cell-meta[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 12px;
    color: var(--talents-muted);
    font-variant-numeric: tabular-nums;
}

.mc-cell-score[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: var(--talents-ink);
    font-variant-numeric: tabular-nums;
}

.mc-cell-action[b-96tycfmluy] {
    display: flex;
    justify-content: flex-end;
}

.mc-icon-btn[b-96tycfmluy] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1.5px solid var(--talents-border-strong);
    background: white;
    color: var(--talents-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.mc-icon-btn:hover[b-96tycfmluy] {
    border-color: #A8E3F7;
    color: var(--talents-ink);
    background: var(--talents-bg);
}

/* ---------- Avatar ---------- */
.mc-avatar[b-96tycfmluy] {
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    background: var(--talents-ink);
    color: var(--talents-brand);
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.mc-avatar-xl[b-96tycfmluy] {
    width: 48px;
    height: 48px;
    font-size: 16px;
}

/* ---------- Group banner ---------- */
.mc-group[b-96tycfmluy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    background: var(--talents-bg);
    border-top: 1px solid var(--talents-border);
    border-bottom: 1px solid var(--talents-border);
}

.mc-group-count[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 11px;
    color: var(--talents-muted);
}

/* ---------- Empty / failed states ---------- */
.mc-empty[b-96tycfmluy] {
    padding: 40px 24px;
    text-align: center;
    align-items: center;
}

.mc-empty-title[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--talents-ink);
}

.mc-empty-body[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 13px;
    color: var(--talents-muted);
    max-width: 460px;
    line-height: 1.5;
    margin: 0 auto;
}

.mc-failed[b-96tycfmluy] {
    align-items: flex-start;
}

.mc-failed-head[b-96tycfmluy] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.mc-failed-title[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--talents-ink);
}

.mc-failed-body[b-96tycfmluy] {
    margin: 0;
    font-size: 13.5px;
    color: var(--talents-label);
    line-height: 1.55;
}

.mc-failed-actions[b-96tycfmluy] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* ---------- Running (loader) ---------- */
.mc-running[b-96tycfmluy] {
    align-items: center;
    text-align: center;
    padding: 40px 24px;
    gap: 14px;
}

.mc-running-spinner[b-96tycfmluy] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    margin-bottom: 4px;
}

.mc-running-spinner-ring[b-96tycfmluy] {
    width: 72px;
    height: 72px;
    border: 4px solid var(--talents-brand-light);
    border-top-color: var(--talents-brand);
    border-radius: 50%;
    animation: mc-spin-b-96tycfmluy 0.9s linear infinite;
}

.mc-running-spinner-icon[b-96tycfmluy] {
    position: absolute;
    font-size: 1.6rem;
    color: var(--talents-brand-strong);
}

.mc-running-title[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 700;
    font-size: 18px;
    color: var(--talents-ink);
}

.mc-running-body[b-96tycfmluy] {
    margin: 0;
    font-size: 13px;
    color: var(--talents-muted);
    max-width: 460px;
    line-height: 1.5;
}

.mc-search-steps[b-96tycfmluy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    flex-wrap: nowrap;
    margin-top: 8px;
}

.mc-search-step[b-96tycfmluy] {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    min-width: 90px;
    transition: all 0.2s ease;
}

.mc-search-step i[b-96tycfmluy] {
    font-size: 1.1rem;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid currentColor;
    background: white;
}

.mc-search-step-connector[b-96tycfmluy] {
    flex: 0 1 60px;
    height: 2px;
    background: var(--talents-border-strong);
    margin: 0 0.25rem;
    margin-bottom: 1.5rem;
}

.mc-search-step-pending[b-96tycfmluy] {
    color: var(--talents-placeholder);
}

.mc-search-step-active[b-96tycfmluy] {
    color: var(--talents-brand-strong);
    font-weight: 600;
}

.mc-search-step-active i[b-96tycfmluy] {
    animation: mc-spin-b-96tycfmluy 1.2s linear infinite;
    background: var(--talents-brand-light);
}

.mc-search-step-done[b-96tycfmluy] {
    color: #15803D;
    font-weight: 500;
}

.mc-search-step-done i[b-96tycfmluy] {
    background: #F0FDF4;
}

@keyframes mc-spin-b-96tycfmluy {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.mc-funphrase[b-96tycfmluy] {
    margin-top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--talents-muted);
    font-size: 13px;
    font-style: italic;
    min-height: 1.2em;
}

.mc-funphrase-text[b-96tycfmluy] {
    animation: mc-phrase-fade-b-96tycfmluy 0.45s ease-out;
}

.mc-funphrase-dots[b-96tycfmluy] {
    display: inline-flex;
    align-items: flex-end;
    gap: 3px;
    margin-left: 2px;
    height: 0.9em;
}

.mc-funphrase-dot[b-96tycfmluy] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.4;
    animation: mc-funphrase-bounce-b-96tycfmluy 1.2s infinite ease-in-out both;
}

.mc-funphrase-dot:nth-child(1)[b-96tycfmluy] { animation-delay: -0.32s; }
.mc-funphrase-dot:nth-child(2)[b-96tycfmluy] { animation-delay: -0.16s; }
.mc-funphrase-dot:nth-child(3)[b-96tycfmluy] { animation-delay: 0s; }

@keyframes mc-funphrase-bounce-b-96tycfmluy {
    0%, 80%, 100% { transform: translateY(0) scale(0.6); opacity: 0.4; }
    40% { transform: translateY(-4px) scale(1); opacity: 1; }
}

@keyframes mc-phrase-fade-b-96tycfmluy {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ---------- Modal ---------- */
.mc-modal-overlay[b-96tycfmluy] {
    position: fixed;
    inset: 0;
    z-index: 1300;
    background: rgba(13, 45, 63, 0.32);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    animation: mc-modal-fade-b-96tycfmluy 0.16s ease-out;
}

@keyframes mc-modal-fade-b-96tycfmluy {
    from { opacity: 0; }
    to { opacity: 1; }
}

.mc-modal[b-96tycfmluy] {
    background: white;
    border: 1px solid var(--talents-border-card);
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(13, 45, 63, 0.18);
    width: 100%;
    max-width: 760px;
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: mc-modal-rise-b-96tycfmluy 0.2s ease-out;
}

@keyframes mc-modal-rise-b-96tycfmluy {
    from { opacity: 0; transform: translateY(8px) scale(0.98); }
    to { opacity: 1; transform: none; }
}

.mc-modal-head[b-96tycfmluy] {
    padding: 20px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #EDF2F5;
}

.mc-modal-head-left[b-96tycfmluy] {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.mc-modal-id[b-96tycfmluy] {
    min-width: 0;
}

.mc-modal-name[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 800;
    font-size: 22px;
    color: #0D2D3F;
    letter-spacing: -0.01em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mc-modal-subtitle[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-size: 13px;
    color: #7A9BAD;
    margin-top: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mc-modal-close[b-96tycfmluy] {
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 8px;
    background: transparent;
    border: 1.5px solid transparent;
    color: #7A9BAD;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 150ms ease, color 150ms ease;
}

.mc-modal-close:hover[b-96tycfmluy] {
    background: #F2F5F7;
    color: #0D2D3F;
}

.mc-modal-body[b-96tycfmluy] {
    overflow-y: auto;
    padding: 20px 22px;
    background: #F8FBFD;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.mc-modal-foot[b-96tycfmluy] {
    padding: 14px 20px;
    border-top: 1px solid #EDF2F5;
    background: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.mc-modal-link[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 600;
    font-size: 13px;
    color: #0D80BB;
    text-decoration: none;
}

.mc-modal-link:hover[b-96tycfmluy] {
    color: #0A5F8A;
    text-decoration: underline;
}

/* Score row inside modal */
.mc-score-row[b-96tycfmluy] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: center;
}

.mc-score-main[b-96tycfmluy] {
    min-width: 0;
}

.mc-score-value[b-96tycfmluy] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

.mc-score-num[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 800;
    font-size: 36px;
    color: #0D2D3F;
    line-height: 1;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

.mc-score-of[b-96tycfmluy] {
    font-family: Inter, system-ui, sans-serif;
    font-weight: 600;
    font-size: 14px;
    color: #7A9BAD;
}

.mc-score-meta[b-96tycfmluy] {
    margin-top: 8px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    font-family: Inter, system-ui, sans-serif;
    font-size: 12px;
    color: #7A9BAD;
}

.mc-score-meta-divider[b-96tycfmluy] {
    color: #DDE8EE;
}

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
    .mc-thead[b-96tycfmluy] {
        display: none;
    }

    .mc-row[b-96tycfmluy] {
        grid-template-columns: 1fr auto;
        gap: 12px 16px;
        padding: 14px 16px;
        grid-template-areas:
            "name verdict"
            "score score"
            "competence competence"
            "added added"
            "meta action";
    }

    .mc-row > .mc-cell-name[b-96tycfmluy] { grid-area: name; }
    .mc-row > .mc-cell:nth-child(2)[b-96tycfmluy] { grid-area: competence; }
    .mc-row > .mc-cell:nth-child(3)[b-96tycfmluy] { grid-area: added; display: none; }
    .mc-row > .mc-cell-score[b-96tycfmluy] { grid-area: score; }
    .mc-row > .mc-cell:nth-child(5)[b-96tycfmluy] { grid-area: verdict; justify-self: end; }
    .mc-row > .mc-cell-meta[b-96tycfmluy] { grid-area: meta; }
    .mc-row > .mc-cell-action[b-96tycfmluy] { grid-area: action; }
}

@media (max-width: 640px) {
    .mc-twocol[b-96tycfmluy] {
        grid-template-columns: 1fr;
    }

    .mc-modal[b-96tycfmluy] {
        max-width: 100%;
        max-height: 100vh;
        height: 100vh;
        border-radius: 0;
    }

    .mc-header[b-96tycfmluy] {
        flex-direction: column;
        align-items: stretch;
    }

    .mc-header .mc-btn[b-96tycfmluy] {
        width: 100%;
    }

    .mc-search-step[b-96tycfmluy] {
        min-width: 70px;
        font-size: 11px;
    }

    .mc-search-step-connector[b-96tycfmluy] {
        flex: 0 1 30px;
    }

    .mc-score-row[b-96tycfmluy] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/JobDescription/Jobs/JobsPage.razor.rz.scp.css */
/* ==========================================================================
   JobsPage — Talents DS aligned (consumes tokens from /css/talents-tokens.css)
   ========================================================================== */

/* ------- Page shell ------------------------------------------------------- */
.jobs-page[b-j5devxgcaa] {
    padding: var(--space-8) var(--space-6) var(--space-12);
    color: var(--ink);
    font-family: var(--font-sans);
    background: var(--neutral-bg);
    min-height: 100%;
}

.jobs-page__inner[b-j5devxgcaa] {
    max-width: 1440px;
    margin: 0 auto;
}

/* ------- Page header ------------------------------------------------------ */
.jobs-header[b-j5devxgcaa] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-6);
    margin-bottom: var(--space-6);
}

.jobs-header__title[b-j5devxgcaa] {
    font-size: var(--fs-hero);
    font-weight: var(--fw-black);
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--ink);
    margin: 0;
}

.jobs-header__subtitle[b-j5devxgcaa] {
    margin: var(--space-1) 0 0;
    font-size: var(--fs-body);
    font-weight: var(--fw-regular);
    color: var(--neutral-muted);
}

.jobs-header__actions[b-j5devxgcaa] {
    display: flex;
    gap: var(--space-2);
    align-items: center;
}

/* ------- Buttons ---------------------------------------------------------- */
.ds-btn[b-j5devxgcaa] {
    height: 38px;
    padding: 0 var(--space-4);
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-body);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background-color 150ms ease-out, border-color 150ms ease-out, color 150ms ease-out;
    white-space: nowrap;
    line-height: 1;
}

.ds-btn:focus-visible[b-j5devxgcaa] {
    outline: none;
    box-shadow: var(--focus-brand);
}

.ds-btn:disabled[b-j5devxgcaa],
.ds-btn[disabled][b-j5devxgcaa] {
    opacity: 0.45;
    cursor: not-allowed;
}

.ds-btn--primary[b-j5devxgcaa] {
    background: var(--ink);
    color: white;
}
.ds-btn--primary:hover[b-j5devxgcaa] { background: #1E4256; }

.ds-btn--secondary[b-j5devxgcaa] {
    background: white;
    color: var(--ink);
    border-color: var(--neutral-border-strong);
}
.ds-btn--secondary:hover[b-j5devxgcaa] {
    border-color: var(--brand-200);
    background: var(--neutral-bg);
}

/* ------- Toolbar ---------------------------------------------------------- */
.jobs-toolbar[b-j5devxgcaa] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    padding: var(--space-3);
    margin-bottom: var(--space-5);
    display: flex;
    gap: var(--space-2);
    flex-wrap: wrap;
    align-items: center;
}

.jobs-toolbar__search[b-j5devxgcaa] {
    flex: 1 1 280px;
    position: relative;
    min-width: 240px;
}

.jobs-toolbar__search-icon[b-j5devxgcaa] {
    position: absolute;
    left: var(--space-3);
    top: 50%;
    transform: translateY(-50%);
    color: var(--neutral-placeholder);
    pointer-events: none;
    display: flex;
}

.jobs-toolbar__search-input[b-j5devxgcaa] {
    width: 100%;
    height: 38px;
    padding: 0 var(--space-3) 0 38px;
    background: var(--neutral-bg);
    border: 1.5px solid transparent;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    color: var(--ink);
    transition: background-color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out;
}
.jobs-toolbar__search-input[b-j5devxgcaa]::placeholder { color: var(--neutral-placeholder); }
.jobs-toolbar__search-input:hover[b-j5devxgcaa] { background: white; border-color: var(--neutral-border-strong); }
.jobs-toolbar__search-input:focus[b-j5devxgcaa] {
    outline: none;
    background: white;
    border-color: var(--brand-400);
    box-shadow: var(--focus-brand);
}

/* Date range cluster ----------------------------------------------------- */
.jobs-daterange[b-j5devxgcaa] {
    display: inline-flex;
    align-items: center;
    height: 38px;
    background: white;
    border: 1.5px solid var(--neutral-border-strong);
    border-radius: var(--radius-md);
    padding: 0 var(--space-1);
    gap: var(--space-1);
}
.jobs-daterange__btn[b-j5devxgcaa] {
    width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: none; cursor: pointer;
    color: var(--neutral-label);
    border-radius: var(--radius-sm);
}
.jobs-daterange__btn:hover[b-j5devxgcaa] { background: var(--neutral-pill-bg); color: var(--ink); }
.jobs-daterange__btn[disabled][b-j5devxgcaa] { opacity: 0.35; cursor: not-allowed; }

.jobs-daterange__picker[b-j5devxgcaa] {
    display: inline-flex; align-items: center; gap: var(--space-2);
    padding: 0 var(--space-2);
    font-size: var(--fs-body);
    color: var(--ink);
    cursor: pointer;
    user-select: none;
    height: 30px;
}
.jobs-daterange__picker .jobs-daterange__placeholder[b-j5devxgcaa] {
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
}

/* Strip default MudDateRangePicker chrome inside our pill */
[b-j5devxgcaa] .jobs-daterange__picker .mud-input-control {
    margin: 0;
    min-width: 220px;
}
[b-j5devxgcaa] .jobs-daterange__picker .mud-input.mud-input-text-no-margin {
    margin: 0;
}
[b-j5devxgcaa] .jobs-daterange__picker .mud-input-slot {
    height: 30px;
    padding: 0;
    color: var(--ink);
}
[b-j5devxgcaa] .jobs-daterange__picker .mud-input-underline:before,
[b-j5devxgcaa] .jobs-daterange__picker .mud-input-underline:after {
    display: none;
}

/* Filter pill (Competences) ---------------------------------------------- */
.jobs-filter[b-j5devxgcaa] {
    position: relative;
}

.jobs-filter__btn[b-j5devxgcaa] {
    height: 38px;
    padding: 0 var(--space-3);
    background: white;
    border: 1.5px solid var(--neutral-border-strong);
    border-radius: var(--radius-md);
    color: var(--ink);
    font-family: var(--font-sans);
    font-weight: var(--fw-medium);
    font-size: var(--fs-body);
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    transition: border-color 150ms, background-color 150ms;
    min-width: 0;
}
.jobs-filter__btn:hover[b-j5devxgcaa] { border-color: var(--brand-200); background: var(--neutral-bg); }
.jobs-filter__btn[aria-expanded="true"][b-j5devxgcaa],
.jobs-filter__btn.is-active[b-j5devxgcaa] {
    border-color: var(--ink);
}

.jobs-filter__label[b-j5devxgcaa] {
    color: var(--neutral-label);
    font-weight: var(--fw-semibold);
}

.jobs-filter__value[b-j5devxgcaa] {
    color: var(--ink);
    font-weight: var(--fw-semibold);
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.jobs-filter__chevron[b-j5devxgcaa] {
    margin-left: var(--space-1);
    color: var(--neutral-label);
    transition: transform 150ms;
    display: flex;
}

.jobs-filter__menu[b-j5devxgcaa] {
    min-width: 320px;
    max-width: 360px;
    padding: var(--space-3);
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-md);
    background: white;
    overflow: hidden;
    overflow-x: hidden;
}
.jobs-filter__menu .form-control-sm[b-j5devxgcaa] {
    margin-bottom: var(--space-2);
    position: static;
    background: white;
}
.jobs-filter__list[b-j5devxgcaa] {
    max-height: 340px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 2px;
}
.jobs-filter__menu .form-check[b-j5devxgcaa] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 4px 6px;
    margin: 0;
    border-radius: var(--radius-sm);
}
.jobs-filter__menu .form-check-input[b-j5devxgcaa] {
    float: none;
    margin: 0.22rem 0 0 0;
    flex: 0 0 auto;
}
.jobs-filter__menu .form-check-label[b-j5devxgcaa] {
    margin: 0;
    cursor: pointer;
    overflow-wrap: anywhere;
}
.jobs-filter__menu .form-check:hover[b-j5devxgcaa] {
    background: var(--neutral-bg);
}

/* Spacer pushes filter pill to the right ------------------------------- */
.jobs-toolbar__spacer[b-j5devxgcaa] { flex: 1 1 0; min-width: 0; }

/* ------- Result meta ------------------------------------------------------ */
.jobs-meta[b-j5devxgcaa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.jobs-meta__count[b-j5devxgcaa] {
    font-size: var(--fs-label);
    font-weight: var(--fw-semibold);
    color: var(--neutral-label);
}
.jobs-meta__count strong[b-j5devxgcaa] {
    color: var(--ink);
    font-weight: var(--fw-bold);
}

.jobs-meta__clear[b-j5devxgcaa] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: none;
    color: var(--brand-600);
    font-family: var(--font-sans);
    font-size: var(--fs-label);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    padding: 4px var(--space-2);
    border-radius: var(--radius-sm);
    transition: background-color 150ms, color 150ms;
}
.jobs-meta__clear:hover[b-j5devxgcaa] {
    color: var(--ink);
    background: var(--neutral-pill-bg);
}

/* ------- Jobs table card ------------------------------------------------- */
.jobs-table-card[b-j5devxgcaa] {
    background: white;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    overflow: hidden;
}

/* MudDataGrid header/cells re-skin */
[b-j5devxgcaa] .jobs-grid {
    box-shadow: none;
    border: none;
    background: transparent;
}
[b-j5devxgcaa] .jobs-grid .mud-table-container {
    overflow-x: auto;
}
[b-j5devxgcaa] .jobs-grid table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    color: var(--ink);
}
[b-j5devxgcaa] .jobs-grid thead th {
    text-align: left;
    padding: var(--space-3) var(--space-4) !important;
    font-size: var(--fs-overline);
    font-weight: var(--fw-bold);
    color: var(--neutral-placeholder);
    letter-spacing: 0.09em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--neutral-border);
    background: var(--neutral-surface) !important;
    white-space: nowrap;
}
[b-j5devxgcaa] .jobs-grid tbody td {
    padding: var(--space-3) var(--space-4) !important;
    border-bottom: 1px solid var(--neutral-border);
    vertical-align: middle;
    line-height: 1.4;
    color: var(--ink);
}
[b-j5devxgcaa] .jobs-grid tbody tr:last-child td {
    border-bottom: none;
}
[b-j5devxgcaa] .jobs-grid tbody tr {
    transition: background-color 150ms ease-out;
}
[b-j5devxgcaa] .jobs-grid tbody tr:hover {
    background: var(--neutral-bg);
}
[b-j5devxgcaa] .jobs-grid--clickable tbody tr {
    cursor: pointer;
}

/* Column header (sort button + filter icon) */
.jobs-column-header[b-j5devxgcaa] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}
.jobs-sort-btn[b-j5devxgcaa] {
    border: none;
    background: transparent;
    padding: 0;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}
.jobs-sort-btn:hover[b-j5devxgcaa] { color: var(--ink); }

/* Cell content -------------------------------------------------------- */
.cell-title[b-j5devxgcaa] {
    font-weight: var(--fw-semibold);
    color: var(--ink);
}
.cell-title a[b-j5devxgcaa] {
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 150ms, color 150ms;
}
.cell-title a:hover[b-j5devxgcaa] {
    color: var(--brand-700);
    border-bottom-color: var(--brand-200);
}

.cell-muted[b-j5devxgcaa] { color: var(--neutral-muted); }
.cell-date[b-j5devxgcaa] {
    color: var(--neutral-label);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.cell-empty[b-j5devxgcaa] { color: var(--neutral-placeholder); }

/* Inline, on-the-fly date editing in the grid (shown instead of the plain
   text cell when job-dates editing is enabled in Settings). No adornment icon
   and a numeric dd.MM.yyyy format so the value always fits without truncation. */
.jobs-inline-date[b-j5devxgcaa] {
    width: 100px;
}
.jobs-inline-date[b-j5devxgcaa]  .mud-input-control {
    min-height: 0;
}
.jobs-inline-date[b-j5devxgcaa]  .mud-input {
    font-size: inherit;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.jobs-inline-date[b-j5devxgcaa]  .mud-input-slot {
    padding: 2px 4px;
}

/* Priority indicator -------------------------------------------------- */
.priority[b-j5devxgcaa] {
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-weight: var(--fw-semibold); color: var(--ink);
    font-variant-numeric: tabular-nums;
}
.priority__bar[b-j5devxgcaa] {
    display: inline-flex; gap: 2px; align-items: flex-end;
}
.priority__bar span[b-j5devxgcaa] {
    width: 3px; background: var(--dot-empty); border-radius: 1px;
}
.priority__bar span:nth-child(1)[b-j5devxgcaa] { height: 6px; }
.priority__bar span:nth-child(2)[b-j5devxgcaa] { height: 9px; }
.priority__bar span:nth-child(3)[b-j5devxgcaa] { height: 12px; }
.priority--p1 .priority__bar span[b-j5devxgcaa] { background: var(--error); }
.priority--p2 .priority__bar span:nth-child(-n+2)[b-j5devxgcaa] { background: var(--warning); }
.priority--p3 .priority__bar span:nth-child(-n+1)[b-j5devxgcaa] { background: var(--brand-400); }
.priority__meta[b-j5devxgcaa] {
    color: var(--neutral-placeholder);
    font-weight: var(--fw-medium);
}

/* Candidate count chip ----------------------------------------------- */
.cand-pill[b-j5devxgcaa] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 22px;
    padding: 0 var(--space-2);
    border-radius: var(--radius-sm);
    background: var(--neutral-pill-bg);
    color: var(--ink);
    font-weight: var(--fw-semibold);
    font-size: var(--fs-label);
    font-variant-numeric: tabular-nums;
}
.cand-pill--zero[b-j5devxgcaa] { color: var(--neutral-placeholder); background: transparent; }

/* Recruiter / person cell ------------------------------------------- */
.person[b-j5devxgcaa] {
    display: inline-flex; align-items: center; gap: var(--space-2);
    min-width: 0;
}
.avatar[b-j5devxgcaa] {
    flex-shrink: 0;
    width: 26px; height: 26px;
    border-radius: var(--radius-full);
    background: var(--ink);
    color: var(--brand-400);
    font-weight: var(--fw-bold);
    font-size: 10px;
    letter-spacing: 0.02em;
    display: inline-flex; align-items: center; justify-content: center;
    text-transform: uppercase;
}
.person__name[b-j5devxgcaa] {
    color: var(--ink);
    font-weight: var(--fw-medium);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.recruiters-col[b-j5devxgcaa] { display: flex; flex-direction: column; gap: 4px; }
.recruiters-col .person + .person[b-j5devxgcaa] { margin-top: 2px; }

/* Status badge ------------------------------------------------------- */
.status[b-j5devxgcaa] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: 3px var(--space-2);
    border-radius: var(--radius-full);
    font-size: var(--fs-overline);
    font-weight: var(--fw-bold);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    border: 1px solid transparent;
}
.status__dot[b-j5devxgcaa] {
    width: 6px; height: 6px; border-radius: var(--radius-full);
    display: inline-block;
}
.status--open[b-j5devxgcaa]      { background: var(--info-bg);    color: var(--brand-700); }
.status--open      .status__dot[b-j5devxgcaa] { background: var(--brand-400); }
.status--draft[b-j5devxgcaa]     { background: var(--neutral-pill-bg); color: var(--neutral-label); }
.status--draft     .status__dot[b-j5devxgcaa] { background: var(--neutral-placeholder); }
.status--onhold[b-j5devxgcaa]    { background: var(--warning-bg); color: var(--warning-text); }
.status--onhold    .status__dot[b-j5devxgcaa] { background: var(--warning); }
.status--hired[b-j5devxgcaa]     { background: var(--success-bg); color: var(--success-text); }
.status--hired     .status__dot[b-j5devxgcaa] { background: var(--success); }
.status--cancelled[b-j5devxgcaa] { background: var(--error-bg);   color: var(--error-text); }
.status--cancelled .status__dot[b-j5devxgcaa] { background: var(--error); }

/* ------- Pagination ------------------------------------------------- */
.jobs-pagination[b-j5devxgcaa] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    margin-top: var(--space-5);
    padding: 0 var(--space-1);
}

/* ------- Modal ------------------------------------------------------ */
.ds-modal-backdrop[b-j5devxgcaa] {
    position: fixed; inset: 0;
    background: rgba(13, 45, 63, 0.55);
    backdrop-filter: blur(2px);
    z-index: 1050;
    display: flex; align-items: center; justify-content: center;
    padding: var(--space-5);
    animation: fade-in-b-j5devxgcaa 150ms ease-out;
}
@keyframes fade-in-b-j5devxgcaa { from { opacity: 0; } to { opacity: 1; } }

.ds-modal[b-j5devxgcaa] {
    background: white;
    border-radius: var(--radius-xl);
    border: 1px solid var(--neutral-card-border);
    box-shadow: var(--shadow-md);
    width: 100%;
    max-width: 760px;
    max-height: calc(100vh - 64px);
    display: flex; flex-direction: column;
    overflow: hidden;
}
.ds-modal--wide[b-j5devxgcaa] { max-width: 880px; }

.ds-modal__header[b-j5devxgcaa] {
    display: flex; align-items: center; justify-content: space-between;
    padding: var(--space-5) var(--space-6);
    border-bottom: 1px solid var(--neutral-border);
}
.ds-modal__title[b-j5devxgcaa] {
    font-size: var(--fs-section);
    font-weight: var(--fw-bold);
    color: var(--ink);
    margin: 0;
}
.ds-modal__close[b-j5devxgcaa] {
    width: 32px; height: 32px;
    border-radius: var(--radius-md);
    background: transparent; border: none; cursor: pointer;
    color: var(--neutral-label);
    display: inline-flex; align-items: center; justify-content: center;
}
.ds-modal__close:hover[b-j5devxgcaa] { color: var(--ink); background: var(--neutral-pill-bg); }

.ds-modal__body[b-j5devxgcaa] {
    padding: var(--space-6);
    overflow-y: auto;
    flex: 1;
}
.ds-modal__intro[b-j5devxgcaa] {
    font-size: var(--fs-body);
    color: var(--neutral-muted);
    margin: 0 0 var(--space-5);
}

.ds-modal__footer[b-j5devxgcaa] {
    display: flex; justify-content: flex-end; gap: var(--space-2);
    padding: var(--space-4) var(--space-6);
    border-top: 1px solid var(--neutral-border);
    background: var(--neutral-surface);
}

/* Modal type-picker grid -------------------------------------------- */
.type-picker[b-j5devxgcaa] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-3);
}
.type-option[b-j5devxgcaa] {
    background: white;
    border: 1.5px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    padding: var(--space-5) var(--space-4);
    cursor: pointer;
    text-align: center;
    transition: border-color 150ms, background-color 150ms, transform 150ms;
    display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
    position: relative;
}
.type-option:hover[b-j5devxgcaa] {
    border-color: var(--brand-200);
    background: var(--neutral-bg);
}
.type-option.is-selected[b-j5devxgcaa] {
    border-color: var(--ink);
    background: white;
    box-shadow: var(--shadow-sm);
}
.type-option.is-selected[b-j5devxgcaa]::after {
    content: '';
    position: absolute;
    top: 12px; right: 12px;
    width: 18px; height: 18px;
    border-radius: var(--radius-full);
    background: var(--ink);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%234AC4FF' stroke-width='3'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7' /%3E%3C/svg%3E");
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
}
.type-option__icon[b-j5devxgcaa] {
    width: 48px; height: 48px;
    border-radius: var(--radius-lg2);
    background: var(--info-bg);
    color: var(--brand-700);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: var(--space-1);
    font-size: 22px;
}
.type-option.is-selected .type-option__icon[b-j5devxgcaa] {
    background: var(--ink);
    color: var(--brand-400);
}
.type-option__title[b-j5devxgcaa] {
    font-size: var(--fs-card);
    font-weight: var(--fw-semibold);
    color: var(--ink);
}
.type-option__body[b-j5devxgcaa] {
    font-size: var(--fs-label);
    color: var(--neutral-muted);
    line-height: 1.4;
}

/* Form fields ------------------------------------------------------ */
.form-grid[b-j5devxgcaa] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4) var(--space-4);
}
.form-grid--3[b-j5devxgcaa] { grid-template-columns: repeat(3, 1fr); }

.form-field[b-j5devxgcaa] { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.form-field__label[b-j5devxgcaa] {
    font-size: var(--fs-label);
    font-weight: var(--fw-semibold);
    color: var(--neutral-label);
}
.form-field__label .required[b-j5devxgcaa] { color: var(--error-text); margin-left: 2px; }

/* File upload drop zone -------------------------------------------- */
.upload-zone[b-j5devxgcaa] {
    border: 1.5px dashed var(--neutral-border-strong);
    border-radius: var(--radius-lg2);
    background: var(--neutral-surface);
    padding: var(--space-6);
    text-align: center;
    cursor: pointer;
    transition: border-color 150ms, background-color 150ms;
    display: flex; flex-direction: column; align-items: center; gap: var(--space-2);
}
.upload-zone:hover[b-j5devxgcaa],
.upload-zone.is-drag[b-j5devxgcaa] {
    border-color: var(--brand-400);
    background: var(--info-bg);
}
.upload-zone__icon[b-j5devxgcaa] {
    width: 40px; height: 40px;
    border-radius: var(--radius-lg);
    background: white;
    color: var(--brand-600);
    display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--neutral-card-border);
    font-size: 18px;
}
.upload-zone__title[b-j5devxgcaa] {
    font-size: var(--fs-body);
    font-weight: var(--fw-semibold);
    color: var(--ink);
}
.upload-zone__hint[b-j5devxgcaa] {
    font-size: var(--fs-label);
    color: var(--neutral-muted);
}
.upload-zone__chip[b-j5devxgcaa] {
    display: inline-flex; align-items: center; gap: 6px;
    margin-top: var(--space-2);
    padding: 4px var(--space-3);
    background: var(--ink); color: var(--brand-400);
    border-radius: var(--radius-full);
    font-size: var(--fs-label); font-weight: var(--fw-semibold);
}

/* Textarea -------------------------------------------------------- */
[b-j5devxgcaa] textarea.ds-textarea {
    width: 100%;
    min-height: 140px;
    padding: var(--space-3);
    background: var(--neutral-surface, #FAFCFD) !important;
    border: 1.5px solid var(--neutral-border-strong, #D3E2EA) !important;
    border-radius: var(--radius-md);
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    color: var(--ink) !important;
    resize: vertical;
    transition: border-color 150ms, background-color 150ms, box-shadow 150ms;
    outline: none;
    box-shadow: none;
}
[b-j5devxgcaa] textarea.ds-textarea:hover {
    border-color: var(--neutral-placeholder, #9BB8C5);
}
[b-j5devxgcaa] textarea.ds-textarea:focus {
    outline: none;
    background: white !important;
    border-color: var(--brand-400, #4AC4FF) !important;
    box-shadow: var(--focus-brand, 0 0 0 3px rgba(74, 196, 255, 0.22)) !important;
}

/* Keep Additional notes textarea border visible even if external styles override textarea defaults */
[b-j5devxgcaa] .ds-modal__body textarea.ds-textarea {
    border: 1.5px solid var(--neutral-border-strong, #D3E2EA) !important;
    background: var(--neutral-surface, #FAFCFD) !important;
    color: var(--ink, #0D2D3F) !important;
    border-radius: var(--radius-md) !important;
}

[b-j5devxgcaa] .ds-modal__body textarea.ds-textarea:focus {
    border-color: var(--brand-400, #4AC4FF) !important;
    box-shadow: var(--focus-brand, 0 0 0 3px rgba(74, 196, 255, 0.22)) !important;
}

/* Loading / empty states ----------------------------------------- */
.jobs-loading[b-j5devxgcaa] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 72px var(--space-6);
    gap: var(--space-3);
    color: var(--neutral-muted);
}

.jobs-empty[b-j5devxgcaa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 72px var(--space-6);
    gap: var(--space-3);
}
.jobs-empty__icon[b-j5devxgcaa] {
    width: 56px; height: 56px;
    border-radius: var(--radius-xl);
    background: var(--info-bg);
    color: var(--brand-600);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: var(--space-2);
    font-size: 22px;
}
.jobs-empty__title[b-j5devxgcaa] {
    font-size: var(--fs-section);
    font-weight: var(--fw-bold);
    color: var(--ink);
}
.jobs-empty__body[b-j5devxgcaa] {
    font-size: var(--fs-body);
    color: var(--neutral-muted);
    max-width: 420px;
}

/* Responsive ---------------------------------------------------- */
@media (max-width: 1280px) {
    .jobs-page[b-j5devxgcaa] { padding: var(--space-6) var(--space-4) var(--space-10); }
    .jobs-header[b-j5devxgcaa] { flex-wrap: wrap; }
    [b-j5devxgcaa] .jobs-grid thead th,
    [b-j5devxgcaa] .jobs-grid tbody td { padding: var(--space-3) !important; }
    .form-grid--3[b-j5devxgcaa] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 960px) {
    .jobs-toolbar[b-j5devxgcaa] { gap: var(--space-2); }
    .jobs-toolbar__search[b-j5devxgcaa] { flex: 1 1 100%; min-width: 0; }
    .jobs-toolbar__spacer[b-j5devxgcaa] { display: none; }
    .jobs-filter[b-j5devxgcaa] { flex: 1 1 auto; }
    .jobs-filter__btn[b-j5devxgcaa] { width: 100%; }
    .type-picker[b-j5devxgcaa] { grid-template-columns: 1fr; }
    .form-grid[b-j5devxgcaa], .form-grid--3[b-j5devxgcaa] { grid-template-columns: 1fr; }
}
/* /Components/Pages/JobDescription/JobTemplates/JobTemplateDetailsPage.razor.rz.scp.css */
.template-header[b-mbwhbacjyc] {
    border-radius: 12px;
    background-image: linear-gradient(135deg, #4361ee, #3f37c9);
    color: white;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

.template-header h2[b-mbwhbacjyc] {
    color: white;
    font-weight: 600;
}

.section-card[b-mbwhbacjyc] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    border: none;
    margin-bottom: 2rem;
    overflow: hidden;
    transition: all 0.3s ease;
}

.section-card:hover[b-mbwhbacjyc] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.section-header[b-mbwhbacjyc] {
    display: flex;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.section-icon[b-mbwhbacjyc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    margin-right: 1rem;
}

.section-icon i[b-mbwhbacjyc] {
    color: #4361ee;
    font-size: 1.2rem;
}

.section-title[b-mbwhbacjyc] {
    font-weight: 600;
    margin: 0;
    color: #212529;
}

.section-content[b-mbwhbacjyc] {
    padding: 1.5rem;
}

.custom-input[b-mbwhbacjyc] {
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
    transition: all 0.3s ease;
}

.custom-input:focus[b-mbwhbacjyc] {
    border-color: #4361ee;
    box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.15);
}

.custom-textarea[b-mbwhbacjyc] {
    min-height: 120px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    padding: 0.75rem 6.5rem 0.75rem 1rem;
    transition: all 0.3s ease;
}

.custom-textarea:focus[b-mbwhbacjyc] {
    border-color: #4361ee;
    box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.15);
}

.btn-custom-primary[b-mbwhbacjyc] {
    background-color: #4361ee;
    border-color: #4361ee;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-primary:hover[b-mbwhbacjyc] {
    background-color: #3a56d4;
    border-color: #3a56d4;
    transform: translateY(-2px);
}

.btn-custom-secondary[b-mbwhbacjyc] {
    background-color: white;
    border: 1px solid #6c757d;
    color: #212529;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-secondary:hover[b-mbwhbacjyc] {
    background-color: #f8f9fa;
    border-color: #d4d7dc;
    transform: translateY(-2px);
}

.btn-custom-success[b-mbwhbacjyc] {
    background-color: #0cce6b;
    border-color: #0cce6b;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-success:hover[b-mbwhbacjyc] {
    background-color: #0ab55e;
    border-color: #0ab55e;
    transform: translateY(-2px);
}

.btn-custom-danger[b-mbwhbacjyc] {
    background-color: white;
    border: 1px solid #6c757d;
    color: #e5383b;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.btn-custom-danger:hover[b-mbwhbacjyc] {
    background-color: #fef2f2;
    color: #dc2626;
    transform: translateY(-2px);
}

.btn-custom-info[b-mbwhbacjyc] {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: white;
    border-radius: 8px;
    padding: 0.5rem 1.25rem;
    transition: all 0.3s ease;
}

.btn-custom-info:hover[b-mbwhbacjyc] {
    background-color: #0d6efd;
    border-color: #0d6efd;
    transform: translateY(-2px);
}

.item-row[b-mbwhbacjyc] {
    background-color: #f9fafb;
    border-radius: 8px;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    transition: all 0.3s ease;
}

.item-row:hover[b-mbwhbacjyc] {
    background-color: #f3f4f6;
}

.empty-state[b-mbwhbacjyc] {
    background-color: #f9fafb;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    color: #6b7280;
}

.empty-state i[b-mbwhbacjyc] {
    font-size: 2rem;
    margin-bottom: 1rem;
    color: #d1d5db;
}

.footer-actions[b-mbwhbacjyc] {
    background-color: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
}

/* Custom loading spinner */
.spinner-container[b-mbwhbacjyc] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spinner-container-block[b-mbwhbacjyc] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-spinner[b-mbwhbacjyc] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    border-top-color: #4361ee;
    animation: spinner-b-mbwhbacjyc 1s linear infinite;
}

@keyframes spinner-b-mbwhbacjyc {
    to {
        transform: rotate(360deg);
    }
}

.form-label[b-mbwhbacjyc] {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #4b5563;
}

.col-form-label[b-mbwhbacjyc] {
    font-weight: 500;
    color: #4b5563;
}

.fixed-sidebar-actions[b-mbwhbacjyc] {
    position: fixed;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1000;
}

.fixed-sidebar-actions .btn[b-mbwhbacjyc] {
    width: 6rem;
    text-align: center;
}

/* Loader */

.ai-loading-container[b-mbwhbacjyc] {
    border-radius: 16px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.ai-loading-card[b-mbwhbacjyc] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 16px;
    overflow: hidden;
    position: relative;
}

.ai-loading-header[b-mbwhbacjyc] {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    padding: 20px;
    color: white;
}

.ai-loading-icon[b-mbwhbacjyc] {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #ffeaa7 0%, #fab1a0 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #2d3436;
    animation: iconSpin-b-mbwhbacjyc 3s linear infinite;
    box-shadow: 0 4px 15px rgba(255, 234, 167, 0.4);
}

.loading-subtitle[b-mbwhbacjyc] {
    opacity: 0.9;
    font-size: 13px;
}

.ai-loading-content[b-mbwhbacjyc] {
    padding: 30px 20px;
    background: rgba(255, 255, 255, 0.05);
}

.loading-animation-wrapper[b-mbwhbacjyc] {
    text-align: center;
}

.typing-animation[b-mbwhbacjyc] {
    margin-bottom: 25px;
}

.typing-dots[b-mbwhbacjyc] {
    display: inline-flex;
    gap: 8px;
}

.typing-dots span[b-mbwhbacjyc] {
    width: 12px;
    height: 12px;
    background: #74b9ff;
    border-radius: 50%;
    animation: typingBounce-b-mbwhbacjyc 1.4s ease-in-out infinite;
    box-shadow: 0 2px 8px rgba(116, 185, 255, 0.4);
}

.typing-dots span:nth-child(2)[b-mbwhbacjyc] {
    animation-delay: 0.2s;
}

.typing-dots span:nth-child(3)[b-mbwhbacjyc] {
    animation-delay: 0.4s;
}

.shimmer-lines[b-mbwhbacjyc] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 300px;
    margin: 0 auto;
}

.shimmer-line[b-mbwhbacjyc] {
    height: 8px;
    background: linear-gradient(90deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0.3) 50%,
    rgba(255, 255, 255, 0.1) 100%);
    border-radius: 4px;
    animation: shimmer-b-mbwhbacjyc 2s ease-in-out infinite;
}

.shimmer-line-1[b-mbwhbacjyc] {
    width: 100%;
    animation-delay: 0s;
}

.shimmer-line-2[b-mbwhbacjyc] {
    width: 75%;
    animation-delay: 0.3s;
}

.shimmer-line-3[b-mbwhbacjyc] {
    width: 90%;
    animation-delay: 0.6s;
}

.ai-loading-footer[b-mbwhbacjyc] {
    padding: 20px;
    background: rgba(255, 255, 255, 0.1);
    color: white;
}

.progress-wrapper[b-mbwhbacjyc] {
    text-align: center;
}

.ai-progress-bar[b-mbwhbacjyc] {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 8px;
}

.progress-fill[b-mbwhbacjyc] {
    height: 100%;
    background: linear-gradient(90deg, #00cec9 0%, #55efc4 100%);
    border-radius: 3px;
    animation: progressFill-b-mbwhbacjyc 2.5s ease-in-out infinite;
    box-shadow: 0 0 10px rgba(0, 206, 201, 0.5);
}

/* Animations */
@keyframes cardPulse-b-mbwhbacjyc {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 8px 32px rgba(102, 126, 234, 0.3);
    }
    50% {
        transform: scale(1.02);
        box-shadow: 0 12px 40px rgba(102, 126, 234, 0.4);
    }
}

@keyframes iconSpin-b-mbwhbacjyc {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes typingBounce-b-mbwhbacjyc {
    0%, 60%, 100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-15px);
    }
}

@keyframes shimmer-b-mbwhbacjyc {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@keyframes progressFill-b-mbwhbacjyc {
    0% {
        width: 0%;
        transform: translateX(-100%);
    }
    50% {
        width: 70%;
        transform: translateX(0%);
    }
    100% {
        width: 100%;
        transform: translateX(0%);
    }
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .ai-loading-card[b-mbwhbacjyc] {
        border-radius: 12px;
    }

    .ai-loading-header[b-mbwhbacjyc] {
        padding: 16px;
    }

    .ai-loading-content[b-mbwhbacjyc] {
        padding: 20px 16px;
    }

    .ai-loading-icon[b-mbwhbacjyc] {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
}

/* jds page */
.template-card[b-mbwhbacjyc] {
    width: 22rem;
    height: 180px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}

.template-card:hover[b-mbwhbacjyc] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.card-title[b-mbwhbacjyc] {
    font-weight: 600;
    color: #212529;
}

.card-subtitle[b-mbwhbacjyc] {
    font-size: 0.9rem;
    color: #6c757d;
}

.card-text[b-mbwhbacjyc] {
    color: #6b7280;
    font-size: 1rem;
}

/* Style for aligning icons to the right side and keeping them in a column */
.template-card .d-flex.flex-column.align-items-end[b-mbwhbacjyc] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;  /* Aligns the icons to the right side */
}

.template-card .btn-link[b-mbwhbacjyc] {
    padding: 0;
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.template-card .btn-link i[b-mbwhbacjyc] {
    font-size: 1.5rem;
}

.template-info[b-mbwhbacjyc] {
    max-width: 75%;
}

.template-actions .btn-link[b-mbwhbacjyc] {
    font-size: 1.5rem;
}

.template-actions .btn-link:not(:last-child)[b-mbwhbacjyc] {
    margin-bottom: 0.5rem;
}

.template-options[b-mbwhbacjyc] {
    display: flex;
    gap: 16px;
}

.template-option[b-mbwhbacjyc] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    background-color: #f9fafb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    position: relative;
    overflow: hidden;
}

.template-option:hover[b-mbwhbacjyc] {
    background-color: #f3f4f6;
    transform: translateY(-2px);
}

.template-option.selected[b-mbwhbacjyc] {
    border-color: #6366f1;
    background-color: rgba(99, 102, 241, 0.05);
}

.template-option.selected[b-mbwhbacjyc]::after {
    content: '';
    position: absolute;
    top: 14px;
    right: 14px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #6366f1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white' stroke-width='3'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7' /%3E%3C/svg%3E");
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
}

.icon-container[b-mbwhbacjyc] {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    background-color: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

.icon-container i[b-mbwhbacjyc] {
    font-size: 1.5rem;
}

.btn-primary[b-mbwhbacjyc] {
    background-color: #6366f1;
    border-color: #6366f1;
}

.btn-primary:hover[b-mbwhbacjyc] {
    background-color: #4f46e5;
    border-color: #4f46e5;
}

.btn-primary:disabled[b-mbwhbacjyc] {
    background-color: #a5b4fc;
    border-color: #a5b4fc;
}

.custom-select[b-mbwhbacjyc] {
    height: 50px;
    background-color: #f8f9fa;
    border-radius: 8px;
    transition: all 0.2s ease;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0.625rem 40px 0.625rem 1rem;
}

.custom-select:focus[b-mbwhbacjyc] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15);
    background-color: #fff;
    outline: none;
}

.custom-select:hover[b-mbwhbacjyc] {
    background-color: #f1f3f5;
}

.dropdown-container[b-mbwhbacjyc] {
    margin-bottom: 0.5rem;
}

.select-icon[b-mbwhbacjyc] {
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.form-label[b-mbwhbacjyc] {
    margin-bottom: 0.5rem;
    color: #495057;
}

/* Add animation for dropdown */
.custom-select:focus + .select-icon i[b-mbwhbacjyc] {
    transform: translateY(-50%) rotate(180deg);
    transition: transform 0.3s ease;
}

/* Add style for upload*/
@keyframes fadeIn-b-mbwhbacjyc {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-mbwhbacjyc {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes pulse-b-mbwhbacjyc {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.upload-modal[b-mbwhbacjyc] {
    border-radius: 12px;
    background-color: white;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
    animation: fadeIn-b-mbwhbacjyc 0.3s ease-out;
    margin: 0 auto;
}

.btn-close[b-mbwhbacjyc] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6c757d;
    transition: color 0.2s;
    padding: 0.25rem;
    line-height: 1;
}

.btn-close:hover[b-mbwhbacjyc] {
    color: #343a40;
}

.form-label[b-mbwhbacjyc] {
    display: block;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.75rem;
}

.file-upload-container[b-mbwhbacjyc] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s;
    background-color: #f8f9fa;
    cursor: pointer;
}

.file-upload-container:hover[b-mbwhbacjyc] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
}

.file-upload-container.drag-active[b-mbwhbacjyc] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
    animation: pulse-b-mbwhbacjyc 1s infinite;
}

.upload-icon[b-mbwhbacjyc] {
    font-size: 2.5rem;
    color: #6c63ff;
    margin-bottom: 1rem;
}

.upload-text[b-mbwhbacjyc] {
    font-size: 1rem;
    color: #495057;
    margin-bottom: 0.5rem;
}

.upload-formats[b-mbwhbacjyc] {
    font-size: 0.85rem;
    color: #6c757d;
}

.file-input[b-mbwhbacjyc] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.loading-container[b-mbwhbacjyc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    animation: fadeIn-b-mbwhbacjyc 0.3s ease-out;
}

.spinner[b-mbwhbacjyc] {
    border: 4px solid rgba(108, 99, 255, 0.1);
    border-radius: 50%;
    border-top: 4px solid #6c63ff;
    width: 40px;
    height: 40px;
    animation: spin-b-mbwhbacjyc 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-mbwhbacjyc {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-mbwhbacjyc] {
    color: #495057;
    font-weight: 500;
}

.btn-fixed[b-mbwhbacjyc] {
    height: 43px;
    width: 150px;
}

/* Custom loading spinner */
.spinner-container[b-mbwhbacjyc] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spinner-container-block[b-mbwhbacjyc] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-spinner[b-mbwhbacjyc] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    border-top-color: #4361ee;
    animation: spinner-b-mbwhbacjyc 1s linear infinite;
}

@keyframes spinner-b-mbwhbacjyc {
    to {
        transform: rotate(360deg);
    }
}

.form-label[b-mbwhbacjyc] {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #4b5563;
}

.col-form-label[b-mbwhbacjyc] {
    font-weight: 500;
    color: #4b5563;
}

.fixed-sidebar-actions[b-mbwhbacjyc] {
    position: fixed;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1000;
}

.fixed-sidebar-actions .btn[b-mbwhbacjyc] {
    width: 6rem;
    text-align: center;
}


.skill-group[b-mbwhbacjyc] {
    margin-bottom: 28px;
    position: relative;
}

.skill-group:last-child[b-mbwhbacjyc] {
    margin-bottom: 16px;
}

.skill-icon[b-mbwhbacjyc] {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    color: white;
    font-weight: 600;
}

.help-text[b-mbwhbacjyc] {
    font-size: 0.85rem;
    color: #718096;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.help-text i[b-mbwhbacjyc] {
    color: #a0aec0;
}

.btn-fixed[b-mbwhbacjyc] {
    min-width: 100px;
    height: 44px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    border: none;
}

.mud-chart-bar[b-mbwhbacjyc] {
    stroke-width: 10px;
}
/* /Components/Pages/JobDescription/JobTemplates/JobTemplatesPage.razor.rz.scp.css */
.template-card[b-d0micbd0qy] {
    width: 22rem;
    height: 180px;
    background: white;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s ease;
}

.template-card:hover[b-d0micbd0qy] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
    transform: translateY(-3px);
}

.card-title[b-d0micbd0qy] {
    font-weight: 600;
    color: #212529;
}

.card-subtitle[b-d0micbd0qy] {
    font-size: 0.9rem;
    color: #6c757d;
}

.card-text[b-d0micbd0qy] {
    color: #6b7280;
    font-size: 1rem;
}

/* Style for aligning icons to the right side and keeping them in a column */
.template-card .d-flex.flex-column.align-items-end[b-d0micbd0qy] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;  /* Aligns the icons to the right side */
}

.template-card .btn-link[b-d0micbd0qy] {
    padding: 0;
    font-size: 1.5rem;
    margin-bottom: 1rem;
}

.template-card .btn-link i[b-d0micbd0qy] {
    font-size: 1.5rem;
}

.template-info[b-d0micbd0qy] {
    max-width: 75%;
}

.template-actions .btn-link[b-d0micbd0qy] {
    font-size: 1.5rem;
}

.template-actions .btn-link:not(:last-child)[b-d0micbd0qy] {
    margin-bottom: 0.5rem;
}

.template-options[b-d0micbd0qy] {
    display: flex;
    gap: 16px;
}

.template-option[b-d0micbd0qy] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    background-color: #f9fafb;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid transparent;
    position: relative;
    overflow: hidden;
}

.template-option:hover[b-d0micbd0qy] {
    background-color: #f3f4f6;
    transform: translateY(-2px);
}

.template-option.selected[b-d0micbd0qy] {
    border-color: #6366f1;
    background-color: rgba(99, 102, 241, 0.05);
}

.template-option.selected[b-d0micbd0qy]::after {
    content: '';
    position: absolute;
    top: 14px;
    right: 14px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #6366f1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white' stroke-width='3'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7' /%3E%3C/svg%3E");
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
}

.icon-container[b-d0micbd0qy] {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    background-color: rgba(99, 102, 241, 0.1);
    color: #6366f1;
}

.icon-container i[b-d0micbd0qy] {
    font-size: 1.5rem;
}

.btn-primary[b-d0micbd0qy] {
    background-color: #6366f1;
    border-color: #6366f1;
}

.btn-primary:hover[b-d0micbd0qy] {
    background-color: #4f46e5;
    border-color: #4f46e5;
}

.btn-primary:disabled[b-d0micbd0qy] {
    background-color: #a5b4fc;
    border-color: #a5b4fc;
}

.custom-select[b-d0micbd0qy] {
    height: 50px;
    background-color: #f8f9fa;
    border-radius: 8px;
    transition: all 0.2s ease;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0.625rem 40px 0.625rem 1rem;
}

.custom-select:focus[b-d0micbd0qy] {
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15);
    background-color: #fff;
    outline: none;
}

.custom-select:hover[b-d0micbd0qy] {
    background-color: #f1f3f5;
}

.dropdown-container[b-d0micbd0qy] {
    margin-bottom: 0.5rem;
}

.select-icon[b-d0micbd0qy] {
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #6c757d;
    pointer-events: none;
}

.form-label[b-d0micbd0qy] {
    margin-bottom: 0.5rem;
    color: #495057;
}

/* Add animation for dropdown */
.custom-select:focus + .select-icon i[b-d0micbd0qy] {
    transform: translateY(-50%) rotate(180deg);
    transition: transform 0.3s ease;
}

/* Add style for upload*/
@keyframes fadeIn-b-d0micbd0qy {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp-b-d0micbd0qy {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes pulse-b-d0micbd0qy {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.upload-modal[b-d0micbd0qy] {
    border-radius: 12px;
    background-color: white;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
    animation: fadeIn-b-d0micbd0qy 0.3s ease-out;
    margin: 0 auto;
}

.btn-close[b-d0micbd0qy] {
    background: none;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: #6c757d;
    transition: color 0.2s;
    padding: 0.25rem;
    line-height: 1;
}

.btn-close:hover[b-d0micbd0qy] {
    color: #343a40;
}

.form-label[b-d0micbd0qy] {
    display: block;
    font-weight: 500;
    color: #495057;
    margin-bottom: 0.75rem;
}

.file-upload-container[b-d0micbd0qy] {
    position: relative;
    border: 2px dashed #dee2e6;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s;
    background-color: #f8f9fa;
    cursor: pointer;
}

.file-upload-container:hover[b-d0micbd0qy] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
}

.file-upload-container.drag-active[b-d0micbd0qy] {
    border-color: #6c63ff;
    background-color: #f0f0ff;
    animation: pulse-b-d0micbd0qy 1s infinite;
}

.upload-icon[b-d0micbd0qy] {
    font-size: 2.5rem;
    color: #6c63ff;
    margin-bottom: 1rem;
}

.upload-text[b-d0micbd0qy] {
    font-size: 1rem;
    color: #495057;
    margin-bottom: 0.5rem;
}

.upload-formats[b-d0micbd0qy] {
    font-size: 0.85rem;
    color: #6c757d;
}

.file-input[b-d0micbd0qy] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.loading-container[b-d0micbd0qy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    animation: fadeIn-b-d0micbd0qy 0.3s ease-out;
}

.spinner[b-d0micbd0qy] {
    border: 4px solid rgba(108, 99, 255, 0.1);
    border-radius: 50%;
    border-top: 4px solid #6c63ff;
    width: 40px;
    height: 40px;
    animation: spin-b-d0micbd0qy 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-d0micbd0qy {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-text[b-d0micbd0qy] {
    color: #495057;
    font-weight: 500;
}

.btn-fixed[b-d0micbd0qy] {
    height: 43px;
    width: 150px;
}

/* Custom loading spinner */
.spinner-container[b-d0micbd0qy] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.spinner-container-block[b-d0micbd0qy] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-spinner[b-d0micbd0qy] {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(67, 97, 238, 0.1);
    border-radius: 50%;
    border-top-color: #4361ee;
    animation: spinner-b-d0micbd0qy 1s linear infinite;
}

@keyframes spinner-b-d0micbd0qy {
    to {
        transform: rotate(360deg);
    }
}

.form-label[b-d0micbd0qy] {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: #4b5563;
}

.col-form-label[b-d0micbd0qy] {
    font-weight: 500;
    color: #4b5563;
}

.fixed-sidebar-actions[b-d0micbd0qy] {
    position: fixed;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    z-index: 1000;
}

.fixed-sidebar-actions .btn[b-d0micbd0qy] {
    width: 6rem;
    text-align: center;
}

/* Drag and drop file upload styles */
.mud-border-primary[b-d0micbd0qy] {
    border-color: #6366f1 !important;
    background-color: rgba(99, 102, 241, 0.05) !important;
}

.mud-file-upload[b-d0micbd0qy] {
    position: relative;
    width: 100%;
}

.mud-file-upload input[type="file"][b-d0micbd0qy] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 10;
}

.mud-paper[b-d0micbd0qy] {
    transition: all 0.3s ease;
}

.mud-paper:hover[b-d0micbd0qy] {
    border-color: #6366f1;
    background-color: rgba(99, 102, 241, 0.02);
}

.mud-chip[b-d0micbd0qy] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Pages/Recruiting/RecruitingPage.razor.rz.scp.css */
.recruiting-table[b-hmcm9bt289] {
    font-size: 0.875rem;
    table-layout: fixed;
    width: 100%;
}

.recruiting-table th[b-hmcm9bt289],
.recruiting-table td[b-hmcm9bt289] {
    padding: 0.375rem 0.25rem !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.recruiting-table .col-seniority[b-hmcm9bt289],
.recruiting-table .col-client[b-hmcm9bt289],
.recruiting-table .col-time-close[b-hmcm9bt289],
.recruiting-table .col-opened[b-hmcm9bt289],
.recruiting-table .col-closed[b-hmcm9bt289],
.recruiting-table .col-candidate[b-hmcm9bt289],
.recruiting-table .col-recruiter[b-hmcm9bt289],
.recruiting-table .col-requested[b-hmcm9bt289],
.recruiting-table .col-job-name[b-hmcm9bt289],
.recruiting-table .col-start[b-hmcm9bt289],
.recruiting-table .col-new[b-hmcm9bt289],
.recruiting-table .col-locations[b-hmcm9bt289] {
    white-space: normal !important;
    word-wrap: break-word;
    line-height: 1.2;
    padding: 0.25rem 0.15rem !important;
}

.recruiting-table th[b-hmcm9bt289] {
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
}

.recruiting-table .col-job-name[b-hmcm9bt289] { width: 12%; }
.recruiting-table .col-seniority[b-hmcm9bt289] { width: 6%; }
.recruiting-table .col-client[b-hmcm9bt289] { width: 8%; }
.recruiting-table .col-rao[b-hmcm9bt289] { width: 5%; }
.recruiting-table .col-locations[b-hmcm9bt289] { width: 8%; }
.recruiting-table .col-client-interview[b-hmcm9bt289] { width: 5%; }
.recruiting-table .col-billing[b-hmcm9bt289] { width: 110px !important; }
.recruiting-table .col-requested[b-hmcm9bt289] { width: 7%; }
.recruiting-table .col-status[b-hmcm9bt289] { width: 100px !important; }
.recruiting-table .col-recruiter[b-hmcm9bt289] { width: 120px !important; }
.recruiting-table .col-priority[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-candidates[b-hmcm9bt289] { width: 4%; }
.recruiting-table .col-hr[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-cp[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-ti[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-cpp[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-ci[b-hmcm9bt289] { width: 3%; }
.recruiting-table .col-opened[b-hmcm9bt289] { width: 5%; }
.recruiting-table .col-closed[b-hmcm9bt289] { width: 5%; }
.recruiting-table .col-time-close[b-hmcm9bt289] { width: 7%; }
.recruiting-table .col-offers[b-hmcm9bt289] { width: 4%; }
.recruiting-table .col-start[b-hmcm9bt289] { width: 6%; }
.recruiting-table .col-new[b-hmcm9bt289] { width: 6%; }
.recruiting-table .col-source[b-hmcm9bt289] { width: 6%; }
.recruiting-table .col-candidate[b-hmcm9bt289] { width: 8%; }


.btn-link.candidate-link[b-hmcm9bt289] {
    padding: 0 !important;
    font-size: inherit;
    text-decoration: none;
    max-width: 100%;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stage-badge[b-hmcm9bt289] {
    display: inline-block;
    min-width: 20px;
    padding: 1px 4px;
    border-radius: 3px;
    background: #f8f9fa;
    font-size: 0.75rem;
    text-align: center;
}

@media (max-width: 1400px) {
    .recruiting-table[b-hmcm9bt289] {
        font-size: 0.8rem;
    }
    .recruiting-table th[b-hmcm9bt289],
    .recruiting-table td[b-hmcm9bt289] {
        padding: 0.25rem 0.15rem !important;
    }
}

@media (max-width: 1200px) {
    .recruiting-table[b-hmcm9bt289] {
        font-size: 0.75rem;
    }
}

.header-grid[b-hmcm9bt289]{
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}
.header-grid .card-title[b-hmcm9bt289]{ justify-self: start; white-space: nowrap; }
.header-grid .period-controls[b-hmcm9bt289]{ justify-self: center; }
.header-grid > div:last-child[b-hmcm9bt289]{ justify-self: end; }
/* /Components/Pages/Settings/Competence.razor.rz.scp.css */
.competences-page[b-vt6nzz2iwc] {
    --brand-sky:#4AC4FF;
}

.btn-sky[b-vt6nzz2iwc] {
    background-color:#4AC4FF;
    border-color:#4AC4FF;
    color:#fff!important;
    font-weight:500;
}

.btn-sky i[b-vt6nzz2iwc] {
    color:#fff!important;
}

.btn-sky:hover[b-vt6nzz2iwc],.btn-sky:focus[b-vt6nzz2iwc] {
    background-color:#36b5f2;
    border-color:#36b5f2;
    color:#fff!important;
}

.competences-page .list-group-item.active[b-vt6nzz2iwc] {
    background-color:var(--brand-sky);
    border-color:var(--brand-sky);
    color:#fff;
}

.competences-page .list-group-item.active h6[b-vt6nzz2iwc] {
    color:#fff;
}

.competences-page .list-group-item.active .btn-link[b-vt6nzz2iwc] {
    color:#fff!important;
}

.competences-shell[b-vt6nzz2iwc] {
    min-height:calc(100svh - 100px);
    display:flex;
    gap:16px;
    align-items:flex-start;
}

.competences-panel[b-vt6nzz2iwc] {
    flex:1 1 50%;
    min-width:0;
    display:flex;
    flex-direction:column;
}

.subcompetences-panel[b-vt6nzz2iwc] {
    flex:1 1 50%;
    min-width:0;
    display:flex;
    flex-direction:column;
    position:sticky;
    top:16px;
    align-self:flex-start;
    height:calc(100vh - 32px);
}

.competences-panel .card-body[b-vt6nzz2iwc] {
    display:flex;
    flex-direction:column;
}

.subcompetences-panel .card-body[b-vt6nzz2iwc] {
    display:flex;
    flex-direction:column;
    overflow-y:auto;
}

.subcompetences-panel .card-body[b-vt6nzz2iwc]::-webkit-scrollbar {
    width:8px;
}

.subcompetences-panel .card-body[b-vt6nzz2iwc]::-webkit-scrollbar-track {
    background:#f8f9fa;
    border-radius:4px;
}

.subcompetences-panel .card-body[b-vt6nzz2iwc]::-webkit-scrollbar-thumb {
    background:#cbd5e1;
    border-radius:4px;
}

.subcompetences-panel .card-body[b-vt6nzz2iwc]::-webkit-scrollbar-thumb:hover {
    background:#94a3b8;
}

.g-list[b-vt6nzz2iwc] {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.g-item[b-vt6nzz2iwc] {
    border: 1px solid #eef2f6;
    border-radius: 8px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
}

.g-item:hover[b-vt6nzz2iwc] {
    border-color:#dbe2ea;
    box-shadow:0 2px 10px rgba(15,23,42,.06);
}

.g-item-row[b-vt6nzz2iwc] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.g-title[b-vt6nzz2iwc] {
    font-weight:500;
    flex: 1;
    min-width: 0;
}

.g-badges[b-vt6nzz2iwc] {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.g-actions[b-vt6nzz2iwc] {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

.g-actions .btn[b-vt6nzz2iwc] {
    line-height:1;
}

.g-sub[b-vt6nzz2iwc] {
    margin-top: 8px;
    padding-left: 12px;
    color: #98A2B3;
    font-size: .875rem;
    border-left: 2px solid #e9ecef;
}

.g-item.is-active .g-sub[b-vt6nzz2iwc] {
    color: rgba(255,255,255,.85);
    border-left-color: rgba(255,255,255,.3);
}

.g-item.is-active[b-vt6nzz2iwc] {
    background:var(--brand-sky);
    border-color:var(--brand-sky);
    color:#fff;
}

.g-item.is-active .g-title[b-vt6nzz2iwc] {
    color:#fff;
}

.g-item.is-active .btn-link[b-vt6nzz2iwc] {
    color:#fff !important;
}

.sg-list[b-vt6nzz2iwc] {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.sg-item[b-vt6nzz2iwc] {
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 14px;
    border:1px solid #e9ecef;
    border-radius:.5rem;
    background:#fff;
}

.sg-item:hover[b-vt6nzz2iwc] {
    border-color:#dbe2ea;
    box-shadow:0 2px 10px rgba(15,23,42,.06);
}

.sg-title[b-vt6nzz2iwc] {
    font-weight:500;
}

.sg-actions .btn[b-vt6nzz2iwc] {
    line-height:1;
}

.card-header[b-vt6nzz2iwc] {
    position:sticky;
    top:0;
    z-index:1;
    background:#fff;
}

@media (max-width: 990px){
    .competences-shell[b-vt6nzz2iwc]{
        flex-direction:column;
        align-items:stretch;
    }
    .competences-panel[b-vt6nzz2iwc]{
        flex-basis:auto;
    }
    .subcompetences-panel[b-vt6nzz2iwc] {
        position:relative;
        top:auto;
        max-height:none;
    }
}
/* /Components/Pages/Settings/Integrations.razor.rz.scp.css */
/* ==========================================================================
   Settings › Integrations — Talents visual language (shared with the dashboard).
   ========================================================================== */
.integrations[b-r3f4kv048y] {
    --ink: #0D2D3F;
    --neutral-bg: #F8FBFD;
    --neutral-border: #EDF2F5;
    --neutral-muted: #7A9BAD;
    --neutral-placeholder: #9BB8C5;
    --neutral-label: #4A6878;
    --neutral-card-border: #E2EBF0;
    --neutral-pill-bg: #F2F5F7;
    --brand-400: #4AC4FF;
    --radius-md: 8px;
    --radius-lg2: 12px;
    --radius-full: 9999px;

    max-width: 920px;
    margin: 0 auto;
    padding: 28px 24px 64px;
    color: var(--ink);
    background: var(--neutral-bg);
    min-height: 100vh;
}

/* ---------- Page header ---------- */
.page-head[b-r3f4kv048y] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    flex-wrap: wrap;
}

.page-title[b-r3f4kv048y] {
    font-weight: 800;
    font-size: 28px;
    letter-spacing: -.01em;
    line-height: 1.15;
    margin: 0;
}

.page-title span[b-r3f4kv048y] {
    color: var(--brand-400);
}

.page-sub[b-r3f4kv048y] {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--neutral-muted);
}

/* ---------- Cards ---------- */
.int-grid[b-r3f4kv048y] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 28px;
}

.card[b-r3f4kv048y] {
    background: #fff;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    padding: 18px 20px;
}

.card-head[b-r3f4kv048y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.card-title[b-r3f4kv048y] {
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.3;
}

.pill[b-r3f4kv048y] {
    font-size: 11px;
    font-weight: 600;
    color: var(--neutral-label);
    background: var(--neutral-pill-bg);
    padding: 3px 10px;
    border-radius: var(--radius-full);
    white-space: nowrap;
    flex-shrink: 0;
}

.card-row[b-r3f4kv048y] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 16px;
}

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

.field-label[b-r3f4kv048y] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--neutral-placeholder);
}

.card-actions[b-r3f4kv048y] {
    margin-left: auto;
}

.card-notes[b-r3f4kv048y] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 16px;
}

.card-note[b-r3f4kv048y] {
    margin: 0;
    font-size: 12px;
    color: var(--neutral-muted);
}

.card-desc[b-r3f4kv048y] {
    flex: 1;
    min-width: 220px;
    align-self: center;
    margin: 0;
    font-size: 13px;
    color: var(--neutral-muted);
    line-height: 1.5;
}
/* /Components/Pages/Settings/JobSettings.razor.rz.scp.css */
.js-page[b-tqpbd0as3m] {
    max-width: 720px;
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
    background: var(--neutral-bg);
    min-height: 100vh;
}

.js-heading[b-tqpbd0as3m] {
    font-size: var(--fs-title);
    font-weight: var(--fw-bold);
    color: var(--ink);
    margin: 0 0 var(--space-6);
}

.js-card[b-tqpbd0as3m] {
    background: #fff;
    border: 1px solid var(--neutral-card-border);
    border-radius: var(--radius-lg2);
    box-shadow: var(--shadow-sm);
    padding: var(--space-6);
}

.js-card-title[b-tqpbd0as3m] {
    font-size: var(--fs-card);
    font-weight: var(--fw-semibold);
    color: var(--ink);
    margin: 0 0 var(--space-2);
}

.js-card-desc[b-tqpbd0as3m] {
    font-size: var(--fs-body);
    color: var(--neutral-muted);
    line-height: 1.5;
    margin: 0;
}

.js-row[b-tqpbd0as3m] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-4) 0;
    margin-top: var(--space-4);
    border-top: 1px solid var(--neutral-border);
}

.js-row-label[b-tqpbd0as3m] {
    font-size: var(--fs-label);
    font-weight: var(--fw-medium);
    color: var(--ink);
}

/* Toggle switch */
.js-switch[b-tqpbd0as3m] {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    flex: 0 0 auto;
}

.js-switch input[b-tqpbd0as3m] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.js-switch-track[b-tqpbd0as3m] {
    width: 40px;
    height: 22px;
    background: var(--neutral-border-strong);
    border-radius: var(--radius-full);
    display: inline-block;
    position: relative;
    transition: background 0.2s ease;
}

.js-switch-thumb[b-tqpbd0as3m] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
    box-shadow: var(--shadow-sm);
    transition: transform 0.2s ease;
}

.js-switch input:checked + .js-switch-track[b-tqpbd0as3m] {
    background: var(--brand-600);
}

.js-switch input:checked + .js-switch-track .js-switch-thumb[b-tqpbd0as3m] {
    transform: translateX(18px);
}

.js-switch input:focus-visible + .js-switch-track[b-tqpbd0as3m] {
    box-shadow: var(--focus-brand);
}

.js-card-footer[b-tqpbd0as3m] {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--space-5);
}

.js-btn[b-tqpbd0as3m] {
    border: none;
    border-radius: var(--radius-md);
    padding: var(--space-2) var(--space-5);
    font-size: var(--fs-label);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease;
}

.js-btn--primary[b-tqpbd0as3m] {
    background: var(--brand-600);
    color: #fff;
}

.js-btn--primary:hover[b-tqpbd0as3m] {
    background: var(--brand-700);
}
/* /Components/Pages/SkillsMatrix/SkillsMatrixBuilder.razor.rz.scp.css */
.mb-page[b-jfijovvh6p] { min-height: 100vh; display: flex; justify-content: center; padding: 30px 32px 56px; }
.mb-shell[b-jfijovvh6p] { width: 100%; display: flex; flex-direction: column; gap: 20px; }

.mb-header[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 12px; }
.mb-breadcrumb[b-jfijovvh6p] { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.mb-breadcrumb-link[b-jfijovvh6p] { color: #64748b; text-decoration: none; }
.mb-breadcrumb-link:hover[b-jfijovvh6p] { color: #2e75b6; }
.mb-breadcrumb-sep[b-jfijovvh6p] { color: #94a3b8; font-size: 10px; }
.mb-breadcrumb-current[b-jfijovvh6p] { color: #0f172a; }
.mb-title[b-jfijovvh6p] { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 700; letter-spacing: -0.03em; color: #0f172a; }
.mb-subtitle[b-jfijovvh6p] { margin: 0; font-size: 15px; color: #64748b; }

.mb-top-card[b-jfijovvh6p] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 1px 3px rgba(15,23,42,.05); padding: 24px; display: flex; flex-direction: column; gap: 18px; }
.mb-top-row[b-jfijovvh6p] { display: flex; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.mb-top-field[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 8px; }
.mb-field-label[b-jfijovvh6p] { font-size: 14px; font-weight: 500; color: #64748b; }
.mb-competence-name[b-jfijovvh6p] { margin: 0; font-size: 24px; line-height: 1.2; font-weight: 700; color: #0f172a; }

.mb-main-grid[b-jfijovvh6p] { display: grid; grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr); gap: 28px; align-items: start; }
.mb-left-column[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 20px; }
.mb-right-column[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 24px; }

.mb-category-card[b-jfijovvh6p] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 1px 3px rgba(15,23,42,.05); overflow: hidden; border-left-width: 4px; border-left-style: solid; }
.mb-category-header[b-jfijovvh6p] { padding: 16px 20px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid #e2e8f0; }
.mb-category-title[b-jfijovvh6p] { margin: 0; font-size: 16px; font-weight: 600; color: #0f172a; }
.mb-category-note[b-jfijovvh6p] { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 4px; background: #e6f0fb; color: #2e75b6; font-size: 12px; font-weight: 500; }

.mb-group-list[b-jfijovvh6p] { display: flex; flex-direction: column; padding: 14px; gap: 10px; }
.mb-group-card[b-jfijovvh6p] { border: 1px solid #e2e8f0; border-radius: 6px; overflow: hidden; background: #fff; }
.mb-group-header[b-jfijovvh6p] { min-height: 52px; padding: 12px 14px; background: #f1f5f9; display: flex; align-items: center; gap: 12px; cursor: pointer; }
.mb-group-header:hover[b-jfijovvh6p] { background: #e8edf2; }
.mb-group-title-wrap[b-jfijovvh6p] { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.mb-group-title[b-jfijovvh6p] { font-size: 15px; font-weight: 600; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mb-count-badge[b-jfijovvh6p] { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: 999px; background: #e2e8f0; color: #64748b; font-size: 12px; font-weight: 500; white-space: nowrap; }
.mb-designation-label[b-jfijovvh6p] { font-size: 12px; color: #64748b; font-weight: 500; white-space: nowrap; }
.mb-chevron-box[b-jfijovvh6p] { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; color: #94a3b8; font-size: 14px; flex-shrink: 0; }

.mb-skill-list[b-jfijovvh6p] { display: flex; flex-direction: column; }
.mb-skill-row[b-jfijovvh6p] { min-height: 44px; padding: 0 14px; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 12px; border-top: 1px solid #e2e8f0; }
.mb-checkbox-box[b-jfijovvh6p] { width: 16px; height: 16px; border-radius: 4px; border: 1px solid #93c5fd; background: #2e75b6; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; margin-left: 2px; }
.mb-checkbox-box.mb-unchecked[b-jfijovvh6p] { background: #fff; border-color: #e2e8f0; color: transparent; }
.mb-skill-name[b-jfijovvh6p] { font-size: 14px; font-weight: 500; color: #0f172a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-skill-actions[b-jfijovvh6p] { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.mb-removed-row[b-jfijovvh6p] { opacity: .55; background: #fcfcfd; }
.mb-restore-link[b-jfijovvh6p] { color: #64748b; font-size: 13px; font-weight: 500; background: none; border: none; cursor: pointer; padding: 4px 8px; }
.mb-restore-link:hover[b-jfijovvh6p] { color: #2e75b6; }

.mb-add-skill-group[b-jfijovvh6p] { width: 100%; min-height: 46px; border-radius: 12px; border: 1px dashed #e2e8f0; background: transparent; color: #2e75b6; display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 500; cursor: pointer; }
.mb-add-skill-group:hover[b-jfijovvh6p] { background: #f8fafc; border-color: #2e75b6; }

.mb-add-skill-inline[b-jfijovvh6p] { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; background: transparent; border: none; border-top: 1px dashed #e2e8f0; color: #2e75b6; font-size: 13px; font-weight: 500; cursor: pointer; }
.mb-add-skill-inline:hover[b-jfijovvh6p] { background: #f8fafc; }

.mb-footer-actions[b-jfijovvh6p] { display: flex; align-items: center; gap: 12px; padding-top: 8px; }
.mb-btn-primary[b-jfijovvh6p] { height: 40px; padding: 0 16px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 14px; font-weight: 500; border: none; background: #2e75b6; color: #fff; cursor: pointer; }
.mb-btn-primary:hover[b-jfijovvh6p] { background: #25639c; }
.mb-btn-primary:disabled[b-jfijovvh6p] { opacity: .6; cursor: not-allowed; }
.mb-btn-text[b-jfijovvh6p] { background: transparent; border: none; color: #64748b; padding: 0 8px; font-size: 14px; font-weight: 500; cursor: pointer; height: 40px; }
.mb-btn-text:hover[b-jfijovvh6p] { color: #0f172a; }

.mb-summary-card[b-jfijovvh6p] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 1px 3px rgba(15,23,42,.05); padding: 22px; display: flex; flex-direction: column; gap: 20px; }
.mb-summary-title[b-jfijovvh6p] { margin: 0; font-size: 18px; font-weight: 700; color: #0f172a; }
.mb-summary-stats[b-jfijovvh6p] { display: flex; gap: 28px; }
.mb-stat-block[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 4px; }
.mb-stat-value[b-jfijovvh6p] { font-size: 34px; line-height: 1; font-weight: 700; color: #0f172a; }
.mb-stat-label[b-jfijovvh6p] { font-size: 13px; color: #64748b; font-weight: 500; }
.mb-summary-section[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 10px; }
.mb-summary-section-label[b-jfijovvh6p] { font-size: 13px; font-weight: 600; color: #64748b; }
.mb-chip-row[b-jfijovvh6p] { display: flex; flex-wrap: wrap; gap: 8px; }
.mb-summary-chip[b-jfijovvh6p] { height: 28px; padding: 0 10px; border-radius: 4px; background: #f1f5f9; color: #0f172a; display: inline-flex; align-items: center; font-size: 13px; font-weight: 500; }
.mb-info-card[b-jfijovvh6p] { padding: 16px; display: flex; align-items: flex-start; gap: 12px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 12px; color: #1e3a8a; }
.mb-info-text[b-jfijovvh6p] { font-size: 13px; line-height: 1.55; }

.mb-loading[b-jfijovvh6p] { display: flex; align-items: center; justify-content: center; min-height: 40vh; }
.mb-empty[b-jfijovvh6p] { min-height: 200px; border: 1px dashed #e2e8f0; border-radius: 12px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; padding: 40px; }
.mb-empty h3[b-jfijovvh6p] { font-size: 18px; font-weight: 700; color: #0f172a; margin: 0; }
.mb-empty p[b-jfijovvh6p] { font-size: 14px; color: #64748b; margin: 0; }

/* Add Skill Group Dialog (inline) */
.asg-backdrop[b-jfijovvh6p] { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15,23,42,.7); display: flex; align-items: center; justify-content: center; z-index: 1050; padding: 40px 16px; }
.asg-modal[b-jfijovvh6p] { width: 560px; background: #fff; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.12); display: flex; flex-direction: column; max-height: 90vh; }
.asg-header[b-jfijovvh6p] { padding: 24px; display: flex; align-items: flex-start; justify-content: space-between; }
.asg-header-text[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 4px; }
.asg-title[b-jfijovvh6p] { margin: 0; font-size: 18px; font-weight: 600; color: #1e293b; }
.asg-subtitle[b-jfijovvh6p] { margin: 0; font-size: 14px; color: #64748b; }
.asg-close[b-jfijovvh6p] { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; background: transparent; border: none; border-radius: 4px; color: #64748b; cursor: pointer; font-size: 16px; }
.asg-close:hover[b-jfijovvh6p] { background: #f1f5f9; }
.asg-body[b-jfijovvh6p] { padding: 0 24px 24px; display: flex; flex-direction: column; gap: 24px; overflow-y: auto; flex: 1; }
.asg-form-group[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 8px; }
.asg-form-label[b-jfijovvh6p] { font-size: 13px; font-weight: 500; color: #1e293b; }
.asg-checkbox-list[b-jfijovvh6p] { display: flex; flex-direction: column; gap: 8px; max-height: 280px; overflow-y: auto; }
.asg-checkbox-row[b-jfijovvh6p] { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; cursor: pointer; transition: border-color .1s, background .1s; }
.asg-checkbox-row:hover:not(.asg-disabled)[b-jfijovvh6p] { border-color: #cbd5e1; }
.asg-checkbox-row.asg-selected[b-jfijovvh6p] { border-color: #2e75b6; background: #eff6ff; }
.asg-checkbox-row.asg-disabled[b-jfijovvh6p] { opacity: .6; background: #f8fafc; cursor: not-allowed; }
.asg-checkbox-left[b-jfijovvh6p] { display: flex; align-items: center; gap: 12px; }
.asg-checkbox[b-jfijovvh6p] { width: 16px; height: 16px; border: 1px solid #94a3b8; border-radius: 4px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #fff; background: #fff; }
.asg-checkbox i[b-jfijovvh6p] { font-size: 10px; }
.asg-checkbox-checked[b-jfijovvh6p] { border-color: #2e75b6; background: #2e75b6; }
.asg-checkbox-disabled[b-jfijovvh6p] { border-color: #e2e8f0; background: #f1f5f9; }
.asg-checkbox-name[b-jfijovvh6p] { font-size: 14px; font-weight: 600; color: #1e293b; }
.asg-checkbox-name-disabled[b-jfijovvh6p] { text-decoration: line-through; color: #64748b; }
.asg-checkbox-meta[b-jfijovvh6p] { font-size: 13px; color: #64748b; }
.asg-designation-grid[b-jfijovvh6p] { display: flex; gap: 12px; }
.asg-designation-card[b-jfijovvh6p] { flex: 1; display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; cursor: pointer; transition: border-color .1s, background .1s; }
.asg-designation-card:hover[b-jfijovvh6p] { border-color: #cbd5e1; }
.asg-designation-card.asg-designation-selected[b-jfijovvh6p] { border-color: #2e75b6; background: #eff6ff; }
.asg-designation-title[b-jfijovvh6p] { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #1e293b; }
.asg-designation-selected .asg-designation-title[b-jfijovvh6p] { color: #2e75b6; }
.asg-designation-desc[b-jfijovvh6p] { font-size: 12px; color: #64748b; line-height: 1.4; }
.asg-footer[b-jfijovvh6p] { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; border-top: 1px solid #e2e8f0; background: #fafafa; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }
.asg-btn-outline[b-jfijovvh6p] { height: 40px; padding: 0 16px; border-radius: 6px; font-size: 14px; font-weight: 500; border: 1px solid #e2e8f0; background: transparent; color: #1e293b; cursor: pointer; }
.asg-btn-outline:hover[b-jfijovvh6p] { background: #f1f5f9; }
.asg-btn-primary[b-jfijovvh6p] { height: 40px; padding: 0 16px; border-radius: 6px; font-size: 14px; font-weight: 500; border: none; background: #2e75b6; color: #fff; cursor: pointer; }
.asg-btn-primary:hover[b-jfijovvh6p] { background: #25639c; }
.asg-btn-primary:disabled[b-jfijovvh6p] { opacity: .5; cursor: not-allowed; }

.mb-skill-name-wrap[b-jfijovvh6p] { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mb-skill-hint[b-jfijovvh6p] { font-size: 12px; color: #b45309; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-disabled-row[b-jfijovvh6p] { background: #fffbeb; }
.mb-checkbox-disabled[b-jfijovvh6p] { cursor: not-allowed; background: #f8fafc; border-color: #e2e8f0; }
.mb-disabled-pill[b-jfijovvh6p] { display: inline-flex; align-items: center; padding: 3px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; color: #92400e; background: #fef3c7; }
/* /Components/Pages/SkillsMatrix/SkillsMatrixCategoriesPage.razor.rz.scp.css */
.page-wrapper[b-e3dijdnr1f] {
    width: 100%;
    padding: 28px 32px 56px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.page-header[b-e3dijdnr1f] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 12px;
}

.header-left[b-e3dijdnr1f] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.breadcrumb-nav[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
}

.breadcrumb-link[b-e3dijdnr1f] {
    color: #64748b;
    text-decoration: none;
}

.breadcrumb-link:hover[b-e3dijdnr1f] {
    color: #2e75b6;
}

.breadcrumb-separator[b-e3dijdnr1f] {
    color: #94a3b8;
    font-size: 10px;
}

.breadcrumb-current[b-e3dijdnr1f] {
    color: #0f172a;
    font-weight: 600;
}

.page-title[b-e3dijdnr1f] {
    margin: 0;
    font-size: 32px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #0f172a;
}

.page-subtitle[b-e3dijdnr1f] {
    margin: 0;
    font-size: 15px;
    color: #64748b;
}

.header-actions[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.btn-primary[b-e3dijdnr1f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    background: #2e75b6;
    color: #fff;
    border: 1px solid #2e75b6;
    cursor: pointer;
    gap: 8px;
}

.btn-primary:hover[b-e3dijdnr1f] {
    background: #25639c;
}

.btn-outlined[b-e3dijdnr1f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    background: transparent;
    color: #0f172a;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    gap: 8px;
}

.btn-outlined:hover[b-e3dijdnr1f] {
    background: #f1f5f9;
}

.btn-icon[b-e3dijdnr1f] {
    font-size: 13px;
}

/* Filters */
.search-filters-row[b-e3dijdnr1f] {
    display: flex;
    align-items: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.filter-search[b-e3dijdnr1f] {
    flex: 1 1 260px;
    min-width: 220px;
}

.filter-item[b-e3dijdnr1f] {
    flex: 0 0 auto;
    width: 240px;
}

.applicability-filter[b-e3dijdnr1f] {
    width: 100%;
}

.filter-actions[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
}

[b-e3dijdnr1f] .filter-search .mud-input-control,
[b-e3dijdnr1f] .filter-item .mud-input-control,
[b-e3dijdnr1f] .filter-item .mud-select {
    width: 100% !important;
}

@media (max-width: 992px) {
    .filter-item[b-e3dijdnr1f] {
        width: 100%;
    }
}

/* Category List */
.category-list[b-e3dijdnr1f] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.category-card[b-e3dijdnr1f] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    padding-left: 28px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.category-card:hover[b-e3dijdnr1f] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border-color: #cbd5e1;
}

.category-accent[b-e3dijdnr1f] {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
}

.category-content[b-e3dijdnr1f] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
    padding-right: 24px;
}

.category-name-row[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.category-name[b-e3dijdnr1f] {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}

.category-desc[b-e3dijdnr1f] {
    font-size: 14px;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.category-stats[b-e3dijdnr1f] {
    font-size: 13px;
    color: #64748b;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.stats-dot[b-e3dijdnr1f] {
    color: #94a3b8;
}

.category-arrow[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    flex-shrink: 0;
    font-size: 18px;
}

/* Applicability Badges */
.applicability-badge[b-e3dijdnr1f] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}

.badge-universal[b-e3dijdnr1f] {
    background: #dbeafe;
    color: #1e40af;
}

.badge-engineering[b-e3dijdnr1f] {
    background: #dcfce7;
    color: #166534;
}

.badge-manual[b-e3dijdnr1f] {
    background: #f1f5f9;
    color: #475569;
}

/* Loading */
.loading-state[b-e3dijdnr1f] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40vh;
}

/* Empty State */
.empty-state[b-e3dijdnr1f] {
    min-height: 320px;
    border: 1px dashed #e2e8f0;
    border-radius: 12px;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding: 40px;
    color: #64748b;
}

.empty-icon-wrapper[b-e3dijdnr1f] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.empty-icon[b-e3dijdnr1f] {
    font-size: 20px;
    color: #64748b;
}

.empty-title[b-e3dijdnr1f] {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.empty-copy[b-e3dijdnr1f] {
    font-size: 15px;
    max-width: 380px;
    margin: 0;
    color: #64748b;
}
/* /Components/Pages/SkillsMatrix/SkillsMatrixCategoryDetailPage.razor.rz.scp.css */
.page-wrapper[b-qa6ek1q330] {
    max-width: 1440px;
    margin: 0 auto;
    padding: 28px 40px 52px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.content-grid[b-qa6ek1q330] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 40px;
    align-items: start;
}

.main-content[b-qa6ek1q330] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Header */
.page-header[b-qa6ek1q330] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.breadcrumb-nav[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
}

.breadcrumb-link[b-qa6ek1q330] {
    color: #64748b;
    text-decoration: none;
    cursor: pointer;
}

.breadcrumb-link:hover[b-qa6ek1q330] {
    color: #2e75b6;
}

.breadcrumb-separator[b-qa6ek1q330] {
    color: #94a3b8;
    font-size: 10px;
}

.breadcrumb-current[b-qa6ek1q330] {
    color: #0f172a;
    font-weight: 600;
}

.header-main[b-qa6ek1q330] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.title-area h1[b-qa6ek1q330] {
    font-size: 32px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 8px;
    letter-spacing: -0.02em;
}

.page-title[b-qa6ek1q330] {
    font-size: 32px;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 8px;
    letter-spacing: -0.02em;
}

.page-subtitle[b-qa6ek1q330] {
    font-size: 15px;
    color: #64748b;
    margin: 0;
}

.header-actions[b-qa6ek1q330] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-shrink: 0;
}

/* Buttons */
.btn-primary[b-qa6ek1q330] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    background: #2e75b6;
    color: #fff;
    border: 1px solid #2e75b6;
    cursor: pointer;
    gap: 8px;
}

.btn-primary:hover[b-qa6ek1q330] {
    background: #25639c;
}

.btn-outlined[b-qa6ek1q330] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 16px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    background: transparent;
    color: #0f172a;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    gap: 8px;
}

.btn-outlined:hover[b-qa6ek1q330] {
    background: #f1f5f9;
}

.btn-sm[b-qa6ek1q330] {
    height: 32px;
    padding: 0 12px;
    font-size: 13px;
}

.btn-icon[b-qa6ek1q330] {
    font-size: 13px;
}

.btn-icon-sm[b-qa6ek1q330] {
    font-size: 11px;
}

/* Skill Group Cards */
.skill-card[b-qa6ek1q330] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.skill-card-header[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.skill-card-header:hover[b-qa6ek1q330] {
    background: #fafbfc;
}

.skill-card-expanded .skill-card-header[b-qa6ek1q330] {
    border-bottom: 1px solid #e2e8f0;
}

.skill-card-title-area[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.skill-card-title[b-qa6ek1q330] {
    font-size: 16px;
    font-weight: 600;
    color: #0f172a;
}

.badge-muted[b-qa6ek1q330] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    background: #f1f5f9;
    color: #64748b;
}

.badge-outline[b-qa6ek1q330] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    background: transparent;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.chevron-icon[b-qa6ek1q330] {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 14px;
}

/* Skill Card Body */
.skill-card-body[b-qa6ek1q330] {
    display: flex;
    flex-direction: column;
}

.sub-skill-row[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-bottom: 1px solid #e2e8f0;
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.sub-skill-row:last-child[b-qa6ek1q330] {
    border-bottom: none;
}

.sub-skill-row:hover[b-qa6ek1q330] {
    background: #fafbfc;
}

.sub-skill-info[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.sub-skill-name[b-qa6ek1q330] {
    font-size: 14px;
    font-weight: 500;
    color: #0f172a;
}

.sub-skill-actions[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.sub-skill-arrow[b-qa6ek1q330] {
    color: #94a3b8;
    font-size: 14px;
}

.sub-skill-loading[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.sub-skill-empty[b-qa6ek1q330] {
    padding: 24px;
    text-align: center;
    color: #94a3b8;
    font-size: 14px;
    font-style: italic;
}

.card-footer[b-qa6ek1q330] {
    padding: 16px 24px;
    background: #fafcfd;
    border-top: 1px solid #e2e8f0;
}

/* Sidebar */
.sidebar-panel[b-qa6ek1q330] {
    position: sticky;
    top: 48px;
    background: #eaf3fa;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sidebar-panel-header[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #2e75b6;
    font-weight: 600;
    font-size: 15px;
}

.sidebar-icon[b-qa6ek1q330] {
    font-size: 18px;
}

.sidebar-panel p[b-qa6ek1q330] {
    color: #1e4e7a;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
}

/* Loading */
.loading-state[b-qa6ek1q330] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60vh;
}

/* Empty State */
.empty-state[b-qa6ek1q330] {
    min-height: 280px;
    border: 1px dashed #e2e8f0;
    border-radius: 12px;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    padding: 40px;
    color: #64748b;
}

.empty-icon-wrapper[b-qa6ek1q330] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 8px;
}

.empty-icon[b-qa6ek1q330] {
    font-size: 20px;
    color: #64748b;
}

.empty-title[b-qa6ek1q330] {
    font-size: 18px;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.empty-copy[b-qa6ek1q330] {
    font-size: 15px;
    max-width: 380px;
    margin: 0;
    color: #64748b;
}
/* /Components/Pages/SkillsMatrix/SkillsMatrixImportPage.razor.rz.scp.css */
.imp-page[b-vlqd9epfro] { max-width: 1000px; margin: 0 auto; padding: 48px 32px; display: flex; flex-direction: column; gap: 40px; }

/* Header */
.imp-header[b-vlqd9epfro] { display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: center; }
.imp-breadcrumb[b-vlqd9epfro] { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.imp-breadcrumb-link[b-vlqd9epfro] { color: #64748b; text-decoration: none; }
.imp-breadcrumb-link:hover[b-vlqd9epfro] { color: #2e75b6; }
.imp-breadcrumb-sep[b-vlqd9epfro] { color: #94a3b8; font-size: 10px; }
.imp-breadcrumb-current[b-vlqd9epfro] { color: #0f172a; font-weight: 500; }
.imp-title[b-vlqd9epfro] { font-size: 28px; font-weight: 600; color: #0f172a; letter-spacing: -0.02em; margin: 0; }

/* Stepper */
.imp-stepper[b-vlqd9epfro] { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 16px; }
.imp-step[b-vlqd9epfro] { display: flex; align-items: center; gap: 12px; }
.imp-step-circle[b-vlqd9epfro] { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 14px; background: #fff; border: 2px solid #e2e8f0; color: #64748b; }
.imp-step-active .imp-step-circle[b-vlqd9epfro] { background: #2e75b6; border-color: #2e75b6; color: #fff; }
.imp-step-completed .imp-step-circle[b-vlqd9epfro] { background: #2e75b6; border-color: #2e75b6; color: #fff; }
.imp-step-label[b-vlqd9epfro] { font-weight: 500; color: #64748b; font-size: 14px; }
.imp-step-active .imp-step-label[b-vlqd9epfro] { color: #0f172a; font-weight: 600; }
.imp-step-line[b-vlqd9epfro] { width: 64px; height: 2px; background: #e2e8f0; }
.imp-step-line-active[b-vlqd9epfro] { background: #2e75b6; }

/* Card */
.imp-card[b-vlqd9epfro] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 4px 6px -1px rgba(0,0,0,.05), 0 2px 4px -2px rgba(0,0,0,.05); overflow: hidden; }
.imp-card-body[b-vlqd9epfro] { padding: 32px; display: flex; flex-direction: column; gap: 24px; }
.imp-card-footer[b-vlqd9epfro] { padding: 20px 32px; background: #f1f5f9; border-top: 1px solid #e2e8f0; display: flex; justify-content: space-between; align-items: center; }

.imp-scope-grid[b-vlqd9epfro] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.imp-scope-card[b-vlqd9epfro] { border: 1px solid #dbe4ee; background: #fff; border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; transition: all .15s; cursor: pointer; text-align: left; }
.imp-scope-card:hover[b-vlqd9epfro] { border-color: #9bbde0; background: #f8fbff; }
.imp-scope-card-active[b-vlqd9epfro] { border-color: #2e75b6; background: #eaf3fa; box-shadow: inset 0 0 0 1px #2e75b6; }
.imp-scope-title[b-vlqd9epfro] { font-size: 14px; font-weight: 700; color: #0f172a; }
.imp-scope-subtitle[b-vlqd9epfro] { font-size: 12px; color: #64748b; }

/* Drop Zone */
.imp-drop-upload[b-vlqd9epfro] { position: relative; width: 100%; }
.imp-drop-zone[b-vlqd9epfro] { position: relative; border: 2px dashed #e2e8f0; border-radius: 12px; padding: 64px 32px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; background: #f1f5f9; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; overflow: hidden; }
.imp-drop-zone:hover[b-vlqd9epfro] { border-color: #2e75b6; background: #eaf3fa; }
.imp-drop-zone-dragover[b-vlqd9epfro] { border-color: #2e75b6; background: #eaf3fa; }
.imp-drop-icon-wrapper[b-vlqd9epfro] { width: 64px; height: 64px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0,0,0,.1); margin-bottom: 8px; }
.imp-drop-title[b-vlqd9epfro] { font-size: 16px; font-weight: 500; color: #0f172a; }
.imp-drop-subtitle[b-vlqd9epfro] { font-size: 14px; color: #64748b; }

/* Download Link */
.imp-download-link[b-vlqd9epfro] { display: inline-flex; align-items: center; gap: 6px; color: #2e75b6; font-weight: 500; font-size: 14px; background: none; border: none; cursor: pointer; padding: 0; align-self: flex-start; }
.imp-download-link:hover[b-vlqd9epfro] { text-decoration: underline; }
.imp-download-link:disabled[b-vlqd9epfro] { opacity: .5; cursor: not-allowed; text-decoration: none; }

/* Info Panel */
.imp-info-panel[b-vlqd9epfro] { background: #eaf3fa; border-radius: 6px; padding: 20px; display: flex; flex-direction: column; gap: 12px; border: 1px solid rgba(46,117,182,.2); }
.imp-info-header[b-vlqd9epfro] { display: flex; align-items: center; gap: 8px; font-weight: 600; color: #1e4e7a; font-size: 15px; }
.imp-info-content[b-vlqd9epfro] { display: flex; flex-direction: column; gap: 8px; color: #1e4e7a; font-size: 14px; }
.imp-info-content p[b-vlqd9epfro] { margin: 0; }
.imp-info-note[b-vlqd9epfro] { font-style: italic; opacity: .9; }

/* Summary + Preview */
.imp-summary-bar[b-vlqd9epfro] { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 32px; border-bottom: 1px solid #e2e8f0; }
.imp-summary-text[b-vlqd9epfro] { font-weight: 500; color: #0f172a; font-size: 15px; }
.imp-summary-stats[b-vlqd9epfro] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 13px; color: #64748b; }
.imp-stat-item[b-vlqd9epfro] { display: inline-flex; align-items: center; gap: 4px; }
.imp-stat-ok[b-vlqd9epfro] { color: #166534; font-weight: 600; }
.imp-stat-existing[b-vlqd9epfro] { color: #1e4e7a; font-weight: 600; }
.imp-stat-update[b-vlqd9epfro] { color: #92400e; font-weight: 600; }
.imp-stat-error[b-vlqd9epfro] { color: #991b1b; font-weight: 600; }

.imp-preview-message[b-vlqd9epfro] { margin: 20px 32px; padding: 12px 14px; border-radius: 8px; border: 1px solid #cbd5e1; color: #334155; display: flex; align-items: center; gap: 8px; }
.imp-preview-message-error[b-vlqd9epfro] { border-color: #fecaca; background: #fef2f2; color: #991b1b; }

.imp-preview-table-wrap[b-vlqd9epfro] { overflow-x: auto; max-height: 420px; }
.imp-preview-table[b-vlqd9epfro] { width: 100%; border-collapse: collapse; }
.imp-preview-table th[b-vlqd9epfro] { background: #f8fafc; color: #475569; font-size: 12px; letter-spacing: .02em; text-transform: uppercase; font-weight: 700; padding: 12px 14px; border-bottom: 1px solid #e2e8f0; text-align: left; position: sticky; top: 0; z-index: 1; }
.imp-preview-table td[b-vlqd9epfro] { padding: 12px 14px; border-bottom: 1px solid #e2e8f0; color: #0f172a; vertical-align: top; font-size: 13px; }
.imp-preview-table tr:last-child td[b-vlqd9epfro] { border-bottom: none; }
.imp-preview-row-error[b-vlqd9epfro] { background: #fef2f2; }
.imp-preview-caption[b-vlqd9epfro] { padding: 10px 32px 0; color: #64748b; font-size: 12px; }

.imp-badge[b-vlqd9epfro] { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 10px; font-size: 12px; font-weight: 600; }
.imp-badge-ready[b-vlqd9epfro] { color: #166534; background: #dcfce7; }
.imp-badge-existing[b-vlqd9epfro] { color: #1e4e7a; background: #dbeafe; }
.imp-badge-update[b-vlqd9epfro] { color: #92400e; background: #ffedd5; }
.imp-badge-error[b-vlqd9epfro] { color: #991b1b; background: #fee2e2; white-space: normal; }
.imp-roadmap-btn[b-vlqd9epfro] { border: none; background: transparent; color: #2e75b6; cursor: pointer; font-size: 16px; line-height: 1; padding: 0; }
.imp-roadmap-btn:hover[b-vlqd9epfro] { color: #1e4e7a; }
.imp-roadmap-empty[b-vlqd9epfro] { color: #94a3b8; }

/* Roadmap Modal */
.imp-modal-overlay[b-vlqd9epfro] { position: fixed; inset: 0; z-index: 1200; background: rgba(15, 23, 42, .45); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; padding: 20px; }
.imp-modal[b-vlqd9epfro] { width: min(560px, 100%); background: #fff; border-radius: 12px; border: 1px solid #dbe4ee; box-shadow: 0 10px 30px rgba(15, 23, 42, .25); overflow: hidden; }
.imp-modal-header[b-vlqd9epfro] { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid #e2e8f0; }
.imp-modal-header h3[b-vlqd9epfro] { margin: 0; font-size: 16px; color: #0f172a; font-weight: 600; }
.imp-modal-close[b-vlqd9epfro] { border: none; background: transparent; color: #64748b; cursor: pointer; font-size: 16px; line-height: 1; padding: 2px; }
.imp-modal-close:hover[b-vlqd9epfro] { color: #0f172a; }
.imp-modal-body[b-vlqd9epfro] { padding: 16px 20px; max-height: 360px; overflow-y: auto; }
.imp-roadmap-list[b-vlqd9epfro] { margin: 0; padding-left: 20px; color: #334155; font-size: 14px; display: flex; flex-direction: column; gap: 8px; }

/* Buttons */
.imp-btn-primary[b-vlqd9epfro] { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 20px; font-size: 14px; font-weight: 500; border-radius: 6px; cursor: pointer; white-space: nowrap; gap: 8px; background: #2e75b6; color: #fff; border: none; text-decoration: none; }
.imp-btn-primary:hover[b-vlqd9epfro] { background: #25639c; }
.imp-btn-primary:disabled[b-vlqd9epfro] { opacity: .5; cursor: not-allowed; }
.imp-btn-secondary[b-vlqd9epfro] { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 20px; font-size: 14px; font-weight: 500; border-radius: 6px; cursor: pointer; white-space: nowrap; gap: 8px; background: #fff; color: #334155; border: 1px solid #e2e8f0; text-decoration: none; }
.imp-btn-secondary:hover[b-vlqd9epfro] { background: #f1f5f9; }

/* Success */
.imp-success-content[b-vlqd9epfro] { padding: 64px 32px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 24px; }
.imp-success-icon[b-vlqd9epfro] { width: 80px; height: 80px; border-radius: 50%; background: #dcfce7; display: flex; align-items: center; justify-content: center; }
.imp-success-title[b-vlqd9epfro] { font-size: 24px; font-weight: 600; color: #0f172a; margin: 0; }
.imp-success-desc[b-vlqd9epfro] { font-size: 16px; color: #64748b; max-width: 500px; margin: 0; }

/* Error List */
.imp-error-list[b-vlqd9epfro] { width: 100%; max-width: 600px; border: 1px solid #fecaca; border-radius: 8px; overflow: hidden; text-align: left; }
.imp-error-list-header[b-vlqd9epfro] { display: flex; align-items: center; gap: 8px; padding: 12px 16px; background: #fef2f2; font-weight: 600; color: #991b1b; font-size: 14px; border-bottom: 1px solid #fecaca; }
.imp-error-list-body[b-vlqd9epfro] { max-height: 200px; overflow-y: auto; }
.imp-error-row[b-vlqd9epfro] { padding: 8px 16px; font-size: 13px; color: #991b1b; border-bottom: 1px solid #fef2f2; }
.imp-error-row:last-child[b-vlqd9epfro] { border-bottom: none; }

/* Loading */
.imp-loading[b-vlqd9epfro] { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 300px; }

@media (max-width: 900px) {
  .imp-page[b-vlqd9epfro] { padding: 24px 16px; gap: 24px; }
  .imp-title[b-vlqd9epfro] { font-size: 24px; }
  .imp-stepper[b-vlqd9epfro] { gap: 8px; }
  .imp-step-line[b-vlqd9epfro] { width: 28px; }
  .imp-step-label[b-vlqd9epfro] { display: none; }
  .imp-card-body[b-vlqd9epfro] { padding: 20px; }
  .imp-card-footer[b-vlqd9epfro] { padding: 16px 20px; flex-wrap: wrap; gap: 12px; }
  .imp-summary-bar[b-vlqd9epfro] { padding: 14px 20px; flex-direction: column; align-items: flex-start; }
  .imp-preview-message[b-vlqd9epfro] { margin: 16px 20px; }
  .imp-preview-caption[b-vlqd9epfro] { padding: 8px 20px 0; }
  .imp-scope-grid[b-vlqd9epfro] { grid-template-columns: 1fr; }
}
/* /Components/Pages/SkillsMatrix/SkillsMatrixItemDetailsPage.razor.rz.scp.css */
.page-wrapper[b-zyo33zoawx] { max-width: 1440px; margin: 0 auto; padding: 28px 40px 52px; display: flex; flex-direction: column; gap: 20px; }
.content-grid[b-zyo33zoawx] { display: grid; grid-template-columns: 1fr 320px; gap: 40px; align-items: start; }
.main-content[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 16px; }

/* Header */
.page-header[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 16px; }
.breadcrumb-nav[b-zyo33zoawx] { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.breadcrumb-link[b-zyo33zoawx] { color: #64748b; text-decoration: none; }
.breadcrumb-link:hover[b-zyo33zoawx] { color: #2e75b6; }
.breadcrumb-sep[b-zyo33zoawx] { color: #94a3b8; font-size: 10px; }
.breadcrumb-current[b-zyo33zoawx] { color: #0f172a; font-weight: 600; }
.header-main[b-zyo33zoawx] { display: flex; justify-content: space-between; align-items: flex-start; }
.page-title[b-zyo33zoawx] { font-size: 32px; font-weight: 700; color: #0f172a; margin: 0 0 8px; letter-spacing: -0.02em; }
.page-subtitle[b-zyo33zoawx] { font-size: 15px; color: #64748b; margin: 0; }
.header-actions[b-zyo33zoawx] { display: flex; gap: 12px; align-items: center; flex-shrink: 0; }

/* Buttons */
.btn-primary[b-zyo33zoawx], .btn-secondary[b-zyo33zoawx], .btn-outlined[b-zyo33zoawx] { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 16px; border-radius: 6px; font-size: 14px; font-weight: 500; white-space: nowrap; cursor: pointer; gap: 8px; }
.btn-primary[b-zyo33zoawx] { background: #2e75b6; color: #fff; border: 1px solid #2e75b6; }
.btn-primary:hover[b-zyo33zoawx] { background: #25639c; }
.btn-secondary[b-zyo33zoawx] { background: #f1f5f9; color: #0f172a; border: 1px solid #e2e8f0; }
.btn-secondary:hover[b-zyo33zoawx] { background: #e2e8f0; }
.btn-outlined[b-zyo33zoawx] { background: transparent; color: #0f172a; border: 1px solid #e2e8f0; }
.btn-outlined:hover[b-zyo33zoawx] { background: #f1f5f9; }
.btn-sm[b-zyo33zoawx] { height: 32px; padding: 0 12px; font-size: 13px; }
.btn-icon[b-zyo33zoawx] { font-size: 13px; }

/* Skill Cards */
.skill-card[b-zyo33zoawx] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.05); overflow: hidden; }
.skill-card-header[b-zyo33zoawx] { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; cursor: pointer; transition: background .1s; }
.skill-card-header:hover[b-zyo33zoawx] { background: #fafbfc; }
.skill-card-expanded .skill-card-header[b-zyo33zoawx] { border-bottom: 1px solid #e2e8f0; }
.skill-card-title-area[b-zyo33zoawx] { display: flex; align-items: center; gap: 16px; }
.skill-card-title[b-zyo33zoawx] { font-size: 16px; font-weight: 600; color: #0f172a; }
.skill-card-header-actions[b-zyo33zoawx] { display: flex; align-items: center; gap: 12px; }
.chevron-icon[b-zyo33zoawx] { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; color: #94a3b8; font-size: 14px; }

/* Badges */
.badge[b-zyo33zoawx] { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 16px; font-size: 12px; font-weight: 500; white-space: nowrap; }
.badge-outline[b-zyo33zoawx] { background: transparent; color: #64748b; border: 1px solid #e2e8f0; }
.badge-success[b-zyo33zoawx] { background: #dcfce7; color: #166534; border: none; }
.badge-warning[b-zyo33zoawx] { background: #fef3c7; color: #92400e; border: none; }

/* Grade Rows */
.skill-card-body[b-zyo33zoawx] { display: flex; flex-direction: column; }
.grade-row[b-zyo33zoawx] { display: flex; gap: 16px; padding: 16px 24px; border-bottom: 1px solid #f1f5f9; align-items: flex-start; }
.grade-row:last-child[b-zyo33zoawx] { border-bottom: none; }
.grade-badge[b-zyo33zoawx] { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 44px; padding: 0 10px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; flex-shrink: 0; margin-top: 2px; }
.grade-j[b-zyo33zoawx] { background: #10b981; }
.grade-m[b-zyo33zoawx] { background: #3b82f6; }
.grade-s[b-zyo33zoawx] { background: #8b5cf6; }
.grade-exp[b-zyo33zoawx] { background: #f59e0b; }
.grade-default[b-zyo33zoawx] { background: #64748b; }
.grade-content[b-zyo33zoawx] { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.grade-main[b-zyo33zoawx] { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.grade-desc[b-zyo33zoawx] { font-size: 14px; color: #1e293b; line-height: 1.5; flex: 1; }
.score-badge[b-zyo33zoawx] { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 500; background: #f1f5f9; color: #64748b; white-space: nowrap; flex-shrink: 0; }
.roadmap-meta[b-zyo33zoawx] { display: flex; align-items: flex-start; gap: 8px; }
.roadmap-meta-icon[b-zyo33zoawx] { color: #94a3b8; font-size: 14px; margin-top: 2px; }
.roadmap-items[b-zyo33zoawx] { display: flex; flex-wrap: wrap; gap: 6px; }
.roadmap-chip[b-zyo33zoawx] { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 12px; font-size: 12px; font-weight: 500; background: #f1f5f9; color: #475569; }

.grade-loading[b-zyo33zoawx], .grade-empty[b-zyo33zoawx] { display: flex; align-items: center; justify-content: center; padding: 24px; color: #94a3b8; font-size: 14px; }

/* Sidebar */
.sidebar-stack[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 48px; }
.sidebar-panel[b-zyo33zoawx] { background: #eaf3fa; border-radius: 12px; padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.sidebar-panel-header[b-zyo33zoawx] { display: flex; align-items: center; gap: 12px; color: #2e75b6; font-weight: 600; font-size: 15px; }
.sidebar-icon[b-zyo33zoawx] { font-size: 18px; }
.sidebar-panel p[b-zyo33zoawx] { color: #1e4e7a; font-size: 14px; line-height: 1.6; margin: 0; }

/* Stats Card */
.stats-card[b-zyo33zoawx] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; }
.stats-header h3[b-zyo33zoawx] { font-size: 15px; font-weight: 600; color: #0f172a; margin: 0 0 16px; }
.progress-section[b-zyo33zoawx] { margin-bottom: 16px; }
.progress-track[b-zyo33zoawx] { display: flex; height: 8px; border-radius: 4px; background: #f1f5f9; overflow: hidden; }
.progress-fill-success[b-zyo33zoawx] { background: #10b981; transition: width .3s; }
.progress-fill-warning[b-zyo33zoawx] { background: #f59e0b; transition: width .3s; }
.stat-list[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 0; }
.stat-row[b-zyo33zoawx] { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; }
.stat-label[b-zyo33zoawx] { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #475569; }
.stat-value[b-zyo33zoawx] { font-size: 14px; font-weight: 600; color: #0f172a; }
.stat-dot[b-zyo33zoawx] { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot-success[b-zyo33zoawx] { background: #10b981; }
.dot-warning[b-zyo33zoawx] { background: #f59e0b; }
.dot-empty[b-zyo33zoawx] { background: #e2e8f0; }
.stat-total[b-zyo33zoawx] { border-top: 1px solid #e2e8f0; padding-top: 12px; font-weight: 600; color: #0f172a; font-size: 14px; }

/* Loading / Empty */
.loading-state[b-zyo33zoawx] { display: flex; align-items: center; justify-content: center; min-height: 60vh; }
.empty-state-full[b-zyo33zoawx] { min-height: 280px; border: 1px dashed #e2e8f0; border-radius: 12px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; padding: 40px; color: #64748b; }
.empty-state-full h3[b-zyo33zoawx] { font-size: 18px; font-weight: 700; color: #0f172a; margin: 0; }
.empty-state-full p[b-zyo33zoawx] { font-size: 14px; color: #64748b; margin: 0; }

/* Grade Requirements Editor (inline modal) */
.gre-backdrop[b-zyo33zoawx] { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(15,23,42,.5); display: flex; align-items: center; justify-content: center; z-index: 1050; padding: 24px; }
.gre-modal[b-zyo33zoawx] { width: 100%; max-width: 900px; background: #fff; border-radius: 12px; box-shadow: 0 20px 25px -5px rgba(15,23,42,.3); border: 1px solid #e2e8f0; display: flex; flex-direction: column; max-height: 90vh; }
.gre-header[b-zyo33zoawx] { padding: 20px 24px; border-bottom: 1px solid #e2e8f0; display: flex; align-items: flex-start; justify-content: space-between; }
.gre-header-titles h2[b-zyo33zoawx] { font-size: 20px; font-weight: 600; color: #1e293b; margin: 0; }
.gre-header-titles p[b-zyo33zoawx] { font-size: 14px; color: #64748b; margin: 4px 0 0; }
.gre-close-btn[b-zyo33zoawx] { width: 32px; height: 32px; border-radius: 8px; border: none; background: transparent; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #64748b; cursor: pointer; }
.gre-close-btn:hover[b-zyo33zoawx] { background: #f1f5f9; }
.gre-body[b-zyo33zoawx] { padding: 24px; overflow-y: auto; flex: 1; }
.gre-grid[b-zyo33zoawx] { display: grid; grid-template-columns: 1fr 280px; gap: 32px; }
.gre-form-column[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 0; }
.gre-section-divider[b-zyo33zoawx] { height: 1px; background: #e2e8f0; margin: 24px 0; }
.gre-grade-section[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 14px; }
.gre-grade-header[b-zyo33zoawx] { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.gre-grade-header-left[b-zyo33zoawx] { display: flex; align-items: center; gap: 10px; }
.gre-grade-badge[b-zyo33zoawx] { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 44px; padding: 0 10px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; }
.gre-grade-j[b-zyo33zoawx] { background: #10b981; }
.gre-grade-m[b-zyo33zoawx] { background: #3b82f6; }
.gre-grade-s[b-zyo33zoawx] { background: #8b5cf6; }
.gre-grade-exp[b-zyo33zoawx] { background: #f59e0b; }
.gre-grade-int[b-zyo33zoawx] { background: #94a3b8; }
.gre-grade-sa[b-zyo33zoawx] { background: #06b6d4; }
.gre-grade-pri[b-zyo33zoawx] { background: #ec4899; }
.gre-grade-default[b-zyo33zoawx] { background: #64748b; }
.gre-grade-name[b-zyo33zoawx] { font-size: 15px; font-weight: 600; color: #0f172a; }
.gre-score-field[b-zyo33zoawx] { display: flex; align-items: center; gap: 8px; }
.gre-score-label[b-zyo33zoawx] { font-size: 13px; color: #64748b; font-weight: 500; }
.gre-roadmap-block[b-zyo33zoawx] { display: flex; flex-direction: column; gap: 8px; }
.gre-roadmap-header[b-zyo33zoawx] { display: flex; align-items: center; gap: 6px; }
.gre-roadmap-label[b-zyo33zoawx] { font-size: 13px; font-weight: 600; color: #1e293b; }
.gre-roadmap-helper[b-zyo33zoawx] { font-size: 12px; color: #94a3b8; }
.gre-chip-list[b-zyo33zoawx] { display: flex; flex-wrap: wrap; gap: 6px; }
.gre-chip[b-zyo33zoawx] { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 16px; background: #f1f5f9; font-size: 13px; color: #475569; }
.gre-chip-remove[b-zyo33zoawx] { display: flex; align-items: center; justify-content: center; width: 16px; height: 16px; border: none; background: transparent; color: #94a3b8; cursor: pointer; padding: 0; border-radius: 50%; }
.gre-chip-remove:hover[b-zyo33zoawx] { background: #e2e8f0; color: #ef4444; }
.gre-roadmap-add-row[b-zyo33zoawx] { display: flex; gap: 8px; align-items: center; }
.gre-roadmap-add-row > .mud-input-control[b-zyo33zoawx] { flex: 1; margin: 0; }
.gre-roadmap-add-btn[b-zyo33zoawx] { flex-shrink: 0; }
.gre-guide-column[b-zyo33zoawx] { position: sticky; top: 0; }
.gre-guide-panel[b-zyo33zoawx] { background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 20px; }
.gre-guide-header[b-zyo33zoawx] { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: #92400e; margin-bottom: 12px; }
.gre-guide-list[b-zyo33zoawx] { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 8px; }
.gre-guide-list li[b-zyo33zoawx] { font-size: 13px; color: #78350f; line-height: 1.5; }
.gre-footer[b-zyo33zoawx] { padding: 16px 24px; border-top: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.gre-btn-secondary[b-zyo33zoawx] { height: 40px; padding: 0 20px; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; font-size: 14px; font-weight: 500; color: #475569; cursor: pointer; }
.gre-btn-secondary:hover[b-zyo33zoawx] { background: #f1f5f9; }
.gre-btn-primary[b-zyo33zoawx] { height: 40px; padding: 0 24px; border-radius: 8px; border: none; background: #2e75b6; color: #fff; font-size: 14px; font-weight: 500; cursor: pointer; display: inline-flex; align-items: center; }
.gre-btn-primary:hover[b-zyo33zoawx] { background: #1e5a8e; }
.gre-btn-primary:disabled[b-zyo33zoawx] { opacity: .6; cursor: not-allowed; }
/* /Components/Pages/SkillsMatrix/SkillsMatrixItemsPage.razor.rz.scp.css */
.sgl-page[b-6np5ronofm] { width: 100%; min-height: 100vh; padding: 32px 0 56px; display: flex; justify-content: center; }
.sgl-shell[b-6np5ronofm] { width: 100%; padding: 0 32px; display: flex; flex-direction: column; gap: 16px; }

/* Header */
.sgl-header[b-6np5ronofm] { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; }
.sgl-header-left[b-6np5ronofm] { display: flex; flex-direction: column; gap: 8px; }
.sgl-breadcrumb[b-6np5ronofm] { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.sgl-breadcrumb-link[b-6np5ronofm] { color: #64748b; text-decoration: none; }
.sgl-breadcrumb-link:hover[b-6np5ronofm] { color: #2e75b6; }
.sgl-breadcrumb-sep[b-6np5ronofm] { color: #94a3b8; font-size: 10px; }
.sgl-breadcrumb-current[b-6np5ronofm] { color: #0f172a; font-weight: 600; }
.sgl-title[b-6np5ronofm] { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 700; letter-spacing: -0.03em; color: #1e293b; }
.sgl-subtitle[b-6np5ronofm] { margin: 0; font-size: 15px; color: #64748b; }
.sgl-header-actions[b-6np5ronofm] { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.sgl-btn-primary[b-6np5ronofm] { display: inline-flex; align-items: center; justify-content: center; height: 40px; padding: 0 16px; border-radius: 6px; font-size: 14px; font-weight: 500; white-space: nowrap; background: #2e75b6; color: #fff; border: 1px solid #2e75b6; cursor: pointer; gap: 8px; }
.sgl-btn-primary:hover[b-6np5ronofm] { background: #25639c; }

/* Filters */
.sgl-filters-inline[b-6np5ronofm] { display: flex; align-items: flex-end; gap: 0.75rem; flex-wrap: wrap; }
.sgl-filter-search[b-6np5ronofm] { flex: 1 1 260px; min-width: 220px; }
.sgl-filter-item[b-6np5ronofm] { flex: 0 0 auto; width: 240px; }
.sgl-category-filter[b-6np5ronofm] { width: 100%; }
.sgl-filter-actions[b-6np5ronofm] { display: flex; align-items: center; }

[b-6np5ronofm] .sgl-filter-search .mud-input-control,
[b-6np5ronofm] .sgl-filter-item .mud-input-control,
[b-6np5ronofm] .sgl-filter-item .mud-select {
    width: 100% !important;
}

@media (max-width: 992px) {
    .sgl-filter-item[b-6np5ronofm] { width: 100%; }
}

/* Table */
.sgl-table-card[b-6np5ronofm] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.sgl-data-table[b-6np5ronofm] { width: 100%; border-collapse: collapse; }
.sgl-data-table thead th[b-6np5ronofm] { padding: 14px 20px; text-align: left; font-size: 12px; font-weight: 600; color: #64748b; text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid #e2e8f0; background: #fafbfc; }
.sgl-data-table tbody td[b-6np5ronofm] { padding: 16px 20px; font-size: 14px; color: #1e293b; border-bottom: 1px solid #f1f5f9; }
.sgl-data-table tbody tr:last-child td[b-6np5ronofm] { border-bottom: none; }
.sgl-clickable-row[b-6np5ronofm] { cursor: pointer; transition: background .1s; }
.sgl-clickable-row:hover[b-6np5ronofm] { background: #f8fafc; }
.sgl-td-name[b-6np5ronofm] { font-weight: 600; color: #0f172a; }
.sgl-td-muted[b-6np5ronofm] { color: #64748b; }
.sgl-td-arrow[b-6np5ronofm] { text-align: center; }
.sgl-category-badge[b-6np5ronofm] { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 500; background: #dbeafe; color: #1e40af; }
.sgl-sort-btn[b-6np5ronofm] { border: none; background: transparent; color: inherit; font: inherit; text-transform: inherit; letter-spacing: inherit; display: inline-flex; align-items: center; gap: 6px; padding: 0; cursor: pointer; }
.sgl-sort-btn:hover[b-6np5ronofm] { color: #2e75b6; }

/* Progress Bar */
.sgl-progress-wrapper[b-6np5ronofm] { display: flex; align-items: center; gap: 10px; }
.sgl-progress-bar[b-6np5ronofm] { flex: 1; height: 6px; border-radius: 3px; background: #f1f5f9; overflow: hidden; min-width: 60px; }
.sgl-progress-fill[b-6np5ronofm] { height: 100%; border-radius: 3px; transition: width .3s; }
.sgl-progress-pct[b-6np5ronofm] { font-size: 12px; font-weight: 600; color: #475569; min-width: 38px; text-align: right; }
.sgl-progress-meta[b-6np5ronofm] { margin-top: 4px; font-size: 11px; color: #64748b; }
.sgl-bar-green[b-6np5ronofm] { background: #10b981; }
.sgl-bar-blue[b-6np5ronofm] { background: #3b82f6; }
.sgl-bar-amber[b-6np5ronofm] { background: #f59e0b; }
.sgl-bar-gray[b-6np5ronofm] { background: #e2e8f0; }

/* Pagination */
.sgl-pagination[b-6np5ronofm] { display: flex; align-items: center; justify-content: center; gap: 16px; }
.sgl-page-btn[b-6np5ronofm] { width: 36px; height: 36px; border-radius: 8px; border: 1px solid #e2e8f0; background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #64748b; font-size: 14px; }
.sgl-page-btn:hover:not(:disabled)[b-6np5ronofm] { background: #f1f5f9; }
.sgl-page-btn:disabled[b-6np5ronofm] { opacity: .4; cursor: not-allowed; }
.sgl-page-info[b-6np5ronofm] { font-size: 14px; color: #64748b; }

/* Loading / Empty */
.sgl-loading[b-6np5ronofm] { display: flex; align-items: center; justify-content: center; min-height: 40vh; }
.sgl-empty[b-6np5ronofm] { min-height: 320px; border: 1px dashed #e2e8f0; border-radius: 12px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; text-align: center; padding: 40px; }
.sgl-empty h3[b-6np5ronofm] { font-size: 18px; font-weight: 700; color: #0f172a; margin: 0; }
.sgl-empty p[b-6np5ronofm] { font-size: 14px; color: #64748b; margin: 0; }
/* /Components/Pages/SkillsMatrix/SkillsMatrixViewer.razor.rz.scp.css */
.sv-page[b-lmzriqfrjr] { width: 100%; min-height: 100vh; padding: 32px 0 56px; display: flex; justify-content: center; }
.sv-shell[b-lmzriqfrjr] { width: 100%; padding: 0 32px; display: flex; flex-direction: column; gap: 20px; }

.sv-header[b-lmzriqfrjr] { display: flex; flex-direction: column; gap: 16px; }
.sv-breadcrumb[b-lmzriqfrjr] { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.sv-breadcrumb-link[b-lmzriqfrjr] { color: #64748b; text-decoration: none; }
.sv-breadcrumb-link:hover[b-lmzriqfrjr] { color: #2e75b6; }
.sv-breadcrumb-sep[b-lmzriqfrjr] { color: #94a3b8; font-size: 10px; }
.sv-breadcrumb-current[b-lmzriqfrjr] { color: #0f172a; font-weight: 600; }
.sv-title[b-lmzriqfrjr] { margin: 0; font-size: 32px; line-height: 1.15; font-weight: 700; letter-spacing: -0.03em; color: #0f172a; }
.sv-subtitle[b-lmzriqfrjr] { margin: 0; font-size: 15px; color: #64748b; }

/* Filter Card */
.sv-filter-card[b-lmzriqfrjr] { position: sticky; top: 24px; z-index: 5; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.04); padding: 24px 28px; }
.sv-filter-grid[b-lmzriqfrjr] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: start; }
.sv-filter-group[b-lmzriqfrjr] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sv-filter-label[b-lmzriqfrjr] { font-size: 13px; line-height: 1.2; font-weight: 700; letter-spacing: .06em; color: #64748b; }
.sv-filter-helper[b-lmzriqfrjr] { font-size: 12px; color: #94a3b8; line-height: 1.4; }

/* Content */
.sv-content[b-lmzriqfrjr] { display: flex; flex-direction: column; gap: 18px; }

/* Skill Section */
.sv-skill-section[b-lmzriqfrjr] { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.sv-section-header[b-lmzriqfrjr] { width: 100%; min-height: 66px; background: #f1f5f9; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 24px; cursor: pointer; transition: background .1s; }
.sv-section-header:hover[b-lmzriqfrjr] { background: #e8edf2; }
.sv-section-header-left[b-lmzriqfrjr] { display: flex; align-items: center; gap: 14px; }
.sv-section-title[b-lmzriqfrjr] { font-size: 16px; font-weight: 700; color: #0f172a; }
.sv-section-count[b-lmzriqfrjr] { display: inline-flex; align-items: center; justify-content: center; height: 26px; padding: 0 10px; border-radius: 16px; background: #e2e8f0; color: #64748b; font-size: 12px; font-weight: 600; }

/* Table */
.sv-section-body[b-lmzriqfrjr] { display: flex; flex-direction: column; }
.sv-table-header[b-lmzriqfrjr], .sv-skill-row[b-lmzriqfrjr] { display: grid; grid-template-columns: minmax(220px, 25%) minmax(420px, 1fr) 110px; gap: 24px; padding: 18px 28px; align-items: start; }
.sv-table-header[b-lmzriqfrjr] { padding-top: 14px; padding-bottom: 14px; border-top: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; }
.sv-table-head-label[b-lmzriqfrjr] { font-size: 12px; line-height: 1.2; font-weight: 700; letter-spacing: .06em; color: #64748b; }
.sv-skill-row[b-lmzriqfrjr] { border-bottom: 1px solid #e2e8f0; }
.sv-skill-row:last-child[b-lmzriqfrjr] { border-bottom: none; }
.sv-subskill-name[b-lmzriqfrjr] { font-size: 14px; font-weight: 700; color: #0f172a; line-height: 1.45; }
.sv-requirement-cell[b-lmzriqfrjr] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sv-requirement-text[b-lmzriqfrjr] { font-size: 14px; color: #0f172a; line-height: 1.55; }
.sv-requirement-empty[b-lmzriqfrjr] { color: #94a3b8; font-style: italic; }
.sv-roadmap-line[b-lmzriqfrjr] { display: flex; align-items: flex-start; gap: 8px; color: #94a3b8; font-size: 12px; line-height: 1.45; }
.sv-roadmap-text[b-lmzriqfrjr] { min-width: 0; }
.sv-score-cell[b-lmzriqfrjr] { display: flex; justify-content: flex-end; align-items: flex-start; }
.sv-score-badge[b-lmzriqfrjr] { display: inline-flex; align-items: center; justify-content: center; min-height: 26px; min-width: 54px; padding: 0 10px; border-radius: 16px; background: #f1f5f9; color: #64748b; font-size: 12px; font-weight: 600; }
.sv-score-empty[b-lmzriqfrjr] { background: transparent; padding: 0; min-width: auto; }

/* Loading / Empty */
.sv-loading[b-lmzriqfrjr] { display: flex; align-items: center; justify-content: center; min-height: 40vh; }
.sv-empty-state[b-lmzriqfrjr] { min-height: 260px; border: 1px dashed #e2e8f0; border-radius: 12px; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 32px; color: #64748b; }
.sv-empty-title[b-lmzriqfrjr] { font-size: 16px; font-weight: 600; color: #0f172a; }
.sv-empty-copy[b-lmzriqfrjr] { font-size: 14px; max-width: 360px; }
/* /Components/Pages/Statistics/CandidatesStatistics.razor.rz.scp.css */
.card[b-k4enbei0uv] {
    transition: all 0.3s ease;
}
.card:hover[b-k4enbei0uv] {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

.positive-card[b-k4enbei0uv] {
    border-left: 4px solid #28a745 !important;
}
.negative-card[b-k4enbei0uv] {
    border-left: 4px solid #dc3545 !important;
}
.neutral-card[b-k4enbei0uv] {
    border-left: 4px solid #6c757d !important;
}
.all-card[b-k4enbei0uv] {
    border-left: 4px solid #0d6efd !important;
}

.multi-select-option .checkbox[b-k4enbei0uv] {
    margin-right: 10px;
    color: #6c757d;
}

.multi-select-option.selected .checkbox[b-k4enbei0uv] {
    color: #0d6efd;
}

.multi-select-actions button[b-k4enbei0uv] {
    border: none;
    background: none;
    color: #0d6efd;
    font-size: 0.9rem;
    cursor: pointer;
    text-decoration: none;
}

.multi-select-actions button:hover[b-k4enbei0uv] {
    text-decoration: underline;
}

.selection-badge .remove-badge[b-k4enbei0uv] {
    margin-left: 5px;
    cursor: pointer;
    opacity: 0.7;
}

.selection-badge .remove-badge:hover[b-k4enbei0uv] {
    opacity: 1;
}

.sticky-average[b-k4enbei0uv] {
    position: sticky;
    top: 0;
    z-index: 999;
    background: #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 0.25rem;
    transition: all 0.3s ease;
}

.sticky-average-header[b-k4enbei0uv] {
    padding: 0.75rem 1rem;
    background: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    user-select: none;
}

.sticky-average-header:hover[b-k4enbei0uv] {
    background: #e9ecef;
}

.sticky-average-content[b-k4enbei0uv] {
    padding: 1rem;
    transition: all 0.3s ease;
    overflow: hidden;
}

.sticky-average-content.collapsed[b-k4enbei0uv] {
    max-height: 0;
    padding: 0 1rem;
    opacity: 0;
}

.toggle-icon[b-k4enbei0uv] {
    transition: transform 0.3s ease;    
    font-size: 1.2rem;
}

.toggle-icon.collapsed[b-k4enbei0uv] {
    transform: rotate(-90deg);
}

.sticky-average.collapsed-state[b-k4enbei0uv] {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.tv-head-divider[b-k4enbei0uv] {
    margin: -20px 0 16px;
    border-top: 1px solid var(--talents-border-card, #E2EBF0);
}

/* ==========================================================================
   Talent Visual Insides — Overview dashboard (ported from the approved design,
   wired to talents-tokens design system).
   ========================================================================== */
.tv-dashboard[b-k4enbei0uv] {
    --ink: var(--talents-ink, #0D2D3F);
    --brand: var(--talents-brand, #4AC4FF);
    --brand-strong: var(--talents-brand-strong, #0D80BB);
    --brand-50: var(--talents-brand-light, #E8F8FF);
    --muted: var(--talents-muted, #7A9BAD);
    --label: var(--talents-label, #4A6878);
    --placeholder: var(--talents-placeholder, #9BB8C5);
    --bg: var(--talents-bg, #F8FBFD);
    --border: var(--talents-border, #EDF2F5);
    --border-strong: var(--talents-border-strong, #DDE8EE);
    --card-border: var(--talents-border-card, #E2EBF0);
    --pill-bg: var(--talents-pill-bg, #F2F5F7);
    --success: #1F9D55;
    --warning: #D98D14;
    --error: #D8364C;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 14px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 4px rgba(13, 45, 63, 0.06);

    max-width: 1180px;
    margin: 0 auto;
    padding: 8px 4px 48px;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.tv-section-label[b-k4enbei0uv] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--placeholder);
    margin: 28px 0 12px;
    padding-top: 24px;
    border-top: 1px solid var(--card-border);
}

/* First section needs no divider above it. */
.tv-dashboard > .tv-section-label:first-child[b-k4enbei0uv] {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

/* Standalone (stacked) cards — keep them apart. Cards inside .tv-row2/.tv-row3
   are spaced by the grid gap, so this only targets direct children. */
.tv-dashboard > .tv-card + .tv-card[b-k4enbei0uv] {
    margin-top: 14px;
}

.tv-empty[b-k4enbei0uv] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    padding: 32px;
    text-align: center;
    color: var(--muted);
    font-size: 13px;
}

/* ---------- Card shell ---------- */
.tv-card[b-k4enbei0uv] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    padding: 20px 22px;
    box-shadow: var(--shadow-sm);
}

.tv-card-title[b-k4enbei0uv] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--label);
    margin-bottom: 14px;
}

/* ---------- Grids ---------- */
.tv-kpi-grid[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
}

.tv-row2[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}

.tv-row4[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 14px;
}

/* ---------- KPI ---------- */
.tv-kpi[b-k4enbei0uv] {
    background: #fff;
    border: 1px solid var(--card-border);
    border-top: 3px solid var(--brand);
    border-radius: var(--radius-lg);
    padding: 14px 16px 16px;
    box-shadow: var(--shadow-sm);
}

.tv-kpi-label[b-k4enbei0uv] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--label);
    margin-bottom: 8px;
}

.tv-kpi-value[b-k4enbei0uv] {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.01em;
}

.tv-kpi-sub[b-k4enbei0uv] {
    font-size: 11px;
    color: var(--muted);
    margin-top: 6px;
}

/* ---------- Donut + legend ---------- */
.tv-pipeline-body[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: 22px;
}

.tv-donut[b-k4enbei0uv] {
    position: relative;
    width: 144px;
    height: 144px;
    flex-shrink: 0;
}

.tv-donut-sm[b-k4enbei0uv] {
    width: 128px;
    height: 128px;
}

.tv-donut canvas[b-k4enbei0uv] {
    position: relative;
    z-index: 2;
}

.tv-donut-center[b-k4enbei0uv] {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.tv-donut-total[b-k4enbei0uv] {
    font-size: 22px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.01em;
}

.tv-donut-total-sm[b-k4enbei0uv] {
    font-size: 18px;
}

.tv-donut-lab[b-k4enbei0uv] {
    font-size: 10px;
    color: var(--placeholder);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 700;
    margin-top: 2px;
}

.tv-legend-col[b-k4enbei0uv] {
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1;
    min-width: 0;
}

.tv-pl-top[b-k4enbei0uv],
.tv-fb-top[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.tv-pl-name[b-k4enbei0uv],
.tv-fb-name[b-k4enbei0uv] {
    font-size: 12px;
    font-weight: 600;
    color: var(--label);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.tv-fb-name[b-k4enbei0uv] {
    margin-right: auto;
}

.tv-pl-val[b-k4enbei0uv],
.tv-fb-val[b-k4enbei0uv] {
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
}

.tv-pl-pct[b-k4enbei0uv] {
    font-size: 10px;
    color: var(--placeholder);
    font-weight: 600;
    margin-top: 3px;
    display: block;
}

.tv-dot[b-k4enbei0uv] {
    width: 8px;
    height: 8px;
    border-radius: var(--radius-full);
    display: inline-block;
    flex-shrink: 0;
}

.tv-sq[b-k4enbei0uv] {
    width: 9px;
    height: 9px;
    border-radius: 2px;
    display: inline-block;
    flex-shrink: 0;
}

.tv-bar[b-k4enbei0uv] {
    height: 6px;
    border-radius: 3px;
    background: var(--border);
    overflow: hidden;
    margin-top: 6px;
}

.tv-bar-fill[b-k4enbei0uv] {
    height: 100%;
    border-radius: 3px;
}

.tv-stat-mini[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 6px 0;
    font-size: 12px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}

.tv-sl[b-k4enbei0uv] {
    color: var(--muted);
}

.tv-sv[b-k4enbei0uv] {
    font-weight: 700;
    color: var(--ink);
    text-align: right;
}

.tv-fb-note[b-k4enbei0uv] {
    font-size: 11px;
    color: var(--muted);
    padding-top: 8px;
    border-top: 1px solid var(--border);
    font-weight: 500;
}

/* ---------- Funnel + health ---------- */
.tv-funnel[b-k4enbei0uv] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
}

.tv-funnel-row[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.tv-funnel-label[b-k4enbei0uv] {
    width: 96px;
    font-size: 12px;
    font-weight: 600;
    color: var(--label);
    text-align: right;
    flex-shrink: 0;
}

.tv-funnel-track[b-k4enbei0uv] {
    flex: 1;
    height: 34px;
    background: var(--border);
    border-radius: 6px;
    overflow: hidden;
}

.tv-funnel-fill[b-k4enbei0uv] {
    height: 100%;
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding-left: 12px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
}

.tv-funnel-count[b-k4enbei0uv] {
    width: 54px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
    text-align: right;
    flex-shrink: 0;
}

.tv-funnel-pct[b-k4enbei0uv] {
    width: 44px;
    font-size: 11px;
    color: var(--placeholder);
    text-align: right;
    flex-shrink: 0;
    font-weight: 600;
}

.tv-funnel-arrow[b-k4enbei0uv] {
    font-size: 10px;
    color: var(--placeholder);
    margin-left: 104px;
    line-height: 1;
}

.tv-health[b-k4enbei0uv] {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 16px;
}

.tv-health-grade[b-k4enbei0uv] {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    flex-shrink: 0;
}

.tv-health-text[b-k4enbei0uv] {
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.5;
}

.tv-health-text strong[b-k4enbei0uv] {
    color: var(--ink);
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 2px;
}

/* ---------- Chart helpers ---------- */
.tv-chart-box[b-k4enbei0uv] {
    position: relative;
    width: 100%;
}

.tv-chart-legend[b-k4enbei0uv],
.tv-tl-legend[b-k4enbei0uv] {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 12px;
    font-size: 11px;
    color: var(--muted);
    font-weight: 600;
}

.tv-chart-legend span[b-k4enbei0uv],
.tv-tl-legend span[b-k4enbei0uv] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.tv-tl-legend[b-k4enbei0uv] {
    margin-left: 108px;
    color: var(--placeholder);
}

/* ---------- Stacked timeline ---------- */
.tv-tl-row[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    margin-bottom: 14px;
}

.tv-tl-label[b-k4enbei0uv] {
    width: 96px;
    color: var(--label);
    flex-shrink: 0;
    font-weight: 600;
    text-align: right;
}

.tv-tl-bars[b-k4enbei0uv] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.tv-tl-bar[b-k4enbei0uv] {
    height: 16px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    padding: 0 7px;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    min-width: 56px;
}

.tv-note[b-k4enbei0uv] {
    font-size: 11px;
    color: var(--placeholder);
    font-style: italic;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

/* ---------- Engagement side / tiles ---------- */
.tv-eng-side[b-k4enbei0uv] {
    border-left: 3px solid var(--brand);
    padding-left: 16px;
}

.tv-eng-title[b-k4enbei0uv] {
    font-size: 12px;
    font-weight: 700;
    color: var(--brand-strong);
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.tv-erow[b-k4enbei0uv] {
    display: flex;
    justify-content: space-between;
    padding: 7px 0;
    border-bottom: 1px solid var(--border);
    font-size: 12.5px;
}

.tv-erow:last-child[b-k4enbei0uv] {
    border-bottom: none;
}

.tv-erow span:first-child[b-k4enbei0uv] {
    color: var(--muted);
}

.tv-erow span:last-child[b-k4enbei0uv] {
    font-weight: 700;
    color: var(--ink);
}

.tv-eng-tiles[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}

.tv-eng-tile[b-k4enbei0uv] {
    padding: 10px 12px;
    border-radius: var(--radius-lg);
}

.tv-eng-tile-pos[b-k4enbei0uv] {
    background: #E8F6EC;
    border: 1px solid #BCE4C8;
}

.tv-eng-tile-neu[b-k4enbei0uv] {
    background: var(--pill-bg);
    border: 1px solid var(--border-strong);
}

.tv-eng-tile-k[b-k4enbei0uv] {
    font-size: 9.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 4px;
    color: var(--muted);
}

.tv-eng-tile-pos .tv-eng-tile-k[b-k4enbei0uv] {
    color: var(--success);
}

.tv-eng-tile-v[b-k4enbei0uv] {
    color: var(--ink);
    font-weight: 700;
    font-size: 14px;
}

.tv-eng-tile-s[b-k4enbei0uv] {
    font-size: 10.5px;
    color: var(--label);
    margin-top: 2px;
}

/* ---------- Engagement breakdown cards ---------- */
.tv-ecard-head[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.tv-ecard-icon[b-k4enbei0uv] {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-full);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.tv-ecard-title[b-k4enbei0uv] {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* ---------- Tables ---------- */
.tv-scroll-x[b-k4enbei0uv] {
    overflow-x: auto;
}

.tv-table-scroll[b-k4enbei0uv] {
    max-height: 420px;
    overflow: auto;
}

.tv-table[b-k4enbei0uv] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
    min-width: 600px;
}

.tv-table-wide[b-k4enbei0uv] {
    min-width: 960px;
}

.tv-table th[b-k4enbei0uv] {
    background: var(--bg);
    padding: 8px 12px;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--label);
    border-bottom: 1px solid var(--card-border);
}

.tv-table-scroll .tv-table th[b-k4enbei0uv] {
    position: sticky;
    top: 0;
    z-index: 1;
}

.tv-table td[b-k4enbei0uv] {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}

.tv-table tr:last-child td[b-k4enbei0uv] {
    border-bottom: none;
}

.tv-table tr:hover td[b-k4enbei0uv] {
    background: #FAFCFD;
}

.tv-td-name[b-k4enbei0uv] {
    font-weight: 600;
    color: var(--ink);
}

.tv-td-muted[b-k4enbei0uv] {
    color: var(--label);
}

.tv-td-strong[b-k4enbei0uv] {
    color: var(--ink);
    font-weight: 700;
}

.tv-td-count[b-k4enbei0uv] {
    font-weight: 800;
    color: var(--brand-strong);
    font-size: 14px;
}

/* ---------- Hiring statistics ---------- */
.tv-hiring-grid[b-k4enbei0uv] {
    grid-template-columns: minmax(280px, 0.78fr) minmax(520px, 1.72fr);
}

.tv-hiring-card[b-k4enbei0uv],
.tv-timeline-card[b-k4enbei0uv] {
    padding: var(--space-5, 20px) var(--space-6, 24px);
}

.tv-metric-list[b-k4enbei0uv] {
    display: grid;
    gap: var(--space-2, 8px);
}

.tv-metric-row[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4, 16px);
    min-height: 48px;
    padding: 11px 14px;
    background: var(--neutral-bg, var(--bg));
    border: 1px solid var(--card-border);
    border-radius: var(--radius-md);
}

.tv-metric-row span[b-k4enbei0uv] {
    color: var(--ink);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
}

.tv-metric-row strong[b-k4enbei0uv] {
    flex: 0 0 auto;
    color: var(--brand-strong);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
}

/* ---------- Hiring pipeline timeline ---------- */
.tv-timeline-subtitle[b-k4enbei0uv] {
    margin-top: var(--space-4, 16px);
    padding-top: var(--space-4, 16px);
    border-top: 1px dashed var(--card-border);
}

.tv-pipeline-timeline[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: var(--space-3, 12px);
    min-height: 92px;
    overflow: visible;
    padding: 4px 2px 10px;
}

.tv-pstep[b-k4enbei0uv] {
    flex: 1 1 0;
    min-width: 0;
    border: 1px solid var(--card-border);
    border-top: 3px solid var(--brand);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: #fff;
    box-shadow: var(--shadow-sm);
}

.tv-pstep-head[b-k4enbei0uv] {
    color: var(--label);
    padding: 10px 10px 4px;
    text-align: center;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: .03em;
}

.tv-pstep-body[b-k4enbei0uv] {
    color: var(--brand-strong);
    text-align: center;
    padding: 0 10px 11px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
}

.tv-pstep-arrow[b-k4enbei0uv] {
    width: 24px;
    min-width: 24px;
    height: 1px;
    background: var(--border-strong);
    position: relative;
}

.tv-pstep-arrow[b-k4enbei0uv]::after {
    content: "";
    position: absolute;
    right: -1px;
    top: -4px;
    border-left: 7px solid var(--border-strong);
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
}

/* ---------- Pills ---------- */
.tv-pill[b-k4enbei0uv] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 700;
}

.tv-pill-success[b-k4enbei0uv] {
    background: #E8F6EC;
    color: var(--success);
    border: 1px solid #BCE4C8;
}

.tv-pill-warning[b-k4enbei0uv] {
    background: #FBF1DD;
    color: var(--warning);
    border: 1px solid #F2D89A;
}

.tv-pill-muted[b-k4enbei0uv] {
    background: var(--pill-bg);
    color: var(--label);
    border: 1px solid var(--border-strong);
}

.tv-pill-open[b-k4enbei0uv] {
    background: var(--brand-50);
    color: var(--brand-strong);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .03em;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .tv-row2[b-k4enbei0uv],
    .tv-row4[b-k4enbei0uv] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1200px) and (min-width: 901px) {
    .tv-row4[b-k4enbei0uv] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    .tv-pipeline-body[b-k4enbei0uv] {
        flex-direction: column;
        align-items: stretch;
    }

    .tv-pipeline-timeline[b-k4enbei0uv] {
        flex-wrap: wrap;
    }

    .tv-pstep[b-k4enbei0uv] {
        flex: 1 1 150px;
    }

    .tv-pstep-arrow[b-k4enbei0uv] {
        display: none;
    }
}

/* ==========================================================================
   Statistics tab — per-client engagement breakdown (tv- design system).
   ========================================================================== */
.tv-stats[b-k4enbei0uv] {
    padding-top: 4px;
}

/* ---------- Average across selection (sticky, collapsible) ---------- */
.tv-avg[b-k4enbei0uv] {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #fff;
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    margin-bottom: 8px;
    overflow: hidden;
}

.tv-avg-head[b-k4enbei0uv] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 18px;
    background: var(--bg);
    border: none;
    border-bottom: 1px solid var(--card-border);
    cursor: pointer;
    text-align: left;
    font: inherit;
}

.tv-avg.collapsed .tv-avg-head[b-k4enbei0uv] {
    border-bottom: none;
}

.tv-avg-title[b-k4enbei0uv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
}

.tv-avg-title i[b-k4enbei0uv] {
    color: var(--brand-strong);
    font-size: 15px;
}

.tv-avg-hint[b-k4enbei0uv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: var(--muted);
}

.tv-avg-chev[b-k4enbei0uv] {
    transition: transform .25s ease;
    font-size: 14px;
}

.tv-avg.collapsed .tv-avg-chev[b-k4enbei0uv] {
    transform: rotate(-90deg);
}

.tv-avg-body[b-k4enbei0uv] {
    padding: 18px;
}

.tv-avg-body.collapsed[b-k4enbei0uv] {
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    overflow: hidden;
}

.tv-avg-body .tv-stat-block[b-k4enbei0uv] {
    margin-bottom: 0;
}

/* ---------- Per-client block ---------- */
.tv-stat-block[b-k4enbei0uv] {
    margin-bottom: 22px;
}

.tv-stat-head[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-bottom: 12px;
}

.tv-stat-name[b-k4enbei0uv] {
    font-size: 15px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -.01em;
}

.tv-stat-chips[b-k4enbei0uv] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tv-chip[b-k4enbei0uv] {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 4px 11px;
    background: var(--pill-bg);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-full);
    font-size: 11px;
    line-height: 1.4;
}

.tv-chip-k[b-k4enbei0uv] {
    color: var(--muted);
    font-weight: 600;
}

.tv-chip-v[b-k4enbei0uv] {
    color: var(--ink);
    font-weight: 700;
}

.tv-stat-grid[b-k4enbei0uv] {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

.tv-fb-card[b-k4enbei0uv] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tv-fb-card .tv-card-title[b-k4enbei0uv] {
    margin-bottom: 2px;
}

.tv-eng-card .tv-erow:first-of-type[b-k4enbei0uv] {
    padding-top: 0;
}

@media (max-width: 1100px) {
    .tv-stat-grid[b-k4enbei0uv] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 760px) {
    .tv-stat-grid[b-k4enbei0uv] {
        grid-template-columns: repeat(2, 1fr);
    }

    .tv-stat-head[b-k4enbei0uv] {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 480px) {
    .tv-stat-grid[b-k4enbei0uv] {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Client filter — custom dropdown (scrollable, on-the-fly, click-outside).
   Lives in the page header (outside .tv-dashboard) so it uses literal tokens.
   ========================================================================== */
.tv-clientfilter[b-k4enbei0uv] {
    position: relative;
    display: inline-block;
}

.tv-clientfilter-toggle[b-k4enbei0uv] {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 150px;
    min-width: 150px;
    max-width: 150px;
    padding: 9px 14px;
    background: #fff;
    border: 1px solid var(--talents-border-card, #E2EBF0);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #0D2D3F;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.tv-clientfilter-toggle:hover[b-k4enbei0uv] {
    border-color: #B9D0DC;
}

.tv-clientfilter-toggle.open[b-k4enbei0uv] {
    border-color: #4AC4FF;
    box-shadow: 0 0 0 3px rgba(74, 196, 255, .15);
}

.tv-clientfilter-text[b-k4enbei0uv] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tv-clientfilter-toggle i[b-k4enbei0uv] {
    font-size: 12px;
    color: #7A9BAD;
    transition: transform .2s ease;
    flex-shrink: 0;
}

.tv-clientfilter-toggle.open i[b-k4enbei0uv] {
    transform: rotate(180deg);
}

.tv-clientfilter-backdrop[b-k4enbei0uv] {
    position: fixed;
    inset: 0;
    z-index: 1040;
}

.tv-clientfilter-menu[b-k4enbei0uv] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 1041;
    width: 320px;
    max-width: 92vw;
    background: #fff;
    border: 1px solid var(--talents-border-card, #E2EBF0);
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(13, 45, 63, .16);
    padding: 12px;
}

.tv-clientfilter-search[b-k4enbei0uv] {
    margin-bottom: 10px;
}

.tv-clientfilter-list[b-k4enbei0uv] {
    max-height: 280px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-right: 4px;
}

.tv-clientfilter-item[b-k4enbei0uv] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border-radius: 7px;
    font-size: 13px;
    color: #0D2D3F;
    cursor: pointer;
    margin: 0;
}

.tv-clientfilter-item:hover[b-k4enbei0uv] {
    background: #F2F8FB;
}

.tv-clientfilter-item input[b-k4enbei0uv] {
    width: 15px;
    height: 15px;
    accent-color: #4AC4FF;
    cursor: pointer;
    flex-shrink: 0;
}

.tv-clientfilter-empty[b-k4enbei0uv] {
    padding: 16px;
    text-align: center;
    color: #7A9BAD;
    font-size: 12px;
}
/* /Components/Pages/TalentProviders/JobTalentProviderPage.razor.rz.scp.css */
body[b-uvl7qne59t] {
    font-family: 'Montserrat', sans-serif;
    background-color: #f8f9fa;
    color: #343a40;
    line-height: 1.6;
}

.candidate-container[b-uvl7qne59t] {
    background-color: transparent;
    border-radius: 12px;
    padding: 30px;
    margin: 20px auto;
}

.resume-container[b-uvl7qne59t] {
    background-color: transparent;
    border-radius: 12px;
    padding: 0 30px 30px;
    margin: 20px auto;
}

.header[b-uvl7qne59t] {
    margin-bottom: 25px;
}

.candidate-id[b-uvl7qne59t] {
    color: #4A5460;
    font-weight: 500;
    font-size: 24px;
    margin-bottom: 10px;
}

.status-badge[b-uvl7qne59t] {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
}

.status-review[b-uvl7qne59t] {
    background-color: #EAFAE4;
    color: #5a8f44;
}

.status-interview[b-uvl7qne59t] {
    background-color: #DBF2FF;
    color: #23A8E8;
}

.status-later[b-uvl7qne59t] {
    background-color: #FBE7D9;
    color: #F97316;
}

.status-reject[b-uvl7qne59t] {
    background-color: #FAC7C7;
    color: #E13535;
}

.section-card[b-uvl7qne59t] {
    background-color: rgba(237, 237, 237, 0.24);
    border: 1px solid rgba(215, 215, 215, 1);
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden;
}

.section-title[b-uvl7qne59t] {
    background-color: transparent;
    padding: 18px 25px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-transform: uppercase;
    color: #262626;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    transition: background-color 0.2s ease-in-out, border-color 0.35s ease;
}

.section-title:hover[b-uvl7qne59t] {
    background-color: #e9ecef;
}

.section-title[b-uvl7qne59t]:after {
    content: "";
    border: solid #495057;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 4px;
    transform: rotate(45deg);
    transition: transform 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.section-title.expanded[b-uvl7qne59t] {
    border-bottom-color: #dee2e6;
}

.section-title.expanded[b-uvl7qne59t]:after {
    transform: rotate(-135deg);
}

.section-content[b-uvl7qne59t] {
    padding: 0 24px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    opacity 0.3s ease-in-out,
    padding-top 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    padding-bottom 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.section-content.active[b-uvl7qne59t] {
    padding: 15px 24px 15px 24px;
    max-height: 2000px;
    opacity: 1;
}

.summary-section-content[b-uvl7qne59t] {
    background-color: rgba(237, 237, 237, 0.24);
    padding: 0 24px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    opacity 0.3s ease-in-out,
    padding-top 0.35s cubic-bezier(0.645, 0.045, 0.355, 1),
    padding-bottom 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.summary-section-content.active[b-uvl7qne59t] {
    padding: 24px;
    max-height: 2000px;
    opacity: 1;
}

.responsibilities[b-uvl7qne59t] {
    padding-left: 20px;
    margin-top: 10px;
}

.responsibilities li[b-uvl7qne59t] {
    margin-bottom: 8px;
}

ul.responsibilities[style*="column-count"][b-uvl7qne59t] {
    padding-left: 20px;
}

.experience-item[b-uvl7qne59t] {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e9ecef;
}

.experience-item:last-child[b-uvl7qne59t] {
    border-bottom: none;
    margin-bottom: 0;
}

.job-header[b-uvl7qne59t] {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

.job-position[b-uvl7qne59t] {
    font-weight: bold;
    margin-right: 5px;
}

.edu-header[b-uvl7qne59t] {
    color: #262626;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
}

.edu-info[b-uvl7qne59t] {
    color: #2D3648;
    font-size: 16px;
    font-weight: 400;
}

.company[b-uvl7qne59t] {
    color: #495057;
}

.date[b-uvl7qne59t] {
    color: #797979;
    font-size: 16px;
    font-weight: 400;
}

.project-name[b-uvl7qne59t] {
    margin-top: 10px;
}

.tech-stack[b-uvl7qne59t] {
    margin: 10px 0;
    color: #343a40;
}

.section-text[b-uvl7qne59t] {
    color: #262626;
    font-size: 16px;
    font-weight: 400;
}

.section-summary[b-uvl7qne59t] {
    color: #262626;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
    padding: 10px 0;
    text-transform: uppercase;
}


.top-nav-bar[b-uvl7qne59t] {
    position: sticky !important;
    height: 82px;
    z-index: 1000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #ffffff;
    border-bottom: 1px solid #e0e0e0;
    width: 100%;
    box-sizing: border-box;
}

.expired-logo-container[b-uvl7qne59t] {
    height: 115px;
    width: 121px;
    margin-bottom: 2.5rem;
}

.logo-container-nav[b-uvl7qne59t] {
    margin-left: 30px;
    display: flex;
    align-items: center;
    padding: 0;
}

.nav-logo-opinov8[b-uvl7qne59t],
.nav-logo-client[b-uvl7qne59t] {
    height: 35px;
    width: auto;
}

.logo-separator[b-uvl7qne59t] {
    display: block;
    width: 1px;
    height: 28px;
    background-color: #ccc;
    margin: 0 15px;
}

.nav-actions[b-uvl7qne59t] {
    display: flex;
    align-items: center;
    gap: 24px;
}

.nav-action-button[b-uvl7qne59t] {
    height: 48px;
    margin-left: 10px;
    border-radius: 20px;
    padding: 8px 15px;
    font-size: 16px;
}

.btn-pass[b-uvl7qne59t] {
    color: #E13535;
    font-weight: 700;
}

.btn-later[b-uvl7qne59t] {
    background-color: #FFFFFF;
    color: #4AC4FF !important;
    font-weight: 700;
    line-height: 1;
    border: 2px solid #4AC4FF;
    border-radius: 30px;
    padding: 8px 24px;
    display: inline-block;
    text-align: center;
    box-shadow: none;
    outline: none;
}

.btn-later:hover[b-uvl7qne59t] {
    background-color: rgba(74, 196, 255, 0.1);
}

.btn-interview[b-uvl7qne59t] {
    background-color: #4AC4FF;
    color: #FFFFFF !important;
    font-weight: 700;
    line-height: 1;
    border: none;
    border-radius: 30px;
    padding: 8px 24px;
    display: inline-block;
    text-align: center;
    box-shadow: none;
    outline: none;
}

.btn-interview:hover[b-uvl7qne59t] {
    background-color: #3AB0E6;
}

.modal-footer .btn[b-uvl7qne59t] {
    border-radius: 30px;
    padding: 8px 24px;
    font-weight: 700;
    font-size: 14px;
}

.modal-footer .btn-outline-secondary[b-uvl7qne59t] {
    color: #4AC4FF !important;
    background-color: transparent !important;
    border: 2px solid #4AC4FF !important;
}
.modal-footer .btn-outline-secondary:hover[b-uvl7qne59t] {
    background-color: rgba(74, 196, 255, 0.1) !important;
}

.modal-footer .btn-primary[b-uvl7qne59t] {
    color: #FFFFFF !important;
    background-color: #4AC4FF !important;
    border: none !important;
}
.modal-footer .btn-primary:hover[b-uvl7qne59t] {
    background-color: #3AB0E6 !important;
}

.btn-add-date-time[b-uvl7qne59t] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    font-weight: 700;
    font-size: 14px;
    color: #4A5460;
    cursor: pointer;
    outline: none;
}

.btn-add-date-time:hover[b-uvl7qne59t],
.btn-add-date-time:focus[b-uvl7qne59t],
.btn-add-date-time:active[b-uvl7qne59t] {
    text-decoration: none;
    background: none;
    border: none;
    outline: none;
}

.b6[b-uvl7qne59t] {
    font-size: 16px;
    font-weight: 700;
    color: #262626;
}

.b5[b-uvl7qne59t] {
    font-size: 16px;
    font-weight: 600;
    color: #4A5460;
}

.b4[b-uvl7qne59t] {
    font-size: 16px;
    font-weight: 400;
    color: #4A5460;
}

.b2[b-uvl7qne59t] {
    font-size: 14px;
    font-weight: 500;
    color: #262626;
}

.b1[b-uvl7qne59t] {
    font-size: 14px;
    font-weight: 400;
    color: #4A5460
}

.h5[b-uvl7qne59t] {
    font-size: 24px;
    font-weight: 800;
    color: #262626;
}

.custom-radio[b-uvl7qne59t] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.form-check-label[b-uvl7qne59t] {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    user-select: none;
}

.custom-radio:checked ~ .form-check-label[b-uvl7qne59t]::before {
    border-color: #2196F3;
}

.custom-radio:not(:checked):hover ~ .form-check-label[b-uvl7qne59t]::before {
    border-color: #aaa;
}

.form-check-label[b-uvl7qne59t]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 20px;
    width: 20px;
    background-color: white;
    border: 2px solid #ccc;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.form-check-label[b-uvl7qne59t]::after {
    content: "";
    position: absolute;
    display: none;
    top: 50%;
    left: 10px;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #2196F3;
    transition: all 0.2s ease;
}

.custom-radio:checked ~ .form-check-label[b-uvl7qne59t]::after {
    display: block;
}

.form-check[b-uvl7qne59t] {
    position: relative;
    display: inline-flex;
    align-items: flex-start;
    padding-left: 0 !important;
}

.custom-radio:focus ~ .form-check-label[b-uvl7qne59t]::before {
    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.25);
}

.custom-height[b-uvl7qne59t] {
    height: 40px !important;
    line-height: 40px;
    padding-top: 0;
    padding-bottom: 0;
}

.custom-rating-gap .mud-ripple[b-uvl7qne59t] {
    margin-left: 15px !important;
}

.custom-rating-gap .mud-svg-icon path:not([fill="none"])[b-uvl7qne59t] {
    fill: #4AC4FF !important;
}

.custom-rating-gap .mud-svg-icon[b-uvl7qne59t] {
    height: 30px !important;
    width: 30px !important;
}

.nav-action-button[disabled][b-uvl7qne59t] {
    border-color: #D7D7D7 !important;
    color: #868686 !important;
    cursor: not-allowed;
    background-color: transparent;
}

.btn-interview[disabled][b-uvl7qne59t] {
    background-color: #D7D7D7 !important;
    border-color: #D7D7D7 !important;
    color: #868686 !important;
}

/* New Css */
.form-container[b-uvl7qne59t] {
    padding: 1.5rem;
    border: 2px dashed blue !important;
    background: rgba(0,0,255,0.05) !important;
    border-radius: 0.25rem;
}

.upload-area[b-uvl7qne59t] {
    position: relative;
    border: 2px dashed #ccc;
    border-radius: 8px;
    padding: 40px;
    text-align: center;
    cursor: pointer;
    transition: border-color .3s;
}

.upload-area.dragover[b-uvl7qne59t] { 
    border-color: #0d6efd; 
}

.upload-area .file-input[b-uvl7qne59t] {
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.upload-text[b-uvl7qne59t] { margin-top: .5rem; z-index: 1; }

.upload-icon[b-uvl7qne59t] {
    z-index: 1;
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.skill-group[b-uvl7qne59t] {
    margin-bottom: 1.5rem;
}
.skill-header[b-uvl7qne59t] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.5rem;
}
.skill-questions span[b-uvl7qne59t] {
    display: block;
    font-size: 0.85rem;
    color: #666;
}
.slider-container[b-uvl7qne59t] {
    display: flex;
    align-items: center;
}
.form-range[b-uvl7qne59t] {
    flex: 1;
}
h1[b-uvl7qne59t] {
    font-size: 1.75rem;
    margin-bottom: 1rem;
}
h2[b-uvl7qne59t] {
    font-size: 1.25rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: 500;
}

.provider-section-name[b-uvl7qne59t] {
    font-size: 18px;
    font-weight: 700;
    color: rgba(150, 150, 150, 1);
    text-transform: uppercase;
}

.form-select option[disabled][b-uvl7qne59t] {
    display: none;
}

.form-select[b-uvl7qne59t] {
    height: 3rem !important;
}

.btn-primary:disabled[b-uvl7qne59t] {
    background-color: #D7D7D7 !important;
    border-color: #D7D7D7 !important;
    color: #868686 !important;
    opacity: 1 !important;
}
/* /Components/Pages/TalentProviders/TalentProviderDetails/JobTalentProviderDetailsPage.razor.rz.scp.css */
.submission-card[b-m6c2gw22qi] {
    border: none;
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    overflow: hidden;
}

.submission-card-header[b-m6c2gw22qi] {
    width: 200px;
    min-width: 200px;
    background-color: #f8f9fa;
    border-right: 1px solid #e9ecef;
    padding: 1.5rem 1rem;
}

.submission-card-body[b-m6c2gw22qi] {
    padding: 1.5rem;
}

.submission-card-footer[b-m6c2gw22qi] {
    background-color: transparent;
    border-top: none;
    padding: 0.75rem 1.5rem;
}

.skill-badge.primary[b-m6c2gw22qi],
.skill-badge.secondary[b-m6c2gw22qi] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-radius: 0.5rem;
    padding: 0.25rem 0.75rem;
}

.skill-badge.primary strong[b-m6c2gw22qi] { color: black; font-weight: 545; }
.skill-badge.secondary strong[b-m6c2gw22qi] { color: black; font-weight: 545; }

.skill-badge.primary[b-m6c2gw22qi] {
    background-color: rgba(54, 162, 235, 0.6);
    border : 1px solid rgba(54, 162, 235, 1);
}

.skill-badge.secondary[b-m6c2gw22qi] {
    background-color: rgba(75, 192, 192, 0.6);
    border : 1px solid rgba(75, 192, 192, 1);
}

.skill-badge small[b-m6c2gw22qi] {
    font-size: 1.0rem;
    color: #ffffff;
}
/* /Components/Pages/User/RolesPermissions.razor.rz.scp.css */
/* Roles & Permissions Page Styles */

.roles-permissions-container[b-fcpsyzpi7b] {
    background-color: #f8fafc;
    min-height: 100vh;
    padding: 32px;
}

.role-card[b-fcpsyzpi7b] {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0px 1px 3px 0px rgba(15, 23, 42, 0.06);
}

.statistics-card[b-fcpsyzpi7b] {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0px 1px 3px 0px rgba(15, 23, 42, 0.06);
    background-color: white;
}

.role-type-chip-system[b-fcpsyzpi7b] {
    background-color: #dbeafe;
    color: #1e4e8c;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 0.66px;
    border-radius: 999px;
    padding: 6px 16px;
}

.role-type-chip-custom[b-fcpsyzpi7b] {
    background-color: #e9d5ff;
    color: #7c3aed;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 0.66px;
    border-radius: 999px;
    padding: 6px 16px;
}

.permission-group-header[b-fcpsyzpi7b] {
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 10px 16px;
}

.permission-item[b-fcpsyzpi7b] {
    padding: 8px 10px;
    border-radius: 8px;
}

.permission-checkbox[b-fcpsyzpi7b] {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.permission-checkbox-selected[b-fcpsyzpi7b] {
    background-color: #10b981;
}

.permission-checkbox-unselected[b-fcpsyzpi7b] {
    background-color: #e5e7eb;
}

.permission-code[b-fcpsyzpi7b] {
    background-color: #f1f5f9;
    color: #64748b;
    border-radius: 4px;
    padding: 2px 8px;
    font-size: 12px;
    font-family: monospace;
}

.user-avatar[b-fcpsyzpi7b] {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 14px;
}

.history-item[b-fcpsyzpi7b] {
    position: relative;
    padding-left: 8px;
}

.history-icon[b-fcpsyzpi7b] {
    position: absolute;
    left: -22px;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background-color: #dbeafe;
    border: 2px solid white;
    box-shadow: 0px 0px 0px 1px #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.history-content[b-fcpsyzpi7b] {
    background-color: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 13px 15px;
}

/* Search and Filter Section */
.filters-section[b-fcpsyzpi7b] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
    width: 100%;
    flex-wrap: wrap;
}

.search-wrapper[b-fcpsyzpi7b] {
    flex: 1;
    min-width: 280px;
    max-width: 100%;
}

.filter-dropdowns[b-fcpsyzpi7b] {
    display: flex;
    gap: 16px;
    flex: 0 0 auto;
    min-width: 0;
}

.filter-dropdowns .filter-select[b-fcpsyzpi7b] {
    min-width: 250px;
    max-width: 350px;
    flex: 1 1 auto;
}

[b-fcpsyzpi7b] .filter-select .mud-input-root {
    border-radius: 8px;
    font-size: 14px;
}

[b-fcpsyzpi7b] .filter-select .mud-input-control {
    min-height: 40px;
}

[b-fcpsyzpi7b] .filter-select .mud-input-label {
    font-size: 14px;
    color: #64748b;
}

[b-fcpsyzpi7b] .filter-select .mud-input-outlined {
    border-color: #e2e8f0;
}

[b-fcpsyzpi7b] .filter-select .mud-input-outlined:hover {
    border-color: #cbd5e1;
}

[b-fcpsyzpi7b] .filter-select .mud-input-outlined.mud-input-outlined-focused {
    border-color: #3b82f6;
    border-width: 2px;
}

.search-field .mud-input-root[b-fcpsyzpi7b] {
    border-radius: 8px;
}

/* Responsive adjustments */
@media (max-width: 960px) {
    .filters-section[b-fcpsyzpi7b] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-wrapper[b-fcpsyzpi7b] {
        width: 100%;
        max-width: 100%;
    }

    .filter-dropdowns[b-fcpsyzpi7b] {
        width: 100%;
        flex-direction: row;
        gap: 12px;
    }

    .filter-dropdowns .filter-select[b-fcpsyzpi7b] {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .filter-dropdowns[b-fcpsyzpi7b] {
        flex-direction: column;
        gap: 12px;
    }

    .filter-dropdowns .filter-select[b-fcpsyzpi7b] {
        width: 100%;
        max-width: 100%;
        flex: 1 1 100%;
    }
}
/* /Components/Pages/User/UsersPage.razor.rz.scp.css */
/* Container and spacing adjustments */
.users-page[b-1kn7gpeswg] {
    background-color: #f8fafc;
    min-height: 100vh;
    padding: 32px;
}

/* Statistics Cards */
.stat-card[b-1kn7gpeswg] {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.05);
}

.stat-card .mud-avatar[b-1kn7gpeswg] {
    width: 32px;
    height: 32px;
}

.stat-card .stat-icon-wrapper[b-1kn7gpeswg] {
    margin-bottom: 8px;
}

.stat-card .stat-value[b-1kn7gpeswg] {
    font-size: 28px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1;
    margin-bottom: 8px;
}

.stat-card .stat-label[b-1kn7gpeswg] {
    font-size: 14px;
    color: #64748b;
    margin-bottom: 4px;
}

.stat-card .stat-sublabel[b-1kn7gpeswg] {
    font-size: 12px;
    color: #64748b;
}

/* Search and Filter Section */
.filters-section[b-1kn7gpeswg] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
    width: 100%;
    flex-wrap: wrap;
}

.search-wrapper[b-1kn7gpeswg] {
    flex: 1;
    min-width: 280px;
    max-width: 100%;
}

.filter-dropdowns[b-1kn7gpeswg] {
    display: flex;
    gap: 16px;
    flex: 0 0 auto;
    min-width: 0;
}

.filter-dropdowns .filter-select[b-1kn7gpeswg] {
    min-width: 250px;
    max-width: 350px;
    flex: 1 1 auto;
}

[b-1kn7gpeswg] .filter-select .mud-input-root {
    border-radius: 8px;
    font-size: 14px;
}

[b-1kn7gpeswg] .filter-select .mud-input-control {
    min-height: 40px;
}

[b-1kn7gpeswg] .filter-select .mud-input-label {
    font-size: 14px;
    color: #64748b;
}

[b-1kn7gpeswg] .filter-select .mud-input-outlined {
    border-color: #e2e8f0;
}

[b-1kn7gpeswg] .filter-select .mud-input-outlined:hover {
    border-color: #cbd5e1;
}

[b-1kn7gpeswg] .filter-select .mud-input-outlined.mud-input-outlined-focused {
    border-color: #3b82f6;
    border-width: 2px;
}

.search-field .mud-input-root[b-1kn7gpeswg] {
    border-radius: 8px;
}

/* Responsive adjustments */
@media (max-width: 960px) {
    .filters-section[b-1kn7gpeswg] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-wrapper[b-1kn7gpeswg] {
        width: 100%;
        max-width: 100%;
    }

    .filter-dropdowns[b-1kn7gpeswg] {
        width: 100%;
        flex-direction: row;
        gap: 12px;
    }

    .filter-dropdowns .filter-select[b-1kn7gpeswg] {
        flex: 1 1 calc(50% - 6px);
        min-width: 0;
        max-width: 100%;
    }
}

@media (max-width: 600px) {
    .users-page[b-1kn7gpeswg] {
        padding: 16px;
    }

    .page-title[b-1kn7gpeswg] {
        font-size: 24px;
    }

    .stat-card .stat-value[b-1kn7gpeswg] {
        font-size: 24px;
    }

    .filter-dropdowns[b-1kn7gpeswg] {
        flex-direction: column;
        gap: 12px;
    }

    .filter-dropdowns .filter-select[b-1kn7gpeswg] {
        width: 100%;
        max-width: 100%;
        flex: 1 1 100%;
    }
}

.selection-bar[b-1kn7gpeswg] {
    background-color: #3b82f6; /* A more vibrant blue from the screenshot */
    border-radius: 8px;
    color: white;
}

.selection-action-btn[b-1kn7gpeswg] {
    background-color: white !important;
    color: white !important;
    text-transform: none !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    padding: 6px 16px !important;
}

.selection-action-btn .mud-button-icon-start[b-1kn7gpeswg] {
    color: #475569 !important; /* Darker icon as in screenshot */
}

.clear-selection-link[b-1kn7gpeswg] {
    color: white !important;
    text-decoration: none !important;
    font-size: 14px;
}

.clear-selection-link:hover[b-1kn7gpeswg] {
    text-decoration: underline !important;
}

/* Table Styling */
.users-table[b-1kn7gpeswg] {
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px 0 rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.users-table .mud-table-head[b-1kn7gpeswg] {
    background-color: #f8fafc;
}

.users-table .mud-table-head th[b-1kn7gpeswg] {
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 0.52px;
    font-weight: 700;
    color: #64748b;
    border-bottom: 1px solid #e2e8f0;
}

.users-table .mud-table-row[b-1kn7gpeswg] {
    border-bottom: 1px solid #e2e8f0;
}

.users-table .mud-table-row.selected[b-1kn7gpeswg] {
    background-color: #eff6ff;
}

.users-table .mud-table-row.needs-attention[b-1kn7gpeswg] {
    border-left: 3px solid #f59e0b;
}

.users-table .mud-table-cell[b-1kn7gpeswg] {
    padding: 13.5px 16px;
}

/* Avatar Styling */
.user-avatar[b-1kn7gpeswg] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    color: white;
}

/* User Info */
.user-info[b-1kn7gpeswg] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.user-name[b-1kn7gpeswg] {
    font-weight: 700;
    font-size: 15px;
    color: #1e293b;
    text-decoration: none;
}

.user-name:hover[b-1kn7gpeswg] {
    text-decoration: underline;
}

.user-email[b-1kn7gpeswg] {
    font-size: 13px;
    color: #64748b;
}

/* Role Chip */
.role-chip[b-1kn7gpeswg] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 13px;
    margin-bottom: 4px;
}

.role-chip.hr-manager[b-1kn7gpeswg] {
    background-color: #e9d5ff;
    color: #7c3aed;
}

.role-chip.super-admin[b-1kn7gpeswg] {
    background-color: #dbeafe;
    color: #1e4e8c;
}

.role-chip.recruiter[b-1kn7gpeswg] {
    background-color: #e9d5ff;
    color: #7c3aed;
}

.role-chip.no-role[b-1kn7gpeswg] {
    background-color: #fef3c7;
    color: #92400e;
}

.role-permissions[b-1kn7gpeswg] {
    font-size: 12px;
    color: #64748b;
}

.role-permissions.warning[b-1kn7gpeswg] {
    color: #b45309;
}

/* Status Chip */
.status-chip[b-1kn7gpeswg] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 13px;
}

.status-chip.active[b-1kn7gpeswg] {
    background-color: #d1fae5;
    color: #059669;
}

.status-chip.inactive[b-1kn7gpeswg] {
    background-color: #f1f5f9;
    color: #64748b;
}

/* Action Buttons */
.action-buttons[b-1kn7gpeswg] {
    display: flex;
    gap: 8px;
}

.action-button[b-1kn7gpeswg] {
    border-radius: 8px;
    text-transform: none;
    font-size: 13px;
}

.action-button.assign-role[b-1kn7gpeswg] {
    background-color: #2e75b6;
    color: white;
}

.action-button.change-role[b-1kn7gpeswg] {
    background-color: white;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.more-button[b-1kn7gpeswg] {
    color: #94a3b8;
    border-radius: 8px;
}

/* Pagination */
.pagination-wrapper[b-1kn7gpeswg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background-color: white;
}

.pagination-info[b-1kn7gpeswg] {
    font-size: 13px;
    color: #64748b;
}

.pagination-controls[b-1kn7gpeswg] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.page-size-select[b-1kn7gpeswg] {
    min-width: 119px;
    border-radius: 8px;
}

.pagination-button[b-1kn7gpeswg] {
    min-width: 32px;
    height: 32px;
    border-radius: 8px;
}

.pagination-button.active[b-1kn7gpeswg] {
    background-color: #2e75b6;
    color: white;
}

.pagination-button.inactive[b-1kn7gpeswg] {
    background-color: white;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.pagination-button.disabled[b-1kn7gpeswg] {
    border-color: #e2e8f0;
    color: #cbd5e1;
}

/* Breadcrumb Styling */
.breadcrumb-container[b-1kn7gpeswg] {
    margin-bottom: 24px;
    padding: 0;
}

.breadcrumb-container .mud-breadcrumb-item[b-1kn7gpeswg] {
    font-size: 14px;
}

.breadcrumb-container .mud-breadcrumb-separator[b-1kn7gpeswg] {
    font-size: 14px;
    color: #64748b;
}

/* Header Section */
.page-header[b-1kn7gpeswg] {
    margin-bottom: 24px;
}

.page-title[b-1kn7gpeswg] {
    font-size: 32px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 8px;
}

.page-description[b-1kn7gpeswg] {
    font-size: 16px;
    color: #64748b;
    max-width: 720px;
    line-height: 24px;
}

.add-user-button[b-1kn7gpeswg] {
    text-transform: none;
    border-radius: 8px;
    height: 40px;
    padding: 0 20px;
}
/* /Components/Pages/Welcome.razor.rz.scp.css */
/* Welcome page — uses Talents Design System tokens.
   Ink #0D2D3F, brand-400 #4AC4FF, Inter font.
   Brand mark: ink rounded square with cyan "T", paired with the
   "Talents." wordmark whose period is the brand color. */

.welcome-page-root[b-hdnhfka0qr] {
    --brand-50: #E8F8FF;
    --brand-400: #4AC4FF;
    --ink: #0D2D3F;
    --neutral-bg: #F8FBFD;
    --neutral-muted: #7A9BAD;
    --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    min-height: calc(100vh - 64px);
    background:
        radial-gradient(circle at 18% 12%, rgba(74, 196, 255, 0.10) 0%, transparent 45%),
        radial-gradient(circle at 88% 88%, rgba(74, 196, 255, 0.06) 0%, transparent 50%),
        var(--neutral-bg);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    font-family: var(--font-sans);
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
}

.welcome-content[b-hdnhfka0qr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    animation: welcomeFadeIn-b-hdnhfka0qr 0.6s cubic-bezier(.2, .7, .2, 1);
}

@keyframes welcomeFadeIn-b-hdnhfka0qr {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.welcome-brand[b-hdnhfka0qr] {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 18px;
}

.welcome-mark[b-hdnhfka0qr] {
    width: 88px;
    height: 88px;
    border-radius: 22px;
    background: var(--ink);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-sans);
    font-weight: 800;
    font-size: 40px;
    letter-spacing: -.03em;
    line-height: 1;
    user-select: none;
    box-shadow: 0 8px 32px rgba(13, 45, 63, 0.12);
}

.welcome-mark__dot[b-hdnhfka0qr] {
    color: var(--brand-400);
    margin-left: 1px;
}

.welcome-wordmark[b-hdnhfka0qr] {
    font-family: var(--font-sans);
    font-size: 56px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.02em;
    line-height: 1;
}

.welcome-dot[b-hdnhfka0qr] {
    color: var(--brand-400);
}

.welcome-tagline[b-hdnhfka0qr] {
    margin: 0;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 400;
    color: var(--neutral-muted);
    max-width: 38ch;
}

@media (max-width: 640px) {
    .welcome-brand[b-hdnhfka0qr] {
        gap: 14px;
        margin-bottom: 14px;
    }

    .welcome-mark[b-hdnhfka0qr] {
        width: 64px;
        height: 64px;
        border-radius: 16px;
        font-size: 28px;
    }

    .welcome-wordmark[b-hdnhfka0qr] {
        font-size: 38px;
    }

    .welcome-tagline[b-hdnhfka0qr] {
        font-size: 16px;
    }
}

@media (max-width: 420px) {
    .welcome-brand[b-hdnhfka0qr] {
        flex-direction: column;
        gap: 12px;
    }

    .welcome-mark[b-hdnhfka0qr] {
        width: 60px;
        height: 60px;
        border-radius: 14px;
        font-size: 26px;
    }

    .welcome-wordmark[b-hdnhfka0qr] {
        font-size: 34px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .welcome-content[b-hdnhfka0qr] {
        animation: none;
    }
}
/* /Components/Shared/ClientFeedbackRatingPill.razor.rz.scp.css */
.cfrp-pill[b-sy5hkflfsp] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: var(--radius-full, 999px);
    font-size: var(--fs-caption, 12px);
    font-weight: var(--fw-semibold, 600);
    color: var(--cfrp-color);
    background: color-mix(in srgb, var(--cfrp-color) 16%, white);
    white-space: nowrap;
}

.cfrp-value[b-sy5hkflfsp] {
    font-weight: var(--fw-medium, 500);
    opacity: 0.8;
}

.cfrp-empty[b-sy5hkflfsp] {
    color: var(--talents-muted);
}
/* /Components/Shared/ColumnFilter.razor.rz.scp.css */
.column-filter[b-fre4niukq0] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.column-filter-button[b-fre4niukq0] {
    padding: 2px;
}

.column-filter-panel[b-fre4niukq0] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14), 0 2px 6px rgba(15, 23, 42, 0.08);
    min-width: 260px;
    max-width: 320px;
    max-height: 420px;
    display: flex;
    flex-direction: column;
    cursor: default;
    overflow: hidden;
    font-weight: 400 !important;
}

.column-filter-panel.align-right[b-fre4niukq0] {
    margin-left: auto;
}

.column-filter-header[b-fre4niukq0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 8px 8px 12px;
    border-bottom: 1px solid #f1f5f9;
    background: #fafafa;
}

.column-filter-title[b-fre4niukq0] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #1f2937;
    line-height: 1.2;
}

.column-filter-close[b-fre4niukq0] {
    padding: 2px;
    color: #6b7280;
}

.column-filter-search[b-fre4niukq0] {
    padding: 8px 12px 4px;
}

.column-filter-select-all[b-fre4niukq0] {
    padding: 4px 8px;
    border-bottom: 1px solid #f1f5f9;
}

.column-filter-list[b-fre4niukq0] {
    flex: 1 1 auto;
    overflow-y: auto;
    max-height: 240px;
    padding: 4px 8px 8px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

.column-filter-list[b-fre4niukq0]::-webkit-scrollbar {
    width: 6px;
}

.column-filter-list[b-fre4niukq0]::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 3px;
}

.column-filter-row[b-fre4niukq0] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 4px;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.12s ease;
}

.column-filter-row:hover[b-fre4niukq0] {
    background-color: #f3f4f6;
}


.column-filter-label[b-fre4niukq0] {
    font-size: 0.875rem;
    color: #1f2937;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.4;
}

.column-filter-empty[b-fre4niukq0] {
    padding: 16px;
    text-align: center;
    color: #9ca3af;
    font-size: 0.85rem;
}
/* /Components/Shared/MarkdownEditor.razor.rz.scp.css */
.markdown-editor[b-1ubazdox52] {
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.23);
    border-radius: 0.5rem;
    background: #fff;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.markdown-editor:focus-within[b-1ubazdox52] {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
}

.markdown-toolbar[b-1ubazdox52] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-height: 46px;
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    background: #f8fafc;
    overflow-x: auto;
}

.markdown-toolbar-button[b-1ubazdox52] {
    display: inline-flex;
    flex: 0 0 32px;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: #334155;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}

.markdown-toolbar-text-button[b-1ubazdox52] {
    flex-basis: auto;
    width: auto;
    min-width: 58px;
    padding: 0 0.55rem;
    font-size: 0.78rem;
}

.markdown-toolbar-heading-button[b-1ubazdox52] {
    font-size: 0.75rem;
    font-weight: 700;
}

.markdown-toolbar-button:hover:not(:disabled)[b-1ubazdox52] {
    border-color: rgba(0, 0, 0, 0.12);
    background: #e9eef5;
}

.markdown-toolbar-button.active[b-1ubazdox52] {
    border-color: color-mix(in srgb, var(--mud-palette-primary) 45%, transparent);
    background: color-mix(in srgb, var(--mud-palette-primary) 14%, white);
    color: var(--mud-palette-primary);
}

.markdown-toolbar-button:focus-visible[b-1ubazdox52] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 1px;
}

.markdown-toolbar-button:disabled[b-1ubazdox52] {
    cursor: not-allowed;
    opacity: 0.5;
}

.markdown-toolbar-strike[b-1ubazdox52] {
    text-decoration: line-through;
}

.markdown-toolbar-code[b-1ubazdox52] {
    font-family: "JetBrains Mono", monospace;
    font-size: 0.72rem;
}

.toolbar-separator[b-1ubazdox52] {
    flex: 0 0 1px;
    width: 1px;
    height: 22px;
    margin: 0 0.15rem;
    background: rgba(0, 0, 0, 0.14);
}

.toolbar-spacer[b-1ubazdox52] {
    flex: 1 0 0.5rem;
}

.markdown-textarea[b-1ubazdox52] {
    display: block;
    width: 100%;
    min-height: var(--markdown-editor-min-height);
    padding: 0.9rem 1rem 0.35rem;
    border: 0;
    outline: 0;
    resize: vertical;
    background: #fff;
    color: #1f2937;
    font: 400 0.95rem/1.55 "Inter", sans-serif;
}

.markdown-textarea:disabled[b-1ubazdox52] {
    background: #f1f5f9;
    color: #64748b;
    cursor: not-allowed;
}

.markdown-textarea[b-1ubazdox52]::placeholder {
    color: #94a3b8;
}

.markdown-character-count[b-1ubazdox52] {
    padding: 0.15rem 0.75rem 0.45rem;
    color: #64748b;
    font-size: 0.72rem;
    text-align: right;
}
/* /Components/Shared/PublicPinAccessView.razor.rz.scp.css */
.pin-auth-screen[b-dk2zms2nc8] {
    --pin-paper: #F8FBFD;
    --pin-surface: #FAFCFD;
    --pin-card: #FFFFFF;

    --pin-ink: #0D2D3F;
    --pin-ink-hover: #1E4256;
    --pin-label: #4A6878;
    --pin-muted: #7A9BAD;
    --pin-placeholder: #9BB8C5;
    --pin-border-strong: #DDE8EE;
    --pin-card-border: #E2EBF0;
    --pin-border: #EDF2F5;
    --pin-pill-bg: #F2F5F7;

    --pin-brand: #4AC4FF;
    --pin-brand-strong: #1AA3E8;
    --pin-brand-deep: #0D80BB;
    --pin-brand-soft: #E8F8FF;

    --pin-error: #F43F5E;
    --pin-error-text: #E11D48;
    --pin-error-bg: #FFF1F2;
    --pin-error-border: #FECDD3;

    --pin-success: #22C55E;
    --pin-success-text: #15803D;
    --pin-success-bg: #F0FDF4;
    --pin-success-border: #BBF7D0;

    --pin-shadow-sm: 0 1px 4px rgba(13, 45, 63, 0.06);
    --pin-shadow-md: 0 2px 16px rgba(13, 45, 63, 0.07);
    --pin-shadow-focus: 0 0 0 3px rgba(74, 196, 255, 0.18);
    --pin-shadow-focus-error: 0 0 0 3px rgba(244, 63, 94, 0.10);

    --pin-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    min-height: 100vh;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: var(--pin-paper);
    font-family: var(--pin-font);
    color: var(--pin-ink);
    display: grid;
    grid-template-columns: 42fr 58fr;
    position: relative;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
}

.pin-auth-brand-panel[b-dk2zms2nc8] {
    position: relative;
    padding: 48px 56px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border-right: 1px solid var(--pin-border);
    color: var(--pin-ink);
    background: var(--pin-card);
    transition: background 200ms ease;
}

.pin-auth-brand-panel--error[b-dk2zms2nc8] {
    background: var(--pin-card);
}

.pin-auth-brand-content[b-dk2zms2nc8] {
    position: relative;
    z-index: 1;
}

.pin-auth-eyebrow[b-dk2zms2nc8] {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 11px;
    background: var(--pin-pill-bg);
    border: 1px solid var(--pin-card-border);
    border-radius: 9999px;
    font-family: var(--pin-font);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--pin-label);
}

.pin-auth-eyebrow-dot[b-dk2zms2nc8] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--pin-brand);
    box-shadow: none;
}

.pin-auth-brand-panel--error .pin-auth-eyebrow[b-dk2zms2nc8] {
    background: var(--pin-error-bg);
    border-color: var(--pin-error-border);
    color: var(--pin-error-text);
}

.pin-auth-brand-panel--error .pin-auth-eyebrow-dot[b-dk2zms2nc8] {
    background: var(--pin-error);
}

.pin-auth-headline[b-dk2zms2nc8] {
    font-family: var(--pin-font);
    font-size: 44px;
    line-height: 1.1;
    letter-spacing: -0.025em;
    font-weight: 800;
    margin: 24px 0 16px;
    color: var(--pin-ink);
    max-width: 460px;
    text-wrap: balance;
}

.pin-auth-headline[b-dk2zms2nc8]  em {
    font-style: normal;
    color: var(--pin-brand);
    font-family: var(--pin-font);
    font-weight: 800;
    background: none;
    -webkit-background-clip: initial;
    background-clip: initial;
    -webkit-text-fill-color: var(--pin-brand);
}

.pin-auth-brand-panel--error .pin-auth-headline[b-dk2zms2nc8]  em {
    color: var(--pin-error);
    -webkit-text-fill-color: var(--pin-error);
}

.pin-auth-brand-sub[b-dk2zms2nc8] {
    font-size: 14px;
    line-height: 1.55;
    color: var(--pin-muted);
    max-width: 420px;
    margin: 0;
    text-wrap: pretty;
}

.pin-auth-brand-meta[b-dk2zms2nc8] {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 32px;
    padding-top: 24px;
    border-top: 1px dashed var(--pin-border-strong);
}

.pin-auth-meta-item[b-dk2zms2nc8] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pin-auth-meta-label[b-dk2zms2nc8] {
    font-family: var(--pin-font);
    font-size: 10px;
    letter-spacing: 0.09em;
    color: var(--pin-placeholder);
    text-transform: uppercase;
    font-weight: 700;
}

.pin-auth-meta-value[b-dk2zms2nc8] {
    font-family: var(--pin-font);
    font-size: 14px;
    font-weight: 600;
    color: var(--pin-label);
    display: flex;
    align-items: center;
    gap: 6px;
}

.pin-auth-meta-icon[b-dk2zms2nc8] {
    color: var(--pin-muted);
    opacity: 1;
}

.pin-auth-panel[b-dk2zms2nc8] {
    padding: 48px 56px;
    background: var(--pin-surface);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    position: relative;
    min-height: 100vh;
}

.pin-auth-overline[b-dk2zms2nc8] {
    font-family: var(--pin-font);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--pin-placeholder);
    margin: 0 0 12px;
}

.pin-auth-card[b-dk2zms2nc8] {
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
}

.pin-auth-card--loading[b-dk2zms2nc8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.pin-auth-loader-ring[b-dk2zms2nc8] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 3px solid var(--pin-border);
    border-top-color: var(--pin-brand);
    animation: pin-spin-b-dk2zms2nc8 900ms linear infinite;
}

.pin-auth-title[b-dk2zms2nc8] {
    font-family: var(--pin-font);
    font-size: 28px;
    line-height: 1.15;
    letter-spacing: -0.01em;
    font-weight: 800;
    color: var(--pin-ink);
    margin: 0 0 10px;
}

.pin-auth-sub[b-dk2zms2nc8] {
    font-size: 14px;
    line-height: 1.5;
    color: var(--pin-muted);
    margin: 0 0 32px;
    text-wrap: pretty;
}

.pin-auth-sub--center[b-dk2zms2nc8] {
    text-align: center;
}

.pin-row[b-dk2zms2nc8] {
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

[b-dk2zms2nc8] .pin-cell {
    flex: 1;
    max-width: 78px;
    aspect-ratio: 1 / 1.15;
    border-radius: 10px;
    background: #fff;
    border: 1.5px solid var(--pin-border-strong);
    font-family: var(--pin-font);
    font-size: 30px;
    font-weight: 700;
    color: var(--pin-ink);
    text-align: center;
    padding: 0;
    outline: none;
    box-shadow: none;
    caret-color: var(--pin-brand);
    transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease, color 160ms ease;
    -moz-appearance: textfield;
}

[b-dk2zms2nc8] .pin-cell::-webkit-outer-spin-button,
[b-dk2zms2nc8] .pin-cell::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

[b-dk2zms2nc8] .pin-cell:focus {
    border-color: var(--pin-brand);
    border-width: 2px;
    box-shadow: var(--pin-shadow-focus);
}

[b-dk2zms2nc8] .pin-cell--filled {
    border-color: var(--pin-border-strong);
    background: #fff;
    color: var(--pin-ink);
}

[b-dk2zms2nc8] .pin-cell--error {
    border-color: var(--pin-error);
    border-width: 2px;
    background: #fff;
    color: var(--pin-error);
}

[b-dk2zms2nc8] .pin-cell--error:focus {
    box-shadow: var(--pin-shadow-focus-error);
}

.pin-status-line[b-dk2zms2nc8] {
    min-height: 20px;
    font-size: 12px;
    color: var(--pin-placeholder);
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 28px;
    font-variant-numeric: tabular-nums;
}

.pin-status-line--error[b-dk2zms2nc8] {
    color: var(--pin-error-text);
}

.pin-btn-row[b-dk2zms2nc8] {
    display: grid;
    grid-template-columns: 1fr;
}

.pin-btn[b-dk2zms2nc8] {
    appearance: none;
    border: none;
    cursor: pointer;
    font-family: var(--pin-font);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.005em;
    padding: 0 24px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 48px;
    transition: background 150ms ease-out, opacity 150ms ease-out, transform 120ms ease;
}

.pin-btn--primary[b-dk2zms2nc8] {
    background: var(--pin-ink);
    color: #fff;
    box-shadow: none;
}

.pin-btn--primary:hover:not(:disabled)[b-dk2zms2nc8] {
    background: var(--pin-ink-hover);
}

.pin-btn--primary:disabled[b-dk2zms2nc8] {
    background: var(--pin-ink);
    color: #fff;
    cursor: not-allowed;
    opacity: 0.45;
    box-shadow: none;
}

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

@keyframes pin-shake-b-dk2zms2nc8 {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-5px); }
    40% { transform: translateX(4px); }
    60% { transform: translateX(-3px); }
    80% { transform: translateX(2px); }
}

.pin-row--shake[b-dk2zms2nc8]  .pin-cell {
    animation: pin-shake-b-dk2zms2nc8 360ms ease-out;
}

@media (max-width: 960px) {
    .pin-auth-screen[b-dk2zms2nc8] {
        grid-template-columns: 1fr;
    }

    .pin-auth-brand-panel[b-dk2zms2nc8] {
        padding: 32px 24px;
        border-right: none;
        border-bottom: 1px solid var(--pin-border);
    }

    .pin-auth-brand-meta[b-dk2zms2nc8] {
        display: none;
    }

    .pin-auth-headline[b-dk2zms2nc8] {
        font-size: 32px;
        margin-top: 16px;
    }

    .pin-auth-panel[b-dk2zms2nc8] {
        padding: 40px 24px 48px;
        min-height: auto;
    }

    .pin-auth-title[b-dk2zms2nc8] {
        font-size: 24px;
    }

    [b-dk2zms2nc8] .pin-cell {
        font-size: 26px;
    }
}

@media (max-width: 480px) {
    .pin-auth-brand-panel[b-dk2zms2nc8] {
        padding: 28px 20px;
    }

    .pin-auth-headline[b-dk2zms2nc8] {
        font-size: 28px;
    }

    .pin-auth-panel[b-dk2zms2nc8] {
        padding: 32px 20px 40px;
    }

    .pin-row[b-dk2zms2nc8] {
        gap: 8px;
    }
}