/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
/* ==================================
   FULLY OVERRIDE BOOTSTRAP SUCCESS
================================== */
:root {
  /* ===== Brand palette ===== */
  --brand-primary: #272971;
  --brand-secondary: #616595;
  --brand-neutral: #dfe5e8;
  --brand-accent-bright: #2b30c1; /* brighter than primary */
  --brand-accent-light: rgba(77, 163, 255, 0.18);

  /* ===== Bootstrap mapping ===== */
  --bs-primary: var(--brand-primary);
  --bs-secondary: var(--brand-secondary);
  --bs-success: var(--brand-neutral);
  --bs-green: var(--brand-neutral);

  --bs-primary-rgb: 39, 41, 113;
  --bs-secondary-rgb: 97, 101, 149;
  --bs-success-rgb: 145, 144, 159;
  --bs-green-rgb: 145, 144, 159;

  --bs-success-text: #1e1e1e;
  --bs-success-bg-subtle: rgba(145, 144, 159, 0.15);
  --bs-success-border-subtle: #91909f;
}

body {
  font-family: "Aptos", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

html,
body {
  height: 100%;
  margin: 0;
}

#dynamicReloadContainer,
#outerframeContainer,
#main-row,
#main-col,
form#limesurvey {
  min-height: 100vh;
}
/* Center ALL welcome screen text */
#welcome-container {
  text-align: center;
}


/* Question blocks */
.question-container,
.question-item {
  margin-bottom: 2.5rem;
}


.survey-name {
    color: var(--brand-primary);
}
/* ALL question text, regardless of inline styles */
.ls-label-question span {
  font-size: 1.4rem !important;
  line-height: 1.45 !important;
}
.question-container {
    margin-bottom:0em;
}
.question-container .question-title-container {
    margin-bottom: 0px;
    color: white;
}
.group-title {
    color: var(--brand-primary) !important;
}
/* ==================================
   APPLY BRAND COLORS GLOBALLY
   (ALL SURVEY SCREENS)
================================== */

/* Primary buttons & actions */
.btn-primary,
.ls-btn-primary,
.ls-btn-action {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #fff !important;
}

/* Next / Submit / Confirm */
.btn-success,
.ls-btn-next,
.ls-btn-submit,
.ls-btn-confirm {
  background-color: var(--brand-neutral) !important;
  border-color: var(--brand-neutral) !important;
  color: #fff !important;
}

/* Hover states */
.btn-primary:hover,
.ls-btn-primary:hover {
  background-color: #1e7fa3 !important;
  border-color: #1e7fa3 !important;
}

.ls-btn-next:hover,
.ls-btn-submit:hover {
  background-color: #7a7988 !important;
  border-color: #7a7988 !important;
}

/* Progress bar */
.progress-bar {
  background-color: var(--brand-secondary) !important;
}

/* Navigation bar */
.navbar,
.navbar-default {
  background-color: var(--brand-neutral) !important;
  border-color: var(--brand-neutral) !important;
}

/* Links */
a {
  color: var(--brand-primary);
}
a:hover {
  color: var(--brand-secondary);
}



/* White checkmark only */
.checkbox-item input[type="checkbox"]:checked
+ .checkbox-label::after {
  background-color: #fff !important;
}

/* Radios & checkboxes */
input[type="radio"]:checked,
input[type="checkbox"]:checked {
  accent-color: var(--brand-primary);
}

/* Alerts / messages */
.alert-success {
  background-color: rgba(145, 144, 159, 0.15) !important;
  border-color: var(--brand-neutral) !important;
  color: #1e1e1e !important;
}
.namts-header {
  background-color: var(--brand-primary);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.5rem 0;
}

/* Navbar container */
#survey-nav {
  background-color: var(--brand-neutral);
  min-height: 72px;
}

/* Center logo vertically + horizontally */
.namts-logo-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Logo sizing */
.namts-logo {
  max-height: 48px;
}

/* Validation / Error messages */

.emtip.error,
.em_num_answers {
  border: 2px solid var(--brand-primary);
  color: var(--brand-primary);
  padding: 0.75rem 1rem;
  border-radius: 4px;
  font-weight: 500;
}


/* Radio outer circle */
.radio-item .radio-label::before {
  border-color: var(--brand-primary) !important;
}

/* Radio inner dot (SELECTED) */
.radio-item input[type="radio"]:checked + .radio-label::after {
  background-color: var(--brand-primary) !important;
}

/* Remove Bootstrap green background */
.radio-item input[type="radio"]:checked + .radio-label::before {
  border-color: var(--brand-primary) !important;
}

/* Hover */
.radio-item:hover .radio-label::before {
  border-color: var(--brand-secondary);
}

/* Unchecked checkbox = GREY (matches text) */
.checkbox-item input[type="checkbox"]:not(:checked)
+ .checkbox-label {
  color: #6c757d; /* Bootstrap gray */
}

.checkbox-item input[type="checkbox"]:not(:checked)
+ .checkbox-label::before {
  border-color: #6c757d !important;
  background-color: transparent;
}
/* Checked checkbox box */
.checkbox-item input[type="checkbox"]:checked
+ .checkbox-label::before {
  border-color: var(--brand-primary) !important;
  background-color: var(--brand-primary) !important;
}

/* Checked checkmark = WHITE */
.checkbox-item input[type="checkbox"]:checked
+ .checkbox-label::after {
  color: #fff !important;
}


.checkbox-item input[type="checkbox"]:checked + .checkbox-label::after {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
}

.ls-answers .radio-label::before {
  border-color: var(--brand-primary) !important;
}

.ls-answers input[type="radio"]:checked + .radio-label::after {
  background-color: var(--brand-primary) !important;
}
/* Any checked radio label */
.radio-item input[type="radio"]:checked + .radio-label,
.answer-item input[type="radio"]:checked + label{
  color: var(--brand-primary) !important;
}

/* Any checked checkbox label */
.checkbox-item input[type="checkbox"]:checked + .checkbox-label,
.answer-item input[type="checkbox"]:checked + label,
.answer-item.checked label {
  color: var(--brand-primary) !important;
}

/* Kill Bootstrap success text utilities */
.text-success {
  color: var(--brand-primary) !important;
}



/* ================================
   QUESTION TEXT (BIGGER & CLEAR)
================================ */

.ls-label-question {
  font-size: 1.35rem;          /* ~21–22px */
  line-height: 1.45;
  font-weight: 600;
  color: #000 !important;
}

/* Optional: add spacing under question */
.question-title-container {
  margin-bottom: 1rem;
}


/* ================================
   ARRAY HEADERS – DEFAULT (BLACK)
================================ */

table.table-array-radio thead th.answer-text {
  color: #000 !important;
  font-weight: 500;
  background-color: transparent;
}

/* ================================
   ARRAY BODY CELLS (NOT HEADERS)
================================ */

table.table-array-radio tbody td.answer-item {
  text-align: center;
}

/* Hover highlight (light blue) */
table.table-array-radio tbody tr:hover td {
  background-color: transparent;
}

/* Selected cell highlight */
table.table-array-radio
tbody td.answer-item input[type="radio"]:checked + label {
  border-radius: 6px;
  padding: 0.35rem 0.5rem;
  color: #000 !important;
  font-weight: 600;
}

/* ================================
   HEADER COLOR FOLLOWS SELECTION
   (Modern CSS :has)
================================ */

/* AO01 */
table.table-array-radio:has(td.answer_cell_AO01 input:checked)
thead th[id$="AO01"] {
  color: var(--brand-accent-bright) !important;
  font-weight: 600;
}

/* AO02 */
table.table-array-radio:has(td.answer_cell_AO02 input:checked)
thead th[id$="AO02"] {
  color: var(--brand-accent-bright) !important;
  font-weight: 600;
}

/* AO03 */
table.table-array-radio:has(td.answer_cell_AO03 input:checked)
thead th[id$="AO03"] {
  color: var(--brand-accent-bright) !important;
  font-weight: 600;
}

/* AO04 */
table.table-array-radio:has(td.answer_cell_AO04 input:checked)
thead th[id$="AO04"] {
  color: var(--brand-accent-bright) !important;
  font-weight: 600;
}

/* AO05 */
table.table-array-radio:has(td.answer_cell_AO05 input:checked)
thead th[id$="AO05"] {
  color: var(--brand-accent-bright) !important;
  font-weight: 600;
}
/* ================================
   ARRAY RADIO CIRCLES – BLACK → BLUE
================================ */

/* 1️⃣ Unchecked radio = BLACK */
table.table-array-radio tbody
.answer-item label.ls-label-xs-visibility::before {
  border-color: #000 !important;
}

/* 2️⃣ Checked radio outer ring = BRIGHT BLUE */
table.table-array-radio tbody
.answer-item input[type="radio"]:checked
+ label.ls-label-xs-visibility::before {
  border-color: var(--brand-accent-bright) !important;
}

/* 3️⃣ Checked radio inner dot = BRIGHT BLUE */
table.table-array-radio tbody
.answer-item input[type="radio"]:checked
+ label.ls-label-xs-visibility::after {
  background-color: var(--brand-accent-bright) !important;
}

/* AO01 column hover */
table.table-array-radio:has(td.answer_cell_AO01:hover)
thead th[id$="AO01"],
table.table-array-radio:has(td.answer_cell_AO01:hover)
tbody td.answer_cell_AO01 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}


/* AO02 column hover */
table.table-array-radio:has(td.answer_cell_AO02:hover)
thead th[id$="AO02"],
table.table-array-radio:has(td.answer_cell_AO02:hover)
tbody td.answer_cell_AO02 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}

/* AO03 column hover */
table.table-array-radio:has(td.answer_cell_AO03:hover)
thead th[id$="AO03"],
table.table-array-radio:has(td.answer_cell_AO03:hover)
tbody td.answer_cell_AO03 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}

/* AO04 column hover */
table.table-array-radio:has(td.answer_cell_AO04:hover)
thead th[id$="AO04"],
table.table-array-radio:has(td.answer_cell_AO04:hover)
tbody td.answer_cell_AO04 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}

/* AO05 column hover */
table.table-array-radio:has(td.answer_cell_AO05:hover)
thead th[id$="AO05"],
table.table-array-radio:has(td.answer_cell_AO05:hover)
tbody td.answer_cell_AO05 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}

table.table-array-radio:has(td.answer_cell_AO01:hover)
thead th[id$="AO01"],
table.table-array-radio:has(td.answer_cell_AO02:hover)
thead th[id$="AO02"],
table.table-array-radio:has(td.answer_cell_AO03:hover)
thead th[id$="AO03"],
table.table-array-radio:has(td.answer_cell_AO04:hover)
thead th[id$="AO04"],
table.table-array-radio:has(td.answer_cell_AO05:hover)
thead th[id$="AO05"] {
  color: var(--brand-accent-bright) !important;
  transition: background-color 0s;
}

/* Header text color on column hover */
table.table-array-radio:has(td.answer-item:hover)
thead th.answer-text {
  transition: background-color 0s ease, color 0s ease;
}


/* Radio ring follows column hover */
table.table-array-radio:has(td.answer-item:hover)
tbody .answer-item:hover label.ls-label-xs-visibility::before {
  border-color: var(--brand-accent-bright) !important;
}

/* ================================
   ARRAY ANSWER BODY – TRANSPARENT
   (HOVER SAFE)
================================ */

/* Default row background (NO !important) */
table.table-array-radio tbody tr.answers-list,
table.table-array-radio tbody tr.ls-even,
table.table-array-radio tbody tr.ls-odd {
  background-color: transparent;
}

/* Default cell background (NO !important) */
table.table-array-radio tbody tr.answers-list td {
  background-color: transparent;
}

/* Labels never add background */
table.table-array-radio tbody
.answer-item label.ls-label-xs-visibility {
  background-color: transparent;
}
/* ==================================
   KILL BOOTSTRAP ROW HOVER (ARRAY ONLY)
================================== */

table.table-array-radio:has(
  td.answer_cell_AO01:hover,
  td.answer_cell_AO01 *:hover,
  td.answer_cell_AO01 input:checked
)
thead th[id$="AO01"],
table.table-array-radio:has(
  td.answer_cell_AO01:hover,
  td.answer_cell_AO01 *:hover,
  td.answer_cell_AO01 input:checked
)
tbody td.answer_cell_AO01 {
  background-color: var(--brand-accent-light);
  transition: background-color 0s;
}



table.table-array-radio {
  --bs-table-hover-bg: transparent;
}

/* MAIN QUESTION TEXT */
.ls-label-question,
.ls-question-text {
  font-size: 1.4rem !important;   /* ~22–23px */
  line-height: 1.45 !important;
  font-weight: 600;
  color: #000;
}
/* SUBQUESTION / ROW TEXT */
.ls-label-subquestion,
.ls-label-row,
.answertext,
.subquestion-text {
  font-size: 1.15rem;   /* ~18–19px */
  line-height: 1.4;
  font-weight: 500;
  color: #000;
}
/* SECTION / GROUP TITLES */
.group-title,
.ls-group-title,
.question-group-title {
  font-size: 1rem;      /* ~16px */
  font-weight: 500;
  text-transform: uppercase;  /* optional */
  letter-spacing: 0.03em;     /* optional */
  color: #444;
  margin-bottom: 0.5rem;
}
.checkbox-item input[type="checkbox"]:checked
+ .checkbox-label::after {
  color: #fff !important;
}
/* Force survey to full width */
#outerframeContainer,
#main-col,
.top-content,
#survey-nav > .container-fluid {
  max-width: 100% !important;
  width: 100% !important;
}
#main-col,
.top-content,
#survey-nav > .container-fluid {
  padding-left: clamp(1rem, 4vw, 4rem);
  padding-right: clamp(1rem, 4vw, 4rem);
}
#welcome-container{
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}