/* Variables */
   /*Colors*/
   :root {
      /* Fonts */
      --body-font: 'Alata', sans-serif;
      /*Colors*/

      --primary-color: #5C9BD4;
      --primary-color-hover: #153352;
      --background-grey: #f5f5f5;
      --success-color: #43D385;
      --error-color: #FF5353;
      --pseudo-black: #333;
      --black: #000;
      --white: #FFF;
      --grey:#ADADAD;
      --text-chat:#787878;
      --swiper-navigation-color: var(--primary-color);
      --swiper-pagination-color:  var(--primary-color);

      /* SIZES */
      --swiper-navigation-size: 24px;


   }


   
:root {
    --app-height: 100%;
}

   /* GLOBALES */

   .page__content h1,.list, .page__content h2,.page__content h3,.page__content h4,.page__content h5, .container, .container-fluid, #barrasuperior, .menu-oculto *, .button, input, select {
      font-family: var(--body-font) !important;
   }

   .button {
      white-space:initial;
      overflow: auto;
   }

   /* CONTENEDOR APP FONDO AZUL SOBRE CARD BLANCA */

   .wrapper-color-primary .page, .wrapper-color-primary .page__content, .wrapper-color-primary .page--material, .wrapper-color-primary .page--material__content, #contenido-app.entorno .page .page__background {

      background: linear-gradient(103deg, var(--primary-color-hover) 60%, var(--primary-color) 60.5%) !important;
   }

   @media(min-width:768px) {
      .wrapper-color-primary .page, .wrapper-color-primary .page__content, .wrapper-color-primary .page--material, .wrapper-color-primary .page--material__content, #contenido-app.entorno .page .page__background {
         background: linear-gradient(118deg, var(--primary-color-hover) 60%, var(--primary-color) 60.1%) !important;
      }

   }

   .special-container-wrapper-color-primary {
      padding:25px 20px;
      margin:0px 10px;
      background:var(--white);
      border-radius:10px;
      position:relative;
      overflow:hidden;

   }

   .special-container-wrapper-color-primary:last-child {
      margin-bottom: 100px
   }

   .special-container-wrapper-color-primary.no-first:last-child {
      margin-bottom:100px !important;
   }

   @media(min-width:768px) {
      .special-container-wrapper-color-primary {
         max-width:900px;
         margin:0 auto;

      }
   }

   .wrapper-color-primary .container-navigation {
      padding:20px 25px;
   }

   .button--material {
      font-family: var(--body-font) !important;
   }
   #contenido-app.entorno {
      top:60px;
      /* bottom:65px; */
      z-index:0;
      background-color:var(--background-grey);
   }


   #contenido-app {
      width:100%;
   }
/*    #contenido-app.entorno .page .page__background {
      background:var(--background-grey);
   } */

   #contenido-app .page .page__background {
      background:var(--white);
   }

   #contenido-app .page .page__content {
      font-family: var(--body-font) !important;
   }

@media(min-width:768px) {
   .container {
      padding:25px 25px 0px 25px;
      max-width:900px;
      margin:0 auto;
   }
   .container-last {
      padding:25px;
      max-width:900px;
      margin:0 auto;
      display:flex;
      flex-direction:column;
      justify-content:center;
   }
}

.slideout-overlay {
   z-index: 4;
   position: fixed;
   width: 100%;
   height: 100%;
   height: 100vh;
   min-height: 100%;
   top: 60px;
   right: 0;
   bottom: 0;
   left: 0;
   background-color: rgba(0,0,0,.4);
   visibility: hidden;
   opacity: 0;
   cursor: pointer;
   transition: visibility 0.5s ease,opacity 0.5s ease;
}


/* Structure */

.container {
   padding:25px 25px 0px 25px;
}

.container-last {
   padding:25px;
}

.centerf {
   text-align:center;
}

@media(min-width:768px) {
   .boxed-desktop {
     width:650px;
      margin:0 auto;
   }
}

@media(min-width:768px) {
   .center_flex_content {
      display:flex;
      flex-direction:column;
      justify-content:center;
      height:100vh;
   }
}


/* UTILS */

.box-shadow-cards-1 {
   box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

.text-light-grey {
   color:var(--grey);
   font-size:14px;
   font-weight:300;
}

.relative {
   position:relative;
}

/* FORMS */

.select-custom {
   padding:5px 20px;
   border-radius:10px;
}

.select-custom select {
   color:var(--pseudo-black);
   font-size:14px;

}


.select.background-select {
   background:var(--background-grey);
}

.custom-input {
   padding:5px 20px;
   background:var(--background-grey);

   font-size: 14px;
   border: none;
   border-radius: 10px;
   background: var(--background-grey);
   padding: 10px 20px;
   line-height: 20px;
   resize: none;  
   
}


.full-width-input {
   width:100%;
   box-sizing:border-box;
}


.mensaje-accion-ok {
   background: #c9ffd0;
    text-align: center;
    margin: 9px 0px;
    padding: 7px;
    display: none;
}
.mensaje-accion-ko {
   background: #fdc5c5;
}

/* SPINNER */

.lds-dual-ring {
   display: inline-block;
   position:absolute;
   background:#00000085;
   width: 100vw;
   z-index:99;
   top:0px;
   bottom:0px;
 }
 .lds-dual-ring:after {
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   margin: auto;
   content: " ";
   display: block;
   width: 64px;
   height: 64px;
   border-radius: 50%;
   border: 6px solid #fff;
   border-color: #fff transparent #fff transparent;
   animation: lds-dual-ring 1.2s linear infinite;
 }
 @keyframes lds-dual-ring {
   0% {
     transform: rotate(0deg);
   }
   100% {
     transform: rotate(360deg);
   }
 }

.center {text-align: center;}
.img-validation {max-width: 100px;}
ons-button a {text-decoration: none; color:inherit;}
ons-button a:hover { color:inherit;}
.green { color:green; }
.red { color:red; }



.container-with-title .title-item h2 {
   text-align:center;
   margin:0;
   font-size:20px;
   font-weight:700;
   color:var(--primary-color-hover);
   /* border-bottom:1px solid var(--primary-color-hover); */
   margin-bottom:20px;
}


.contenedor-botones {
   display:flex;
   gap:1rem;
   justify-content:space-between;
}

.contenedor-botones .boton {
   overflow:initial;
   text-align:center;
   background-color:var(--primary-color-hover);
   width:200px;
   color:var(--white);
   border-radius:10px;
   align-self:center;
   position:relative;
   display:flex;
   flex-direction:column;
   gap:1rem;
   padding:10px 0px;
   cursor:pointer;
}

@media(min-width:768px) {
   .contenedor-botones .boton {
      width:100%;
   }
}

.contenedor-botones .boton .add-wrapper {
   position:absolute;
   transform: translate(-50%, -50%);
   top:0;
   left:50%;
   font-size:20px;
   width:44px;
   height:44px;
   background:var(--primary-color-hover);
   border-radius:50%;
}

.contenedor-botones .boton .add-wrapper i {
   transform: translate(0px, 5px);
}

.contenedor-botones .boton .icon-wrapper {
   font-size:35px;
}

.contenedor-botones .boton .text-wrapper {
   font-size:16px;
   font-weight:500;
}

.contenedor-botones .boton .text-wrapper p {
   margin:0;
   text-transform:initial;
   line-height:1;
}

.contenedor-avisos {
   background:#f9f9f9;
   padding:20px;
   border-radius:10px;
   min-height:75px;
}


/* TAKEIT ACTIVOS */

@media(min-width:768px) {
   .contenedor-takeit-activos .list-elements {
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:1rem;
   }
   .contenedor-takeit-activos .list-elements.columnauno {
      gap:1rem;
      grid-template-columns: 1fr;
   }   
}

.matches-iconos {
   display: flex;
   gap: 14px;
   min-width: 118px;
}

.contenedor-takeit-activos .list-elements .element {
   overflow:initial;
   background-color:var(--white);
   padding:0;
   border-radius:10px;
   margin-bottom:20px;
   cursor:pointer;
}

@media(min-width:768px) {
   .contenedor-takeit-activos .list-elements .element {
      margin-bottom:0;
   }
}

.contenedor-takeit-activos .list-elements .element:last-child {
   margin-bottom:0;
}


.contenedor-takeit-activos .list-elements .element-wrapper {
   margin:0;
   padding:25px 10px 10px 10px;
   background: #f9f9f9;
}

.contenedor-takeit-activos .list-elements .element-wrapper .icon-tip.no-avisos {
   border: 1px solid var(--primary-color-hover);
}

.contenedor-takeit-activos .list-elements .element-wrapper .icon-tip.no-avisos i {
   color:var(--primary-color-hover);
}


.contenedor-takeit-activos .badge-takeit-active {
   position:absolute;
   left:10px;
   top:-10px;
}
.contenedor-takeit-activos .badge-takeit-active.right {
   right:10px;
   left: inherit;
}

.contenedor-takeit-activos .badge-takeit-active p {
   border-radius:5px;
   margin:0;
   padding:5px 25px;
   background-color:var(--primary-color);
   line-height:1;
   font-size:14px;
   text-transform:initial;
}

/* CONTENEDOR RESUMEN HOME */

.tu-resumen {
   margin-bottom:40px;
}

.contenedor-resumen .contenedor-wrapper {
   display:flex;
   justify-content:center;
   gap:1rem;
}

.contenedor-resumen .contenedor-wrapper .element {
   background:var(--white);
   padding:15px 10px;
   border-radius:10px;
   width:50%;
   background:#f9f9f9;
}

.contenedor-resumen .contenedor-wrapper .element.contenedor-ahorrados {
   width:70%;
}

.contenedor-resumen .contenedor-wrapper p {
   margin:0;
}

.contenedor-resumen .contenedor-wrapper p.number {
   font-size:32px;
   color:var(--primary-color);
   text-align:center;
}

.contenedor-resumen .contenedor-wrapper p.text {
   font-size:12px;
   line-height:2;
   text-align:center;
}

.contenedor-resumen .contenedor-wrapper .items {
   display:flex;
   flex-direction:column;
   gap:0;
}
@media(min-width:768px) {
   .contenedor-resumen .contenedor-wrapper .items {
      align-items:center;
   }
}

.contenedor-resumen .contenedor-wrapper .contenedor-resumen-viajes-paquetes {
   display:flex;
   gap:1rem;
   justify-content:center;
}

.contenedor-resumen .contenedor-wrapper .contenedor-resumen-viajes-paquetes .items {
   width:50%;
   align-items:center;
}

.contenedor-resumen .contenedor-wrapper .contenedor-resumen-viajes-paquetes .divider {
   border:1px solid var(--primary-color-hover);
}


.custom-input.with-label {
   display: flex;
}

.custom-input.with-label input {
   text-align: right;
   padding-right: 10px;
 }
.custom-input.with-label:after {
   content: attr(data-label);
   margin-top: 5px;
   color: #bdbdbd;
   font-size: 0.9em;
   flex-shrink: 0;
}


.imagen-bienvenida {
   max-width:50%; 
}

.centrado {
   text-align: center;;
}


input { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;}
.img-user {    
   width: 75px;
   height: 75px;
   padding: 0px;
   border-radius: 53%;
   background: #123451;
   text-align: center;
   font-size: 26px;
   line-height: 68px;
}

.cont-match .img-user{
   line-height: 44px;
   width: 50px;
   height: 50px;

}
.no-image i{
   color:white;
}

#barrainferior .footer-login-wrapper-entorno .item{
   overflow: unset;
}

#barrainferior .footer-login-wrapper-entorno .notification-circle {
   position:absolute;
   background:var(--error-color);
   width:18px;
   height:18px;
   border-radius:50%;
   line-height:1;
   font-size:12px;
   color:var(--white);
   right: -5px;
   top: -5px;
}

#barrainferior .footer-login-wrapper-entorno  .notification-circle span {
   /*transform: translate(6px, 2px);*/
   display: block;
   width:18px;
   height:18px;
   overflow: hidden;
   text-align: center;
   line-height: 18px;
}
.footer-login {
    width: 100%;
    background:#F5F5F5;
    position:fixed;
    bottom:0;
}

.footer-login .menu-footer {
   display:flex;
   gap:1rem;
   justify-content:center;
   list-style:none;
   padding:15px 0px;
   margin:0;
   color:var(--grey);
   font-weight:300;
}

.form-login {
   width:100%;
   margin-top:-25px;
}

.form-login .item-container {
   margin:20px 5px;
}

.form-login .item-container i {
   position:absolute;
   top:50%;
   right:10px;
  transform: translate(-50%,-50%);
  color:var(--grey);
  cursor:pointer;
}


.form-login .item-input {
   width:100%;
   position:relative;
}


.form-login .item-container .item-input input {
   border:2px solid var(--grey);
   height:45px;
   border-radius:5px;
   padding-left:25px;
   background-image:none;
   opacity:0.7;
   font-weight:400;
   color:var(--grey);
}

.form-login .item-container .item-input span {
color:var(--grey);
font-weight:300;
top:12px;
font-size:14px;
left:25px;

}

.form-login .item-container .item-input span.text-input--material__label--active {
   transform:translate(0,-93%) scale(.85);
   background:var(--white);
}

.form-login .login-button {
   background:var(--primary-color);
   padding:3px 0px;
   text-transform:initial;
   font-size:16px;
   font-weight:400;
   margin-top:25px;
   transition:all 0.2s linear;
   cursor:pointer;
}

#resultado-login {
   padding:5px;
   text-align:center;
   background-color:var(--error-color);
   color:var(--white);
   border-radius:5px;
   font-size:14px;
}

.hide {
   display:none;
}

.link_lost_password {
text-align:center;

}

.link_lost_password a {
   display:block;
   text-decoration:none;
   margin:1.5em 0;
   color:var(--primary-color);
   font-size:14px;
}

.divider_login {
   width:100%;
   height:1px;
   background:var(--grey);
   opacity:0.7;
   margin-bottom:1.5em;
   position:relative;
}

.divider_login:after {
   content:"O";
   color:var(--grey);
   opacity:1;
   background:var(--white);
   padding:0px 10px;
   position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.button_registrarse_wrapper {
   padding-bottom:50px;
}

.button_registrarse_wrapper .register-button {
   background: var(--primary-color-hover);
   padding: 3px 0px;
   text-transform: initial;
   font-size: 16px;
   font-weight: 400;
   margin-bottom:1.5em;
   cursor:pointer;
}




.header-login {
   text-align:center;
}

@media(min-width:768px) {
   .header-login {
      max-width:1280px;
      margin:0 auto;
   }
}

.header-login .logo-img {
   width:80%;
   margin:0 auto;
}
.header-login .logo-img img {
width:100%;
}

@media(min-width:768px) {
   .header-login .logo-img img {
      width:40%;
      }
}

.header-login h1 {
   font-weight:400;
   color:var(--primary-color-hover);
   font-size:24px;
}


<?php
	//Este fichero genera CSS que puedan estar condicionados a valores de la BBDD.
	require_once(__DIR__ . "/../inc/core.php");
	header("Content-type: text/css");

?>

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

 html {
   line-height: 1.15; /* 1 */
   -webkit-text-size-adjust: 100%; /* 2 */
 }

 /* Sections
    ========================================================================== */

 /**
  * Remove the margin in all browsers.
  */

 body {
   margin: 0;
 }

 /**
  * Render the `main` element consistently in IE.
  */

 main {
   display: block;
 }

 /**
  * Correct the font size and margin on `h1` elements within `section` and
  * `article` contexts in Chrome, Firefox, and Safari.
  */

 h1 {
   font-size: 2em;
   margin: 0.67em 0;
 }

 /* Grouping content
    ========================================================================== */

 /**
  * 1. Add the correct box sizing in Firefox.
  * 2. Show the overflow in Edge and IE.
  */

 hr {
   box-sizing: content-box; /* 1 */
   height: 0; /* 1 */
   overflow: visible; /* 2 */
 }

 /**
  * 1. Correct the inheritance and scaling of font size in all browsers.
  * 2. Correct the odd `em` font sizing in all browsers.
  */

 pre {
   font-family: monospace, monospace; /* 1 */
   font-size: 1em; /* 2 */
 }

 /* Text-level semantics
    ========================================================================== */

 /**
  * Remove the gray background on active links in IE 10.
  */

 a {
   background-color: transparent;
 }

 /**
  * 1. Remove the bottom border in Chrome 57-
  * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
  */

 abbr[title] {
   border-bottom: none; /* 1 */
   text-decoration: underline; /* 2 */
   text-decoration: underline dotted; /* 2 */
 }

 /**
  * Add the correct font weight in Chrome, Edge, and Safari.
  */

 b,
 strong {
   font-weight: bolder;
 }

 /**
  * 1. Correct the inheritance and scaling of font size in all browsers.
  * 2. Correct the odd `em` font sizing in all browsers.
  */

 code,
 kbd,
 samp {
   font-family: monospace, monospace; /* 1 */
   font-size: 1em; /* 2 */
 }

 /**
  * Add the correct font size in all browsers.
  */

 small {
   font-size: 80%;
 }

 /**
  * Prevent `sub` and `sup` elements from affecting the line height in
  * all browsers.
  */

 sub,
 sup {
   font-size: 75%;
   line-height: 0;
   position: relative;
   vertical-align: baseline;
 }

 sub {
   bottom: -0.25em;
 }

 sup {
   top: -0.5em;
 }

 /* Embedded content
    ========================================================================== */

 /**
  * Remove the border on images inside links in IE 10.
  */

 img {
   border-style: none;
 }

 /* Forms
    ========================================================================== */

 /**
  * 1. Change the font styles in all browsers.
  * 2. Remove the margin in Firefox and Safari.
  */

 button,
 input,
 optgroup,
 select,
 textarea {
   font-family: inherit; /* 1 */
   font-size: 100%; /* 1 */
   line-height: 1.15; /* 1 */
   margin: 0; /* 2 */
 }

 /**
  * Show the overflow in IE.
  * 1. Show the overflow in Edge.
  */

 button,
 input { /* 1 */
   overflow: visible;
 }

 /**
  * Remove the inheritance of text transform in Edge, Firefox, and IE.
  * 1. Remove the inheritance of text transform in Firefox.
  */

 button,
 select { /* 1 */
   text-transform: none;
 }

 /**
  * Correct the inability to style clickable types in iOS and Safari.
  */

 button,
 [type="button"],
 [type="reset"],
 [type="submit"] {
   -webkit-appearance: button;
 }

 /**
  * Remove the inner border and padding in Firefox.
  */

 button::-moz-focus-inner,
 [type="button"]::-moz-focus-inner,
 [type="reset"]::-moz-focus-inner,
 [type="submit"]::-moz-focus-inner {
   border-style: none;
   padding: 0;
 }

 /**
  * Restore the focus styles unset by the previous rule.
  */

 button:-moz-focusring,
 [type="button"]:-moz-focusring,
 [type="reset"]:-moz-focusring,
 [type="submit"]:-moz-focusring {
   outline: 1px dotted ButtonText;
 }

 /**
  * Correct the padding in Firefox.
  */

 fieldset {
   padding: 0.35em 0.75em 0.625em;
 }

 /**
  * 1. Correct the text wrapping in Edge and IE.
  * 2. Correct the color inheritance from `fieldset` elements in IE.
  * 3. Remove the padding so developers are not caught out when they zero out
  *    `fieldset` elements in all browsers.
  */

 legend {
   box-sizing: border-box; /* 1 */
   color: inherit; /* 2 */
   display: table; /* 1 */
   max-width: 100%; /* 1 */
   padding: 0; /* 3 */
   white-space: normal; /* 1 */
 }

 /**
  * Add the correct vertical alignment in Chrome, Firefox, and Opera.
  */

 progress {
   vertical-align: baseline;
 }

 /**
  * Remove the default vertical scrollbar in IE 10+.
  */

 textarea {
   overflow: auto;
 }

 /**
  * 1. Add the correct box sizing in IE 10.
  * 2. Remove the padding in IE 10.
  */

 [type="checkbox"],
 [type="radio"] {
   box-sizing: border-box; /* 1 */
   padding: 0; /* 2 */
 }

 /**
  * Correct the cursor style of increment and decrement buttons in Chrome.
  */

 [type="number"]::-webkit-inner-spin-button,
 [type="number"]::-webkit-outer-spin-button {
   height: auto;
 }

 /**
  * 1. Correct the odd appearance in Chrome and Safari.
  * 2. Correct the outline style in Safari.
  */

 [type="search"] {
   -webkit-appearance: textfield; /* 1 */
   outline-offset: -2px; /* 2 */
 }

 /**
  * Remove the inner padding in Chrome and Safari on macOS.
  */

 [type="search"]::-webkit-search-decoration {
   -webkit-appearance: none;
 }

 /**
  * 1. Correct the inability to style clickable types in iOS and Safari.
  * 2. Change font properties to `inherit` in Safari.
  */

 ::-webkit-file-upload-button {
   -webkit-appearance: button; /* 1 */
   font: inherit; /* 2 */
 }

 /* Interactive
    ========================================================================== */

 /*
  * Add the correct display in Edge, IE 10+, and Firefox.
  */

 details {
   display: block;
 }

 /*
  * Add the correct display in all browsers.
  */

 summary {
   display: list-item;
 }

 /* Misc
    ========================================================================== */

 /**
  * Add the correct display in IE 10+.
  */

 template {
   display: none;
 }

 /**
  * Add the correct display in IE 10.
  */

 [hidden] {
   display: none;
 }

.btn-install {line-height: 20px; height: auto;     margin-left: 2rem;}

#page-home .container {
   padding:20px 25px;
}

#page-home .tu-resumen {
   margin:0;
}

#js{
	display: none;
}

#page-home .lista-avisos .contenedor-avisos{
	display: flex;
    align-items: center;
    gap: 1rem;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    cursor:pointer;
}

#page-home .lista-avisos{
	/*display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;*/
    border-radius:10px;
}

#page-home .lista-avisos .boton-mensajes{
	    color: var(--text-color);
    background: none;
    display: block;
    margin: 0px auto;
    text-align: center;
   padding:0;
    min-width: 300px;
}

#page-home .lista-avisos .boton-mensajes .contenedor-avisos i{
	margin: 0px 5px;
}

#page-home .lista-avisos .boton-mensajes .contenedor-avisos p{
	margin: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
}

#page-home .lista-avisos .contenedor-avisos{
   display:flex;
   align-items:center;
   gap:1rem;
   min-height:initial;
}

#page-home .lista-avisos .contenedor-avisos i {
   font-size:26px;
   color:var(--primary-color-hover);
}

#page-home .lista-avisos .contenedor-avisos span {
   color:var(--primary-color);
   font-weight:600;
}

#page-home .lista-avisos .contenedor-avisos p {
   margin:0;
}


.margin-bottom-element {
   margin-bottom:40px;
}



.matches-iconos-mio {}
.matches-iconos-otro {}

@media (max-width: 768px) {
   .cont-match {
      justify-content: space-between;
      flex-direction: row;
      flex-wrap: wrap;
   }

}

.menu-container {
   padding:10px 20px;
   display:flex;
   justify-content:space-between;
   align-items:center;
   background:var(--white);
}

.menu-container .logo img {
   width:auto;
   height:30px;
   transform:scale(1.2);
}

.menu-oculto {
   position:absolute;
   top:60px;
   z-index:9;
   height:100%;
}

.menu-oculto .list {
   background:var(--primary-color);
   height:100%;
   width:250px;
   box-shadow: rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px;

}

.no-visible {
   left:-350px;
}

#menu-wrapper {
  display:none;
}

@media(min-width:768px) {
  #menu-wrapper {
    display:none;
  }
}

.button_hamburguer  label{
   display:flex;
    flex-direction:column;
    width:40px;
    transform: scaleX(-1);
  }

  .button_hamburguer  label span{
    background: var(--primary-color-hover);
    border-radius:10px;
    height:5px;
    margin: 4px 0;
    transition: .4s  cubic-bezier(0.68, -0.6, 0.32, 1.6);

  }


  .button_hamburguer  span:nth-of-type(1){
    width:100%;

  }

  .button_hamburguer  span:nth-of-type(2){
    width:90%;
  }


  .button_hamburguer  span:nth-of-type(3){
    width:80%;

  }


  .button_hamburguer  input[type="checkbox"]{
    display:none;
  }


  .button_hamburguer  input[type="checkbox"]:checked ~ span:nth-of-type(1){
    transform-origin:bottom;
    transform:rotatez(45deg) translate(6px,1px);
    width:50%;
  }


  .button_hamburguer  input[type="checkbox"]:checked ~ span:nth-of-type(2){

    transform-origin:top;
    transform:rotatez(-45deg);
    width:100%;
  }


   .button_hamburguer input[type="checkbox"]:checked ~ span:nth-of-type(3){

    transform-origin:bottom;
    width:50%;
    transform: translate(17px,-8px) rotatez(45deg);

  }


  /* USER MENU */

  .avisos-wrapper {
    display:flex;
    gap:0.5rem;
    align-items:center;
  }

  .avisos-wrapper p {
    margin:0;
    color:var(--primary-color-hover);
    font-size:20px;
  }


  .avisos-wrapper .notification-content {
    font-size:24px;
    position:relative;
    cursor:pointer;
  }

  .avisos-wrapper .notification-content .notification-circle {
    position:absolute;
    background:var(--error-color);
    width:18px;
    height:18px;
    border-radius:50%;
    line-height:1;
    font-size:12px;
    color:var(--white);
    right: -5px;
    top: -5px;
  }

  .avisos-wrapper .notification-content .notification-circle span {
    /*transform: translate(6px, 2px);*/
    display: block;
    width:18px;
    height:18px;
    overflow: hidden;
    text-align: center;
    line-height: 18px;
  }



  /* MENU FOOTER */

  .footer-login-wrapper-entorno {
    /* width: 100%; */
    background:var(--white);
    position:fixed;
    bottom:0;
    display:flex;
    justify-content:space-between;
    padding-top:10px;
    padding-bottom:5px;
    padding-left:20px;
    padding-right:20px;
    box-sizing:border-box;
    margin:0px 10px;
    left:0;
    right:0;
    border-radius:10px 10px 0px 0px;
  }

  @media(min-width:768px) {
    .footer-login-wrapper-entorno {
      justify-content:center;
      gap:3rem;
    }
  }

  .footer-login-wrapper-entorno .item {
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:initial;
    color:var(--primary-color-hover);
    padding:0;
    width:60px;
    text-align:center;
    cursor:pointer;
  }

  @media(min-width:768px) {
    .footer-login-wrapper-entorno .item {
      width:auto;
    }
  }

  .footer-login-wrapper-entorno .item.active i {
    color:var(--primary-color);
  }

  .footer-login-wrapper-entorno .item i {
    font-size:20px;
  }

  .footer-login-wrapper-entorno .item p {
    margin:0;
    font-size:12px;
    text-transform:initial;
    line-height:25px;
  }

  @media(min-width:768px) {
    .footer-login-wrapper-entorno .item i {
      font-size:24px;
    }
    .footer-login-wrapper-entorno .item p {
      font-size:14px;
    }
  }

  /* BUTTON + MENU FOOTER */

  .footer-login-wrapper-entorno .add-service{
    position:relative;
  }

  .footer-login-wrapper-entorno .item .button-add-hidden {
    visibility:hidden;
    padding:0px 26px;
  }
  .footer-login-wrapper-entorno .item .button-add-visible {
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    position:absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    background-color:var(--primary-color);
    width:60px;
    height:60px;
    border-radius:50%;
    top:-30px;
    z-index:2;
  }

  .footer-login-wrapper-entorno .item .button-add-visible.oppened {
    background-color:var(--primary-color-hover);
  }


  .footer-login-wrapper-entorno .item.add-service .modal-add-service {
    box-shadow:rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    left: 50%;
    transform:translateX(-50%) scale(0);
    background: var(--primary-color);
    border-radius:20px;
    bottom: 65px;
    content: "";
    display: block;
    height: 80px;
    margin: 0 auto;
    position: absolute;
    right: 0;
    transition: transform .3s,-webkit-transform .3s;
    width: 230px;
    will-change: transform;
    z-index: 1;
    display:flex;
    align-items:center;
    justify-content:space-around;
  }

  .footer-login-wrapper-entorno .item.add-service .modal-add-service p {
    font-size:14px;
    color:var(--white);
  }

  .footer-login-wrapper-entorno .item.add-service .modal-add-service i {
    font-size:24px;
    color:var(--white);
  }
  .footer-login-wrapper-entorno .item.add-service .modal-add-service.oppened {
    transform:translateX(-50%) scale(1);
  }

  .footer-login-wrapper-entorno .item .button-add-visible-inner {
    position:relative;
    width:60px;
    height:60px;
  }

  .footer-login-wrapper-entorno .item .button-add-visible-inner i {
    color:var(--white);
    font-size:25px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(1);
  }

  .footer-login-wrapper-entorno .item .button-add-visible-inner i {
    transition: all 0.2s ease-out ;
  }

  .footer-login-wrapper-entorno .item .button-add-visible-inner i.fa-xmark {
    transform: translate(-50%, -50%) scale(1.2);
    opacity:0.8;
  }

  #barrainferior .etiqueta-publica{
    padding-top: 57px;
  }

.mensaje-recuperacion{
	font-weight: 800;
}

#resultado-recuperar{
	text-align: center;
} 

#resultado-registro{
	text-align: center;
	    background: #ffd4d4; 
    padding: 10px;
} 

#login-google {display: block; margin-bottom: 	20px; text-align: 	center;	}
#login-google img {margin: auto;     box-shadow: 2px 5px 6px 0px #00000059; max-width: 250px;}


.boton-continua {
    display: block;
    border: solid 1px black;
    border-radius: 5px;
    padding: 13px;
    color: black;
    margin:10px auto;
    max-width: 400px;
    display: flex;
    align-content: space-around;
    align-items: center;
    text-decoration: none
}
.boton-continua img {
    width: 20px;
    height: 20px;
    margin-right: 20px;
    margin-left: 10px;
}

.politicas {    width: 100%;
    margin: 10px auto;
    /* background: white; */
    padding: 10px;
    border: solid 1px #e5e5e5;
}
.politicas input { margin-right: 5px; }

#cont-ya-tienes-cuenta { text-align:center; }
#cont-ya-tienes-cuenta a, .politicas a { color:#559dd2; text-decoration: none; }
.volver-login{
    /*border: solid 1px black;
    border-radius: 5px;
    padding: 13px;
    color: black;
    margin:10px auto;
    max-width: 150px;
    display: flex;
    align-content: space-around;
    align-items: center;
    text-decoration: none;
    justify-content: center;*/
    color: black;
    position: absolute;
    top:10px;
}

@media(min-width:768px) {
   
}
.bloque-avisos-expandido{
    background: white;
    height: auto;
    max-height: calc(var(--app-height) - 140px);
    width: 40%;
    position: absolute;
    z-index: 999999999999999;
    flex-direction: row;
    top: 50px;
    right: 10px;
    border-radius: 10px;
    border: 1px solid black;
    overflow-y: scroll;
    overflow-x: hidden;
}

.bloque-avisos-expandido .bloque-aviso{
	width: 96%;
    border-bottom: 1px solid var(--primary-color-hover);
    margin:0px 10px;
}

.bloque-avisos-expandido .bloque-aviso a{
	text-decoration: none;
}

.bloque-avisos-expandido .bloque-aviso .titulo{
	margin-bottom: -10px;
	color: var(--primary-color-hover);
}

.bloque-avisos-expandido .bloque-aviso .contenido{
	color: var(--primary-color-hover);
}

@media(max-width: 768px){
	.bloque-avisos-expandido{
	    background: white;
	    height: auto;
	    max-height: calc(var(--app-height) - 140px);
	    width: 97.5%;
	    position: absolute;
	    z-index: 999999999999999;
	    flex-direction: row;
	    top: 50px;
	    right: 3px;
	    border-radius: 10px;
	    border: 1px solid black;
	}
	.bloque-avisos-expandido .bloque-aviso{
		/*height: 13vh !important;*/
	}
}
/* QUITAR DESPUES*/
.slideout-overlay {
   visibility:hidden !important;
}

/* QUITAR */

.expandable-content {
   padding:0 !important;
   margin:10px 0px;
}

.expandable-content .top-content {
   border-radius:10px;
   display:flex;
   flex-wrap: wrap;
   align-items:center;
   justify-content:center;
   margin-bottom:20px;
   padding:10px 15px;
   border:1px solid var(--background-grey);
   margin-right:23px;
}
.expandable-content .top-content > * {
  margin:10px;
}

.expandable-content .top-content .user {
   display:flex;
   gap:0.5rem;
   align-items:center;
}

.expandable-content .top-content .user p {
   margin:0;
   font-size:12px;
   font-weight:600;
}

.expandable-content .top-content .photo-user {
   width: 40px;
   height: 40px;
   display: flex;
   justify-content: center;
   align-items: center;
   background: var(--primary-color);
   border-radius: 50%;
   position: relative;
   overflow: hidden;
}

.expandable-content .top-content .photo-user i {
   color:var(--white);
}

.expandable-content .top-content .button-perfil-wrapper .button-perfil {
   background:var(--primary-color-hover);
   border-radius:10px;
   padding:0px 15px;
   font-size:12px;
   margin-right: 15px;
   cursor: pointer;
}





.expandable-content .transaction-content .hidden {
  display: none !important;
}

.expandable-content .transaction-content .icon {
   border-radius:50%;
   border:1px solid var(--primary-color-hover);
   display:flex;
   align-items:center;
   justify-content:center;
   position:relative;
}


.expandable-content .transaction-content .icon i {
   padding:10px;
   font-size:18px;
   color:var(--primary-color-hover);
}

.expandable-content .transaction-content .element-content .icon .line {
   position:absolute;
   width:2px;
   height:21px;
bottom: -22px;
margin: auto;
   background:var(--primary-color-hover);
}

.expandable-content .transaction-content .element-content {
   display:flex;
   gap:1rem;
   align-items:center;
   margin-bottom:20px;
   font-size:14px;
}


.expandable-content .transaction-content .element-content.pasada *  {
   color:rgb(75,181,67);
}

.expandable-content .transaction-content .element-content.pasada .line {
   background: rgb(75,181,67);
}

.expandable-content .transaction-content .element-content.pasada .icon {
   border: 1px solid rgb(75,181,67);
}



.expandable-content .transaction-content .element-content.futura *  {
   color:rgb(235,235,228);
}

.expandable-content .transaction-content .element-content.futura .line {
   background: rgb(235,235,228);
}

.expandable-content .transaction-content .element-content.futura .icon {
   border: 1px solid rgb(235,235,228);
}



.expandable-content .transaction-content .element-content:last-child {
   margin-bottom:0;
}

.expandable-content .transaction-content .element-content.selected .icon {
   border:1px solid var(--primary-color);
}

.expandable-content .transaction-content .element-content.selected .icon i {
color:var(--primary-color);
}

.expandable-content .transaction-content .element-content.selected .icon .line {
   background:var(--primary-color);
}

.expandable-content .transaction-content .element-content.selected .text p {
color:var(--primary-color);
font-weight:600;
}


.expandable-content .transaction-content .element-content p {
   margin:0;
}

#checkout-button{
   background: var(--primary-color-hover);
   border-radius: 10px;
   padding: 0px 20px;
   font-size: 14px;
   cursor: pointer;
}

.star_content {
    margin-bottom: 5px;
    float: left;
    width: 100%;
    display: flex;
    justify-content: space-around;
}

.valor-valoracion {
   line-height: 15px;
   margin-left: 3px;
}
.valor-valoracion input {
   margin-right: 4px;
}

.star {
    overflow: hidden;
    float: left;
    margin: 0 1px 0 0;
    width: 16px;
    height: 18px;
    cursor: pointer;
}

.star a {
    display: block;
    width: 100%;
    background-position: 0 0;
}

.star {
    position: relative;
    top: -1px;
    float: left;
    width: 14px;
    overflow: hidden;
    cursor: pointer;
    font-size: 14px;
    font-weight: normal;
}

.star a {
    display: block;
    position: absolute;
    text-indent: -5000px;
}

div.star:after {
    content: "\f006";
    font-family: "FontAwesome";
    display: inline-block;
    color: #777676;
}

div.star.star_on {
    display: block;
}

div.star.star_on:after {
    content: "\f005";
    font-family: "FontAwesome";
    display: inline-block;
    color: #ef8743;
}

div.star.star_hover:after {
    content: "\f005";
    font-family: "FontAwesome";
    display: inline-block;
    color: #ef8743;
}

.bloque-ofrecer-dinero{
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  align-items: center;
}

#form-ofrecer-dinero{
  margin-right: 60px;
}

@media (max-width: 728px){
  .bloque-ofrecer-dinero{
    width: 100%;
    flex-wrap:wrap;
  }
  #form-ofrecer-dinero{
    margin: auto;
  }

  .bloque-ofrecer-dinero .button-perfil{
    width: 60%;
    margin: 10px auto;
    text-align: center;
    white-space: normal;
    line-height: 20px;
    padding: 5px 20px !important;
    cursor: pointer;
  }

   #dinero{
      top: 0px !important;
   }

   .expandable-content .top-content .button-perfil-wrapper .button-perfil {
      margin: 15px auto;
      cursor: pointer;
   }
}

.enlace-perfil-previa-transaccion{
   font-weight: 600;
   text-transform: uppercase;
   margin: 0;
   text-align: left;
   line-height: 1.5;
   font-size: 14px;
   text-decoration: none;
   color: rgb(31, 31, 33);
}

#dinero{
   width: 100%;
   text-align: right;
   margin-right: 10px;
   position: relative;
   top: -1.5px;
}
.general-info .custom-input {
   display:block;
   border-radius:10px;
}

.general-info .custom-input * {
   font-size:14px;
   text-align:center;
}


.general-setting-element .grid-three-columns {
   display:grid;
   grid-template-columns:1fr 1fr 1fr;
}


.shipping-size-wrapper .shipping-size-inner {
   gap:0.5rem;
}

.shipping-size-wrapper .shipping-size-inner .custom-input {
   border-radius:10px;
   padding:5px;
}

@media(min-width:768px) {
   .shipping-size-wrapper .shipping-size-inner .custom-input {
      width:250px;
      margin:0 auto;
   }
}


.shipping-size-wrapper .shipping-size-inner .custom-input * {
   font-size:14px;
   text-align:center;
}

.shipping-size-wrapper .category {
   padding:5px;
   display:block;
   border-radius:10px;


}

.shipping-size-wrapper .category select {
   font-size:14px;
   text-align:center;
}

.shipping-photos input {
   display:none;
}


.shipping-photos  #fotos-subidas  {
   display:flex;
   gap:1rem;
   flex-wrap:wrap;
   justify-content:center;

}

.shipping-photos  #fotos-subidas .add-photo {
   order:99;
}

.shipping-photos  #fotos-subidas .shipping-photo {
   padding:5px;
   display: flex;
    align-items: center;
    width:72px;
    height:72px;
    justify-content:center;
}

.shipping-photos .shipping-photo-container {
   position:relative;
}


.shipping-photos .shipping-photo {
   border:1px dashed var(--primary-color-hover);
   padding:30px;
}

.shipping-photos .shipping-photo i {
   font-size:40px;
   color:var(--primary-color-hover);
   padding:10px;
}


/* LAST FIX */




.shipping-options .shipping-size-wrapper .input-date-custom {
   box-sizing:border-box;
   border-radius:10px;
   padding: 5px 20px;
   width:100%;
   display:block;
   background: var(--background-grey);
}

.shipping-options .shipping-size-wrapper .input-date-custom input {
   font-size:14px;
   height:auto;
   line-height:30px;

}

.trip-route-wrapper .select-custom {
   display:block;
}

.shipping-size-wrapper .custom-input {
   display:block;
   border-radius:10px;
   padding:5px 0px;
}
@media(min-width:768px) {
   .shipping-size-wrapper .custom-input {
      width:250px;
      margin:0 auto;
   }
}

.shipping-size-wrapper .custom-input input {
   text-align:center;
}

.special-container-wrapper-color-primary .button-cancel{
   background: var(--error-color);
   display: table;
   margin: auto;
   cursor:pointer;
}

@media(min-width:768px) {
   .label-peso{
      font-size: 15px;
      position: relative;
      top: -30px;
      height: 0px;
      width: 100px;
   }
}

/* #fotos-subidas .fa-times-circle{
   color: red !important;
   font-size: 25px !important;
   position: relative;
   top: -12px;
   left: -30px;
   background: white;
   height: 25px;
} */


#fotos-subidas .fa-times-circle {
   position: absolute;
   top: -5px;
   right: -5px;
   font-size: 18px;
   padding: 0;
   background: white;
   cursor:pointer;
   color:var(--error-color);
}


#cont-peso-mienvio #peso input {
   margin-left: 20px;
}
.special-container-wrapper-color-primary.no-first {
margin-top:20px;
}



.special-container-wrapper-color-primary.no-first.wrapper-transactions {
   padding:25px 0px;
}



.general-setting-element {
   margin:20px 0px;
}


.general-setting-element:first-child {
   margin-top:0;
}

.general-setting-element:last-child {
   margin-bottom:0;
}


.general-setting-element .sub-head {
   font-size:18px;
   font-weight:400;
   padding-left:20px;
   color:var(--primary-color-hover)
}



.general-setting-element h2 {
   text-align:center;
   margin: 0;
   font-size: 20px;
   font-weight: 600;
   color: var(--primary-color-hover);
   margin-bottom: 20px;
}




@media(min-width:768px) {
   .general-setting-element .rutas-wrapper {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:1rem;
   }

}


.general-setting-element .three-group-items {
   display:grid;
   grid-template-columns:1fr;
   gap:1rem;
}

@media(min-width:768px) {
   .general-setting-element .three-group-items {
      grid-template-columns:1fr 1fr 1fr;
   }
}

.general-setting-element .two-group-items {
   display:grid;
   grid-template-columns:1fr;
   gap:1rem;
}

@media(min-width:768px) {
   .general-setting-element .two-group-items {
      grid-template-columns:1fr 1fr;
   }
}

.general-setting-element .select-items {
   display:flex;
   flex-direction:column;
   width:100%;
   gap:0.5rem;
}

.text-area-anotaciones {
   font-size:14px;
   min-height:75px;
   border:none;
   border-radius:10px;
   background:var(--background-grey);
   padding:10px 20px;
   line-height:20px;
   resize:none;
   box-sizing: border-box;
   width: 100%
}

.type-transportation-wrapper .select-transportation {
   display:flex;
   justify-content:space-between;
   background:var(--background-grey);
   border-radius:20px;
}

.type-transportation-wrapper .select-transportation > div {
   width:33.3%;
   text-align:center;
   padding:5px 15px;
   border-radius:20px;
}

.type-transportation-wrapper .select-transportation i {
   font-size:30px;
}

.type-transportation-wrapper .select-transportation .selected {
   background:var(--primary-color-hover);

}

.type-transportation-wrapper .select-transportation .selected i {
   color:var(--white);
}


.details-trip-wrapper .select-items {


   margin-bottom:10px;
}

.details-trip-wrapper .select-items .day-hour-travel {
   border-radius:10px;
   display:flex;
   align-items:center;
   gap:1rem;

}
.details-trip-wrapper .select-items .day-hour-travel .wrapper-fecha {
   width:50%;
   background:var(--background-grey);
   border-radius:10px;
   display:flex;
   padding:12px 20px;
}

.details-match-wrapper .select-items .day-hour-travel .wrapper-fecha {   
   background:var(--background-grey);
   border-radius:10px;
   display:flex;
   padding:12px 20px;
}

.details-trip-wrapper .select-items .day-hour-travel .wrapper-dinero {
   width:50%;
   background:var(--background-grey);
   border-radius:10px;
   display:flex;
   padding:12px 20px;
   align-items: center;
}

.details-match-wrapper .select-items .day-hour-travel .wrapper-dinero {   
   background:var(--background-grey);
   border-radius:10px;
   display:flex;
   padding:12px 20px;
   align-items: center;
}

.details-trip-wrapper .select-items .day-hour-travel input {
   padding:12px 20px;
   border:none;
   width:20%;
   /*background:transparent;*/
}

.details-match-wrapper .select-items .day-hour-travel input {
   padding:12px 20px;
   border:none;
   width:20%;
   /*background:transparent;*/
}

.details-trip-wrapper .select-items .day-hour-travel .wrapper-fecha input {
   width:50%;
   padding:0px;
   background: transparent;
}

.details-match-wrapper .select-items .day-hour-travel .wrapper-fecha input {
   width:50%;
   padding:0px;
}

.details-trip-wrapper .select-items .day-hour-travel .wrapper-dinero input {
   width:50%;
   padding:0px;
   background: transparent;
   display: flex;
   align-items: center;
}

.details-match-wrapper .select-items .day-hour-travel .wrapper-dinero input {
   width:50%;
   padding:0px;
   display: flex;
   align-items: center;
}

.details-trip-wrapper .select-items .day-hour-travel .etiqueta-fecha{
   width: 100%;
   text-align: left;
   margin-left: 0px;
}
.details-trip-wrapper .select-items .day-hour-travel .etiqueta-hora{
   width: 100%;
   text-align: left;
   margin-left: 0px;
}

.details-trip-wrapper .wrapper-peso-vuelo {
   width:50%;
   background:var(--background-grey);
   border-radius:10px;
   display:flex;
   padding:12px 20px;
}

.details-trip-wrapper .wrapper-peso-vuelo .wrapper-peso {
   width:50%;
   text-align:right;
}

.details-trip-wrapper .wrapper-peso-vuelo .wrapper-peso  i {
   padding-left:5px;
}



.details-trip-wrapper .wrapper-peso-vuelo span {
   width:50%;
}

.details-trip-wrapper .wrapper-peso-vuelo .peso {
   width:50%;
   padding:0;
   text-align:right;
   border:none;
}


.details-trip-wrapper .wrapper-peso-vuelo .num-vuelo {
   border:none;
}


@media(max-width:768px) {

   .details-trip-wrapper .select-items .day-hour-travel{
      border-radius: 10px;
      display: flex;
      width:100%;
      background:transparent;
      flex-direction: column;
      align-items: center;
      gap:10px;
   }

   .details-trip-wrapper .select-items .day-hour-travel .wrapper-fecha,.details-trip-wrapper .select-items .day-hour-travel .wrapper-hora, .details-trip-wrapper .select-items .day-hour-travel .wrapper-dinero {
      width:100%;
      background:var(--background-grey);
      justify-content:space-between;
      display:flex;
      align-items:center;
      border-radius:10px;
      padding:12px 20px;
      box-sizing:border-box;
      flex-wrap: wrap;

   }

   .details-trip-wrapper .select-items .day-hour-travel .wrapper-fecha input {
      width:auto !important;
      padding:0px;
      background: transparent;
   }

   .details-trip-wrapper .select-items .day-hour-travel .wrapper-dinero input {
      width:auto !important;
      padding:0px;
      background: transparent;
      display: flex;
      align-items: center;
   }

   .details-trip-wrapper .select-items .day-hour-travel .wrapper-fecha .custom-input {
      width:0%;
      padding:0px;
   }

   .details-trip-wrapper .select-items .day-hour-travel .wrapper-dinero .custom-input {
      width:0%;
      padding:0px;
   }

   .details-trip-wrapper .select-items .day-hour-travel .etiqueta-fecha{
      width: auto !important;
      text-align: left;
      margin-left: 0px;
   }
   .details-trip-wrapper .select-items .day-hour-travel .etiqueta-hora{
      width:auto;
      text-align: left;
      margin-left: 0px;
   }

   .details-match-wrapper .select-items .day-hour-travel .wrapper-fecha input {
      font-size: 75%;
      background: transparent;
   }

   .details-match-wrapper .select-items .day-hour-travel .wrapper-dinero input {
      font-size: 75%;
      background: transparent;
   }

}


.details-trip-wrapper .select-items .num-travel {
   border-radius:10px;
   overflow:hidden;

}

.details-trip-wrapper .select-items .num-travel input {
   font-size:12px;
}

.details-trip-wrapper .select-items .select {
   width:100%;
   padding:5px 15px;

}

.details-trip-wrapper .select-items .select select {
   text-align:center;
   background-image:none;
   font-size:12px;
   padding:0;
}

.details-trip-wrapper .select-items .select.day {
   display:flex;
   align-items:center;
   gap:1rem;
   border-right:2px solid var(--grey);
}

.select-items .checkpoints-selected {
   padding:5px;
   text-align:center;
   background:var(--error-color);
   font-size:16px;
   color:var(--white);
   border-radius:10px;
   margin-bottom:20px;
}


.details-trip-wrapper .input-items {
   display:flex;
   align-items:center;
}



.details-trip-wrapper .input-items {
   width:80%;
   position:relative;
}

.details-trip-wrapper .input-items.peso-travel {
   width:100%;
   gap:1rem;
}

@media(max-width:768px) {
   .details-trip-wrapper .input-items.peso-travel {
      flex-direction:column;
   }
   .details-trip-wrapper .input-items.peso-travel > div {
      width:100%;
      box-sizing:border-box;
   }

   .details-trip-wrapper .wrapper-peso-vuelo .etiqueta-vuelo {
      display:none;
   }

   .details-trip-wrapper .wrapper-contain-vuelo {
      height:46px !important;
   }
   .details-trip-wrapper .wrapper-peso-vuelo .wrapper-vuelo {
      width:100% !important;
   }
   .details-trip-wrapper .wrapper-peso-vuelo .wrapper-vuelo input {
      text-align:center;
   }
}

.details-trip-wrapper .input-items .peso-disponible {
   width:50%;
   border-radius:10px;
   overflow:hidden;
   position:relative;
}

.details-trip-wrapper .input-items .peso-disponible .peso{
   width: 65%;
}

.details-trip-wrapper .input-items .peso-disponible .etiqueta-peso{
   margin-left: 275px;
}




.details-trip-wrapper .input-items .num-travel {
   border-radius:10px;
   overflow:hidden;
   width:50%;
   position:relative;
   height:22px;
}

.details-trip-wrapper .input-items .num-travel .custom-input {
   width:100%;
   box-sizing:border-box;
}



.details-trip-wrapper input {
   text-align:center;
   font-size:14px;
}

.button-save-wrapper {
   margin-top:20px;
}

.button-save-wrapper .button-save {
   width:100%;
   text-align:center;
   background:var(--primary-color-hover);
   border-radius:10px;
   font-size:20px;
   text-transform:initial;
   cursor:pointer;
}

.details-trip-wrapper .wrapper-peso-vuelo .wrapper-vuelo {
   display:flex;
   width:50%;
   align-items:center;
}

.details-trip-wrapper .wrapper-peso-vuelo .wrapper-vuelo i {
   padding-left:5px;
}


/* DISEÑO DE ENVIOS VINCULADOS*/

.element-envio-vinculado {
   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
   border-radius:10px;
   margin-bottom:20px;
   padding: 20px;
}

.element-envio-vinculado:last-child {
   margin-bottom:0;
}


.element-envio-vinculado .no-expandable {
   width:100%;
   align-items:center;
   gap:1rem;
   margin-bottom:40px;
   padding-right:15px;
}



.element-envio-vinculado .no-expandable:last-child {
   margin-bottom:0;
}

.element-envio-vinculado .no-expandable .top-content {
   display:flex;
   align-items:center;
   gap:1rem;
   justify-content:space-between;
}

.element-envio-vinculado .no-expandable .top-content .left-content {
   display:flex;
   align-items:center;
   gap:1rem;
}

.element-envio-vinculado .no-expandable .top-content .peso {
   font-size:12px;
}

.element-envio-vinculado .no-expandable .top-content .name-client p {
   margin:0;
   text-align:left;
   line-height:1.5;
   font-size:14px;
}


.element-envio-vinculado .no-expandable .top-content .name-client p.name {
   font-weight:600;
   text-transform:uppercase;
}
@media(max-width:768px) {
   .element-envio-vinculado .no-expandable .top-content .name-client p.name  {
      font-size:14px;
   }
   .details-trip-wrapper .input-items .peso-disponible .peso{
      width: 100%;
      margin-top: 0px;
   }

   .element-envio-vinculado .no-expandable .top-content{
      display: flex;
    align-items: center;
    gap: 0rem;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: space-around;
   }

   .element-envio-vinculado .no-expandable .top-content .left-content{
      display: flex;
      align-items: center;
      gap: 0.5rem;
      flex-wrap: wrap;
      justify-content: center;
   }
   
   .element-envio-vinculado .no-expandable .bottom-content p.estado{
      text-align: center;
      margin-top: 0px;
      margin-bottom: 0px;
   }

}






.photo-user img {
   width:75px;
   height:75px;
   object-fit:cover;
   border-radius:50%;
   box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

}

.element-envio-vinculado .no-expandable .bottom-content {
   display: flex;
   align-items: center;
   justify-content: space-around;
   flex-wrap: wrap;
   gap: 11px;

}


.element-envio-vinculado .no-expandable .bottom-content p.estado {
   padding:0px 15px;
   font-size:14px;
   font-weight:600;
   color:var(--primary-color-hover);
   flex: 1 1 66%;
}
@media (max-width:768px){
   .element-envio-vinculado .no-expandable .bottom-content .button-chat-wrapper{
      flex: 1 1 49%;
   }
   .element-envio-vinculado .no-expandable .bottom-content p.estado {
      flex: 1 1 66%;
   }

   .element-envio-vinculado .no-expandable .top-content .peso {
      font-size:15px;
      margin-top: 0px;
   }

}


.element-envio-vinculado .no-expandable .bottom-content .button-chat-wrapper .button-chat {
   width: 100%;
    text-align: center;
    background: var(--primary-color-hover);
    border-radius: 10px;
    cursor:pointer;
}

@media(max-width:768px) {
   .element-envio-vinculado .no-expandable .bottom-content .button-chat-wrapper .button-chat {
      font-size:14px;
   }
}

.element-envio-vinculado .no-expandable .image img {
   width:100%;
}

.element-envio-vinculado .no-expandable .image {
   width:50px;
   height:50px;
   border-radius:50%;
   overflow:hidden;
}

.element-envio-vinculado .no-expandable .title p {
   margin:0;

}

.element-envio-vinculado .no-expandable .title .name {
   font-size:18px;
   font-weight:600;
}

.element-envio-vinculado .no-expandable .title .peso {
   font-size:14px;
   display:flex;
   gap:0.5rem;
   align-items:center;

}


/* LAST CHANGES */

.button-open-map-popup {
   background:var(--background-grey);
   border-radius:10px;
   /*color:var(--primary-color-hover);*/
   background-color: #5C9BD4;
   font-size:18px;
   text-transform:initial;
}

.button-open-map-popup i {
   padding-right:10px;
}

.invalid{
   border: 1px solid red !important;
   border-radius: 10px;
}


.num-travel.wrapper-peso-vuelo.wrapper-contain-vuelo .wrapper-vuelo {
   display:flex;
   position:relative
}


.num-travel.wrapper-peso-vuelo.wrapper-contain-vuelo .wrapper-vuelo i {
   position:absolute;
   top: 50%;
 transform: translateY(-50%);
 right:25px;
}

@media(min-width:858px) {
   .input-items.peso-travel {
      display:flex;
      align-items:center;
      gap:1rem;
   }
   .input-items.peso-travel > div {
      width:100%;
   }

   .details-trip-wrapper .select-items .day-hour-travel input {
      background:transparent !important;
   }

   .details-match-wrapper .select-items .day-hour-travel input {
      background:transparent !important;
   }
}


.incluir-peso-disponible.wrapper-peso-vuelo .wrapper-peso ons-input {
   width:100%;
   position:relative;
}

.incluir-peso-disponible.wrapper-peso-vuelo .wrapper-peso ons-input span {
   position:absolute;
   top: 50%;
   transform: translateY(-50%);
   right:25px;
   display:flex;
   align-items:center;
}
.incluir-peso-disponible.wrapper-peso-vuelo .wrapper-peso ons-input i:before {
   padding-right:10px;
}



.title-with-help {
   display:flex;
   align-items:center;
   gap:1rem;
}

.sub-menu-navigation {
   color:var(--white);
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
   font-size:22px;
}


.sub-menu-navigation .arrow {
   position:absolute;
   left:0;
   font-size:23px;
   cursor:pointer;
}

.sub-menu-navigation .text-navigation p {
   margin:0;
}

.menu-buttons-search-wrapper .description-page {
   text-align:center;
   font-size:14px;
}


.menu-buttons-search-wrapper .divider {
   width: 35%;
   margin: 0 auto;
   height: 4px;
   background: var(--background-grey);
   margin-top:20px;
}

@media(min-width:768px) {
   .menu-buttons-search-wrapper .divider {
      display:none;
   }
}

.menu-buttons-search {
   display:flex;
   align-items:center;
   justify-content:space-between;
   margin:20px 0px;
   text-align:center;
}

.menu-buttons-search .item-button {
   padding: 0px 30px;
   border-radius: 25px;
   font-size:16px;
   color:var(--primary-color-hover);
   background:var(--background-grey);
   text-transform:initial;
   cursor:pointer;
}

@media(max-width:768px) {
   .menu-buttons-search .item-button {
      padding:5px 15px;
      border-radius: 10px;
   }
}

.menu-buttons-search .item-button.active {
   color: var(--white);
   background: var(--primary-color);
}

.menu-buttons-search .item-button.lupa {
   padding: 0px;
    border-radius: 50%;
}

.menu-buttons-search .item-button.lupa i {
   font-size:14px;
   padding:10px;
}
@media(min-width:768px) {
   .menu-buttons-search {
      display:block;
      text-align:left;
      margin-top:0px;
   }
   .menu-buttons-search .item-button {
      margin-right:10px;
   }
   .menu-buttons-search .item-button:last-child {
      margin-right:0;
   }
   .menu-buttons-search .lupa {
      float:right;
   }
}

.list-elements {

}

@media(min-width:768px) {
   .list-elements {
      gap: 1rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
   }
}

.list-elements .element {
   position:relative;
   display:block;
   overflow:hidden;
}

.list-elements .element .top-content .image-product {
   margin:-15px -15px 15px -15px;
}

.list-elements .element .top-content .image-product img {
   width:100%;
   height: 200px;
   object-fit: cover;
}

 .list-elements .element-wrapper {
   display:flex;
   align-items:center;
   margin:50px 0px;
   gap:1rem;
}

@media(min-width:768px) {
   .list-elements .element-wrapper {
      justify-content:flex-start;
   }
}

.list-elements .element-wrapper .icon-tip {
   width:50px;
   height:50px;
   border:1px solid var(--error-color);
   border-radius:50%;
   position:relative;
}

.list-elements .element-wrapper .icon-tip.icon-cancelled {
   border:1px solid var(--error-color) !important;
}

.list-elements .element-wrapper .icon-tip.icon-completed {
   border:1px solid var(--success-color) !important;
}

.list-elements .element-wrapper .icon-tip .notifications {
   position: absolute;
   left: 50%;
   top: -5px;
   height:15px;
   width:15px;
   border-radius:50%;
   transform: translate(-50%);
   color: var(--white);
   background-color: var(--error-color);
   font-size:10px;
}

.list-elements .element-wrapper .icon-tip .notifications span {
   display: block;
   transform: translate(4px, 0px);
}

.list-elements .element-wrapper .icon-tip .icon {
   position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: var(--primary-color);
    font-size:20px;
}

.list-elements .element-wrapper .icon-tip.icon-cancelled .icon {
   color:var(--error-color);
}

.list-elements .element-wrapper .icon-tip.icon-completed .icon {
   color:var(--success-color);
}

.list-elements .element-wrapper .information-wrapper {
   text-align: left;
   overflow:hidden;
}
.list-elements .element-wrapper .information-wrapper.central {
   flex: 1 1;
}
.list-elements .element-wrapper .information-wrapper.central {
   flex: 1 1;
}

@media (max-width: 768px) {
   .cont-match {
      justify-content: space-between;
      flex-direction: row;
      flex-wrap: wrap;
   }
   .list-elements .element-wrapper .information-wrapper.central {
      flex-basis: 100%;
      order:3;
      flex: 1 1 100%;
   }
}

.list-elements .element-wrapper .information {
   font-size:14px;
   line-height:20px;
   text-transform:initial;
   width: 100%;
}


.list-elements .element .information .information-title {
   text-align:right;
   color:var(--grey);
}

.list-elements .element .information .information-response {
   color:var(--primary-color-hover);
   text-align: left;
}

.list-elements .element .information .information-response {
   white-space: normal;
    text-overflow: ellipsis;
    overflow: hidden;
}
.list-elements .element .enter-item {
   font-size:32px;
   color:var(--primary-color-hover);
}


.list-elements .element .badge {
   position:absolute;
   font-size:10px;
   padding:3px 30px;
   border-radius:10px;
   top:-30px;
   left:50%;
   transform:translate(-50%);
   color:var(--white);
   font-weight:300;
}

.list-elements .element .badge.cancelled {
   background-color:var(--error-color);
}

.list-elements .element .badge.completed {
   background-color:var(--success-color);
}


.list-elements .bottom-content {
   background:var(--background-grey);
   padding: 5px 15px;
   width: 100%;
   transform: translateX(-15px);
   margin-bottom:-15px;
   display:flex;
   justify-content:space-between;
   align-items:center;
}


.list-elements .bottom-content .user {
   display:flex;
   gap:0.5rem;
   align-items:center;
}

.list-elements .bottom-content .user p {
   margin:0;
   font-size:12px;
   font-weight:600;
}

.list-elements .bottom-content .photo-user {
   width: 40px;
   height: 40px;
   display: flex;
   justify-content: center;
   align-items: center;
   background: var(--primary-color);
   border-radius: 50%;
   position: relative;
   overflow: hidden;
}

.list-elements .bottom-content .photo-user i {
   color:var(--white);
}

.list-elements .bottom-content .info-travel-button .boton {
   line-height:20px;
   font-size:14px;
}

/* MIS ENVIOS */

.list-elements.historico {
   margin-top:30px;
}

.list-elements.historico .element {
   padding:25px 15px 15px 15px !important;
}

.list-elements.historico .badge {
   top:0px;
}

.viajesyenvios.cancelado, .viajesyenvios.completado  {display: none;}
.viajesyenvios.envio{}
#dialog-mapa .dialog { width: 98%;     height: calc(98vh - 128px); position: fixed;}
#map {height: 100%;}

.btn-mapa {padding: 5px;
    background: white;
    border-radius: 5px;
    border: solid 1px grey;
    text-decoration: none;
    color: black;
    position: absolute;     right: 0px;     z-index: 100000;  margin:10px;
 }

#cerrar-mapa {  }
#cerrar-mapa i { color:red;   background: white;     border-radius: 20px;}

#confirmar-mapa { top:32px; }
#confirmar-mapa i {   color:green;  background: white;     border-radius: 20px;}

#todos-mapa { top:64px; }
#todos-mapa i {   color:#5c9bd4;  background: white;     border-radius: 20px;}

li.checkpoint {
   list-style: none;
   font-weight:500;
   text-align:center;
   font-size:14px;
}
.list-checkpoints {
   padding:5px 25px;
   margin-bottom:25px;
}

li.checkpoint i { color:green; }

.shipping-photo img {max-width: 60px;  max-height: 60px;}

.precioestimado-wrapper {
   margin:50px 0px 40px 0px;
}

.precioestimado {
   position:relative;
   border-radius:10px;
   background:var(--primary-color);
   color:var(--white);
   padding:10px 20px;
   font-size:18px;
   line-height:2;
   text-align:center;
   margin:5px;
   }

   .precioestimado a {
      color:white;
   }
   .precioestimado strong {
      font-weight:600;
      font-size:18px;
   }

   .precioestimado .icon-wrapper {
      font-size:25px;
      position:absolute;
      left:0;
      right:0;
      margin-left:auto;
      margin-right:auto;
      top:-20px;
      width:40px;
      color:yellow;
      height:auto;
      background:var(--primary-color-hover);
      border-radius:10px;

   }

   .precioestimado .icon-wrapper i {

   }



.text-area-descripcion-envio{
   font-size: 14px;
   min-height: 75px;
   border: none;
   border-radius: 10px;
   background: var(--background-grey);
   padding: 10px 20px;
   margin-bottom: 10px;
   line-height: 20px;
   width: 100%;
    box-sizing: border-box;
    resize:none;

}

.viajes_y_envios .day-travel{
   width: 10%;
   display: inline-block;
}

.titulo-matches{
   margin-top: 15px !important;
}


.custom-input.with-label {
   display: flex;
}

.custom-input.with-label input {
   text-align: right;
   padding-right: 10px;
 }
.custom-input.with-label:after {
   content: attr(data-label);
   margin-top: 5px;
   color: #bdbdbd;
   font-size: 0.9em;
   flex-shrink: 0;
}

@media (max-width: 768px){
   .mis_envios .menu-buttons-search{
      display: flex;
      margin: 20px 0px;
      text-align: center;
      align-items: flex-start;
      justify-content: space-between;
      flex-direction: row;
   }

   #page-misenvios .menu-buttons-search{
      display: flex;
      margin: 20px 0px;
      text-align: center;
      align-items: flex-start;
      justify-content: space-between;
      flex-direction: row;
   }
}

@media(min-width:768px) {
   #page-misenvios .menu-buttons-search {
      display: block;
    text-align: left;
    margin-top: 0px;
   }
}


.icon-help {
    margin-right: 11px;
    color: #238d0a;
    display: block;
}

.icon-help.peso-mienvio{
    float: left;
    position: absolute;
    margin: 13px;
    z-index: 10;
}

.cuadro-help {
    display: none;
    background: #ffffff;
    padding: 13px;
    border: dotted #c9c900 2px;
   margin: 11px 0px;
 }

 #resultado-actualizar-mienvio-boton, #resultado-actualizar-miviaje-boton  {    margin: 10px;     text-align: center;}

.papelera-borrar {
  right: 10px;
  position: absolute;
  top: 8px;
  color:black;
  z-index: 10;
}

.papelera-borrar:hover { color:#277dbd; }
#page-envio .special-container-wrapper-color-primary {
   padding-top: 100px;
   margin-bottom: 20px;
}

#page-envio .special-container-wrapper-color-primary.no-first {
   padding: 25px 20px;
}


.info-envio-resume .origen-destino-wrapper {
   display: flex;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 20px;
    font-size:16px;
    text-align:center;
    font-weight:600;
    padding:20px 0px;
}

.info-envio-resume .origen-destino-wrapper p {
   margin:0;
}



.info-envio-resume .origen-destino-wrapper .icon {
   position:relative;
   display:flex;
   align-items:center;
   color:var(--primary-color);
   transform:translateX(-10px);
}

.info-envio-resume .origen-destino-wrapper .icon i {
   transform:translateX(30px);
   z-index:999;
   font-size:24px;
}

.info-envio-resume .origen-destino-wrapper .icon .line-travel {
   width: 100px;
   height: 2px;
   background: var(--primary-color-hover);
   transform: translateX(-5px);
   border-radius: 10px;
   position:relative;
}

.info-envio-resume .origen-destino-wrapper .icon .line-travel:after {
   content:"";
   width:5px;
   height:5px;
   background:var(--primary-color-hover);
   position:absolute;
   right:0;
   border-radius:50%;
   top: 50%;
    transform: translateY(-50%);
}

/* SIMILAR A VIAJES */


.info-envio-resume-wrapper {
   display:flex;
   justify-content:space-between;
   flex-direction:column;
   gap:1rem;

}

@media(min-width:768px) {
   .info-envio-resume-wrapper {
      flex-direction:row;

   }
}

.info-envio-resume-wrapper p {
   margin:0;
}


.info-envio-resume-wrapper .value-wrapper .name {
   color:var(--primary-color-hover);
   font-size:16px;
   font-weight:600;
}


.info-envio-resume-wrapper .value-wrapper .value {
   font-size:14px;
}

.info-envio-resume-wrapper .peso-product, .info-envio-resume-wrapper .quantity-product, .info-envio-resume-wrapper .date-product {
   display:flex;
   align-items:center;
   gap:0.5rem;
   font-size:12px;
}

.info-envio-resume-wrapper .value-wrapper {
   line-height:15px;
   display:flex;
   flex-direction:row;
   gap:0.5rem;
   align-items:center;
}

.info-envio-resume-wrapper .value-wrapper .value {
   font-weight:500;
}


.info-envio-resume-wrapper i {
   font-size:20px;
   color:var(--primary-color);
}


/* FOTOS */

.info-envio-photos-aditional-info  {
   margin-bottom:20px;
}

.info-envio-photos-aditional-info .two-columns-contain {
   display:flex;
   flex-direction:column;
   gap:1rem;
}

.info-envio-photos-aditional-info .two-columns-contain .text-product span {
   font-weight:600;
}

.info-envio-photos-aditional-info .two-columns-contain .info-travel-notes-wrapper .text-product {
   display:none ;
}

@media(min-width:768px) {
   .info-envio-photos-aditional-info .two-columns-contain {
      flex-direction:row;
   }
   .info-envio-photos-aditional-info .two-columns-contain .card-photo-wrapper {
      width:30%;
   }
   .info-envio-photos-aditional-info .two-columns-contain .info-travel-notes-wrapper{
      width:70%;
   }
   .info-envio-photos-aditional-info .two-columns-contain .info-travel-notes-wrapper .info-travel-notes {
      min-height:265px;
   }
   .info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper {
      display:none !important;
   }
   .info-envio-photos-aditional-info .two-columns-contain .info-travel-notes-wrapper .text-product {
      display:block;
   }
   }


.info-envio-photos-aditional-info .card-photo-wrapper  {
   box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
   border-radius:10px;
   overflow:hidden;
}

.info-envio-photos-aditional-info .card-photo-wrapper .image-product img {
   width:100%;
   object-fit: cover;
}

.info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper {
   padding:10px;
   display:flex;
   justify-content:center;
   align-items:center;
}

.info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper .text-product {
   font-size:16px;
   font-weight:500;
}

.info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper .text-product span {
   font-weight:600;
}


.info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper .visit-product {
   font-size:10px;
   text-decoration:none;
}

.info-envio-photos-aditional-info .card-photo-wrapper .text-product-wrapper .visit-product p {
margin: 0;
padding: 5px 15px;
border-radius: 20px;
background: var(--primary-color);
font-size: 16px;
color: var(--white);
font-weight: 500;
text-align:center;
}


.info-envio-photos-aditional-info .card-photo-wrapper p {
   margin:0;
}

/* ARREGLOS DE VINCULACIONES EN ENVIOS */


#page-envio .element-mienvio .image {
   width:auto;
   height:auto;
}

#page-envio .element-mienvio .image i {
font-size:30px;
color:var(--primary-color-hover);
}

.envio .add-viaje{
  width: 90%;
  max-width: 300px;
  text-align: center;
  background: var(--primary-color-hover);
  border-radius: 10px;
  font-size: 17px;
  text-transform: initial;
  margin-left: 30px;
  cursor:pointer;
}
.viaje .add-envio{
  width: 90%;
  max-width: 300px;
  text-align: center;
  background: var(--primary-color-hover);
  border-radius: 10px;
  font-size: 17px;
  text-transform: initial;
  margin-left: 30px;
  cursor:pointer;
}


@media(max-width:768px) {
    .envio .add-viaje{
      width: 90%;
      margin-left: 0px;
      margin-top: 10px;
    }
    .viaje .add-envio{
      width: 90%;
      margin-left: 0px;
      margin-top: 10px;
    }    
}


.info-travel-user .photo-user img{
  width: 100%;
  height: 100%;
}


.info-user .photo-name {
   display:flex;
   gap:1rem;
   align-items:center;
}

#page-perfil .info-user {
   justify-content:space-between;
}

.info-user .right-user p.text-valoraciones {
   font-size:12px;
}

.user-perfil-wrapper {
   margin-top:40px;
}

.user-perfil-wrapper p.simple-value {
   font-size:14px;
   padding-left:15px;

}

.user-perfil-wrapper p.simple-value span {
   font-weight:600;
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper {
   display:grid;
   grid-template-columns:1fr 1fr;
   gap:1rem;
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper .card-perfil-estadisticas {
   border:1px solid var(--primary-color-hover);
   display: flex;
   border-radius:10px;
   flex-direction: column;
   align-items: center;
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper .card-perfil-valoraciones {
   border:1px solid var(--primary-color-hover);
   display: flex;
   border-radius:10px;
   flex-direction: column;
   align-items: left;
   padding: 10px;
}

.colspan2 {
   grid-column: 1 / span 2;
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper .card-perfil-estadisticas p {
   margin:0;
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper .card-perfil-estadisticas p.value {
   font-size: 32px;
   color: var(--primary-color);
}

.user-perfil-wrapper .card-perfil-estadisticas-wrapper .card-perfil-estadisticas p.info-value {
   font-size: 14px;
   line-height: 2;
}

.info-user .photo-name .photo-user img{
   width: 100%;
   height: 100%;
}

#page-perfil .info-user .photo-user{
   min-width: 75px;
   min-height: 75px;
}

.valoracion {     display: flex;    margin: 7px;    border-bottom: solid 1px #12345126;}
#page-viaje .special-container-wrapper-color-primary {
   padding-top:100px;
   margin-bottom:20px;
}

#page-viaje .special-container-wrapper-color-primary.no-first {
   padding: 25px 20px;
}

.text-navigation.travel-info {
   display:flex;
   gap:0.5rem;
   align-items:center;
}

.text-navigation.travel-info .origen-top,.text-navigation.travel-info .destino-top {

   display:flex;
   flex-direction:column;
   line-height:15px;


}

.text-navigation.travel-info .origen-top {
   text-align:right;
}

.text-navigation.travel-info .destino-top {
   text-align:left;
}

.text-navigation.travel-info .icon-travel {
   font-size:24px;
}

.text-navigation.travel-info .city {
   font-size:18px;
   line-height:30px;
}

.text-navigation.travel-info .country {
   text-transform:uppercase;
   font-size:10px;
   font-weight:300;
}

.info-travel-user {
   display:flex;
   justify-content:space-between;
   align-items:center;
   position:absolute;
   top:0;
   box-sizing:border-box;
   width:100%;
   transform: translateX(-20px);
   padding:15px 20px;
   background:var(--page-background-color);
}

.info-travel-user .info {
   line-height:15px;
}

@media(min-width:768px) {
   .info-travel-user .info {
      display:flex;
      align-items:center;
      gap:2rem;
   }
}

.info-travel-user .info p {
   margin:0;
   font-size:16px;
}

.info-travel-user .info a {
   text-decoration:none;
   color:var(--primary-color-hover);
   text-transform:uppercase;
}

.info-travel-user .valoraciones-usuario {
   margin:8px 0px;
}


.info-travel-user .info p.text-valoraciones {
   font-size:14px;
}


.info-travel-user .user .photo-user {
   width: 50px;
   height: 50px;
   display: flex;
   justify-content: center;
   align-items: center;
   background: var(--primary-color);
   border-radius: 50%;
   position: relative;
   overflow: hidden;
   cursor:pointer;
}



.viaje-user-wrapper .divider {
   width: 100%;
    margin: 0 auto;
    height: 1px;
    background: var(--background-grey);
    margin:10px 0px;
}


.info-travel-resume {
   display:flex;
   justify-content:space-between;
}

.info-travel-resume p {
   margin:0;
}



.info-travel-resume .date, .info-travel-resume .hour, .info-travel-resume .duration {
   display:flex;
   flex-direction:column;
   font-size:12px;
}

.info-travel-resume .name {
   font-size:16px;
   font-weight:600;
   color:var(--primary-color-hover);
}

.info-travel-resume .value {
   font-size:14px;
}

.info-travel-resume .peso-free, .info-travel-resume .peso-total, .info-travel-resume .transporte {
   display:flex;
   align-items:center;
   gap:0.5rem;
   font-size:12px;
}






.info-travel-resume i {
   font-size:18px;
   color:var(--primary-color-hover);
}


.info-travel-button .contact-traveller {
   width:100%;
   text-align:center;
   background:var(--primary-color-hover);
}

.info-travel-button .contact-traveller p {
   margin:0;
}

/* MATCH DE ENVIOS */


.element-mienvio {
   display:flex;
   align-items:center;
   gap:1rem;
   margin-bottom:20px;
}

.element-mienvio:last-child {
   margin-bottom:0;
}


.element-mienvio .image img {
   width:100%;
}

.element-mienvio .image {
   width:50px;
   height:50px;
   border-radius:50%;
   overflow:hidden;
}

.element-mienvio .title p {
   margin:0;

}

.element-mienvio .title .name {
   font-size:16px;
   font-weight:600;
}

.element-mienvio .title .peso {
   font-size:14px;
   display:flex;
   gap:0.5rem;
   align-items:center;

}

.element-mienvio .button-contact {
   flex-grow:2;
   text-align:right;
}

.element-mienvio .button-contact .button-vincular {
   background:var(--primary-color-hover);
   border-radius:10px;
   padding:0px 25px;
   font-size:14px;
}

.info-travel-notes {
   padding:5px 15px;
   border-radius:10px;
   box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.info-travel-notes h2 {
   font-size:18px;
   font-weight:600;
   color:var(--primary-color-hover);
}

.info-travel-notes p {
   font-size:14px;
}

.origen-top .checkpoint{
   font-size: 14px;
}
.destino-top .checkpoint{
   font-size: 14px;
}


.viajes_y_envios .menu-buttons-search {
   margin-bottom:20px;
   margin-top:20px;
   text-align:center;
   display:flex;
   flex-direction:column;
   gap:1rem;
}

@media(min-width:768px) {

   .viajes_y_envios .menu-buttons-search .item-button {
      margin-right:10px;
   }
   .viajes_y_envios .menu-buttons-search .item-button:last-child {
      margin-right:0;
   }
   .viajes_y_envios .menu-buttons-search .lupa {
      float:right;
   }
}

/* DISEÑO NUEVO DE CARDS */

.new-card {
   box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
   padding:15px;
   border-radius:10px;
   margin-bottom:20px;
   border-left:10px solid var(--background-grey);
   cursor:pointer;
}

@media(min-width:768px) {
   .new-card {
      margin-bottom:0px;
   }
}

.new-card:last-child {
   margin-bottom:0;
}

.new-card .two-columns-grid {
   display:grid;
   grid-template-columns: 1fr 4fr;
}

.new-card .two-columns-grid .left-content {
   border-right:1px solid var(--grey);
   text-align:center;
   padding-right:15px;
   display: flex;
    flex-direction: column;
    justify-content: center;
}

.new-card .two-columns-grid .left-content .photo-envio {
   margin-top:10px;
   margin-bottom:10px;
}

.new-card .two-columns-grid .left-content .photo-envio img {
   width:75px;
   max-height:100px;
   border-radius:10px;

}

.new-card .two-columns-grid .left-content .icon-type {
   margin-bottom:10px;
}

.new-card .two-columns-grid .left-content .icon-type i {
   font-size:25px;
   color:var(--primary-color);
}

.new-card .two-columns-grid .left-content .info {
   display:flex;
   flex-direction:column;
}

.new-card .two-columns-grid .left-content .info.info-peso {
   align-items:center;
}

.new-card .two-columns-grid .left-content .info p {
   margin:0;
}

.new-card .two-columns-grid  p.title {
   font-size:14px;
   text-transform:uppercase;
   font-weight:400;
   color:var(--primary-color-hover);
}

.new-card .two-columns-grid p.value {
   font-size:14px;
   font-weight:500;
   color:var(--grey);
}

.new-card .two-columns-grid .right-content {
   text-align:center;
}

.new-card .two-columns-grid .right-content .origen-destino {
   font-size:14px;
   position:relative;
   padding-left:15px;
   }

   .new-card .two-columns-grid .right-content .origen-destino p {
      margin:4px 0px;
   }

.new-card .two-columns-grid .right-content .origen {
text-align:left;
}

.new-card .two-columns-grid .right-content .destino {
   padding-top:4px;
   text-align:left;
}

.new-card .two-columns-grid .right-content .fecha {
   text-align:left;
}



.new-card .two-columns-grid .right-content .more-info {
   padding-left:15px;
}

.new-card .two-columns-grid .right-content .more-info p {
   margin:4px 0px;
}

.new-card .valoraciones-usuario {
   display:flex;
   align-items:center;
   justify-content:center;
   gap:1rem;
   background:var(--background-grey);
   padding:3px 10px;
   border-bottom-left-radius:10px;
   color:var(--white);
   font-size:12px;
   font-weight:300;
   transform:translate(15px, -15px);
   margin-bottom: 5px;
}

.new-card .valoraciones-usuario .name-user {
   font-size:16px;
   color:var(--primary-color-hover);
}

.new-card .tarifa-propuesta {
   width: 100%;
    grid-column: 1 / span 2;
    display:flex;
    justify-content:end;

}

.new-card .tarifa-propuesta .tarifa {
   text-align:center;
   background:var(--primary-color-hover);
   color:var(--white);
   font-size:14px;
   font-weight:300;
   transform: translate(15px, 15px);
   padding: 3px 25px;
}


.new-card .tarifa-propuesta span {
   font-weight:500;
   font-size:16px;
}


 .stars {
   --percent: calc(var(--rating) / 5 * 100%);
   display: inline-block;
   font-size: 12px;
   line-height: 1;
 }
 .stars::before {
   font-family: "FontAwesome";
   content: "\f005 \f005 \f005 \f005 \f005";
   letter-spacing: 3px;
   background: linear-gradient(90deg, #f2b01e var(--percent), var(--white) var(--percent));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
 }


/* ARREGLOS PARA ENVIOS */

@media(min-width:768px) {
   .new-card.card-envio .two-columns-grid .right-content .more-info {
      grid-template-columns:3fr 1fr;
      text-align:left;
   }
}


/* .viajes_y_envios .list-elements .element {
   box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
   padding:15px;
   border:1px solid var(--background-grey);
   border-radius:10px;
   margin-bottom:20px;
   border-left:10px solid var(--background-grey);

}

.viajes_y_envios .list-elements .element:last-child {
   margin-bottom:0;
}

.viajes_y_envios .list-elements .element .element-wrapper {
   margin:0;
}

.viajes_y_envios .list-elements .element .element-wrapper .icon-tip {
   border:1px solid var(--primary-color);
}

.viajes_y_envios .list-elements .element-aditional-info .information {
   margin-top:10px;
   font-size:10px;
   line-height:12px;
   width:100%;
   margin-bottom:10px;
} */

/* DISEÑO CARD ENVIOS */

.element-envio .top-content {
   display:flex;
   gap:1rem;
   margin-bottom:20px;
}

.element-envio .top-content .right-content {
   width:85%;
}





.element-envio .top-content .right-content .icon .line-travel {
   width:80px !important;
}

.element-envio .top-content .image {
   width:15%;
}

.element-envio .top-content .image img {
   width:100%;
   border-radius:10px;
   box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.element-envio .top-content .right-content p {
   margin:0;
}

.element-envio .top-content .right-content .title-product {
   font-size:18px;
   font-weight:600;
}

.element-envio .top-content .right-content .origen-destino {
   font-size:16px;
   margin:5px 0px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: clip;
   font-size:14px;
}

.element-envio .top-content .right-content .origen-destino * {
   display:inline-block;
}

.element-envio .top-content .right-content .origen-destino p {
   transform:translate(0px, -5px);
}



.element-envio .top-content .right-content .origen-destino .icon {
   position:relative;
   display:flex;
   align-items:center;
   color:var(--primary-color-hover);
   transform:translateX(-10px);
   display:inline-flex;
}

.element-envio .top-content .right-content .origen-destino .icon i {
   transform:translateX(30px);
   z-index:999;
   font-size:24px;
}

.element-envio .top-content .right-content .origen-destino .icon .line-travel {
   width: 100px;
   height: 2px;
   background: var(--primary-color-hover);
   transform: translateX(-5px);
   border-radius: 10px;
   position:relative;
}

.element-envio .top-content .right-content .origen-destino .icon .line-travel:after {
   content:"";
   width:5px;
   height:5px;
   background:var(--primary-color-hover);
   position:absolute;
   right:0;
   border-radius:50%;
   top: 50%;
    transform: translateY(-50%);
}


.element-envio .top-content .right-content .origen-destino i {
   font-size:20px;
}

.element-envio .top-content .right-content .fecha {
   font-size:12px;
   display:flex;
   gap:0.5rem;
   flex-direction:column;
}

.element-envio .bottom-content {
   background:transparent;
   padding:10px 15px;
}

.element-envio .bottom-content .more-details {

}

.element-envio .bottom-content .more-details p {
   margin:0;
   padding:5px 15px;
   border-radius:20px;
   background:var(--primary-color);
   font-size:12px;
   color:var(--white);
   font-weight:500;
}

/* DISEÑO CARD VIAJES */

.element-viaje .origen-destino-wrapper {
   display:flex;
   justify-content:space-between;
   align-items:center;
   margin-bottom:20px;
}

.element-viaje .origen-destino-wrapper p {
   font-size:14px;
   margin:0;
}

.element-viaje .origen-destino-wrapper i {
   font-size:20px;
   color:var(--primary-color-hover);
   position:relative;
}


.element-viaje .fecha-peso-wrapper {
   display:flex;
   justify-content:space-between;
   margin-bottom:20px;
}


.element-viaje  .icon {
   position:relative;
   display:flex;
   align-items:center;
   color:var(--primary-color-hover);
   transform:translateX(-10px);
   display:inline-flex;
}

.element-viaje  .icon i {
   transform:translateX(30px);
   z-index:999;
   font-size:24px;
}

.element-viaje  .icon .line-travel {
   width: 100px;
   height: 2px;
   background: var(--primary-color-hover);
   transform: translateX(-5px);
   border-radius: 10px;
   position:relative;
}

.element-viaje  .icon .line-travel:after {
   content:"";
   width:5px;
   height:5px;
   background:var(--primary-color-hover);
   position:absolute;
   right:0;
   border-radius:50%;
   top: 50%;
    transform: translateY(-50%);
}


.element-viaje .fecha-peso-wrapper p {
   margin:0;
}


.element-viaje .fecha-peso-wrapper .fecha  {
   display:flex;
   align-items:center;
   gap:0.5rem;
}


.element-viaje .fecha-peso-wrapper .fecha .value {
   font-size:12px;
   font-weight:500;
}

.element-viaje .fecha-peso-wrapper i {
   font-size:18px;
}

.element-viaje .peso-wrapper {
   display:flex;
   align-items:center;
   gap:0.5rem;
   font-size:12px;
   font-weight:500;
}



.element-viaje .bottom-content {
   background:transparent;
   padding:10px 15px;
}

.element-viaje .bottom-content .more-details {

}

.element-viaje .bottom-content .more-details p {
   margin:0;
   padding:5px 15px;
   border-radius:20px;
   background:var(--primary-color);
   font-size:12px;
   color:var(--white);
   font-weight:500;
}

.sin-transacciones {
   text-align:center;
}

.filtros-viajesyenvios{
   text-align: center;

   display:flex;
   justify-content:center;
   gap:0.2rem;
}

.filtros-viajesyenvios.segundo-bloque {
   gap:0;
}

@media(max-width:768px) {
   .menu-buttons-search {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      margin: 20px 0px;
      text-align: center;
      flex-direction: column;
   }




/*    .viajes_y_envios .etiqueta-fecha{
      width: 15%;
      display: flex !important;
      flex-direction: row;
      align-items: flex-end;
      flex-wrap: nowrap;
      align-content: center;
      justify-content: center;
      margin-left: 40px;
   }

   .filtros-viajesyenvios .fecha{
      margin-top: -45px !important;
      margin-left: 60px !important;
      width: 47% !important;
      padding-left: 20px !important;
      padding-right: 20px !important;
      font-size: 14px !important;
   } */

   .viajes_y_envios .menu-buttons-search .primer-bloque{
      display:flex;
      flex-direction:column;
      width:100%;
   }

   .viajes_y_envios .menu-buttons-search .primer-bloque input {
      width:initial;
   }
   .viajes_y_envios .menu-buttons-search .segundo-bloque{
      width: 100%;
    gap: 1rem;
    justify-content: space-between;
   }


}

.viajes_y_envios .capa-mensaje-no-resultados{
   text-align: center;
   font-size: 14px;
   width: 100%;
}

.viajes_y_envios .etiqueta-fecha{
   display: none;
}

.filtros-viajesyenvios .fecha{
   text-align: center;
   font-size: 14px;
   margin-left: 5px;
   vertical-align: middle;
   background: var(--background-grey);
   border: none;
   border-radius: 10px;
   padding: 5px 20px;
   color: var(--pseudo-black);
   height: 32px;
   width:150px;
}


.input-date-custom {
   width: 100%;
   border: none;
   padding: 9px;
   height: 44px;
   line-height: 44px;
 }


@media(max-width:768px) {
   .input-group-fecha {
      display:flex;
      align-items:center;
    }
    .input-group-fecha label {
      display:block;
      width:35%;
    }
    .input-group-fecha input {
      width:65% !important;
    }

}

@media(min-width:768px) {
   .input-group-fecha label {
      display:none;
   }
}


/* LISTA DE CHAT*/
.mi_chats .special-container-wrapper-color-primary {
   padding:0;
   margin-bottom:40px;
   overflow: visible;
}

.mi_chat .special-container-wrapper-color-primary {
   margin-bottom:0px;
}



.mi_chats .list-chats .item-chat {
   display:flex;
   justify-content:space-between;
   gap:1rem;
   align-items:center;
   padding: 10px 20px;
   border-bottom:4px solid var(--primary-color-hover);
   color:initial;
   text-decoration:initial;
}

.mi_chats .list-chats {
   display:flex;
   flex-direction:column;
   border-radius:10px;
}
.mi_chats .list-chats .item-chat:last-child {
   border-bottom:none;
}


.mi_chats .list-chats .item-chat .user-image .image {
   max-width:50px;
   min-height: 50px;
   min-width: 50px;
   max-height:50px;
   border-radius:50%;
   overflow:hidden;
}

.mi_chats .list-chats .item-chat .user-image img {
   width:100%;
   /*height: 100%;*/
   height: 50px;
}

.mi_chats .list-chats .item-chat p {
   margin:0;
}

.mi_chats .list-chats .item-chat .user-content {
   width:100%;
}

.mi_chats .list-chats .item-chat .user-content div.user-name-wrapper {
   display:flex;
   align-items:center;
   gap:0.5rem;
   max-width: 100px;
}

.mi_chats .list-chats .item-chat .user-content p.user-name {
   font-weight:500;
   font-size:20px;
}

.mi_chats .list-chats .item-chat .user-content p.user-text {
   font-size:10px;
   color:var(--text-chat);
   display: -webkit-box;
    max-width: 200px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.mi_chats .list-chats .item-chat .user-extra p {
}

.mi_chats .list-chats .item-chat .user-extra p.user-time {
   font-size:10px;
   color:var(--text-chat);
}



.mi_chats .list-chats .item-chat  div.user-notification-inner {
   position:relative;
   width: 17px;
    height: 17px;
    background:var(--primary-color);
    border-radius:50%;

}

.mi_chats .list-chats .item-chat div.user-notification-inner span {
   position:absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   font-size:12px;
   color:var(--white);
}

/* CHAT INDIVIDUAL */


.mi_chat .sub-menu-navigation {
   justify-content:flex-start;
   gap:1rem;
   max-height: 52px;
   overflow: hidden;
}

.mi_chat .sub-menu-navigation .arrow {
   position:relative;
}

.mi_chat .user-chat-navigation {
   color:white;
   text-decoration: none;
   display:flex;
   gap:0.5rem;
   align-items:center;
   width: 100%;
   justify-content: space-between;
}

.mi_chat .user-chat-navigation .user-image .image {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  overflow: hidden;
  background: white;
}

.mi_chat .user-chat-navigation .user-image .image img {
   width:100%;
}

.mi_chat .user-chat-navigation .user-text {
   line-height:18px;
}

.mi_chat .user-chat-navigation p {
   margin:0;
}

.mi_chat .user-chat-navigation .status {
   color:var(--success-color);
   font-size:10px;
}

.mi_chat .user-chat-navigation .extradata {
   font-size:10px;
   color: var(--text-chat);
}

.mi_chat .conversation-wrapper {

   position:relative;
   display:flex;
   align-items:flex-end;
   padding-bottom:80px;
}

.mi_chat .conversation-wrapper .conversation {

    overflow: auto;
    scrollbar-gutter: stable;
    width: 100%;
    height: calc(var(--app-height) - 360px);

}

.mi_chat .conversation-wrapper .text > div {
   display:inline-block;
   padding:5px 15px;
   margin:5px 15px;
   max-width:70%;
   font-size:14px;
   text-align:left;
}

.mi_chat .conversation-wrapper .time-text {
   font-size:12px !important;
   padding:0px 25px !important;
   display:block !important;
   max-width:100% !important;
   margin:0 !important;
}

.mi_chat .conversation-wrapper .text-send .time-text {
   text-align:right
}



.mi_chat .conversation-wrapper .text-received .time-text {
   text-align:left;
}


.mi_chat .conversation-wrapper .text-send {
   text-align:right;
}

.mi_chat .conversation-wrapper .text-send .text-inner {
   background:var(--primary-color-hover);
   color:var(--white);
   border-radius:10px 10px 0px 10px;
}

.mi_chat .conversation-wrapper .text-received {
   text-align:left;
}

.mi_chat .conversation-wrapper .text-received .text-inner {
   background:var(--background-grey);
   border-radius:0px 10px 10px 10px;
}

.mi_chat .input-wrapper {
   position:absolute;
   bottom:0;
   width:100%;
}

.mi_chat .input-wrapper .send-message {
   width:100%;
   border-radius:10px;
   background:var(--background-grey);
   padding: 10px 43px 10px 10px;
   box-sizing:border-box;
   min-height: 58px;
   max-height: 58px;
   border:none;

}

.mi_chat .input-wrapper .send-message input {
   background-image: initial;
   padding-right: 34px;
}

.mi_chat .input-wrapper .send-message span.text-input__label {
   padding:10px;
}

.mi_chat .bloque-borrar-chat{
   cursor: pointer;

}

/*
.text-send + .text-received .time-text {display: block !important;}
.text-received + .text-send .time-text {display: block !important;}
*/

.accesodirecto {padding: 8px; transition: 1s;     display: flex;     gap: 0.5rem;}
.accesodirecto:hover { background: #ffffff14; border-radius: 5px;}

.plataforma {
    width: 90%;
    border: dotted 2px #ffa000;
    margin:10px;
}

.plataforma .plataforma-titulo {
    padding: 2px;
    width: initial;
    display: block;
    color: #f14f0ef7;
}


.mi_chat .conversation-wrapper .text.plataforma > div.text-inner {

  width: initial;
  max-width: initial;
}

#plane-send-message {  
   position: absolute;
    right: 20px;
    top: 13px;
    color: green;
  }

.caja-subtitulo-chats{
   display: flex;
}

#ayuda-enlace-precio-chat{
   display: block;
    padding: 3px;
    font-size: 14px;
    text-align: center;
    background: #5c9bd4;
    border-radius: 10px;
    margin-top: -15px;
    margin-bottom: 5px;
}
#ayuda-enlace-precio-chat a{
   text-decoration: none;
   color: white;
}

.mi_chat ons-alert-dialog{
   overflow: visible;
}

.mi_chat .sub-menu-navigation{
   overflow: visible;
}

.mi-chat .alert-dialog-container{
   overflow: visible;
}

.mi_chat .alert-dialog{
   top: 200%;
}

.list-chats .papelera-borrar{
   /*right: 10px;
   top: 8px;*/
   position: initial;
   color: black;
   z-index: 10;
}

.list-chats .alert-dialog-container{
   overflow: visible;
}

.list-chats ons-alert-dialog{
   overflow: visible;
}

.list-chats .sub-menu-navigation{
   overflow: visible;
}

.list-chats .alert-dialog{
   position: fixed;
}

.list-chats .content-chat{
   border-bottom: 3px solid #153352;
   display: flex;
   flex-direction: row;
   width: 100%;
}

.list-chats .left-content{
   width: 95%;
   display: flex;  
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: center;
}
.list-chats .right-content{
   width: 5%;
   display: flex;  
   align-items: center;
   justify-content: center;
}

@media(max-width:768px) {
   .mi_chats .list-chats .item-chat .user-content{
      margin: -7px;
   }
   
   .mi_chats .list-chats .item-chat .user-content div.user-name-wrapper {
      display:flex;
      align-items:center;
      gap:0.5rem;
      max-width: 100px;
      min-width: 100px;
   }

   .mi_chats .list-chats .item-chat .user-content p.user-text {
      max-width: 100px !important;
   }

   .mi_chats .list-chats .item-chat .user-extra p.user-time{
      font-size: 10px;
      color: var(--text-chat);
      margin-left: -12px;
      max-width: 55px;
   }

   .mi_chats .list-chats .item-chat{
      padding: 10px 10px;
   }
   .list-chats .right-content{
      width: 7%;
   }
}
.info-user {
   display:flex;
   gap:1rem;
   align-items:center;
}

.info-user .photo-user {
   width:75px;
   height:75px;
   display:flex;
   justify-content:center;
   align-items:center;
   background:var(--primary-color);
   border-radius:50%;
   position:relative;
   overflow:hidden;
}

.info-user .photo-user .user-icon {
   font-size:35px;
   color:var(--white);
}

.info-user .photo-user .photo-icon {
   position:absolute;
   left: 50%;
    transform: translateX(-50%);
    bottom:0;
    width: 100%;
    height:40%;
    text-align: center;
    background:var(--primary-color-hover);
    opacity:0.5;

}

.info-user .photo-user .photo-icon i {
   color:var(--white);
}

.info-user .photo-profile{
   width: 100%;
}

.photo-profile img{
   width: 100%;
}


.info-user .right-user{
   display:flex;
   flex-direction:column;
   gap:0.2rem;
}

.info-user .right-user h1 {
   font-size:24px;
   font-weight:600;
   margin:0;
}

.info-user .right-user p {
   margin:0;
   font-size:14px;
}

.info-user .right-user p.capa-verificada span {
   padding-right:5px;
}
.info-user .right-user p.capa-verificada span.verificada {
   color:var(--success-color);
}

.info-user .right-user p.capa-verificada span.no-verificada {
   color:var(--error-color);
}

.list-options-user {
   display:flex;
   flex-direction:column;
   margin-top:25px;
   gap:1rem;
   margin-bottom:40px;

}

.list-option.logout-button {
   padding: 5px 15px !important;
}

.list-option.enlace-whatsapp{
   padding: 18px 15px !important;
   margin: 0px 0px !important;   
}

.list-options-user .list-option {
   display:flex;
   gap:1rem;
   align-items:center;
   position:relative;
   margin: 10px 0px;
   background:initial;
   text-transform:initial;
   padding:initial;
   line-height:1;
}




.list-options-user .list-option i {
   font-size:16px;
   color:var(--primary-color);
}

.list-options-user .list-option h2 {
   margin:0;
   font-weight:500;
   font-size:16px;
   text-align:left;
   color:var(--primary-color-hover);
}


.info-version {
   position:absolute;
   width:100%;
   bottom:0;
   left:0;
   height:50px;
   background:var(--background-grey);
   font-size:12px;
   display:flex;
   align-items:center;
   justify-content:center;
}

/* NEW EXPANDABLE MENU ITEMS */

.element-item-my-account.list-item--material:first-child {
   box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}

.element-item-my-account {
   padding:5px 15px;
   background-image:none !important;
   border:1px solid var(--background-grey);
   border-radius:10px;
   box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
   cursor:pointer;
}



.element-item-my-account .list-item__top {
   align-items:center;

}

.element-item-my-account .list-item__top > div {
   padding:0;
}

.element-item-my-account .button-save-wrapper {
   margin-top:10px;
}

.element-item-my-account .general-setting-element {
   margin:0;
}

.input-my-account {
   width: 100%;
   border-radius: 10px;
   overflow: hidden;
   box-sizing: border-box;
}

.input-my-account input {
   font-size:14px;
}

.input-my-account .textarea {
   font: inherit;
   background: 0 0;
   vertical-align: top;
   outline: 0;
   line-height: 1;
   font-family: -apple-system,'Helvetica Neue',Helvetica,Arial,'Lucida Grande',sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   border: none;
   background-color: transparent;
   letter-spacing: 0;
   box-shadow: none;
   color: #1f1f21;
   color: var(--input-text-color);
   padding: 0;
   margin: 0;
   width: auto;
   font-size: 16px;
   font-size: var(--text-input-font-size);
   height: 31px;
   height: var(--text-input-height);
   font-weight: 400;
   font-weight: var(--font-weight);
   box-sizing: border-box;
}

#page-micuenta .error{
   border: 1px solid red;
}

.sub-head .sub-text{
   font-size:14px;
}

#infopropia{
   min-height: 100px;
   border: none;
}

.cont-movil { display: flex;
   justify-content: flex-start;
   align-content: center;
   align-items: center;
   gap: 20px;
   flex-wrap: wrap;
   justify-content: space-around;
}

.cont-movil .custom-input {flex: 1 1 50%;}

#cont-validar-codigo {
   border: dotted red 2px;
   margin: 8px 0px;
   padding: 0px 10px 10px 10px;
}

.enlace-perfil-micuenta{
   font-weight: 600;
   margin: 0;
   text-align: left;
   line-height: 1.5;
   font-size: 14px;
   text-decoration: none;
   color: rgb(31, 31, 33);
}

.validar-silt-deshabilitado{
  background-color: #a0b3cc; /* azul grisáceo */
  color: #e1e5ea;            /* texto gris claro */
  border: none;
  opacity: 0.6;
}

#caida-validar-silt{
   display: none;
}