:root {
    --bg-color-primary-pp: #63C5B0;
    --box-shadow-card: 0 4px 24px 0 rgba(34, 41, 47, .1);
    --bg-color-danger-pp: #ea545596;
    --bs-body-font-size: 11px !important;
    --bs-btn-font-size: 11px !important;

    --color-one: #39827A;
    --color-two: #C4A7FD;
    --color-three: #75D481;
    --color-four: #9E72EF;
    --color-five: #CCEF20;

    --color-pink: #EF3F6C; /* rosa intenso */
    --color-cyan: #2FC0CB; /* cian */
    --color-yellow: #FCE047; /* amarillo */
    --color-red: #EF4444; /* rojo */
    --color-orange: #FF8F2B; /* naranja */
    --color-blue: #60A5FA; /* azul claro */
    --color-navy: #242E68; /* azul marino */
    --color-green: #00FF7F; /* azul marino */
    --color-green-text: #034903;

    --color-text-yellow: #242E68;

    --container-one: #ACC5F3;
    --container-two: #6A96E5;
    --container-three: #4678D2;
    --container-four: #2752A0;
    --container-five: #1C3B73;
    --container-six: #12264A;
}


/* Botón de Confirmación (Estilo btn-save) */
.swal2-styled {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-weight: inherit !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
}

.my-confirm-button,
.swal2-confirm {
    --btn-bg: #2FC0CB !important;
    --btn-text: white !important;
    --btn-border: #2FC0CB !important;
    --btn-hover-bg: white !important;
    --btn-hover-text: #2FC0CB !important;
    --btn-focus-ring: #89CBD6 !important;

    background-color: var(--btn-bg) !important;
    color: var(--btn-text) !important;
    border: 2px solid var(--btn-border) !important;
    padding: 0.5rem 1rem !important;
    border-radius: 0.5rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    margin: 0.5rem !important;
    transition: all 0.2s ease !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.swal2-confirm:hover {
    background-color: var(--btn-hover-bg) !important;
    color: var(--btn-hover-text) !important;
}

.swal2-confirm:focus {
    box-shadow: 0 0 0 4px var(--btn-focus-ring) !important;
    outline: none !important;
}

/* Botón de Cancelación (Estilo btn-cancel) */
.my-cancel-button,
.swal2-cancel {
    --btn-bg: #FF1212 !important;
    --btn-text: white !important;
    --btn-border: #FF1212 !important;
    --btn-hover-bg: white !important;
    --btn-hover-text: #FF1212 !important;
    --btn-focus-ring: #FF4F5C !important;

    background-color: var(--btn-bg) !important;
    color: var(--btn-text) !important;
    border: 2px solid var(--btn-border) !important;
    padding: 0.5rem 1rem !important;
    border-radius: 0.5rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    margin: 0.5rem !important;
    transition: all 0.2s ease !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.swal2-cancel:hover {
    background-color: var(--btn-hover-bg) !important;
    color: var(--btn-hover-text) !important;
}

.swal2-cancel:focus {
    box-shadow: 0 0 0 4px var(--btn-focus-ring) !important;
    outline: none !important;
}

@keyframes zoomInOut {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.2);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

#loader-logo {
    animation: zoomInOut 2s infinite ease-in-out, rotate 3s linear infinite;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

#loader-text {
    animation: fadeIn 1s ease-in-out forwards;
}

html, body {
    overflow-x: hidden;
}

/* Estilos base del botón */
.btn {
    display: flex;
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    border-style: solid;
    border-width: 2px;
    border-radius: 0.5rem; /* rounded-lg */
    padding: 0.5rem;
    outline: none;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;

    background-color: var(--btn-bg);
    color: var(--btn-text);
    border-color: var(--btn-border);
}

.btn:hover {
    background-color: var(--btn-hover-bg);
    color: var(--btn-hover-text);
}

.btn:focus {
    box-shadow: 0 0 0 4px var(--btn-focus-ring);
}

/* Temas o variantes */
.btn-save {
    --btn-bg: #00FF7F;
    --btn-text: white;
    --btn-border: #00FF7F;
    --btn-hover-bg: white;
    --btn-hover-text: #00FF7F;
    --btn-focus-ring: #AEFFD3;
}

.btn-back {
    --btn-bg: #4A7AD3;
    --btn-text: white;
    --btn-border: #4A7AD3;
    --btn-hover-bg: white;
    --btn-hover-text: #4A7AD3;
    --btn-focus-ring: #adcdf7;
}

.btn-link {
    --btn-bg: #2FC0CB;
    --btn-text: white;
    --btn-border: #2FC0CB;
    --btn-hover-bg: white;
    --btn-hover-text: #2FC0CB;
    --btn-focus-ring: #89CBD6;
}

.btn-cancel {
    --btn-bg: #FF1212;
    --btn-text: white;
    --btn-border: #FF1212;
    --btn-hover-bg: white;
    --btn-hover-text: #FF1212;
    --btn-focus-ring: #FF4F5C;
}

/* Estilos de link */
.link {
    margin: 0 0.125rem; /* mx-0.5 */
    color: white;
    font-weight: 500;
    border-radius: 9999px; /* rounded-full */
    font-size: 0.875rem; /* text-sm */
    padding: 0.5rem; /* p-2 */
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s;

/* Transición suave para hover */
/* Focus */
&
:focus {
    outline: none;
    box-shadow: 0 0 0 4px var(--ring-color);
}

/* Hover */
&
:hover {
    background-color: var(--hover-color);
}

}

.link-edit {
    background-color: #FCE047;
    --hover-color: #FCEC25;
    --ring-color: #FCF17E;
}

.link-firm {
    background-color: #00FF7F;
    --hover-color: #1DFF31;
    --ring-color: #6FFFBB;
}

.link-pdf {
    background-color: #FF8F2B;
    --hover-color: #FF7F24;
    --ring-color: #FFB250;
}

.link-status {
    background-color: #EF4444;
    --hover-color: #DE2626;
    --ring-color: #FCA5A5;
}

.link-view {
    background-color: #242E68;
    --hover-color: #161F68;
    --ring-color: #485CD0;
}

.link-email {
    background-color: #60A5FA;
    --hover-color: #4C8AFA;
    --ring-color: #7DC3FA;
}

.iti--inline-dropdown, .iti__tel-input {
    height: 39px;
}

.iti--inline-dropdown {
    margin-top: 4px;
    width: 100% !important;
}

.readonly-input {
    pointer-events: none;
    background-color: #f3f4f6;
    color: #6b7280;
}

/*=============================================================
State linetime
=============================================================*/
.position-relative {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    justify-items: center;
    align-items: center;
}

.card-time-line {
    position: relative;
    overflow: visible;
    width: 100%;
    max-width: 250px;
}

.time-line-content:after {
    content: "";
    width: 90%;
    border: 1px dashed #ccc;
    height: 1px;
    background: linear-gradient(to bottom, #6c757d, #adb5bd);
    position: relative;
    bottom: 0;
    left: 0;
    z-index: 1;
    right: 0;
    width: 100%;
    display: flex;
    margin: 10px auto;
}

.card-time-line {
    position: relative;
    overflow: inherit;
    background: #ffffff;
    margin-bottom: 20px;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    z-index: 2;
}

.card-time-line:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
}

.card-time-line::before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 2;
    border: 3px solid #ffffff;
    border-radius: 50%;
    background-color: #198754;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50% auto;
    transition: background-color 0.3s ease, transform 0.3s ease;
    right: 0;
    margin: .5rem auto;
}


.card-time-line:hover::before {
    transform: scale(1.2);
}


.time-line-title {
    margin-bottom: 10px;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 1rem;
}

.time-line-title h6 {
    font-size: 0.9rem;
    color: #6c757d;
}

.time-line-title small {
    font-size: 0.8rem;
    color: #adb5bd;
}


.badge {
    font-size: 0.5rem;
    border-radius: 20px;
    padding: 0.3rem 0.8rem;
}


/*============Invoice==========*/

.card-time-line.card-time-invoice::before {
    content: "\f570";
}

.card-time-line.card-time-invoice .bg-blue-600 {
    background: var(--bg-color-primary-pp) !important;
}

.card-time-line.card-time-invoice .bg-blue-600 {
    background: var(--bg-color-primary-pp) !important;
}

.card-time-line.card-time-invoice::before {
    background: var(--bg-color-primary-pp);
}

.card-time-line.card-time-invoice .time-line-title small {
    color: var(--bg-color-primary-pp);
}

/*============Notificartions==========*/

.card-time-line.card-time-notification::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'><path stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 5.365V3m0 2.365a5.338 5.338 0 0 1 5.133 5.368v1.8c0 2.386 1.867 2.982 1.867 4.175 0 .593 0 1.292-.538 1.292H5.538C5 18 5 17.301 5 16.708c0-1.193 1.867-1.789 1.867-4.175v-1.8A5.338 5.338 0 0 1 12 5.365ZM8.733 18c.094.852.306 1.54.944 2.112a3.48 3.48 0 0 0 4.646 0c.638-.572 1.236-1.26 1.33-2.112h-6.92Z'/></svg>");

    background-color: var(--color-four);
}


.card-time-line.card-time-notification .bg-blue-600 {
    background: var(--color-four) !important;
}

.card-time-line.card-time-notification .time-line-title small {
    color: var(--color-four);
}

.card-time-line .link-payment {
    color: var(--color-four);
}

/*============pagos==========*/

.card-time-line.card-time-payments::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'><path fill-rule='evenodd' d='M7 6a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2h-2v-4a3 3 0 0 0-3-3H7V6Z' clip-rule='evenodd'/><path fill-rule='evenodd' d='M2 11a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-7Zm7.5 1a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5Z' clip-rule='evenodd'/><path d='M10.5 14.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z'/></svg>");
    background-color: var(--color-three);
}

.card-time-line.card-time-payments .bg-blue-600 {
    background: var(--color-three) !important;
}

.card-time-line.card-time-payments .time-line-title small {
    color: var(--color-three);
}


/*============link==========*/

.card-time-line.card-time-link::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'><path d='M7 8v8a5 5 0 1 0 10 0V6.5a3.5 3.5 0 1 0-7 0V15a2 2 0 0 0 4 0V8'/></svg>");
    background-color: var(--color-one);
}

.card-time-line.card-time-link .bg-blue-600 {
    background: var(--color-one) !important;
}

.card-time-line.card-time-link .time-line-title small {
    color: var(--color-one);
}

/*============link lincense==========*/

.card-time-line.card-time-lincense::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'><path d='M11 9a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z'/><path fill-rule='evenodd' d='M9.896 3.051a2.681 2.681 0 0 1 4.208 0c.147.186.38.282.615.255a2.681 2.681 0 0 1 2.976 2.975.681.681 0 0 0 .254.615 2.681 2.681 0 0 1 0 4.208.682.682 0 0 0-.254.615 2.681 2.681 0 0 1-2.976 2.976.681.681 0 0 0-.615.254 2.682 2.682 0 0 1-4.208 0 .681.681 0 0 0-.614-.255 2.681 2.681 0 0 1-2.976-2.975.681.681 0 0 0-.255-.615 2.681 2.681 0 0 1 0-4.208.681.681 0 0 0 .255-.615 2.681 2.681 0 0 1 2.976-2.975.681.681 0 0 0 .614-.255ZM12 6a3 3 0 1 0 0 6 3 3 0 0 0 0-6Z' clip-rule='evenodd'/><path d='M5.395 15.055 4.07 19a1 1 0 0 0 1.264 1.267l1.95-.65 1.144 1.707A1 1 0 0 0 10.2 21.1l1.12-3.18a4.641 4.641 0 0 1-2.515-1.208 4.667 4.667 0 0 1-3.411-1.656Zm7.269 2.867 1.12 3.177a1 1 0 0 0 1.773.224l1.144-1.707 1.95.65A1 1 0 0 0 19.915 19l-1.32-3.93a4.667 4.667 0 0 1-3.4 1.642 4.643 4.643 0 0 1-2.53 1.21Z'/></svg>");
    background-color: var(--color-five);
}

.card-time-line.card-time-lincense .bg-blue-600 {
    background: var(--color-five) !important;
}

.card-time-line.card-time-lincense .time-line-title small {
    color: var(--color-five);
}


.is-invalid {
    border: 1px solid red;
}

.invalid-feedback {
    color: red !important;
}

.text-nowrap {
    text-wrap-mode: nowrap !important;
}

.driver-popover-footer .driver-popover-navigation-btns {
    justify-content: center;
}

.driver-popover-footer .driver-popover-navigation-btns button {
    border: 1px solid transparent;
    width: 80px;
    height: 30px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

/* rosa intenso */
.bg-drivers-pink {
    background-color: var(--color-pink) !important;
    color: #fff !important;
}

.bg-drivers-pink .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-pink);
}
.bg-drivers-pink .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-pink);
}
.bg-drivers-pink .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-pink);
}
.bg-drivers-pink .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-pink);
}

.bg-drivers-pink .driver-popover-footer button {
    color: var(--color-pink);
}

/* cian */
.bg-drivers-cyan {
    background-color: var(--color-cyan) !important;
    color: #fff !important;
}

.bg-drivers-cyan .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-cyan);
}
.bg-drivers-cyan .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-cyan);
}
.bg-drivers-cyan .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-cyan);
}
.bg-drivers-cyan .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-cyan);
}

.bg-drivers-cyan .driver-popover-footer button {
    color: var(--color-cyan);
}

/* amarillo */
.bg-drivers-yellow {
    background-color: var(--color-yellow) !important;
    color: var(--color-text-yellow) !important;
}

.bg-drivers-yellow .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-yellow);
}
.bg-drivers-yellow .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-yellow);
}
.bg-drivers-yellow .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-yellow);
}
.bg-drivers-yellow .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-yellow);
}

.bg-drivers-yellow .driver-popover-footer button {
    background-color: var(--color-text-yellow);
    color: var(--color-yellow);
}

/* rojo */
.bg-drivers-red {
    background-color: var(--color-red) !important;
    color: #fff !important;
}

.bg-drivers-red .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-red);
}
.bg-drivers-red .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-red);
}
.bg-drivers-red .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-red);
}
.bg-drivers-red .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-red);
}

.bg-drivers-red .driver-popover-footer button {
    color: var(--color-red);
}

/* naranja */
.bg-drivers-orange {
    background-color: var(--color-orange) !important;
    color: #fff !important;
}

.bg-drivers-orange .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-orange);
}
.bg-drivers-orange .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-orange);
}
.bg-drivers-orange .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-orange);
}
.bg-drivers-orange .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-orange);
}

.bg-drivers-orange .driver-popover-footer button {
    color: var(--color-orange);
}

/* azul claro */
.bg-drivers-blue {
    background-color: var(--color-blue) !important;
    color: #fff !important;
}

.bg-drivers-blue .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-blue);
}
.bg-drivers-blue .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-blue);
}
.bg-drivers-blue .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-blue);
}
.bg-drivers-blue .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-blue);
}

.bg-drivers-blue .driver-popover-footer button {
    color: var(--color-blue);
}

/* azul marino */
.bg-drivers-navy {
    background-color: var(--color-navy) !important;
    color: #fff !important;
}

.bg-drivers-navy .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-navy);
}
.bg-drivers-navy .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-navy);
}
.bg-drivers-navy .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-navy);
}
.bg-drivers-navy .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-navy);
}

.bg-drivers-navy .driver-popover-footer button {
    color: var(--color-navy);
}

/* verder */
.bg-drivers-green {
    background-color: var(--color-green) !important;
    color: #fff !important;
}

.bg-drivers-green .driver-popover-arrow.driver-popover-arrow-side-left {
    border-left-color: var(--color-green);
}
.bg-drivers-green .driver-popover-arrow.driver-popover-arrow-side-right {
    border-right-color: var(--color-green);
}
.bg-drivers-green .driver-popover-arrow.driver-popover-arrow-side-top {
    border-top-color: var(--color-green);
}
.bg-drivers-green .driver-popover-arrow.driver-popover-arrow-side-bottom {
    border-bottom-color: var(--color-green);
}

.bg-drivers-green .driver-popover-footer button, .bg-drivers-green .driver-popover-title, .bg-drivers-green .driver-popover-description {
    color: var(--color-green-text);
}

.driver-popover-footer button{
    text-shadow: none!important;
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.z-110 { z-index: 110; }
.z-120 { z-index: 120; }
.z-130 { z-index: 130; }
.z-20000  { z-index: 20000 !important; }

.wizard-modal {
    background: white;
    border-radius: 2rem;
    padding: 1rem;
    max-width: 700px;
    width: 90%;
    text-align: center;
    height: max-content;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: 6px solid var(--color-navy);
}

.wizard-modal h2 {
    font-size: 2.75rem;
    color: #2072a7;
    font-weight: 700;
    margin-bottom: 1rem;
}

.wizard-modal p {
    font-size: 1rem;
    font-weight: 700;
}

.logo {
    width: 250px;
}

.logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.steps-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 20px 0;
    max-width: 600px;
}

.step-box {
    padding: 12px;
    border-radius: 8px;
    background-color: #e0e7ff;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
}

.wizard-buttons {
    margin-top: .7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1rem;
}

.btn-primary {
    background-color: var(--color-pink);
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    max-width: 250px;
}

.btn-secondary {
    background-color: transparent;
    color: #374151;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    max-width: 250px;
}

.step-box-1 {
    background-color: var(--container-one);
    color: #ffffff;
    font-weight: 500;
}

.step-box-2 {
    background-color: var(--container-two);
    color: #ffffff;
    font-weight: 500;
}

.step-box-3 {
    background-color: var(--container-three);
    color: #ffffff;
    font-weight: 500;
}

.step-box-4 {
    background-color: var(--container-four);
    color: #ffffff;
    font-weight: 500;
}

.step-box-5 {
    background-color: var(--container-five);
    color: #ffffff;
    font-weight: 500;
}

.step-box-6 {
    background-color: var(--container-six);
    color: #ffffff;
    font-weight: 500;
}

.driver-active .driver-active-element, .driver-active .driver-active-element *, .driver-popover, .driver-popover * {
    pointer-events: unset !important;
}

.driver-popover-close-btn {
    color: #fff !important;
}


.btn-tour-ico {
    position: relative;
    display: flex;
    align-items: center;

    background-color: #fff;
    color: var(--color-navy);
    border: 1px solid #fff;
    border-radius: .5rem;
    padding: .5rem;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.btn-tour-ico .arrow-icon svg {
    transform: rotate(-45deg);
    color: #fff;
}

@media (min-width: 525px) {
    .wizard-modal {
        height: max-content;
        margin-bottom: .5rem;
    }

    .wizard-modal h2 {
        font-size: 1.75rem;
    }

    .wizard-modal p {
        font-size: .8rem;
    }

    .steps-container{
        margin: 15px 0;
    }
}

tr > th {
    border-bottom: 1px solid #e5e7eb;   /* border-b (gris claro) */
    padding: 0.25rem 0.5rem; /* py-1 = 0.25rem, px-2 = 0.5rem */
    text-align: center;
    /*border: 1px solid #cbd5e1; */
    overflow-wrap: break-word;
}

td {
    border-bottom: 1px solid #e5e7eb;   /* border-b (gris claro) */
    padding: 0.25rem 0.5rem; /* py-1 = 0.25rem, px-2 = 0.5rem */
    text-align: center;
    /*border: 1px solid #cbd5e1; */
    overflow-wrap: break-word;
}

/*tbody > tr:hover {
    background-color: #f9fafb !important;
}  hover:bg-gray-50 */

tbody > tr:nth-child(odd) {
    background-color: #ffffff; /* bg-white */
}

tbody > tr:nth-child(even) {
    background-color: #f9fafb; /* gray-50 */
}

select {
    background-color: #ffffff;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    z-index: 10;
}

/* Permite crecer verticalmente */
.tom-select-custom .ts-control {
    height: auto !important;
    align-items: flex-start;
    padding-top: 6px;
    padding-bottom: 6px;
}

.ts-control {
    z-index: 1;
}

/* Permite varias líneas en el item */
.tom-select-custom .item {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    line-height: 1.2;
}

/* Elimina límite del contenedor */
.tom-select-custom .ts-control input {
    min-width: 0 !important;
}

.ts-dropdown {
    z-index: 9999 !important;
}

.ts-dropdown {
    max-height: 300px;
    overflow-y: auto;
}

/* cuando abre arriba */
.ts-dropdown.ts-open-top {
    transform-origin: bottom center;
}

/* Mostrar flechas en Chrome/Safari/Edge */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: auto;
    opacity: 1;
}

/* Mostrar flechas en Firefox */
input[type=number] {
    -moz-appearance: number-input;
}

.iti__country-container {
    height: 85% !important;
    max-height: 85% !important;
    top: 0 !important;
}

.iti__selected-dial-code {
    font-size: 14px;
}

.scroll-drag {
    overflow-x: auto;
    cursor: grab;
    -webkit-overflow-scrolling: touch; /* momentum scroll iOS/Android */
    scroll-behavior: smooth;
    user-select: none;
}

.scroll-drag:active {
    cursor: grabbing;
}