/** ----------------------------------------------------------------------------
 *                         Todos los derechos Reservados
 *                               Softipal S.A.S 2020
 *  ----------------------------------------------------------------------------
 *  Nombre:       infoRoute.css
 *  Ruta:         /public/css/layout/route/
 *  Descripción:  Estilos Generales para la sección de información de las rutas
 *  Fecha:        29/01/2021
 *  Autor:        Alejadnro González Flórez
 *  Versión:      2.0
 *  OD:           22489479
 *  ----------------------------------------------------------------------------
 *	 			Histórico de cambios
 *  ----------------------------------------------------------------------------
 *	Fecha          OD        Autor        Descripción
 *  ----------------------------------------------------------------------------
 *     29/01/2021   22489479   AlejoFlorez0   Creación de cabecera de documentacion
       18/05/2022    ------      sLargo       se abstrayó las media queries a una carpeta aparte
 *  ----------------------------------------------------------------------------
 */

#scb_routeInfo {
  height: auto;
  padding: 5% 0% 0%;
  background-color: white;
}

#ri_listResultDiv,
#srm_routeDetail {
  position: relative;
  left: 5%;
  width: 90%;
}

#ri_listResultDiv {
  height: 254px;
  border-radius: 12px;
  background-color: #dbdbdb;
}

#lRD_routesOptions,
#ri_listResultDiv > h2 {
  position: relative;
  top: 10%;
  left: 5%;
  width: 90%;
  float: left;
}

#ri_listResultDiv > h2 {
  height: 50px;
  color: white;
  font-size: 30px;
  padding-top: 0.5%;
  border-radius: 6px;
  background-color: #004187;
  font-family: Montserrat-SemiBold;
}

#ri_filterSpecialService {
  position: relative;
  top: 7%;
  left: 42%;
  height: 14%;
  width: 23%;
  float: left;
}

.fSS_container {
  padding: 0px;
  height: 100%;
}

#inp_invalid,
#inp_bike,
#ri_all {
  position: absolute;
  top: 37%;
}

#iconDisabled {
  position: relative;
  top: 0.2vw;
  left: 50%;
  width: calc(1vw + 28px);
}

#iconBike {
  position: relative;
  top: 0.25vw;
  left: 36%;
  width: calc(1vw + 32px);
}

#iconAll {
  position: relative;
  top: 0.25vw;
  left: 72%;
  width: calc(1vw + 23px);
}

#lRD_routesOptions {
  height: 120px;
  padding-left: 6%;
}

.rO_route {
  margin: 1%;
  float: left;
  width: 7.1%;
  font-size: 19px;
  cursor: pointer;
  text-align: center;
  border-radius: 14px;
  background-color: white;
  font-family: Montserrat-SemiBold;
}

.rO_route.active,
.rO_route:hover {
  background-color: #aaafb4;
}

.rO_routeElevator {
  background-color: #ffba00;
}

.rO_routeHasBikeRack {
  background-color: #fc299a;
}

.rO_routeHasBikeRackAndElevator {
  background: linear-gradient(#ffba00, #B84FB3);
  color: black;
}

#srm_routeDetail {
  top: 5%;
  padding-top: 2%;
  background-color: white;
}

#srm_titleDetail {
  color: #004187;
  font-size: 50px;
  text-align: center;
  font-family: Montserrat-SemiBold;
}

#srm_infoContainer {
  padding: 0% 0% 5% 0%;
}

#rD_iconDisabled,
#rD_iconBike {
  width: 2vw;
}

#rD_iconBike {
  width: 3vw;
}

.rD_detailLabel {
  color: #98979c;
  font-size: 13px;
  font-family: Montserrat-Regular;
}

#rD_containerNotifu {
  width: 70%;
  padding: 1% 1% 3% 1%;
  border: 4px dashed #ffba00;
}

.rD_detailSpan {
  width: 100%;
  line-height: 12px;
  font-size: 13px;
  color: #004187;
  font-family: Montserrat-Light;
}

#rD_infoUser {
  position: relative;
  top: -4px;
  font-size: 14px;
  line-height: 14px;
}

#rD_Route {
  height: 100vh;
}

.scrollable {
  max-height: 660px;
  overflow-y: auto;
}

.lT_item {
  position: relative;
  top: -8px;
  width: 80%;
  padding: 0px;
  color: #03254a;
  text-align: center;
  margin: 0px 0px 32px;
}

.rM_originFlag:before {
  background-color: #ffba00 !important;
}

.rM_destinationFlag:before {
  background-color: greenyellow !important;
}

.lT_item:before {
  position: absolute;
  left: -43px;
  top: 7px;
  width: 20px;
  height: 20px;
  content: "";
  border-radius: 50%;
  border: 3px solid #fff;
  background-color: #004187;
  box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.75);
  -webkit-box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.75);
}

.lT_item:first-child:before,
.lT_item:last-child:before {
  box-shadow: none;
  border: 3px solid #004187;
}

.lT_item:last-child {
  top: 0px;
}

.accordion.width {
  display: flex;
  height: 1200px !important;
}

.accordion.width .card {
  border: none;
  flex-grow: 0;
  flex-shrink: 1;
  flex-direction: row;
  min-width: min-content;
}

.accordion.width .card .card-header {
  font-size: 29px;
  cursor: pointer;
  text-align: center;
  border-radius: 10px;
  transform: rotate(180deg);
  writing-mode: vertical-rl;
  font-family: Montserrat-Bold;
}

.accordion.width .card .card-header:is(.collapsed) {
  color: #ffba00;
  background-color: #004187;
}

.accordion.width .card .card-header:not(.collapsed) {
  color: #004187;
  background-color: #ffba00;
}

.collapsing.width {
  width: 0;
  height: auto;
  transition: width 0.35s ease;
}

.card-body {
  height: 100%;
  padding: 0%;
}

#srm_detail {
  height: auto;
  line-height: 5px;
  padding: 0% 0% 0% 2%;
}

.srm_specificDetail {
  margin: 2% 0%;
}

.srm_detailH2 {
  color: #5b5b5f;
  font-size: 22px;
  font-family: Montserrat-Bold;
}

/*
* Estilos para Mapa
*/
#srm_routeMap {
  height: 100%;
}

#srm_mapContainerMobile {
  left: -13%;
  height: 50%;
  width: 126%;
}