/* ====== App Theme (Bootstrap 5 compatible) ====== */

:root{
  --sidebar-bg:#1f2430;
  --sidebar-bg-2:#252b3a;
  --sidebar-text:#cfd8e3;
  --sidebar-text-dim:#9aa4b2;
  --sidebar-accent:#00bcd4;

  --surface:#ffffff;
  --surface-muted:#f5f7fb;
  --border:#e5e7eb;
  --text:#0f172a;

  --primary:#0ea5e9;       /* blue for "View" */
  --warning:#fbbf24;       /* yellow for "Edit" / Pending */
  --danger:#ef4444;        /* red for "Delete" */
  --success:#10b981;       /* green for "In Progress" */
  --info:#60a5fa;          /* blue-ish for "Completed" */
}

/* Global */
body{
  background:var(--surface-muted);
  color:var(--text);
}
.container-fluid{
  padding-left: calc(240px + 24px); /* leave space for sidebar */
  transition: padding-left .25s ease;
}

/* ===== Sidebar ===== */
.app-sidebar{
  position:fixed; inset:0 auto 0 0;
  width:240px; background:var(--sidebar-bg);
  color:var(--sidebar-text);
  box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
  z-index:1030; /* above content */
  display:flex; flex-direction:column;
}
.app-sidebar .brand{
  display:flex; align-items:center; gap:.75rem;
  padding:1rem 1.25rem; background:var(--sidebar-bg-2);
  font-weight:600; letter-spacing:.2px;
}
.app-sidebar .brand img{ width:34px; height:34px; border-radius:50%; }
.app-sidebar nav{
  padding:.5rem .5rem 1.25rem;
  overflow:auto;
}
.app-sidebar .nav-link{
  display:flex; align-items:center; gap:.75rem;
  padding:.625rem .875rem; margin:.125rem .5rem; border-radius:.5rem;
  color:var(--sidebar-text); text-decoration:none; font-weight:500;
}
.app-sidebar .nav-link .icon{ width:18px; opacity:.85; }
.app-sidebar .nav-link:hover{ background:rgba(255,255,255,.06); color:#fff; }
.app-sidebar .nav-link.active{ background:var(--sidebar-accent); color:#002b36; }

/* collapse support */
.app-collapsed .app-sidebar{ width:70px; }
.app-collapsed .app-sidebar .nav-link span.label{ display:none; }
.app-collapsed .container-fluid{ padding-left: calc(70px + 24px); }

/* ===== Top area ===== */
.app-topbar{
  display:flex; align-items:center; gap:1rem;
  padding: .75rem 1rem; margin-left:240px;
  background:var(--surface);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:1020;
  transition: margin-left .25s ease;
}
.app-collapsed .app-topbar{ margin-left:70px; }

.app-topbar .menu-btn{
  border:1px solid var(--border); background:#fff; color:#334155;
  padding:.5rem .65rem; border-radius:.5rem;
}

/* ===== Stat cards (dashboard counts) ===== */
.stat-card{
  background:var(--surface); border:1px solid var(--border);
  border-radius:.75rem; padding:1rem 1.25rem;
  display:flex; align-items:center; justify-content:space-between;
  box-shadow:0 1px 2px rgba(2,6,23,.05);
}
.stat-card .value{ font-size:1.75rem; font-weight:700; }
.stat-card .kicker{ font-size:.85rem; color:#64748b; }

/* ===== Tables ===== */
.table{
  background:var(--surface); border:1px solid var(--border);
  border-radius:.75rem; overflow:hidden;
}
.table thead th{
  background:var(--surface-muted); color:#111827; font-weight:600;
  border-bottom:1px solid var(--border);
}
.table tbody tr:hover{ background:#f9fafb; }

/* ===== Buttons (match screenshot) ===== */
.btn-view{ background:var(--primary); border-color:var(--primary); color:#fff; }
.btn-edit{ background:var(--warning); border-color:var(--warning); color:#111; }
.btn-del{ background:var(--danger); border-color:var(--danger); color:#fff; }
.btn-view:hover{ filter:brightness(.95) }
.btn-edit:hover{ filter:brightness(.95) }
.btn-del:hover{ filter:brightness(.95) }

/* ===== Badges ===== */
.badge-pill{
  font-weight:600; padding:.35rem .6rem; border-radius:9999px;
  font-size:.75rem;
}
.badge-pending{ background:var(--warning); color:#1f2937; }
.badge-inprogress{ background:var(--success); color:#042; }
.badge-completed{ background:var(--info); color:#0b2540; }
.badge-canceled{ background:#f87171; color:#3f0d0d; }

/* ===== Cards/wells around sidebar lists ===== */
.card{
  border:1px solid var(--border); border-radius:.75rem;
  box-shadow:0 1px 2px rgba(2,6,23,.05);
}
.card-header{
  background:var(--surface); border-bottom:1px solid var(--border);
  font-weight:600;
}

/* ===== Backlog list (unscheduled jobs) ===== */
.list-group-item{
  border:none; border-bottom:1px dashed var(--border);
  background:transparent; padding:.75rem .5rem;
}
.list-group-item:last-child{ border-bottom:none; }

/* ===== FullCalendar tweaks ===== */
.fc .fc-toolbar-title{ font-size:1.05rem; }
.fc-theme-standard .fc-scrollgrid{
  border-color:var(--border);
}
.fc .fc-timegrid-slot{ height:2.25rem; }
.fc .fc-event{
  border-radius:.5rem; border-width:0;
  box-shadow:0 1px 1px rgba(2,6,23,.08);
}
