@import '../../node_modules/font-awesome/less/font-awesome.less';
@import '../theme/blue.theme.less';
@import '../theme/dark-blue.theme.less';
@import '../theme/default.theme.less';
.view-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    .view-header {
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 1;
        .van-button{
            height: @nav-bar-height;
            line-height: @nav-bar-height;
            color: @color-tertiary-contrast;
        }
        .app-view-lefttoolbar{
            height: @nav-bar-height;
            line-height: @nav-bar-height;
        }
        .app-nav-bar{
            height: @nav-bar-height;
            line-height: @nav-bar-height;
            background: @nav-bar-backgroud;
            .van-icon{
                color:@nav-bar-color;
            }
            .van-nav-bar__title{
                color: @nav-bar-color;
                font-size: @nav-bar-fontSize;
            }
            .van-nav-bar__right {
                height: @nav-bar-height;
                line-height: @nav-bar-height;
            }
        }
    }
    .view-header-bottom {
        height: 40px;
        width: 100%;
    }
    >.view-content {
        flex-grow: 1;
        overflow: auto;
        height: 50%;
    }
    >.view-search {
        >.van-cell {
            padding: 0px;
            padding-right: @padding-md;
            display: flex;
            align-items: center;
            .view-search__searchform {
                font-size: @font-size-lg;
                color: #969799;
            }
        }
    }
    > .view-footer{
        color: @color-tertiary-contrast;
       .bottom_menu{
        text-align: center;
        margin: 0 4px 4px 4px;
            ion-button{
                width: calc(50% - 4px);
                --border-radius:0;
            }
        }
    }
}

.app-layoutpanel{
  .app-mob-span{
    font-family: Ping;
    ion-input{
      --padding-top: 0;
      --padding-bottom: 0;
      --padding-end: 0;
      --padding-start: 0;
    }
  }
  ion-icon{
    position: relative;
    left: 8px;
    top: 1px;
  }
}
.icon {
    width: 4em;
    height: 4em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}
ion-action-sheet{
    --max-height: 60%;
}

// 默认主题颜色
@default-active-color: @color-primary;
@default-text-color: #fff;
.theme(@default-active-color,@default-text-color);

// 主题公共函数
.theme(@theme-color,@text-color){
    ion-tab-bar{
      ion-tab-button{
          --color-selected: @theme-color;
      }
    }
    ion-button{
        --background: @theme-color;
        --color: @text-color;
    }
    .view-container {
      ion-header{
        .ionoc-view-header{
          --background:  @theme-color;
          --color: @text-color;
        }
      }
    }
    ion-toggle {
      --background-checked: @theme-color;
    }
    .app-form-item.item-has-focus{
        >ion-label {
            color: @theme-color ;
        }
    }
    ion-picker{
      color: @theme-color ;
      .picker-toolbar-button{
        button{
          color: @theme-color ;
        }
      }
    }
    ion-action-sheet{
      --button-color:@theme-color;
      --max-height: 60%;
    }
    ion-alert{
      .alert-button{
        color: @theme-color ;
      }
      [aria-checked=true].sc-ion-alert-ios .alert-checkbox-icon.sc-ion-alert-ios{
        background-color: @theme-color ;
        border-color: @theme-color ;
      }
    }
    ion-checkbox{
      --background-checked	: @theme-color ;
      --border-color-checked: @theme-color ;
    }
    .van-radio__icon--checked .van-icon {
      color: #fff;
      background-color: @theme-color;
      border-color: @theme-color;
    }
    .van-sidebar-item--select::before{
      background-color: @theme-color;
    }
}

// 默认布局
@default-form-text-align:right;
.layout(@default-form-text-align);

// 布局公共函数
.layout(@form-text-align){
  .app-mobile-select ion-select::part(text) {
    text-align: @form-text-align;
  }
  .app-mobile-check-list ion-select::part(text) {
    text-align: @form-text-align;
  }
  .app-mobile-datetime-picker {
    ion-datetime{
      text-align: @form-text-align;
    }
  }
  .app-picker .ibz-input {
    text-align: @form-text-align;
  }
  .left{
      .app-form-item-input{
          text-align: @form-text-align;
      }
    }
  .app-mob-mpicker > ion-input {
      text-align: @form-text-align;
  }
  ion-textarea{
    text-align: @form-text-align;
  }
}
@import './user.less';


// 视图标题样式
// .ionoc-view-header {
//     --background: @color-secondary-shade;
// }