.as-text-input {
    border-style: solid;
    border-width: 1px;
    border-radius: var(--as-input-border-radius);
    border-color: var(--border-color);
    outline: none;
    height: var(--as-input-height);
    padding-left: var(--as-input-vertical-padding);
    font-size: inherit;
    box-sizing: border-box;
    --text-content-width: 0em;
    font-family: Roboto, sans-serif;
    color: inherit;
}

.as-text-input[readonly].as-border-none {
    border: none;
    padding-left: 0;
    padding-right: 0;
}

input[type="text"].as-text-input:disabled,
textarea.as-text-input:disabled {
    background-color: var(--as-disabled-background-color);
    color: var(--as-disabled-text-color);
}

input[type="text"].as-text-input.as-background-none {
    background-color: transparent;
}

.as-text-input[data-size="large"] {
    font-size: var(--large-font-size);
    height: var(--large-size);
    border-radius: var(--large-radius);
}

.as-text-input[data-size="regular"] {
    font-size: var(--default-font-size);
    height: var(--default-size);
    border-radius: var(--default-radius);
}

.as-text-input:focus {

}


.as-blink-text {
    --blink-duration: 1s;
    --text-color: black;
    animation-name: as-anim-text-blink-1-1;
    animation-duration: var(--blink-duration);
    animation-iteration-count: infinite;
}


@keyframes as-anim-text-blink-1-1 {
    0% {
        color: var(--text-color);
    }
    49% {
        color: var(--text-color);
    }
    50% {
        color: transparent;
    }
    99% {
        color: transparent;
    }
    100% {
        color: var(--text-color);
    }
}

.as-mti-star {
    font-family: 'Material Icons';
    color: #ffa834;
    font-size: var(--icon-font-size);
    -webkit-font-smoothing: antialiased;
}

.as-mti-star::before {
    content: "star";
}

.as-cursor-pointer {
    cursor: pointer;
}


.as-table-grid {
    display: table;
}

.as-table-grid.as-inline {
    display: inline-table;
}

.as-table-grid-row {
    display: table-row;
}


.as-table-grid-cell {
    display: table-cell;
}


.as-pseudo-align-child-center {
    text-align: center;
}

.as-pseudo-align-child-center::before {
    height: 100%;
    content: "";
    vertical-align: middle;
    display: inline-block;
}

.as-pseudo-align-child-center > * {
    display: inline-block;
    vertical-align: middle;
}


.as-transparent-button,
.as-simple-icon-button {
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0;
    font-size: inherit;
    color: var(--as-transparent-button-text-color);
    border-radius: 0.3125em;
}

.as-transparent-button:hover {
    color: var(--as-transparent-button-text-hover-color);
}


.as-transparent-button:active {
    color: var(--as-transparent-button-text-active-color);
}



.as-simple-icon-button:hover {
    background-color: var(--as-sp-icon-button-hover-background-color);
}

.as-simple-icon-button:active {
    background-color: var(--as-sp-icon-button-active-background-color);
}


.as-transparent-button .mdi {
    font-size: 1.5em;
    display: inline-block;
    vertical-align: middle;
}

.as-transparent-button:disabled {
    pointer-events: none;
}

.as-transparent-button > svg,
.as-transparent-button > img {
    width: 1.5em;
    height: 1.5em;
}


.as-transparent-button.as-variant-danger {
    color: var(--variant-color-danger);
}

.as-transparent-button.as-variant-danger:hover {
    color: #c03542;
}


.as-transparent-button.as-variant-danger:active {
    color: #ef0d23;
}

button.as-transparent-button:disabled {
    color: #dddddd;
}

.as-section-text-n-line {
    position: relative;
    display: block;
    padding-bottom: 5px;
}

.as-section-text-n-line span {
    background-color: white;
    position: relative;
    z-index: 2;
    padding-right: 5px;
    display: inline-block;
}


.as-section-text-n-line::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    top: calc(50% - 1px);
    border-top: 1px solid #dddddd;
}

.as-display-hidden {
    display: none !important;
}