@font-face { font-family: 'Ericsson Hilda'; src: url('/fonts/EricssonHilda-Light.woff2') format('woff2'), url('/fonts/EricssonHilda-Light.woff') format('woff'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Ericsson Hilda'; src: url('/fonts/EricssonHilda-Regular.woff2') format('woff2'), url('/fonts/EricssonHilda-Regular.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Ericsson Hilda'; src: url('/fonts/EricssonHilda-Medium.woff2') format('woff2'), url('/fonts/EricssonHilda-Medium.woff') format('woff'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Ericsson Hilda'; src: url('/fonts/EricssonHilda-Bold.woff2') format('woff2'), url('/fonts/EricssonHilda-Bold.woff') format('woff'); font-weight: 700; font-display: swap; }

:root {
  --ericsson-blue: #0032a0;
  --ericsson-black: #0a0a0a;
  --ericsson-gray: #f2f3f5;
  --ericsson-gray-border: #dcdfe4;
  --ericsson-text: #333333;
  --ericsson-danger: #c1272d;
  --ericsson-ok: #1f7a3d;
  --ericsson-warn: #b86e00;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { font-family: 'Ericsson Hilda', system-ui, sans-serif; margin: 0; background: #fff; color: var(--ericsson-text); }
a { color: var(--ericsson-blue); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 2rem; padding: 2.5rem 3rem 2rem; border-bottom: 1px solid var(--ericsson-gray-border); }
.topbar h1 { font-weight: 700; font-size: 2.2rem; line-height: 1.15; color: var(--ericsson-black); margin: 0 0 0.75rem 0; }
.topbar h1 a { color: inherit; text-decoration: none; cursor: default; }
.topbar h1 a:hover { color: inherit; text-decoration: none; }
.topbar .sub { font-weight: 300; font-size: 1.05rem; margin: 0; }
.topbar-right { display: flex; flex-direction: column; align-items: flex-end; gap: 0.5rem; flex: 0 0 auto; }
.topbar-logo { height: 51px; width: auto; flex: 0 0 auto; }
.demo-link { font: inherit; font-size: 0.75rem; font-weight: 300; padding: 0.1rem 0.5rem; border: 1px solid var(--ericsson-gray-border); border-radius: 3px; background: #fff; color: #6b6f76; cursor: pointer; }
.demo-link:hover { background: var(--ericsson-gray); color: var(--ericsson-black); }

main { padding: 2rem 3rem 3rem; }
h2 { font-weight: 500; font-size: 1.3rem; color: var(--ericsson-black); margin: 0 0 1rem 0; }

.toolbar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 1rem; }

table { width: 100%; font-size: 0.85rem; border-collapse: collapse; border: 1px solid var(--ericsson-gray-border); }
th { text-align: left; font-weight: 500; color: var(--ericsson-black); background: var(--ericsson-gray); padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--ericsson-gray-border); }
td { padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--ericsson-gray-border); vertical-align: top; }
tr:last-child td { border-bottom: none; }
td time { white-space: nowrap; }
tbody tr:hover { background: #f7f8fa; }
.empty { padding: 2rem; text-align: center; font-weight: 300; border: 1px solid var(--ericsson-gray-border); }

.badge { display: inline-block; padding: 0.1rem 0.55rem; border-radius: 3px; font-size: 0.75rem; font-weight: 500; border: 1px solid var(--ericsson-gray-border); background: var(--ericsson-gray); color: var(--ericsson-black); white-space: nowrap; }
.badge.OPEN { background: #e2ebff; border-color: #b9ccf5; color: var(--ericsson-blue); }
.badge.IN_PROGRESS { background: #fff1d9; border-color: #f1d49d; color: var(--ericsson-warn); }
.badge.RESOLVED, .badge.RESOLVED_BY_AGENTS { background: #e3f3e8; border-color: #b7dcc2; color: var(--ericsson-ok); }
.badge.ESCALATED { background: #fff1d9; border-color: #f1d49d; color: var(--ericsson-warn); }
.badge.CRITIQUE_NOT_SATISFIED, .badge.REJECTED_BY_APPROVER, .badge.BLOCKED_BY_POLICY, .badge.CHANGE_FAILED { background: #fbe5e6; border-color: #eab5b8; color: var(--ericsson-danger); }
.badge.critical, .badge.high { background: #fbe5e6; border-color: #eab5b8; color: var(--ericsson-danger); }

.detail { max-width: 60rem; }
.panel { border: 1px solid var(--ericsson-gray-border); border-radius: 4px; padding: 1.2rem 1.4rem; margin-bottom: 1.5rem; }
.panel h3 { margin: 0 0 0.8rem 0; font-weight: 700; color: var(--ericsson-black); font-size: 1.05rem; }
dl { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 0.5rem 1.2rem; }
dt { font-weight: 500; color: var(--ericsson-black); }
dd { margin: 0; }
.pre { white-space: pre-wrap; }

.timeline { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--ericsson-gray-border); }
.timeline li { position: relative; padding: 0 0 1.1rem 1.2rem; }
.timeline li::before { content: ''; position: absolute; left: -7px; top: 0.35rem; width: 12px; height: 12px; border-radius: 50%; background: var(--ericsson-blue); border: 2px solid #fff; }
.timeline li.RESOLVED::before { background: var(--ericsson-ok); }
.timeline li.ESCALATED::before { background: var(--ericsson-warn); }
.timeline .when { font-size: 0.85rem; font-weight: 300; }
.timeline .who { font-weight: 500; color: var(--ericsson-black); }
.back { display: inline-block; margin-bottom: 1rem; }

@media (max-width: 900px) { main, .topbar { padding-left: 1.2rem; padding-right: 1.2rem; } }

.welcome { max-width: none; }
.welcome p { font-weight: 300; font-size: 1.1rem; line-height: 1.55; }
.welcome .actions { margin: 0 0 1rem 0; align-items: center; }
.push-right { margin-left: auto; }
.lead { font-weight: 300; margin: 0 0 1.5rem 0; }
.actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.8rem; }
.button { display: inline-block; padding: 0.7rem 1.5rem; border: 1px solid var(--ericsson-black); border-radius: 4px; background: var(--ericsson-black); color: #fff; font-weight: 500; font-size: 1rem; }
.button:hover { text-decoration: none; background: #2c2c2c; }
.button.secondary { background: #fff; color: var(--ericsson-black); }
.button.secondary:hover { background: var(--ericsson-gray); }
.form-host { max-width: 40rem; border: 1px solid var(--ericsson-gray-border); border-radius: 4px; padding: 1.4rem; font-family: 'Ericsson Hilda', system-ui, sans-serif; }
.error { max-width: 40rem; }
.started { font-weight: 300; font-size: 1.05rem; }
.started p { margin: 0 0 0.5rem 0; }
.started p:last-child { margin-bottom: 0; }
.error { border-color: #eab5b8; background: #fbe5e6; color: var(--ericsson-danger); }

.button.small { padding: 0.3rem 0.8rem; font-size: 0.85rem; }
.button.danger { background: #fff; border-color: var(--ericsson-danger); color: var(--ericsson-danger); }
.button.danger:hover { background: #fbe5e6; }
.fjs-powered-by { display: none; }
th a.sort { color: inherit; white-space: nowrap; }
th a.sort:hover { text-decoration: underline; }
