/* assets/css/app.css */
:root {
  --hp-green: #198754;
  --hp-orange: #fd7e14;
  --hp-red: #dc3545;
}

/* Timeline component */
.timeline { position: relative; padding-left: 2rem; }
.timeline::before {
  content: '';
  position: absolute;
  left: .6rem;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #dee2e6;
}
.timeline-item { position: relative; margin-bottom: 1.5rem; }
.timeline-dot {
  position: absolute;
  left: -1.6rem;
  top: .25rem;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px #adb5bd;
}
.timeline-dot.green  { background: var(--hp-green);  box-shadow: 0 0 0 2px var(--hp-green); }
.timeline-dot.orange { background: var(--hp-orange); box-shadow: 0 0 0 2px var(--hp-orange); }
.timeline-dot.red    { background: var(--hp-red);    box-shadow: 0 0 0 2px var(--hp-red); }
.timeline-dot.grey   { background: #adb5bd; }

/* Budget meter */
.budget-meter { height: 1.5rem; font-size: .85rem; }

/* Status pills */
.pill-auto   { background:#d1e7dd; color:#0a3622; }
.pill-approved { background:#d1e7dd; color:#0a3622; }
.pill-pending  { background:#fff3cd; color:#664d03; }
.pill-rejected { background:#f8d7da; color:#58151c; }
.pill-blocked  { background:#f8d7da; color:#58151c; }
.pill-cancelled{ background:#e2e3e5; color:#41464b; }

.badge-pill { border-radius: 50rem; padding: .35em .75em; font-size:.8rem; font-weight:600; }

/* Approval queue card hover */
.approval-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,.1); cursor:pointer; }

/* Warning banner */
.limit-warn-banner {
  background: #fff3cd;
  border-left: 4px solid var(--hp-orange);
  padding: .75rem 1rem;
  border-radius: 0 .375rem .375rem 0;
}