.app-toolbar {
    background-image: url(../../assets/media/patterns/bg_new.jpg);
    background-position: 50% 50%;
}

label.error {
    color: #a94442;
    margin-left: 10px;
    width: auto;
    display: inline;
}

.dz-success-mark {
	background-color: rgb(102, 187, 106, 0.9) !important;
}

.dz-success-mark svg {
	font-size: 54px;
	fill: #fff !important;
}

.dz-error-mark {
	background-color: rgba(239, 83, 80, 0.9) !important;
}

.dz-error-mark svg {
	font-size: 54px;
	fill: #fff !important;
}

#kt_app_header {
    position: absolute;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.7);
}

#iclp-title {
    display: grid;
    grid-template-rows: 50px 25px;
    grid-auto-flow: row;
    align-items: end;
}

#iclp-title img {
    height: 100%;
    margin-left: 1rem;
}

#iclp-chinese,
#iclp-title br {
    display: none;
}

#iclp-title .text-danger-emphasis {
    padding: 0 1rem;
    font-family: serif;
    font-size: 1rem;
}

@media (max-width: 768px) {

    /*#kt_app_header_menu_toggle,*/
    #kt_app_header_container img {
        display: none;
    }

    #iclp-title {
        display: block;
    }

    #iclp-chinese {
        display: inline-block;
        font-family: sans-serif;
    }

    #iclp-title .text-danger-emphasis {
        display: none;
    }

    .app-toolbar {
        background-size: cover;
        background-position: 50% 50%;
    }

    #kt_app_toolbar {
        height: 30vh;
    }

    #kt_app_content {
        width: 100% !important;
        margin-top: -10vh;
    }
}

.long-text {
    word-break: break-word; /* 舊版瀏覽器支援 */
    overflow-wrap: break-word; /* 新版標準 */
    display: block; /* 讓整個鏈接獨占一行 */
}

.text-ellipsis {
    white-space: nowrap; /* 不換行 */
    overflow: hidden; /* 超出隱藏 */
    text-overflow: ellipsis; /* 顯示省略號 */
    display: block; /* 讓它撐滿 */
}

.m-menus {
    width: 100%;
    text-align: left;
    height: 48px;
    margin-bottom: 6px;
}

@media (max-width: 768px) {
    .dz-message {
        flex-direction: column
    }
}

.rate ,.speaking-input {
    background: #e9ecef
}
