/* @import url('https://fonts.googleapis.com/css?family=Roboto'); */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root {
  --axiom-primary: #054d5a;
  --linktek-primary: #005daf;
}

body {
  font-family: 'Roboto', sans-serif;
  /* padding-top: 120px; */
  /* font-family: 'Helvetica Neue'; */
  /* background-color: #f5f5f5; */
}
* {
  margin: 0;
  padding: 0;
}

/* .bg-primary-active {
  background-color: #b4d4f6;
}

.bg-primary-active.total-details-container {
  padding: 10px 0px;
} */

.alert-payment-method-message {
  background-color: white;
}

.btn-contact-us {
  /* border: 1px solid black; */
  /* font-size: 14px; */
  /* font-weight: 500; */
  align-items: center;
  border-radius: .25rem 0 0 .25rem;
  box-shadow: none !important;
  color: white!important;
  cursor: pointer;
  display: flex;
  height: 48px;
  justify-content: center;
  outline: none;
  overflow: hidden;
  transition: width 0.3s ease;
  white-space: nowrap; 
  width: 48px;
  /* transition: transform 0.3s ease-in-out;   */
}

.btn-contact-us-inline {
  align-items: center;
  border-radius: .25rem;
  box-shadow: none !important;
  color: white!important;
  cursor: pointer;
  display: flex;
  height: 48px;
  justify-content: center;
  outline: none; 
  width: auto;
  /* padding: 28px 14px; */
}

.btn-contact-us-container {
  position: fixed;
  right: 0;
  top: 293px; /* 50% */
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: flex-end; /* Aligns buttons to the right */
  gap: 10px;
  z-index: 9;
}

.btn-contact-us-inline-container {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 20px;
  justify-content: center;
  margin-top: 20px;
}

.btn-contact-us .icon-contact-us {
  width: 30px;
  height: auto;
}

.btn-contact-us-inline .icon-contact-us {
  width: 30px;
  height: auto;
}

.btn-contact-us .text-title {
  font-size: 15px;
}

.btn-contact-us .text-description {
  font-size: 12px;
}

.btn-contact-us .text-contact-us-btn-content {
  /* opacity: 0; */
  width: 0;
  overflow: hidden;
  transition: opacity 0.3s ease-in-out, width 0.3s ease-in-out;
  line-height: 1.3;
}

.btn-contact-us-inline .text-title {
  font-size: 15px;
}

.btn-contact-us-inline .text-description {
  font-size: 12px;
}

.btn-contact-us-inline .text-contact-us-btn-content {
  padding-left: 10px;
  line-height: 1.3;
}

/* Specific hover effect per button */
.btn-contact-us-call:hover,
.btn-contact-us-email:hover,
.btn-open-salesiq-chat:hover,
.btn-contact-us-teams:hover {
  width: auto;
  /* height: 74px; */
  /* transform: translateX(50px); */
  /* transform: scaleX(1.5); */
}

.btn-contact-us-call:hover .text-contact-us-btn-content,
.btn-contact-us-email:hover .text-contact-us-btn-content,
.btn-open-salesiq-chat:hover .text-contact-us-btn-content,
.btn-contact-us-teams:hover .text-contact-us-btn-content {
  opacity: 1;
  width: auto;
  /* transform: translateX(-20px); */
  padding-left: 10px;
}

.btn-contact-us:hover {
  transform: scale(1.05);
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.btn-contact-us-call {
  background-color: #3a8838;
}

.btn-contact-us-email {
  background-color: #ee9953;
}

.btn-open-salesiq-chat {
  background-color: #2d5fbd;
}

.btn-contact-us-teams {
  background-color: #47488f;
}

.btn-pay-with-credit-card {
  background-color: #3b7fd0;
  /* border: 1px solid black; */
  box-shadow: none !important;
  color: white !important;
  cursor: pointer !important;
  outline: none;
}

.card-body {
  padding: 0.75rem;
}

.card-body-title {
  background-color: #b6d6f8;
  font-weight: bold;
  padding: 0.5rem 0.75rem;
}

.card-body-content {
  padding: 0.75rem;
}

.card-intro-message {
  margin: 10px auto 10px;
  /* width: 980px; */
  /* max-width: 920px; */
  max-width: 1120px;
  /* width: 920px; */
}

.card-intro-message, .card-payment-method-message {
  border: 6px solid #b4d4f6;
  box-shadow: 2px 2px 4px #757575;
  font-size: 17px;
}

.card-payment-directions {
  padding: 1.25rem;
  background-color: #f3f3f3;
}

.card-payment-directions .card-payment-directions-body {
  background-color: white;
  padding: 1.25rem;
}

.card-payment-amount {
  font-size: 13px;
}

.card-payment-discount {
  background-color: #dc3545;
  border-radius: .25rem;
  color: white;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  padding: .25em .4em;
  text-align: center;
  vertical-align: baseline;
  white-space: nowrap; /* Prevent text from wrapping */
}

.card-payment-method {
  padding: 1.25rem;
  background-color: #f3f3f3;
}

.card-payment-method .card-payment-method-title,
.card-payment-directions .card-payment-directions-title {
  font-size: 18px;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1.25rem;
}

.card-payment-method .card-payment-method-body {

}

.card-payment-method-list .list-group-item .list-group-item-title {
  /* font-size: 16px; */
  font-weight: bold;
}

.card-payment-method-list .list-group-item .list-group-item-breakdown {
  margin-left: 24px;
}

.card-payment-method-list .list-group-item-payment-method {
  cursor: pointer;
  /* font-size: 14px; */
}

.card-payment-type,
.card-other-payment-method {
  border: 2px solid rgba(0, 0, 0, 0.125);
  cursor: pointer;
  /* transition: border-color 0.2s ease; */
}

.card-payment-type.active,
.card-other-payment-method.active {
  border: 2px solid #005daf !important;
}

.card-payment-type:hover,
.card-other-payment-method:hover {
  border: 2px solid rgba(0, 92, 175, 0.3);
}

.list-group-item-quote-payment-method {
  cursor: pointer;
  padding: .5rem;
}

/* .list-group-item-quote-payment-method.bg-primary-active {
  background-color: #b4d4f6;
} */

.card-purchase-details-summary .card-purchase-details-summary-title {
  background-color: #b6d6f8;
  font-weight: bold;
  padding: 0.75rem;
}

.card-purchase-details-summary .card-purchase-details-summary-body {
  padding: 0.25rem 0.75rem;
}

.card-quote-details .quote-total-price-breakdown-container {
  /* width: 878px; */
  /* width: 920px; */
}

.card-quote-payment-method .card-body {
  background-color: #f3f3f3;
}

.clear-both {
  clear: both;
}

.custom-checkbox-payment-method {
  min-height: auto;
}

.custom-radio-payment-method label {
  cursor: pointer;
}

.custom-radio-payment-method-eula label {
  cursor: pointer;
}

.filter-content {
  filter: blur(3px) grayscale(25%);
  transition: filter 0.3s ease;
  pointer-events: none;
  user-select: none;
  position: relative;
}

.filter-content::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.35);  /* or rgba(0,0,0,0.2) for dark mode */
  z-index: 999;
}

.font-weight-semibold {
  font-weight: 500;
}

.icon-credit-card {
  height: 20px;
  width: auto;
}

.icon-print {
  height: 20px;
  width: auto;
}

.navbar-logo {
  width: auto;
  height: 46px;
}

.navbar-header {
  /* background-color: #04397b; */
  background-color: white;
  box-shadow: 2px 2px 4px #757575;
  display: flex;
  left: 0;
  padding-bottom: 6px;
  padding-top: 6px;
  position: sticky; /* fixed */
  right: 0;
  text-align: center;
  top: 0;
  z-index: 1030;
}

.navbar-header-axiom {
  background: radial-gradient(ellipse at center, #00476b 0%, #002538 100%);
}

.navbar-header-axiom .text-contact-us {
  color: #c2d2e0;
}

.navbar-header-axiom .text-contact-us:hover {
  color: #c2d2e0;
  text-decoration: none;
}

.navbar-header-linktek .text-contact-us {
  color: #000000;
}

.navbar-header-linktek .text-contact-us:hover {
  color: #000000;
  text-decoration: none;
}

.tab-content-container {
  /* margin: 10px auto 10px;
  width: 1120px; */
  margin: 10px auto 20px;
  width: 1260px;
}

.total-details-container {
  color: #dc3545;
  font-size: 20px;
  margin-top: .5rem;
}


/* .card-payment-type-axiom.active,
.card-other-payment-method-axiom.active {
  border: 2px solid #005daf !important;
}

.card-payment-type-axiom:hover,
.card-other-payment-method-axiom:hover {
  border: 2px solid rgba(0, 92, 175, 0.3);
} */

.header-warning-banner {
  background-color: #c92500;
  color: white;
  font-size: 16px;
  padding: 18px;
  text-align: center;
}

.hr-line-divider {
  width: 100%;
  border: 1px solid rgba(0, 0, 0, .125);
}

.icon-intro-card-arrow {
  cursor: pointer;
}

.icon-warning-message {
  height: 20px;
  width: 20px; 
}

.input-accordion {
  width: 350px;
}

.input-error:not(input[type='radio']) {
  border: 1px solid #e3626f !important;
}

.input-required, .input-email {
  transition: border 0.3s ease-in-out;
}

.label-input-error {
  color: red;
  /* font-family: 'Arial'; */
  font-size: 14px;
}

.label-select-payment-method {
  font-size: 18px;
  font-weight: bold;
  padding-right: 9px;
}

.link-disabled {
  color: gray!important;
  pointer-events: none!important;
  text-decoration: none!important;
}

.link-terms-conditions, .link-verify-payment {
  cursor: pointer;
}

.form-control {
  background: transparent;
  color: #282c31;
  height: 34px;
  font-family: 'Roboto', sans-serif!important;
  /* font-family: 'Helvetica Neue'!important; */
  outline: 0;
}

.footer .footer-page-additional-info {
  background-color: #000000;
  color: white;
  font-size: 14px;
}

.footer .footer-copyright-container {
  background-color: #ffffff;
  color: #000000;
  /* color: #b2b2b2!important; */
  font-size: 10px;
  font-family: 'Times New Roman';
}

.footer .footer-copyright-container .footer-copyright-content * {
  font-size: 10px!important;
  font-family: 'Times New Roman'!important;
}

.footer .footer-copyright-container .link-privacy-policy {
  font-family: "Lato", sans-serif;
  text-decoration: none;
}

.footer .footer-logo {
  width: 120px;
  height: 120px;
}

.navbar-container {
  width: 920px;
  /* width: 980px; */
}

.no-quote-data-container {
  flex: 1;
  /* margin-top: 68px; */
  /* margin-top: 68px; */
}

/* .payment-details-container {
  margin: 10px auto 20px;
  width: 1260px;
} */

.quote-contact-us-container {
  display: flex;
  gap: 10px;
  justify-content: between;
  margin: 0;
  /* max-width: 80%; */
}

.quote-contact-us-container .btn-contact-us {
  flex: 1;
}

.select-payment-method-option-container {
  /* max-width: 460px; */
  /* width: fit-content; */
  /* max-width: fit-content; */
}

.select-payment-method-option {
  font-size: 15px;
  /* width: auto; */
}

.subtotal-hr {
  margin: 0.5rem 1rem;
  width: 140px;
  float: right;
  background-color: black;
}

.summary-details-container {
  margin: 10px auto 10px;
  max-width: 990px;
}

.summary-quote-details .label-reseller-or-licensee-container div {
  display: inline;
}

.tab-content {
  display: none;
} /* Hide all tab content by default */

.tab-content.active {
  display: block;
} /* Show active tab content */

/* input:focus,
button:focus,
.form-control:focus {
  outline: none;
  box-shadow: none;
}

.form-control:disabled,
.form-control[readonly] {
  background-color: #fff;
} */

.text-gray {
  color: #6c757d;
}

.text-payment-method-description {
  color: #6f6f6f;
}

.text-quote-header {
  font-size: 26px;
  font-weight: bold;
  text-align: center;
}

.text-quote-header-details * {
  font-family: inherit!important;
  font-size: inherit!important;
}

@media print {
 body {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact; 
  }
}

@media print {
  #printJS-form {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact; 
  }
}

/* V2 Version */
/* .tab-content-container {
  margin: 10px auto 20px;
  width: 1260px;
} */

.quote-details-content-title {
  margin-top: 0.75rem;
}

.card-quote-payment-method .list-group {
  font-size: 14px;
}

/* .form-step-buttons-container {
  margin: auto;
  width: 1260px;
} */

.alert-box-container {
  padding: 10px;
  border-radius: .25rem;
  background-color: white;
}

.alert-box-axiom {
  border-left: 10px solid var(--axiom-primary);
  border-top: 2px solid var(--axiom-primary);
  border-right: 2px solid var(--axiom-primary);
  border-bottom: 2px solid var(--axiom-primary);
}

.alert-box-linktek {
  border-left: 10px solid var(--linktek-primary);
  border-top: 2px solid var(--linktek-primary);
  border-right: 2px solid var(--linktek-primary);
  border-bottom: 2px solid var(--linktek-primary);
}

/* .alert-box-info {
  border-left: 10px solid #6ac3f9;
  border-top: 2px solid #6ac3f9;
  border-right: 2px solid #6ac3f9;
  border-bottom: 2px solid #6ac3f9;
} */

.alert-box-warning {
  border-left: 10px solid #f2b74a;
  border-top: 2px solid #f2b74a;
  border-right: 2px solid #f2b74a;
  border-bottom: 2px solid #f2b74a;
}

.td-item-single-line {
  display: inline-block;
}

.td-item-single-line * {
  display: inline;
}

/* .custom-control-label {
  padding-left: 0.25rem !important;
  display: inline;
}

.custom-checkbox .custom-control-label::before,
.custom-checkbox .custom-control-label::after {
  top: 0.25rem;
  left: 0;
} */

@media only screen and (max-width: 392px) {
  .tab-content-container {
    width: 100%;
  }

  .wizard-steps-container {
    width: 100%;
  }

  .wizard-step-link {
    grid: 1fr / 34px auto 0px;
  }
}


@media only screen and (min-width: 425px) {
  /* .widget-steps-container {
    font-size: 14px !important;
  }

  .wizard-step-link:first-child {
    border-radius: 4px 0 0 4px;
    border-width: 1px 0 1px 1px;
    grid: 1fr / auto 36px;
  }

  .wizard-step-link span {
    padding: 0 0px 0 20px;
    line-height: 1.2rem;
    color: #5b5b61;
  }

  .btn-contact-us-inline-container {
    gap: 10px;
    margin-top: 20px;
    flex-wrap: wrap;
  } */
}

@media only screen and (max-width: 479px) {
  .tab-content-container {
    width: 100%;
  }

  .wizard-steps-container {
    width: 100%;
  }
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (min-width: 480px) {
  .tab-content-container {
    width: 100%;
  }

  .wizard-steps-container {
    width: 100%;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .tab-content-container {
    width: 100%;
  }

  .wizard-steps-container {
    width: 100%;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .tab-content-container {
    width: 100%;
  }

  .wizard-steps-container {
    width: 100%;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
   .tab-content-container {
    width: 100%;
    /* width: 854px; */
  }

  .wizard-steps-container {
    width: 100%;
    /* width: 854px; */
  }
  
}

/* Vertical 24-inch monitor (laptops/desktops, 1080 and up) */
@media only screen and (orientation: portrait) and (min-width: 1080px) {
}

@media only screen and (min-width: 1200px) and (max-width: 1223px) {
  .col-quote-details-content:nth-of-type(1) {
    flex: 0 0 64%;
    max-width: 64%;
  }

  .col-quote-details-content:nth-of-type(2) {
    flex: 0 0 36%;
    max-width: 36%;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .tab-content-container,
  .wizard-steps-container {
    width: 100%;
  }
}

@media only screen and (min-width: 1320px) { 
  .tab-content-container,
  .wizard-steps-container {
    width: 1260px;
  }
}

@media only screen and (max-width: 1368px) { 
  .btn-contact-us-container { 
    display: none;
  }
}

@media only screen and (min-width: 1369px) {
  .btn-contact-us-inline-container {
    display: none;
  }
}

/* Extra large devices (large laptops and desktops, 1440px and up) */
@media only screen and (orientation: portrait) and (min-width: 1440px) {
}

/* Extra large devices (large laptops and desktops, 1440px and up) */
@media only screen and (orientation: landscape) and (min-width: 1440px) {
  .tab-content-container {
    width: 1260px;
  }

  .wizard-steps-container {
    width: 1260px;
  }
}

/* For Projectors or Higher Resolution Screens (Full HD) */
@media screen and (min-width: 1920px) {
}

/* For 32-inch TV */
@media screen and (min-width: 2560px) {
}

/* For 4K Displays pixel = 3840 x 2160 (55-inch, Ultra HD)  */
@media screen and (min-width: 3840px) {
}

/* ----------- Non-Retina Screens ----------- */
/* @media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
} */

/* ----------- Retina Screens ----------- */
/* @media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
} */

