html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: #f6f7f9; /* add: prevent white flash between navigations */
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content { padding-top: 1.1rem; }
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+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA9NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDg2Ni4wNTQ3IDI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) 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; }

/* SINGLE background variant (only airplaneB.jpg) */
.login-bg {
    position:relative;
    min-height:100vh;
    display:flex;
    background:
        linear-gradient(rgba(8,32,68,0.50), rgba(5,25,55,0.65)),
        url("/img/airplaneB.jpg") center/cover no-repeat;
    background-color:#0b3970;
}
@media (max-width:640px){ .login-bg { background-attachment:scroll; } }

.login-bg__overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 75% 20%, rgba(255,255,255,.25), transparent 55%),
        radial-gradient(circle at 25% 70%, rgba(255,255,255,.15), transparent 60%);
    mix-blend-mode: screen;
    opacity: .55;
}

.login-container {
    z-index: 2;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(1.5rem, 3vw, 4rem);
}

.login-card {
    width: min(420px, 100%);
    background: rgba(255,255,255,0.85);
    backdrop-filter: blur(14px) saturate(1.25);
    -webkit-backdrop-filter: blur(14px) saturate(1.25);
    border-radius: 24px;
    padding: 2.2rem 2rem 2.4rem;
    box-shadow:
        0 12px 28px -8px rgba(15,75,145,.35),
        0 4px 12px rgba(0,0,0,.25),
        inset 0 0 0 1px rgba(255,255,255,.4);
    position: relative;
}

.login-card .form-control {
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(0,76,140,.25);
}
.login-card .form-control:focus {
    border-color: #1b7dff;
    box-shadow: 0 0 0 4px rgba(27,125,255,.25);
}

.fancy-heading {
    background-image: linear-gradient(90deg,#0d4fa8,#1d8bff,#40d8ff);
    -webkit-background-clip: text;
    color: transparent;
    letter-spacing:.6px;
    text-shadow: 0 2px 6px rgba(0,80,160,.25);
}

.form-control { background: rgba(255,255,255,0.92); border: 1px solid rgba(0,76,140,.25); transition: border-color .25s, box-shadow .25s, background .3s; }
.form-control:hover { background: rgba(255,255,255,0.97); }
.form-control:focus { border-color: #1b7dff; box-shadow: 0 0 0 4px rgba(27,125,255,.25); }

.floating-field { position:relative; }
.subtle-switch .form-check-input { cursor:pointer; }

.btn-gradient {
    background: linear-gradient(92deg,#1976d2,#1594ff,#00b9ff);
    border: none;
    box-shadow: 0 10px 22px -8px rgba(0,123,255,.55), 0 2px 4px rgba(0,0,0,.25);
    transition: transform .35s cubic-bezier(.16,.7,.3,1), box-shadow .35s, filter .35s;
    position:relative;
    overflow:hidden;
}
.btn-gradient::after {
    content:"";
    position:absolute;
    inset:0;
    background: linear-gradient(110deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.45) 45%, rgba(255,255,255,0) 55%);
    transform: translateX(-120%);
    animation: sheen 5.5s ease-in-out infinite;
    mix-blend-mode: overlay;
}
.btn-gradient:hover { transform: translateY(-3px); box-shadow: 0 16px 32px -10px rgba(0,123,255,.6); filter: brightness(1.05); }
.btn-gradient:active { transform: translateY(-1px) scale(.98); }

@keyframes sheen {
    0%,70% { transform: translateX(-120%) skewX(-12deg); }
    76% { transform: translateX(140%) skewX(-12deg); }
    100% { transform: translateX(140%) skewX(-12deg); }
}

/* Suppliers page custom styles */
.supplier-panel .search-box { min-width: 200px; }
.supplier-table tbody tr.supplier-hidden {
    opacity: .55;
    --bs-table-accent-bg: #f8f9fa;
}
.supplier-table tbody tr.supplier-hidden:hover { opacity: .9; }
.status-btn {
    min-width: 90px;
    background: #fff;
    border: 1px solid #d0d5db;
    color: #555;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    font-weight: 500;
    transition: color .2s, border-color .2s, background-color .2s;
    padding: .25rem .65rem;
}
.status-btn:hover:not(:disabled) {
    background: #f5f7fa;
    border-color: #b5bcc4;
    color: #222;
}
.status-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
}

.status-btn.status-active {
    color: #177245;            /* 深绿色文字 */
    border-color: #9fd8b5;     /* 较柔和的边框 */
    background: #ffffff;       /* 无绿色底色 */
}
.status-btn.status-active:hover:not(:disabled) {
    background: #f2faf5;
    border-color: #68c592;
    color: #0f5c34;
}

.status-btn.status-inactive {
    color: #666;
}
.status-btn.status-inactive:hover:not(:disabled) {
    color: #333;
}

/* 小圆点指示 */
.status-dot {
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    top: 1px;
    background: #ccc;
    box-shadow: 0 0 0 2px #fff inset;
}
.status-dot.dot-on {
    background: #27ae60;
    box-shadow: 0 0 0 2px #fff inset, 0 0 0 2px #bce8cf;
}
.status-dot.dot-off {
    background: #bbb;
}

/* 可选：在隐藏行降低饱和度时仍保留绿色文字的清晰度 */
.supplier-hidden .status-btn.status-active {
    color: #2f8e57;
}

/* Bulk zero (批量清零) button – high-contrast orange */
.btn-zero {
    --zero-bg:#ff7a18;
    --zero-bg-hover:#ff6300;
    --zero-bg-active:#e45500;
    --zero-border:#ff7a18;
    --zero-text:#ffffff;
    color: var(--zero-text);
    background: linear-gradient(90deg,#ff8d2a,#ff7a18);
    border: 1px solid var(--zero-border);
    box-shadow: 0 2px 4px rgba(0,0,0,.18);
    transition: background .25s, box-shadow .25s, transform .15s;
}
.btn-zero:hover:not(:disabled){
    background: linear-gradient(90deg,var(--zero-bg-hover),var(--zero-bg));
    box-shadow: 0 4px 10px -2px rgba(0,0,0,.28);
}
.btn-zero:active:not(:disabled){
    background: var(--zero-bg-active);
    transform: translateY(1px);
    box-shadow: 0 2px 5px -2px rgba(0,0,0,.35);
}
.btn-zero:disabled{
    opacity:.55;
    background: #c8c8c8;
    border-color:#c8c8c8;
    color:#fff;
}

/* Inventory action buttons: keep text on one line so Chinese 两字 不竖排 */
.inventory-page .table .btn-group .btn,
.inventory-page .table td .btn {
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: normal;
    min-width: 46px; /* 调整为合适的最小宽度，确保两字能并排显示 */
    padding: .25rem .4rem; /* 保持按钮内间距 */
}

/* Home announcement board */
.home-announce {
    --announce-bg: rgba(248, 250, 255, 0.92);
    --announce-border: rgba(13, 64, 140, 0.12);
    --announce-meta: rgba(255, 255, 255, 0.72);
    --announce-meta-border: rgba(255, 255, 255, 0.25);
}

.home-announce .announce-scroll {
    max-height: 220px;
    overflow: auto;
}

.home-announce .announce-item {
    padding: .5rem 0;
    border-bottom: 1px solid rgba(255,255,255,.12);
}

.home-announce .announce-meta {
    font-size: .78rem;
    line-height: 1.1;
    color: rgba(255,255,255,.70);
}

.home-announce .announce-meta .name {
    font-weight: 600;
    color: rgba(255,255,255,.85);
}

.home-announce .announce-meta .time {
    color: rgba(255,255,255,.65);
    white-space: nowrap;
}

.home-announce .announce-content {
    margin-top: .25rem;
    background: var(--announce-bg);
    border: 1px solid var(--announce-border);
    border-radius: .5rem;
    padding: .45rem .55rem;
    font-size: .95rem;
    color: #0b1b33;
}