/* hover en desktop - no dispositivos*/
.no-touchevents {
  table.info_habitacionContainer {
    tr:hover {
      background-color: $brand-yellow-medium;
    }
  }
}

/* desktop */
.widgets_hotels_search_mainavailabilitywidget .roomSelection .info_habitacionContainer td.reservation{
  display:none;
}

.panel-body h3 {
  margin-bottom: 0;
  border: solid 1px $colorBordes;
}
.icon-hotels-info {
  width: 18px;
  height: 18px;
  fill: $brand-brown-medium;
  vertical-align: text-bottom;
}

.tipo_regimen {
  margin: 0;
  padding: 0;
  li {
    .info_habitacionContainer {
      border-bottom: solid 1px $colorBordes;
    }
    &:last-child {
      .info_habitacionContainer:last-child {
        border-bottom: 0;
      }
    }

    //Estado seleccionado en metabuscadores
    &.regimenAlojamientoContainer {
      &:first-child {
        .info_habitacionContainer.selected-price-hotel {
          border-top-right-radius: 6px;
        }
      }
      &:last-child {
        .info_habitacionContainer.selected-price-hotel {
          border-top-right-radius: 0;
          border-bottom-right-radius: 6px;
        }
      }
      .info_habitacionContainer.selected-price-hotel {
        border: solid 1px $interactive-color;
        margin-left: -2px;
        margin-right: 0;
        width: auto;
        &:hover {
          background: $menu-hover-bg;
        }
        @media (max-width: 1024px) {
          margin-top: -2px;
          margin-left: 0;
          &:first-child {
            border-top-right-radius: 0;
          }
          &:last-child {
            border-bottom-left-radius: 4px;
            border-bottom-right-radius: 4px;
          }
        }
        .hotels-information-box {
          &:hover {
            background: none;
          }
        }
        .selected-price-hotel-container {
          background-color: $interactive-color;
          display: block;
          .icon {
            width: 16px;
            height: 16px;
            margin: 0 5px 0 15px;
            vertical-align: middle;
            &, & * {
              fill: $brand-white;
            }
          }
          .message-sel-hotel {
            color: $brand-white;
            line-height: 30px;
          }
        }
      }
    }

    &.regimenAlojamientoContainer {
      position: relative;
      clear: both;
      width: 100%;
      margin-bottom: 0;
      text-transform: none;
      .selected-price-hotel-container {
        display: none;
      }
      .regimenAlojamiento {
        font-size: $font-size-base;
        color: #74716e;
        padding: 10px;
        position: absolute;
        top: 0;
        left: 0;
        line-height: 28px;
        @include medium-weight;
        @media (min-width: $screen-md-min) {
          &.regime_exceptions {
            line-height: 14px;
            padding-left: 38px;
            width: 175px;
            span {
              position: absolute;
              left: 6px;
              top: 0;
            }
          }
        }
      }
    }
    table.info_habitacionContainer {
      width: 80%;
      float: right;
      clear: both;
      margin-right: 1px;
      border-left: solid 3px $colorBordes;
      tr {
        border-top: 1px solid $colorBordes;
        &:nth-child(2){
          border-top:none;
        }
      }
      td, th {
        display: table-cell;
        padding: 8px 15px;
      }
      .arrow_box{
        width:250px;
      }
      /*rtl:ignore*/
      .arrow_box[data-tooltip-right]  {
        left:100%;
      }
      .forfait_included {
        font-size: $font-size-small;
        font-weight: 100;
        color: $brand-grey-dark;
      }
      span {
        &.tarifa_flexible {
          font-weight: $roboto-light;
          color: $brand-green;
        }
        &.tarifa_reducida {
          font-weight: $roboto-light;
          color: $brand-grey-dark;
        }
      }
    }
    /* Anchura de las columnas */
    .info_habitacionContainer td {
      font-size:13px;
      line-height:18px;
      &.extra_services {
        width: 30%;
        padding-right:0;
        .txt_extras{
          float:none;
          margin:0;
          padding: 0;
          background: none;
          font-size:13px;
        }
        svg {
          &.icon-anyfill-prod-ski {
            width: 14px;
            height: 14px;
          }
        }
      }
      &.refundable {
        width: 18%;
        padding-right:0;
         svg {
          cursor:pointer;
          vertical-align:middle;
          width:16px;
          height: 16px;
           &, & * {
             fill: #c7c7c7;
           }
        }
      }
      &.payment {
        width: 22%;
        padding-right:0;
        font-weight: 100;
        color: #36312e;
        .tooltip-inner{
          width:300px;
        }
        svg {
          cursor:pointer;
          vertical-align:middle;
          width:16px;
          height: 16px;
          &, & * {
            fill: #c7c7c7;
          }
        }
      }
      &.price {
        width: 25%;
        text-align: right;
        font-size: 18px;
        color: $brand-grey-dark;
        @include medium-weight;
        padding-left:0;
        &.cont_tax{
          line-height:15px;
          del.oldPrice{
            display:block;line-height:14px;
          }
          .pvp_taxes{
            display:block;
            color:#8c8885;
            font-size:12px;
            font-weight:300;
          }
        }
        .price {
          display: inline-block;
          font-size: 16px;
          .symbol{
            font-size: 0.8em;
          }
          &.eur, &.usd, &.gbp {
            font-size: 20px;
          }
        }
        del.oldPrice{
          display: inline-block;
          color:#74716e;
          .price {
            font-size: $font-size-base;
            text-decoration: line-through;
          }
          .symbol{
            display: none;
          }
        }
        svg {
          cursor:pointer;
          vertical-align:middle;
          width:16px;
          height: 16px;
          &, & * {
            fill: #c7c7c7;
          }
        }
        svg.icon-anyfill-graph-exclusive {
          width:18px;
          height: 18px;
          &, & * {
            fill: $brand-green;
          }
        }
        .tooltip-inner {
          font-size: 14px;
        }
      }
      &.reservation{
        padding-left:0;
        text-align: right;
        width:16%;
        svg {
          cursor:pointer;
          vertical-align:middle;
          width:16px;
          height: 16px;
          &, & * {
            fill: #c7c7c7;
          }
        }
      }
      .total_price_text {
        font-size: 11px;
        font-weight: $roboto-light;
        margin-right: 4px;
        text-transform: lowercase;
        white-space: nowrap;
        color: $brand-copy-light;
      }
      .amount {
        font-size: 18px;
        @include medium-weight;
        color: $brand-grey-dark;
      }
      .oldPrice * {
        font-size: $font-size-small;
        font-weight: 100;
        color: $brand-copy-light;
      }
      .symbol {
        font-size: 12px;
      }
      .tooltip-inner {
        font-size: 14px;
      }
    }
  }
}
/* Regimenes alojamiento */
.regimenAlojamiento {
  span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 5px;
    vertical-align: top;
    .icon {
      width: 25px;
      height: 25px;
      vertical-align: top;
      &, & * {
        fill: #858f9a;
      }
    }
  }
}

/* tablet */
@media (min-width: $grid-float-breakpoint) and (max-width:$screen-sm-max) {
  .tipo_regimen {
    li{
      &.regimenAlojamientoContainer {
        .regimenAlojamiento {
          position: absolute;
          line-height: 23px;
          span {
            margin-top: 0;
            margin-left: 0;
          }
        }
        table.info_habitacionContainer {
          width: 100%;
          float: none;
          border-left:0;
          tr {
            border-top: 1px solid $colorBordes;
            &:nth-child(2){
              border-top: 1px solid $colorBordes;
            }
            &.rate-odd {
              background-color: #FFF;
            }
          }
        }
        /* tabla con forfait */
        table.info_habitacionContainer.Ff {
          width: 100%;
          float: none;
          tr {
            border-top: 1px solid $colorBordes;
            td {
              display: inline-block;
              padding: 0 15px;
              &.refundable, &.payment {
                width: 50%;
              }
              &.extra_services {
                width: 45%;
              }
              &.price {
                width: 27%;
              }
              &.reservation {
                width: 23%;
                text-align: right;
                margin-bottom: 15px;
              }

            }
          }
        }
      }
    }
  }
}

/* mobile */
@media (max-width: $grid-float-breakpoint-max) {
  .roomSelection {
    .tipo_regimen {
      li {
        &.regimenAlojamientoContainer {
          margin-bottom: 0;
          text-transform: none;
          line-height: 23px;
          position: relative;
          .regimenAlojamiento {
            line-height: 23px;
            color: #74716e;
            position: relative;
            span {
              background-position: 85% 85%;
            }
          }
          table.info_habitacionContainer {
            width: 100%;
            float: none;
            border-left: 0;
            tr {
              display: table-row;
              border-bottom: solid 1px $colorBordes;
              &.rate-odd {
                background-color: #FFF;
              }
              &:last-child {
                border-bottom: none;
              }
              td {
                display: block;
                padding: 5px 5px 0 5px;
                width: 100%;
                span[data-tooltip-hoverarea] {
                  left: 0;
                  position: initial;
                  padding: 10px 0;
                  .arrow_box[data-tooltip-right] {
                    left: 0;
                    top: auto;
                  }
                }
                .arrow_box {
                  width: 218px;
                }
                &.payment {
                  span[data-tooltip-hoverarea] {
                    svg {
                      margin-left: 5px;
                    }
                  }
                }
                &.price {
                  text-align: right;
                  display: inline-block;
                  width: 61%;
                  .oldPrice {
                    display: block;
                  }
                }
                &.reservation {
                  display: inline-block;
                  width: 37%;
                  text-align: right;
                  margin-bottom: 10px;
                  padding-left: 0;
                }
                &.extra_services {
                  svg {
                    &.icon-anyfill-prod-ski {
                      margin-right: 5px
                    }
                  }
                }
              }
            }
          }
        }
      }
    }

    ul {
      > li.special_case {
        td.reservation {
          margin-bottom: 0;
        }
      }
    }
  }
}
// Excepciones idiomas
html[lang|="fa"] .tipo_regimen li .info_habitacionContainer td.payment span span{display:none}/* iraníes usan la pasarela Shaparak para la cual no tenemos pago a plazos.*/