/* /Layout/MainLayout.razor.rz.scp.css */
/* App shell: plum banner header, deep-plum user bar over a gold rule, cream page, gold-ruled footer. */

.app-shell[b-ie4kedbiaf] {
    background-color: rgb(var(--tnc-paper));
    color: rgb(var(--tnc-slate-800));
}

/* ---- Header -------------------------------------------------------------- */

.app-header[b-ie4kedbiaf] {
    background-color: rgb(var(--tnc-brand-700));
    background-image: linear-gradient(90deg, rgb(var(--tnc-brand-800)) 0%, rgb(var(--tnc-brand-600)) 50%, rgb(var(--tnc-brand-800)) 100%);
    box-shadow: 0 2px 8px rgb(var(--tnc-brand-950) / 0.25);
}

.app-brand[b-ie4kedbiaf] {
    text-decoration: none;
}

.app-brand__logo[b-ie4kedbiaf] {
    background-color: #fff;
    border: 1px solid rgb(var(--tnc-gold-600) / 0.7);
    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2);
    transition: border-color 150ms ease, box-shadow 150ms ease;
}

.app-brand:hover .app-brand__logo[b-ie4kedbiaf] {
    border-color: rgb(var(--tnc-gold-400));
    box-shadow: 0 2px 8px rgb(0 0 0 / 0.25);
}

/* Yellow title on plum, as on the printed banner */
.app-brand__title[b-ie4kedbiaf] {
    color: rgb(var(--tnc-gold-400));
    transition: color 150ms ease;
}

.app-brand:hover .app-brand__title[b-ie4kedbiaf] {
    color: rgb(var(--tnc-gold-300));
}

.app-brand__subtitle[b-ie4kedbiaf] {
    color: rgb(var(--tnc-brand-100));
}

/* Logout button and Login link (a NavLink, hence ::deep) */
.app-header[b-ie4kedbiaf]  .app-header__action {
    color: rgb(var(--tnc-brand-50));
    background-color: rgb(255 255 255 / 0.1);
    border: 1px solid rgb(var(--tnc-gold-600) / 0.6);
    text-decoration: none;
    transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.app-header[b-ie4kedbiaf]  .app-header__action:hover {
    color: rgb(var(--tnc-gold-300));
    background-color: rgb(255 255 255 / 0.18);
    border-color: rgb(var(--tnc-gold-400));
}

.app-header__toggle[b-ie4kedbiaf] {
    color: rgb(var(--tnc-brand-100));
    transition: color 150ms ease, background-color 150ms ease;
}

.app-header__toggle:hover[b-ie4kedbiaf] {
    color: rgb(var(--tnc-gold-300));
    background-color: rgb(255 255 255 / 0.1);
}

.app-header__drawer[b-ie4kedbiaf] {
    border-top: 1px solid rgb(var(--tnc-gold-600) / 0.4);
}

/* ---- User bar ------------------------------------------------------------ */

/* Deep plum strip closed by a gold double rule */
.app-userbar[b-ie4kedbiaf] {
    background-color: rgb(var(--tnc-brand-900));
    color: #fff;
    border-bottom: 1px solid rgb(var(--tnc-gold-600));
    box-shadow: 0 2px 0 0 rgb(var(--tnc-paper)), 0 3px 0 0 rgb(var(--tnc-gold-600) / 0.6);
}

.app-userbar__chip[b-ie4kedbiaf] {
    background-color: rgb(255 255 255 / 0.08);
    border: 1px solid rgb(var(--tnc-gold-600) / 0.35);
}

.app-userbar__label[b-ie4kedbiaf] {
    color: rgb(var(--tnc-gold-400));
}

.app-userbar__value[b-ie4kedbiaf] {
    color: #fff;
}

.app-userbar__value--soft[b-ie4kedbiaf] {
    color: rgb(var(--tnc-brand-100));
}

/* ---- Footer -------------------------------------------------------------- */

.app-footer[b-ie4kedbiaf] {
    background-color: rgb(var(--tnc-paper));
    border-top: 1px solid rgb(var(--tnc-gold-600) / 0.6);
    color: rgb(var(--tnc-slate-500));
}

.app-footer__title[b-ie4kedbiaf] {
    color: rgb(var(--tnc-brand-700));
}
/* /Layout/NavMenu.razor.rz.scp.css */
/* Navigation links on the plum header. NavLink renders its own <a>, so link rules use ::deep. */

.nav-menu--desktop[b-cu3at33a3k] {
    display: none;
    align-items: center;
    gap: 0.25rem;
}

@media (min-width: 768px) {
    .nav-menu--desktop[b-cu3at33a3k] {
        display: flex;
    }
}

@media (min-width: 1024px) {
    .nav-menu--desktop[b-cu3at33a3k] {
        gap: 0.5rem;
    }
}

.nav-menu--mobile[b-cu3at33a3k] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.nav-menu[b-cu3at33a3k]  .nav-menu__link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid transparent;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgb(var(--tnc-brand-100));
    text-decoration: none;
    transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

.nav-menu[b-cu3at33a3k]  .nav-menu__link:hover {
    color: rgb(var(--tnc-gold-300));
    background-color: rgb(255 255 255 / 0.08);
}

/* Active page: yellow-gold pill, like the banner title on plum */
.nav-menu[b-cu3at33a3k]  .nav-menu__link.active {
    color: rgb(var(--tnc-brand-900));
    background-color: rgb(var(--tnc-gold-400));
    border-color: rgb(var(--tnc-gold-300));
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.15);
}

.nav-menu[b-cu3at33a3k]  .nav-menu__link.active:hover {
    color: rgb(var(--tnc-brand-950));
    background-color: rgb(var(--tnc-gold-300));
}

.nav-menu--mobile[b-cu3at33a3k]  .nav-menu__link {
    padding: 0.625rem 0.75rem;
    font-size: 1rem;
}

.nav-menu[b-cu3at33a3k]  .nav-menu__icon {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}