/******************
    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
*/

.fruity_twentythree {
    padding-top: 5px ! Important;
}

.large-heading {
    line-height: 40px;
    font-size: 2rem;
}

.space-col {
    margin-bottom: 1em;
}
.question-container {
    margin-bottom: 1em;
}
.checkbox-item:last-child, .radio-item:last-child {
    margin-bottom: 0 !important;
}
.group-container .group-title {
    margin-top: auto;
}

a {
  color: #f9cb16;                /* bright yellow on dark-green #196948 */
  text-decoration: underline;    /* classic URL look */
  text-underline-offset: 2px;    /* pulls underline slightly away from glyphs */
  text-decoration-skip-ink: auto;/* nicer skipping on lowercase letters */
  cursor: pointer;
  transition: color .15s ease-in-out, 
              text-decoration-color .15s ease-in-out;
}

/* Visited links (optional but good usability) */
a:visited {
  color: #e4b10e;                /* slightly darker so visited ≠ fresh */
}

/* Mouse-over AND keyboard focus */
a:hover,
a:focus {
  color: #cca60e;                /* 20 % darker than base for clear contrast */
  text-decoration-color: currentColor;
}

/* Strong visual focus ring for keyboard / WCAG 2.2 */
a:focus-visible {
  outline: 2px dashed currentColor;
  outline-offset: 2px;
}

/* Optional: active state (while mouse button is down) */
a:active {
  color: #b28f0a;
}


@media all and (max-width: 992px) {
    
    .answer-container {
    justify-content: center;
    display: flex;
}
    .top-container {
        margin-bottom: 1rem;
    }
    .space-col {
        margin-top: auto;
        margin-bottom: .5em;
    }
    .question-container .question-valid-container {
        margin-top: auto;
        margin-bottom: 10px;
    }
    .checkbox-item:not(:last-child), .radio-item:not(:last-child) {
        margin-right: 1em;
    }
    .list-unstyled {
        display: flex;
        justify-content: center;
        margin-bottom: 0;
        flex-direction: column;
    }
    .ls-answers {
        margin-bottom: auto !important;
        width: 100%;
    }
    li.radio-item {
        margin-bottom: .5em;
    }
}

/*logo related */
/* Ensure the logo remains visible and is centered on small screens */
@media (max-width: 768px) {
    .logo-container {
        display: block !important; /* Override Bootstrap's d-none class */
        text-align: center; /* Center the content */
        margin: 0 auto; /* Center the container itself */
    }

    .logo {
        max-width: 80%; /* Make the logo responsive */
        height: auto; /* Maintain the logo's aspect ratio */
        margin: 0 auto; /* Center the image */
    }
}

/* General logo centering for larger screens */
.logo-container {
    text-align: center;
    margin: 0 auto;
}

