@media screen {
  /* IE7 needs !important */

  body  {
    background-color:#ffffff !important;
  }

  /* ===== Global Font and Text ===== */
body, p, li, span, a, td, th {
  font-family: 'Lato', sans-serif !important;
  color: #000000 !important;
}

/* ===== Bolded Text (Accent Color) ===== */
b, strong, .bold {
  color: #91183d !important;
  font-weight: bold !important;
}

/* ===== Headings ===== */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Lato', sans-serif !important;
  font-weight: 700 !important;
  color: #91183d !important; /* Accent color for headings */
  margin: 0.5em 0;
}

/* ===== Links ===== */
a {
  color: #91183d !important;
  text-decoration: none;
}
a:hover, a:focus {
  color: #000000 !important;
  text-decoration: underline;
}

/* ===== Buttons ===== */
button, 
input[type="submit"], 
input[type="button"], 
.fs_button,
#content-body .btn {
  background-color: #91183d !important;
  color: #ffffff !important;
  font-family: 'Lato', sans-serif !important;
  border: none;
  border-radius: 6px;
  padding: 0.5em 1em;
  cursor: pointer;
  font-size: 1rem;
}
button:hover, 
input[type="submit"]:hover, 
input[type="button"]:hover, 
.fs_button:hover,
#content-body .btn:hover {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* ===== Tables ===== */
table, th, td {
  border: 1px solid #91183d !important;
  border-collapse: collapse;
}
th {
  background-color: #91183d !important;
  color: #ffffff !important;
  padding: 8px;
}
td {
  padding: 8px;
}

/* ===== Checklist / Tiles (if used in portal) ===== */
.fs-checklist-item-title,
.tile-title {
  font-weight: bold !important;
  color: #91183d !important;
  font-family: 'Lato', sans-serif !important;
}

/* ===== Main content area ===== */
#content-body {
    border-radius: 8px 8px 0 0;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
    padding: 1.5em;
    background-color: #ffffff;
}

/* ===== Headings inside content-body ===== */
#content-body h1, #content-body h2, #content-body h3 {
    color: #91183d; /* Maroon headings */
    font-weight: bold;
    line-height: 1.3;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}
#content-body h1 { font-size: 1.75rem; }
#content-body h2 { font-size: 1.5rem; }
#content-body h3 { font-size: 1.25rem; }

/* ===== Links inside content-body ===== */
#content-body a {
    color: #91183d;
    text-decoration: none;
    font-weight: 500;
}
#content-body a:hover { 
    color: #000000; 
    text-decoration: underline; 
}

/* === Checklist Items Styling === */
.checklist-item {
    position: relative;
    border: 2px solid #91183d; /* Maroon border */
    border-radius: 4px;
    background-color: #f7f7f7;
    margin-bottom: 1.5em; /* spacing between items */
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* Hover effect */
.checklist-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* Checklist Item Titles */
.checklist-item .title,
.checklist-item h3,
.checklist-item h4 {
    font-weight: bold;
    color: #91183d;
    font-size: 1rem;
    margin-bottom: 0.5em;
    padding: 0.5em 1em;
    background-color: #f7f7f7;
    border-radius: 4px 4px 0 0;
    display: block;
    border-bottom: 2px solid #91183d;
}

/* Checklist Description */
.checklist-item .description,
.checklist-item p {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #000000;
    padding: 0.5em 1em;
    margin: 0;
}

/* Checklist Buttons */
.checklist-item .btn,
.checklist-item button {
    position: absolute;
    top: 0.3em;
    right: 0.5em;
    margin: 0;
    padding: 0.25em 0.75em;
    font-size: 0.85rem;
}

/* === Mobile Responsiveness === */
@media (max-width: 768px) {
    #content-body { padding: 1em; }
    #content-body table, #content-body th, #content-body td { display: block; width: 100%; }
    #content-body th { background-color: transparent; font-weight: bold; padding-top: 1em; }
    .checklist-item .title,
    .checklist-item h3,
    .checklist-item h4 {
        font-size: 0.9rem;
        padding: 0.4em 0.8em;
    }
    .checklist-item .description,
    .checklist-item p {
        font-size: 0.9rem;
        padding: 0.4em 0.8em;
    }
}

  h1,
  h2,
  h3,
  .sa-form-title,
  .sa-form-nav-page-name,
  .sa-form-nav-pages-current i.fa-circle,
  .sa-form-field[data-flavor='section'],
  .sa-form-field[data-flavor='subsection']
  {
    color: #91183d;
  }

  section h2:first-of-type {
    border-bottom-color: #91183d;
  }

  #content-body {
    border-top-color: #91183d
  }

  .notification-alert {
    background-color: rgba(145, 24, 61, 0.1);
  }

  .notification-alert .notification-icon > i {
    color: #91183d;
  }

  .summary-communication > .notification-icon > .fa-bullhorn {
    color: #91183d;
  }

  li.page-item.active > a.page-link {
    background-color: #91183d
  }

  ul.header-actions > li > a > .header-action-label {
    color: #91183d
  }

  .student-summary-action-link {
    color: #91183d
  }

  button.btn-primary {
    background-color: #91183d
  }

  .ap-installment-list.table {
    .ap-installment-contact-highlight {
      background-color: #91183d
    }
  }
}
