/*
 * Sarthi HR brand overlay — layered on top of the vendored SB Admin 2
 * theme (see /vendor/sb-admin-2/). This file no longer defines the page
 * chrome (sidebar/topbar come from the theme); it only supplies brand
 * color accents and a handful of app-specific helper classes that
 * predate the theme and are still referenced by views (badges, inline
 * error/success banners, blog post dividers, etc).
 */
:root {
  --slate: #0f3d3e;
  --slate-dark: #0a2b2c;
  --teal: #1a7f72;
  --border: #dde7e5;
  --muted: #65807c;
  --ok: #1e8e3e;
  --danger: #c0392b;
}

/* Brand accent: recolor the theme's primary gradient (sidebar + login
   background) from SB Admin 2's stock blue to Sarthi HR's teal/slate. */
.sidebar.bg-gradient-primary, body.bg-gradient-primary {
  background-image: linear-gradient(180deg, var(--teal) 10%, var(--slate-dark) 100%) !important;
}
.sidebar-brand-text { letter-spacing: 0.02em; }

.card h1, .card h2 { margin-top: 0; }

/* The app's views predate Bootstrap form-control/btn markup — style plain
   form elements directly so forms inside the themed cards don't fall back
   to unstyled browser defaults. */
label { display: block; margin: 12px 0 6px; font-size: 0.86rem; color: var(--muted); }
input[type=text], input[type=password], input[type=number], input[type=email], textarea {
  width: 100%;
  max-width: 420px;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 0.95rem;
  font-family: inherit;
  margin-bottom: 6px;
}
textarea { min-height: 90px; }

button[type=submit], .card button {
  background: var(--teal);
  color: #fff;
  border: none;
  padding: 10px 18px;
  border-radius: 6px;
  font-size: 0.95rem;
  cursor: pointer;
  margin-top: 10px;
}
button[type=submit]:hover, .card button:hover { background: var(--slate); }

table { width: 100%; border-collapse: collapse; margin-top: 10px; }
th, td { text-align: left; padding: 8px 10px; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 0.75rem; font-weight: 600; }
.badge.pending { background: #fff4d6; color: #8a6400; }
.badge.approved { background: #e3f7e9; color: var(--ok); }
.badge.rejected { background: #fdeeed; color: var(--danger); }

.error-box { background: #fdeeed; border: 1px solid #f3c6c2; color: var(--danger); padding: 14px 16px; border-radius: 6px; margin: 16px 0; }
.success-box { background: #eaf7ee; border: 1px solid #b9e3c6; color: var(--ok); padding: 14px 16px; border-radius: 6px; margin: 16px 0; }

pre.log { background: #0d1b2a; color: #9fd3ff; padding: 14px; border-radius: 6px; font-size: 0.82rem; overflow-x: auto; white-space: pre-wrap; }

.muted { color: var(--muted); font-size: 0.88rem; }

.footer-links { text-align: center; margin-top: 26px; font-size: 0.82rem; color: var(--muted); }
.footer-links a { color: var(--muted); margin: 0 8px; text-decoration: none; }
.footer-links a:hover { text-decoration: underline; }

.blog-post { border-bottom: 1px solid var(--border); padding-bottom: 16px; margin-bottom: 16px; }
.blog-post:last-child { border-bottom: none; }
.blog-date { color: var(--muted); font-size: 0.82rem; }

#feed-log { background: var(--slate-dark); color: #d2efe9; padding: 14px; border-radius: 6px; font-family: "SF Mono", Consolas, Menlo, monospace; font-size: 0.85rem; min-height: 120px; white-space: pre-wrap; }