@use '../../_styles/mixin.scss' as *;

@include respond('<=laptop') {
  .o-select-large {
    --select-text-size: var(--o-font_size-tip1);
    --select-text-height: var(--o-line_height-tip1);

    --select-height: 36px;

    --select-icon-size: var(--o-icon_size_control-s);
  }

  .o-select-medium {
    --select-height: 28px;
  }

  .o-select-options-medium {
    & .o-option {
      --option-padding: 2px 12px;
    }

    & .o-cascader-option {
      --cascader-option-padding: 2px 12px;
    }
  }
}

@include respond('<=pad') {
  .o-select-options-dlg {
    --select-options-padding: 0;

    .o-option-checkbox {
      width: 100%;
    }

    .o-checkbox-label {
      margin-left: 0;
    }
    .o-checkbox-wrap {
      width: 100%;
      flex-direction: row-reverse;
      justify-content: space-between;
    }

    .o-option-multiple {
      border-radius: 0;
      --option-padding: 12px 0;
      --option-gap: 0;

      position: relative;
      &::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        border-top: 1px solid var(--o-color-control4);
      }
    }
  }
}

@include respond('<=pad_v') {
  .o-select-large {
    --select-icon-size: var(--o-icon_size_control-m);

    --select-height: var(--o-control_size-l);
  }
}