/* Shared application polish and Identity compatibility */
html { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.app-shell { position: relative; overflow-x: hidden; background: radial-gradient(circle at 15% 10%, rgba(37, 99, 235, .45), transparent 34%), radial-gradient(circle at 90% 85%, rgba(14, 165, 233, .25), transparent 34%), linear-gradient(135deg, #07152f 0%, #0f2d63 52%, #123f8f 100%); }
.app-shell > .min-h-screen { position: relative; z-index: 1; }
.app-background-decor { pointer-events: none; position: fixed; inset: 0; z-index: 0; overflow: hidden; }
.app-background-decor::after { content: ""; position: absolute; right: -8rem; top: 5rem; height: 18rem; width: 62%; opacity: .8; background: linear-gradient(145deg, transparent 15%, rgba(147,197,253,.24) 42%, rgba(191,219,254,.16) 58%, transparent 82%); border-radius: 48% 52% 42% 58%; transform: rotate(-8deg); filter: blur(1px); }
.app-orbit { position: absolute; border: 1px solid rgba(255, 255, 255, .1); border-radius: 999px; }
.app-orbit-one { left: -8rem; top: -8rem; height: 32rem; width: 32rem; }
.app-orbit-two { left: -3rem; top: -3rem; height: 22rem; width: 22rem; }
.app-glow { position: absolute; border-radius: 999px; background: rgba(96, 165, 250, .13); filter: blur(60px); }
.app-glow-top { right: -10rem; top: -9rem; height: 34rem; width: 34rem; }
.app-glow-bottom { bottom: -15rem; left: 50%; height: 36rem; width: 36rem; transform: translateX(-50%); background: rgba(59, 130, 246, .12); }
.app-sidebar { background: linear-gradient(180deg, rgba(7, 21, 47, .98), rgba(13, 45, 104, .96)); color: #dbeafe; }
.app-sidebar a.text-slate-950 { color: #fff !important; }
.app-sidebar .bg-blue-50 { background: rgba(147, 197, 253, .15) !important; color: #bfdbfe !important; }
.app-sidebar .border-slate-100 { border-color: rgba(255, 255, 255, .12) !important; }
.app-sidebar .text-slate-800, .app-sidebar .text-slate-500 { color: #dbeafe !important; }
.app-sidebar .text-slate-400 { color: #93c5fd !important; }
.app-sidebar .sidebar-link { color: #bfdbfe; }
.app-sidebar .sidebar-link:hover { background: rgba(147, 197, 253, .14); color: #fff; }
.app-sidebar .sidebar-link-active { background: linear-gradient(135deg, #3b82f6, #2563eb); color: #fff; box-shadow: 0 12px 28px rgba(0, 0, 0, .24); }
.app-sidebar .sidebar-link-active:hover { background: linear-gradient(135deg, #60a5fa, #2563eb); color: #fff; }
.app-sidebar form button { color: #bfdbfe; }
.app-sidebar form button:hover { background: rgba(147, 197, 253, .14); color: #fff; }
.app-sidebar .account-panel { color: #0f172a; }
.app-sidebar .account-panel .text-slate-800 { color: #1e293b !important; }
.app-sidebar .account-panel .text-slate-400 { color: #64748b !important; }
.app-sidebar .account-panel form button { background: #dbeafe !important; color: #1d4ed8 !important; }
.app-sidebar .account-panel form button:hover { background: #2563eb !important; color: #fff !important; }
.app-topbar { background: rgba(7, 21, 47, .35); }
.app-card { border: 1px solid rgba(255, 255, 255, .72); border-radius: 1.25rem; background: rgba(255, 255, 255, .98); box-shadow: 0 18px 45px rgba(2, 18, 53, .16), 0 2px 5px rgba(2, 18, 53, .08); }
.metric-card { min-height: 156px; border: 1px solid rgba(255, 255, 255, .9); border-radius: 1.25rem; background: linear-gradient(145deg, #fff, #f4f8ff); padding: 1.25rem; box-shadow: 0 16px 35px rgba(2, 18, 53, .14), inset 0 1px rgba(255, 255, 255, .9); transition: transform .2s ease, box-shadow .2s ease; }
.metric-card:hover { transform: translateY(-3px); box-shadow: 0 22px 45px rgba(2, 18, 53, .2), inset 0 1px rgba(255, 255, 255, .9); }
.metric-card-blue { border-color: rgba(147, 197, 253, .3); background: linear-gradient(145deg, #2563eb, #1647a5); box-shadow: 0 18px 40px rgba(7, 35, 101, .38); }
.metric-label { color: #64748b; font-size: .875rem; }
.metric-value { margin-top: .55rem; color: #0f172a; font-size: 2rem; font-weight: 800; letter-spacing: -.04em; }
.metric-foot { margin-top: .55rem; font-size: .75rem; font-weight: 600; }
.metric-icon { display: inline-flex; height: 2rem; width: 2rem; align-items: center; justify-content: center; border-radius: .7rem; font-size: .9rem; font-weight: 800; }
.activity-row { display: flex; align-items: center; gap: .85rem; padding: 1.05rem 1.5rem; transition: background .18s ease, padding-left .18s ease; }
.activity-row:hover { background: #f5f9ff; padding-left: 1.7rem; }
.activity-dot { height: .55rem; width: .55rem; flex: 0 0 auto; border-radius: 999px; background: #60a5fa; box-shadow: 0 0 0 4px #dbeafe; }
.status-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: .3rem .65rem; font-size: .7rem; font-weight: 700; white-space: nowrap; }
.status-new, .status-triaged { background: #eff6ff; color: #2563eb; }
.status-awaitingapproval { background: #fff7ed; color: #c2410c; }
.status-inprogress { background: #ecfeff; color: #0e7490; }
.status-resolved, .status-closed, .status-paid { background: #ecfdf5; color: #047857; }
.invoice-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 1px solid #e5edf8; border-radius: .9rem; background: #f8fbff; padding: .9rem 1rem; }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 170px; padding: 1.5rem; text-align: center; }
.empty-state-icon { display: inline-flex; height: 2.75rem; width: 2.75rem; align-items: center; justify-content: center; border-radius: .9rem; background: #eff6ff; color: #2563eb; font-size: 1.2rem; }
.app-shell table { border-collapse: separate; border-spacing: 0; }
.app-shell table thead { background: linear-gradient(180deg, #f8fbff, #eef5ff); }
.app-shell table th { color: #64748b; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.app-shell table tbody tr { transition: background .18s ease, box-shadow .18s ease; }
.app-shell table tbody tr:hover { background: #f5f9ff; box-shadow: inset 3px 0 #3b82f6; }
.app-shell table tbody td { border-color: #e8eef7; }
.app-shell main .rounded-2xl.border.border-slate-200.bg-white,
.app-shell main .rounded-3xl.border.border-white\/80.bg-white,
.app-shell main .rounded-3xl.border.border-slate-200.bg-white {
  border-color: rgba(191, 219, 254, .9) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.99), rgba(244,248,255,.97)) !important;
  box-shadow: 0 18px 42px rgba(2, 18, 53, .16), 0 2px 5px rgba(2, 18, 53, .08) !important;
}
.app-shell main .rounded-2xl.border.border-slate-200.bg-white:hover,
.app-shell main .rounded-3xl.border.border-white\/80.bg-white:hover,
.app-shell main .rounded-3xl.border.border-slate-200.bg-white:hover { box-shadow: 0 24px 52px rgba(2, 18, 53, .21), 0 3px 8px rgba(2, 18, 53, .1) !important; }
.app-shell main a.rounded-xl.bg-blue-600,
.app-shell main button.rounded-xl.bg-blue-600,
.app-shell main button.bg-blue-600 { box-shadow: 0 10px 22px rgba(37, 99, 235, .32); transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.app-shell main a.rounded-xl.bg-blue-600:hover,
.app-shell main button.rounded-xl.bg-blue-600:hover,
.app-shell main button.bg-blue-600:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(37, 99, 235, .42); }
.app-shell main .divide-y > * + * { border-color: #e5edf8; }
.app-shell main .bg-slate-50 { background: #f4f8ff !important; }
.app-shell main .bg-blue-50 { background: #eaf3ff !important; }
.app-shell main .border-slate-100 { border-color: #e5edf8 !important; }
.app-shell main .text-slate-500 { color: #607494 !important; }
.app-shell main .text-slate-400 { color: #8193af !important; }
.app-shell main .rounded-full { letter-spacing: .01em; }
.app-shell main h1 { color: #fff !important; }
.app-shell main > div > div > p.text-blue-600 { color: #93c5fd !important; }
.app-shell main > div > div > p.text-slate-500 { color: rgba(219, 234, 254, .78) !important; }
.app-shell main > div > a.text-blue-600 { color: #bfdbfe !important; }
.app-shell main > div > a.text-blue-600:hover { color: #fff !important; }
@media (max-width: 639px) { .metric-card { min-height: 140px; } .activity-row { padding-left: 1rem; padding-right: 1rem; } .activity-row:hover { padding-left: 1.1rem; } }
input, select, textarea { outline: none; }
input:focus, select:focus, textarea:focus { border-color: #2563eb !important; box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.identity-card { width: min(100%, 480px); margin: 3rem auto; }
.identity-card h1 { font-size: 1.875rem; font-weight: 800; letter-spacing: -.025em; }
.identity-card label { display: block; margin-bottom: .5rem; font-weight: 600; font-size: .875rem; color: #334155; }
.identity-card input[type=email], .identity-card input[type=password], .identity-card input[type=text] { width: 100%; border: 1px solid #cbd5e1; border-radius: .75rem; padding: .75rem 1rem; }
.identity-card button[type=submit] { width: 100%; border-radius: .75rem; background: #2563eb; color: white; padding: .75rem 1rem; font-weight: 700; border: 0; cursor: pointer; }
.identity-card button[type=submit]:hover { background: #1d4ed8; }
.identity-card a { color: #2563eb; }
.identity-card .text-danger, .identity-card .validation-summary-errors { color: #dc2626; font-size: .875rem; }
.login-support-art { pointer-events: none; position: absolute; inset: 0; overflow: hidden; opacity: .8; }
.landing-page { position: relative; background: radial-gradient(circle at 15% 10%, rgba(37, 99, 235, .45), transparent 34%), radial-gradient(circle at 90% 85%, rgba(14, 165, 233, .25), transparent 34%), linear-gradient(135deg, #07152f 0%, #0f2d63 52%, #123f8f 100%); }
.landing-art { pointer-events: none; position: absolute; inset: 0; overflow: hidden; }
.landing-orbit { position: absolute; border: 1px solid rgba(147, 197, 253, .18); border-radius: 999px; animation: support-drift 20s ease-in-out infinite alternate; }
.landing-orbit-a { left: -12rem; top: 4%; height: 42rem; width: 68rem; transform: rotate(-18deg); }
.landing-orbit-b { right: -12rem; bottom: -16rem; height: 40rem; width: 40rem; animation-direction: alternate-reverse; }
.landing-line { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, rgba(147, 197, 253, .42), transparent); animation: support-line-glow 4s ease-in-out infinite; }
.landing-line-a { left: 5%; top: 38%; width: 30rem; transform: rotate(18deg); }
.landing-line-b { right: 4%; top: 66%; width: 24rem; transform: rotate(-24deg); animation-delay: 1.2s; }
.landing-node { position: absolute; display: flex; height: 2.8rem; width: 2.8rem; align-items: center; justify-content: center; border: 1px solid rgba(191, 219, 254, .35); border-radius: 1rem; background: rgba(96, 165, 250, .15); color: #dbeafe; box-shadow: 0 0 30px rgba(96, 165, 250, .22); font-weight: 800; animation: support-float 6s ease-in-out infinite; }
.landing-node-a { left: 10%; top: 27%; }
.landing-node-b { right: 11%; top: 20%; animation-delay: -2s; }
.landing-node-c { right: 8%; bottom: 16%; animation-delay: -4s; }
.landing-pulse { position: absolute; left: 52%; top: 15%; height: .7rem; width: .7rem; border-radius: 999px; background: #34d399; animation: support-pulse 2.8s ease-out infinite; }
.landing-preview { animation: landing-lift 7s ease-in-out infinite; }
@keyframes landing-lift { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-8px) rotate(.5deg); } }
.support-orbit { position: absolute; border: 1px solid rgba(147, 197, 253, .2); border-radius: 999px; transform: rotate(-18deg); animation: support-drift 18s ease-in-out infinite alternate; }
.support-orbit-a { left: -7rem; top: 16%; height: 31rem; width: 48rem; }
.support-orbit-b { right: -11rem; bottom: -8rem; height: 35rem; width: 35rem; animation-duration: 24s; animation-direction: alternate-reverse; }
.support-line { position: absolute; height: 1px; transform-origin: left center; background: linear-gradient(90deg, transparent, rgba(147, 197, 253, .42), transparent); animation: support-line-glow 4s ease-in-out infinite; }
.support-line-a { left: 10%; top: 38%; width: 24rem; transform: rotate(18deg); }
.support-line-b { right: 8%; top: 67%; width: 20rem; transform: rotate(-28deg); animation-delay: 1.5s; }
.support-node { position: absolute; display: flex; height: 2.8rem; width: 2.8rem; align-items: center; justify-content: center; border: 1px solid rgba(191, 219, 254, .38); border-radius: 1rem; background: rgba(96, 165, 250, .18); color: #dbeafe; box-shadow: 0 0 30px rgba(96, 165, 250, .24); animation: support-float 6s ease-in-out infinite; }
.support-node i { font-style: normal; font-size: 1rem; font-weight: 800; }
.support-node-a { left: 13%; top: 31%; animation-delay: -.8s; }
.support-node-b { right: 16%; top: 26%; animation-delay: -2.6s; }
.support-node-c { right: 12%; bottom: 20%; animation-delay: -4.1s; }
.support-pulse { position: absolute; left: 50%; top: 23%; height: .7rem; width: .7rem; border-radius: 999px; background: #34d399; box-shadow: 0 0 0 0 rgba(52, 211, 153, .6); animation: support-pulse 2.8s ease-out infinite; }
@keyframes support-float { 0%, 100% { transform: translate3d(0, 0, 0); } 50% { transform: translate3d(0, -12px, 0); } }
@keyframes support-drift { from { transform: rotate(-18deg) translate3d(-8px, 0, 0); } to { transform: rotate(-12deg) translate3d(12px, 12px, 0); } }
@keyframes support-line-glow { 0%, 100% { opacity: .25; } 50% { opacity: .9; } }
@keyframes support-pulse { 0% { box-shadow: 0 0 0 0 rgba(52, 211, 153, .55); } 70% { box-shadow: 0 0 0 18px rgba(52, 211, 153, 0); } 100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); } }
@media (prefers-reduced-motion: reduce) { .support-orbit, .support-line, .support-node, .support-pulse { animation: none; } }

/* ASP.NET Identity's built-in pages use Bootstrap-shaped class names. Keep them
   presentation-ready without forcing the full Bootstrap bundle into the app. */
.row { display: flex; flex-wrap: wrap; gap: 2rem; }
.col-md-6 { flex: 1 1 22rem; min-width: 0; }
.form-floating { position: relative; margin-bottom: 1rem; }
.form-floating > .form-control { width: 100%; padding: 1rem .9rem .45rem; }
.form-floating > label { position: absolute; top: .65rem; left: .9rem; color: #64748b; pointer-events: none; }
.form-control { display: block; width: 100%; border: 1px solid #cbd5e1; border-radius: .75rem; padding: .7rem .9rem; background: #fff; }
.form-check { display: flex; gap: .55rem; align-items: center; margin: 1rem 0; }
.form-check-input { width: 1rem; height: 1rem; accent-color: #2563eb; }
.btn { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: .75rem; padding: .7rem 1rem; font-weight: 700; cursor: pointer; }
.btn-primary { background: #2563eb; color: #fff; }
.btn-primary:hover { background: #1d4ed8; }
.btn-lg { width: 100%; }
.text-danger { color: #dc2626; font-size: .875rem; }
.text-center { text-align: center; }
.mb-3 { margin-bottom: 1rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.pb-2 { padding-bottom: .5rem; }
.border-bottom { border-bottom: 1px solid #e2e8f0; }
.sidebar-link { display: flex; align-items: center; gap: .75rem; white-space: nowrap; border-radius: .8rem; padding: .7rem .8rem; color: #64748b; font-size: .875rem; font-weight: 600; transition: all .18s ease; }
.sidebar-link:hover { background: #eff6ff; color: #2563eb; }
.sidebar-link-active { background: #2563eb; color: #fff; box-shadow: 0 10px 22px rgba(37, 99, 235, .18); }
.sidebar-link-active:hover { background: #1d4ed8; color: #fff; }
.sidebar-icon { display: inline-flex; width: 1.4rem; justify-content: center; font-size: 1.05rem; line-height: 1; }
.sidebar-icon svg { height: 1.15rem; width: 1.15rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.sidebar-icon { color: #64748b; transition: color .18s ease, transform .18s ease; }
.sidebar-link:hover .sidebar-icon, .sidebar-link-active .sidebar-icon { color: currentColor; transform: scale(1.08); }
.notification-dot { display: inline-flex; height: .48rem; width: .48rem; margin-left: auto; border-radius: 999px; background: #ef4444; box-shadow: 0 0 0 3px #fee2e2; }
.notification-dot-header { position: absolute; right: .25rem; top: .25rem; height: .55rem; width: .55rem; margin: 0; }
.notification-button { line-height: 1; }
.notification-icon { height: 1.45rem; width: 1.45rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.metric-icon { height: 3rem; width: 3rem; border-radius: .9rem; font-size: 1.35rem; box-shadow: inset 0 1px rgba(255,255,255,.45), 0 8px 16px rgba(30,64,175,.12); }
.metric-icon svg { height: 1.45rem; width: 1.45rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.metric-card:nth-child(1) .metric-icon { background: linear-gradient(145deg,#3b9cff,#1672e8) !important; color: #fff !important; }
.metric-card:nth-child(2) .metric-icon { background: linear-gradient(145deg,#ffb33f,#ff8a00) !important; color: #fff !important; }
.metric-card:nth-child(3) .metric-icon { background: linear-gradient(145deg,#9b6cff,#7441df) !important; color: #fff !important; }
.metric-card:nth-child(4) .metric-icon { background: linear-gradient(145deg,#ff6565,#ef3030) !important; color: #fff !important; }
.metric-card:nth-child(5) .metric-icon { background: linear-gradient(145deg,#3b9cff,#2563eb) !important; color: #fff !important; }
@media (max-width: 1023px) { .sidebar-link { padding: .55rem .75rem; } }
.field-label { display: block; color: #1e293b; font-size: .875rem; font-weight: 700; }
.field-control { display: block; width: 100%; border: 1px solid #dbe3ef; border-radius: .9rem; background: #f8fafc; padding: .8rem 1rem; color: #0f172a; font-size: .9rem; box-shadow: inset 0 1px 1px rgba(15, 23, 42, .02); transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.field-control::placeholder { color: #94a3b8; }
.field-control:focus { border-color: #3b82f6; background: #fff; box-shadow: 0 0 0 4px rgba(59, 130, 246, .12); outline: none; }
.field-hint { margin-top: .5rem; color: #94a3b8; font-size: .75rem; line-height: 1.25rem; }
.field-error { margin-top: .35rem; display: block; color: #dc2626; font-size: .75rem; }
.help-item{border:1px solid #e2e8f0;border-radius:1rem;background:#f8fafc;padding:.95rem 1rem}.help-item summary{cursor:pointer;list-style:none;font-size:.875rem;font-weight:700;color:#0f172a}.help-item summary::-webkit-details-marker{display:none}.help-item summary:after{float:right;content:'+';color:#2563eb;font-size:1.1rem}.help-item[open] summary:after{content:'−'}.help-item p{margin-top:.65rem;font-size:.875rem;line-height:1.6;color:#64748b}

/* Reference workspace theme: light canvas, white navigation, blue action accents. */
.app-shell { background: #f4f8ff; color: #0f172a; }
.app-background-decor { opacity: .8; background: radial-gradient(ellipse at 78% 5%, rgba(147,197,253,.28), transparent 30%), radial-gradient(ellipse at 92% 32%, rgba(191,219,254,.35), transparent 35%); }
.app-orbit { border-color: rgba(59,130,246,.12); }
.app-glow { background: rgba(147,197,253,.18); }
.app-sidebar { background: rgba(255,255,255,.96); border-color: #e5edf8 !important; color: #334155; box-shadow: 12px 0 34px rgba(30,64,175,.06); }
.app-sidebar a.text-slate-950 { color: #0f172a !important; }
.app-sidebar .bg-blue-50 { background: #eaf3ff !important; color: #2563eb !important; }
.app-sidebar .border-slate-100 { border-color: #e5edf8 !important; }
.app-sidebar .text-slate-800 { color: #1e293b !important; }
.app-sidebar .text-slate-500 { color: #64748b !important; }
.app-sidebar .text-slate-400 { color: #94a3b8 !important; }
.app-sidebar .sidebar-link { color: #334155; }
.app-sidebar .sidebar-link:hover { background: #eff6ff; color: #2563eb; }
.app-sidebar .sidebar-link-active { background: #e8f1ff; color: #1261d6; box-shadow: inset 3px 0 #2563eb; }
.app-sidebar .sidebar-link-active:hover { background: #dbeafe; color: #1d4ed8; }
.app-sidebar form button { color: #2563eb; }
.app-sidebar form button:hover { background: #dbeafe; color: #1d4ed8; }
.app-sidebar .account-panel { border-color: #dbeafe !important; box-shadow: 0 12px 28px rgba(30,64,175,.08); }
.app-topbar { background: rgba(255,255,255,.92); border-color: #e5edf8 !important; }
.app-shell main { position: relative; z-index: 1; }
.app-shell main h1 { color: #0f172a !important; }
.app-shell main > div > div > p.text-blue-600 { color: #2563eb !important; }
.app-shell main > div > div > p.text-slate-500 { color: #607494 !important; }
.app-shell main > div > a.text-blue-600 { color: #2563eb !important; }
.app-shell main > div > a.text-blue-600:hover { color: #1d4ed8 !important; }
.app-shell main .text-blue-100\/75 { color: #607494 !important; }
.app-shell main .text-blue-200 { color: #2563eb !important; }
.app-shell main .bg-gradient-to-br { background: linear-gradient(135deg,#eff6ff,#dbeafe) !important; }
.app-shell main .support-help-hero { background: linear-gradient(135deg,#2563eb 0%,#1d4ed8 52%,#123f8f 100%) !important; color: #fff !important; }
.app-shell main .support-help-hero h1 { color: #fff !important; }
.app-shell main .support-help-hero p,
.app-shell main .support-help-hero .text-blue-100\/80,
.app-shell main .support-help-hero .text-blue-200 { color: rgba(239,246,255,.9) !important; }
.app-shell main .support-help-hero a { color: #fff !important; background: rgba(255,255,255,.14) !important; border-color: rgba(255,255,255,.3) !important; }
.app-shell main .support-help-hero a:hover { background: rgba(255,255,255,.24) !important; }