/* ResearchGuru project theme — brand layer on top of the Fruity TwentyThree theme (white background). */
:root {
  --rg-brand: #0F5B5F; --rg-brand-2: #137C77; --rg-brand-soft: #D6EEE8; --rg-ink: #0E2527; --rg-ink-2: #3F5B5C; --rg-ink-3: #62807E;
  --rg-line: #D3E2DD; --rg-accent: #F2A22C; --rg-accent-2: #E4910F; --rg-on-accent: #2B1A02; --rg-band: #0B3A3D; --rg-r: 14px;
  --bs-font-sans-serif: "Roboto", "Helvetica Neue", Arial, system-ui, -apple-system, "Segoe UI", sans-serif;
}
body, body.font-noto, .font-noto { font-family: var(--bs-font-sans-serif); color: var(--rg-ink); }
#outerframeContainer, body { background: #ffffff; }

/* top bar with the logo */
#outerframeContainer .navbar, .top-container .navbar, nav.navbar { background: #ffffff; border-bottom: 1px solid var(--rg-line); box-shadow: none; }
.navbar-brand img, .logo-container img { max-height: 60px; }
.navbar .navbar-brand, .navbar .nav-link, .navbar a { color: var(--rg-ink-2); }
.navbar .nav-link:hover { color: var(--rg-brand); }

/* progress */
.progress { background: #EEF4F1; border-radius: 999px; height: 8px; }
.progress .progress-bar, .progress-bar { background-color: var(--rg-brand) !important; }
.top-container .progress-bar, .progress-bar.bg-primary { background-color: var(--rg-brand) !important; }

/* question cards */
.question-container, .group-outer-container .question-container, .ls-question-container { background: #ffffff; border: 1px solid var(--rg-line); border-radius: var(--rg-r); box-shadow: 0 1px 2px rgba(14, 37, 39, .05); }
.question-title-container, .question-text, .ls-label-question, .question-container .question-text { color: var(--rg-ink); }
.question-text strong, .question-number { color: var(--rg-brand); }
.ls-questionhelp, .question-help-container, .help-block, .text-info { color: var(--rg-ink-3) !important; }
.group-title, .group-name, h1, h2, h3, .survey-name, .survey-title { color: var(--rg-ink); font-weight: 600; }
.survey-description, .welcome-text { color: var(--rg-ink-2); }

/* inputs */
.form-control, .form-select { border-color: #BCD2CB; border-radius: 10px; color: var(--rg-ink); }
.form-control:focus, .form-select:focus { border-color: var(--rg-brand-2); box-shadow: 0 0 0 .2rem rgba(19, 124, 119, .18); }
.form-check-input:checked, input[type="radio"]:checked, input[type="checkbox"]:checked { background-color: var(--rg-brand); border-color: var(--rg-brand); }
.answer-item .form-check-input:focus { box-shadow: 0 0 0 .2rem rgba(19, 124, 119, .18); }
.checkbox-item label::before, .radio-item label::before { border-color: #BCD2CB; }
.checkbox-item input:checked + label::before, .radio-item input:checked + label::before { background: var(--rg-brand); border-color: var(--rg-brand); }
.checkbox-item input:checked + label::after, .radio-item input:checked + label::after { color: #fff; }

/* buttons: amber for Next/Submit only; teal for everything else */
.btn { border-radius: 10px; font-weight: 500; }
.btn-primary, .btn.btn-primary, .btn-success { background: var(--rg-brand); border-color: var(--rg-brand); color: #fff; }
.btn-primary:hover, .btn-success:hover, .btn-check:checked + .btn-primary, .btn-primary.active { background: var(--rg-brand-2); border-color: var(--rg-brand-2); color: #fff; }
.btn-check + .btn-primary, .btn-outline-primary { background: #fff; border-color: var(--rg-brand); color: var(--rg-brand); }
#ls-button-submit, .ls-move-next-btn, .ls-move-submit-btn { background: var(--rg-accent) !important; border-color: var(--rg-accent) !important; color: var(--rg-on-accent) !important; border-radius: 999px; padding: .55rem 1.6rem; min-width: 110px; }
#ls-button-submit:hover, .ls-move-next-btn:hover, .ls-move-submit-btn:hover { background: var(--rg-accent-2) !important; border-color: var(--rg-accent-2) !important; }
.ls-move-previous-btn, .btn-secondary, .btn-default, .btn-outline-secondary { background: #fff !important; border-color: var(--rg-brand) !important; color: var(--rg-brand) !important; border-radius: 999px; padding: .55rem 1.4rem; }
.ls-move-previous-btn:hover, .btn-secondary:hover { background: var(--rg-brand-soft) !important; }
.btn-warning, .ls-clearall { background: #fff !important; border-color: #BCD2CB !important; color: var(--rg-ink-2) !important; }
.btn-danger { background: #BA3A2F !important; border-color: #BA3A2F !important; }
.btn-link, a { color: var(--rg-brand); }
a:hover { color: var(--rg-brand-2); }
.input-group .btn, .input-group-text { border-radius: 0 10px 10px 0; }

/* validation and alerts */
.ls-error-mandatory, .text-danger, .has-error .control-label, .alert-danger { color: #BA3A2F; }
.alert-danger, .ls-questionhelp.text-danger { background: #FBE4E0; border-color: #FBE4E0; color: #BA3A2F; }
.alert-success { background: #DCF2E6; border-color: #DCF2E6; color: #1D7F53; }
.alert-warning { background: #FCEFD8; border-color: #FCEFD8; color: #A5650A; }
.alert-info { background: var(--rg-brand-soft); border-color: var(--rg-brand-soft); color: var(--rg-brand); }
.input-error, .ls-error { border-color: #BA3A2F; }

/* arrays and tables */
.table, .ls-answers { border-color: var(--rg-line); }
.ls-answers thead th, .table thead th, .array-flexible-row thead th { background: #EEF4F1; color: var(--rg-ink-2); border-color: var(--rg-line); }
.table-striped > tbody > tr:nth-of-type(odd) > *, .ls-answers tbody tr:nth-of-type(odd) > * { background-color: #F8FBFA; }
.ls-answers tbody tr:hover > * { background-color: var(--rg-brand-soft); }

/* footer */
footer, .footer, #outerframeContainer footer, .footer-container { background: #ffffff; color: var(--rg-ink-3); border-top: 1px solid var(--rg-line); }
.footer a, footer a { color: var(--rg-brand); }
/* the platform's "powered by" note: replaced by the study system name */
.ls-poweredby, .poweredby, [class*="powered"] { display: none !important; }

/* survey list and welcome */
.survey-list-heading, .ls-surveylist-title { color: var(--rg-brand); }
.card { border-radius: var(--rg-r); border-color: var(--rg-line); }

/* 1.2: ResearchGuru logo on the study list, error and maintenance pages */
.rg-logo, .ls-logo.rg-logo { max-height: 72px; width: auto; }
#surveys-list-jumbotron .rg-logo { display: block; margin: 0 auto 1rem; max-height: 90px; }
.rg-footer-logo { max-height: 40px; width: auto; }
.error-page .rg-logo { max-height: 60px; }
/* study list: the big logo is enough, hide the small one in the top bar */
body:has(#surveys-list-jumbotron) .navbar-brand.logo-container { display: none; }
#surveys-list-jumbotron .h3 { display: block; margin-top: .25rem; color: var(--rg-ink-2); font-weight: 500; }
/* error page: readable title, brand illustration */
.error-page .error-title { font-size: 1.75rem; line-height: 1.3; color: var(--rg-ink); }
.error-page .error-content { color: var(--rg-ink-2); }
.error-page img.m-auto { max-width: 320px; }