h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.public-form-shell {
    min-height: 100vh;
    background: radial-gradient(circle at top, #223c4a 0, #101820 45%, #091014 100%);
    padding: 1rem;
}

.public-form-brand {
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    font-weight: 800;
    letter-spacing: .12em;
    margin-bottom: 1.5rem;
}

.position-relative { position: relative; }
.overflow-hidden { overflow: hidden; }

.product-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.product-card-media {
    position: relative;
    height: 200px;
    background: #050811;
    cursor: pointer;
}

@media (min-width: 900px) {
    .product-card-grid {
        grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
        gap: 1.25rem;
    }
}

@media (max-width: 640px) {
    .product-card-grid {
        gap: 0.65rem;
    }
    .product-card-media {
        height: 135px;
    }
    .product-card-grid .mud-card-content {
        padding: 0.65rem !important;
    }
    .product-card-grid .mud-card-actions {
        padding: 0 0.65rem 0.65rem 0.65rem !important;
    }
    .product-card-grid .mud-typography-h6 {
        font-size: 0.95rem !important;
        line-height: 1.25 !important;
    }
    .product-card-grid .mud-typography-body2 {
        font-size: 0.78rem !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

@media (max-width: 310px) {
    .product-card-grid {
        grid-template-columns: 1fr;
    }
}

.app-logo-link { display:flex; align-items:center; height:44px; max-width:min(42vw,260px); }
.app-logo { display:block; width:auto; max-width:100%; height:40px; object-fit:contain; }

.landing-hero {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: clamp(220px, 34vw, 380px);
    background-color: #050811;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.landing-hero-parallax-bg {
    position: absolute;
    inset: -26% 0;
    background-image:
        radial-gradient(circle at center, rgba(5, 8, 17, 0.32) 0%, rgba(5, 8, 17, 0.72) 100%),
        url('/images/Banner.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transform: translate3d(0, var(--parallax-bg-y, 0px), 0) scale(1.06);
    will-change: transform;
    pointer-events: none;
}

.landing-hero-logo {
    position: relative;
    z-index: 1;
    display: block;
    width: min(290px, 68vw);
    max-height: calc(100% - 1rem);
    object-fit: contain;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.85));
    transform: translate3d(0, var(--parallax-fg-y, 0px), 0);
    will-change: transform;
}

@media (max-width: 600px) {
    .app-logo-link { height:34px; max-width:38vw; }
    .app-logo { height:30px; }
    .landing-hero {
        height: clamp(180px, 48vw, 240px);
        padding: 1rem;
    }
    .landing-hero-logo {
        width: min(210px, 64vw);
    }
}

.public-form-card { border-top: 7px solid #e0aa3e; }

.signin-shell { min-height: calc(100vh - 2rem); display: flex; align-items: center; justify-content: center; }
.signin-card { width: 100%; border-top: 6px solid #e0aa3e; }
.signin-logo { display: block; width: min(230px, 70%); max-height: 120px; object-fit: contain; }

.public-product-image-wrap { height: 340px; position: relative; background: #050811; }
.public-product-image { width: 100%; height: 100%; object-fit: cover; }
.public-product-image-shade { position: absolute; inset: 0; background: linear-gradient(transparent 35%, rgba(0,0,0,.9)); }
.public-product-title { position: absolute; left: 1.5rem; right: 1.5rem; bottom: 1.5rem; }
.public-product-stat { height: 100%; padding: .75rem; border: 1px solid rgba(148,163,184,.25); border-radius: .5rem; text-align: center; }
.public-product-stat span { display: block; color: #64748b; font-size: .65rem; font-weight: 700; letter-spacing: .08em; }
.public-product-stat strong { display: block; margin-top: .2rem; font-size: .85rem; }

@media (max-width: 600px) {
    .public-form-shell { padding: 0; }
    .public-product-image-wrap { height: 270px; }
}

.public-demo-container { padding-top: .75rem; padding-bottom: 6rem; }
.demo-header { position: sticky; top: 0; z-index: 5; display:flex; justify-content:space-between; align-items:center; padding:.5rem .75rem; margin:0 0 .6rem; color:white; background:rgba(9,16,20,.94); border-radius:.65rem; }
.demo-header div { display:flex; flex-direction:column; min-width:0; }.demo-header strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.demo-header span { font-size:.72rem; color:#94a3b8; }
.public-demo-card { padding:1rem; border-top:4px solid var(--form-accent, #e0aa3e); border-radius:.75rem; overflow:hidden; }
.demo-brand { display:flex; align-items:center; gap:.55rem; min-width:0; }.demo-brand>img { width:38px; height:38px; object-fit:contain; border-radius:.3rem; }.demo-brand>span { display:flex; flex-direction:column; min-width:0; }.demo-brand small { color:#94a3b8; font-size:.68rem; }
.demo-product-compact { display:grid; grid-template-columns:100px 1fr; gap:.9rem; align-items:center; }.demo-product-compact img { width:100px; height:86px; object-fit:cover; border-radius:.55rem; background:#050811; }.demo-product-name { font-size:1.08rem !important; line-height:1.2 !important; font-weight:750 !important; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.demo-description { margin:.75rem 0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }.demo-questions { border-top:1px solid rgba(148,163,184,.25); padding-top:.75rem; }
.demo-floating-nav { position:fixed; z-index:8; bottom:calc(.75rem + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); width:min(94%,620px); display:flex; align-items:center; gap:.75rem; padding:.55rem; background:rgba(255,255,255,.97); border-radius:1rem; box-shadow:0 8px 30px rgba(0,0,0,.3); }.demo-progress{height:5px;flex:1;background:#e2e8f0;border-radius:5px;overflow:hidden}.demo-progress span{display:block;height:100%;background:var(--form-accent,#10b981);transition:width .2s}
.demo-toc-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:10}.demo-toc{position:fixed;z-index:11;top:0;right:0;bottom:0;width:min(88vw,390px);background:white;padding:1rem;overflow:auto;box-shadow:-10px 0 35px rgba(0,0,0,.3)}.demo-toc>button{width:100%;display:grid;grid-template-columns:28px 48px 1fr;gap:.6rem;align-items:center;text-align:left;border:0;border-radius:.55rem;background:transparent;padding:.5rem;margin:.15rem 0;color:inherit}.demo-toc>button.active{background:rgba(16,185,129,.12)}.demo-toc>button>span{font-weight:800;color:#10b981}.demo-toc img{width:48px;height:42px;object-fit:cover;border-radius:.35rem}.demo-toc button div{display:flex;flex-direction:column;min-width:0}.demo-toc button strong{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-toc button small{color:#64748b}
.builder-product-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.4rem;max-height:260px;overflow:auto}.builder-product-picker button,.builder-lineup>div{display:grid;grid-template-columns:48px 1fr 28px;gap:.6rem;align-items:center;border:1px solid rgba(148,163,184,.3);background:transparent;color:inherit;border-radius:.55rem;padding:.45rem;text-align:left}.builder-product-picker img,.builder-lineup img{width:48px;height:44px;object-fit:cover;border-radius:.35rem}.builder-product-picker span,.builder-lineup span{display:flex;flex-direction:column;min-width:0}.builder-product-picker strong,.builder-lineup strong{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.builder-product-picker small,.builder-lineup small{font-size:.7rem;color:#64748b}.builder-lineup{display:flex;flex-direction:column;gap:.35rem}.builder-lineup>div{grid-template-columns:28px 48px 1fr 40px 40px 40px}.builder-order{font-weight:800;color:#10b981}.builder-preview{max-width:620px;margin:auto}
.builder-pages-panel { position:sticky; top:1rem; }.builder-page-list { display:flex; flex-direction:column; gap:.3rem; max-height:480px; overflow:auto; }.builder-page-list>button { display:grid; grid-template-columns:26px 42px 1fr; align-items:center; gap:.5rem; width:100%; border:0; border-radius:.5rem; padding:.45rem; color:inherit; background:transparent; text-align:left; }.builder-page-list>button.active { background:rgba(16,185,129,.13); outline:1px solid rgba(16,185,129,.35); }.builder-page-list img { width:42px; height:38px; object-fit:cover; border-radius:.3rem; }.builder-page-list button>span { font-weight:800; color:#10b981; }.builder-page-list button>div { display:flex; flex-direction:column; min-width:0; }.builder-page-list strong { font-size:.8rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.builder-page-list small { color:#64748b; font-size:.68rem; }
.builder-preview-dialog { border-top:4px solid var(--form-accent,#10b981); padding:.5rem .25rem; }.preview-brand { padding-bottom:.65rem; border-bottom:1px solid rgba(148,163,184,.25); }