/* Login page header */
    :has(.page.form-primary-page.login-page) {
        .header.div_release_header {
            box-shadow: 0 3px 10px 0 rgba(0,0,0, .05);
        }
    }

    .header.div_release_header {
        box-shadow: 0 3px 5px 0 rgba(0,0,0, .1);
    }

    /* Login page form */
  .page.form-primary-page.login-page {
      .page__section {
          box-shadow: none;
          background-color: transparent;
      }

      .page__section {
          padding: 0;
      }

      .form.form_submit_spinner {
          padding: 30px;
          min-width: 100%;
      }

      input {
          border: none;
          margin-block: 5px;
          border-radius: 6px;
          box-shadow: 0 3px 10px 0 rgba(0,0,0, .05);
      }

      p {
          display: flex;
          flex-direction: column;
      }

      .form-field__field-wrap {
          button {
              width: 100%;
              border-radius: 6px;
          }
      }
  }


  /* App */

  button {
      border-radius: 6px;
  }

  .card {
      border-radius: 6px;
      border: none;
      box-shadow: 0 3px 10px 0 rgba(0,0,0, .1);

      &:has(.bg-success) {
          box-shadow: none;
      }

      .card-body.bg-success {
          background-color: #21C58E !important;
          color: white;
      }

      .card-footer.pl-5 {
          select {
              border: 2px solid #8EA2C3;
              border-radius: calc(6px / 2);
          }
      }
  }

  .page__body-bar:has(.company-info) {
      border-radius: 6px;

      .company-info {
          border-radius: 6px;
          .company-info__list {
              border-radius: 6px;
          }
      }
  }

  /* Side menu */

  .layout__sidebar-primary.layout__col {
      box-shadow: none !important;

      &.layout__sidebar-primary--is-open {
          box-shadow: 0 0 10px 0 rgba(0,0,0, .5) !important;
      }
  }

  .page__section {
      box-shadow: none;
      border: none;
      border-radius: 6px;
      box-shadow: 0 0 10px 0 rgba(0,0,0, .1);
      
      .mb-2 {
          box-shadow: none;
          background-color: transparent;
          border-radius: 0;
          
          * a {
              background-color: #E7EBF9;
              border-radius: 6px;
              padding: 5px;
          }
      }
  }

  /* Search */
  .page__header-controls.tasks-page__header-controls {
      .form__row {
          margin: 0 !important;

          .form__col {
              padding: 0;
          }
      }
  }

  /* Navbar dropdowns */
  .notifications-list__list,
  .create-new__list,
  .lg-select__list,
  .user-info__list {
      border-radius: 6px !important;
  }

  .performance-bar {
      border-radius: 6px;

      .performance-card {
          border-radius: 6px;
      }
  }


/* Only styles for the app */
body[startiapp] {
    #crisp-chatbox > div > a {
        margin-bottom: var(--startiapp-inset-bottom, 0px) !important;
    }
}

/* Code from Starti.app CSS for the app, the things that works for all is added above. Below is "commented out" so we can look if any of it makes sense, maybe on smaller screens */
  @media (max-width: 1px) {
  .layout__sidebar-primary {
        overflow: hidden !important;
        max-height: 100vh !important;
    }

    aside.layout__sidebar-primary {
        position: fixed !important;
    }

    input.form-field__input.mb-3 {
        margin-bottom: 0 !important;
    }

    nav.nav {
        padding-block: 20px !important;
        overflow: scroll !important;
        max-height: calc(100vh - 126px);
    }

    /* Login page header */
    :has(.page.form-primary-page.login-page) {
        .header.div_release_header {
            box-shadow: 0 3px 10px 0 rgba(0,0,0, .05);
        }
    }

    .header.div_release_header {
        box-shadow: 0 3px 5px 0 rgba(0,0,0, .1);
    }

    /* Login page form */
    .page.form-primary-page.login-page {
        .page__section {
            box-shadow: none;
            background-color: transparent;
        }

        .page__section {
            padding: 0;
        }

        .form.form_submit_spinner {
            padding: 30px;
            min-width: 100%;
        }

        input {
            border: none;
            margin-block: 5px;
            border-radius: 6px;
            box-shadow: 0 3px 10px 0 rgba(0,0,0, .05);
        }

        p {
            display: flex;
            flex-direction: column;
        }

        .form-field__field-wrap {
            button {
                width: 100%;
                border-radius: 6px;
            }
        }
    }


    /* App */

    button {
        border-radius: 6px;
    }

    .card {
        border-radius: 6px;
        overflow: hidden;
        border: none;
        box-shadow: 0 3px 10px 0 rgba(0,0,0, .1);

        &:has(.bg-success) {
            box-shadow: none;
        }

        .card-body.bg-success {
            background-color: #21C58E !important;
            color: white;
        }

        .card-footer.pl-5 {
            display: flex;
            justify-content: space-around;
            padding-inline: 10px !important;

            select {
                border: 2px solid #8EA2C3;
                border-radius: calc(6px / 2);
            }
        }
    }

    .page__body-bar:has(.company-info) {
        border-radius: 6px;

        .company-info {
            border-radius: 6px;
            .company-info__list {
                border-radius: 6px;
            }
        }
    }

    /* Startguide */ 
    .steps-bar__button.js-close-steps-bar {
        background-color: white;
        color: #0053D8;
        padding: 5px;
        padding-left: 20px;
        border-radius: 100vh;
    }

    .layout__add.steps-bar--parent {
        margin: 0 !important;
    }

    /* Side menu */

    .layout__sidebar-primary.layout__col {
        box-shadow: none !important;

        &.layout__sidebar-primary--is-open {
            box-shadow: 0 0 10px 0 rgba(0,0,0, .5) !important;
        }
    }

    .page__section {
        box-shadow: none;
        border: none;
        border-radius: 6px;
        box-shadow: 0 0 10px 0 rgba(0,0,0, .1);
        
        .mb-2 {
            box-shadow: none;
            background-color: transparent;
            border-radius: 0;
            border-top: 1px solid rgba(0,0,0, .1);
            padding-inline: 0;
            display: flex;
            flex-direction: column;
            gap: 20px;

            * a {
                background-color: #E7EBF9;
                border-radius: 6px;
                padding: 5px;
            }
        }
    }

    /* Search */
    .page__header-controls.tasks-page__header-controls {
        .form__row {
            margin: 0 !important;

            .form__col {
                padding: 0;
            }
        }
    }

    /* Navbar dropdowns */
    .notifications-list__list,
    .create-new__list,
    .lg-select__list,
    .user-info__list {
        border-radius: 6px !important;
    }

    .performance-bar {
        border-radius: 6px;

        ul {
            margin-bottom: 0 !important;
        }

        .performance-card {
            border-radius: 6px;
        }
    }
}