/* ============================================================
   PRL HSEQ Portal — One-panel data-entry form styling.
   Every data-entry form renders as a SINGLE seamless panel
   (not separate card boxes). Inner .card sections flatten into
   continuous sections with light dividers.

   Scoped with form:has(.card) so list filter bars, data tables,
   the login screen and dashboard widgets are untouched (their
   cards live outside the <form>, or the form has no card).
   ============================================================ */

/* ── The whole form becomes one panel ───────────────────────── */
form:has(.card) {
  position: relative;
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(16, 61, 115, 0.08);
  background: #fff;
  overflow: hidden;
  margin-bottom: 1.25rem;
}
/* brand accent strip across the top of the panel (PRL blue → green) */
form:has(.card)::before {
  content: "";
  display: block;
  height: 5px;
  background: linear-gradient(135deg, #2563EB 0%, #2FA043 100%);
}

/* ── Flatten inner cards into seamless sections (no dividers) ── */
form:has(.card) .card {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  background: transparent !important;
}
form:has(.card) .card + .card {
  border-top: none !important;
}

/* ── Card header → subtle section label (no divider line) ───── */
form:has(.card) .card > .card-header {
  background: transparent !important;
  border-bottom: none !important;
  padding: 16px 22px 8px;
  display: none;
}
form:has(.card) .card > .card-header .card-title,
form:has(.card) .card > .card-header .card-title i {
  color: #2563EB;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  display: none;
}

/* ── Section body ───────────────────────────────────────────── */
form:has(.card) .card > .card-body {
  background: transparent !important;
  padding: 18px 22px;
}

/* ── Compact controls ───────────────────────────────────────── */
form:has(.card) .form-control,
form:has(.card) .form-select {
  padding: 6px 10px;
  font-size: 0.84rem;
  border-radius: 7px;
}
form:has(.card) textarea.form-control {
  min-height: 0;
}
form:has(.card) .form-label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #2563EB;
  margin-bottom: 3px;
  display: block;
}
form:has(.card) .form-group {
  margin-bottom: 12px;
}
form:has(.card) .form-row {
  gap: 12px !important;
}

/* ── Footer action bar (buttons sitting directly in the form) ─ */
form:has(.card) > .d-flex {
  padding: 14px 22px;
  margin: 0 !important;
  background: #f6f9fc;
}
