/*!*****************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[2].use[3]!./assets/scss/compare.scss ***!
  \*****************************************************************************************************************************************************************************************/
@charset "UTF-8";
.cars-comparison-info {
  border-bottom: 1px solid #dee2e6;
  background-color: #f1f3fa;
}

.compare-info {
  background: #fff;
  padding: 30px;
  display: flex;
  flex-direction: row;
  position: relative;
}

.compare-info-dropdown-menu {
  margin-right: auto;
  margin-left: -15px;
}

.has-sticky-header {
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
  width: 100%;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}

.layout-auto {
  table-layout: auto;
}

.meta-section {
  align-self: center;
  margin: 0 30px 0 20px;
  min-width: 100px;
  width: 100%;
}
.meta-section > * {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.img-section {
  align-self: center;
}
.img-section img {
  max-width: 280px;
  width: 100%;
  height: auto;
  transform: rotateY(-180deg);
}

.more-than-one-item .compare-info {
  width: 180px;
}

.brand-name {
  text-transform: uppercase;
  font-size: 20px;
  line-height: 20px;
}

.car-name {
  font-size: 23px;
  line-height: 26px;
  margin-top: 5px;
}

.version-name {
  font-size: 20px;
  line-height: 20px;
  margin-top: 15px;
}

.brand-name, .car-name, .version-name {
  margin-bottom: 0;
}

.column-section th {
  border: 0;
}

.between::after {
  content: "مقابل";
  position: absolute;
  right: 50%;
  top: 50%;
  bottom: auto;
  left: auto;
  transform: translateX(50%) translateY(-50%);
  background: #fff;
  padding: 10px;
  color: #1a1e23;
  font-weight: 700;
  border-radius: 50%;
}

.face-to-face .compare-box {
  position: relative;
  display: flex;
  flex-direction: row;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid #ced4da;
  border-radius: 4px;
  transition: box-shadow 0.3s;
  text-align: center;
  overflow: hidden;
  margin-bottom: 30px;
}
.face-to-face .compare-box.new {
  flex-direction: column;
  height: calc(100% - 30px);
  align-items: center;
  justify-content: center;
  min-height: 175px;
}
.face-to-face .compare-box .compare-info {
  flex-direction: column;
  justify-content: flex-start;
  flex: 1;
  width: 50%;
  min-width: 0;
}
.face-to-face .compare-box .compare-info:first-child {
  border-left: 1px solid #dee2e6;
  /*img {
    transform: rotateY(-180deg);
  }*/
}
.face-to-face .compare-box .compare-info:last-child img {
  transform: rotateY(0deg);
}
.face-to-face .compare-box .compare-info .img-section {
  width: 100%;
  justify-self: flex-start;
  order: 2;
  margin-top: 15px;
}
.face-to-face .compare-box .compare-info .meta-section {
  order: 1;
  justify-self: flex-start;
  margin: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

@media only screen and (max-width: 559px) {
  .face-to-face .compare-box .compare-info {
    padding: 0.75rem;
  }
  .face-to-face .compare-box .compare-info .meta-section .brand-name {
    font-size: 13px;
    line-height: 13px;
  }
  .face-to-face .compare-box .compare-info .meta-section .car-name {
    font-size: 16px;
    line-height: 16px;
    margin-top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .face-to-face .compare-box {
    margin-bottom: 20px;
  }
  .face-to-face .compare-box.new {
    min-height: 150px;
  }
  .face-to-face .compare-box .compare-info {
    padding: 20px;
  }
}
.cars-comparison {
  background-color: #fff;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
}
.cars-comparison:not(.with-empty-cell) .cars-comparison-info > th {
  background: #fff;
}
.cars-comparison .table {
  border-spacing: 0;
  margin-bottom: 0;
}
.cars-comparison .table thead th {
  border-bottom: none;
}
.cars-comparison .table tr td:first-child, .cars-comparison .table tr td:first-child, .cars-comparison .table tr th:first-child, .cars-comparison .table tr th:first-child {
  border-right: 0;
}
.cars-comparison .table tr td:last-child, .cars-comparison .table tr td:last-child, .cars-comparison .table tr th:last-child, .cars-comparison .table tr th:last-child {
  border-left: 0;
}
.cars-comparison .sticky-head th {
  white-space: nowrap;
}
.cars-comparison .is-sticky .sticky-head {
  box-shadow: 2px 3px 4.7px 0.3px rgba(0, 0, 0, 0.24);
}
.cars-comparison .cars-comparison-info > th:not(:nth-last-child(-n+1)) {
  background: #fff;
}
.cars-comparison .compare-info {
  position: static;
}
.cars-comparison .compare-info-dropdown-menu {
  position: absolute;
  left: 20px;
  top: 20px;
}
.cars-comparison .head-hidden > thead {
  visibility: hidden;
  opacity: 0;
}

@media only screen and (min-width: 1024px) {
  .cars-comparison tbody tr td:first-child, .cars-comparison tbody tr th:first-child, .cars-comparison thead .cars-comparison-info th:first-child {
    padding-right: 35px !important;
  }
  .cars-comparison tbody tr td:last-child, .cars-comparison tbody tr th:last-child, .cars-comparison thead .cars-comparison-info th:last-child {
    padding-left: 35px !important;
  }
  .cars-comparison thead .cars-comparison-info th:first-child .compare-info {
    padding-right: 0;
  }
  .more-than-one-item .compare-info {
    width: auto;
  }
  .more-than-one-item .compare-info-dropdown-menu {
    left: 30px;
    top: 30px;
  }
}
@media only screen and (max-width: 1023px) {
  .cars-comparison .compare-info {
    flex-direction: column;
    padding: 0.75rem;
  }
  .cars-comparison .meta-section {
    order: 1;
    margin: 0;
  }
  .cars-comparison .meta-section, .cars-comparison .img-section {
    text-align: center;
  }
  .cars-comparison .img-section, .cars-comparison .img-section > img {
    width: 180px;
    min-width: 180px;
    max-width: 180px;
  }
  .cars-comparison .img-section {
    order: 2;
  }
  .more-than-one-item .meta-section, .more-than-one-item .img-section {
    text-align: right;
    align-self: flex-start;
  }
  .is-sticky .img-section {
    visibility: hidden;
    opacity: 0;
    height: 0;
  }
}
@media only screen and (max-width: 992px) {
  .cars-comparison .car-name {
    font-size: 17px;
  }
  .cars-comparison .version-name {
    font-size: 18px;
  }
  .cars-comparison .car-name, .cars-comparison .version-name {
    margin-top: 5px;
  }
  .cars-comparison .brand-name, .cars-comparison .car-name, .cars-comparison .version-name {
    line-height: normal;
  }
}
@media only screen and (min-width: 768px) {
  .cars-comparison .table {
    table-layout: fixed;
  }
}
@media only screen and (max-width: 767px) {
  .cars-comparison .img-section, .cars-comparison .img-section > img {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
  }
}

/*# sourceMappingURL=compare.72b8c6a6.css.map*/