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

.table-bordered>thead>tr>th {
    border: 1px solid #dadada;
}

.table-bordered>thead>tr>td {
    border: 1px solid #dadada;
}

/* #################### general css ################### */

body {
    font-family: "Poppins", "Lato", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    padding: 0;
    margin: 0;
}

body .top-container {
    margin: 0;
}

#outerwrapper {
    margin-top: 12px;
    margin-bottom: 12px;
    float: none;
    clear: both;
    background-color: #FFF;
    box-shadow: 0 2px 16px rgba(0,0,0,0.12);
    border-radius: 8px;
    overflow-x: hidden;
}

.text-info {
    color: #333 !important;
}

.text-danger {
    color: #dc3545 !important;
}

div.save-survey-form {
    padding: 20px;
}

/* Save/Load form pages */
div#main-row {
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
}

div#main-row .card.bg-light {
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef;
    border-radius: 8px;
}

div#main-row .card-title.h2 {
    font-size: 1.3rem;
    font-weight: 600;
    color: #2c3e50;
}

div#main-row .btn-outline-secondary {
    color: var(--theme-color, #1f82c0);
    background-color: transparent;
    border-color: var(--theme-color, #1f82c0);
    padding: 8px 24px;
    font-weight: 500;
    border-radius: 8px;
}

div#main-row .btn-outline-secondary:hover {
    color: #fff;
    background-color: var(--theme-color, #1f82c0);
    border-color: var(--theme-color, #1f82c0);
}

li.radio-item, 
li.checkbox-item, 
li.radio-text-item, 
li.checkbox-text-item {
    margin-bottom: 14px !important;
}

.dropdown-menu>li>a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: #e9ecef;
}

img {
    max-width: 100%;
}

.uploadedfiles .upload.comment {
    word-break: break-all;
}

.leftheader.information-item {
    display: none !important;
}

.rightheader.information-item {
    display: none !important;
}

.table>:not(:first-child) {
    border-top: none; 
}

@media only screen and (max-width: 768px) {
    .list-dropdown.question-container .ls-answers.answer-item div:nth-child(1),
    .list-dropdown.question-container .ls-answers.answer-item div:nth-child(3).text-item.other-text-item {
        width: 100%;
    }
}

.group-description {
    text-align: center;
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373;
}

.ri-delete-bin-fill:before {
    color: #1f82c0;
}

.text-danger.dynamic-total {
    color: #e67e22 !important;
}

div.answer-item.dropdow-item.language-item {
    width: 200px;
}

.other-text-item {
    padding: 0px;
}

.othertext-label-checkox-container{
    margin-bottom: 15px;
}

.numeric-multi ul.number-list li.ls-group-remaining.ls-group-dynamic  {
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
}

@media (max-width: 768px) {
    .numeric-multi ul.number-list li.ls-group-remaining.ls-group-dynamic div:nth-child(1)  {
        text-align: center;
    }
}

.numeric-multi ul.number-list li.ls-group-total.ls-group-dynamic {
    display: inline-flex;
    flex-wrap: wrap;
    width: 100%;
    margin-left: auto;
}

@media (max-width: 768px) {
    .numeric-multi ul.number-list li.ls-group-total.ls-group-dynamic div:nth-child(1) {
        text-align: center;
    }
}

.ls-group-remaining div:nth-child(1),
.ls-group-total div:nth-child(1) {
   text-align: center; 
}

.asterisk.float-start {
    margin-right: 5px;
    font-size: 90%;
    vertical-align: top;
}

/* #################### first page start ################### */

.survey-welcome {
    margin-top: 15px;
}

.question-count-text {
    margin-top: 15px;
}

/* Privacy */

.privacy {
    margin-top: 15px;
    padding: 15px;
    margin: 15px 1px;
    border: 1px solid #e9ecef;
    background-color: #f8f9fa;
    border-radius: 6px;
}

.privacy-block div:nth-child(2) {
    padding-top: 20px;
}

.privacy-heading.h4.text-primary {
    font-size: 14px;
    color: #333 !important;
    font-weight: bold;
}

p.ls-privacy-body {
    margin: 15px 0 0 0;
    font-style: italic;
}

/* Privacy policy */

.panel {
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    background-color: transparent;
}

.panel-primary {
    border-color: transparent;
}

.panel-primary>.panel-heading {
    color: #000;
    background-color: transparent;
    border-color: transparent;
    padding: 15px 0;
}

.panel-body {
    padding: 5px 0;
}

.panel-footer {
    padding: 10px 0;
    background-color: transparent;
    border-top: transparent;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

input#datasecurity_accepted {
    vertical-align: top;
}

/* #################### first page end ################### */

/* #################### header start ################### */

.header-wrapper {
    background-color: #fff;
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 0;
    margin-bottom: 0;
}

span.navbar-banner {
    display: block;
    width: 100%;
    text-align: center;
}

.logo-bar {
    margin-top: 0;
    padding: 8px 0 0;
    display: flex;
    align-items: center;
}

.navbar-logo-left {
    padding: 0 10px;
}

.navbar-logo-middle {
    padding: 0 10px;
    text-align: center;
}

.navbar-logo-right {
    padding: 0 10px;
    text-align: right;
}

/* survey heading */

.survey-name {
    font-family: "Poppins", "Lato", "Helvetica Neue", sans-serif;
    font-weight: 600;
    line-height: 1.3;
    font-size: 1.5rem;
    letter-spacing: -0.02em;
    color: #2c3e50;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 0 8px;
}

/* #################### header end ################### */

/* #################### progress bar start ################### */

.ls-progress-wrapper {
    position: relative;
    padding: 8px 0 4px;
}

.progress {
    border-radius: 20px;
    height: 18px;
    overflow: hidden;
    background-color: #e9ecef;
}

.progress-bar {
    background-color: #1f82c0;
    border-radius: 20px;
    transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    color: #fff;
}

/* #################### progress bar end ################### */

/* #################### group start ################### */

.group-outer-container,
.group-container {
    margin-bottom: 0;
}

.group-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #1f82c0;
    margin: 0;
    margin-bottom: 20px;
    padding: 12px 20px;
    background-color: #f0f7fc;
    border-left: 3px solid #1f82c0;
    border-radius: 0 6px 6px 0;
    text-align: left;
}

.well {
    justify-content: center;
    background-color: transparent;
    margin-top: 0;
    padding: 0 15px;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

/* #################### group end ################### */

/* #################### question start ################### */

.question-container {
    background-color: #fff;
    padding-bottom: 15px;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
    transition: box-shadow 0.2s ease;
}

.question-container:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.question-title-container {
    color: #FFFFFF;
    margin-bottom: 0;
    padding: 12px 20px;
    border-radius: 8px 8px 0 0;
}

/* Asterisk for mandatory questions */
.question-title-container .asterisk {
    opacity: 0.85;
}

.question-title-container .asterisk .fa-asterisk {
    font-size: 8px;
}

.question-title-container .text-muted {
    color: rgba(255,255,255,0.7) !important;
}

.form-control:focus {
    color: #555;
    border-color: #1f82c0;
    box-shadow: 0 0 0 3px rgba(31, 130, 192, 0.15) !important;
}

.question-number,
.question-code {
    font-weight: normal;
    float: none;
    margin: 0;
}

.question-text {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
}

/* Asterisco inline com texto da pergunta */
.ls-label-question {
    display: flex;
    align-items: baseline;
    gap: 2px;
}

.ls-label-question h3 {
    margin: 0;
}

/* Question text inherits white from parent, no need to override */

.question-help-container {
    color: #888 !important;
    font-size: 13px;
    padding: 4px 20px;
}

.question-valid-container {
    color: #555 !important;
    font-size: 13px;
    padding: 0 4px;
}

/* Answer area */
.answer-container {
    padding: 0 20px;
}

.ls-answers tbody .answertext {
    text-align: left;
    font-weight: 500;
    color: #444;
}

.array-flexible-row .ls-answers .answertextright {
    text-align: right;
}

/* Table styling */
.table-array-radio,
.table-bordered {
    border-color: #e9ecef;
}

.table-array-radio thead th.answer-text {
    font-size: 12px;
    font-weight: 600;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 10px 8px;
    background-color: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
}

.table-hover tbody tr:hover {
    background-color: #f0f7fc;
}

/* Radio & checkbox styling */
input[type="radio"],
input[type="checkbox"] {
    accent-color: #1f82c0;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* #################### question end ################### */

/* #################### particular question start ################### */

.choice-5-pt-radio li.radio-item {
    margin-right: 15px;
}

.choice-5-pt-radio .radio-item label::before,
.list-radio .radio-item label::before,
.list-with-comment .radio-item label::before {
    top: 1px;
}

.choice-5-pt-radio .radio-item label::after,
.list-radio .radio-item label::after,
.list-with-comment .radio-item label::after {
    top: 4px;
}

.multiple-opt .checkbox-item label::before .multiple-opt-comments .checkbox-item label::before {
    top: 3px;
}

.multiple-opt .checkbox-item label::after,
.multiple-opt-comments .checkbox-item label::after {
    top: 4px;
    background-color: transparent;
}

.array-multi-flexi .checkbox-item label::after {
    left: 0px;
}

.multiple-opt .checkbox-item label::before,
.multiple-opt-comments .checkbox-item label::before {
    top: 3px;
}

div.gender-button,
div.yesno-button {
    column-gap: 10px;
}

@media only screen and (max-width: 468px) {
    .date .date-item div:nth-child(1).col-3 {
        width: 100%;
    }
}

/* #################### particular question end ################### */

/* #################### language switcher start ################### */

.lang-switcher {
    position: absolute;
    top: 10px;
    right: 16px;
    z-index: 10;
}

.lang-switcher-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e0e3e8;
    border-radius: 8px;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #444;
    cursor: pointer;
    transition: all 0.2s ease;
}

.lang-switcher-btn:hover {
    border-color: #1f82c0;
    background-color: #f0f7fc;
}

.lang-switcher-btn::after {
    font-size: 10px;
}

.lang-flag {
    font-size: 18px;
    line-height: 1;
}

.lang-code {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.lang-dropdown {
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    border: 1px solid #e9ecef;
    padding: 4px;
    min-width: 160px;
}

.lang-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 13px;
}

.lang-dropdown .dropdown-item:hover {
    background-color: #f0f7fc;
    color: #1f82c0;
}

.lang-dropdown .dropdown-item.active {
    background-color: #1f82c0;
    color: #fff;
}

/* Header needs position relative for the language switcher */
.header-wrapper {
    position: relative;
}

/* Hide the default language changer (we have our own in the header) */
.form-change-lang.row {
    display: none;
}

/* #################### language switcher end ################### */

/* #################### dropdown & link start ################### */
/* #################### dropdown & link end ################### */

/* #################### footer navbar (bottom toolbar) start ################### */

#survey-nav {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef !important;
    border-bottom: none !important;
    border-radius: 0 0 8px 8px;
    padding: 0;
}

#survey-nav .container-fluid {
    padding: 0;
    justify-content: center;
}

#navbar {
    padding: 4px 0 !important;
}

#navbar ul.nav.navbar-nav {
    width: 100%;
}

ul.navbar-right {
    padding: 0;
}

/* Toolbar link base styles */
#survey-nav .nav-link {
    color: #6c757d;
    font-size: 13px;
    padding: 8px 16px;
    border-radius: 6px;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

#survey-nav .nav-link:hover {
    color: #1f82c0;
    background-color: rgba(31, 130, 192, 0.08);
}

#survey-nav .nav-link i {
    font-size: 16px;
}

/* Column alignment */
#navbar li.navbar-item-left {
    text-align: left;
}

#navbar li.navbar-item-middle {
    text-align: center;
}

#navbar li.navbar-item-right {
    text-align: right;
}

/* Question index dropdown */
#survey-nav .dropdown-menu {
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    border: 1px solid #e9ecef;
    padding: 4px;
}

#survey-nav .dropdown-item {
    border-radius: 4px;
    font-size: 13px;
    padding: 6px 12px;
}

#survey-nav .dropdown-item:hover {
    background-color: rgba(31, 130, 192, 0.08);
    color: #1f82c0;
}

.dropdown-item.disabled,
.dropdown-item:disabled {
    color: #fff !important;
    background-color: #1f82c0 !important;
    border-radius: 4px;
}

.navbar-item-middle li.list-group-itemindex-item a {
    color: #333;
}

/* Mobile navbar toggler */
.navbar-toggler {
    color: #6c757d;
    background-color: transparent;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    padding: 6px 10px;
}

.navbar-toggler:hover {
    background-color: #f0f0f0;
}

span.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(108, 117, 125, 0.8)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Responsive */
@media screen and (max-width: 768px) {
    #survey-nav .container-fluid {
        padding: 8px;
    }

    #survey-nav .nav-link {
        justify-content: center;
        padding: 10px 16px;
    }

    div.gender-button,
    div.yesno-button {
        width: 100%;
    }
}

/* #################### footer navbar (bottom toolbar) end ################### */

/* #################### footer start ################### */

footer {
    text-align: center;
    padding: 24px 16px;
    margin-top: 16px;
    border-top: 1px solid #e9ecef;
}

footer .footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

footer .footer-logo-img {
    height: 28px;
    width: auto;
    opacity: 0.4;
    transition: opacity 0.2s ease;
}

footer .footer-logo:hover .footer-logo-img {
    opacity: 0.7;
}

footer .footer-text {
    font-size: 12px;
    color: #bbb;
}

footer a {
    color: #999 !important;
    text-decoration: none;
    transition: color 0.2s ease;
}

footer a:hover {
    color: #1f82c0 !important;
}

/* #################### footer end ################### */

/* #################### table & form styling start ################### */

label::after {
    background-color: transparent;
}

/* Zebra striping - subtle alternating rows */
tr.ls-odd,
.array-flexible-column tr.answers-list:nth-child(even) {
    background-color: #f8f9fa;
}

/* Table borders - subtle separators */
tbody,
td,
tfoot,
th,
thead,
tr {
    border-color: #f0f0f0;
}

.table-bordered>thead>tr>td,
.table-bordered>thead>tr>th {
    border-color: #e9ecef;
}

.btn-group>.btn-group:not(:last-child)>.btn,
.btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
    border-radius: 0;
}

.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:nth-child(n+3),
.btn-group>:not(.btn-check)+.btn {
    border-radius: 0;
}

/* Form select focus */
.form-select:focus {
    border-color: #1f82c0;
    box-shadow: 0 0 0 3px rgba(31, 130, 192, 0.15) !important;
    outline: 0;
}

/* Table row hover */
.table-hover>tbody>tr:hover,
tr.answers-list:hover,
.array-flexible-column tr.answers-list:hover {
    background-color: #f0f7fc !important;
}

.table-hover>tbody>tr:hover>*,
.table-hover>tbody>tr:hover>td,
.table-hover>tbody>tr:hover>th {
    --bs-table-accent-bg: #f0f7fc !important;
    background-color: #f0f7fc !important;
    color: #333;
}

/* #################### table & form styling end ################### */

.ls-input-group-extra {
    vertical-align: top;
    padding: 1rem 1.2rem;
}

@media (min-width: 768px) {
    .navbar-expand-md .navbar-nav .dropdown-menu {
        position: absolute;
        inset: auto 70px auto auto;
    }
}

@media only screen and (max-width: 760px),
(max-device-width: 1024px) and (min-device-width: 768px) {

    table.ls-answers>tbody>tr td.answer-item.radio-item,
    table.ls-answers>tbody>tr td.answer-item.checkbox-item {
        border-bottom: 1px solid #ddd;
        padding-left: 30px;
        padding-top: 10px;
        padding-bottom: 0px;
    }
}

/*--------------------start button--------------------- */

.btn {
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px;
    padding: 8px 16px;
    transition: all 0.2s ease;
}

.btn-group-lg>.btn,
.btn-lg {
    line-height: 1.3333333;
    padding: 10px 20px;
}

/* Next / Submit buttons */
.ls-move-submit-btn,
.ls-move-next-btn {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
    padding: 10px 28px;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(31, 130, 192, 0.25);
}

.ls-move-submit-btn:hover,
.ls-move-next-btn:hover {
    color: #fff;
    background-color: #1a6fa5;
    border-color: #1a6fa5;
    box-shadow: 0 4px 8px rgba(31, 130, 192, 0.3);
    transform: translateY(-1px);
}

.ls-move-submit-btn:active,
.ls-move-submit-btn.active,
.ls-move-submit-btn:focus,
.ls-move-next-btn:active,
.ls-move-next-btn.active,
.ls-move-next-btn:focus {
    color: #fff;
    background-color: #176192;
    border-color: #176192;
    box-shadow: 0 1px 2px rgba(31, 130, 192, 0.3);
    transform: translateY(0);
}

/* Previous button - outline version of Next button */
.ls-move-previous-btn {
    color: var(--theme-color, #1f82c0);
    background-color: transparent;
    border: 1px solid var(--theme-color, #1f82c0);
}

.ls-move-previous-btn:hover {
    color: #fff;
    background-color: var(--theme-color, #1f82c0);
    border-color: var(--theme-color, #1f82c0);
}

/* Gender / Yes-No / Bootstrap buttons: default */
.gender-button .btn-primary,
.yes-no .btn-primary,
.bootstrap-buttons-div .button-item {
    color: #444;
    background-color: #f0f2f5;
    border-color: #e0e3e8;
}

/* Gender / Yes-No / Bootstrap buttons: hover */
.gender-button .btn-primary:hover,
.yes-no .btn-primary:hover,
.bootstrap-buttons-div .button-item:hover {
    color: #1f82c0;
    background-color: #e8f0f8;
    border-color: #1f82c0;
}

/* Gender / Yes-No / Bootstrap buttons: active/checked */
.btn-check:active+.btn-primary,
.btn-check:checked+.btn-primary,
.btn-primary.active,
.btn-primary:active,
.show>.btn-primary.dropdown-toggle {
    color: #fff !important;
    background-color: #1f82c0 !important;
    border-color: #1f82c0 !important;
}

.gender-button .btn-primary:active,
.gender-button .btn-primary.active:hover,
.gender-button .btn-primary:focus,
.gender-button .btn-primary.active,
.gender-button .btn-primary.active:focus,
.yes-no .btn-primary:focus,
.yes-no .btn-primary.active,
.yes-no .btn-primary.active:hover,
.yes-no .btn-primary.active:focus,
.bootstrap-buttons-div .button-item:focus,
.bootstrap-buttons-div .button-item.active,
.bootstrap-buttons-div .button-item:focus {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

/*date picker*/
.date-timepicker-group .btn-primary,
.date-timepicker-group .btn-primary:hover,
.date-timepicker-group .btn-primary:active,
.date-timepicker-group .btn-primary:focus,
.date-timepicker-group .btn-primary:active:hover,
.date-timepicker-group .btn-primary:active:focus,
.date-timepicker-group .btn-primary:active.focus,
.date-timepicker-group .btn-primary.hover,
.date-timepicker-group .btn-primary.active,
.date-timepicker-group .btn-primary.focus,
.date-timepicker-group .btn-primary.active:hover,
.date-timepicker-group .btn-primary.active:focus,
.date-timepicker-group .btn-primary.active.focus {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

/*btn btn-default*/

/*previous-btn - outline version of Next button */
.ls-move-previous-btn:hover,
.ls-move-previous-btn:active:hover,
.ls-move-previous-btn.active:hover,
.ls-move-previous-btn:active,
.ls-move-previous-btn.active,
.ls-move-previous-btn:focus,
.ls-move-previous-btn.focus,
.ls-move-previous-btn:active:focus,
.ls-move-previous-btn.active:focus,
.ls-move-previous-btn:active.focus,
.ls-move-previous-btn.active.focus {
    color: #fff;
    background-color: var(--theme-color, #1f82c0);
    border-color: var(--theme-color, #1f82c0);
}

.ls-move-previous-btn {
    color: var(--theme-color, #1f82c0);
    background-color: transparent;
    border-color: var(--theme-color, #1f82c0);
}

/*###############Upload start###########*/
/*upload: Save Changes...*/
.upload.btn-primary {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.upload.btn-primary:hover,
.upload.btn-primary:active:hover,
.upload.btn-primary.active:hover {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

.upload.btn-primary:active,
.upload.btn-primary.active,
.upload.btn-primary:focus,
.upload.btn-primary.focus,
.upload.btn-primary:active:focus,
.upload.btn-primary.active:focus,
.upload.btn-primary:active.focus,
.upload.btn-primary.active.focus {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

/*upload popup start*/
/*start: upload: Select file...*/
.upload-div .btn {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.upload-div .btn:active,
.upload-div .btn.active,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn:focus,
.upload-div .btn:focus,
.upload-div .btn.focus,
.upload-div .btn.focus {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.upload-div .btn:hover,
.upload-div .btn:active:hover,
.upload-div .btn.active:hover {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

.upload-files .uploadedfiles td a.btn-primary {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.upload-files .uploadedfiles td a.btn-primary:hover,
.upload-files .uploadedfiles td a.btn-primary:active,
.upload-files .uploadedfiles td a.btn-primary:focus {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

fieldset div:nth-child(3) a.btn {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}

.file-upload-modal-footer .btn {
    color: #ffffff !important;
    border-color: #4cae4c !important;
    background-color: #5cb85c !important;
    background-image: -webkit-linear-gradient(#5cb85c, #4cae4c) !important;
}

.file-upload-modal-footer .btn:hover, 
.file-upload-modal-footer .btn:active:hover, 
.file-upload-modal-footer .btn.active:hover {
    color: #ffffff !important;
    border-color: #398439 !important;
    background-color: #449d44 !important;
    background-image: -webkit-linear-gradient(#449d44, #398439) !important;
}

/*end: upload: Select file...*/

/*upload: You can upload...*/
.uploader .alert-info {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}


/*file upload popup save-changes*/
.file-upload-modal-footer .btn {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}


.file-upload-modal-footer .btn:active,
.file-upload-modal-footer .btn.active,
.file-upload-modal-footer .btn:focus,
.file-upload-modal-footer .btn.focus,
.file-upload-modal-footer .btn:active:focus,
.file-upload-modal-footer .btn.active:focus,
.file-upload-modal-footer .btn:active.focus,
.file-upload-modal-footer .btn.active.focus {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.file-upload-modal-footer .btn:hover,
.file-upload-modal-footer .btn:active:hover,
.file-upload-modal-footer .btn.active:hover {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

/*upload popup end*/

/*###############Upload end###########*/

.save-survey-input .btn,
.modal-dialog .btn {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.save-survey-input .btn:hover,
.save-survey-input .btn:active:hover,
.save-survey-input .btn.active:hover,
.modal-dialog .btn:hover,
.modal-dialog .btn:active:hover,
.modal-dialog .btn.active:hover {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

.btn-info {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
}

.btn-info:hover {
    color: #1f82c0;
    background-color: #fff;
    border-color: #1f82c0;
}

/*--------------------end button--------------------- */

/*--------------------start sortables----------------*/

.list-samechoiceheight .sortable-list {
    border: 1px dotted #ccc;
    padding: 5px;
}

/*unsorted*/
.sortable-choice .ls-choice.sortable-item {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 5px;
}

/*sorted*/
.sortable-rank .ls-choice.sortable-item {
    color: #fff;
    background-color: #1f82c0;
    border-color: #1f82c0;
    border-radius: 4px;
    margin-bottom: 5px;
}

/*--------------------end sortables----------------*/
.slider-list .slider.slider-untouched .slider-handle {
    background-color: #1f82c0;
}

.slider-touched .tooltip-inner,
.slider-touched .slider-handle {
    background-color: #1f82c0;
}


.slider-touched .tooltip.top .tooltip-arrow {
    border-top-color: #1f82c0;
}

.slider-handle {
    background-color: #1f82c0;
    background-image: linear-gradient(to bottom, #1f82c0 0%, #1f82c0 100%);
}

.slider-selection {
    background-image: linear-gradient(to bottom, #1f82c0 0%, #1f82c0 100%);
}

.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow:before, 
.bs-tooltip-top .tooltip-arrow:before {
    border-top-color: #1f82c0;
}

@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px) {
    .question-container table.ls-answers > tbody > tr:nth-child(odd):hover {
        background-color: #fff;
    }
    
    .table-hover>tbody>tr:hover>* {
        --bs-table-accent-bg: #fff;
        color: #333;
    }
}

@media (max-width: 767px) {
    .date.question-container .date-item  div.col-12:nth-child(2),
    .date.question-container .date-item  div.col-12:nth-child(4) {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    body {
        padding-top: 0 !important;
    }

    #outerwrapper {
        margin: 0;
        border-radius: 0;
        box-shadow: none;
        overflow-x: hidden;
    }

    #outerframeContainer {
        margin-top: 0;
        margin-bottom: 0;
        padding: 0 8px;
    }

    .container, .container-fluid {
        padding-left: 10px;
        padding-right: 10px;
        overflow-x: hidden;
    }

    /* Header mobile */
    .header-wrapper {
        padding-bottom: 6px;
    }

    .survey-name {
        font-size: 1.15rem;
        padding: 6px 50px 6px 10px;
        text-align: left;
    }

    /* Language switcher mobile */
    .lang-switcher {
        top: 6px;
        right: 8px;
    }

    .lang-switcher-btn {
        padding: 4px 8px;
        font-size: 12px;
    }

    .lang-flag {
        font-size: 16px;
    }

    .lang-code {
        display: none;
    }

    /* Group title mobile */
    .group-title {
        font-size: 0.95rem;
        padding: 10px 14px;
    }

    /* Question container mobile */
    .question-container {
        border-radius: 6px;
        margin-bottom: 12px;
    }

    .question-title-container {
        padding: 10px 14px;
        border-radius: 6px 6px 0 0;
    }

    .question-text {
        font-size: 0.95rem;
    }

    .answer-container {
        padding: 0 10px;
    }

    /* Buttons mobile */
    .ls-move-submit-btn,
    .ls-move-next-btn {
        width: 100%;
        padding: 12px 20px;
    }

    .ls-move-previous-btn {
        width: 100%;
        margin-bottom: 8px;
    }

    /* Progress bar mobile */
    .progress {
        height: 14px;
    }

    .progress-bar {
        font-size: 10px;
        line-height: 14px;
    }

    /* Logo bar mobile */
    .logo-bar {
        flex-wrap: wrap;
        padding: 8px 0;
    }

    .nav-item-fload a {
        text-align: center;
        padding-top: 15px;
    }
}

@media only screen and (max-width: 768px) {
    .radio-item label::before,
    .checkbox-item label::before {
        top: 3px;
    }
    
    .radio-item label::after {
        top: 6px;
    }
    
    .checkbox-item label::after {
        top: 3px;
    }
}

@media only screen and (max-width: 760px), (max-device-width: 1024px) and (min-device-width: 768px) {
    .array-flexible-row .ls-answers .answertextright {
        text-align: left;
    }
}

/* 2021-06-23: Add visual separator for dual scale questions */
@media only screen and (min-width: 768px) {

    .array-flexible-dual-scale col.col-answers,
    .array-flexible-dual-scale col.separator,
    .array-flexible-duel-scale col.col-answers,
    .array-flexible-duel-scale col.separator {
        width: auto !important;
    }

    .array-flexible-dual-scale .header_separator,
    .array-flexible-dual-scale .dual_scale_separator,
    .array-flexible-duel-scale .header_separator,
    .array-flexible-duel-scale .dual_scale_separator {
        width: 4px !important;
        padding: 0 !important;
        background-color: grey;
        border-color: grey;
    }

    .array-flexible-dual-scale .table-hover>tbody>tr:hover>* {
        --bs-table-accent-bg: transparent;
        color: var(--bs-table-hover-color);
    }
}

@media only screen and (max-device-width: 1028px) {
	.ls-answers > tbody > tr > td.radio-item,
	.ls-answers > tbody > tr > td.checkbox-item {
	min-height: 44px;
	}
}

/* ==================== Modern Radio Buttons for Matrix ==================== */
/* Quadrado arredondado que preenche com cor ao selecionar */
/* Nao se aplica a perguntas com nps_style (classe .nps-question) */

/* Esconde o radio nativo */
table.ls-answers td.radio-item input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
    margin: 0;
    top: 0;
    left: 0;
}

/* Celula da matriz - posicao relativa */
table.ls-answers td.radio-item {
    position: relative;
    text-align: center;
    vertical-align: middle;
}

/* O label vira o botao visual */
table.ls-answers td.radio-item label.ls-label-xs-visibility {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0 auto;
    border: 2px solid #ccc;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
    text-indent: -9999px;
    overflow: hidden;
    padding: 0;
}

/* Remove pseudo-elementos do awesome-bootstrap-checkbox */
table.ls-answers td.radio-item label.ls-label-xs-visibility::before,
table.ls-answers td.radio-item label.ls-label-xs-visibility::after {
    display: none !important;
}

/* Hover */
table.ls-answers td.radio-item:hover label.ls-label-xs-visibility {
    border-color: var(--theme-color, #1f82c0);
    background: color-mix(in srgb, var(--theme-color, #1f82c0) 10%, #fff);
    transform: scale(1.05);
}

/* Selecionado */
table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility {
    background: var(--theme-color, #1f82c0);
    border-color: var(--theme-color, #1f82c0);
    transform: scale(1.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* Garante que nenhum pseudo-elemento apareca quando selecionado */
table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility::before,
table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility::after {
    display: none !important;
    content: none !important;
}

/* No answer item */
table.ls-answers td.noanswer-item label.ls-label-xs-visibility {
    border-style: dashed;
}

/* ==================== Desativa estilo moderno quando NPS ativo ==================== */
/* O plugin NPS tem seu proprio estilo */
.nps-question table.ls-answers td.radio-item label.ls-label-xs-visibility {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    text-indent: 0 !important;
}

/* NPS Buttons: controlado pelo plugin NPSQuestion (ativar nps_style na pergunta) */

/* ==================== Fix Mobile: mostra texto do label nas matrizes ==================== */
/* No mobile, o LimeSurvey esconde o thead e mostra o label. Mas o text-indent:-9999px */
/* dos botoes quadrados esconde o texto. Aqui revertemos para matrizes normais (nao NPS). */
@media only screen and (max-width: 767px) {
    .question-container:not(.nps-question) table.ls-answers td.radio-item input[type="radio"] {
        position: relative !important;
        opacity: 1 !important;
        width: 18px !important;
        height: 18px !important;
        z-index: 2 !important;
        margin: 0 !important;
        flex-shrink: 0 !important;
    }
    .question-container:not(.nps-question) table.ls-answers td.radio-item {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 10px 14px !important;
        border-bottom: 1px solid #eee !important;
    }
    .question-container:not(.nps-question) table.ls-answers td.radio-item label.ls-label-xs-visibility {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: auto !important;
        height: auto !important;
        min-height: 36px !important;
        text-indent: 0 !important;
        overflow: visible !important;
        border: none !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        padding-left: 0 !important;
        margin: 0 !important;
        font-size: 14px !important;
        color: #333 !important;
        cursor: pointer !important;
    }
    .question-container:not(.nps-question) table.ls-answers td.radio-item label.ls-label-xs-visibility > * {
        position: relative !important;
        width: auto !important;
        height: auto !important;
        overflow: visible !important;
        left: auto !important;
    }
    .question-container:not(.nps-question) table.ls-answers td.radio-item:hover label.ls-label-xs-visibility {
        transform: none !important;
        background: transparent !important;
        border: none !important;
    }
    .question-container:not(.nps-question) table.ls-answers td.radio-item input[type="radio"]:checked + label.ls-label-xs-visibility {
        background: transparent !important;
        border: none !important;
        transform: none !important;
        box-shadow: none !important;
        color: var(--theme-color, #1f82c0) !important;
        font-weight: 600 !important;
    }
}