html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

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+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;
}

/* ── SuperUser / MyAddresses / MyOrders shared globals ── */
.su-page,.addr-page,.ord-page{min-height:100vh;background:#f8fafc;padding:1.5rem 1rem}
.su-wrap,.addr-wrap,.ord-wrap{max-width:720px;margin:0 auto}
.su-header,.addr-header,.ord-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;flex-wrap:wrap;gap:.75rem}
.su-title,.addr-title,.ord-title{font-size:1.4rem;font-weight:700;color:#1e293b;margin:0}
.su-sub,.ord-sub{color:#64748b;font-size:.88rem;margin-bottom:1.25rem}
.su-link{color:#6d28d9;font-size:.88rem;text-decoration:none}
.su-link:hover{text-decoration:underline}
.su-loading,.addr-loading,.ord-loading{text-align:center;color:#64748b;padding:2rem}
.su-empty,.addr-empty,.ord-empty{text-align:center;color:#64748b;padding:2rem;font-size:.95rem}
.su-empty-icon,.addr-empty-icon,.ord-empty-icon{font-size:2.5rem;margin-bottom:.75rem}
.su-btn-primary{background:#6d28d9;color:#fff;border:none;border-radius:8px;padding:.5rem 1.1rem;font-size:.9rem;cursor:pointer}
.su-btn-primary:hover{background:#5b21b6}
.su-btn-primary:disabled{opacity:.6;cursor:not-allowed}
.su-btn-sm{background:transparent;border:1px solid #cbd5e1;border-radius:6px;padding:.3rem .8rem;font-size:.82rem;cursor:pointer}
.su-btn-approve{background:#dcfce7;color:#15803d;border:none;border-radius:7px;padding:.4rem .9rem;font-size:.85rem;cursor:pointer}
.su-btn-approve:hover{background:#bbf7d0}
.su-btn-reject{background:#fee2e2;color:#dc2626;border:none;border-radius:7px;padding:.4rem .9rem;font-size:.85rem;cursor:pointer}
.su-btn-reject:hover{background:#fecaca}
.su-banner,.addr-banner{display:flex;align-items:center;justify-content:space-between;border-radius:8px;padding:.75rem 1rem;margin-bottom:1rem;font-size:.9rem}
.su-banner button,.addr-banner-close{background:none;border:none;cursor:pointer;font-size:1.1rem;color:inherit}
.su-banner-ok,.addr-banner-ok{background:#dcfce7;color:#15803d}
.su-banner-err,.addr-banner-err{background:#fee2e2;color:#dc2626}
.su-list,.addr-list{display:flex;flex-direction:column;gap:.7rem}
.su-card,.addr-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.addr-card.is-default{border-color:#a78bfa}
.su-card-info,.addr-card-info{flex:1}
.su-card-name,.addr-card-name{font-weight:600;color:#1e293b;margin-bottom:.2rem;display:flex;align-items:center;gap:.5rem}
.su-card-email,.addr-card-email{font-size:.83rem;color:#64748b}
.addr-card-line{font-size:.85rem;color:#64748b}
.su-card-actions,.addr-card-actions{display:flex;flex-direction:column;gap:.4rem}
.addr-tag,.su-tag{font-size:.75rem;font-weight:600;border-radius:20px;padding:.2rem .7rem;white-space:nowrap}
.addr-tag,.su-tag-ok{background:#ede9fe;color:#6d28d9}
.su-tag-used{background:#f1f5f9;color:#64748b}
.su-discount-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:1.5rem}
.su-discount-current{font-size:1rem;color:#374151;margin-bottom:1.25rem}
.su-field{margin-bottom:1rem;display:flex;flex-direction:column;gap:.35rem}
.su-field label{font-size:.82rem;font-weight:500;color:#374151}
.su-input{border:1px solid #cbd5e1;border-radius:8px;padding:.55rem .9rem;font-size:.9rem;outline:none}
.su-input:focus{border-color:#8b5cf6}
.su-newlink{background:#ede9fe;border-radius:10px;padding:1rem 1.25rem;margin-bottom:1.25rem}
.su-newlink-label{font-size:.8rem;font-weight:600;color:#6d28d9;margin-bottom:.35rem}
.su-newlink-url{font-size:.85rem;color:#374151;word-break:break-all;margin-bottom:.5rem}
.su-table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e2e8f0}
.su-table th{background:#f8fafc;padding:.7rem 1rem;font-size:.82rem;font-weight:600;color:#64748b;text-align:left}
.su-table td{padding:.75rem 1rem;font-size:.85rem;color:#374151;border-top:1px solid #f1f5f9}
.su-code{background:#f1f5f9;border-radius:4px;padding:.1rem .4rem;font-family:monospace;font-size:.85rem}
/* addr modal */
.addr-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;z-index:1000}
.addr-modal{background:#fff;border-radius:16px;width:100%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.addr-modal-head{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid #e2e8f0;font-weight:600;font-size:1rem}
.addr-icon-btn{background:none;border:none;cursor:pointer;font-size:1.4rem;color:#64748b}
.addr-modal-body{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:.9rem}
.addr-modal-foot{padding:1rem 1.5rem;border-top:1px solid #e2e8f0;display:flex;gap:.75rem;justify-content:flex-end}
.addr-field{display:flex;flex-direction:column;gap:.3rem}
.addr-field label{font-size:.82rem;font-weight:500;color:#374151}
.addr-input{border:1px solid #cbd5e1;border-radius:8px;padding:.6rem .9rem;font-size:.9rem;outline:none}
.addr-input:focus{border-color:#8b5cf6}
.addr-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.addr-check{display:flex;align-items:center;gap:.5rem;font-size:.85rem;cursor:pointer}
.addr-form-error{background:#fee2e2;color:#dc2626;border-radius:8px;padding:.6rem .9rem;font-size:.85rem}
.addr-btn-primary{background:#6d28d9;color:#fff;border:none;border-radius:8px;padding:.5rem 1.1rem;font-size:.9rem;cursor:pointer}
.addr-btn-primary:hover:not(:disabled){background:#5b21b6}
.addr-btn-primary:disabled{background:#cbd5e1;color:#f8fafc;cursor:not-allowed;opacity:.75}
.addr-btn-ghost{background:transparent;border:1px solid #cbd5e1;border-radius:8px;padding:.4rem .9rem;font-size:.85rem;cursor:pointer}
.addr-btn-sm{background:transparent;border:1px solid #e2e8f0;border-radius:6px;padding:.3rem .8rem;font-size:.8rem;cursor:pointer}
.addr-btn-danger{background:transparent;border:1px solid #fca5a5;color:#dc2626;border-radius:8px;padding:.4rem .9rem;font-size:.85rem;cursor:pointer}
/* ord */
.ord-link{display:inline-block;margin-top:.75rem;color:#6d28d9;font-size:.9rem}
.ord-list{display:flex;flex-direction:column;gap:.9rem}
.ord-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:1.1rem 1.25rem}
.ord-card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.75rem;gap:1rem}
.ord-card-date{font-size:.82rem;color:#64748b;margin-bottom:.2rem}
.ord-card-addr{font-size:.85rem;color:#374151;line-height:1.5}
.ord-status{font-size:.78rem;font-weight:600;border-radius:20px;padding:.25rem .75rem;white-space:nowrap}
.status-pending{background:#fef3c7;color:#b45309}
.status-confirmed{background:#dbeafe;color:#1d4ed8}
.status-shipping{background:#e0f2fe;color:#0369a1}
.status-delivered{background:#dcfce7;color:#15803d}
.status-cancelled{background:#fee2e2;color:#dc2626}
.ord-card-amounts{font-size:.88rem;color:#374151;display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:.6rem}
.ord-discount{color:#dc2626}
.ord-final{color:#16a34a}
.ord-note{font-size:.82rem;color:#6b7280;font-style:italic;margin-bottom:.6rem}
.ord-details{margin-top:.5rem}
.ord-details summary{font-size:.85rem;cursor:pointer;color:#6d28d9}
.ord-items{list-style:none;padding:.5rem 0 0 0;margin:0;display:flex;flex-direction:column;gap:.35rem}
.ord-items li{display:flex;justify-content:space-between;font-size:.85rem;color:#374151;padding:.3rem 0;border-bottom:1px dashed #e2e8f0}
.ord-items-loading{font-size:.82rem;color:#94a3b8;padding:.5rem 0}
/* ── ManageUser ── */
.mu-wrap{max-width:860px;margin:0 auto}
.mu-filters{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}
.mu-filter-btn{background:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;padding:.35rem .9rem;font-size:.82rem;cursor:pointer;color:#475569}
.mu-filter-btn.active{background:#6d28d9;color:#fff;border-color:#6d28d9}
.mu-card{flex-wrap:wrap}
.mu-card-right{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.mu-role-tag{font-size:.72rem;font-weight:600;border-radius:20px;padding:.15rem .6rem}
.mu-role-0{background:#f1f5f9;color:#64748b}
.mu-role-1{background:#dbeafe;color:#1d4ed8}
.mu-role-2{background:#fce7f3;color:#be185d}
.mu-status{font-size:.78rem;font-weight:600;border-radius:20px;padding:.2rem .65rem;white-space:nowrap}
.mu-status-0{background:#fef3c7;color:#b45309}
.mu-status-1{background:#dcfce7;color:#15803d}
.mu-status-2{background:#fee2e2;color:#dc2626}
.mu-meta{font-size:.78rem;color:#94a3b8;margin-top:.15rem}
.mu-role-select{border:1px solid #cbd5e1;border-radius:6px;padding:.3rem .5rem;font-size:.82rem;outline:none;cursor:pointer}
.mu-role-select:focus{border-color:#8b5cf6}
.mu-modal{background:#fff;border-radius:16px;width:100%;max-width:540px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.mu-modal-body{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:.75rem}
.mu-status-row{padding:.5rem 0;border-bottom:1px solid #f1f5f9}
.mu-pages-title{font-size:.85rem;font-weight:600;color:#374151;margin-top:.25rem}
.mu-pages-grid{display:flex;flex-direction:column;gap:.5rem}
.mu-check{display:flex;align-items:center;gap:.5rem;font-size:.85rem;cursor:pointer}
.mu-page-link{font-size:.75rem;color:#94a3b8;font-family:monospace}

/* Square Payment */
.sq-summary{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem;padding:.75rem;background:#f8fafc;border-radius:8px}
.sq-summary-row{display:flex;justify-content:space-between;font-size:.9rem;color:#475569}
.sq-summary-row.sq-total{font-size:1.05rem;color:#1e293b;border-top:1px solid #e2e8f0;padding-top:.5rem;margin-top:.25rem}
.sq-card-label{font-size:.85rem;font-weight:600;color:#374151;margin-bottom:.5rem}
#sq-card-container{border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;background:#fff}

/* Checkout stepper */
.checkout-steps{display:flex;align-items:center;justify-content:center;gap:0;padding:.75rem 1rem;border-bottom:1px solid #f1f5f9}
.ck-step{display:flex;align-items:center;gap:.35rem;font-size:.75rem;color:#94a3b8;font-weight:500;white-space:nowrap}
.ck-num{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#e2e8f0;color:#94a3b8;font-size:.7rem;font-weight:700}
.ck-step--active{color:#6d28d9;font-weight:600}
.ck-step--active .ck-num{background:#7c3aed;color:#fff}
.ck-step--done{color:#22c55e;font-weight:600}
.ck-step--done .ck-num{background:#22c55e;color:#fff;font-size:.65rem}
.ck-step-line{width:32px;height:2px;background:#e2e8f0;flex-shrink:0;margin:0 .35rem}
.ck-step-line--done{background:#22c55e}