@charset "UTF-8";

/* ----------------------------------------------------------------
   Fonts
---------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@300;400;500;600&display=swap');

/* ----------------------------------------------------------------
   Tabler theme overrides
---------------------------------------------------------------- */
:root {
    --tblr-primary:         #ed0c06;
    --tblr-primary-rgb:     237, 12, 6;
    --tblr-primary-fg:      #fff;
    --tblr-primary-lt:      rgba(237, 12, 6, 0.1);
    --tblr-link-color:      #ed0c06;
    --tblr-link-hover-color:#c4170a;
    --tblr-body-font-family: 'IBM Plex Sans', -apple-system, system-ui, sans-serif;
    --tblr-font-monospace:   'IBM Plex Mono', SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

/* ----------------------------------------------------------------
   Typography
---------------------------------------------------------------- */
.page-title, .card-title,
h1, h2, h3, h4 { font-family: 'IBM Plex Mono', monospace; }

/* ----------------------------------------------------------------
   Subheader with trailing rule
---------------------------------------------------------------- */
.subheader-rule {
    display: flex; align-items: center; gap: .5rem;
    font-size: .625rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: .06em;
    color: var(--tblr-muted); margin-bottom: .75rem;
}
.subheader-rule::after {
    content: ''; flex: 1; height: 1px;
    background: var(--tblr-border-color);
}

/* ----------------------------------------------------------------
   Sidebar "soon" badge
---------------------------------------------------------------- */
.nav-soon {
    font-family: 'IBM Plex Mono', monospace; font-size: .52rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: .06em;
    background: rgba(255,255,255,.08); color: rgba(255,255,255,.4);
    border: 1px solid rgba(255,255,255,.1);
    padding: 1px 5px; border-radius: 4px;
}

/* ----------------------------------------------------------------
   Workpack card grid  (portal dashboard)
---------------------------------------------------------------- */
.workpack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}
.workpack-card {
    display: flex; flex-direction: column; gap: .6rem;
    padding: 1.1rem 1.25rem;
    background: var(--tblr-bg-surface);
    border: 1px solid var(--tblr-border-color);
    border-radius: var(--tblr-border-radius);
    text-decoration: none; color: var(--tblr-body-color);
    transition: border-color .15s, box-shadow .15s;
}
.workpack-card:hover {
    border-color: var(--tblr-primary);
    box-shadow: 0 2px 12px rgba(var(--tblr-primary-rgb), .1);
    text-decoration: none; color: var(--tblr-body-color);
}
.workpack-card-head  { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.workpack-card-title { font-family: 'IBM Plex Mono', monospace; font-size: .8rem; font-weight: 600; flex: 1; min-width: 0; }
.workpack-card-meta  { font-size: .72rem; color: var(--tblr-muted); }

/* ----------------------------------------------------------------
   Task list  (portal checklist)
---------------------------------------------------------------- */
.task-list { display: flex; flex-direction: column; gap: .75rem; }

.task-item {
    display: flex; align-items: flex-start; gap: 1rem;
    padding: .9rem 1.1rem;
    background: var(--tblr-bg-surface);
    border: 1px solid var(--tblr-border-color);
    border-radius: var(--tblr-border-radius);
    transition: border-color .12s;
}
.task-item.complete { border-color: rgba(var(--tblr-success-rgb), .35); background: rgba(var(--tblr-success-rgb), .02); }
.task-item.blocked  { border-color: rgba(var(--tblr-warning-rgb), .4);  background: rgba(var(--tblr-warning-rgb), .03); }
.task-item.task-locked { opacity: .45; pointer-events: none; }

.task-step {
    display: flex; flex-direction: column; align-items: center;
    gap: .3rem; flex-shrink: 0; padding-top: .1rem;
}
.task-number {
    width: 26px; height: 26px; border-radius: 50%;
    background: var(--tblr-body-color); color: #fff;
    font-family: 'IBM Plex Mono', monospace; font-size: .6rem; font-weight: 600;
    display: flex; align-items: center; justify-content: center;
}
.task-item.complete .task-number { background: var(--tblr-success); }
.task-item.blocked  .task-number { background: var(--tblr-warning); }

.hold-badge {
    font-family: 'IBM Plex Mono', monospace; font-size: .5rem; font-weight: 700;
    background: rgba(var(--tblr-warning-rgb), .15); color: var(--tblr-warning);
    border: 1px solid rgba(var(--tblr-warning-rgb), .3);
    border-radius: 3px; padding: 1px 4px;
}

.task-body         { flex: 1; min-width: 0; }
.task-title        { font-weight: 500; font-size: .85rem; margin-bottom: .25rem; }
.task-instructions { font-size: .78rem; color: var(--tblr-muted); margin-bottom: .4rem; line-height: 1.5; }
.task-meta         { font-size: .72rem; color: var(--tblr-muted); font-family: 'IBM Plex Mono', monospace; margin-bottom: .3rem; }
.task-note         { font-size: .75rem; color: var(--tblr-muted); margin-top: .4rem; font-style: italic; }
.task-note-label   { font-family: 'IBM Plex Mono', monospace; font-size: .62rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-right: .3rem; }

.task-lock-msg, .hold-pending-msg {
    font-size: .75rem; margin-top: .5rem; padding: .4rem .6rem; border-radius: 4px;
}
.task-lock-msg    { background: rgba(0,0,0,.04); color: var(--tblr-muted); border: 1px solid var(--tblr-border-color); }
.hold-pending-msg { background: rgba(var(--tblr-warning-rgb), .07); color: var(--tblr-warning); border: 1px solid rgba(var(--tblr-warning-rgb), .2); }

.task-actions { display: flex; align-items: flex-start; gap: .4rem; flex-shrink: 0; flex-wrap: wrap; padding-top: .1rem; }

/* ----------------------------------------------------------------
   Activity rows  (reporter dashboard)
---------------------------------------------------------------- */
.activity-row {
    display: flex; gap: .6rem; align-items: flex-start;
    padding: .5rem 1rem; border-bottom: 1px solid var(--tblr-border-color);
}
.activity-row:last-child { border-bottom: none; }
.activity-time   { font-family: 'IBM Plex Mono', monospace; font-size: .6rem; color: var(--tblr-muted); white-space: nowrap; padding-top: .15rem; min-width: 68px; }
.activity-body   { flex: 1; min-width: 0; }
.activity-action { font-size: .75rem; }

/* ----------------------------------------------------------------
   Step completion matrix  (reporter workpack show)
---------------------------------------------------------------- */
.task-num {
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--tblr-border-color-dark);
    font-family: 'IBM Plex Mono', monospace; font-size: .58rem; font-weight: 600;
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.matrix-cell {
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; border-radius: 50%;
    font-family: 'IBM Plex Mono', monospace; font-size: .7rem; font-weight: 700;
}
.cell-complete { background: rgba(var(--tblr-success-rgb), .12); color: var(--tblr-success); }
.cell-blocked  { background: rgba(var(--tblr-warning-rgb), .12); color: var(--tblr-warning); }
.cell-progress { background: rgba(var(--tblr-info-rgb), .08);    color: var(--tblr-info); }
.cell-pending  { background: rgba(0,0,0,.05);                     color: var(--tblr-muted); }

/* ----------------------------------------------------------------
   Moderator release view
---------------------------------------------------------------- */
.worker-report-box {
    background: rgba(var(--tblr-warning-rgb), .06);
    border: 1px solid rgba(var(--tblr-warning-rgb), .2);
    border-radius: var(--tblr-border-radius);
    padding: .85rem 1rem;
}
.worker-report-meta { font-size: .72rem; font-family: 'IBM Plex Mono', monospace; color: var(--tblr-muted); margin-bottom: .4rem; }

.release-ok-box {
    background: rgba(var(--tblr-success-rgb), .06);
    border: 1px solid rgba(var(--tblr-success-rgb), .2);
    border-radius: var(--tblr-border-radius);
    padding: .75rem .9rem; margin-bottom: 1rem;
    font-size: .78rem; color: var(--tblr-success);
}

/* ----------------------------------------------------------------
   Audit log active pagination button
---------------------------------------------------------------- */
.btn-page-active {
    background: var(--tblr-primary) !important;
    color: #fff !important;
    border-color: var(--tblr-primary) !important;
}

/* ----------------------------------------------------------------
   Inactive user row
---------------------------------------------------------------- */
.row-inactive td { opacity: .5; }

/* ----------------------------------------------------------------
   Form check list  (assignment checkboxes)
---------------------------------------------------------------- */
.check-list { list-style: none; padding: 0; margin: 0; }
.check-list-item {
    display: flex; align-items: center; gap: .6rem;
    padding: .55rem .75rem;
    border: 1px solid var(--tblr-border-color);
    border-radius: var(--tblr-border-radius);
    margin-bottom: .35rem;
    cursor: pointer; font-size: .85rem;
    transition: border-color .12s;
}
.check-list-item:hover { border-color: var(--tblr-border-color-dark); }

/* ----------------------------------------------------------------
   Print overrides
---------------------------------------------------------------- */
@media print {
    .navbar-vertical, .page-header { display: none !important; }
    .page-wrapper { margin: 0 !important; }
}
