/* /Components/Layout/Banner.razor.rz.scp.css */
.site-banner[b-nfyqfln3oe] {
    width: 100%;
    height: 200px !important; /* force fixed height for readability */
    margin: 0;
    padding: 0;
    line-height: 0;
    /* ensure banner sits at the top and has a max height */
    --site-banner-max-height: 200px; /* default to 200px as requested */
    max-height: var(--site-banner-max-height, 200px) !important;
    overflow: hidden;
    display: flex;
    align-items: center; /* vertically center the image if it's shorter than the container */
    justify-content: center;
    box-sizing: border-box;
    z-index: 0;
}

.site-banner img[b-nfyqfln3oe] {
    display: block;
    width: auto !important;
    height: 100% !important; /* fill the container height */
    max-height: var(--site-banner-max-height, 200px) !important; /* do not exceed container height */
    object-fit: contain !important; /* preserve horizon and do not crop aggressively */
    margin: 0;
    padding: 0;
}

/* On wider screens where the sidebar is visible, let the banner "break out" to the left and span the full viewport width
   so the horizon reaches the browser edges. The sidebar width is 250px (see MainLayout.razor.css). */
@media (min-width: 641px) {
    .site-banner[b-nfyqfln3oe] {
        width: calc(100% + 250px);
        margin-left: -250px; /* pull banner under the sidebar to the left edge */
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-063xmjggvu] {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

main[b-063xmjggvu] {
    flex: 1;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    display: block;
    width: 100%;
    min-width: 0;
}

/* ensure the global banner sits flush to the top-right of the main area */
main > .site-banner[b-063xmjggvu], main .site-banner[b-063xmjggvu] {
    margin: 0;
    padding: 0;
    width: 100%;
    display: block;
}

/* Ensure the main content area doesn't introduce spacing that pushes/centers content */
main > article.content[b-063xmjggvu] {
    padding: 0 !important;
    margin: 0 !important;
    width: 100%;
    max-width: none;
}

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

/* Make sure the sidebar sits above the main content so its gradient is never
   visually covered by content from main. Also force the main/article areas to
   be transparent so they do not introduce white backgrounds under the sidebar. */
.sidebar[b-063xmjggvu] {
    position: sticky; /* already set in media query, but safe to repeat */
    top: 0;
    z-index: 20;
}

main[b-063xmjggvu], main > article.content[b-063xmjggvu], article[b-063xmjggvu], article.content[b-063xmjggvu] {
    background: transparent !important;
    background-color: transparent !important;
}

article[b-063xmjggvu] {
    padding: 0 !important;
    margin: 0 !important;
    display: block;
    width: 100%;
    min-width: 0;
}

article.content[b-063xmjggvu] {
    padding: 0 !important;
    margin: 0 !important;
}

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

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

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

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

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

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

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

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

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

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

    .top-row[b-063xmjggvu] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-063xmjggvu] {
    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-063xmjggvu] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-65kmzgal5g] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

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

.top-row[b-65kmzgal5g] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-65kmzgal5g] {
    font-size: 1.1rem;
}

.bi[b-65kmzgal5g] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-65kmzgal5g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-65kmzgal5g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-65kmzgal5g] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-65kmzgal5g] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-65kmzgal5g] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-65kmzgal5g] {
        padding-bottom: 1rem;
    }

    .nav-item[b-65kmzgal5g]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-65kmzgal5g]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-65kmzgal5g]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

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

/* Make sure the scrollable nav area is transparent so the sidebar gradient shows through
   (fixes a white block appearing under the menu). Use !important to override any
   defaults from Bootstrap that may introduce a white background. */
.nav-scrollable[b-65kmzgal5g],
.nav-scrollable > nav[b-65kmzgal5g] {
    background-color: transparent !important;
    color: inherit;
}

/* Make the scrollable nav take the available sidebar height and lay out items
   so the sidebar-bottom can be positioned reliably. This avoids gaps that
   expose a white background under the menu. */
/* Make nav-scrollable fill the available vertical space via flex layout
   instead of using fixed calc() heights; this avoids reserving a bottom
   gap when there is no sidebar-bottom element. */
.nav-scrollable[b-65kmzgal5g] {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden;
}

.nav-scrollable > nav[b-65kmzgal5g] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.25rem 0 !important;
    flex: 1 1 auto;
    overflow: auto;
}

/* Push the sidebar-bottom image to the bottom of the nav area so it doesn't
   leave a white gap between the nav and the image on tall viewports. */
/* sidebar-bottom removed; keep layout flexible so items can grow and nav
   will scroll when needed. */

/* Aggressive overrides for any upstream CSS (Bootstrap or other libraries)
   that might add white backgrounds, borders, or shadows to nav elements. */
.nav-scrollable nav[b-65kmzgal5g],
.nav-scrollable .nav[b-65kmzgal5g],
.nav-scrollable .nav-item[b-65kmzgal5g],
.nav-scrollable .nav-link[b-65kmzgal5g],
.nav-scrollable .nav *[b-65kmzgal5g] {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
    color: inherit !important;
}

/* Remove any padding/margin that could create a visible white strip */
.nav-scrollable[b-65kmzgal5g],
.nav-scrollable > nav[b-65kmzgal5g] {
    padding: 0 !important;
    margin: 0 !important;
}

/* Top penguin image (moved from bottom) */
.sidebar-top[b-65kmzgal5g] {
    padding: 0.5rem 0.75rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: transparent !important;
}

.sidebar-top-image[b-65kmzgal5g] {
    display: block;
    width: auto;
    height: auto;
    max-width: 120px;
    /* add a small left margin so the penguin isn't flush against the sidebar edge */
    margin: 0 0.5rem 0 0.5rem;
}

/* Ensure nav links never force a white background from any upstream CSS */
.nav-scrollable[b-65kmzgal5g]  .nav-link,
.nav-scrollable > nav[b-65kmzgal5g]  .nav-link {
    background: transparent !important;
}

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

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

    /* Let the nav size to its content. Constrain the scroll area so the list scrolls
       only when it grows taller than the available sidebar space; the penguin will
       appear immediately after the last menu item. */
    .nav-scrollable[b-65kmzgal5g] {
        display: block;
        /* With flex layout the nav will size itself; don't use calc() here. */
        overflow: hidden;
    }

    /* Nav list scrolls if its content exceeds the available area */
    .nav-scrollable > nav[b-65kmzgal5g] {
        overflow-y: auto;
        /* Flex will manage height; allow scrolling when necessary. */
    }
}

/* Global overrides: target any common utility or component classes that may be
   adding a white background inside the sidebar (Bootstrap 'bg-white', 'card',
   or generic container styles). Using :global so these apply even with
   Blazor's CSS isolation. */
:global(.sidebar) *[b-65kmzgal5g] {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

:global(.sidebar) .bg-white[b-65kmzgal5g],
:global(.sidebar) .card[b-65kmzgal5g],
:global(.sidebar) .container[b-65kmzgal5g],
:global(.sidebar) .container-fluid[b-65kmzgal5g],
:global(.sidebar) .panel[b-65kmzgal5g] {
    background: transparent !important;
}

/* Remove any reserved white gap: allow the nav to flex and overflow while
   the sidebar-bottom element (penguin) is pushed to the bottom using
   margin-top:auto. This avoids keeping a fixed 120px reserved area which
   previously produced the visible white block. */
.nav-scrollable[b-65kmzgal5g] {
    max-height: none !important;
}

.nav-scrollable > nav[b-65kmzgal5g] {
    overflow-y: auto; /* scroll when content exceeds height */
    max-height: none !important;
}

/* Keep transparency overrides to prevent an upstream white background */
.nav-scrollable nav[b-65kmzgal5g],
.nav-scrollable .nav[b-65kmzgal5g],
.nav-scrollable .nav-item[b-65kmzgal5g],
.nav-scrollable .nav-link[b-65kmzgal5g],
.nav-scrollable .nav *[b-65kmzgal5g] {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
    color: inherit !important;
}

/* Ensure the sidebar stacking is above main content */
:global(.sidebar)[b-65kmzgal5g] {
    z-index: 9999 !important;
}




/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-gzk4h1vd6v],
.components-reconnect-repeated-attempt-visible[b-gzk4h1vd6v],
.components-reconnect-failed-visible[b-gzk4h1vd6v],
.components-pause-visible[b-gzk4h1vd6v],
.components-resume-failed-visible[b-gzk4h1vd6v],
.components-rejoining-animation[b-gzk4h1vd6v] {
    display: none;
}

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


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

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

}

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

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

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

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

    100% {
        opacity: 1;
    }
}

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

    100% {
        opacity: 0;
    }
}

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

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

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

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

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

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

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

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

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

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

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

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/CommunitySupport.razor.rz.scp.css */
.community[b-kzo85fgko0] { padding: 2rem 0; }
.community .container[b-kzo85fgko0] { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.community h1[b-kzo85fgko0] { margin: 0 0 1rem; }
.community .lead[b-kzo85fgko0] { margin: 0 0 1rem; color: #374151; }
.community .links[b-kzo85fgko0] { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .75rem; }
.community .links li[b-kzo85fgko0] { background: #fff; padding: .75rem 1rem; border-radius: .5rem; border: 1px solid #e5e7eb; }
.community .desc[b-kzo85fgko0] { color: #6b7280; margin-top: .35rem; }
.community .note[b-kzo85fgko0] { margin-top: 1rem; color: #6b7280; }

/* /Components/Pages/Contact.razor.rz.scp.css */
.contact-page[b-4lm0bdafv5] { padding: 1rem; }
.contact-page .container[b-4lm0bdafv5] { max-width: 900px; margin: 0 auto; }
.contact-page .lead[b-4lm0bdafv5] { margin-bottom: 1rem; }
.contact-page .form-row[b-4lm0bdafv5] { margin-bottom: 0.75rem; }
.contact-page .form-actions[b-4lm0bdafv5] { margin-top: 1rem; }
.contact-page .form-control[b-4lm0bdafv5] { width: 100%; padding: 0.5rem; border-radius: 6px; border: 1px solid #ddd; }
.contact-page .btn--primary[b-4lm0bdafv5] { background: #2b8a6b; color: #fff; padding: 0.5rem 0.75rem; border-radius: 4px; border: none; }

/* Secondary button and obfuscated email styles */
.contact-page .btn--secondary[b-4lm0bdafv5] { background: #f2f2f2; color: #333; padding: 0.45rem 0.7rem; border-radius: 4px; border: none; margin-left: 0.5rem; }
.contact-page .obfuscated-email[b-4lm0bdafv5] { font-weight: 600; margin: 1rem 0; }
.contact-page .obfuscated-email .at[b-4lm0bdafv5], .contact-page .obfuscated-email .dot[b-4lm0bdafv5] { color: #666; font-weight: 400; margin: 0 0.25rem; }


/* /Components/Pages/CostCompare.razor.rz.scp.css */
/* CostCompare page styles */
.costcompare-page[b-fq7zht6ycm] {
  padding: 1rem;
  max-width: 1200px;
  margin: 0 auto;
}

.hero-card[b-fq7zht6ycm] {
  background: linear-gradient(90deg, #0b2a2f, #08303a);
  color: #fff;
  padding: 1rem 1.25rem;
  border-radius: 6px;
  margin-bottom: 1rem;
}

.hero-card .eyebrow[b-fq7zht6ycm] {
  font-size: 0.85rem;
  opacity: 0.9;
  margin-bottom: 0.25rem;
}

.input-grid[b-fq7zht6ycm] { display:flex; gap:1rem; margin:1rem 0; }
.input-card[b-fq7zht6ycm] { flex:1; }

.summary-grid[b-fq7zht6ycm] { display:flex; gap:1rem; margin-bottom:1rem; }
.summary-card[b-fq7zht6ycm] { flex:1; padding:0.75rem; border-radius:6px; background:#f7f9fb; text-align:center; }
.summary-card.linux[b-fq7zht6ycm] { border: 2px solid #2b8a6b; }
.summary-card.windows[b-fq7zht6ycm] { border: 2px solid #3a5fb6; }
.summary-card.difference[b-fq7zht6ycm] { border: 2px dashed #999; }
.summary-value[b-fq7zht6ycm] { font-size:1.25rem; font-weight:700; }

.table-card[b-fq7zht6ycm] { background:#fff; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,0.06); padding:1rem; }
.table-responsive[b-fq7zht6ycm] { overflow:auto; }
.cost-table[b-fq7zht6ycm] { width:100%; border-collapse:collapse; min-width:720px; }
.cost-table th[b-fq7zht6ycm], .cost-table td[b-fq7zht6ycm] { padding:0.5rem 0.75rem; border-bottom:1px solid #eee; }
.cost-table thead th[b-fq7zht6ycm] { background:#fafafa; text-align:left; }
.cost-table .item-title[b-fq7zht6ycm] { max-width:380px; }
.item-name[b-fq7zht6ycm] { font-weight:600; }
.item-note[b-fq7zht6ycm] { font-size:0.85rem; color:#666; }
.section-row td[b-fq7zht6ycm] { background:#f2f6f9; font-weight:700; }
.total-row td[b-fq7zht6ycm], .grand-total-row td[b-fq7zht6ycm] { font-weight:700; background:#fafafa; }

.custom-cost-editor[b-fq7zht6ycm] { display:flex; gap:0.5rem; align-items:center; }
.custom-cost-editor .form-control[b-fq7zht6ycm], .custom-cost-editor .form-select[b-fq7zht6ycm] { width:160px; }

.diff-windows-higher[b-fq7zht6ycm] { color:#c0392b; }
.diff-linux-higher[b-fq7zht6ycm] { color:#27ae60; }
.diff-even[b-fq7zht6ycm] { color:#666; }

.note-card[b-fq7zht6ycm] { margin-top:1rem; padding:0.75rem; background:#fffbe6; border-radius:6px; }

@media (max-width:800px) {
  .summary-grid[b-fq7zht6ycm] { flex-direction:column; }
  .input-grid[b-fq7zht6ycm] { flex-direction:column; }
}

.costcompare-page[b-fq7zht6ycm] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 1.5rem;
    color: #1f2937;
}

.hero-card[b-fq7zht6ycm] {
    background: linear-gradient(135deg, #0f172a 0%, #1d4ed8 100%);
    color: #fff;
    border-radius: 24px;
    padding: 2rem;
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.20);
    margin-bottom: 1.5rem;
}

.hero-content[b-fq7zht6ycm] {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: center;
    flex-wrap: wrap;
}

.eyebrow[b-fq7zht6ycm] {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.85;
    margin-bottom: 0.5rem;
}

.hero-card h1[b-fq7zht6ycm] {
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
}

.hero-text[b-fq7zht6ycm] {
    margin: 0.75rem 0 0;
    max-width: 720px;
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.88);
}

.input-grid[b-fq7zht6ycm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.input-card[b-fq7zht6ycm] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: 1rem;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

.input-card label[b-fq7zht6ycm] {
    display: block;
    font-weight: 600;
    margin-bottom: 0.55rem;
    color: #334155;
}

.summary-grid[b-fq7zht6ycm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.summary-card[b-fq7zht6ycm] {
    border-radius: 20px;
    padding: 1.25rem 1.35rem;
    color: #fff;
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.12);
}

.summary-card.linux[b-fq7zht6ycm] {
    background: linear-gradient(135deg, #15803d 0%, #16a34a 100%);
}

.summary-card.windows[b-fq7zht6ycm] {
    background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
}

.summary-card.difference[b-fq7zht6ycm] {
    background: linear-gradient(135deg, #7c3aed 0%, #9333ea 100%);
}

.summary-label[b-fq7zht6ycm] {
    font-size: 0.9rem;
    opacity: 0.92;
    margin-bottom: 0.45rem;
}

.summary-value[b-fq7zht6ycm] {
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.15;
}

.summary-subtitle[b-fq7zht6ycm] {
    margin-top: 0.4rem;
    font-size: 0.9rem;
    opacity: 0.88;
}

.table-card[b-fq7zht6ycm] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
    overflow: hidden;
}

.table-header[b-fq7zht6ycm] {
    padding: 1.5rem 1.5rem 1rem;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(to bottom, #f8fafc, #ffffff);
}

.table-header h2[b-fq7zht6ycm] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    color: #0f172a;
}

.table-header p[b-fq7zht6ycm] {
    margin: 0.35rem 0 0;
    color: #64748b;
}

.cost-table[b-fq7zht6ycm] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.cost-table thead th[b-fq7zht6ycm] {
    background: #0f172a;
    color: #ffffff;
    padding: 1rem;
    font-size: 0.9rem;
    font-weight: 700;
    border-bottom: 0;
}

.cost-table tbody td[b-fq7zht6ycm] {
    padding: 1rem;
    border-bottom: 1px solid #e5e7eb;
    vertical-align: middle;
    background: #ffffff;
}

.cost-table tbody tr:hover td[b-fq7zht6ycm] {
    background: #f8fafc;
}

.cost-table .section-row td[b-fq7zht6ycm] {
    background: #e2e8f0;
    color: #0f172a;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.82rem;
}

.item-title .item-name[b-fq7zht6ycm] {
    font-weight: 600;
    color: #0f172a;
}

.item-title .item-note[b-fq7zht6ycm] {
    font-size: 0.86rem;
    color: #64748b;
    margin-top: 0.18rem;
}

.custom-row-header[b-fq7zht6ycm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.custom-cost-editor[b-fq7zht6ycm] {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 180px auto;
    gap: 0.75rem;
    align-items: center;
}

.total-row td[b-fq7zht6ycm] {
    background: #f8fafc !important;
    font-weight: 700;
}

.grand-total-row td[b-fq7zht6ycm] {
    background: #dbeafe !important;
    font-weight: 800;
    font-size: 1rem;
}

.note-card[b-fq7zht6ycm] {
    margin-top: 1rem;
    background: #eff6ff;
    color: #1e3a8a;
    border: 1px solid #bfdbfe;
    border-radius: 18px;
    padding: 1rem 1.1rem;
}

.empty-state[b-fq7zht6ycm] {
    color: #64748b;
    text-align: center;
    padding: 1.25rem !important;
    background: #f8fafc !important;
    font-style: italic;
}

.diff-windows-higher[b-fq7zht6ycm] {
    color: #15803d;
    font-weight: 700;
}

.diff-linux-higher[b-fq7zht6ycm] {
    color: #b91c1c;
    font-weight: 700;
}

.diff-even[b-fq7zht6ycm] {
    color: #475569;
    font-weight: 600;
}

.text-end[b-fq7zht6ycm] {
    text-align: right;
}

.form-control[b-fq7zht6ycm],
.form-select[b-fq7zht6ycm] {
    border-radius: 12px;
    border: 1px solid #cbd5e1;
    padding: 0.65rem 0.8rem;
    box-shadow: none;
}

.form-control:focus[b-fq7zht6ycm],
.form-select:focus[b-fq7zht6ycm] {
    border-color: #60a5fa;
    box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.18);
}

.btn[b-fq7zht6ycm] {
    border-radius: 12px;
    font-weight: 600;
    padding: 0.65rem 1rem;
}

@media (max-width: 992px) {
    .custom-cost-editor[b-fq7zht6ycm] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .costcompare-page[b-fq7zht6ycm] {
        padding: 1rem;
    }

    .hero-card[b-fq7zht6ycm] {
        padding: 1.5rem;
    }

    .hero-card h1[b-fq7zht6ycm] {
        font-size: 1.6rem;
    }

    .summary-value[b-fq7zht6ycm] {
        font-size: 1.5rem;
    }

    .cost-table thead th[b-fq7zht6ycm],
    .cost-table tbody td[b-fq7zht6ycm] {
        padding: 0.85rem;
    }
}
/* /Components/Pages/Dpw.razor.rz.scp.css */
.dpw-title[b-ygzh4zv4tt] {
  margin-top: 0;
}

.dpw-meta[b-ygzh4zv4tt] {
  margin-bottom: 1rem;
  color: #666;
}

.dpw-grid[b-ygzh4zv4tt] {
  display: grid;
  grid-template-columns: 1.5fr 2fr 1fr 0.8fr 0.8fr 1fr 2fr 1.2fr;
  gap: 0.75rem 1.25rem;
  align-items: start;
  width: 100%;
  overflow: auto;
  padding: 1rem;
  border: 1px solid #e6e6e6;
  border-radius: 6px;
  background: #fff;
}

.dpw-container[b-ygzh4zv4tt] {
  padding: 1.5rem;
  margin: 0 auto 2rem auto;
  max-width: 1100px;
}

.dpw-container .dpw-title[b-ygzh4zv4tt] {
  margin-bottom: 0.25rem;
}

.dpw-container .dpw-meta[b-ygzh4zv4tt] {
  margin-bottom: 1rem;
}

.grid-header[b-ygzh4zv4tt] {
  font-weight: 600;
  padding: 0.5rem 0.25rem;
  border-bottom: 1px solid #eee;
  background: #fbfbfb;
}

.grid-cell[b-ygzh4zv4tt] {
  padding: 0.5rem 0.25rem;
  border-bottom: 1px dashed #f2f2f2;
  word-break: break-word;
}

@media (max-width: 900px) {
  .dpw-grid[b-ygzh4zv4tt] {
    grid-template-columns: 1fr;
  }
  .grid-header[b-ygzh4zv4tt] {
    display: none;
  }
  .grid-cell[b-ygzh4zv4tt] {
    border-bottom: 1px solid #eee;
    padding-left: 0.5rem;
  }
  /* When in single column mode, present each record as a grouped block */
  .grid-cell:nth-child(8n+1)[b-ygzh4zv4tt] { font-weight: 700; }
}


/* /Components/Pages/Home.razor.rz.scp.css */
:host[b-chqu7y9qtu] {
    display: block;
}

/* Banner should start at the top-left of the main content column and fill its width */
.banner[b-chqu7y9qtu] {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* IMPORTANT: block removes inline baseline spacing and makes width:100% behave as expected */
.banner img[b-chqu7y9qtu] {
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}
/* /Components/Pages/LearningResources.razor.rz.scp.css */
.resources[b-emvsg66204] { padding:1rem; }
.resources .container[b-emvsg66204] { max-width:1000px; margin:0 auto; }
.resources .search[b-emvsg66204] { margin:0.5rem 0 1rem; }
.resources input[type="search"][b-emvsg66204] { width:100%; padding:0.5rem; border-radius:6px; border:1px solid #ddd; }
.resources-list[b-emvsg66204] { list-style:none; padding:0; margin:0; display:grid; gap:0.75rem; }
.resources-list li[b-emvsg66204] { padding:0.75rem; border-radius:6px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,0.03); }
.resources-list li .desc[b-emvsg66204] { font-size:0.9rem; color:#444; }
.resources-list li.empty[b-emvsg66204] { color:#666; }

.resources[b-emvsg66204] { padding: 2rem 0; }
.resources .container[b-emvsg66204] { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.resources h1[b-emvsg66204] { margin: 0 0 1rem; }
.resources .lead[b-emvsg66204] { margin: 0 0 1rem; color: #374151; }
.resources .search[b-emvsg66204] { margin: 0 0 1rem; }
.resources input[b-emvsg66204] { width: 100%; padding: .5rem .75rem; border-radius: .5rem; border: 1px solid #d1d5db; }
.resources-list[b-emvsg66204] { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .75rem; }
.resources-list li[b-emvsg66204] { background: #fff; padding: .75rem 1rem; border-radius: .5rem; border: 1px solid #e5e7eb; }
.resources-list li .desc[b-emvsg66204] { color: #6b7280; margin-top: .5rem; }
.resources-list li.empty[b-emvsg66204] { color: #6b7280; }

/* /Components/Pages/Pricing.razor.rz.scp.css */
.pricing[b-20ms5kyvmr] { padding:1rem; }
.pricing .container[b-20ms5kyvmr] { max-width:1000px; margin:0 auto; }
.plans[b-20ms5kyvmr] { display:flex; gap:1rem; flex-wrap:wrap; }
.plan[b-20ms5kyvmr] { flex:1 1 220px; background:#fff; padding:1rem; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,0.04); }
.plan .price[b-20ms5kyvmr] { font-size:1.25rem; font-weight:700; margin-bottom:0.5rem; }
.plan .small[b-20ms5kyvmr] { font-size:0.85rem; color:#555; }
.note.small[b-20ms5kyvmr] { color:#666; }

@media (max-width:700px) { .plans[b-20ms5kyvmr] { flex-direction:column; } }

.pricing[b-20ms5kyvmr] { padding: 2rem 0; }
.pricing .container[b-20ms5kyvmr] { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.pricing .lead[b-20ms5kyvmr] { color: #374151; }
.pricing .plans[b-20ms5kyvmr] { display:flex; gap:1rem; margin-top:1rem; }
.pricing .plan[b-20ms5kyvmr] { background:#fff; border:1px solid #e5e7eb; padding:1rem; border-radius:.75rem; flex:1; }
.pricing .price[b-20ms5kyvmr] { font-size:1.75rem; font-weight:700; margin-top:.5rem; }
.pricing .note[b-20ms5kyvmr] { color:#6b7280; margin-top:1rem; }

/* /Components/Pages/Register.razor.rz.scp.css */
.register-container[b-cke12qubk1] {
  padding: 1.5rem;
  margin: 0 auto;
  max-width: 900px;
}

/* Make form controls full-width on small screens */
@media (max-width: 576px) {
  .register-container .form-row[b-cke12qubk1],
  .register-container .form-group[b-cke12qubk1] {
    display: block;
    width: 100%;
  }
}

/* Slightly increase spacing between form groups */
.register-container .form-group[b-cke12qubk1] {
  margin-bottom: 1rem;
}

/* /Components/Pages/Services.razor.rz.scp.css */
.services[b-m48s3eeoog] { padding:1rem; }
.services .container[b-m48s3eeoog] { max-width:1000px; margin:0 auto; }
.services .grid[b-m48s3eeoog] { display:flex; gap:1rem; margin-top:1rem; flex-wrap:wrap; }
.services .card[b-m48s3eeoog] { flex:1 1 240px; background:#fff; padding:1rem; border-radius:6px; box-shadow:0 1px 3px rgba(0,0,0,0.04); }
.services .lead[b-m48s3eeoog] { color:#333; }
.services ul[b-m48s3eeoog] { padding-left:1rem; }
.cta[b-m48s3eeoog] { margin-top:1rem; display:flex; gap:0.5rem; }
.btn--primary[b-m48s3eeoog] { background:#2b8a6b; color:#fff; padding:0.5rem 0.75rem; border-radius:4px; text-decoration:none; }
.btn--secondary[b-m48s3eeoog] { background:#f2f2f2; color:#333; padding:0.5rem 0.75rem; border-radius:4px; text-decoration:none; }

.services[b-m48s3eeoog] { padding: 2rem 0; }
.services .container[b-m48s3eeoog] { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }
.services .lead[b-m48s3eeoog] { color: #374151; }
.services .grid[b-m48s3eeoog] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1rem; }
.services .card[b-m48s3eeoog] { background: #fff; border: 1px solid #e5e7eb; padding: 1rem; border-radius: .75rem; }
.services .cta[b-m48s3eeoog] { margin-top: 1.25rem; display:flex; gap:.75rem; }