/* ============================================================
   CBIT B-Category Admissions – Main Stylesheet
   Bootstrap 5.3 compatible
   ============================================================ */

/* ---- Base Typography ---- */
html, body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #2a303b;
}

/* ---- Utility overrides ---- */
.text-custom  { color: #1cc3b2 !important; }
.bg-custom    { background-color: #0e2737 !important; }

/* ---- Navigation ---- */
.navbar-nav a {
  font-size: 16px;
  color: #404c62;
  font-weight: 600;
  padding: 5px 20px;
  letter-spacing: 0.01em;
  transition: color 0.3s;
  text-decoration: none;
}
.navbar-nav a:hover,
.navbar-nav a:focus { color: #1abc9c; }

@media (min-width: 768px) {
  .navbar-nav li { padding: 0 0.25em; }
}

.dropdown-menu a {
  font-size: 15px;
  color: #000;
  padding: 0 20px;
  letter-spacing: 0.01em;
  font-weight: 500;
}

/* ---- Table helpers ---- */
.table-responsive td,
.table-responsive th { white-space: nowrap; }

td:first-child,
th:first-child { padding-left: 15px; }

/* ---- Preview content ---- */
#content_preview {
  color: #000 !important;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}

/* ---- A4 print container ---- */
#a4-container {
  width: 210mm;
  min-height: 200mm;
  margin: 20px auto;
  background: #fff;
  box-shadow: 0 0 15px rgba(0,0,0,.06);
  padding: 26px 22px 32px 22px;
  font-size: 13px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

#a4-container .table { width: 100%; table-layout: auto; }

#a4-container td,
#a4-container th {
  word-break: break-word;
  white-space: normal;
  padding-left: 7px !important;
}

@media (max-width: 900px) {
  #a4-container {
    width: 100vw;
    min-width: unset;
    border-radius: 0;
    margin: 0;
    padding: 8px;
  }
}

/* ---- Custom table style for print view ---- */
.table_cs td,
.table_cs th {
  font-size: 12.5px;
  padding: 4px 7px !important;
}

/* ---- Print styles ---- */
@media print {
  body, html {
    width: 210mm;
    height: 297mm;
    margin: 0;
    background: #fff !important;
    font-size: 10pt;
    color: #000;
  }

  #a4-container {
    width: 210mm !important;
    min-height: 297mm !important;
    background: #fff !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
  }

  .no-print,
  .btn,
  nav,
  footer,
  header { display: none !important; }

  .container,
  .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 auto !important;
  }

  .card {
    page-break-inside: avoid;
    break-inside: avoid;
    box-shadow: none !important;
    border: 1px solid #000;
    margin-bottom: 1rem;
  }
}

/* ---- Form feedback helpers ---- */
.form-control.is-valid,
.form-select.is-valid {
  border-color: #198754;
  background-image: none; /* remove bootstrap tick icon for cleaner look */
}

/* ---- Spinner inside button ---- */
.spinner-border-sm {
  width: 0.85rem;
  height: 0.85rem;
  border-width: 0.15em;
}

/* ---- Responsive card max-width for check / print forms ---- */
@media (min-width: 768px) {
  .card.mx-auto { max-width: 860px; }
}
