// * Pricing
// *******************************************************************************

@use '../_bootstrap-extended/include' as light;
@use '../_bootstrap-extended/include-dark' as dark;
@import '../_custom-variables/pages';

.pricing-plans {
  ul {
    list-style-type: circle;
    li::marker {
      font-size: 1.4rem;
    }
  }
}

.pricing-free-trial {
  background-color: rgba(light.$primary, 0.04);
}
.badge-pro {
  margin-left: 1px !important;
}
.pricing-plans-comparison {
  .table {
    thead {
      tr {
        th {
          background-color: transparent !important;
          vertical-align: middle;
        }
      }
    }
    tr {
      > th:first-child,
      > td:first-child {
        white-space: nowrap;
        text-align: start;
      }
    }
    tbody {
      tr:last-child {
        td {
          border-bottom: 0;
        }
      }
    }
  }
}
.price-yearly-toggle {
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
}
@if $enable-light-style {
  .light-style {
    .bg-alt-pricing {
      background-color: light.$body-bg;
    }
    .pricing-plans-comparison {
      .table thead tr th {
        border-bottom-color: light.$border-color;
      }
    }
  }
}

@if $enable-dark-style {
  .dark-style {
    .bg-alt-pricing {
      background-color: dark.$body-bg;
    }
    .pricing-plans-comparison {
      .table thead tr th {
        border-bottom-color: dark.$border-color;
      }
    }
  }
}

// To position illustration
@include light.media-breakpoint-up(lg) {
  .pricing-free-trial {
    img {
      position: absolute;
      bottom: 0;
      @include app-ltr() {
        right: 0;
      }
      @include app-rtl() {
        left: 0;
      }
    }
  }
}
