/* Custom CSS styles */

.image-wrapper {
    display: flex !important;
    flex-wrap: wrap;
}

.sv_q_imagepicker_inline {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
    margin-bottom: 5px;
}

.sv_q_imagepicker_inline img {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.sv_q_imagepicker_inline.checked {
    border-color: #739a5b;
}

.sv_row,
.sv_qstn,
.sv_row > div {
    min-width: 200px !important;
}

#surveyContainer .sv_row .sv_qstn > div:nth-child(2) {
    padding-right: 0 !important;
}

.sv-ranking-item__text,
.sv-ranking-item__index {
    color: #202020;
}

.sv-ranking-item__content {
    margin-bottom: 10px;
}

.sv-ranking-item__icon-container {
    right: 0;
}

.sv-ranking-item__content {
    padding: 5px 20px 5px 10px !important;
}

.sv-ranking-item__ghost {
    right: 0 !important;
    left: auto !important;
    opacity: 0.2;
}

.ranking-parent {
    display: inline-block;
    cursor: pointer;
    position: relative;
}

.sv-ranking-item__icon-container > svg:first-child {
    visibility: visible;
}

.sv-ranking .sq-item {
    position: relative;
}

.sv_q_imgsel_image {
    max-width: 190px;
}

#surveyContainer .sv_row .sv_qstn > div:nth-child(2) table tbody tr .bg-primary {
    background-color: #337ab7 !important;
}

#surveyContainer textarea.form-control {
    min-height: 120px;
}

@media (max-width: 990px) {
    .image-wrapper {
        justify-content: center;
    }
}

@media (min-width: 990px) {
    .sv_q_imagepicker_inline {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (max-width: 600px) {
    .sv_q_imagepicker_inline {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
}

/* ============================================
   Toast Notification Styles (RTL Support)
   ============================================ */

.toast-container {
    direction: rtl;
}

.toast-container .toast {
    direction: rtl;
    text-align: right;
}

.toast-container .toast-header {
    direction: rtl;
}

.toast-container .toast-header .me-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

.toast-container .toast-header .btn-close {
    margin-left: 0 !important;
    margin-right: auto !important;
}

.toast-container .toast-body {
    direction: rtl;
    text-align: right;
}

/* Toast position for RTL - left side instead of right */
.toast-container.position-fixed.top-0.end-0 {
    right: auto !important;
    left: 0 !important;
}

/* Toast animation for RTL */
.toast-container .toast {
    animation: slideInLeft 0.3s ease-out;
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Survey retry button */
.survey-retry-btn {
    display: inline-block;
    margin-top: 15px;
    padding: 10px 25px;
    background-color: #dc3545;
    color: white;
    border: none;
    border-radius: 25px;
    cursor: pointer;
    font-size: 14px;
    transition: background-color 0.3s ease;
}

.survey-retry-btn:hover {
    background-color: #c82333;
}