/* ==========================================================================
   Sevenex — Theme Bridge
   Maps the existing Bootstrap 5 markup + legacy page styles onto the
   Sevenex red/white design system defined in theme.css.
   Loaded AFTER bootstrap + page <style> so it wins the cascade.
   Uses !important selectively to defeat per-page inline <style> blocks.
   ========================================================================== */

/* ----------  Global typography & surface  ---------- */
body{
  font-family:'Inter','Segoe UI',-apple-system,BlinkMacSystemFont,sans-serif !important;
  background:var(--hp-bg) !important;
  color:var(--hp-ink);
}

/* Kill the old dark/blue gradient backgrounds some pages set inline */
body.bg-light{ background:var(--hp-bg) !important; }

a{ color:var(--hp-red); }
a:hover{ color:var(--hp-red-dark); }
a.text-white, a.text-white:hover{ color:#fff !important; }

/* ----------  Legacy layout neutralisers  ----------
   The shell (.hp-main) now provides the left offset + padding, so any
   page-level wrapper that used to clear the old fixed sidebar must be reset. */
.hp-content .dashboard-wrapper{ margin-left:0 !important; padding:0 !important; }
.hp-content .container,
.hp-content .container-fluid{ padding-left:0; padding-right:0; }
.hp-content > .container,
.hp-content > .container-fluid{ max-width:100%; }
/* old responsive offset hacks from the previous header include */
.hp-content .my-5,
.hp-content .py-4,
.hp-content .mt-4,
.hp-content .mt-5{ width:auto !important; margin-left:0 !important; }

/* ----------  Buttons  ---------- */
.btn{ border-radius:10px; font-weight:600; }
.btn-sm{ border-radius:8px; }
.btn-lg{ border-radius:12px; }

.btn-primary{
  background:var(--hp-red) !important;
  border-color:var(--hp-red) !important;
  color:#fff !important;
  box-shadow:0 6px 16px rgba(232,52,77,0.25);
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{
  background:var(--hp-red-dark) !important;
  border-color:var(--hp-red-dark) !important;
  color:#fff !important;
}
.btn-outline-primary{
  color:var(--hp-red) !important;
  border-color:var(--hp-red) !important;
  background:#fff !important;
}
.btn-outline-primary:hover{
  background:var(--hp-red) !important;
  color:#fff !important;
}
.btn-success{ background:var(--hp-success) !important; border-color:var(--hp-success) !important; color:#fff !important; }
.btn-success:hover{ filter:brightness(.94); }
.btn-danger{ background:var(--hp-red) !important; border-color:var(--hp-red) !important; color:#fff !important; }
.btn-danger:hover{ background:var(--hp-red-dark) !important; border-color:var(--hp-red-dark) !important; }
.btn-warning{ background:var(--hp-warning) !important; border-color:var(--hp-warning) !important; color:#fff !important; }
.btn-secondary{ background:#fff !important; border:1.5px solid var(--hp-line) !important; color:var(--hp-ink-soft) !important; }
.btn-secondary:hover{ border-color:var(--hp-red) !important; color:var(--hp-red) !important; }
.btn-info{ background:var(--hp-ink) !important; border-color:var(--hp-ink) !important; color:#fff !important; }
.btn-light{ background:#fff !important; border:1.5px solid var(--hp-line) !important; color:var(--hp-ink) !important; }
.btn-dark{ background:var(--hp-ink) !important; border-color:var(--hp-ink) !important; color:#fff !important; }
.btn-outline-secondary{ color:var(--hp-ink-soft) !important; border-color:var(--hp-line) !important; }
.btn-outline-secondary:hover{ background:var(--hp-bg) !important; color:var(--hp-ink) !important; }
.btn-outline-danger{ color:var(--hp-red) !important; border-color:var(--hp-red) !important; }
.btn-outline-danger:hover{ background:var(--hp-red) !important; color:#fff !important; }

/* legacy custom auth button used on a couple pages */
.btn-main{
  background:var(--hp-red) !important;
  background-image:none !important;
  border:none !important;
  color:#fff !important;
  border-radius:10px !important;
  font-weight:600;
}
.btn-main:hover{ background:var(--hp-red-dark) !important; opacity:1 !important; }

/* ----------  Cards  ---------- */
.card{
  border:1px solid var(--hp-line) !important;
  border-radius:var(--hp-radius-lg) !important;
  box-shadow:var(--hp-shadow) !important;
  background:var(--hp-card);
}
.card.shadow-sm,.card.shadow{ box-shadow:var(--hp-shadow) !important; }
.card.border-0{ border:none !important; }
.card-header{
  background:#fff !important;
  border-bottom:1px solid var(--hp-line) !important;
  font-weight:700;
}

/* ----------  Tables  ---------- */
.table{ color:var(--hp-ink); border-color:var(--hp-line); --bs-table-bg:transparent; }
.table > thead th,
.table > thead td{
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.4px;
  color:var(--hp-muted) !important;
  font-weight:700;
  border-bottom:1px solid var(--hp-line) !important;
  background:transparent !important;
}
.table > tbody td,
.table > tbody th{
  font-size:13.5px;
  border-color:var(--hp-line) !important;
  vertical-align:middle;
}
.table-hover > tbody > tr:hover > *{ background:#FBFBFD !important; }
.table-striped > tbody > tr:nth-of-type(odd) > *{ background:#FCFCFE !important; }
.table-bordered,.table-bordered td,.table-bordered th{ border-color:var(--hp-line) !important; }
.table-dark{ --bs-table-bg:var(--hp-ink); }

/* ----------  Forms  ---------- */
.form-control,.form-select,.form-control:focus,.form-select:focus{
  border-radius:10px;
}
.form-control,.form-select{
  border:1.5px solid var(--hp-line);
  color:var(--hp-ink);
}
.form-control:focus,.form-select:focus{
  border-color:var(--hp-red) !important;
  box-shadow:0 0 0 3px var(--hp-red-light) !important;
}
.input-group-text{
  background:var(--hp-bg) !important;
  border:1.5px solid var(--hp-line) !important;
  color:var(--hp-ink-soft) !important;
}
.form-check-input:checked{
  background-color:var(--hp-red) !important;
  border-color:var(--hp-red) !important;
}
.form-check-input:focus{ box-shadow:0 0 0 3px var(--hp-red-light) !important; border-color:var(--hp-red); }
.form-label{ font-weight:600; color:var(--hp-ink-soft); font-size:13px; }

/* ----------  Badges → pill style  ---------- */
.badge{
  font-weight:700;
  border-radius:20px;
  padding:.4em .75em;
  font-size:11.5px;
}
.badge.bg-success,.badge.text-bg-success{ background:#E6F7EE !important; color:var(--hp-success) !important; }
.badge.bg-danger,.badge.text-bg-danger{ background:var(--hp-red-light) !important; color:var(--hp-red-dark) !important; }
.badge.bg-warning,.badge.text-bg-warning{ background:#FFF3E0 !important; color:#C77B1B !important; }
.badge.bg-primary,.badge.text-bg-primary{ background:var(--hp-red-light) !important; color:var(--hp-red-dark) !important; }
.badge.bg-secondary,.badge.text-bg-secondary{ background:var(--hp-bg) !important; color:var(--hp-ink-soft) !important; }
.badge.bg-info,.badge.text-bg-info{ background:#E8F0FE !important; color:#3366CC !important; }
.badge.bg-dark{ background:var(--hp-ink) !important; color:#fff !important; }
.badge.bg-light{ background:var(--hp-bg) !important; color:var(--hp-ink-soft) !important; }

/* ----------  Alerts  ---------- */
.alert{ border-radius:var(--hp-radius-md); border:1px solid transparent; }
.alert-success{ background:#E6F7EE; color:#1E7A4D; border-color:#BFE9D2; }
.alert-danger{ background:var(--hp-red-light); color:var(--hp-red-dark); border-color:var(--hp-red-soft); }
.alert-warning{ background:#FFF3E0; color:#9A5B12; border-color:#FBE0B8; }
.alert-info{ background:#E8F0FE; color:#2A4E9B; border-color:#C9D9F7; }

/* ----------  Text / background utility recolour  ---------- */
.text-primary{ color:var(--hp-red) !important; }
.text-danger{ color:var(--hp-red-dark) !important; }
.text-success{ color:var(--hp-success) !important; }
.text-warning{ color:#C77B1B !important; }
.text-muted{ color:var(--hp-muted) !important; }
.bg-primary{ background:var(--hp-red) !important; }
.bg-dark{ background:var(--hp-ink) !important; }
.bg-light{ background:var(--hp-bg) !important; }
.border-primary{ border-color:var(--hp-red) !important; }

/* ----------  Bootstrap nav-tabs / pills  ---------- */
.nav-tabs .nav-link.active{ color:var(--hp-red); border-color:var(--hp-line) var(--hp-line) #fff; }
.nav-tabs .nav-link{ color:var(--hp-ink-soft); }
.nav-pills .nav-link.active{ background:var(--hp-red); }
.page-link{ color:var(--hp-red); }
.page-item.active .page-link{ background:var(--hp-red); border-color:var(--hp-red); }

/* ----------  Bootstrap modal (used by data pages) → rounded + on theme  ---------- */
.modal-content{ border:none; border-radius:var(--hp-radius-lg); box-shadow:0 30px 60px rgba(0,0,0,0.25); }
.modal-header{ border-bottom:1px solid var(--hp-line); }
.modal-footer{ border-top:1px solid var(--hp-line); }

/* ----------  Accordion (meetings pages)  ---------- */
.accordion-button:not(.collapsed){ background:var(--hp-red-light); color:var(--hp-red-dark); box-shadow:none; }
.accordion-button:focus{ box-shadow:0 0 0 3px var(--hp-red-light); border-color:var(--hp-red); }
.accordion-item{ border-color:var(--hp-line); border-radius:var(--hp-radius-md); }

/* ----------  Dashboard-specific (admin/employee) accents  ---------- */
.stat-card::before{ background:linear-gradient(90deg,var(--hp-red),var(--hp-red-dark)) !important; }
.stat-icon{ color:var(--hp-red) !important; }
.dashboard-header h2{ color:var(--hp-ink) !important; }
.logout-btn{ background:var(--hp-red) !important; }
.logout-btn:hover{ background:var(--hp-red-dark) !important; }

/* ----------  Sidebar scrollbar polish  ---------- */
.hp-nav::-webkit-scrollbar{ width:6px; }
.hp-nav::-webkit-scrollbar-thumb{ background:var(--hp-line); border-radius:6px; }
.hp-sidebar::-webkit-scrollbar{ width:6px; }
.hp-sidebar::-webkit-scrollbar-thumb{ background:var(--hp-line); border-radius:6px; }

/* ----------  Mobile: dim backdrop when sidebar open  ---------- */
@media (max-width:1100px){
  .hp-sidebar{ box-shadow:0 0 40px rgba(0,0,0,.18); }
}