.absol-selectlist {
    font-family: Roboto, sans-serif;
}

.absol-selectlist * {
    box-sizing: border-box;
}

.absol-selectlist .absol-selectlist-item:not(.as-read-only):hover {
    background-color: #efefef;
}

.absol-selectlist .absol-selectlist-item {
    height: calc(20rem / 14);
    font-size: 1rem;
    cursor: pointer;
}

.absol-selectlist-item.as-selected {
    background-color: #dfdfdf;
}


.absol-selectlist-item.as-disabled,
.absol-selectlist-item.as-disabled *,
.am-selectlist-item.as-disabled,
.am-selectlist-item.as-disabled * {
    color: var(--as-disabled-text-color);
    pointer-events: none;
}

.absol-selectlist:not(.as-searching) > .absol-selectlist-item.as-last-in-group,
.as-select-list-box:not(.as-searching) .as-last-in-group {
    position: relative;
    overflow: visible;
}


.as-select-list-box:not(.as-searching) .as-last-in-group::after,
.absol-selectlist:not(.as-searching) > .absol-selectlist-item.as-last-in-group:not(:last-child)::after {
    content: "";
    border-bottom: 1px solid #aaaaaa;
    position: absolute;
    left: 0.2em;
    right: 0.2em;
    bottom: -0.5px;
    z-index: 20;
}

.absol-selectlist-item-text {
    line-height: inherit;
    white-space: pre;
    padding-left: var(--as-input-horizontal-padding);
    padding-right: var(--as-input-horizontal-padding);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.absol-selectlist-item {
    height: 20px;
    line-height: 20px;
    --level: 0;
    padding-left: calc(0.9em * var(--level));
}


.absol-selectlist-item {
    position: relative;
    box-sizing: border-box;
}

.absol-selectlist-item-desc-container {
    position: absolute;
    right: 0.3em;
    top: 0;
    bottom: 0;
}

.absol-selectlist-item-desc {
    font-style: italic;
    line-height: 20px;
    white-space: nowrap;
    color: rgb(37, 37, 37);
}

.absol-selectlist-item-desc:empty {
    display: none;
}

.absol-selectlist-item {
    padding-right: calc(0.35em + var(--select-list-desc-width));
}

.absol-selectlist-item-desc-container {
    width: var(--select-list-desc-width);
}


.as-select-list-icon {
    font-size: 1.5em;
    display: inline-block;
    vertical-align: middle;
    padding-left: var(--as-input-horizontal-padding);
}



/**************** MOBILE ******************************/

:root {
    --modal-margin-top: 80px;
    --modal-margin-bottom: 80px;
    --modal-max-width: 500px;
    --modal-width: calc(100vw - 80px);
    /*--modal-border-radius: 8px;*/
    --modal-border-radius: 0px;
}

.am-list-modal,
.am-list-modal-v2 {
    z-index: 100005;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    box-sizing: border-box;
    padding-top: var(--modal-margin-top);
    background-color: rgba(0, 0, 0, 0.1);
}

.am-list-modal > div,
.am-list-modal-v2 > div {
    display: inline-block;
    text-align: initial;
}


.am-list-popup-box {
    box-shadow: 2px 2px 2px 0px #908787;
    -webkit-box-shadow: 2px 2px 2px 0px #908787;
    background-color: #ffffff;
    border-radius: var(--modal-border-radius);
    font-family: Roboto, sans-serif;
}

.am-list-popup-box.am-enable-search .absol-search-text-input,
.am-list-modal-v2.as-enable-search .absol-search-text-input,
.am-list-popup-box.am-enable-search .as-search-multi-mode-input,
.am-list-modal-v2.as-enable-search .as-search-multi-mode-input {
    visibility: visible;
}


.am-list-popup-header {
    height: calc(2em + 10px);
    display: block;
    white-space: nowrap;
    box-sizing: border-box;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    border-bottom: solid 1px #dddddd;
    /*background-color: rgba(169, 169, 169, 0.2);*/
}

.am-list-popup-header .absol-search-text-input,
.am-list-popup-header .as-search-multi-mode-input {
    display: inline-block;
    width: calc(100% - 2em - 18px);
    vertical-align: middle;
    box-sizing: border-box;
    background-color: white;
}

.am-list-popup-close-btn {
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    padding: 0;
    height: 2em;
    width: 2em;
    font-size: inherit;
    border: none;
    outline: none;
    margin-left: 10px;
    background-color: rgb(255, 255, 255);
    color: #7a7a7a;
    white-space: nowrap;
}

.am-list-popup-close-btn:active {
    color: red;
}


.am-list-popup-close-btn:before {
    content: "";
    display: inline-block;
    height: 2em;
    vertical-align: middle;
}

.am-list-popup-close-btn span {
    font-size: 24px;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}

.am-list-popup-box .absol-search-text-input,
.am-list-popup-box .as-search-multi-mode-input {
    visibility: hidden;
}

.am-list-popup-paging {
    display: block;
    height: 2em;
    text-align: center;
    box-sizing: border-box;
    border-bottom: 1px solid #dddddd;
}

.am-list-popup-paging::before {
    content: "";
    height: 100%;
    display: inline-block;
    vertical-align: middle;
}

.am-list-popup-paging-content {
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.am-list-popup-paging > * {
    display: inline-block;
    vertical-align: middle;
}

.am-list-popup-paging > button {
    padding: 0;
    margin-left: 0.25em;
    margin-right: 0.25em;
    width: 1.75em;
    height: 1.75em;
    display: inline-block;
    background-color: transparent;
    border: none;
    box-sizing: border-box;
    outline: none;
}

.am-list-popup-paging > button:active {
    background-color: rgba(169, 169, 169, 0.3);
}


input[type="number"].am-list-popup-paging-offset {
    width: 4em;
    outline: none;
    margin-right: 0.2em;
    /*border: solid 1px #a9a9a9;*/
    /*border-radius: 0.3em;*/
    border: none;
    text-align: right;
    font-size: inherit;
    height: 1.25em;
    box-sizing: border-box;

}

.am-list-popup-list-scroller {
    width: 100%;
    overflow: auto;
    --content-height: calc(100vh - 200px);
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}


.am-list-popup-list-scroller::-webkit-scrollbar {
    display: none;
}

.am-list-popup-content {
    display: block;
    position: relative;
    min-width: calc(80vw - 20px);
}

.am-list-popup-list-page {
    position: absolute;
    left: 0;
    right: 0;
    top: -200vh;
    box-sizing: border-box;
}


.am-list-modal .am-selectlist {
    width: 100%;
}

.am-list-popup-list-page.am-selectlist {
    --desc-width: inherit;
}

.am-value-hidden .am-selectlist-item.as-selected {
    display: none;
}

.am-selectlist {
    display: table;
    border-collapse: collapse;
    border-spacing: 0;
}

.am-selectlist > .am-selectlist-item {
    display: table-row;

}

.am-selectlist > .am-selectlist-item:active {
    background-color: rgba(169, 169, 169, 0.4);
}

.am-selectlist > .am-selectlist-item.as-selected {
    background-color: #dfdfdf;
}


.am-selectlist > .am-selectlist-item {
    border-bottom: 0.5px solid #dddddd;
}

.am-selectlist > .am-selectlist-item > .am-selectlist-item-check-ctn {
    display: table-cell;
    vertical-align: middle;
    padding-left: 0.35em;
}

.am-selectlist > .am-selectlist-item > .am-selectlist-item-text-ctn,
.am-selectlist > .am-selectlist-item > .am-selectlist-item-desc-ctn {
    display: table-cell;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.am-selectlist > .am-selectlist-item > .am-selectlist-item-text-ctn {
    padding-right: 5px;
    padding-left: calc(10px + 0.9em * var(--level));
}

.am-selectlist > .am-selectlist-item > .am-selectlist-item-desc-ctn {
    padding-left: 5px;
    padding-right: 10px;
}


.am-selectlist {
    --desc-width: auto;
}

.am-selectlist .am-selectlist-item-desc-ctn {
    width: var(--desc-width);
}

.am-check-list-page {
    overflow: hidden;
}

/******************************************************/
.am-selectlist-item {
    --level: 0;
}

.am-selectlist-item-text-ctn {
    display: inline-block;
    vertical-align: middle;
}

.am-selectlist-item-desc-ctn {
    display: inline-block;
    vertical-align: middle;
}


.am-selectlist-item-desc {
    font-style: italic;
    line-height: 20px;
    color: rgb(80, 80, 82);
    white-space: pre;
}


.am-selectlist-item-icon {
    font-size: 1.5em;
    display: inline-block;
    vertical-align: middle;
}

.am-check-list-scroller {
    max-height: calc(100vh - var(--modal-margin-top) - 200px);
    overflow-y: auto;
    overflow-x: hidden;
}

.am-check-list-modal {
    --col1-width: 100px;
    --col2-width: 100px;
}

.am-check-list-modal .am-list-popup-content {
    width: calc(var(--col1-width) + var(--col2-width));
    min-width: 300px;
}

.am-check-list-modal .am-selectlist-item {
    position: relative;
    min-height: 30px;
    box-sizing: border-box;
}

.am-check-list-modal .am-selectlist-item-desc-ctn {
    position: absolute;
    width: var(--col2-width);
    right: 0;
    height: 100%;
    white-space: nowrap;

}

.am-check-list-modal .am-selectlist-item-text,
.am-check-list-modal .am-selectlist-item-desc {
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 20px;
    display: inline-block;
    vertical-align: middle;
    white-space: pre;
}

.am-check-list-modal .am-selectlist-item-text-ctn {
    position: absolute;
    right: var(--col2-width);
    left: calc(var(--level) * 12px + 30px);
    height: 100%;
    white-space: nowrap;
}


.am-check-list-modal .am-selectlist-item-check-ctn {
    position: absolute;
    top: 0;
    left: calc(var(--level) * 12px + 5px);
    height: 100%;
}

.am-check-list-modal .am-selectlist-item-check-ctn::before,
.am-check-list-modal .am-selectlist-item-check-ctn > *,
.am-check-list-modal .am-selectlist-item-text-ctn::before,
.am-check-list-modal .am-selectlist-item-desc-ctn::before,
.am-check-list-modal .am-selectlist-item-text-ctn > span {
    display: inline-block;
    vertical-align: middle;
}

.am-check-list-modal .am-selectlist-item-check-ctn::before,
.am-check-list-modal .am-selectlist-item-text-ctn::before,
.am-check-list-modal .am-selectlist-item-desc-ctn::before {
    content: "";
    height: 100%;
}


.am-check-list-modal .am-selectlist-item-text-ctn {
    white-space: nowrap;
}

.am-check-list-modal .am-selectlist-item-text {
    max-height: 100%;
    line-height: 20px;
    white-space: pre;
    width: calc(var(--col1-width) - 12px * var(--level) - 30px - 21px - 10px);
    overflow: hidden;
    text-overflow: ellipsis;
}

.am-list-modal-v2 {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    font-family: Roboto, sans-serif;
}

.am-list-modal-v2 .am-list-popup-list-scroller {
    max-height: calc(100vh - var(--modal-margin-top) - 200px);
}

.am-list-modal-v2 .am-list-popup-content {
    width: calc(var(--col1-width) + var(--col2-width));
    min-width: calc(80vw - 20px);
}

.am-list-modal-v2 .am-selectlist-item-text-ctn {
    padding-left: 10px;
    white-space: nowrap;
}

.am-list-modal-v2 .am-selectlist-item-text-ctn::before,
.am-list-modal-v2 .am-selectlist-item-desc-ctn::before {
    content: "";
    height: 100%;
}

.am-list-modal-v2 .am-selectlist-item-text-ctn::before,
.am-list-modal-v2 .am-selectlist-item-desc-ctn::before,
.am-list-modal-v2 .am-selectlist-item-text,
.am-list-modal-v2 .am-selectlist-item-desc {
    display: inline-block;
    vertical-align: middle;
}

.am-selectlist-item-text {
    white-space: pre;
}

.am-list-modal-v2 .am-selectlist-item {
    position: relative;
    height: 30px;
    line-height: 20px;
}


.am-list-modal-v2 .am-selectlist-item::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid #eee;
}

.am-check-list-modal .am-selectlist-item.as-last-in-group::after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom: 1px solid #aaa;
}

.am-list-modal-v2 .am-selectlist-item.as-selected {
    background-color: #dfdfdf;
}

.am-list-modal-v2 .am-selectlist-item-text-ctn,
.am-list-modal-v2 .am-selectlist-item-desc-ctn {
    box-sizing: border-box;
    overflow: hidden;
    height: 100%;
}

.am-list-modal-v2 .am-selectlist-item {
    white-space: nowrap;
}


.am-list-modal-v2 .am-selectlist-item-text-ctn {
    width: var(--col1-width);
}

.am-list-modal-v2 .am-selectlist-item-desc-ctn {
    width: var(--col2-width);
}

.am-list-modal-v2 .am-list-popup-header {
    height: auto;
    min-height: calc(2em + 10px);
}

.am-selectlist-item.as-disabled .as-checkbox-input {
    visibility: hidden;
}

.am-selectlist-item.as-disabled {
    pointer-events: none;
}