@use "../../../plugins/bootstrap-5.1.3/scss/functions";
@use "../../../plugins/bootstrap-5.1.3/scss/variables";
@use "../../../plugins/bootstrap-5.1.3/scss/mixins";
@use "../../../plugins/bootstrap-5.1.3/scss/utilities";
@use "../../../plugins/bootstrap-5.1.3/scss/reboot";
@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: auto !important;
  }
}

:root {
  --primary: #CD0511;
  --consumed-by-js: $primary;
  --bs-primary: #CD0511;
  --bs-primary-rgb: 205, 5, 17;
  --success: #179149;
  --consumed-by-js: $success;
  --bs-success: #179149;
  --bs-success-rgb: 23, 145, 73;
  --bs-dark: #161616;
  --bs-dark-rgb: 22, 22, 22;
  --bs-font-open-sans:'Open Sans', sans-serif;
  --bs-body-font-family: var(--bs-font-open-sans);
  --bs-body-color: #161616;
  --bs-link-color: $primary;
}

@use "../../../plugins/bootstrap-5.1.3/scss/bootstrap";
section:first-of-type {
  background: #f4f4f4;
}

.video-background-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.video-background-container video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 0;
}

.flip-background {
  transform: rotateY(180deg) !important;
  top: 0 !important;
  left: 0 !important;
}

.overlay-content {
  position: relative;
  z-index: 1;
  color: white;
  /* or your desired text color */
  /* add padding, alignment, etc. */
}

.gray-box-pd {
  padding: 140px 50px 130px 50px;
}

/** Islamic Account **/
.islamic-account-background {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/islamic-account-header.webm) !important;
  background-size: cover !important;
}

.islamic-footer-bg {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/islamic-bottom-bg.webp) !important;
  background-size: cover !important;
}

.transparent {
  background: transparent !important;
}

.islamic-footer-bg {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/islamic-bottom-bg.webp) !important;
  background-size: cover !important;
}

.islamic-btn-bg {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/islamic-button.svg) !important;
  background-size: cover !important;
  width: 403px;
  height: 73px;
}

.new-align {
  width: 400px;
}

.margin-top-150 {
  margin-top: -150px;
}

.btn-islamic-text {
  padding: 19px 10px 13px 10px !important;
}

.gray-box {
  background: #F4F4F4;
  text-align: center;
  min-height: 400px;
  /*margin-bottom: 40px;*/
  /*margin: 20px 20px 20px 0;*/
}

.gray-box:hover {
  background: #EEE;
}

.gray-box p {
  font-size: 20px;
  font-weight: 700;
  color: black;
}

.padding-all-5 {
  padding: 5px;
  width: 33%;
}

.border-b-gray {
  border-bottom: solid 1px #DEDEDE;
  line-height: 28px;
  font-size: 13px;
}

#zero-spread-account blockquote {
  border-left: solid 5px #666;
}

.account-icon {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  height: 130px;
}

.acc-0-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/0_dol.svg);
  width: 140px;
}

.acc-0-percentage {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/0.svg);
  width: 140px;
}

.acc-leverage-1-1000 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/1-1000.svg);
  width: 180px;
}

.acc-cent {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/cent.svg);
  width: 120px;
}

.acc-deposit {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/minimum_deposit.svg);
  width: 120px;
}

.acc-spreads {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/low_spreads.svg);
  width: 140px;
}

.acc-point-two-spreads {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/0.2.svg);
  width: 140px;
}

.acc-leverage {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/leverage.svg);
  width: 210px;
}

.acc-leverage-2 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/leverage_2.svg);
  width: 140px;
}

.acc-commission {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/commission.svg);
  width: 120px;
}

.acc-low-commission {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/low_commissions.svg);
  width: 120px;
}

.acc-swap {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/swap_free.svg);
  width: 140px;
}

.acc-0-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/0_dol.svg);
  width: 140px;
}

.acc-0-percentage {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/0.svg);
  width: 140px;
}

.acc-100-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/100_dol.svg);
  width: 140px;
}

.acc-200-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/200_dol.svg);
  width: 140px;
}

.acc-250-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/250_dol.svg);
  width: 140px;
}

.acc-300-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/300-dol.svg);
  width: 140px;
}

.acc-20000-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/20000_dol.svg);
  width: 180px;
}

.acc-30000-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/30000_dol.svg);
  width: 210px;
}

.acc-5000-dol {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/5000_dol.svg);
  width: 180px;
}

.acc-300 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/300.svg);
  width: 140px;
}

.acc-400 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/400.svg);
  width: 140px;
}

.acc-500 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/500.svg);
  width: 140px;
}

.acc-1 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/1pip.svg);
  width: 140px;
}

.acc-no-markups {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/no_markups.svg);
  width: 130px;
}

.spreads-from-1-pip {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/1.svg);
  width: 130px;
}

.acc-no-commission {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/commission.svg);
  width: 130px;
}

.acc-leverage-1-400 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/1-400.svg);
  width: 180px;
}

.acc-leverage-1-1000 {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/1-1000.svg);
  width: 180px;
}

.max-sim-open-orders {
  background-image: url(/assets/hfappnew/websites/main/inside-pages/trading-accounts/account-types/images/accounts/icons/500.svg);
  width: 180px;
}

/** Table **/
.card {
  border: 0;
}

.card-header {
  border-radius: 0.42rem !important;
  border-bottom: 0;
  background-color: #F4F4F4;
}

.card-title {
  margin: 0.5rem 0;
}

.table > :not(:first-child) {
  border-top: 2px solid #DEDEDE;
}

@media (max-width: 1199.98px) {
  .gray-box-pd {
    padding: 120px 50px 110px 50px;
  }
  .cent-bgk {
    background: #f4f4f4;
  }
}

@media (max-width: 991.98px) {
  .video-background-container video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: 1;
  }
  .gray-box-pd {
    padding: 90px 50px 130px 50px;
  }
  .btn-text {
    margin: auto;
  }
  .fs-5 {
    font-size: 1rem !important;
  }
}

@media (max-width: 1199.98px) {
  .gradient-banner {
    width: 100%;
    /* or 100% depending on your layout */
    height: 83px;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='32' viewBox='0 0 403 72' fill='none'><path d='M36.2759 0V5.52073C3.87512 5.52073 27.8297 24.4824 0 36.0017C27.8297 47.521 3.87512 66.4827 36.2759 66.4827V72.0034H366.724V66.4827C399.125 66.4827 375.17 47.5244 403 36.0017C375.17 24.479 399.125 5.52073 366.724 5.52073V0H36.2759Z' fill='url(%23paint0_linear_299_205)'/><defs><linearGradient id='paint0_linear_299_205' x1='307.628' y1='-55.98' x2='125.534' y2='154.121' gradientUnits='userSpaceOnUse'><stop stop-color='%23B49567'/><stop offset='0.34' stop-color='%23B09265'/><stop offset='0.62' stop-color='%23A6895F'/><stop offset='0.87' stop-color='%23957B55'/><stop offset='1' stop-color='%238A724F'/></linearGradient></defs></svg>");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    align-items: center;
    /* Vertically centers the text */
    justify-content: center;
    /* Horizontally centers the text */
    color: white;
    font-family: Arial, sans-serif;
    font-size: 1rem;
    text-align: center;
  }
  .banner-text a {
    position: relative;
    z-index: 1;
    /* Ensure text is above the background */
    text-decoration: none !important;
    text-transform: uppercase;
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
  }
}

@media (max-width: 1199.98px) and (max-width: 767.98px) {
  section:first-of-type {
    text-align: center;
  }
  .video-background-container {
    background: none;
  }
}

@media (max-width: 1199.98px) {
  .table-responsive {
    border: 0;
  }
  .gray-box {
    min-height: 250px;
  }
  .gray-box-pd {
    padding: 0px;
    justify-content: center;
  }
  .ml-10 {
    margin-left: 0px !important;
  }
}