@import '_content/Go.UI/Go.UI.nwesokbx58.bundle.scp.css';

/* /Components/Layout/GoWerkruimteSelector.razor.rz.scp.css */
/* GoWerkruimteSelector wraps GoCombobox — no custom styles needed.
   All visual styling comes from the GoCombobox component in Go.UI. */
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ==========================================================================
   MainLayout — Full-height flex layout with header and footer
   ========================================================================== */

.go-app[b-e0n2w9hv35] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.go-main[b-e0n2w9hv35] {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;    /* positioning context for GoPageDecoration */
}

.go-main__container[b-e0n2w9hv35] {
    flex: 1;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    padding: 72px var(--go-space-6) 0;
    position: relative;    /* above GoPageDecoration via DOM order */
}

/* ==========================================================================
   Blazor error UI
   ========================================================================== */

#blazor-error-ui[b-e0n2w9hv35] {
    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-e0n2w9hv35] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* ==========================================================================
   Portal switch button — constrained to nav tab height
   ========================================================================== */

.go-portal-switch[b-e0n2w9hv35] {
    margin-left: var(--go-space-3);
    white-space: nowrap;
    align-self: center;
}

/* ==========================================================================
   Help trigger button — in GoHeader topbar actions
   ========================================================================== */

[b-e0n2w9hv35] .go-help-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    background: transparent;
    border: 1.5px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    color: #FFFFFF;
    font-family: var(--go-font-family);
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

[b-e0n2w9hv35] .go-help-trigger:hover,
[b-e0n2w9hv35] .go-help-trigger:focus-visible {
    border-color: #FFFFFF;
    background-color: rgba(255, 255, 255, 0.15);
}

[b-e0n2w9hv35] .go-help-trigger:focus-visible {
    outline: 2px solid #FFFFFF;
    outline-offset: 2px;
}

[b-e0n2w9hv35] .go-help-trigger__icon {
    display: block;
}

/* ==========================================================================
   Responsive: Mobile
   ========================================================================== */

@media (max-width: 767.98px) {
    .go-main__container[b-e0n2w9hv35] {
        padding: 0 var(--go-space-4);
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* ==========================================================================
   ReconnectModal — Blazor Server reconnect UI with GO! styling
   ========================================================================== */

.components-reconnect-first-attempt-visible[b-hn3w8j8qib],
.components-reconnect-repeated-attempt-visible[b-hn3w8j8qib],
.components-reconnect-failed-visible[b-hn3w8j8qib],
.components-pause-visible[b-hn3w8j8qib],
.components-resume-failed-visible[b-hn3w8j8qib],
.components-session-expired-visible[b-hn3w8j8qib],
.components-rejoining-animation[b-hn3w8j8qib] {
    display: none;
}

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

#components-reconnect-modal[b-hn3w8j8qib] {
    background-color: var(--go-background, #FFFFFF);
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: var(--go-radius-md, 8px);
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    font-family: var(--go-font-family, "Flanders Art Sans", Arial, sans-serif);
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-hn3w8j8qib 0.5s both;
    &[open] {
        animation: components-reconnect-modal-slideUp-b-hn3w8j8qib 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-hn3w8j8qib 0.5s ease-in-out 0.3s;
        animation-fill-mode: both;
    }
}

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

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

@keyframes components-reconnect-modal-fadeInOpacity-b-hn3w8j8qib {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

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

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

#components-reconnect-modal p[b-hn3w8j8qib] {
    margin: 0;
    text-align: center;
    color: var(--go-text-primary, #303030);
    font-size: var(--go-font-size-body, 16px);
    line-height: var(--go-line-height-body, 1.6);
}

#components-reconnect-modal button[b-hn3w8j8qib] {
    border: 0;
    background-color: var(--go-magenta, #C3004A);
    color: #FFFFFF;
    padding: var(--go-space-2, 8px) var(--go-space-6, 24px);
    border-radius: var(--go-radius-sm, 4px);
    font-family: var(--go-font-family, "Flanders Art Sans", Arial, sans-serif);
    font-size: var(--go-font-size-body, 16px);
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
}

#components-reconnect-modal button:hover[b-hn3w8j8qib] {
    background-color: var(--go-magenta-dark, #A80049);
}

#components-reconnect-modal button:active[b-hn3w8j8qib] {
    background-color: var(--go-magenta, #C3004A);
}

#components-reconnect-modal button:focus-visible[b-hn3w8j8qib] {
    outline: 2px solid var(--go-magenta, #C3004A);
    outline-offset: 2px;
}

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

.components-reconnect-logo[b-hn3w8j8qib] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: auto;
    z-index: 1;
    opacity: 0.7;
}

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

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

@keyframes components-rejoining-animation-b-hn3w8j8qib {
    0% {
        top: 80px;
        left: 80px;
        width: 0;
        height: 0;
        opacity: 0;
    }
    4.9% {
        top: 80px;
        left: 80px;
        width: 0;
        height: 0;
        opacity: 0;
    }
    5% {
        top: 80px;
        left: 80px;
        width: 0;
        height: 0;
        opacity: 1;
    }
    100% {
        top: 0px;
        left: 0px;
        width: 160px;
        height: 160px;
        opacity: 0;
    }
}
/* /Components/Pages/AccessDenied.razor.rz.scp.css */
/* ==========================================================================
   AccessDenied — 403 error page
   ========================================================================== */

.access-denied[b-cqqjnej0uc] {
    text-align: center;
    padding: var(--go-space-16) var(--go-space-6);
    max-width: 560px;
    margin: 0 auto;
}

.access-denied__title[b-cqqjnej0uc] {
    font-size: var(--go-font-size-h1);
    font-weight: 500;
    color: var(--go-text-dark);
    margin-bottom: var(--go-space-4);
}

.access-denied__message[b-cqqjnej0uc] {
    font-size: var(--go-font-size-body);
    color: var(--go-text-primary);
    line-height: var(--go-line-height-body);
    margin-bottom: var(--go-space-8);
}
/* /Components/Pages/Beheer/Beheer.razor.rz.scp.css */
/* ==========================================================================
   Beheer — Admin landing page (centered welcome)
   ========================================================================== */

.beheer-hero[b-smn0fmufep] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 420px;
    padding: var(--go-space-12) var(--go-space-6);
    margin: 0 calc(-1 * var(--go-space-6));
}

.beheer-hero__content[b-smn0fmufep] {
    text-align: center;
    max-width: 560px;
}

/* Beheer indicator — prominent purple badge */
.beheer-indicator[b-smn0fmufep] {
    display: inline-flex;
    align-items: center;
    gap: var(--go-space-2);
    padding: var(--go-space-2) var(--go-space-4);
    background-color: var(--go-purple);
    color: #FFFFFF;
    border-radius: var(--go-radius-pill);
    font-family: var(--go-font-family);
    font-size: var(--go-font-size-sm);
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-bottom: var(--go-space-4);
}

.beheer-indicator__icon[b-smn0fmufep] {
    display: inline-flex;
    align-items: center;
}

.beheer-indicator__label[b-smn0fmufep] {
    line-height: 1;
}

.beheer-hero__title[b-smn0fmufep] {
    font-size: var(--go-font-size-h1);
    font-weight: 500;
    color: var(--go-purple-dark);
    margin-bottom: var(--go-space-4);
    line-height: var(--go-line-height-heading);
}

.beheer-hero__description[b-smn0fmufep] {
    font-size: var(--go-font-size-body);
    color: var(--go-text-primary);
    line-height: var(--go-line-height-body);
}

/* ==========================================================================
   Responsive: Mobile
   ========================================================================== */

@media (max-width: 767.98px) {
    .beheer-hero[b-smn0fmufep] {
        min-height: auto;
        padding: var(--go-space-8) var(--go-space-4);
        margin: 0 calc(-1 * var(--go-space-4));
    }

    .beheer-hero__title[b-smn0fmufep] {
        font-size: 22px;
    }
}
/* /Components/Pages/Beheer/Erkenningen/MedewerkerAanvragen.razor.rz.scp.css */
/* Groene "Goedkeuren" icon button — outline stijl, consistent met go-action-btn */
.mijn-action-btn--success[b-ohwg67bdci] {
    background-color: transparent;
    border: 1.5px solid var(--go-green, #2e7d32);
    color: var(--go-green, #2e7d32);
}

.mijn-action-btn--success:hover:not(:disabled)[b-ohwg67bdci] {
    background-color: var(--go-green, #2e7d32);
    color: #fff;
}

/* Rode "Afwijzen" icon button — outline stijl */
.mijn-action-btn--danger[b-ohwg67bdci] {
    background-color: transparent;
    border: 1.5px solid var(--go-red, #c62828);
    color: var(--go-red, #c62828);
}

.mijn-action-btn--danger:hover:not(:disabled)[b-ohwg67bdci] {
    background-color: var(--go-red, #c62828);
    color: #fff;
}
/* /Components/Pages/Dashboard.razor.rz.scp.css */
/* ==========================================================================
   Dashboard — Authenticated user dashboard with greeting
   ========================================================================== */

.dashboard-greeting[b-srd7mg78sj] {
    font-size: var(--go-font-size-h3, 1.25rem);
    margin-bottom: var(--go-space-6, 1.5rem);
    color: var(--go-text-dark);
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ==========================================================================
   Home — Public welcome page with hero section
   ========================================================================== */

/* Auth error toast — fixed top-right, dismissible */
.auth-toast[b-3fefzopzn6] {
    position: fixed;
    top: var(--go-space-6);
    right: var(--go-space-6);
    z-index: 1000;
    display: flex;
    align-items: flex-start;
    gap: var(--go-space-3);
    background-color: var(--go-background);
    border: 1px solid var(--go-magenta-light);
    border-left: 4px solid var(--go-magenta);
    border-radius: var(--go-radius-md);
    padding: var(--go-space-4) var(--go-space-5);
    max-width: 360px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.auth-toast__content[b-3fefzopzn6] {
    flex: 1;
}

.auth-toast__message[b-3fefzopzn6] {
    color: var(--go-text-dark);
    font-size: var(--go-font-size-body);
    margin-bottom: var(--go-space-2);
}

.auth-toast__retry[b-3fefzopzn6] {
    font-size: var(--go-font-size-small);
    color: var(--go-magenta);
    text-decoration: underline;
}

.auth-toast__retry:hover[b-3fefzopzn6] {
    color: var(--go-magenta-dark, var(--go-magenta));
}

.auth-toast__close[b-3fefzopzn6] {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    color: var(--go-text-muted, #666);
    padding: 0;
    margin-top: -2px;
}

.auth-toast__close:hover[b-3fefzopzn6] {
    color: var(--go-text-dark);
}

@media (max-width: 767.98px) {
    .auth-toast[b-3fefzopzn6] {
        top: var(--go-space-4);
        right: var(--go-space-4);
        left: var(--go-space-4);
        max-width: none;
    }
}

/* Hero section — transparent so tornado decoration shows through */
.hero[b-3fefzopzn6] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 420px;
    padding: var(--go-space-12) var(--go-space-6);
    margin: 0 calc(-1 * var(--go-space-6));
}

.hero__content[b-3fefzopzn6] {
    text-align: center;
    max-width: 560px;
}

.hero__title[b-3fefzopzn6] {
    font-size: var(--go-font-size-h1);
    font-weight: 500;
    color: var(--go-text-dark);
    margin-bottom: var(--go-space-4);
    line-height: var(--go-line-height-heading);
}

.hero__description[b-3fefzopzn6] {
    font-size: var(--go-font-size-body);
    color: var(--go-text-primary);
    line-height: var(--go-line-height-body);
    margin-bottom: var(--go-space-8);
}

.hero__actions[b-3fefzopzn6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--go-space-3);
}

.hero__btn[b-3fefzopzn6] {
    min-width: 160px;
}

/* ==========================================================================
   Responsive: Mobile
   ========================================================================== */

@media (max-width: 767.98px) {
    .hero[b-3fefzopzn6] {
        min-height: auto;
        padding: var(--go-space-8) var(--go-space-4);
        margin: 0 calc(-1 * var(--go-space-4));
    }

    .hero__title[b-3fefzopzn6] {
        font-size: 22px;
    }

    .hero__btn[b-3fefzopzn6] {
        min-width: 140px;
    }
}
/* /Components/Pages/UserToken.razor.rz.scp.css */
/* ==========================================================================
   UserToken — Token claims display page
   ========================================================================== */

/* Claim value column — word-wrap for long values */
.claim-value[b-ofebx6mjle] {
    word-break: break-all;
    overflow-wrap: break-word;
}