:root {
    --primary-color: #049dd4;
    --secondary-color: #049dd4;
    --light-color: #E0EAF4;
    --company-logo: url('images/logo.png');
    --routes-map: url('images/routes-map.svg');
    --premium-color: ;
    --vip-color: ;
    --regular-color: ;
    --economic-color: ;
    --cover-image: url('images/cover.jpg');
    --slider-bg:#009bd5;
    --bg-medio-pago:#E0EAF4;
    --bg-darker: #495057;
    --bg-compra-empresa:#ffffff;
    --title-contact-color-sendoary:#ec1d23;
    --bg-empresas-aliadas: #fafafa;
    --section-header-color: #d83831;
} 

.company-logo {
    max-height: 40px;
    content: var(--company-logo);
}

.routes-map {
    content: var(--routes-map);
}

.cover {
    content: var(--cover-image);
}

body {
    --bs-dark-rgb: 44, 56, 64;
    --bs-accordion-active-bg: white !important;
}

div.bg-light {
    background-color: var(--light-color) !important;
}

div.bg-secondary, section.bg-secondary {
    background-color:  var(--primary-color) !important;
}

.why-icon {
    width: 50%;
    min-width: 75px;
    max-width: 100px
}

.route-link {
    font-weight: 600;
    display: block;
    font-size: calc(16px + 0.15vw);
    color: var(--secondary-color);
    text-decoration: none;
}

.route-link:hover {
    color: #044086 !important;
    text-decoration: underline;
}

.text-200 {
    color: #D4D8DC;
}

.text-300 {
    color: #9CAAB3;
}

.text-500 {
    color: #808D9B;
}

.text-600 {
    color: #6F808D;
}

.border-200 {
    border: 1px solid #D4D8DC;
}

.border-500 {
    border: 1px solid #808D9B;
}

.bg-100 {
    background-color: #F5F5F5;
}

.bg-300 {
    background-color: #9CAAB3;
}

.bg-600 {
    background-color: #6F808D;
}

input.search-bar-input {
    width: 100%;
    border-width: 0;
}

a.footer-link {
    font-weight: 600;
    color: #FFFFFF;
    text-decoration: none;
    display: inline-block;
}

a.footer-link:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

button.accordion-button:not(.collapsed) {
    color: #2C3840;
    background-color: white;
    box-shadow: none;
}

div.accordion-item {
    border: 1px solid #D4D8DC;
}

h2.accordion-header {
    border-bottom: 1px solid #D4D8DC;
}

div.route {
    width: 12px;
    background-size: 100% auto;
    background-position: top center;
    margin: 0 10px;
}

div.route-top {
    background-image: url('images/route-top.svg');
}

div.route-stop {
    background-image: url('images/route-stop.svg');
}

div.route-bottom {
    background-image: url('images/route-bottom.svg');
}

.bg-cargo {
    background: rgb(245, 245, 245);
    background: -moz-radial-gradient(circle, rgba(245, 245, 245, 1) 0%, rgba(212, 216, 220, 1) 100%);
    background: -webkit-radial-gradient(circle, rgba(245, 245, 245, 1) 0%, rgba(212, 216, 220, 1) 100%);
    background: radial-gradient(circle, rgba(245, 245, 245, 1) 0%, rgba(212, 216, 220, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f5f5f5", endColorstr="#d4d8dc", GradientType=1);
}

.card-services {
    width: 100% !important;
    box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    -webkit-box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    -moz-box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    border: 1px solid #9CAAB3 !important;
}

.card-body {
    padding: 0 !important;
}

.btn-seleccionar {
    background-color: var(--primary-color) !important;
    border-style: none !important;
    width: 100%;
    max-width: 320px;
    border-radius: 10px !important;
}

.carousel-inner-img {
    border-radius: 0.975rem 0.975rem 0 0 !important;
}

.carousel-inner-img-md {
    border-radius: 0.975rem 0 0 0.975rem !important;
    height: 250px;
}

.card-body-discount {
    background-image: url("images/icon-discount.svg");
    background-size: contain;
    background-position-y: bottom;
    background-position-x: center;
    background-repeat: no-repeat;
    position: relative;
    z-index: 1;
}

.card-body-discount p {
    position: relative;
    z-index: 2;
    font-weight: 600;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 30%);
    padding: 5px;
}

.diagonal-line {
    position: relative;
    top: 17px;
}

.diagonal-line p {
    position: relative;
    display: inline-block;
    overflow: hidden; /* Oculta la parte de la línea que se extiende fuera del contenedor */
}

.diagonal-line p::before {
    content: '';
    position: absolute;
    top: 55%;
    left: 20%;
    width: 100%;
    height: 2px; /* Grosor de la línea */
    background-color: #9CAAB3;
    transform-origin: 0 0; /* Punto de origen de la transformación */
    transform: translateY(100%) rotate(-10deg); /* Rotación */
    z-index: 1; /* Asegura que la línea esté encima del texto */
}

.carousel-item img {
    height: 250px !important;
}

.card-md-shadow {
    width: 100%;
    max-width: 900px;
    min-width: 750px;
    height: 250px !important;
    box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    -webkit-box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    -moz-box-shadow: -1px 0px 21px -2px rgba(8, 8, 8, 0.39);
    border: 1px solid #9CAAB3 !important;
}

/* Estilos para los indicadores del carrusel dentro del modal */
#imageModal .carousel-indicators {
    bottom: 10px;
    margin-top: 0;
    margin-bottom: -37px;
}

#imageModal .carousel-indicators [data-bs-target] {
    background-color: #CFD6E0 !important;
}

.modal {
    --bs-modal-padding: 2rem !important
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding-top: 0 !important;
}

/* Estilos para los controles previo y siguiente del carrusel dentro del modal */
#imageModal .carousel-control-prev-icon {
    background-image: url('images/icon-angle-left-solid.svg') !important;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
}

#imageModal .carousel-control-prev {
    left: -35px !important;
}

#imageModal .carousel-control-next-icon {
    background-image: url('images/icon-angle-right-solid.svg') !important;
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
}

#imageModal .carousel-control-next {
    right: -35px !important;
}

.modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

.btn-filter {
    display: flex;
    align-items: center;
    color: #024089;
    font-weight: 600;
    border: 0 solid #D4D8DC;
    padding: 0.25rem 1rem;
    border-radius: 100px;
    background-color: transparent;
    transition: all 0.3s ease-in-out;
}

.btn-filter.active, .btn-filter:hover {
    background-color: #E0EAF4;
}

img.filter-icon {
    height: 15px;
    margin-right: 5px;
}

.timer {
    display: flex;
    align-items: center;
}

.digit {
    width: 24px;
    font-size: 24px;
    font-weight: bold;
    color: white;
    margin: 0 2px;
    background-color: #024089;
    text-align: center;
    border-radius: 5px;
}

.separator {
    font-size: 2em;
    font-weight: bold;
    color: #333;
}

.filter-input {
    border: 1px solid #E0E0E0;
    border-radius: 5px;
    padding: 0.35rem 0.75rem;
    width: 100%;
    max-width: 300px;
    transition: all 0.3s ease-in-out;
}

div.card-header {
    background-color: white;
    border-color: #D4D8DC !important;
}

.form-control {
    color: #2C3840 !important;
}

.accordion-form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #7E7B7B !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent !important;
    background-clip: padding-box !important;
    border: var(--bs-border-width) solid #CBC9C9 !important;
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.form-floating label {
    color: #7E7B7B !important;
}

.form-control:focus + .form-label {
    color: #7E7B7B !important;
    background-color: transparent !important;
}

.form-control.focused {
  background-color: var(--bs-body-bg);
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}

.form-control.focused.is-invalid {
	border-color: var(--bs-form-invalid-border-color);
	box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb),.25);
}

.form-floating > .form-control.label-shown {
  position: relative;
  z-index: 3;
  background-color: transparent;
}

.form-floating > .form-control.label-shown + label {
  transform: none !important;
}

.form-floating > .form-control.placeholder-shown:focus::placeholder {
	color: var(--bs-secondary-color);
	opacity: .7;
}

.selector-link {
    border-bottom: 2px solid #9CAAB3;
    color: #808D9B;
    font-weight: 600;
}

.selector-link:hover, .selector-link.active {
    border-bottom: 2px solid #03376C;
    color: #03376C;
}

a.btn-primary, button.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

span.text-primary, a.text-primary {
    color: var(--primary-color) !important;
    font-weight: 600;
}

.modal.passengers {
    padding: 0 !important;
}

.modal-dialog.passengers {
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.modal-content.passengers {
    border-radius: 0;
}

.nav-link {
    color: var(--primary-color) !important;
    font-weight: 600 !important;
}

.btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-outline-primary:hover {
    color: white !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-outline-primary > .link-icon, .link-primary > .link-icon {
    filter: invert(62%) sepia(78%) saturate(4174%) hue-rotate(164deg) brightness(97%) contrast(96%);
}

.btn-outline-primary:hover > .link-icon {
    filter: invert(100%) sepia(1%) saturate(8%) hue-rotate(41deg) brightness(104%) contrast(100%);
}

.form-control.readonly {
    background-color: #F5F5F5;
    color: #2C3840 !important;
}

.wrapper-items-default {
    width: 100%;
    height: auto;
    background: #193F84;
    position: relative;
    bottom: 3%
}

.wrapper-items-default > .items-default {
    position: absolute;
    width: 100%;
    bottom: 4%;
}

@media (min-width: 992px) {
    .wrapper-items-default {
        background: transparent;
    }
}

.wrapper-items-default.sticky {
    width: 100%;
    height: auto !important;
    background:var( --primary-color);
    transition: all 0.1s ease-in-out 0s;
}

@media (min-width: 992px) {
    .wrapper-items-default.sticky {
        width: 100%;
        position: sticky !important;
        z-index: 900;
        top: 0px;
        padding: 0.4rem;
        background:var( --primary-color);
    }

    .wrapper-items-default.sticky > .items-default {
        position: relative;
        bottom: 0;
    }
}

.login-social-button {
    border: 1px solid #6F808D;
    border-radius: 5px;
}

a:hover > .login-social-button {
    background-color: #F5F5F5;
}

button.btn-secondary, a.btn-secondary {
    background-color: #024089;
}

button.btn-secondary:hover, a.btn-secondary:hover {
    background-color: #074c9d;
}

a.premium-seat:hover > img {
    content: url("images/premium-seat-hover.svg");
}

a.vip-seat:hover > img {
    content: url("images/vip-seat-hover.svg");
}

a.regular-seat:hover > img {
    content: url("images/regular-seat-hover.svg");
}

a.economic-seat:hover > img {
    content: url("images/economic-seat-hover.svg");
}

.circle-icon{
    width: 40px;
    height: 40px;
    background: rgb(255, 255, 255);
    border: 1px solid #9CAAB3;
    border-radius: 30px;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    z-index: 1;
    cursor: pointer;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.icon-container {
    width: 40px;
    position: absolute;
    height: 40px;
    box-sizing: border-box;
    background-color: #fff;
    right: 20px;
    border-radius: 30px;
    z-index: 1;
    border: 1px solid #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 88px;
}

.circle-icon-mobile {
    transform: scaleY(1) rotate(90deg);
    transition: transform 0.2s linear;
}

.seat-pill {
    width: 100%;
    min-width: 150px;
    max-width: 220px;
}

.seat-pill-icon-wrapper {
    position: relative;
}

.divider {
    border-top: 1px solid #9CAAB3;
    width: 100%;
}

.image-success {
    filter: invert(44%) sepia(34%) saturate(923%) hue-rotate(100deg) brightness(87%) contrast(90%);
}

.image-cyan {
    filter: invert(69%) sepia(44%) saturate(7463%) hue-rotate(164deg) brightness(97%) contrast(96%);
}

.image-300 {
    filter: invert(75%) sepia(21%) saturate(177%) hue-rotate(160deg) brightness(87%) contrast(86%);
}

.image-500 {
    filter: invert(75%) sepia(21%) saturate(177%) hue-rotate(160deg) brightness(87%) contrast(86%);
}

.image-600 {
    filter: invert(52%) sepia(30%) saturate(224%) hue-rotate(163deg) brightness(89%) contrast(85%);
}

.image-0, image-white {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(100%) contrast(100%);

}

.text-cyan{
    color: var(--primary-color);
}


div.address {
    padding: 20px 20px;
    background-color: #E0EAF4;
    color: #01326C;
    border-radius: 15px;
    /*cursor: pointer;*/
}

div.address.active, div.address:hover {
    background-color: var(--primary-color);
    color: white;
}

h5.address-title {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
}

p.address-description {
    font-family: "Open Sans", sans-serif;
    font-size: 16px;
}

.navbar-tab-link {
    display: block;
    width: 25%;
    text-align: center;
    text-decoration: none;
}

.navbar-tab-image {
    width: 25px;
    height: 25px;
    filter: invert(77%) sepia(10%) saturate(357%) hue-rotate(160deg) brightness(86%) contrast(90%);
    display: inline-block;
    margin-bottom: 0;
}

.navbar-tab-button{
    width: 50px;
    height: 50px;
    display: inline-block;
    margin-bottom: 0;
}

.navbar-tab-link.active > .navbar-tab-image{
    filter: invert(47%) sepia(81%) saturate(2128%) hue-rotate(165deg) brightness(99%) contrast(96%);
}

.navbar-tab-text {
    margin-top: 0.2rem;
    color: #9CAAB3;
    font-weight: 500;
    font-size: 14px;
}

.navbar-tab-link.active > .navbar-tab-text {
    color: var(--primary-color);
}

/*
.company-siste{ 
}
.company-siste h2{
    color:var(--primary-color) !important;
}
.company-siste h5{
      color:var(--primary-color) !important;
}*/


.bg-darker {
  background-color: var(--bg-darker);
}

#full-banner {
  height: 80vh;
  min-height: 35vw;
  max-height: 55vw;
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.video-container-square {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.video-container iframe, .video-container-square iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
  h2 span {
      color: #ea1c24;
    }