﻿/* #region Pluxee Branding */

:root {
    /* BRANDING */
    /*Primary*/
    --plx-semantic-color-brand-primary: #221C46;
    /*Secondary*/
    --plx-semantic-color-brand-secondary: #00EB5E;
    --plx-semantic-color-brand-secondary-light: #85FD96;
    --plx-semantic-color-brand-secondary-dimmed: #C7FCCA;
    --plx-semantic-color-brand-secondary-dark: #012F0D;
    /*Tertiary*/
    --plx-semantic-color-brand-tertiary: #17CCF9;
    --plx-semantic-color-brand-tertiary-light: #88DDFB;
    --plx-semantic-color-brand-tertiary-dimmed: #DEF3FB;
    --plx-semantic-color-brand-tertiary-dark: #062C37;
    /*Quaternary*/
    --plx-semantic-color-brand-quaternary: #FFDC37;
    --plx-semantic-color-brand-quaternary-light: #FDEEC1;
    --plx-semantic-color-brand-quaternary-dimmed: #FDF3D6;
    --plx-semantic-color-brand-quaternary-dark: #2F2700;
    /*Quinary*/
    --plx-semantic-color-brand-quinary: #FF7375;
    --plx-semantic-color-brand-quinary-light: #FCC1BE;
    --plx-semantic-color-brand-quinary-dimmed: #FBDDDA;
    --plx-semantic-color-brand-quinary-dark: #530512;
    /*Deep blue*/
    --plx-core-color-deep-blue-12: #221C46;
    --plx-core-color-deep-blue-12-0_5-opac: rgba(34, 28, 70, 0.50);
    --plx-core-color-deep-blue-11: #2D264E;
    --plx-core-color-deep-blue-10: #362F54;
    --plx-core-color-deep-blue-9: #463F5F;
    --plx-core-color-deep-blue-8: #5A5469;
    --plx-core-color-deep-blue-7: #716E7C;
    --plx-core-color-deep-blue-6: #908C99;
    --plx-core-color-deep-blue-5: #B5B2BC;
    --plx-core-color-deep-blue-4: #D1CFD7;
    --plx-core-color-deep-blue-3: #E5E3EA;
    --plx-core-color-deep-blue-2: #F0EEF5;
    --plx-core-color-deep-blue-1: #FAF8FF;
    /*Ultra green*/
    --plx-core-color-ultra-green-12: #012F0D;
    --plx-core-color-ultra-green-11: #00330E;
    --plx-core-color-ultra-green-10: #003D13;
    --plx-core-color-ultra-green-9: #004F1A;
    --plx-core-color-ultra-green-8: #006825;
    --plx-core-color-ultra-green-7: #008A34;
    --plx-core-color-ultra-green-6: #01AD43;
    --plx-core-color-ultra-green-5: #01D253;
    --plx-core-color-ultra-green-4: #00EB5E;
    --plx-core-color-ultra-green-3: #85FD96;
    --plx-core-color-ultra-green-2: #C7FCCA;
    --plx-core-color-ultra-green-1: #DAFCDB;
    /*Boldy blue*/
    --plx-core-color-boldy-blue-12: #062C37;
    --plx-core-color-boldy-blue-11: #06303C;
    --plx-core-color-boldy-blue-10: #043948;
    --plx-core-color-boldy-blue-9: #034A5D;
    --plx-core-color-boldy-blue-8: #06637A;
    --plx-core-color-boldy-blue-7: #0A83A1;
    --plx-core-color-boldy-blue-6: #0FA4C9;
    --plx-core-color-boldy-blue-5: #17CCF9;
    --plx-core-color-boldy-blue-4: #88DDFB;
    --plx-core-color-boldy-blue-3: #C3EBFB;
    --plx-core-color-boldy-blue-2: #DEF3FB;
    --plx-core-color-boldy-blue-1: #E8F6FC;
    /*Very yellow*/
    --plx-core-color-very-yellow-12: #2F2700;
    --plx-core-color-very-yellow-11: #332A00;
    --plx-core-color-very-yellow-10: #3D3300;
    --plx-core-color-very-yellow-9: #4F4200;
    --plx-core-color-very-yellow-8: #685800;
    --plx-core-color-very-yellow-7: #8A7501;
    --plx-core-color-very-yellow-6: #AD9400;
    --plx-core-color-very-yellow-5: #D2B301;
    --plx-core-color-very-yellow-4: #F0CD01;
    --plx-core-color-very-yellow-3: #FFDC37;
    --plx-core-color-very-yellow-2: #FDEEC1;
    --plx-core-color-very-yellow-1: #FDF3D6;
    /*Confidently coral*/
    --plx-core-color-confidently-coral-12: #530512;
    --plx-core-color-confidently-coral-11: #5A0514;
    --plx-core-color-confidently-coral-10: #6B0318;
    --plx-core-color-confidently-coral-9: #890021;
    --plx-core-color-confidently-coral-8: #B2002E;
    --plx-core-color-confidently-coral-7: #E9003F;
    --plx-core-color-confidently-coral-6: #FF7375;
    --plx-core-color-confidently-coral-5: #FF9895;
    --plx-core-color-confidently-coral-4: #FCC1BE;
    --plx-core-color-confidently-coral-3: #FBDDDA;
    --plx-core-color-confidently-coral-2: #FCECEA;
    --plx-core-color-confidently-coral-1: #FCF1F0;
    /* ADDITIONAL */
    /*Neutrals*/
    --plx-core-color-slate-gray-12: #131117;
    --plx-core-color-slate-gray-11: #2B2B2D;
    --plx-core-color-slate-gray-10: #343335;
    --plx-core-color-slate-gray-9: #444345;
    --plx-core-color-slate-gray-8: #5A595C;
    --plx-core-color-slate-gray-7: #131117;
    --plx-core-color-slate-gray-6: #131117;
    --plx-core-color-slate-gray-5: #131117;
    --plx-core-color-slate-gray-4: #131117;
    --plx-core-color-slate-gray-3: #131117;
    --plx-core-color-slate-gray-2: #131117;
    --plx-core-color-slate-gray-1: #131117;
    /*Greens*/
    --plx-core-color-dark-green-12: #042E20;
    --plx-core-color-dark-green-11: #043222;
    --plx-core-color-dark-green-10: #023C29;
    --plx-core-color-dark-green-9: #004E36;
    --plx-core-color-dark-green-8: #006245;
    --plx-core-color-dark-green-7: #008861;
    --plx-core-color-dark-green-6: #01AB7B;
    --plx-core-color-dark-green-5: #00CF96;
    --plx-core-color-dark-green-4: #31ECAE;
    --plx-core-color-dark-green-3: #78FCC7;
    --plx-core-color-dark-green-2: #C3FCE1;
    --plx-core-color-dark-green-1: #D7FCEA;
    /*Oranges*/
    --plx-core-color-orange-12: #3C210A;
    --plx-core-color-orange-11: #41230A;
    --plx-core-color-orange-10: #4F2A0A;
    --plx-core-color-orange-9: #67360B;
    --plx-core-color-orange-8: #874810;
    --plx-core-color-orange-7: #B26019;
    --plx-core-color-orange-6: #D47420;
    --plx-core-color-orange-5: #F8A05B;
    --plx-core-color-orange-4: #F8C5A0;
    --plx-core-color-orange-3: #F9DFCD;
    --plx-core-color-orange-2: #FAEDE3;
    --plx-core-color-orange-1: #FBF2EC;
    /*Reds*/
    --plx-core-color-dark-red-12: #4C1304;
    --plx-core-color-dark-red-11: #531303;
    --plx-core-color-dark-red-10: #661101;
    --plx-core-color-dark-red-9: #870A00;
    --plx-core-color-dark-red-8: #B30000;
    --plx-core-color-dark-red-7: #EA0101;
    --plx-core-color-dark-red-6: #FF5D3B;
    --plx-core-color-dark-red-5: #FF9A7E;
    --plx-core-color-dark-red-4: #FCC2B1;
    --plx-core-color-dark-red-3: #FBDDD4;
    --plx-core-color-dark-red-2: #FCECE7;
    --plx-core-color-dark-red-1: #FCF1EE;
    /*Blues*/
    --plx-core-color-blue-12: #0F2365;
    --plx-core-color-blue-11: #0F266D;
    --plx-core-color-blue-10: #0F2D83;
    --plx-core-color-blue-9: #123BA7;
    --plx-core-color-blue-8: #1B51DC;
    --plx-core-color-blue-7: #526CF8;
    --plx-core-color-blue-6: #878DFA;
    --plx-core-color-blue-5: #B1B0FB;
    --plx-core-color-blue-4: #CFCCFA;
    --plx-core-color-blue-3: #E3E2FA;
    --plx-core-color-blue-2: #EFEEFB;
    --plx-core-color-blue-1: #F3F3FC;
    /*Fushia*/
    --plx-core-color-fushia-1: #CC1480;
    /*SURFACES*/
    --plx-semantic-color-surface-1: #FFFFFF;
    --plx-semantic-color-surface-1-0_5-opac: rgba(255, 255, 255, 0.5);
    /*BORDERS*/
    --plx-semantic-color-border-primary: #908C99;
    --plx-semantic-color-border-secondary: #D1CFD7;
    --plx-semantic-color-border-disabled: #B5B2BC;
    --plx-semantic-color-border-error: #B30000;
    /*OUTLINE*/
    --plx-semantic-color-outline-focus: #1B51DC;
    /*INTERACTIVE*/
    --plx-semantic-color-interactive-primary: #1B51DC;
    /*CTA*/
    --plx-semantic-color-cta-primary: #00EB5E;
    --plx-semantic-color-cta-primary-hover: #C7FCCA;
    --plx-semantic-color-cta-primary-pressed: #00330E;
    --plx-semantic-color-cta-secondary: #1B51DC;
    --plx-semantic-color-cta-secondary-hover: #DEF3FB;
    --plx-semantic-color-cta-secondary-pressed: #0F266D;
    /*TEXTS*/
    --plx-semantic-color-text-primary: #221C46;
    --plx-semantic-color-text-tertiary: #5A5469;
    --plx-semantic-color-text-highlight: #CC1480;
    --plx-semantic-color-text-inverse: #FFFFFF;
    --plx-semantic-color-text-error: #B30000;
    --plx-semantic-color-text-link: #1B51DC;
    --plx-semantic-color-text-hover: #526CF8;
    --plx-semantic-color-text-disabled: #B5B2BC;
    /*ICONS*/
    --plx-semantic-color-icon-primary: #221C46;
    --plx-semantic-color-icon-secondary: #908C99;
    --plx-semantic-color-icon-inverse: #FFFFFF;
    --plx-semantic-color-icon-info: #1B51DC;
    --plx-semantic-color-icon-disabled: #B5B2BC;
    /*BACKGROUNDS*/
    --plx-semantic-color-background-primary: #FAF8FF;
    --plx-semantic-color-background-disabled: #EFEFEF;
    --plx-semantic-color-background-error: #FCF1EE;
    --plx-semantic-color-background-info: #F3F3FC;
    /*FOREGROUNDS*/
    --plx-semantic-color-foreground-primary: #221C46;
}
/* #endregion */


/* #region Fuentes */

@font-face {
    font-family: 'tt_travels_black_italic';
    src: url('../fonts/tt_travels_black_italic.eot');
    src: url('../fonts/tt_travels_black_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_black_italic.woff2') format('woff2'), url('../fonts/tt_travels_black_italic.woff') format('woff'), url('../fonts/tt travels black italic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_black';
    src: url('../fonts/tt_travels_black.eot');
    src: url('../fonts/tt_travels_black.eot') format('embedded-opentype'), url('../fonts/tt_travels_black.woff2') format('woff2'), url('../fonts/tt_travels_black.woff') format('woff'), url('../fonts/tt travels black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_extrabold_italic';
    src: url('../fonts/tt_travels_extrabold_italic.eot');
    src: url('../fonts/tt_travels_extrabold_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_extrabold_italic.woff2') format('woff2'), url('../fonts/tt_travels_extrabold_italic.woff') format('woff'), url('../fonts/tt travels extrabold italic.ttf') format('truetype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_extrabold';
    src: url('../fonts/tt_travels_extrabold.eot');
    src: url('../fonts/tt_travels_extrabold.eot') format('embedded-opentype'), url('../fonts/tt_travels_extrabold.woff2') format('woff2'), url('../fonts/tt_travels_extrabold.woff') format('woff'), url('../fonts/tt travels extrabold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_bold_italic';
    src: url('../fonts/tt_travels_bold_italic.eot');
    src: url('../fonts/tt_travels_bold_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_bold_italic.woff2') format('woff2'), url('../fonts/tt_travels_bold_italic.woff') format('woff'), url('../fonts/tt travels bold_italic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_bold';
    src: url('../fonts/tt_travels_bold.eot');
    src: url('../fonts/tt_travels_bold.eot') format('embedded-opentype'), url('../fonts/tt_travels_bold.woff2') format('woff2'), url('../fonts/tt_travels_bold.woff') format('woff'), url('../fonts/tt travels bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_demibold_italic';
    src: url('../fonts/tt_travels_demibold_italic.eot');
    src: url('../fonts/tt_travels_demibold_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_demibold_italic.woff2') format('woff2'), url('../fonts/tt_travels_demibold_italic.woff') format('woff'), url('../fonts/tt travels demibold italic.ttf') format('truetype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_demibold';
    src: url('../fonts/tt_travels_demibold.eot');
    src: url('../fonts/tt_travels_demibold.eot') format('embedded-opentype'), url('../fonts/tt_travels_demibold.woff2') format('woff2'), url('../fonts/tt_travels_demibold.woff') format('woff'), url('../fonts/tt travels demibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_medium_italic';
    src: url('../fonts/tt_travels_medium_italic.eot');
    src: url('../fonts/tt_travels_medium_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_medium_italic.woff2') format('woff2'), url('../fonts/tt_travels_medium_italic.woff') format('woff'), url('../fonts/tt travels medium italic.ttf') format('truetype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_medium';
    src: url('../fonts/tt_travels_medium.eot');
    src: url('../fonts/tt_travels_medium.eot') format('embedded-opentype'), url('../fonts/tt_travels_medium.woff2') format('woff2'), url('../fonts/tt_travels_medium.woff') format('woff'), url('../fonts/tt travels medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_regular';
    src: url('../fonts/tt_travels_regular.eot');
    src: url('../fonts/tt_travels_regular.eot') format('embedded-opentype'), url('../fonts/tt_travels_regular.woff2') format('woff2'), url('../fonts/tt_travels_regular.woff') format('woff'), url('../fonts/tt travels regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_light_italic';
    src: url('../fonts/tt_travels_light_italic.eot');
    src: url('../fonts/tt_travels_light_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_light_italic.woff2') format('woff2'), url('../fonts/tt_travels_light_italic.woff') format('woff'), url('../fonts/tt travels light italic.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_light';
    src: url('../fonts/tt_travels_light.eot');
    src: url('../fonts/tt_travels_light.eot') format('embedded-opentype'), url('../fonts/tt_travels_light.woff2') format('woff2'), url('../fonts/tt_travels_light.woff') format('woff'), url('../fonts/tt travels light.ttf') format('truetype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_extralight_italic';
    src: url('../fonts/tt_travels_extralight_italic.eot');
    src: url('../fonts/tt_travels_extralight_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_extralight_italic.woff2') format('woff2'), url('../fonts/tt_travels_extralight_italic.woff') format('woff'), url('../fonts/tt travels extralight italic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_extralight';
    src: url('../fonts/tt_travels_extralight.eot');
    src: url('../fonts/tt_travels_extralight.eot') format('embedded-opentype'), url('../fonts/tt_travels_extralight.woff2') format('woff2'), url('../fonts/tt_travels_extralight.woff') format('woff'), url('../fonts/tt travels extralight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'tt_travels_thin_italic';
    src: url('../fonts/tt_travels_thin_italic.eot');
    src: url('../fonts/tt_travels_thin_italic.eot') format('embedded-opentype'), url('../fonts/tt_travels_thin_italic.woff2') format('woff2'), url('../fonts/tt_travels_thin_italic.woff') format('woff'), url('../fonts/tt travels thin italic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'tt_travels_thin';
    src: url('../fonts/tt_travels_thin.eot');
    src: url('../fonts/tt_travels_thin.eot') format('embedded-opentype'), url('../fonts/tt_travels_thin.woff2') format('woff2'), url('../fonts/tt_travels_thin.woff') format('woff'), url('../fonts/tt travels thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

/* #endregion */


/* #region Fonts Sizes/Heights */

.travels-black {
    font-family: "tt_travels_black";
}

.travels-extrabold {
    font-family: "tt_travels_extrabold";
}

.travels-bold {
    font-family: "tt_travels_bold";
}

.travels-demibold {
    font-family: "tt_travels_demibold";
}

.travels-medium {
    font-family: "tt_travels_medium";
}

.travels-regular {
    font-family: "tt_travels_regular";
}

.travels-light {
    font-family: "tt_travels_light";
}

.travels-extralight {
    font-family: "tt_travels_extralight";
}

.travels-thin {
    font-family: "tt_travels_thin";
}

.title-extrabold {
    font-family: "tt_travels_extrabold";
    font-size: 2rem;
    line-height: 125%;
    letter-spacing: -0.1rem;
}

.subtitle-medium {
    font-family: "tt_travels_medium";
    font-size: 1.25rem;
    line-height: 125%;
    letter-spacing: -0.0625rem;
}

.small-bold-0_75rem {
    font-family: "tt_travels_regular";
    font-weight: bold;
    font-size: 0.75rem;
    line-height: 150%;
    font-weight: bold;
    letter-spacing: -0.05rem;
}

.large-bold-1rem {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
}

.large-bold-1_2rem {
    font-family: "tt_travels_bold";
    font-size: 1.2rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
}

.large-bold-1_3rem {
    font-family: "tt_travels_bold";
    font-size: 1.3rem;
    line-height: 180%;
    letter-spacing: -0.075rem;
}

.large-bold-1_5rem {
    font-family: "tt_travels_bold";
    font-size: 1.5rem;
    line-height: 132%;
    letter-spacing: -0.075rem;
}

.large-bold-2-rem {
    font-family: "tt_travels_bold";
    font-size: 2rem;
    line-height: 132%;
    letter-spacing: -0.075rem;
}

.extra-large-demibold {
    font-family: "tt_travels_demibold";
    font-size: 1.25rem;
    letter-spacing: -0.05rem;
}

.large-demibold {
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    letter-spacing: -0.05rem;
}

.large-bold {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
}

.medium-demibold {
    font-family: "tt_travels_demibold";
    font-size: 0.875rem;
    letter-spacing: -0.05rem;
}

.small-demibold {
    font-family: "tt_travels_demibold";
    font-size: 0.75rem;
    letter-spacing: -0.0375rem;
}

.large-regular {
    font-family: "tt_travels_regular";
    font-size: 1rem;
    letter-spacing: -0.05rem;
}

.medium-regular {
    font-family: "tt_travels_regular";
    font-size: 0.875rem;
    letter-spacing: -0.05rem;
}

.small-regular {
    font-family: "tt_travels_regular";
    font-size: 0.75rem;
    letter-spacing: -0.0375rem;
}

/* #endregion */


/* #region General */

html, body {
    font-family: 'tt_travels_regular';
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    color: var(--plx-semantic-color-text-primary);
    background-color: var(--plx-semantic-color-surface-1);
}

header, footer {
    width: 100%;
}

header {
    height: auto;
    order: -1;
}

.container p {
    color: #65676A;
    line-height: 20px;
    font-size: 1rem;
    font-family: tt_travels_regular
}

.middleContent {
    height: 100%;
    display: flex;
    flex-direction: row;
    order: 50;
}

.contact_form {
    flex: 1;
    width: 0rem;
}

.wrapper {
    clear: both;
    position: relative;
    overflow: hidden;
    height: 100%;
}

footer {
    z-index: 100;
    width: 100%;
    order: 100;
}

input, select {
    border: none;
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    color: var(--plx-semantic-color-text-primary);
    padding: 0;
}

    input::placeholder {
        color: var(--plx-semantic-color-icon-secondary);
    }

    input::-webkit-input-placeholder {
        color: var(--plx-semantic-color-icon-secondary);
    }

    input::-ms-input-placeholder {
        color: var(--plx-semantic-color-icon-secondary);
    }


.inputpluxee {
    border: none;
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    color: var(--plx-semantic-color-text-primary);
    padding: 0;
}

input::placeholder {
    color: var(--plx-semantic-color-icon-secondary);
}

input::-webkit-input-placeholder {
    color: var(--plx-semantic-color-icon-secondary);
}

input::-ms-input-placeholder {
    color: var(--plx-semantic-color-icon-secondary);
}

.title-h5 {
    font-family: 'tt_travels_black';
    font-weight: 900;
    padding: 1rem 0rem;
}

.height-fijo {
    height: 10rem;
    overflow: auto;
}

:focus-visible {
    outline: none !important;
}

/* #endregion */


/* #region Maquetación HTML - CSS */

/* * * * * * * * */
/* #region Estilos de las vistas de todas las páginas */
/* * * * * * * * */

/* #region Unlogged page */

.plx-unlogged-page-full-page {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    padding: 3rem 5.8125rem 3rem 5.75rem;
}

.plx-unlogged-page-left-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 1.5rem 5.8125rem 3rem 5.75rem;
    gap: 24px;
}

.plx-unlogged-page-left-column-version2 {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    padding: 1.5rem 5.8125rem 3rem 5.75rem;
}

.plx-unlogged-page-right-column {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background-size: cover;
    background-position: center;
}

/* Estilos para pantallas mayores a 992px */
@media (min-width: 992px) {
    .plx-unlogged-page-right-column {
        display: block;
    }
}

/* Estilos para pantallas de 992px o menos */
@media (max-width: 991px) {
    .plx-unlogged-page-right-column {
        display: none;
    }
}


.plx-unlogged-page-title {
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_black";
    font-size: 2.625rem;
    line-height: 134%;
    letter-spacing: -0.13125rem;
}

@media (max-width: 1300px),(max-height:800px) and (min-height:650px) {
    .plx-unlogged-page-title {
        font-size: 2rem;
    }
}

@media (max-height: 650px) {
    .plx-unlogged-page-title {
        font-size: 2rem;
    }
}

/* #endregion Unlogged page */

/* #region Logged page */

.plx-logged-page {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    grid-gap: 2rem;
    padding: 3rem 5.75rem 1.5rem 5.75rem;
    box-sizing: border-box;
    background-color: var(--plx-semantic-color-background-primary);
}

.plx-logged-page-title {
    color: var(--plx-semantic-color-text-tertiary);
    font-family: "tt_travels_black";
    font-size: 2.625rem;
    line-height: 134%;
    letter-spacing: -0.13125rem;
}

.plx-logged-page-body {
    width: 100%;
}

.plx-logged-page-block {
    padding: 1.5rem;
    width: 100%;
    min-height: 12rem;
    /*min-width: min-content;*/
    box-sizing: border-box;
    background-color: var(--plx-semantic-color-surface-1);
    box-shadow: 1px 1px 0px 0px rgba(34, 28, 70, 0.20);
}

.plx-logged-page-block-gif {
    width: 20%;
    margin-top: 2rem;
}

.plx-logged-page-block.no-min-height {
    min-height: unset;
}

.plx-logged-page-subtitle {
    font-family: "tt_travels_black";
    font-size: 1.5rem;
    color: #221C46;
    font-weight: 100;
    margin-bottom: 1rem; /* Espacio entre el título y la información */
}

.plx-logged-page-sub-subtitle {
    font-family: "tt_travels_black";
    font-size: 1.2rem;
    color: #221C46;
    font-weight: 100;
    margin-bottom: 1rem; /* Espacio entre el título y la información */
}

/* #endregion Logged page */

/* * * * * * * * */
/* #endregion Fin estilos de las vistas de todas las páginas */
/* * * * * * * * */

/* #endregion */


/* #region Display Modes */

.display-none {
    display: none;
}

.display-block {
    display: block;
}

.display-inline-block {
    display: inline-block;
}

.display-flex {
    display: flex;
}

.flex-row {
    flex-direction: row;
}

.flex-column {
    flex-direction: column;
}

.flex-1 {
    flex: 1;
}

.flex-2 {
    flex: 2;
}

.flex-3 {
    flex: 3;
}

.flex-4 {
    flex: 4;
}

.flex-5 {
    flex: 5;
}

.flex-6 {
    flex: 6;
}

.flex-7 {
    flex: 7;
}

.flex-8 {
    flex: 8;
}

.flex-9 {
    flex: 9;
}

.d-grid {
    display: grid;
}

.grid-1-column {
    grid-template-columns: repeat(1, 1fr);
}

.grid-2-columns {
    grid-template-columns: repeat(2, 1fr);
}

.grid-3-columns {
    grid-template-columns: repeat(3, 1fr);
}

.grid-4-columns {
    grid-template-columns: repeat(4, 1fr);
}

.grid-4-columns-same-width {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-6-columns {
    grid-template-columns: repeat(6, 1fr);
}

.grid-column-gap-0_75rem {
    column-gap: 0.75rem;
}

.grid-row-gap-0_75rem {
    grid-row-gap: 0.75rem;
}

/* #endregion */


/* #region Justify Content */

.jc-center {
    justify-content: center;
}

.jc-space-between {
    justify-content: space-between;
}

.jc-end {
    justify-content: flex-end;
}

/* #endregion */


/* #region Align Items */

.ai-center {
    align-items: center;
}

.ai-flex-start {
    align-items: flex-start;
}

.ai-flex-end {
    align-items: flex-end;
}

/* #endregion */


/* #region Align Self */

.as-stretch {
    align-self: stretch;
}

/* #endregion */


/* #region Overflow */

.overflow-hidden {
    overflow: hidden;
}

.overflow-auto {
    overflow: auto;
}

.overflow-x-auto {
    overflow-x: auto;
}

.overflow-y-auto {
    overflow-y: auto;
}

/* #endregion */


/* #region Gaps */

.gap-0_125rem {
    grid-gap: 0.125rem;
}

.gap-0_25rem {
    grid-gap: 0.25rem;
}

.gap-0_5rem {
    grid-gap: 0.5rem;
}

.gap-0_75rem {
    grid-gap: 0.75rem;
}

.gap-1rem {
    grid-gap: 1rem;
}

.gap-1_5rem {
    grid-gap: 1.5rem;
}

.gap-2rem {
    grid-gap: 2rem;
}

.gap-2_5rem {
    grid-gap: 2.5rem;
}

.gap-3rem {
    grid-gap: 3rem;
}

.gap-4rem {
    grid-gap: 4rem;
}

.gap-5rem {
    grid-gap: 5rem;
}

/* #endregion */


/* #region Positions */
.static-position {
    position: static;
}

.relative-position {
    position: relative;
}

.absolute-position {
    position: absolute;
}

.absolute-origin {
    position: absolute;
    top: 0;
    left: 0;
}

.fixed-origin {
    position: fixed;
    top: 0;
    left: 0;
}

.top-0 {
    top: 0;
}

.bottom-0 {
    bottom: 0;
}

.left-0 {
    left: 0;
}

.right-0 {
    right: 0;
}

/* #endregion */


/* #region Sizes */

.no-height {
    height: 0;
}

.height-2rem {
    height: 2rem;
}

.height-4_25rem {
    height: 4.25rem;
}

.height-5rem {
    height: 5rem;
}

.height-50per {
    height: 50%;
}

.full-height {
    height: 100%;
}

.height-auto-imp {
    height: auto !important;
}

.no-width {
    width: 0;
}

.width-2rem {
    width: 2rem;
}

.width-6_25rem {
    width: 6.25rem;
}

.width-22_5rem {
    width: 22.5rem;
}

.width-25rem {
    width: 25rem;
}

.width-25per {
    width: 25%;
}

.width-33per {
    width: calc(100% / 3);
}

.width-50per {
    width: 50%;
}

.width-66per {
    width: calc(200% / 3);
}

.full-width {
    width: 100%;
}

.width-fit-content {
    width: fit-content;
}

.box-sizing-border {
    box-sizing: border-box;
}

.box-sizing-content {
    box-sizing: content-box;
}

.scaleX-minus1 {
    transform: scaleX(-1);
}

.scaleY-minus1 {
    transform: scaleY(-1);
}

.no-min-height-imp {
    min-height: 0rem !important;
}

.min-height-25rem {
    min-height: 25rem;
}

.min-width-100px {
    min-width: 100px;
}

.min-width-145px {
    min-width: 145px;
}

/* #endregion */


/* #region Padding */

.no-padding {
    padding: 0;
}

.padding-0_75rem {
    padding: 0.75rem;
}

.padding-1rem {
    padding: 1rem;
}

.padding-1_5rem {
    padding: 1.5rem;
}

.padding-2rem {
    padding: 2rem;
}

.padding-3rem {
    padding: 3rem;
}

.padding-30 {
    padding: 3rem 0rem;
}

.padding-left-0_25rem {
    padding-left: 0.25rem;
}

.padding-right-0_25rem {
    padding-right: 0.25rem;
}

.padding-left-0_5rem {
    padding-left: 0.5rem;
}

.padding-right-0_5rem {
    padding-right: 0.5rem;
}

.padding-right-2rem-imp {
    padding-right: 2rem !important;
}

.padding-bottom-1rem {
    padding-bottom: 1rem;
}

.padding-top-1rem {
    padding-top: 1rem;
}


.padding-v-0_75rem {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.padding-v-1rem-imp {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}

.padding-v-1_5rem {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.padding-v-1_75rem {
    padding-top: 1.75rem;
    padding-bottom: 1.75rem;
}

.padding-h-0_5rem {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.padding-h-1rem {
    padding-left: 1rem;
    padding-right: 1rem;
}

.padding-h-1_5rem {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

/* #endregion */


/* #region Margin */

.no-margin {
    margin: 0;
}

.margin-auto {
    margin: auto;
}

.margin-bottom-0_5rem {
    margin-bottom: 0.5rem;
}

.margin-bottom-3rem {
    margin-bottom: 3rem;
}

.margin-top-1rem {
    margin-top: 1rem;
}

.margin-bottom-1rem {
    margin-bottom: 1rem;
}

.margin-top-1_2rem {
    margin-top: 1.2rem;
}

.margin-top-1_5rem {
    margin-top: 1.5rem;
}

.margin-top-1_8rem {
    margin-top: 1.8rem;
}

.margin-top-2rem {
    margin-top: 2rem;
}

.margin-top-3rem {
    margin-top: 3rem;
}

.margin-bottom-1_5rem {
    margin-bottom: 1.5rem;
}

.margin-bottom-neg-1rem {
    margin-bottom: -1rem;
}

.margin-left-1rem {
    margin-left: 1rem;
}

.margin-x-3rem {
    margin-left: 3rem;
    margin-right: 3rem;
}

/* #endregion */


/* #region Colors */

.plx-no-bg {
    background: none;
}

.plx-bg-primary {
    background-color: var(--plx-semantic-color-brand-primary);
}

.plx-text-primary {
    color: var(--plx-semantic-color-text-primary);
}

.plx-bg-cta-primary {
    background-color: var(--plx-semantic-color-cta-primary);
}

.plx-bg-secondary {
    background-color: var(--plx-semantic-color-brand-secondary);
}

.plx-bg-tertiary-dimmed {
    background-color: var(--plx-semantic-color-brand-tertiary-dimmed);
}

.plx-bg-surface-1 {
    background-color: var(--plx-semantic-color-surface-1);
}

.plx-bg-inverse {
    background-color: var(--plx-semantic-color-icon-inverse);
}

.plx-text-error {
    color: var(--plx-semantic-color-text-error);
}

.plx-text-link {
    color: var(--plx-semantic-color-text-link)
}

.plx-text-link-imp {
    color: var(--plx-semantic-color-text-link) !important
}

.plx-text-disabled {
    color: var(--plx-semantic-color-text-disabled);
}

.plx-bg-surface-1-0_5-opac {
    background-color: var(--plx-semantic-color-surface-1-0_5-opac);
}

.plx-bg-deep-blue-12-0_5-opac {
    background-color: var(--plx-core-color-deep-blue-12-0_5-opac);
}

.plx-bg-transparent-imp {
    background-color: transparent !important;
}

.plx-text-transparent-imp {
    color: transparent !important;
}

/* #endregion */


/* #region Opacity */

.opac-0 {
    opacity: 0;
}

.opac-0_5 {
    opacity: 0.5;
}

.full-opac {
    opacity: 1.0;
}

/* #endregion */

/* #region Text */

.text-align-left-imp {
    text-align: left !important;
}

.text-align-center {
    text-align: center;
}

.text-decoration-none {
    text-decoration: none;
}

.text-no-wrap {
    white-space: nowrap;
}

/* #endregion */


/* #region Borders */

.plx-no-border {
    border: none;
}

.plx-border-3-foreground-primary {
    border: 3px solid var(--plx-semantic-color-foreground-primary);
}

.plx-bottom-border-brand-secondary {
    border-bottom: solid 1px var(--plx-semantic-color-brand-secondary);
}

.plx-border-secondary {
    border: solid 1px var(--plx-semantic-color-border-secondary);
}

.plx-top-border-secondary {
    border-top: solid 1px var(--plx-semantic-color-border-secondary);
}

.plx-left-border-secondary {
    border-left: solid 1px var(--plx-semantic-color-border-secondary);
}

.plx-bottom-border-secondary {
    border-bottom: solid 1px var(--plx-semantic-color-border-secondary);
}

.plx-border-radius-2px {
    border-radius: 2px;
}

/* #endregion */


/* #region Shadows */

.shadow-large {
    box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
}

.shadow-medium {
    box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
}

.shadow-small {
    box-shadow: 1px 1px 0px 0px rgba(34, 28, 70, 0.20);
}

.shadow-bottom {
    box-shadow: 0px -1px 8px 0px rgba(34, 28, 70, 0.07);
}

.shadow-side {
    box-shadow: 1px 0px 8px 0px rgba(34, 28, 70, 0.07);
}

/* #endregion */


/* #region Lists */

.list-none-style {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bullet-list {
    margin: 0px;
    padding: 0px;
}

    .bullet-list li {
        list-style: none;
        padding: 0.1875rem;
    }

        .bullet-list li::before {
            content: '';
            display: inline-block;
            height: 0.3rem;
            width: 0.3rem;
            background: url("../Images/Pluxee/plx-bulletList-bullet.svg") no-repeat;
            background-size: contain;
            margin-right: 0.25rem;
            margin-bottom: 0.25rem;
        }

/* #endregion */


/* #region Object Fit */

.object-fit-cover {
    object-fit: cover;
}

.object-fit-contain {
    object-fit: contain;
}

.object-fit-fill {
    object-fit: fill;
}

/* #endregion */


/* #region Cursors */

.cursor-pointer {
    cursor: pointer;
}

/* #endregion */


/* #region Pointer Events */

.no-pointer-events {
    pointer-events: none;
}
/* #endregion */


/* #region Other Classes */

.unselectable {
    user-select: none;
}

.custom-etiquetas {
    text-decoration: none !important;
    color: #221C46;
}

    .custom-etiquetas:hover {
        color: #1B51DC;
    }

/* #endregion */


/* #region Complex classes */

.required-mark {
    color: var(--plx-semantic-color-text-highlight);
}

/* #endregion */


/* #region Header Classes */

.header-logo {
    padding: 0rem 1.5rem 0rem 5.25rem;
    flex-shrink: 0;
    width: 25rem;
}

.header-user-id {
    padding: 1.5rem 1rem;
    position: relative;
}

    .header-user-id:hover {
        border-bottom: 4px solid var(--plx-semantic-color-interactive-primary);
        background: var(--plx-semantic-color-cta-secondary-hover);
        padding: 1.5rem 1rem 1.25rem 1rem;
    }

        .header-user-id:hover .header-user-id-options {
            display: block;
        }

        .header-user-id:hover #flechaAbajoPerfil {
            display: none;
        }

        .header-user-id:hover #flechaArribaPerfil {
            display: block;
        }

    .header-user-id:focus {
        border: 3px solid var(--plx-semantic-color-outline-focus);
        background: var(--plx-semantic-color-cta-secondary-hover);
        padding: 1.3125rem 0.8125rem;
    }

    .header-user-id:active {
        border-bottom: 4px solid var(--plx-semantic-color-interactive-primary);
        padding: 1.5rem 1rem 1.25rem 1rem;
    }

    .header-user-id:current {
        border-bottom: 4px solid var(--plx-semantic-color-interactive-primary);
        padding: 1.5rem 1rem 1.25rem 1rem;
    }

.header-user-id-options {
    display: none;
    position: absolute;
    right: 0;
    top: 5rem;
    z-index: 103;
    white-space: nowrap;
}

.header-user-id-option {
    padding: 0.75rem 0.75rem 0.6875rem 1.5rem;
    border-bottom: solid 1px var(--plx-semantic-color-border-secondary);
    display: flex;
    align-items: center;
    grid-gap: 0.75rem;
    height: 4.25rem;
    box-sizing: border-box;
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    letter-spacing: -0.05rem;
    text-decoration: none;
    user-select: none;
}

    .header-user-id-option:hover {
        background: var(--plx-semantic-color-cta-secondary-hover);
    }

    .header-user-id-option:focus {
        background: var(--plx-semantic-color-cta-secondary-hover);
        border: 3px solid var(--plx-semantic-color-outline-focus);
        padding: 0.5625rem 0.5625rem 0.5625rem 1.3125rem;
    }

    .header-user-id-option:active {
        color: var(--plx-semantic-color-cta-secondary-pressed);
    }

@media (max-width: 1000px) {
    .header-logo {
        width: 15.625rem;
    }
}

/* #endregion */


/* #region Footer Classes */

.footer-inner {
    padding: 0.75rem 2rem;
}

.footer-text-separator {
    width: 0.1125rem;
    height: 0.8rem;
    background: var(--plx-semantic-color-border-primary);
}

.footer-rrss-icons {
    width: 6.25rem;
}

@media (max-width: 950px) {
    .footer-rrss-icons {
        width: 4.6875rem;
    }

    .footer-copy {
        content: "&copy; Pluxee 2023";
    }

    .footer-privacidad {
        display: none;
    }

    .footer-priv-pl-cookies-sep {
        display: none;
    }

    .footer-pl-cookies {
        display: none;
    }

    .footer-pl-cookies-cf-cookies-sep {
        display: none;
    }
}

/* #endregion */


/* #region Menu Lateral Classes */

#sideNavContainer div:nth-child(2) > div:nth-child(3) > div {
    margin-top: 140px !important;
}

.sidenav {
    width: 16rem;
    flex: 0 0 auto;
    height: inherit;
    display: inline-block;
    position: relative;
    z-index: 100; /* Stay on top */
    top: 0;
    left: 0;
    padding-bottom: 50px;
    background-color: var(--plx-core-color-deep-blue-12);
    overflow-x: visible; /* Disable horizontal scroll */
}

    /* The navigation menu links */
    .sidenav a {
        padding-top: 22px;
        padding-bottom: 22px;
        padding-right: 34px;
        text-decoration: none;
        font-size: 0.85rem;
        font-family: 'tt_travels_demibold';
        background-color: var(--plx-core-color-deep-blue-12);
        color: white;
        display: flex;
        align-items: center;
        cursor: pointer;
    }


        /* When you mouse over the navigation links, change their color */
        .sidenav a:hover {
            background-color: var(--plx-core-color-ultra-green-2);
            color: var(--plx-core-color-deep-blue-12);
            font-family: 'tt_travels_bold';
        }

.dropdown {
    position: relative;
}

.dropdown-content-1,
.dropdown-content-2 {
    display: none;
    background-color: #f1f1f1;
    min-width: 160px;
    width: 370px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    position: absolute; /* Added */
    left: 100%; /* Added */
    top: 0; /* Added */
}


    /* Links inside the dropdown */
    .dropdown-content-1 a,
    .dropdown-content-2 a {
        color: var(--plx-core-color-deep-blue-12);
        background-color: var(--plx-core-color-ultra-green-2);
        padding: 22px 24px;
        text-decoration: none;
    }

        /* Change color of dropdown links on hover */
        .dropdown-content-1 a:hover,
        .dropdown-content-2 a:hover {
            color: var(--plx-core-color-deep-blue-12);
            background-color: var(--plx-core-color-ultra-green-2);
        }

@media(max-width: 1000px) {
    .dropdown-content-1,
    .dropdown-content-2 {
        width: 250px;
    }
}

.dropdown-content-inverse {
    top: auto;
    bottom: 0;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content-1,
.dropdown-1:hover .dropdown-content-2 {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropItem {
    background-color: var(--plx-core-color-ultra-green-2);
    color: var(--plx-core-color-deep-blue-12);
    font-weight: bold;
}

.enable-rounded {
    background-color: var(--plx-core-color-ultra-green-2);
    border-radius: 50%;
    margin-right: 12px;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menuIcon {
    height: 24px;
    width: 24px;
}

.menuLink:hover .menuIcon {
    filter: none;
}

.dropdown:hover .menuIcon {
    filter: none;
}

.arrowMenuIcon {
    margin-right: 12px;
    visibility: hidden;
}

.menuLink:hover .arrowMenuIcon {
    visibility: visible;
}

.dropdown:hover .arrowMenuIcon {
    visibility: visible;
}

a.menuLink:hover {
    font-weight: bold;
    font-family: tt_travels_bold;
}
/* #endregion */


/* #region Popups Classes */

.popup-container {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 35rem;
    padding: 1.5rem 1.5rem 2.5rem 1.5rem;
    grid-gap: 1.5rem;
    background-color: var(--plx-semantic-color-surface-1);
    text-align: center;
}

.popup-close-button {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.popup-button-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    grid-gap: 1rem;
}

/* #endregion */


/* #region Loading Screen Classes */

.loading-spinner {
    animation: loading-spinner-rotation 1s ease-in-out infinite;
}

@keyframes loading-spinner-rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* #endregion */


/* #region Captcha Input Classes */

.captcha-input table {
    width: 100%;
}

.captcha-input .dxcaTextBoxLabel {
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 145%;
    letter-spacing: -0.04375rem;
}

.captcha-input td.dxic {
    padding: 0 !important;
}

.captcha-input input.dxeEditAreaSys[type="text"] {
    padding: 0.875rem !important;
    box-sizing: border-box;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    background-color: var(--plx-semantic-color-surface-1) !important;
    color: var(--plx-semantic-color-text-primary) !important;
    height: auto !important;
    margin: 0 !important;
}

    .captcha-input input.dxeEditAreaSys[type="text"]:hover {
        background: var(--plx-semantic-color-cta-secondary-hover) !important;
    }

    .captcha-input input.dxeEditAreaSys[type="text"]:active, .captcha-input input.dxeEditAreaSys[type="text"]:focus {
        background: var(--plx-semantic-color-surface-1) !important;
        padding: 0.75rem !important;
    }

    .captcha-input input.dxeEditAreaSys[type="text"]:disabled {
        background: var(--plx-semantic-color-background-disabled) !important;
    }

.captcha-input .dxeTextBoxSys {
    border: solid 1px var(--plx-semantic-color-border-secondary);
}

.captcha-input .dxeErrorCell {
    color: var(--plx-semantic-color-text-error) !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 0.75rem !important;
    line-height: 135% !important;
    letter-spacing: -0.0375rem !important;
}

.captcha-input .dxcaRefreshButtonText {
    color: var(--plx-semantic-color-text-link) !important;
    font-family: "tt_travels_demibold_italic" !important;
    font-size: 0.75rem !important;
    line-height: 135% !important;
    letter-spacing: -0.0375rem !important;
}

.captcha-input .dxca-imageDiv {
    background-color: transparent !important;
}

    .captcha-input .dxca-imageDiv img {
        border: solid 1px var(--plx-semantic-color-border-secondary) !important;
    }

.captcha-input .input-label-interactive {
    color: var(--plx-semantic-color-interactive-primary) !important;
}

.captcha-input input.dxeEditAreaSys[type="text"].error {
    border: 1px solid var(--plx-semantic-color-border-error) !important;
    background: var(--plx-semantic-color-background-error) !important;
}

.captcha-input .input-border-hover {
    border: 1px solid var(--plx-semantic-color-interactive-primary) !important;
    box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20) !important;
}

.captcha-input .input-border-focused {
    border: 3px solid var(--plx-semantic-color-outline-focus) !important;
}

.captcha-input .input-border-disabled {
    border: 1px solid var(--plx-semantic-color-border-secondary) !important;
}

/* #endregion */


/* #region Forms & Forms Steps Classes */

.form-steps {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.form-steps-box-completed {
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0.125rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    grid-gap: 0.25rem;
    border: 1px solid var(--plx-semantic-color-interactive-primary);
    background: var(--plx-semantic-color-interactive-primary);
    color: var(--plx-semantic-color-surface-1);
    text-align: center;
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 135%;
    letter-spacing: -0.0375rem;
}

.form-steps-box-current {
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0.125rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    grid-gap: 0.25rem;
    border: 1px solid var(--plx-semantic-color-interactive-primary);
    background: var(--plx-semantic-color-cta-secondary-hover);
    color: var(--plx-semantic-color-interactive-primary);
    text-align: center;
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 135%;
    letter-spacing: -0.0375rem;
}

.form-steps-box-pending {
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0.125rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    grid-gap: 0.25rem;
    border: 1px solid var(--plx-semantic-color-interactive-primary);
    background: var(--plx-semantic-color-surface-1);
    color: var(--plx-semantic-color-interactive-primary);
    text-align: center;
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 135%;
    letter-spacing: -0.0375rem;
}

.form-steps-box-with-label {
    width: auto !important;
    padding: 1.125rem !important;
    font-size: 0.8rem !important;
}

.form-steps-box-with-text {
    width: auto;
    font-family: "tt_travels_medium";
    padding: 0.125rem 0.5rem 0.125rem 0.5rem;
    font-size: 0.8rem;
}

.form-steps-bar-container {
    display: flex;
    align-items: flex-start;
    flex: 1 0 0;
}

.form-steps-bar-completed {
    display: flex;
    height: 0.25rem;
    justify-content: flex-end;
    align-items: center;
    grid-gap: 0.5rem;
    flex: 1 0 0;
    background: var(--plx-semantic-color-interactive-primary);
}

.form-steps-bar-pending {
    display: flex;
    height: 0.25rem;
    justify-content: flex-end;
    align-items: center;
    grid-gap: 0.5rem;
    flex: 1 0 0;
    background: var(--plx-semantic-color-background-disabled);
}

.labelSeccion {
    color: var(--plx-semantic-color-brand-primary);
    font-family: 'tt_travels_bold';
    font-size: large;
}

.dxeBase label {
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    color: var(--plx-semantic-color-text-primary);
}

.form-select {
    border-radius: 0;
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    color: var(--plx-semantic-color-text-primary);
    padding: 0.80rem;
}

.rblExportarEstadosTarjeta {
    border: 1px solid #CCCCCC;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    display: flex;
    padding: 1rem 2rem !important;
    text-align: center;
}

/* #endregion */


/* #region Input Classes */
.input {
    width: 100%;
}

.input-field {
    box-sizing: border-box;
    padding: 0.875rem;
}

.input-field-small {
    padding: 0.375rem 0.875rem 0.375rem 0.875rem;
}

.input-field:hover {
    background: var(--plx-semantic-color-cta-secondary-hover);
    border: 1px solid var(--plx-semantic-color-interactive-primary);
    box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20);
}

.input-field:active, .input-field:focus {
    background: var(--plx-semantic-color-surface-1);
    border: 3px solid var(--plx-semantic-color-outline-focus);
    padding: 0.75rem;
}

.input-field-small:active, .input-field-small:focus {
    padding: 0.25rem 0.75rem 0.25rem 0.75rem;
}

.input-field:disabled {
    border: 1px solid var(--plx-semantic-color-border-secondary);
    background: var(--plx-semantic-color-background-disabled);
}

.input-field.error {
    border: 1px solid var(--plx-semantic-color-border-error);
    background: var(--plx-semantic-color-background-error);
}

.input-label {
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 145%;
    letter-spacing: -0.04375rem;
    width: inherit;
}

.input-label-text {
    max-width: calc(100% - 0.5rem);
}

    .input-label-text.input-label-text-overflow {
        white-space: nowrap;
    }

        .input-label-text.input-label-text-overflow.input-label-text-cut {
            overflow: hidden;
        }

            .input-label-text.input-label-text-overflow.input-label-text-cut.input-label-text-ellipsis {
                text-overflow: ellipsis;
            }

.input-hint {
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    font-size: 0.75rem;
    line-height: 135%;
    letter-spacing: -0.0375rem;
}

.input-error {
    color: var(--plx-semantic-color-text-error);
    font-family: "tt_travels_demibold";
    font-size: 0.75rem;
    line-height: 135%;
    letter-spacing: -0.0375rem;
}

.input-label-interactive {
    color: var(--plx-semantic-color-interactive-primary);
}

.input-text-disabled {
    color: var(--plx-semantic-color-text-tertiary);
}

.input-hint-error {
    color: var(--plx-semantic-color-text-error);
}

.input-lockIconContainer-border {
    padding-top: 0.87rem;
    padding-bottom: 0.86rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    border-right-color: white;
}

.input-trailIconContainer {
    position: absolute;
    right: 1rem;
}

.info_tooltip {
    display: inline;
    position: inherit;
    right: 258px;
    border: none;
    float: none !important;
    top: 4px;
    height: 17px;
}
/* #endregion */


/* #region DateEditControl Classes */

.dateEditControl.dxeButtonEdit {
    border: none !important;
}

    .dateEditControl.dxeButtonEdit td.dxic {
        padding: 0 !important;
        border: none !important;
    }

.dateEditControl .dxeButtonEditButton {
    display: none;
}

.dateEditControl.dxeButtonEdit .dxeEditArea {
    /* width: 100% !important; */
    border: solid 1px var(--plx-semantic-color-border-secondary) !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
    /*background-color: inherit !important;*/
    padding: 0.875rem 0.875rem 0.875rem 2.75rem !important;
    margin: 0 !important;
    height: auto !important;
    box-sizing: border-box;
}

    .dateEditControl.dxeButtonEdit .dxeEditArea:hover {
        background: var(--plx-semantic-color-cta-secondary-hover) !important;
        border: 1px solid var(--plx-semantic-color-interactive-primary) !important;
        box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20) !important;
    }

    .dateEditControl.dxeButtonEdit .dxeEditArea:active, .dateEditControl.dxeButtonEdit .dxeEditArea:focus {
        background: var(--plx-semantic-color-surface-1) !important;
        border: 3px solid var(--plx-semantic-color-outline-focus) !important;
        padding: 0.75rem 0.75rem 0.75rem 2.625rem !important;
    }

    .dateEditControl.dxeButtonEdit .dxeEditArea:disabled {
        background: var(--plx-semantic-color-background-disabled) !important;
        border: 1px solid var(--plx-semantic-color-border-secondary) !important;
    }

.dateEditControl.dxeButtonEdit .dxeEditAreaWithClearButton {
    padding-right: 2.75rem !important;
}

    .dateEditControl.dxeButtonEdit .dxeEditAreaWithClearButton:active, .dateEditControl.dxeButtonEdit .dxeEditAreaWithClearButton:focus {
        padding-right: 2.625rem !important;
    }

.dateEditControl.dxeButtonEdit input.error {
    border: 1px solid var(--plx-semantic-color-border-error) !important;
    background: var(--plx-semantic-color-background-error) !important;
}

.dxgvCommandColumnItem {
    padding: 0.30rem;
}
/* #endregion */

/* #region Select Input Classes */

.select-field {
    appearance: none;
    position: relative;
    text-overflow: ellipsis;
    padding-right: 2rem;
    cursor: pointer !important;
}

    .select-field:active, .select-field:focus {
        padding-right: 1.875rem;
    }

.select-field-arrow {
    position: absolute;
    right: 1rem;
}

.select-field-option {
    padding: 0.75rem 0.5rem;
    font-family: "tt_travels_demibold";
    font-size: 0.875rem;
    font-style: normal;
    line-height: 145%;
    letter-spacing: -0.04375rem;
}

    .select-field-option:hover {
        background: var(--plx-semantic-color-cta-secondary-hover);
    }

.custom-input-dninie {
    border: 1px solid black;
    box-sizing: border-box;
    margin-right: 1rem;
    padding: 0.75rem;
    font-size: 1rem;
    border-radius: 0;
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    line-height: 150%;
    letter-spacing: -0.05rem;
    min-width: 13.75rem;
    max-width: 37.5rem;
    border-color: grey;
}

/* #endregion */


/* #region DevExpress Tables */

/* #region DevExpress Tables Basics */

.plx-gridview-dxtable .dxgvTable {
    width: 100%;
    border: none;
    position: relative;
    box-sizing: border-box;
}

.plx-gridview-dxtable.static-position .dxgvTable {
    position: static;
}

.plx-gridview-dxtable .dxgvTable td.dxgv,
.plx-gridview-dxtable .dxgvTable .dxgvFilterRow td.dxgv,
.plx-gridview-dxtable .dxgvTable td.dxgvHeader {
    font-family: "tt_travels_bold";
    font-size: 0.875rem;
    line-height: 140%;
    text-align: center;
    color: var(--plx-semantic-color-text-primary);
    border: none !important;
    border-radius: 0;
    height: 3rem;
    letter-spacing: -0.05em;
    padding: 1rem;
}

.plx-gridview-dxtable .dxgvTable td.dxgvHeader {
    padding: 0.75rem 1rem;
    font-family: "tt_travels_medium";
    background-color: var(--plx-semantic-color-foreground-primary, #221C46) !important;
}

    .plx-gridview-dxtable .dxgvTable td.dxgvHeader tr td {
        color: var(--plx-semantic-color-text-inverse);
        line-height: 145%;
        background-color: var(--plx-semantic-color-foreground-primary, #221C46) !important;
    }

        .plx-gridview-dxtable .dxgvTable td.dxgvHeader tr td:last-child {
            /* 
                    Esta clase busca ocultar un bloque junto a los textos de las celdas de cabecera que impide ajustar los textos al centro o a la derecha correctamente
                    Si oculta algo que no debería en algún caso, cabría que buscar una alternativa mejor
                */
            display: none;
        }

.plx-gridview-dxtable .dxgvTable .dxgvHeader tr td:first-child,
.plx-gridview-dxtable .dxgvTable .dxgvHeader tr td:not(:last-child) {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.plx-gridview-dxtable .dxgvTable td input {
    text-align: center;
}

.plx-gridview-dxtable .dxgvTable .dxgvFooter td {
    text-align: center !important;
}

.plx-gridview-dxtable .dxgvTable tr:nth-child(odd) {
    background-color: var(--plx-semantic-color-surface-1); /* Color de fondo para filas pares */
}

.plx-gridview-dxtable .dxgvTable tr:nth-child(even) {
    background-color: var(--plx-semantic-color-background-info); /* Color de fondo para filas impares */
}

.plx-gridview-dxtable .dxgvTable tr.dxgvFocusedRow,
.plx-gridview-dxtable .dxgvTable tr.dxgvSelectedRow {
    background-color: var(--plx-core-color-boldy-blue-3);
    color: var(--plx-semantic-color-text-primary)
}

/* #endregion */

/* #region DevExpress Tables FilterRow */

.plx-gridview-dxtable .dxgvTable .dxgvFilterRow td.dxgv {
    padding: 0.15rem;
}

.plx-gridview-dxtable.plx-dxComboBox .dxgvTable .dxgvFilterRow .dxgv .dxpc-ddSys .dxpc-shadow,
.plx-gridview-dxtable .dxgvTable .dxgvFilterRow .dxgv .plx-dxComboBox ~ .dxpc-ddSys .dxpc-shadow {
    box-shadow: none;
    -webkit-box-shadow: none;
}

.plx-gridview-dxtable.plx-dxComboBox .dxgvTable .dxgvFilterRow .dxgv .dxpc-ddSys .dxeListBox .dxeHD,
.plx-gridview-dxtable .dxgvTable .dxgvFilterRow .dxgv .plx-dxComboBox ~ .dxpc-ddSys .dxeListBox .dxeHD {
    display: none;
}

.plx-gridview-dxtable.plx-dxComboBox .dxgvTable .dxgvFilterRow .dxgv .dxpc-ddSys .dxeListBox td.dxeLTM,
.plx-gridview-dxtable .dxgvTable .dxgvFilterRow .dxgv .plx-dxComboBox ~ .dxpc-ddSys .dxeListBox td.dxeLTM {
    border: none !important;
}

/* #endregion */

/* #region DevExpress Tables DetailRow */

.plx-gridview-dxtable .dxgvTable tr.dxgvDetailRow td.dxgvDetailCell {
    padding: 1rem !important;
}

.plx-gridview-dxtable .dxgvTable tr.dxgvDetailRow:nth-child(odd) td.dxgvDetailCell tr {
    background-color: var(--plx-semantic-color-background-info);
}

.plx-gridview-dxtable .dxgvTable tr.dxgvDetailRow:nth-child(even) td.dxgvDetailCell tr {
    background-color: var(--plx-semantic-color-surface-1);
}

/* #endregion */

/* #region DevExpress Tables Selection CheckBox */

.plx-gridview-dxtable .dxgvCommandColumn.plx-gridview-dxtable-commandColumn-checkBox .dxgvCommandColumnItem,
.plx-gridview-dxtable .plx-gridview-dxtable-commandColumnHeader-checkBox .commandColumnHeader input,
.plx-gridview-dxtable .dxgv.plx-gridview-dxtable-commandColumn-checkBox .dxWeb_edtCheckBoxUnchecked,
.plx-gridview-dxtable .dxgv.plx-gridview-dxtable-commandColumn-checkBox .dxWeb_edtCheckBoxChecked {
    width: 28px !important;
    height: 28px !important;
    border: 2px solid #0080d3 !important;
    margin: auto;
    color: transparent !important;
    display: flex;
}

.plx-gridview-dxtable .dxgv.plx-gridview-dxtable-commandColumn-checkBox .dxWeb_edtCheckBoxUnchecked {
    background-image: none !important;
}

.plx-gridview-dxtable .plx-gridview-dxtable-commandColumnHeader-checkBox .commandColumnHeader .dxWeb_edtCheckBoxChecked,
.plx-gridview-dxtable .plx-gridview-dxtable-commandColumnHeader-checkBox .commandColumnHeader .dxWeb_edtCheckBoxUnchecked {
    width: auto;
    height: auto;
}

.plx-gridview-dxtable .plx-gridview-dxtable-commandColumnHeader-checkBox .commandColumnHeader input {
    opacity: 1 !important;
    background-color: var(--plx-semantic-color-surface-1) !important;
    cursor: pointer !important;
}

.plx-gridview-dxtable .dxgvSelectedRow .dxgvCommandColumn.plx-gridview-dxtable-commandColumn-checkBox .dxgvCommandColumnItem,
.plx-gridview-dxtable .plx-gridview-dxtable-commandColumnHeader-checkBox .commandColumnHeader .dxWeb_edtCheckBoxChecked input,
.plx-gridview-dxtable .dxgv.plx-gridview-dxtable-commandColumn-checkBox .dxWeb_edtCheckBoxChecked {
    background-image: url(../Images/Pluxee/plx-checkbox-symbol.svg);
}

/* #endregion */

/* #region DevExpress Tables EditForm */

.plx-gridview-dxtable .dxgvTable .dxgvEditFormTable {
    margin: 0;
    padding: 0;
}

.plx-gridview-dxtable .dxgvTable tr:nth-child(odd) .dxgvEditFormTable tr {
    background-color: var(--plx-semantic-color-surface-1);
}

.plx-gridview-dxtable .dxgvTable tr:nth-child(even) .dxgvEditFormTable tr {
    background-color: var(--plx-semantic-color-background-info);
}

.plx-gridview-dxtable .dxgvTable .dxgvEditFormTable .dxgvEditFormCaption {
    text-align: left;
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 145%;
    letter-spacing: -0.04375rem;
    width: inherit;
}

.plx-gridview-dxtable .dxgvTable .dxgvEditFormTable td input {
    text-align: left;
}

/* #region DevExpress Tables EditForm Buttons */

/* #region DevExpress Tables EditForm Filled Secondary Button */

.plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button] {
    background-color: var(--plx-semantic-color-cta-secondary);
    position: relative;
    padding: 0.95rem 1.45rem;
    font-family: "tt_travels_bold";
    font-size: 0.975rem;
    font-style: normal;
    line-height: 145%;
    letter-spacing: -0.04375rem;
    text-wrap: wrap;
    color: var(--plx-semantic-color-icon-inverse);
}

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button]:hover:not(:disabled),
    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button]:focus:not(:disabled) {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
        color: var(--plx-semantic-color-text-link);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button]:hover:not(:disabled) {
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button]:active:not(:disabled) {
        background: var(--plx-semantic-color-cta-secondary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
        color: var(--plx-semantic-color-text-inverse);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-filled-secondary-button input[type=button]:disabled {
        background-color: var(--plx-semantic-color-background-disabled);
        color: var(--plx-semantic-color-text-disabled);
    }

/* #endregion */

/* #region DevExpress Tables EditForm Outlined Secondary Button */

.plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button] {
    background-color: var(--plx-semantic-color-surface-1);
    border: 3px solid var(--plx-semantic-color-cta-secondary);
    position: relative;
    padding: 0.7625rem 1.2625rem;
    font-family: "tt_travels_bold";
    font-size: 0.975rem;
    font-style: normal;
    line-height: 145%;
    letter-spacing: -0.04375rem;
    color: var(--plx-semantic-color-text-link);
}

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button]:hover:not(:disabled),
    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button]:focus:not(:disabled) {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button]:hover:not(:disabled) {
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button]:active:not(:disabled) {
        border: 3px solid var(--plx-semantic-color-cta-secondary-pressed);
        background: var(--plx-semantic-color-cta-secondary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
        color: var(--plx-semantic-color-text-inverse);
    }

    .plx-gridview-dxtable .dxgvTable .plx-gridview-dxtable-editForm-outlined-secondary-button input[type=button]:disabled {
        border: 3px solid var(--plx-semantic-color-border-disabled);
        color: var(--plx-semantic-color-text-disabled);
    }

/* #endregion */

/* #endregion */

/* #endregion */

/* #region DevExpress Tables Pager */

.plx-gridview-dxtable .dxgvPagerBottomPanel {
    background-color: var(--plx-semantic-color-surface-1) !important;
    padding: 0 1rem !important;
    height: 3rem !important;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

    .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite {
        color: var(--plx-semantic-color-text-primary) !important;
        font-family: "tt_travels_demibold";
        font-size: 1rem;
        padding: 0 !important;
        display: flex;
        flex-direction: row;
        align-items: center;
        grid-gap: 0.5rem;
    }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite > * {
            padding: 0 !important;
            font-weight: 500 !important;
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-lead:not(.dxp-button) {
            padding-right: 0.5rem !important;
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-button,
        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-ellip,
        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-num {
            width: 1.2rem;
            height: 1.2rem;
            display: flex;
            justify-content: center;
            align-items: center;
            border: 1px solid var(--plx-semantic-color-border-primary);
            background-color: var(--plx-semantic-color-surface-1);
            color: var(--plx-semantic-color-text-primary);
            font-family: "tt_travels_demibold";
            font-size: 0.75rem;
            font-weight: 600 !important;
            line-height: 150%;
            text-decoration: none;
            margin: 0 !important;
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-ellip,
        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-num {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-ellip {
            color: var(--plx-semantic-color-interactive-primary);
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-current {
            color: var(--plx-semantic-color-text-inverse);
            background-color: var(--plx-semantic-color-foreground-primary);
        }

        .plx-gridview-dxtable .dxgvPagerBottomPanel .dxpLite .dxp-disabledButton {
            background-color: var(--plx-semantic-color-background-disabled);
        }

/* #endregion */

/* #region DevExpress Tables LoadingPanel */

.plx-gridview-dxtable .plx-gridview-dxtable-loadingpanel {
    border: none;
    background-color: transparent;
    background-image: url(../Images/Pluxee/plx-loading-spinner-background.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 50px;
    height: 50px;
}

    .plx-gridview-dxtable .plx-gridview-dxtable-loadingpanel td.dx img {
        animation: loading-spinner-rotation 1s ease-in-out infinite;
    }

/* #endregion */

/* #region DevExpress Tables Popup */

.plx-gridview-dxtable-popup.dxpcLite {
    top: 70% !important;
    left: 30% !important;
}

    .plx-gridview-dxtable-popup.dxpcLite .dxpc-content {
        padding: 0;
    }

    .plx-gridview-dxtable-popup.dxpcLite .dxpc-header {
        background-color: #221c46 !important;
        height: 3rem !important;
        display: flex !important;
        align-items: center !important;
        color: white !important;
        font-family: "tt_travels_medium" !important;
        font-size: 0.875rem;
        padding: 0;
    }

    .plx-gridview-dxtable-popup.dxpcLite .dxeMemoSys td {
        padding: 0;
    }

    .plx-gridview-dxtable-popup.dxpcLite .dxeMemoEditArea.dxeMemoEditAreaSys {
        padding: 1rem;
        font-family: "tt_travels_bold";
        font-size: 0.875rem;
        line-height: 140%;
        color: var(--plx-semantic-color-text-primary);
        letter-spacing: -0.05em;
        box-sizing: border-box;
        height: 100% !important;
    }

/* #endregion */

/* #endregion DevExpress Tables */

/*Estilos para los SelectInput defs DevExpress Retribución Flexible Paso 3 y 4*/

/* #region FormSteps container classes */

@media (min-width: 2600px) {
    .columnxl-6 {
        flex: 0 0 auto;
        width: 70%;
    }
}

@media (min-width: 3400px) {
    .columnxl-6 {
        flex: 0 0 auto;
        width: 50%;
    }
}

/* #endregion FormSteps container classes */

/*input Seleccionar Empresa*/
#ctl00_body_cmbCliente_I {
    border: none !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: #221C46 !important;
    padding: 1rem !important;
}

.etiqueta-cliente {
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
}

.dxeListBoxItem {
    border-left: 3px solid white;
    border-right: 3px solid white;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    padding: 0.50rem;
    white-space: nowrap;
    text-align: left;
    color: #000;
}

.dxeListBoxItemSelected /* inherits dxeListBoxItem */ {
    color: #221C46 !important;
    background-color: #fff;
    font-family: 'tt_travels_demibold';
    font-size: 1rem;
}

.dxeListBoxItemHover /* inherits dxeListBoxItem */ {
    color: #fff;
    background-color: #221C46;
    font-family: 'tt_travels_demibold';
    font-size: 1rem;
}

.dxgvTable input[type="text"].dxeEditArea,
.dxgvTable input[type="password"].dxeEditArea {
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    padding: 0.1rem !important;
    color: #221C46 !important;
}

/* #region Pluxee Button Primary Button Base Classes */
/* Marcan los paddings del botón primario además de la posición de los iconos */

.primary-pluxee-button input,
.primary-pluxee-button a {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
}

.primary-pluxee-button a {
    text-align: center;
    text-decoration: none;
}

.primary-pluxee-button-no-icon {
    padding: 0.75rem 1.5rem;
}

.primary-pluxee-button-with-trail {
    padding: 0.75rem 3rem 0.75rem 1.5rem;
}

.primary-pluxee-button-with-lead {
    padding: 0.75rem 1.5rem 0.75rem 3rem;
}

.primary-pluxee-button-trail {
    right: 1rem;
}

.primary-pluxee-button-lead {
    left: 1rem;
}

/* #endregion */


/* #region Pluxee Button Secondary Button Base Classes */
/* Marcan los paddings del botón secundario además de la posición de los iconos */

.secondary-pluxee-button input,
.secondary-pluxee-button a {
    font-family: "tt_travels_bold";
    font-size: 0.975rem;
    font-style: normal;
    line-height: 145%;
    letter-spacing: -0.04375rem;
}

.secondary-pluxee-button a {
    text-align: center;
    text-decoration: none;
}

.secondary-pluxee-button-no-icon {
    padding: 0.5rem 1rem;
}

.secondary-pluxee-button-with-trail {
    padding: 0.5rem 2.75rem 0.5rem 1rem;
}

.secondary-pluxee-button-with-lead {
    padding: 0.5rem 1rem 0.5rem 2.75rem;
}

.secondary-pluxee-button-trail {
    right: 0.75rem;
}

.secondary-pluxee-button-lead {
    left: 0.75rem;
}

/* #endregion */


/* #region Pluxee Button Filled Primary */

.filled-primary-pluxee-button {
    border: 3px solid var(--plx-semantic-color-foreground-primary);
    background-color: var(--plx-semantic-color-cta-primary);
    position: relative;
}

    .filled-primary-pluxee-button path:not(.keep-icon-color) {
        fill: var(--plx-semantic-color-icon-primary);
    }

    .filled-primary-pluxee-button:hover {
        background-color: var(--plx-semantic-color-cta-primary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .filled-primary-pluxee-button:active {
        border: 3px solid var(--plx-semantic-color-cta-primary-pressed);
        background: var(--plx-semantic-color-cta-primary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
    }

        .filled-primary-pluxee-button:active input,
        .filled-primary-pluxee-button:active a {
            color: var(--plx-semantic-color-text-inverse);
        }

        .filled-primary-pluxee-button:active path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-inverse);
        }

    .filled-primary-pluxee-button:focus {
        background-color: var(--plx-semantic-color-cta-primary-hover);
    }

        .filled-primary-pluxee-button:focus::after {
            content: '';
            position: absolute;
            left: -6.75px;
            top: -6.75px;
            right: -6.75px;
            bottom: -6.75px;
        }

.filled-primary-pluxee-button-disabled {
    background-color: var(--plx-semantic-color-background-disabled);
    border: 3px solid var(--plx-semantic-color-border-disabled);
}

    .filled-primary-pluxee-button-disabled input,
    .filled-primary-pluxee-button-disabled a {
        color: var(--plx-semantic-color-text-disabled);
    }

    .filled-primary-pluxee-button-disabled path {
        fill: var(--plx-semantic-color-icon-disabled) !important;
    }

/* #endregion */


/* #region Pluxee Button Outlined Primary */

.outlined-primary-pluxee-button {
    border: 3px solid var(--plx-semantic-color-foreground-primary);
    position: relative;
}

    .outlined-primary-pluxee-button path:not(.keep-icon-color) {
        fill: var(--plx-semantic-color-icon-primary);
    }

    .outlined-primary-pluxee-button:hover {
        background-color: var(--plx-semantic-color-cta-primary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .outlined-primary-pluxee-button:active {
        border: 3px solid var(--plx-semantic-color-cta-primary-pressed);
        background: var(--plx-semantic-color-cta-primary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
    }

        .outlined-primary-pluxee-button:active input,
        .outlined-primary-pluxee-button:active a {
            color: var(--plx-semantic-color-text-inverse);
        }

        .outlined-primary-pluxee-button:active path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-inverse);
        }

    .outlined-primary-pluxee-button:focus {
        background-color: var(--plx-semantic-color-cta-primary-hover);
    }

        .outlined-primary-pluxee-button:focus::after {
            content: '';
            position: absolute;
            left: -6.75px;
            top: -6.75px;
            right: -6.75px;
            bottom: -6.75px;
            border: 3px solid var(--plx-semantic-color-outline-focus);
        }

.outlined-primary-pluxee-button-disabled {
    border: 3px solid var(--plx-semantic-color-border-disabled);
}

    .outlined-primary-pluxee-button-disabled input,
    .outlined-primary-pluxee-button-disabled a {
        color: var(--plx-semantic-color-text-disabled);
    }

    .outlined-primary-pluxee-button-disabled path {
        fill: var(--plx-semantic-color-icon-disabled) !important;
    }

/* #endregion */


/* #region Pluxee Button Filled Secondary */

.filled-secondary-pluxee-button {
    background-color: var(--plx-semantic-color-cta-secondary);
    position: relative;
    padding: 0.45rem;
}

    .filled-secondary-pluxee-button path:not(.keep-icon-color) {
        fill: var(--plx-semantic-color-icon-inverse);
    }

    .filled-secondary-pluxee-button input,
    .filled-secondary-pluxee-button a {
        text-wrap: wrap;
        color: var(--plx-semantic-color-icon-inverse);
    }

    .filled-secondary-pluxee-button:hover {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

        .filled-secondary-pluxee-button:hover path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-info);
        }

        .filled-secondary-pluxee-button:hover input,
        .filled-secondary-pluxee-button:hover a {
            color: var(--plx-semantic-color-text-link);
        }

    .filled-secondary-pluxee-button:active {
        background: var(--plx-semantic-color-cta-secondary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
    }

        .filled-secondary-pluxee-button:active input,
        .filled-secondary-pluxee-button:active a {
            color: var(--plx-semantic-color-text-inverse);
        }

        .filled-secondary-pluxee-button:active path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-inverse);
        }

    .filled-secondary-pluxee-button:focus {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
    }

        .filled-secondary-pluxee-button:focus path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-info);
        }

        .filled-secondary-pluxee-button:focus input,
        .filled-secondary-pluxee-button:focus a {
            color: var(--plx-semantic-color-text-link);
        }

        .filled-secondary-pluxee-button:focus::after {
            content: '';
            position: absolute;
            left: -6.75px;
            top: -6.75px;
            right: -6.75px;
            bottom: -6.75px;
        }

.filled-secondary-pluxee-button-disabled {
    background-color: var(--plx-semantic-color-background-disabled);
    border: 3px solid var(--plx-semantic-color-background-disabled);
}

    .filled-secondary-pluxee-button-disabled input,
    .filled-secondary-pluxee-button-disabled a {
        color: var(--plx-semantic-color-text-disabled);
    }

    .filled-secondary-pluxee-button-disabled path {
        fill: var(--plx-semantic-color-icon-disabled) !important;
    }

/* #endregion */


/* #region Pluxee Button Outlined Secondary */

.outlined-secondary-pluxee-button {
    border: 3px solid var(--plx-semantic-color-cta-secondary);
    position: relative;
    padding: 0.3rem;
}

    .outlined-secondary-pluxee-button path:not(.keep-icon-color) {
        fill: var(--plx-semantic-color-icon-info);
    }

    .outlined-secondary-pluxee-button input,
    .outlined-secondary-pluxee-button a {
        color: var(--plx-semantic-color-text-link);
    }

    .outlined-secondary-pluxee-button:hover {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .outlined-secondary-pluxee-button:active {
        border: 3px solid var(--plx-semantic-color-cta-secondary-pressed);
        background: var(--plx-semantic-color-cta-secondary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
    }

        .outlined-secondary-pluxee-button:active input,
        .outlined-secondary-pluxee-button:active a {
            color: var(--plx-semantic-color-text-inverse);
        }

        .outlined-secondary-pluxee-button:active path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-inverse);
        }

    .outlined-secondary-pluxee-button:focus {
        background-color: var(--plx-semantic-color-cta-secondary-hover);
    }

        .outlined-secondary-pluxee-button:focus path:not(.keep-icon-color) {
            fill: var(--plx-semantic-color-icon-icon);
        }

        .outlined-secondary-pluxee-button:focus input,
        .outlined-secondary-pluxee-button:focus a {
            color: var(--plx-semantic-color-text-link);
        }

        .outlined-secondary-pluxee-button:focus::after {
            content: '';
            position: absolute;
            left: -6.75px;
            top: -6.75px;
            right: -6.75px;
            bottom: -6.75px;
            border: 3px solid var(--plx-semantic-color-outline-focus);
        }

.outlined-secondary-pluxee-button-disabled {
    border: 3px solid var(--plx-semantic-color-border-disabled);
}

    .outlined-secondary-pluxee-button-disabled input,
    .outlined-secondary-pluxee-button-disabled a {
        color: var(--plx-semantic-color-text-disabled);
    }

    .outlined-secondary-pluxee-button-disabled path {
        fill: var(--plx-semantic-color-icon-disabled) !important;
    }

/* #endregion */

/* #region DevExpress CheckBox */

.plx-checkBox {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

    .plx-checkBox .dxichCellSys {
        padding: 0;
    }

        .plx-checkBox .dxichCellSys .dxichSys {
            margin: 0;
        }

            .plx-checkBox .dxichCellSys .dxichSys.dxICBFocused {
                background-color: transparent;
            }

    .plx-checkBox .plx-checkBox-label {
        font-family: 'tt_travels_demibold';
        font-size: medium;
        margin-left: 5px;
    }

/* #endregion */

/* #region DevExpress CheckBoxList */

.plx-checkBoxList.dxeCheckBoxList {
    border: none;
}

    .plx-checkBoxList.dxeCheckBoxList .dxichSys {
        cursor: pointer;
    }

        .plx-checkBoxList.dxeCheckBoxList .dxichSys.dxICBFocused {
            background-color: transparent;
        }

/* #endregion */

/* #region Responsive */

@media (max-width: 995px) {
    .botones-responsive {
        display: flex;
        flex-direction: column !important;
        align-items: center;
    }
}

@media (max-width: 1200px) {
    .botones-responsiveMax1200 {
        display: flex;
        flex-direction: column !important;
        align-items: center;
        width: 100%;
        grid-gap: 0.5rem;
    }
}

@media screen and (min-width: 700px) and (max-width: 1270px) {
    .botones-responsiveMax1270 {
        display: flex;
        flex-direction: column !important;
        width: 100%;
        grid-gap: 0.5rem;
    }

        .botones-responsiveMax1270 .col-lg-4 {
            width: 50% !important;
        }
}

@media (max-width: 1450px) {
    .botones-responsive1450 {
        display: flex;
        flex-direction: column !important;
        width: 100%;
        grid-gap: 0.5rem;
    }
}

@media (max-width: 1660px) {
    .botones-responsive990 {
        display: flex;
        flex-direction: column !important;
        align-items: center;
        width: 100%;
        grid-gap: 1rem;
    }
}

@media screen and (min-width: 992px) and (max-width: 1080px) {
    .botones-responsive992 {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

        .botones-responsive992 .col-12 {
            width: 100%;
        }
}


@media screen and (min-width: 1200px) and (max-width: 1400px) {
    .botones-responsive1200 {
        display: flex;
        flex-direction: column !important;
        align-items: center;
        width: 100%;
    }
}

/* #endregion */
/* #region Tarjetas - Resumen Pedido */
.info-resumen-pedido {
    font-size: 1rem;
    font-weight: 800;
    font-family: 'tt_travels_demibold';
    text-transform: uppercase;
    align-items: center;
    justify-content: center;
}

.bg-pluxee {
    background-color: #221C46;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.bg-pluxee-wh {
    background-color: #fff;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* #endregion */

/* #region Avisos */

.aviso-grande {
    color: #ff0000;
    font-family: "tt_travels_demibold";
    font-size: 1rem;
}

    .aviso-grande p {
        color: #ff0000;
        font-family: "tt_travels_demibold";
        font-size: 1rem;
        padding: 1rem;
    }

/* #endregion */

/* #region Estilos Paso 4 Realización pedidos */

.paso4-dxtable.plx-gridview-dxtable .dxgvTable {
    table-layout: auto !important;
}

    .paso4-dxtable.plx-gridview-dxtable .dxgvTable .dxgvHeader tr td:first-child,
    .paso4-dxtable.plx-gridview-dxtable .dxgvTable .dxgvHeader tr td:not(:last-child) {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .paso4-dxtable.plx-gridview-dxtable .dxgvTable .dxgvCommandColumn {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        grid-gap: 0.5rem;
        padding: 1rem !important;
    }

.paso4-dxtable.plx-gridview-dxtable .dxgvDataRowAlt td.dxgv {
    background-color: inherit;
}

.paso4-dxtable.plx-gridview-dxtable .dxgvLoadingPanel {
    border: none;
    background-color: transparent;
    background-image: url(../Images/Pluxee/plx-loading-spinner-background.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 50px;
    height: 50px;
}

    .paso4-dxtable.plx-gridview-dxtable .dxgvLoadingPanel td.dx img {
        animation: loading-spinner-rotation 1s ease-in-out infinite;
    }

/* #endregion */


/* #region Edit popup */
.paso4-editing-popup {
    width: 80% !important;
    height: 80% !important;
    position: fixed !important;
    left: 10% !important;
    top: 10% !important;
}

@media(max-width: 900px) {
}

.paso4-editing-popup .dxpc-mainDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem 1.5rem 1.5rem 1.5rem;
    grid-gap: 0.5rem;
    background-color: var(--plx-semantic-color-surface-1);
    text-align: center;
    border: none;
}

/* #region Header */

.paso4-editing-popup .dxpc-header {
    padding: 0 !important;
    border: none !important;
    background: none !important;
    cursor: unset !important;
}

.paso4-editing-popup .dxpc-closeButton {
    display: none;
}

.paso4-editing-popup .dxpc-headerText {
    font: 2rem / 125% "tt_travels_extrabold";
    letter-spacing: -0.1rem;
}

/* #endregion Header */

/* #region Body */

.paso4-editing-popup .dxpc-contentWrapper {
    height: auto !important;
}

.paso4-editing-popup .dxgvPopupEditForm {
    display: flex !important;
    flex-direction: column;
    grid-gap: 0.75rem;
    overflow: visible !important;
}

.paso4-editing-popup .dxflFormLayout_orderlayout {
    width: 100% !important;
    height: 45rem !important;
    overflow: auto;
}

    .paso4-editing-popup .dxflFormLayout_orderlayout table tr td {
        vertical-align: top;
    }

@media (max-height: 1100px) {
    .paso4-editing-popup .dxflFormLayout_orderlayout {
        height: 35rem !important;
    }
}

@media (max-height: 900px) {
    .paso4-editing-popup .dxflFormLayout_orderlayout {
        height: 25rem !important;
    }
}

@media (max-height: 750px) {
    .paso4-editing-popup .dxflFormLayout_orderlayout {
        height: 20rem !important;
    }
}

/* #region Inputs */

.paso4-editing-popup .dxflGroup_orderlayout {
    width: 100% !important;
    padding: 0.5rem !important;
}

.paso4-editing-popup .dxflGroupBox_orderlayout {
    display: flex;
    flex-direction: column;
    grid-gap: 0.25rem;
}

.paso4-editing-popup .dxflGroupCell_orderlayout.fixed-table > table,
.paso4-editing-popup .dxflGroupCell_orderlayout.fixed-table table.dxflGroupSys {
    table-layout: fixed;
}

.paso4-editing-popup .dxflItemSys {
    width: 100% !important;
}

.paso4-editing-popup .dxflCaptionCellSys {
    color: var(--plx-semantic-color-text-primary) !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 0.875rem !important;
    line-height: 145% !important;
    letter-spacing: -0.04375rem !important;
    width: inherit !important;
    display: flex;
    align-items: center;
    flex-direction: row;
    grid-gap: 0.25rem;
}

    .paso4-editing-popup .dxflCaptionCellSys .dxflRequired_orderlayout {
        font-style: normal !important;
        color: var(--plx-semantic-color-text-highlight);
    }

    .paso4-editing-popup .dxflCaptionCellSys .dxflCaption_orderlayout {
        line-height: inherit !important;
    }

.paso4-editing-popup .dxflNestedControlCellSys table /*:first-child*/ {
    width: 100% !important;
}

.paso4-editing-popup .dxeTextBox {
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
}

.paso4-editing-popup .dxeButtonEdit {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

    .paso4-editing-popup .dxic,
    .paso4-editing-popup .dxeButtonEdit td.dxic {
        padding: 0 !important;
        border: none !important;
        box-shadow: none !important;
    }

.paso4-editing-popup .dxeEditArea.dxeEditAreaSys {
    padding: 0.875rem !important;
    border: solid 1px var(--plx-semantic-color-border-secondary) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
    height: auto !important;
    width: 100% !important;
}

.plx-dxinput .paso4-editing-popup .dxeEditArea.dxeEditAreaSys {
    margin-bottom: 18px !important;
}

.paso4-editing-popup .dxeEditArea.dxeEditAreaSys:hover {
    background: var(--plx-semantic-color-cta-secondary-hover);
    border: 1px solid var(--plx-semantic-color-interactive-primary) !important;
    box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20) !important;
}

.paso4-editing-popup .dxeEditArea.dxeEditAreaSys:active, .paso4-editing-popup .dxeEditArea.dxeEditAreaSys:focus {
    background: var(--plx-semantic-color-surface-1) !important;
    border: 3px solid var(--plx-semantic-color-outline-focus) !important;
    padding: 0.75rem !important;
}

.paso4-editing-popup .dxeEditArea.dxeEditAreaSys:disabled {
    background: var(--plx-semantic-color-background-disabled) !important;
    border: 1px solid var(--plx-semantic-color-border-secondary) !important;
}

.paso4-editing-popup .dxeButtonEdit input.error {
    border: 1px solid var(--plx-semantic-color-border-error) !important;
    background: var(--plx-semantic-color-background-error) !important;
}

.paso4-editing-popup .dxeButtonEdit ~ .dxpc-ddSys {
    transform: translateY(-24px);
}

.paso4-editing-popup .dxeErrorFrame .dxeButtonEdit ~ .dxpc-ddSys {
    transform: translateY(0px)
}

.paso4-editing-popup .dxeButtonEditButton {
    background: transparent !important;
    box-shadow: none !important;
    position: relative !important;
}

    .paso4-editing-popup .dxeButtonEditButton img {
        position: absolute !important;
        right: 1rem !important;
    }

.plx-dxinput.plx-dxComboBox .paso4-editing-popup .dxeButtonEditButton img {
    bottom: 2.325rem !important;
}

.paso4-editing-popup .dxeErrorFrame .dxeButtonEditButton img {
    bottom: 1rem !important;
}

.paso4-editing-popup .dxeErrorFrame > tbody > tr {
    display: flex;
    flex-direction: column;
    grid-gap: 0.5rem;
}

.paso4-editing-popup .dxeErrorFrame .dxeEditArea.dxeEditAreaSys {
    border: 1px solid var(--plx-semantic-color-border-error) !important;
    background: var(--plx-semantic-color-background-error) !important;
    margin-bottom: 0 !important;
}

.paso4-editing-popup .dxeErrorFrame .dxeErrorCell {
    color: var(--plx-semantic-color-text-error) !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 0.75rem !important;
    line-height: 135% !important;
    letter-spacing: -0.0375rem !important;
}

/* #endregion Inputs */

/* #region Loading panel */

.paso4-editing-popup .dxcpLoadingPanelWithContent {
    border: none;
    background-color: transparent;
    background-image: url(../Images/Pluxee/plx-loading-spinner-background.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 50px;
    height: 50px;
}

    .paso4-editing-popup .dxcpLoadingPanelWithContent td.dx img,
    .paso4-editing-popup .dxeLoadingPanel td.dx img {
        animation: loading-spinner-rotation 1s ease-in-out infinite;
    }

/* #endregion Loading panel */

/* #endregion Body */

/* #region Footer */

/* #region Buttons */

.paso4-editing-popup .popup-button-container input:first-child {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    padding: 0.75rem 1.5rem;
    border: 3px solid var(--plx-semantic-color-foreground-primary);
    position: relative;
    background: none;
}

    .paso4-editing-popup .popup-button-container input:first-child:hover {
        background-color: var(--plx-semantic-color-cta-primary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .paso4-editing-popup .popup-button-container input:first-child:focus {
        background-color: var(--plx-semantic-color-cta-primary-hover);
    }

    .paso4-editing-popup .popup-button-container input:first-child::after {
        content: '';
        position: absolute;
        left: -6.75px;
        top: -6.75px;
        right: -6.75px;
        bottom: -6.75px;
        border: 3px solid var(--plx-semantic-color-outline-focus);
    }

    .paso4-editing-popup .popup-button-container input:first-child:active {
        background-color: var(--plx-semantic-color-cta-primary-pressed);
        border: 3px solid var(--plx-semantic-color-cta-primary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
        color: var(--plx-semantic-color-text-inverse);
    }

.paso4-editing-popup .popup-button-container input:last-child {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    padding: 0.75rem 1.5rem;
    border: 3px solid var(--plx-semantic-color-foreground-primary);
    position: relative;
    background-color: var(--plx-semantic-color-cta-primary);
}

    .paso4-editing-popup .popup-button-container input:last-child:hover {
        background-color: var(--plx-semantic-color-cta-primary-hover);
        box-shadow: 4px 4px 0px 0px rgba(34, 28, 70, 0.20);
    }

    .paso4-editing-popup .popup-button-container input:last-child:focus {
        background-color: var(--plx-semantic-color-cta-primary-hover);
    }

        .paso4-editing-popup .popup-button-container input:last-child:focus::after {
            content: '';
            position: absolute;
            left: -6.75px;
            top: -6.75px;
            right: -6.75px;
            bottom: -6.75px;
            border: 3px solid var(--plx-semantic-color-outline-focus);
        }

    .paso4-editing-popup .popup-button-container input:last-child:active {
        border: 3px solid var(--plx-semantic-color-cta-primary-pressed);
        background: var(--plx-semantic-color-cta-primary-pressed);
        box-shadow: 2px 2px 0px 0px rgba(34, 28, 70, 0.20);
        color: var(--plx-semantic-color-text-inverse);
    }

/* #endregion Buttons */

/* #region Errores */

.paso4-editing-popup .dxgvEditingErrorRow {
    color: var(--plx-semantic-color-text-error) !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 0.75rem !important;
    line-height: 135% !important;
    letter-spacing: -0.0375rem !important;
}

    .paso4-editing-popup .dxgvEditingErrorRow td.dxgv {
        border: none !important;
    }

/* #endregion */

/* #endregion Footer */

/* #endregion Edit popup */

/* #endregion Estilos Paso 4 Realización pedidos */

/* #region Estilos Paso 5 Pedidos */

.paso5-resumen,
.paso5-resumen .dxflGroup:not(.plx-logged-page-block),
.paso5-resumen .dxflGroup .dxflGroupCell,
.paso5-resumen .dxflGroup .dxflGroupCell .dxflGroupBox,
.paso5-resumen .dxflGroup .dxflGroupCell .dxflItem {
    padding: 0 !important;
}

    .paso5-resumen .dxflGroup .dxflGroupCell .dxflGroupBox {
        margin: 0 !important;
        border: none !important;
    }

    .paso5-resumen > table.dxflGroup {
        display: flex;
    }

        .paso5-resumen > table.dxflGroup > tbody {
            display: flex;
            flex-direction: column;
            grid-gap: 1.5rem;
            width: 100%;
        }

            .paso5-resumen > table.dxflGroup > tbody > tr {
                display: flex;
            }

                .paso5-resumen > table.dxflGroup > tbody > tr > td {
                    width: 100%;
                }

    .paso5-resumen table.paso5-tablas.plx-logged-page-block,
    .paso5-resumen table.paso5-tablas.plx-logged-page-block .dxflGroupBox table.dxflGroup {
        display: flex;
    }

        .paso5-resumen table.paso5-tablas.plx-logged-page-block > tbody,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block > tbody > tr,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block > tbody > tr > td,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block .dxflGroupBox,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block .dxflGroupBox table.dxflGroup > tbody,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block .dxflGroupBox table.dxflGroup > tbody > tr,
        .paso5-resumen table.paso5-tablas.plx-logged-page-block .dxflGroupBox table.dxflGroup > tbody > tr > td {
            display: flex;
            width: 100%;
        }

    .paso5-resumen .plx-gridview-dxtable .dxgvTable .dxgvFooter td.dxgv {
        text-align: center !important;
    }

    .paso5-resumen .paso5-texto-facturas .dxeTextBox {
        border: none !important;
        box-shadow: none !important;
        width: 100% !important;
    }

    .paso5-resumen .paso5-texto-facturas .dxic {
        padding: 0 !important;
        border: none !important;
        box-shadow: none !important;
    }

    .paso5-resumen .paso5-texto-facturas .dxeEditArea.dxeEditAreaSys {
        padding: 0.875rem !important;
        border: solid 1px var(--plx-semantic-color-border-secondary) !important;
        margin: 0 !important;
        margin-bottom: 24px !important;
        box-sizing: border-box !important;
        font-family: "tt_travels_demibold" !important;
        font-size: 1rem !important;
        line-height: 150% !important;
        letter-spacing: -0.05rem !important;
        color: var(--plx-semantic-color-text-primary) !important;
        height: auto !important;
        width: 100% !important;
    }

        .paso5-resumen .paso5-texto-facturas .dxeEditArea.dxeEditAreaSys:hover {
            background: var(--plx-semantic-color-cta-secondary-hover);
            border: 1px solid var(--plx-semantic-color-interactive-primary) !important;
            box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20) !important;
        }

        .paso5-resumen .paso5-texto-facturas .dxeEditArea.dxeEditAreaSys:active, .paso4-editing-popup .dxeEditArea.dxeEditAreaSys:focus {
            background: var(--plx-semantic-color-surface-1) !important;
            border: 3px solid var(--plx-semantic-color-outline-focus) !important;
            padding: 0.75rem !important;
        }

    .paso5-resumen .paso5-desgloseFinal tbody {
        display: flex;
        flex-direction: column;
    }

        .paso5-resumen .paso5-desgloseFinal tbody tr {
            display: flex;
            flex-direction: row;
            grid-gap: 0.5rem;
            justify-content: flex-end;
        }

    .paso5-resumen .paso5-desgloseFinal tr td div span {
        font-family: "tt_travels_demibold" !important;
        font-size: 0.875rem !important;
        letter-spacing: -0.0375rem !important;
        color: #221C46 !important;
    }

    .paso5-resumen .paso5-desgloseFinal tr td:last-child div span {
        color: var(--plx-semantic-color-text-link) !important;
    }

    .paso5-resumen .paso5-desgloseFinal .dxflGroup .dxflGroupCell .dxflItem.paso5-desgloseFinal-filaTotal-caption,
    .paso5-resumen .paso5-desgloseFinal .dxflGroup .dxflGroupCell .dxflItem.paso5-desgloseFinal-filaTotal-value {
        padding: 0.25rem 1rem !important;
        margin-top: 0.5rem;
        border: 1px solid var(--plx-semantic-color-foreground-primary);
    }

    .paso5-resumen .paso5-desgloseFinal .dxflGroup .dxflGroupCell .dxflItem.paso5-desgloseFinal-filaTotal-caption {
        background-color: var(--plx-semantic-color-foreground-primary);
    }

    .paso5-resumen .paso5-desgloseFinal tr td .dxflItem.paso5-desgloseFinal-filaTotal-caption span,
    .paso5-resumen .paso5-desgloseFinal tr td .dxflItem.paso5-desgloseFinal-filaTotal-value span {
        font-family: "tt_travels_bold" !important;
        font-size: 0.825rem !important;
        letter-spacing: -0.0375rem !important;
        color: #221C46 !important;
    }

    .paso5-resumen .paso5-desgloseFinal tr td .dxflItem.paso5-desgloseFinal-filaTotal-caption span {
        color: var(--plx-semantic-color-text-inverse) !important;
    }

/* #endregion Estilos Paso 5 Pedidos */


/* #region Area Clientes */
/* #region Inicio */

.clientes-inicio-mi-servicio {
    max-width: 27.5rem;
}

.clientes-inicio-accesos-rapidos {
    width: fit-content;
    min-width: 15.25rem;
}

.empleados-inicio-publicidad {
    width: fit-content;
    min-width: 15.25rem;
}

.icono-clientes {
    height: 2.5rem;
    width: 2.5rem;
}

.icono-clientes-small {
    height: 2rem;
    width: 2rem;
}

.icono-clientes-large {
    height: 3rem;
    width: 3rem;
}

.icono-clientes-xlarge {
    height: 3.5rem;
    width: 3.5rem;
}

.clientes-inicio-grid-banners-anuncio {
    grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr));
}

.clientes-inicio-banner-anuncio {
    width: 16.5rem;
    height: 100%; /* A probar */
    margin: auto;
}

.guarderia-servicios-bg-green {
    background-color: #c8ffde;
    padding: 0.5rem;
}

.clientes-servicios-bg-green {
    background-color: #C8FFDE;
    padding: 0.5rem;
}

@media (max-width: 1550px) {
    .clientes-servicios-bg-green {
        height: 5rem;
    }
}

.clientes-servicios-bg-yellow {
    background-color: #FDEEC1;
    padding: 0.5rem;
}

@media (max-width: 1550px) {
    .clientes-servicios-bg-yellow {
        height: 5rem;
    }
}

@media (max-width: 1350px) {
    .clientes-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr));
    }

    .clientes-inicio-banner-anuncio {
        width: 13.5rem;
    }
}

@media (max-width: 1200px) {
    .clientes-inicio-mi-servicio {
        max-width: 24.25rem;
    }

    .clientes-inicio-grid-mis-servicios {
        grid-template-columns: repeat(1, 1fr);
    }

    .clientes-inicio-accesos-rapidos {
        width: auto;
    }

    .clientes-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(11.75rem, 1fr));
    }

    .clientes-inicio-banner-anuncio {
        width: 11.75rem;
    }
}

@media (max-width: 1100px) {
    .clientes-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    }

    .clientes-inicio-banner-anuncio {
        width: 9.5rem;
    }
}

@media (max-width: 1000px) {
    .clientes-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .clientes-inicio-banner-anuncio {
        width: 100%;
    }
}

@media (max-width: 800px) {
    .clientes-inicio-mi-servicio {
        max-width: 19.125rem;
    }
}

/* #endregion */
/* #endregion Area Clientes */


/* #region Area Guarderia */
/* #region Inicio */

.guarderia-inicio-mi-servicio {
    max-width: 27.5rem;
}

.guarderia-inicio-accesos-rapidos {
    width: fit-content;
    min-width: 15.25rem;
}

.guarderia-inicio-grid-banners-anuncio {
    grid-template-columns: repeat(auto-fill, minmax(16.5rem, 1fr));
}

.guarderia-inicio-banner-anuncio {
    width: 16.5rem;
    height: 100%; /* A probar */
    margin: auto;
}

@media (max-width: 1350px) {
    .guarderia-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr));
    }

    .guarderia-inicio-banner-anuncio {
        width: 13.5rem;
    }
}

@media (max-width: 1200px) {
    .guarderia-inicio-mi-servicio {
        max-width: 24.25rem;
    }

    .guarderia-inicio-grid-mis-servicios {
        grid-template-columns: repeat(1, 1fr);
    }

    .guarderia-inicio-accesos-rapidos {
        width: auto;
    }

    .guarderia-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(11.75rem, 1fr));
    }

    .guarderia-inicio-banner-anuncio {
        width: 11.75rem;
    }
}

@media (max-width: 1100px) {
    .guarderia-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
    }

    .guarderia-inicio-banner-anuncio {
        width: 9.5rem;
    }
}

@media (max-width: 1000px) {
    .guarderia-inicio-grid-banners-anuncio {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .guarderia-inicio-banner-anuncio {
        width: 100%;
    }
}

@media (max-width: 800px) {
    .guarderia-inicio-mi-servicio {
        max-width: 19.125rem;
    }
}

/* #endregion */
/* #endregion Area Guarderia */

/* #region Select dx Classes */

.plx-dxinput .dxeButtonEdit,
.plx-dxinput.dxeButtonEdit {
    border: none !important;
}

    .plx-dxinput td.dxic,
    .plx-dxinput .dxeButtonEdit td.dxic {
        border: none;
        padding: 0 !important;
        margin: 0;
        box-shadow: none;
    }

.plx-dxinput .plx-dxSpinBox .dxeButtonEditButton.dxeSpinIncButton,
.plx-dxinput .plx-dxSpinBox .dxeButtonEditButton.dxeSpinDecButton,
.plx-dxinput.plx-dxSpinBox .dxeButtonEditButton.dxeSpinIncButton,
.plx-dxinput.plx-dxSpinBox .dxeButtonEditButton.dxeSpinDecButton {
    display: none;
}

.plx-dxinput .plx-dxComboBox .dxeButtonEditButton,
.plx-dxinput.plx-dxComboBox .dxeButtonEditButton {
    background: transparent !important;
    box-shadow: none !important;
    position: relative !important;
    padding: 0 !important;
}

    .plx-dxinput .plx-dxComboBox .dxeButtonEditButton img,
    .plx-dxinput.plx-dxComboBox .dxeButtonEditButton img {
        position: absolute !important;
        right: 1rem !important;
        bottom: 1.2rem !important;
    }

.plx-dxinput .dxeEditArea.dxeEditAreaSys,
.plx-dxinput input[type="text"].dxeEditArea,
.plx-dxinput input[type="password"].dxeEditArea {
    padding: 0.875rem !important;
    border: solid 1px var(--plx-semantic-color-border-secondary) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
    height: auto !important;
    width: 100% !important;
}

    .plx-dxinput .dxeEditArea.dxeEditAreaSys:hover {
        background: var(--plx-semantic-color-cta-secondary-hover);
        border: 1px solid var(--plx-semantic-color-interactive-primary) !important;
        box-shadow: 0px 0px 0px 2px rgba(34, 28, 70, 0.20) !important;
    }

    .plx-dxinput .dxeEditArea.dxeEditAreaSys:active, .plx-dxinput .dxeEditArea.dxeEditAreaSys:focus {
        background: var(--plx-semantic-color-surface-1) !important;
        border: 3px solid var(--plx-semantic-color-outline-focus) !important;
        padding: 0.75rem !important;
    }

    .plx-dxinput .dxeEditArea.dxeEditAreaSys:disabled {
        background: var(--plx-semantic-color-background-disabled) !important;
        border: 1px solid var(--plx-semantic-color-border-secondary) !important;
    }

.plx-dxinput .dxeTextBox,
.plx-dxinput.dxeTextBox {
    box-shadow: none;
    border: none;
}

.plx-dxinput .dxeButtonEdit .dxeEditAreaWithClearButton {
    padding-right: 2.75rem !important;
}

    .plx-dxinput .dxeButtonEdit .dxeEditAreaWithClearButton:active, .plx-dxinput .dxeButtonEdit .dxeEditAreaWithClearButton:focus {
        padding-right: 2.625rem !important;
    }

.plx-dxinput .dxeButtonEdit input.error {
    border: 1px solid var(--plx-semantic-color-border-error) !important;
    background: var(--plx-semantic-color-background-error) !important;
}

.plx-dxinput input[type="text"].dxeEditArea {
    font-family: "tt_travels_demibold";
    font-size: 1rem;
    line-height: 150%;
    letter-spacing: -0.05rem;
    color: var(--plx-semantic-color-text-primary);
    height: 16px;
    background: var(--plx-semantic-color-surface-1);
}

/*sub Tablas defs DevExpress*/
.dxgvControl, .dxgvDisabled {
    background-color: #221C46 !important;
}

.dxflRequired {
    color: var(--plx-semantic-color-text-highlight);
    font-style: normal;
}

/* #endregion */

/* #region Labels para Empleados (Contratos) */

.myLabelName {
    font-family: "tt_travels_demibold" !important;
    font-size: 1.1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
}

.myLabelName1rem {
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
}

.myLabelInfo {
    font-family: "tt_travels_regular" !important;
    font-size: 1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
}

.myLabelInfo-Medium {
    font-family: "tt_travels_regular" !important;
    font-size: 1.1rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
}

.myLabelSubInfo {
    font-family: "tt_travels_regular" !important;
    font-size: 0.8rem !important;
    line-height: 150% !important;
    letter-spacing: -0.05rem !important;
    color: var(--plx-semantic-color-text-primary) !important;
}

/* #endregion */

/* #region ASPxCallbackPanel Loading panel */

.plx-callbackLoading.dxcpLoadingPanelWithContent {
    border: none;
    background-color: transparent;
    background-image: url(../Images/Pluxee/plx-loading-spinner-background.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 50px;
    height: 50px;
}

    .plx-callbackLoading.dxcpLoadingPanelWithContent td.dx img {
        animation: loading-spinner-rotation 1s ease-in-out infinite;
    }

/* #endregion ASPxCallbackPanel Loading panel */

/* #region ASPxFormLayout LayoutGroup */

.dxflHeadingLineGroupBoxSys > .dxflGroupBoxCaption.large-demibold {
    font-family: "tt_travels_demibold" !important;
    font-size: 1rem;
    letter-spacing: -0.05rem;
}

.dxflHeadingLineGroupBoxSys > .dxflGroupBoxCaption {
    background-color: #FFFFFF;
}
/* #endregion ASPxFormLayout LayoutGroup */


/* #region Tablas - Estados con Colores */

.estado-iniciar-renovacion {
    display: grid;
    text-align: center;
    background-color: #00EB5E;
    color: #221C46;
    font-family: "tt_travels_demibold";
    padding: 0.5rem;
    margin: 1.2rem;
    font-size: 0.75rem;
}

.estado-renovacion-no-disponible {
    display: grid;
    text-align: center;
    background-color: #FF7375;
    color: #221C46;
    font-family: "tt_travels_demibold";
    padding: 0.5rem;
    margin: 1.2rem;
    font-size: 0.75rem;
}

.estado-renovacion-automatica {
    display: grid;
    background-color: #FFDC37;
    color: #221C46;
    font-family: "tt_travels_demibold";
    padding: 0.5rem;
    margin: 1.2rem;
    font-size: 0.75rem;
}

.estado-renovacion-resto {
    background-color: white;
    color: #221C46;
    font-family: "tt_travels_demibold";
    padding: 0;
    margin: 1rem;
    font-size: 0.75rem;
}

/* #endregion Tablas - Estados con Colores */


/* #region PluxeeConnect */
/*Pluxee Connect --> PC*/
.plx-unlogged-page-left-column-PC {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 1.5rem 5.8125rem 3rem 5.75rem;
}

.plx-unlogged-page-title-PC {
    color: var(--plx-semantic-color-text-primary);
    font-family: "tt_travels_black";
    font-size: 2rem;
    font-weight: 800;
    line-height: 125%;
    letter-spacing: -0.05em;
}

@media (max-width: 1300px),(max-height:800px) and (min-height:650px) {
    .plx-unlogged-page-title-PC {
        font-size: 2rem;
    }
}

@media (max-height: 650px) {
    .plx-unlogged-page-title-PC {
        font-size: 2rem;
    }
}

.plx-logged-page-subtitle-PC {
    font-family: 'TT Travels';
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 125%;
    letter-spacing: -0.05em;
    color: #5a5469;
    margin-bottom: 1rem; /* Espacio entre el título y la información */
}

.css-d4v9pi {
    font-size: 1rem;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
    color: #221C46;
}

.css-5zij4r {
    font-family: "tt_travels_bold";
    font-size: 1rem;
    font-weight: 800;
    line-height: 150%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
    color: #221C46;
}

.link-btn {
    font-size: 12px;
    font-weight: 600;
    line-height: 135%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
    color: #b30000;
}

/*Estilos para el input de código enviado por Email*/
.code-container {
    display: flex;
    align-items: center;
}

.code {
    border-radius: 3px;
    border: 1px solid #221C46;
    margin: 1.5%;
    width: 3.5rem;
    height: 4.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.05em;
    text-align: center;
    -moz-appearance: textfield;
}

    .code:hover, .code[data-hover] {
        border-width: 1px;
        border-style: solid;
        border-image: initial;
        border-color: rgb(27, 81, 220) !important;
    }

    .code:valid {
        border-color: #3498db;
        box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.25);
    }

    .code::-webkit-outer-spin-button,
    .code::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

@media screen and (max-width: 600px) {
    .code-container {
        flex-wrap: wrap;
    }

    .code {
        font-size: 60px;
        height: 80px;
        max-width: 70px;
    }
}

.custom-timer {
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 145%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
    color: #221C46;
}

@media screen and (max-width: 1199px) {
    .timer-container .col-xl-8,
    .timer-container .col-xl-4 {
        width: 100% !important;
        align-items: center;
        margin-left: auto;
        margin-right: auto;
    }
}

.custom-alert-ok {
    width: 100%;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: #d7fcea;
    color: #221C46;
    border-color: #01d253;
    border-width: 1px;
    border-style: solid;
    border-radius: 0px !important;
    box-shadow: 3px 3px 0px 0px rgba(34, 28, 70, 0.20);
}

.custom-alert-error {
    width: 100%;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: #ffcccc;
    color: #221C46;
    border-color: #ffcccc;
    border-width: 1px;
    border-style: solid;
    border-radius: 0px !important;
    box-shadow: 3px 3px 0px 0px rgba(34, 28, 70, 0.20);
}

.custom-alert img {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.alert-content {
    display: flex;
    flex-direction: column;
}

.alert-header {
    display: flex;
    align-items: center;
}

.custom-alert-ok img, .custom-alert-error img {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.btn-close {
    margin-left: auto;
}

.alert-msg {
    font-family: "tt_travels_bold" !important;
    font-size: 1rem;
    font-weight: 800;
    line-height: 150%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
}

.alert-msg-small {
    font-family: "tt_travels_regular" !important;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 145%;
    letter-spacing: -0.05em;
    text-decoration: none;
    text-transform: none;
    margin-left: 35px;
}

.link-btn {
    font-family: "tt_travels_regular";
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 145%;
    letter-spacing: -0.05em;
    border: none !important;
    background-color: transparent !important;
    color: #0a58ca;
    text-decoration: underline;
}

/* #endregion PluxeeConnect */

