/*
 * LMS version 1.11-git
 *
 *  (C) Copyright 2001-2025 LMS Developers
 *
 *  Please, see the doc/AUTHORS for more information about authors!
 *
 *  This program is free software; you can redistribute it and/or modify
 *  it under the terms of the GNU General Public License Version 2 as
 *  published by the Free Software Foundation.
 *
 *  This program is distributed in the hope that it will be useful,
 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU General Public License for more details.
 *
 *  You should have received a copy of the GNU General Public License
 *  along with this program; if not, write to the Free Software
 *  Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307,
 *  USA.
 *
 *  $Id$
 */

.select2-container {
  text-align: left;
  font-size: @font-size-high;
  font-weight: initial;
  @media screen and (max-width: @font-size-normal-max-width) {
    font-size: @font-size-normal;
  }
  @media screen and (max-width: @font-size-mobile-max-width) {
    font-size: @font-size-mobile;
  }

  &--default .select2-selection--single {
    position: relative;
    padding-right: 20px;
  }

  .select2-selection.select2-selection--multiple {
    padding-bottom: 3px;
    display: block;

    .select2-selection__choice {
      background-color: @light;
      background-image: none;
      font-weight: bold;
      border: 1px solid @darkbrown;
      margin-top: 3px;
      margin-left: 3px;
    }

    .select2-selection__choice__remove {
      color: inherit;

      &:hover {
        background-color: @dark;
      }
    }
  }

  .selection {
    display: inline-flex;
  }

  .select2-selection {
    height: unset;
    min-height: 1.6em;
    min-width: 18em;
    max-width: 20vw;
    display: flex;
    align-items: center;
    border: @form-element-border;
    background-color: @lucid;

    .select2-selection__rendered {
      line-height: initial;
      color: inherit;
      white-space: normal;
    }

    .select2-selection__arrow {
      height: 100%;
    }

    &.select2-selection--single .select2-selection__clear {
      height: inherit;
      position: absolute;
      right: 0;
      left: auto;

      margin-right: 20px;
      font-size: 140%;
      color: grey;
    }

    &.alert,
    &.lms-ui-error,
    &:invalid {
      &.select2-selection--single,
      &.select2-selection--multiple {
        border: @error-outline;
        box-shadow: @error-box-shadow;

        &:focus {
          border: @error-outline-focus;
          box-shadow: @error-box-shadow-focus;
          outline: none;
        }
      }
    }
    &.lms-ui-warning {
      &.select2-selection--single,
      &.select2-selection--multiple {
        border: @warning-outline;
        background-color: @warning-background;
        box-shadow: @warning-box-shadow;

        &:focus {
          border: @warning-outline-focus;
          background-color: @warning-background;
          box-shadow: @warning-box-shadow-focus;
        }
      }
    }

    &.select2-selection--multiple {
      max-width: 30vw;

      .select2-selection__rendered {
        margin-block-start: 0;
        margin-block-end: 0;
        white-space: normal;
        line-height: 1.5em;
      }
    }
  }

  .select2-results__group {
    padding-top: 3px;
    padding-bottom: 3px;
  }

  .select2-dropdown {
    background-color: @lucid;
  }

  .select2-results__option .select2-results__option {
    padding: 3px 15px;
  }

  .select2-results__option--selected {
    background-color: #5895f7;
    color: white;
  }

  .select2-results__option--selectable.select2-results__option--highlighted {
    background-color: #3875d7;
  }

  .select2-results > .select2-results__options {
    max-height: inherit;
  }
}

.select2-results {
  max-height: 30vh;

  .select2-results__options.select2-results__options--nested {
    padding-inline-start: 0;
  }
}

.select2-results__option {
  padding: 3px 3px;
  white-space: nowrap;

  .select2-results__option {
    padding: 3px 3px;
  }

  em {
    background-color: @dark;
    font-weight: bold;
    text-decoration: none;
  }
}
