:root {
  --primary-color: #812a3d;
  --primary-hover: #9b3c50;
  --light-bg: #fdf9fa;
  --border-color: #e7d8dc;
  --text-dark: #2e1c1f;
}

html, body { height: 100%; overflow-x: hidden; }
.hm-tabs-wrap { padding: 0 12px; }              /* padding around top tabs */
.hm-cards-grid { padding: 8px 12px 24px; }  

body.hm-layout {
  min-height: 100vh;
  display: block;              /* Bootstrap's flex is on #hm-page */
  margin: 0;
  padding: 0 !important;       /* kill any old padding-bottom from prior fixed footer */
  background: #faf8f0;         /* your offwhite */
}

main { flex: 1; }

header {
  background-color: var(--primary-color);
  color: white;
  text-align: center;
  padding: 15px;
}

header img {
  height: 50px;
  margin-right: 10px;
}

.card {
  background: #fff;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  padding: 20px;
}

h2 {
  color: var(--primary-color);
  font-weight: 600;
}

hr {
  border: 0;
  border-top: 2px solid #b0b0b0;
  margin: 20px 0;
}

.btn-primary {
  background-color: var(--primary-color);
  border: none;
  transition: background-color 0.3s;
}

.btn-primary:hover {
  background-color: var(--primary-hover);
}

.form-label {
  font-weight: 500;
  color: var(--text-dark);
}

.form-control:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 0.15rem rgba(129, 42, 61, 0.25);
}

label.required::after {
  content: " *";
  color: rgb(217, 109, 109);
  font-size: 0.8em; /* slightly smaller */
  font-weight: 600;
  opacity: 0.85; /* makes it a little subtler */
}

select:invalid {
  color: #6c757d; /* light grey like placeholder */
}
option {
  color: #000; /* normal color for real options */
}
option[disabled] {
  color: #6c757d; /* keep placeholder grey in the list too */
}
input[type="date"]:invalid {
  color: #6c757d; /* placeholder grey */
}
input[type="date"] {
  color: #000; /* normal text color */
}

footer {
  background: var(--primary-color);
  color: white;
  font-size: smaller;
  position: static !important; /* ensure NOT fixed */
  bottom: auto !important;
  width: 100%;
}

#hm-main .card { border-radius: 12px; }

/* ---- Candidate/Matchmaker/Admin shared card styles ---- */
.hm-cards-grid { padding: 8px 12px 20px; } /* L/R/B padding */
.hm-card.candidate-card {
  border: 4px solid transparent;
  border-radius: 12px;
  background: #fff;
  padding: 15px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: transform .15s ease;
  cursor: pointer;
}
.hm-card.candidate-card:hover { transform: scale(1.015); }
.candidate-img { 
  width: 100px; 
  height: 100px; 
  border-radius: 50%; 
  object-fit: cover; 
  margin-bottom: 10px; 
}

/* HM tabs (bold active, neutral inactive; no blue) */
.hm-top-tabs .nav-link {
  color: #4a4a4a;
  font-weight: 400;
  background: #e9ecef;
  border: 1px solid #d0d4d8;
  border-bottom: none;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}
.hm-top-tabs .nav-link.active {
  background: var(--primary-color); color: #fff; font-weight: 700; border-color: var(--primary-color);
}
.hm-top-tabs .nav-link:hover { background: #f2e6ea; color: #3b2a2f; }

.hm-inner-tabs .nav-link {
  border: 1px solid #e0d3d7;
  border-bottom: none;
  background: #f7f2f4;
  color: #5b3a44;
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}
.hm-inner-tabs .nav-link.active {
  background: var(--primary-color);
  color: #fff;
  border-color: var(--primary-color);
}

/* profile modal aesthetics */
.hm-modal-hd { background: #f4f1e6; }
.hm-profile-thumb { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; cursor: zoom-in; }

/* links theme */
a { 
  color: var(--primary-color); 
}

/* Toast base */
.hm-toast {
  background: #fffbe8;       /* soft warm yellow */
  border-radius: 12px;
  border: 1px solid #e7dca8;
  box-shadow: 0px 4px 12px rgba(0,0,0,0.15);
  padding: 10px 14px;
  font-weight: 600;
}

/* Toast icon container */
.toast-icon {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

/* Icon colors */
.toast-success   { color: #2e7d32; }   /* green */
.toast-warning   { color: #d68910; }   /* amber */
.toast-info      { color: #1e88e5; }   /* blue */

/* responsive: ensure no horizontal scroll on small screens */
@media (max-width: 576px){
  .hm-cards-grid { padding-left: 8px; padding-right: 8px; }
  .hm-tabs-wrap  { padding-left: 8px; padding-right: 8px; }
}