/* Pricing Table */
.thb-pricing-table {
	.thb-pricing-column {
		display: flex;
		flex-direction: column;
		margin-bottom: 30px;

		@include min-break($break-medium) {
			margin-bottom: 40px;
		}
		.pricing-description ul {
			margin: 0;
			list-style: none;
		}
	}
  .thb-price {
    small {

      color: inherit;
      font-size: 50%;
    }
  }
  &.style2,
  &.style3 {
    img:not(.retina_active) {
      visibility: hidden;
    }
  }

  &.style1 {
    .btn {
    	border-radius: 0 0 3px 3px;
    }
    .thb-pricing-column {

      .pricing-container {
      	background: #fff;
      	display: flex;
      	height: 100%;
      	flex-direction: column;
      	border-radius: 3px;
      	border: 1px solid rgba($accent, 0.2);
      	text-align: center;
      	padding: 15px;

      	@include min-break($break-small) {
      		padding: 40px;
      	}
      	img {
      		display: block;
      		border-radius: 3px;
      		margin: 0 auto 40px;
      		flex-shrink: 0;
      	}
      	.thb_pricing_head {
      		border-bottom: 1px solid rgba(0,0,0,0.07);

      		h4 {
      			font-size: 20px;
      			font-weight: 400;
      			margin-bottom: 15px;
      			line-height: 1;
      		}
      		h3 {
      			font-size: 30px;
      			font-weight: 600;
      			line-height: 1;
      			margin-bottom: 25px;
      		}
      		.pricing_sub_title {
      			font-size: 13px;
      			margin-bottom: 39px;
      		}
      	}
      	&.has-button {
      		border-radius: 3px 3px 0 0;
      		border-bottom: 0;
      	}
      	.pricing-description {
      		padding-top: 40px;
      		text-align: left;
      		font-size: 14px;
      		color: $black;

      		p {
      			font-size: inherit;
      			color: inherit;
      		}
      	}
      }
      .btn {
      	width: 100%;
      }
      &.highlight-true {
      	.pricing-container {
      		border-width: 3px;
      		border-color: $accent;
      	}
      }
    }
  } // .style1
	&.style2 {
    position: relative;
    text-align: center;
    .pricing-column.highlight-true .pricing-container {
      position: relative;
    }

    .pricing-style2-highlight {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      z-index: 0;
      pointer-events: none;
      background: rgba(#000,0.2);
      opacity: 0;
      @extend .quick-transition;
    }
    .thb_pricing_head,
    .pricing-description,
    .btn,
    img {
      position: relative;
      z-index: 10;
    }
    .pricing-container {
    	padding: 25px 20px;
    	height: 100%;

    	@include min-break($break-small) {
        padding: 35px;
      }
      img {
        display: block;
        margin: 0 auto 35px;
      }
      .thb_pricing_head {
        h4 {
          font-size: 24px;
          font-weight: 600;
        }
        .thb-price {
          display: block;
          line-height: 1;
          font-size: 60px;
          padding-bottom: 35px;
          border-bottom: 1px solid rgba(#000,0.1);
          margin-bottom: 35px;
          color: $accent;
        }

        .pricing_sub_title {
          display: block;
          font-size: 14px;
          padding: 0 20px 30px;
          border-bottom: 1px solid rgba(#000,0.1);
          margin-bottom: 35px;
        }
      }
      .pricing-description {
        font-size: 16px;

        >*:last-child {
          margin-bottom: 0;
        }
        ul {
          list-style: none;
          padding: 0;
        }
      }
      .btn {
        margin-top: 35px;
      }
    }
    &.active {
      .pricing-column.highlight-true .pricing-container {
        position: static;
      }
      .pricing-style2-highlight {
      	opacity: 1;
      }
    }
  } // .style2
  &.style3 {
    .pricing-container {
      border: 1px solid rgba(#000,0.08);
      border-radius: 4px;
      display: flex;
      flex-direction: column;
      height: 100%;
      position: relative;
      img {
        display: none;
        position: absolute;
        top: 15px;
        right: 15px;
        max-width: 25%;
        @include min-break($break-small) {
          display: block;
          top: 30px;
          right: 30px;
        }
        @include min-break($break-medium) {
          top: 45px;
          right: 45px;
        }
				.rtl & {
					right: auto;
					left: 15px;
					@include min-break($break-small) {
	          right: auto;
	          left: 30px;
	        }
	        @include min-break($break-medium) {
	          right: auto;
	          left: 45px;
	        }
				}
      }
    }
    .thb-pricing-style3-container {

    	flex: 1;
      padding: 15px;

      @include min-break($break-small) {
        padding: 30px;
      }
      @include min-break($break-medium) {
        padding: 45px;
      }
    }
    .thb_pricing_head {
      padding: 0;

      @include min-break($break-small) {
        padding: 0 30% 0 0;

				.rtl & {
					padding: 0 0 0 30%;
				}
      }
      .pricing_sub_title {
        font-size: 14px;
        line-height: 1.4;
        margin-bottom: 40px;
      }
    }
    .pricing-description {
      ul, ol {
        font-size: 12px;
        list-style: none;
        padding: 0;
        @extend .cf;
        li {
          margin-bottom: 5px;
          @include min-break($break-small) {
            width: 50%;
            float: left;
          }
        }
      }
    }

    .thb-pricing-footer {
      display: flex;
      background: #f6f9fb;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      padding: 15px;
      border-top: 1px solid rgba(#000,0.06);
      @include min-break($break-small) {
        padding: 30px;
        flex-direction: row;
        justify-content: space-between;

        .thb-price {
          margin-bottom: 0;
        }
      }
    }
  } // .style3
}