/*watson_v0-14-3_skillpackage2023*/
#WACContainer.WACContainer .WAC__overlay-panel--closed .WAC__header-name {
    color: #292929 !important;
}

#WACContainer.WACContainer .WACWidget {
    height: 550px !important;
    max-height: 90% !important;
    /*⬇️ disable min-height in production ⬇️ */
    /* min-height: 90% !important; */
}

#WACContainer.WACContainer .WACAlternateSuggestionsContainer__Padding {
    padding: 10px !important;
}

#WACContainer.WACContainer .WAC__date {
    margin-top: 0px !important;
    text-align: left !important;
    margin-left: 26px !important;
}

#WACContainer.WACContainer a.trainingRef:link,
a.trainingRef:visited {
    font-size: 12px !important;
    background-color: grey !important;
    border: red !important;
    border: 10px !important;
    color: white !important;
    padding: 4px 15px 5px 15px !important;
    margin: 4px 0px 0px 8px !important;
    border-radius: 8px !important;
    text-align: center !important;
    text-decoration: none !important;
    display: inline-block !important;
}

#WACContainer.WACContainer a.trainingRef:hover,
a.trainingRef:active {
    background-color: #e20074 !important;
    margin-left: 15px !important;
}

#WACContainer.WACContainer .WACWidget {
    bottom: 61px !important;
}

/* #WACContainer .WAC__homeScreenOriginal-starters::after {
    line-height: 1.1 !important;
    content: "\a Info: Deine Eingaben werden anonymisert durch IBM Watson verarbeitet. Achte darauf keine personenbezogenen oder privaten Informationen einzugeben." !important;
    color: black !important;
    font-size: 14px !important;
    white-space: pre-wrap !important;
} */

#WACContainer.WACContainer .WAC__homeScreenOriginal-greeting {
    line-height: 1.2;
}

#WACContainer.WACContainer .rawHtmlNews {
    background-color: white;
    clear: both;
    line-height: 0;
    overflow: auto;
    padding-top: 5px;
    padding-bottom: 5px;
}

#WACContainer.WACContainer .htmlNews {
    background-color: white;
    padding: 17px;
    box-shadow: 0px 6px 10px rgb(0 0 0 / 25%);
    border-radius: 7px;
    margin-top: 10px;
}

#WACContainer.WACContainer .htmlTrainingCard {
    background-color: white;
    padding: 17px;
    box-shadow: 0px 6px 10px rgb(0 0 0 / 25%);
    border-radius: 7px;
    margin-top: 10px;
}

#WACContainer.WACContainer .WACLauncher__ButtonContainer {
    box-shadow: 0 5px 20px rgb(0 0 0 / 25%), 0 8px 8px rgb(0 0 0 / 22%) !important;
}

#WACContainer.WACContainer .WACWidget.WACWidget--launched.WACWidget--defaultElement {
    box-shadow: 0 5px 20px rgb(0 0 0 / 25%), 0 8px 8px rgb(0 0 0 / 22%) !important;
}

@media (max-width: 500px) {
    #WACContainer.WACContainer .WACWidget {
        bottom: 0 !important;
        max-height: initial !important;
        min-height: initial !important;
        height: 100% !important;
    }
}

#WACContainer.WACContainer .chatbotgif {
    max-width: 160px !important;
}

/* Todo: add and test qualifier #WACContainer.WACContainer */
.chatbot-card-footer ul li svg {
    width: 15px !important;
    height: 15px !important;
    margin-right: 5px !important;
}

.chatbot-card-wrapper {
    width: 240px !important;
    margin-top: 20px !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2) !important;
}

.chatbot-card-wrapper .chatbot-card-image figure img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
}
.chatbot-card-wrapper .chatbot-card-body {
    padding: 15px !important;
}
.chatbot-card-wrapper .chatbot-card-body .chatbot-card-title {
    margin-bottom: 20px;
    font-size: 22px;
    color: #333333;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
}
.chatbot-card-wrapper .card-body .card-info {
    margin-bottom: 15px;
    font-size: 16px;
    color: #686e73;
    font-weight: 400;
    line-height: 1.7;
}
.chatbot-detail-btn a {
    margin-left: 0 !important;
    margin-top: 15px !important;
    border: 0 !important;
    background-color: #cb2b71 !important;
    border-radius: 5px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    color: #fff !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
}
.chatbot-card-wrapper .chatbot-card-footer {
    padding: 20px !important;
    background-color: #f7f7f7;
}
.chatbot-card-footer ul {
    padding: 0 !important;
    display: flex !important;
    margin: 0 -5px !important;
    flex-wrap: nowrap !important;
}
.chatbot-card-footer ul li {
    display: flex !important;
    align-items: center;
    /* word-break: break-all; */
    flex-wrap: nowrap !important;
}
.chatbot-card-footer ul li.width48 {
    flex: 0 0 57% !important;
    /* max-width: 81% !important; */
    padding: 0 5px !important;
}
.chatbot-card-footer ul li.width26 {
    padding: 0 5px !important;
}
.chatbot-card-footer ul li img {
    width: 20px !important;
    margin-right: 6px !important;
}
.chatbot-card-footer ul li span {
    font-size: 15px !important;
    color: #333333 !important;
}
.chatbot-card-footer ul li:last-child svg {
    width: 17px !important;
    height: 17px !important;
}

/*
* Cards generic
*/
#WACContainer.WACContainer .custom-card-wrap .hd {
    /*have the same headline height*/
    min-height: 36px !important;
}

/*
* Top Rated Card Start
*/
.top-training-card_wrp {
    width: 240px !important;
    margin-top: 20px !important;
    min-height: 315px !important;
    border-radius: 10px !important;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.2) !important;
    padding: 35px 25px 25px !important;
    position: relative !important;
    clear: both !important; /*test*/
}

.newest-card::before {
    width: 100px !important;
    height: 8px !important;
    background: #06576f !important;
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;
    border-radius: 0 0 6px 6px !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
}

.topused-card::before {
    width: 100px !important;
    height: 8px !important;
    background: #497d76 !important;
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;
    border-radius: 0 0 6px 6px !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
}

.toprated-card::before {
    width: 100px !important;
    height: 8px !important;
    background: #e20174 !important;
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 0 !important;
    border-radius: 0 0 6px 6px !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
}

.top-training-card_wrp .hd {
    font-size: 20px !important;
    text-align: center !important;
    font-family: sans-serif !important;
    margin-bottom: 20px !important;
}

.top-training-card_wrp a {
    display: flex !important;
    margin-bottom: 10px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    padding: 6px 10px !important;
    font-family: sans-serif;
    font-style: normal !important;
    color: #fff !important;
    text-decoration: none !important;
    align-items: center !important;
    position: relative !important;
}

.top-training-card_wrp a svg {
    margin-right: 4px !important;
    /* width: 20px !important; */
    /* height: 20px !important; */
    fill: #fff !important;
    max-width: 20px !important;
}

.top-training-card_wrp a:before,
.top-training-card_wrp a:after {
    position: absolute !important;
    visibility: hidden !important;
    bottom: 100% !important;
    left: 50% !important;
    opacity: 0 !important;
    transition: 0.5s opacity !important;
}

.top-training-card_wrp a:before {
    position: absolute !important;
    content: "" !important;
    border: 6px solid transparent !important;
    border-top-color: #e20174 !important;
    margin-bottom: -2px !important;
    left: calc(50% - 3px) !important;
}

.top-training-card_wrp a:after {
    background: #e20174 !important;
    color: white !important;
    padding: 10px !important;
    content: attr(data-tooltip) !important;
    border-radius: 8px !important;
    transform: translateX(-50%) !important;
    margin-bottom: 10px !important;
    font-size: 13px !important;
    text-align: left !important;
    box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.75) !important;
}

.top-training-card_wrp a:hover:before,
.top-training-card_wrp a:hover:after {
    visibility: visible !important;
    opacity: 1 !important;
}

.top-training-card_wrp a:after {
    width: max-content !important;
    max-width: 200px !important;
}

#WACWidget.WACWidget.full-screen {
    width: 50% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 95% !important;
    left: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    top: 45px !important;
}

.custom-card-wrap {
    margin-top: 20px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 25px !important;
}

@media screen and (max-width: 800px) {
    #WACWidget.WACWidget.full-screen {
        width: calc(100% - 40px) !important;
    }
}

@media screen and (max-width: 576px) {
    .wrapper {
        padding: 20px;
    }
    .card-wrapper {
        max-width: 100%;
    }
}

#WACContainer.WACContainer button.WACHeader__Button.WAC__button--base.WAC__button--ghost.WACHeader__CloseButton:focus {
    /*disable focus switch when no buttons are active*/
    box-shadow: none !important;
}
