/******************
    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
*/
@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/Montserrat-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
}

@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');
  font-weight: 100 900;
  font-style: italic;
}

/* Apply Montserrat site-wide */
body, h1, h2, h3, p, .question-text, .navbar, label, .btn {
  font-family: 'Montserrat', sans-serif !important;
  color: white !important;
}

/* ✅ Change LimeSurvey success (green) text to orange */
.text-success,
.ls-question-message.ls-em-tip.em_default.ls-em-success,
.alert-success {
  color: #D44B29 !important;
}

/* ✅ Change "Next" button color and style */
.fruity .btn-primary,
.fruity .ls-move-btn.btn-primary,
.fruity .ls-move-btn {
  background-color: #D44B29 !important;
  border-color: #D44B29 !important;
  color: #fff !important;
}

/* ✅ Button hover/focus states */
.fruity .btn-primary:hover,
.fruity .btn-primary:focus {
  background-color: #b03a1e !important;
  border-color: #b03a1e !important;
}
.fruity .btn-outline-secondary:hover {
  background-color: #b03a1e !important;
  border-color: #b03a1e !important;
}
/* ✅ Prevent built-in .sea_green.css file from overriding */
.fruity .text-success,
.fruity .btn-primary {
  color: #fff !important;
}
/* ✅ Custom checkbox tick and border in orange */
input[type="checkbox"]:checked {
  background-color: #D44B29 !important;
}
/* 🔶 Progress bar background color */
.progress-bar {
  background-color: #D44B29 !important;
}

.dropdown-toggle.nav-link::after {
  border-top-color: #D44B29 !important;
}

button[name="loadall"] {
  background-color: #D44B29 !important;
  color: white !important;
  border: 1px solid #D44B29 !important;
  border-radius: 5px;
}
input[type="checkbox"]:checked {
  accent-color: #D44B29 !important;
}
/* Optional: Unchecked border also in orange for visual consistency */
input[type="checkbox"] {
  border-color: #D44B29 !important;
}
label[for="datasecurity_accepted"] a {
  color: #D44B29 !important;
  font-weight: bold;
  text-decoration: underline; /* Optional, to mimic link style */
}
li.nav-item.ls-no-js-hidden.px-2::after {
  background-color: #D44B29 !important;
}
/* Match the button styles to "Next" and "Previous" */
#mandatory-soft-alert-box-modal,
#mandatory-soft-alert-box-modal.btn-outline-secondary,
.modal-footer .btn {
    background-color: #D44B29 !important; /* Orange */
    border-color: #D44B29 !important;
    color: white !important;
    font-weight: 600;
    border-radius: 4px;
    padding: 0.5rem 1rem;
    font-family: 'Montserrat', sans-serif;
}

/* Optional hover effect */
#mandatory-soft-alert-box-modal:hover,
.modal-footer .btn:hover {
    background-color: #bb3f21 !important;
    border-color: #bb3f21 !important;
    color: white !important;
}

/* Set modal body text to standard gray */
.modal-body p,
.modal-body {
    color: #666666 !important; 
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
}
/* Orange bar under top nav items like "Resume later", "Exit and clear survey" */
li.nav-item.ls-no-js-hidden::after {
    background-color: #D44B29 !important; /* Your orange */
}

/* Make "Restart this survey" link orange */
a.ls-return {
  color: #D44B29 !important;
  font-weight: 600;
}
a.ls-return:hover {
  text-decoration: underline;
  opacity: 0.9;
}

.card-link {
  color: #D44B29 !important;
  text-decoration: none;
}

.card-link:hover {
  opacity: 0.9; /* optional: darker shade on hover */
  text-decoration: underline;
}

/* ✅ Make the info/question icon orange */
.ls-questionhelp::before {
  color: #D44B29 !important;
}
select.form-select:focus {
  border-color: #D44B29 !important; /* your orange */
  box-shadow: 0 0 0 0.2rem rgba(212, 75, 41, 0.25);
}

.radio-item input[type="radio"]:checked + label::after {
  background-color: #D44B29 !important; /* fill color */
  border-color: #D44B29 !important;     /* border */
}

.checkbox-item input[type="checkbox"]:checked + label::after {
  background-color: #D44B29 !important; /* fill color */
  color: white !important;     /* border */
}

.fruity .slider-selection {
  background-image: linear-gradient(180deg, #f57c52 0%, #D44B29 100%);
}
.fruity .slider-handle {
    background-color: #D44B29;
}
.fruity .help-block {
    color: #ffffff;
}
.fruity .form-control:focus {
  border: 1px solid #D44B29 !important;
  box-shadow: 0 0 0 0.25rem rgba(212, 75, 41, 0.25) !important;
}
.fruity .btn-outline-secondary {
    background-color: #D44B29;
    border: 1px solid #D44B29 !important;
    color: #ffffff !important;
}

.dropdown-toggle.btn-outline-secondary  {
  background-color: #fff !important;
  color: #636363 !important;
  border: 0px solid #D44B29 !important;
}
 .dropdown-toggle.btn-outline-secondary:hover  {
  background-color: #fff !important;
  color: #636363 !important;
  border: 1px solid #D44B29 !important;
}
.fruity .dropdown-menu>.active>a, .fruity .dropdown-menu>.active>a:focus, .fruity .dropdown-menu>.active>a:hover, .fruity .dropdown-menu>li>a:focus, .fruity .dropdown-menu>li>a:hover {
    background-color: #1A5FE6 !important;
    color: #fff;
}
.bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {
    outline:  #fff !important;
    outline: 0px auto -webkit-focus-ring-color !important;
    outline-offset: -2px;
}
.fruity .text-danger {
    color: #D44B29 !important;
}
.fruity .alert-warning {
    background-color: #D44B29;
    border: 1px solid #fff;
    color: #fff;
}
.fruity .text-info{
    color: #D44B29 !important;
}
.star-1.star-drained.star-hover {
    text-shadow: 1px 2px #000000;
}
.star-2.star-drained.star-hover {
    text-shadow: 1px 2px #000000;
}
.star-3.star-drained.star-hover {
    text-shadow: 1px 2px #000000;
}
.star-4.star-drained.star-hover {
    text-shadow: 1px 2px #000000;
}
.star-5.star-drained.star-hover {
    text-shadow: 1px 2px #000000;
}
strong {
    font-weight: bolder;
    color: #D44B29;
}
.dual-logo-link {
    position: relative;
    display: inline-block;
}

.logo-half {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 50%;
    z-index: 2;
}

.left-link {
    left: 0;
    width: 43%;
}

.right-link {
    right: 0;
    width: 57%;
}

.logo-container img.logo {
    display: block;
    max-height: 90px;
    padding: 12px;
    width: auto;
}
@media (max-width: 768px) {
    .logo-container img.logo {
        max-height: 60px;
        padding: 8px;
    }
}
.fruity .input-error input {
    border: 1px solid #D44B29;
    color: #636363;
}
.question-container {
  background-color: #D44B29;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
.fruity a {
    color: #7ab7ff;
}
.fruity a:hover, .fruity a:focus {
    color: #C14425;
}
.card-body {
    background-color: #102d4d;
    border: 2px  solid #D44B29;
}
.fruity .text-primary{
    color: #D44B29 !important;
}
/* Limit height and make scrollable */
.dropdown-menu.show {
  max-height: 300px !important;  /* or adjust to fit */
  overflow-x: hidden;
}