@import "../../../assets/scss/variables";


.excel-zone {
  .slider {
    &  .readonly{
      pointer-events: none!important;
      cursor: not-allowed!important;
    }
    background-color: white!important;
    border: none!important;
    span {
      color: $main-color;
      font-size: 10px;
      font-weight: $bold;
    }

    &.state-off {
      &::before {
        background-color: #E3AC16;
      }
    }

    &.state-on {
      &::before {
        background-color: #61C765;
      }
      span {
        position: absolute;
        left: 5px;
      }
    }
  }

  .left-box {

    border-right: none;
    border-bottom: 1px dashed #707070;
    padding-bottom: 1.5rem;
    margin-bottom: 0.5rem;

    @media (min-width: 1200px) {
      border-bottom: none;
      border-right: 1px dashed #707070;
      padding-bottom: 0;
      margin-bottom: 0;
      padding-right: 2rem; // distance from divider on the left side
    }

    .icon {
      margin-right: 32px;
    }

    .texts {
      margin-right: 0; // remove the fixed margin — let the col grid handle spacing

      p {
        font-size: $index-large;

        a {
          text-decoration: underline;
        }
      }
    }

    .button {
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }

  .right-box {
    @media (min-width: 1200px) {
      padding-left: 2rem; // mirror left-box padding-right exactly
    }

    @media (max-width: 1199px) {
      padding-left: 0;
      padding-top: 1rem;
    }
  }

  padding: 25px;
  margin-bottom: 50px;
  background-color: $form-background;

  .buttons {
    .buttons-wrap{
      flex-wrap: wrap;

      @media (min-width: 1700px) {
        flex-wrap: nowrap;
      }
    }
    .border-div {
 height: 42px;
      border-radius: 6px;
@media (max-width: 575px) {

}
      &.true {
        background-color: #61C765;
        border: 2px solid #61C765;
      }

      &.false {
        background-color: #E3AC16;
        border: 2px solid #E3AC16;
      }
      &.true {
        background-color: #61C765;
        border: 2px solid #61C765;
      }

      &.false {
        background-color: #E3AC16;
        border: 2px solid #E3AC16;
      }
    }
  }
}