.swi-form {

    /* display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto; */
    color: inherit;
    font-family: inherit;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0rem;
    box-sizing: border-box;
    width: 100%;
    max-height: 99vh;
    max-width: 99vw;
    font-size: clamp(16px, 1.2vw, 20px);


}

input,
label,
select,
button {
    font-size: clamp(16px, 1.2vw, 20px);
    line-height: 1.5;
}

label,
button {

    user-select: none;
}

input,
select,
option,
button {

    cursor: pointer;
}

.swi-form .swi_btn_submit {
    margin: auto;
    width: 100%;
}

.swi-form .swi_btn_submit button {
    max-width: max-content;
}

input[type="date"] {
    position: relative;
    padding-right: 35px;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    position: absolute;
    right: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}


.swi-form .swi_select_ofi_btn {
    padding: 0.5rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    border-radius: 7px;
    margin: auto;
    background: #005b00;
    color: #fff;
    color: inherit;
}

.swi-form .swi_select_ofi_btn:disabled {
    filter: brightness(0.6);
}


.swi-form .swi_select_ofi_btn:hover {
    transform: scale(1.02);
    transition: transform 0.2s;
}

.swi-form .swi_select_ofi_btn span {
    font-size: 1.2rem;
    margin: 0;
    margin-left: 1rem;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border-radius: 50%;
    color: #005b00;
}

.swi-form .label_switch {
    display: flex;
    flex-direction: row-reverse;
}

.swi-form .swi_select_ofi_btn.loading {
    position: relative;
    box-sizing: border-box;
    z-index: 1;
}

.swi-form .swi_select_ofi_btn.loading::before {
    content: "";
    position: absolute;
    top: -5px;
    left: -5px;
    z-index: -1;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border-radius: inherit;
    background: inherit;
    color: inherit;
    background: linear-gradient(90deg,
            rgba(30, 43, 55, 0.3) 0%,
            rgba(0, 212, 255, 0.8855917366946778) 26%,
            rgba(30, 43, 55, 0.3) 46%,
            rgba(30, 43, 55, 0.3) 57%);
    animation: loadingAnimate 6.5s infinite linear;

}

.swi-form .form_group {
    /* display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    gap: 1rem; */
    margin-bottom: 1rem;
}

.swi-form .switch_container {
    display: flex;
    margin-top: 1rem;
}

.swi-form .switch_container_input {
    width: 50px;
    background: #fff;
    border-radius: 12px;
    position: relative;
    transition: background-color 0.5s ease-out;
    margin-right: 0.5rem;

}

.swi-form .switch_container_input::before {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    top: 50%;
    left: 5px;
    transform: translateY(-50%);
    background: #adadad;
    transition:
        transform 0.5s ease-out,
        background-color 0.5s ease-out;
}

.swi-form .switch_container_input.active {
    background: #005b00;
}

.swi-form .switch_container_input.active.active::before {
    transform: translateY(-50%) translateX(25px);
    background: #fff;
}

.swi-form .switch_container_input input {
    opacity: 0;
}

.swi-form .form_group_date {
    /* max-width: 50%; */
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.swi-form .form_group_date input[type="date"] {
    padding: 0.5rem;
}

.swi-form .form_group_date:nth-of-type(3) {
    /* gap: 1rem; */
}

/* .swi-form .form_group_date {
    background-color: #fafafa;
    display: flex;
    width: 100%;
    height: 50px;
    gap: 0.5rem;
    padding: 1rem !important;
    margin: 0 !important;
    justify-content: space-between;
    align-items: space-between;
    margin-bottom: 1rem;
} */

.swi-form .form_group_date input,
.swi-form .form_group_date select {
    border: none;
    height: 35px;
    width: 40%;
}

.swi-form .form_group_date {
    justify-content: space-between;
}

.swi-form .form_group_date .date {
    width: 59.0%;
}

.swi-form .form_group_date .time {
    width: 39.0%;
    max-width: 80px;
}

.swi-form .form_group_date input:focus,
.swi-form .form_group_date select:focus {
    border: none;
    outline: none;
}

.swi-form .form_group_date .inputHore {
    max-width: 75px;
}

.swi-form .form_group.age_driver {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    cursor: pointer;
    max-width: max-content;
}

.swi-form .selected_age {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.swi-form .selected_age .option_age {
    padding: 0.5rem;
    border: 1px solid #232323;
    font-weight: bold;
    transition: background-color .3s;
    cursor: pointer;
}

.swi-form .selected_age .option_age input {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 0;
    margin: 0;
    padding: 0;
}

.swi-form .selected_age .option_age.active {
    background: #005b00;
    color: #fff;
}

.swi-form .selected_age .option_age:hover {
    background: #005b00;
    color: #fff;
}

.swi-form .selected_age .option_age:nth-child(2) {
    border-left: 0;
    border-right: 0;
}

.swi-form * {
    box-sizing: border-box;

}


.swi-form .hidden {
    opacity: 0;
    height: 0;
    width: 0;
    display: none;
}

.swi-form .form_group .hidden {
    opacity: 0;
    height: 0;
    width: 0;
    display: none;
}

.swi-form .form_group {
    width: 100%;
}

.swi-form .form_group * {
    animation: visible .2s 1 forwards linear;
}

.swi-form .form_container_ofis {
    background: inherit;
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.swi-form .form_container_ofis select {
    outline: none;
    border: none;
    width: 100%;
}

.swi-form .form_container_ofis option {
    word-wrap: break-word;
    white-space: pre-line;
}

.swi-form .form_group_date label {
    display: flex;
    width: 100%;
    align-items: flex-start;
}




.swi-form .error_text {
    width: 100%;
    color: #b51919;
}

.swi-form .error_submit_text {
    color: #b51919;
    font-weight: bold;

}

.suplements_container {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 1.5rem;
}

.suplements_container>p {
    margin: auto;

}


@keyframes loadingAnimate {
    0% {
        background-position: 0px;
    }

    100% {
        background-position: 1000px;
    }
}

@keyframes visible {
    0% {
        opacity: 0;
        transform: translateY(10%);
    }

    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}

@media screen and (min-width: 568px) {
    .swi-form {
        max-height: 65vh;
    }

    .form_container_ofis {
        max-width: 47.5%;
    }

    .form_group {
        flex-wrap: wrap;
        width: 100%;
    }

    .swi-form .form_group_date label {
        display: inline-flex;

    }

    .swi-form .form_group_date {
        max-width: 50%;
        justify-content: space-around;

    }

    .swi-form .form_group_date .date {
        width: 59.0%;
    }

    .swi-form .form_group_date .time {
        width: 39.0%;
        max-width: 80px;
    }
}

@media screen and (min-width: 1023px) {
    .swi-form {
        max-height: 100vh;
    }

    .datatime {
        max-width: 250px;
    }



    .swi_select_ofi_btn {
        max-width: 150px;
    }

    .swi-form .form_group_date {
        justify-content: flex-start;

    }

    .swi-form .form_group_date .date {
        margin-right: 1rem;
    }
}



/*Swhich*/
.swi-form .form_group_switch {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem;
    width: 100%;
    --toggle-bg: #181c20;
    --toggle-off-color: inherit;
    --toggle-on-color: #005b00;
}

/* From Uiverse.io by chicogale */
.neo-toggle-container {
    --toggle-width: 80px;

    --toggle-height: 38px;
    --toggle-transition: 0.4s cubic-bezier(0.25, 1, 0.5, 1);

    width: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-family: "Segoe UI", Tahoma, sans-serif;
    user-select: none;
}

.neo-toggle-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;

}

.neo-toggle {
    position: relative;
    width: var(--toggle-width);
    height: var(--toggle-height);
    display: block;
    cursor: pointer;
    transform: translateZ(0);
    perspective: 500px;
    margin: auto;
}

/* Track styles */
.neo-track {
    position: absolute;
    inset: 0;
    border-radius: calc(var(--toggle-height) / 2);
    overflow: hidden;
    transform-style: preserve-3d;
    transform: translateZ(-1px);
    transition: transform var(--toggle-transition);
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.5),
        inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.neo-background-layer {
    position: absolute;
    inset: 0;
    background: var(--toggle-bg);
    background-image: linear-gradient(-45deg,
            rgba(20, 20, 20, 0.8) 0%,
            rgba(30, 30, 30, 0.3) 50%,
            rgba(20, 20, 20, 0.8) 100%);
    opacity: 1;
    transition: all var(--toggle-transition);
}

.neo-grid-layer {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(to right,
            rgba(71, 80, 87, 0.05) 1px,
            transparent 1px),
        linear-gradient(to bottom, rgba(71, 80, 87, 0.05) 1px, transparent 1px);
    background-size: 5px 5px;
    opacity: 0;
    transition: opacity var(--toggle-transition);
}

.neo-track-highlight {
    position: absolute;
    inset: 1px;
    border-radius: calc(var(--toggle-height) / 2);
    background: linear-gradient(90deg, transparent, rgba(54, 249, 199, 0));
    opacity: 0;
    transition: all var(--toggle-transition);
}

/* Spectrum analyzer */
.neo-spectrum-analyzer {
    position: absolute;
    bottom: 6px;
    right: 10px;
    height: 10px;
    display: flex;
    align-items: flex-end;
    gap: 2px;
    opacity: 0;
    transition: opacity var(--toggle-transition);
}

.neo-spectrum-bar {
    width: 2px;
    height: 3px;
    background-color: var(--toggle-on-color);
    opacity: 0.8;
}

/* Thumb styles */
.neo-thumb {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    transform-style: preserve-3d;
    transition: transform var(--toggle-transition);
    z-index: 1;
}

.neo-thumb-ring {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--toggle-off-color);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    transition: all var(--toggle-transition);
}

.neo-thumb-core {
    position: absolute;
    inset: 5px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), transparent);
    transition: all var(--toggle-transition);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.neo-thumb-icon {
    position: relative;
    width: 10px;
    height: 10px;
    transition: all var(--toggle-transition);
}

.neo-thumb-wave {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    background: var(--toggle-off-color);
    transform: translate(-50%, -50%);
    transition: all var(--toggle-transition);
}

.neo-thumb-pulse {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid var(--toggle-off-color);
    transform: scale(0);
    opacity: 0;
    transition: all var(--toggle-transition);
}

/* Gesture area */
.neo-gesture-area {
    position: absolute;
    inset: -10px;
    z-index: 0;
}

/* Interaction feedback */
.neo-interaction-feedback {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.neo-ripple {
    position: absolute;
    top: 50%;
    left: 30%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: radial-gradient(circle,
            var(--toggle-on-color) 0%,
            transparent 70%);
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all 0.4s ease-out;
}

.neo-progress-arc {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px solid transparent;
    border-top-color: var(--toggle-on-color);
    transform: translate(-50%, -50%) scale(0) rotate(0deg);
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.5s ease;
}

/* Status indicator */
.neo-status {
    position: absolute;
    display: flex;
    justify-content: center;
    bottom: -2rem;
    width: max-content;
    left: -100%;
    left: 50%;
    transform: translateX(-50%);
}

.neo-status-indicator {
    display: flex;
    align-items: center;
    gap: 4px;
}

.neo-status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--toggle-off-color);
    transition: all var(--toggle-transition);
}

.neo-status-text {
    font-size: 16px;
    font-weight: 600;
    color: var(--toggle-off-color);
    letter-spacing: 1px;
    transition: all var(--toggle-transition);
}

/* Value display */
.neo-value-display {
    position: absolute;
    top: -1rem;
    right: 0;
    font-size: 16px;
    font-weight: 500;
    color: var(--toggle-off-color);
    opacity: 0;
    transform: translateY(5px);
    transition: all var(--toggle-transition);
}

.neo-value-text {
    transition: all var(--toggle-transition);
}

/* Active states */

/* ON state */
.neo-toggle-input:checked+.neo-toggle .neo-thumb {
    transform: translateX(calc(var(--toggle-width) - 38px));
}

.neo-toggle-input:checked+.neo-toggle .neo-thumb-ring {
    background-color: var(--toggle-on-color);
    border-color: rgba(54, 249, 199, 0.3);
    box-shadow: 0 0 15px rgba(54, 249, 199, 0.5);
}

.neo-toggle-input:checked+.neo-toggle .neo-thumb-wave {
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid #fff;
}

.neo-toggle-input:checked+.neo-toggle .neo-thumb-pulse {
    transform: scale(1.2);
    opacity: 0.3;
    animation: neo-pulse 1.5s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-track-highlight {
    background: linear-gradient(90deg, transparent, rgba(54, 249, 199, 0.2));
    opacity: 1;
}

.neo-toggle-input:checked+.neo-toggle .neo-grid-layer {
    opacity: 1;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-analyzer {
    opacity: 1;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-bar:nth-child(1) {
    animation: neo-spectrum 0.9s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-bar:nth-child(2) {
    animation: neo-spectrum 0.8s 0.1s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-bar:nth-child(3) {
    animation: neo-spectrum 1.1s 0.2s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-bar:nth-child(4) {
    animation: neo-spectrum 0.7s 0.1s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-spectrum-bar:nth-child(5) {
    animation: neo-spectrum 0.9s 0.15s infinite;
}

.neo-toggle-input:checked+.neo-toggle .neo-status-dot {
    background-color: var(--toggle-on-color);
    box-shadow: 0 0 8px var(--toggle-on-color);
}

.neo-toggle-input:checked+.neo-toggle .neo-status-text {
    color: var(--toggle-on-color);
    content: var(--switext-switch-2);
}

.neo-toggle-input:checked+.neo-toggle+.neo-value-display {
    opacity: 1;
    transform: translateY(0);
}

.neo-toggle-input:checked+.neo-toggle+.neo-value-display .neo-value-text {
    color: var(--toggle-on-color);
}

/* Hover effects */
.neo-toggle:hover .neo-thumb-ring {
    transform: scale(1.05);
}

.neo-toggle-input:not(:checked)+.neo-toggle:hover .neo-thumb-wave::before,
.neo-toggle-input:not(:checked)+.neo-toggle:hover .neo-thumb-wave::after {
    opacity: 1;
}

/* Drag gesture handling */
.neo-toggle.neo-dragging .neo-track {
    transform: translateZ(-1px) scale(1.02);
}

.neo-toggle.neo-dragging .neo-thumb {
    transition: none;
}

/* Animations */
@keyframes neo-pulse {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }

    50% {
        transform: scale(1.5);
        opacity: 0.2;
    }

    100% {
        transform: scale(1);
        opacity: 0.5;
    }
}

@keyframes neo-spectrum {
    0% {
        height: 3px;
    }

    50% {
        height: 8px;
    }

    100% {
        height: 3px;
    }
}

/* Custom script to enable advance features */
.neo-toggle.neo-activated .neo-ripple {
    width: 100px;
    height: 100px;
    opacity: 0.5;
    transition: all 0.6s ease-out;
}

.neo-toggle.neo-progress .neo-progress-arc {
    opacity: 0.8;
    transform: translate(-50%, -50%) scale(1) rotate(270deg);
    transition:
        opacity 0.3s ease,
        transform 1s ease;
}

/* Status text change */
.neo-toggle-input:checked+.neo-toggle .neo-status-text::before {
    content: var(--switext-switch-2);
}

.neo-toggle-input:not(:checked)+.neo-toggle .neo-status-text::before {
    content: var(--switext-switch-1);
}