// Here you can add other styles
.copy-right {
  color: #872071;
  font-weight: bold;

  &:hover {
    text-decoration: none;
    color: #872071;
  }
}

pre {
  background: #000 !important;
  color: green !important;
  direction: ltr !important;
  text-align: left !important;
  padding: 20px !important;
  font-size: 20px !important;
}

.c-app {
  .custom-subheader {
    align-items: center;
    width: 100%;
    position: fixed;
    top: $header-height;
    left: 0;
    z-index: 10;
    transition: width $layout-transition-speed;
    -webkit-transition: width $layout-transition-speed;
    -moz-transition: width $layout-transition-speed;
    -ms-transition: width $layout-transition-speed;
    -o-transition: width $layout-transition-speed;

    &.sideBarFull {
      width: calc(100% - #{$sidebar-width});
    }

    &.sideBarMinimized {
      width: calc(100% - #{$sidebar-minimized-width});
    }

    &.sideBarClose {
      width: 100%;
    }

    @media (max-width: 992px) {
      width: 100% !important;
    }
  }

  .form-group {
    &.err {
      .col-form-label {
        color: red !important;
      }

      .form-control {
        border-color: red !important;
      }

      .form-text {
        color: red !important;
      }
    }
  }

  .c-sidebar-nav-dropdown {
    .c-sidebar-nav-dropdown-toggle {
      background: rgba(gray, 0.2) !important;
    }
  }

  .vpd-main {
    .vpd-selected {
      .vpd-day-text {
        color: #fff;
      }
    }

    .vpd-date {
      span {
        color: #fff;
      }
    }

    // vue persian dateTime picker styles
    .vpd-icon-btn {
      padding: 9px 10px;
    }
  }
}