:root {
    --color-verde-bajo: #85B92D;
    --color-verde: #007A5E;
    --color-verde-d1: #045040;
    --color-verde-oscuro: #012D25;
    --color-amarillo :#FAB427;
    --color-naranja: #EC6E12;
    --color-gris: #F1F2F5;
    --color-dark: #272833;
    --color-dark-l1: #30213F;
    --color-dark-l2: #393A4A;
    --color-dark-d1: #1C1C24;
    --color-dark-d2: #111116;
    --color-teal-bajo: #EBFEF6;
    --color-teal: #50D2A0;
    --color-teal-l1: #2FD8A3;
    --color-teal-l2: #A4F6D5;
}
* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-family: 'Rubik', sans-serif
}
.opttran {
    background-color: #FFFFFF;
    border-radius: 8px;
    padding: 10px 16px;
    text-decoration: none;
    font-weight: 200 !important;
    font-size: 14px;
    color: #272833 !important;
}
.opttran.opttran-pe {
    background-color: #86BC25 !important;
    color: #FFFFFF !important;
    font-weight: 700!important;
    text-shadow: 1px 1px 0px #878787;
}

/* --- Tooltip icon dentro de botones del modal --- */
#portal-links-target > a.opttran{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-right: 38px;
}

#portal-links-target > a.opttran .portal-info{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.tooltip, .tooltip *{
    pointer-events: none !important;
}

.tooltip-inner{
    max-width: 260px;
    white-space: normal;
}

.portal-info {
    cursor: pointer;
    touch-action: manipulation;
}

.portal-links > a.opttran,
#portal-links-target > a.opttran {
    padding-right: 38px;
}

.modal-registrate{ max-width: 614px; }
.modal-content { overflow: visible; }
.close-modal { position: absolute; top: -22px; right: -1px; background: none; border: none; font-size: 1.5rem; color: #FFFFFF; line-height: 1; cursor: pointer; padding: 0; width: 20px; }
.close-registrate-modal { position: absolute; top: 12px; right: 16px; background: none; border: none; font-size: 1.5rem; color: #6B6C7E; line-height: 1; cursor: pointer; padding: 0; width: 20px; }

@media (max-width: 767.98px) {
    .modal-body { border-top: none !important; }
    .opttran {
        margin-top: 20px;
        box-shadow: 3px 3px 7px 1px rgba(209, 209, 209, 1);
        -webkit-box-shadow: 3px 3px 7px 1px rgba(209, 209, 209, 1);
        -moz-box-shadow: 3px 3px 7px 1px rgba(209,209,209,1);
        font-size: 14px;
        color: #272833 !important;
        min-width: 167px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    .modal-title{ color: #111116; font-size: 22px; }
}
.sort-pages.modify-pages {
    display: flex;
    align-items: center;
    background-color: #ffffff;
}

.heading {
    width: 15%;
    text-align: center;
}
.headerCl {
    display: flex;
    flex-wrap: wrap;
    height: 80px;
    align-items: center;
    width: 63%;
    color: #6B6C7E;
    font-weight: 400;
    
}
.pestaña {
    padding: 0 21px;
}
.pestañaLink {
    vertical-align: -webkit-baseline-middle;
}
.headerC3 {
    display: flex;
    font-weight: 500;
    font-size: 14px;
    gap: 10px;
}
.headerCl .pestaña a {
    color: #6B6C7E;
}
.headerCl .pestaña a:hover {
    color: #0056b3;
}
.C-ayuda, .M-pagos {
    display: flex;
    align-items: center;
}

.C-ayuda p a, .M-pagos p a:hover {
    text-decoration:none;
}

.pestañaActiva {
    padding: 3px 21px;
    background-color: #EBFEF6;
    border-radius: 50px;
    font-weight: 600;
    border: solid #A4F6D5 1px;
}
.pestañaActiva a span {
    color: #045040;
}
.pestañaActiva a:hover { 
    text-decoration: none; 
}
// Select mobile

select.menuMobile {
	padding: 3px 0px;
    background-color: #EBFEF6;
    border-radius: 50px;
    font-weight: 600;
    border: solid #A4F6D5 1px;
}

option.pestanaMobile {
  color: slategray;
  background-color: #fff;
  text-indent: 0;
}
.header-responsive {
    display: none;
}
@media only screen and (max-width: 430px) {
    .headerCl {
        display: none;
    }
    .header-responsive {
        display: block;
    }
}
@media (max-width: 700px) {
  .navbar-nav .nav-item{
    display: block !important;
  }
}