html, body {
    background-color: #f7f7f7;
    min-height: 100vh;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'HUKSans', 'Arial Narrow', Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.4;
    background-image: url('./Pictures/Teams-Hintergrundbild10mitLogo_27953_office.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: right top;
    background-size: cover;
}

div.ChatbotBox_SD {
    height: 100vh;
    margin: auto;
    max-width: 600px;
    min-width: 360px;
    box-sizing: border-box;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
}

@media (max-width: 768px) {
    div.ChatbotBox_SD {
        width: 100%;
        box-shadow: none !important;
    }
}

div.ChatbotBox_SD > h1 {
    background-color: #ffed00;
    height: 40px;
    padding: 10px 0px 0px 10px;
    margin: 0;
    font-size: x-large;
    font-weight: 700;
    border-style: solid;
    border-color: #97abb6;
    border-width: 1px 1px 0px 1px;
}

#webchat {
    height: calc(100% - 40px);
    box-sizing: border-box;
    border-style: solid;
    border-color: #97abb6;
    border-width: 0px 1px 1px 1px;
}

.webchat__css-custom-properties > div {
    background-image: url('./Pictures/Logo_Wortbildmarke-1.png'), url('./Pictures/welle.svg');
    background-repeat: no-repeat, no-repeat;
    background-size: 150px auto, 100% auto;
    background-position: bottom 55px right, bottom;
}

.webchat__basic-transcript__filler {
    display: none;
}

.is-user-message {
    display: flex;
    flex-direction: row-reverse; /* DREHEN: Avatar rechts, Text links */
    justify-content: flex-start; /* Durch reverse ist 'start' jetzt rechts */
}

.webchat__basic-transcript {
    padding-bottom: 40px;
}

#webchat .webchat__bubble {
    width: 100%; /* Nimmt die volle Breite des Containers ein */
    max-width: 100%; /* Stellt sicher, dass es nicht kleiner bleibt */
    box-sizing: border-box; /* Berücksichtigt Padding und Border in der Breite */
}

#webchat .webchat__icon-button {
    background-color: #edf1f2;
    transition: background-color .5s ease-in-out;
}

#webchat .webchat__icon-button:hover {
    background-color: #4e7380;
}

#webchat .webchat__icon-button svg {
    fill: #4e7380;
}

#webchat .webchat__icon-button:hover svg {
    fill: #ffffff;
}

#webchat .webchat__icon-button__shade {
    background: none;
}

#webchat .webchat__suggested-action {
    transition: background-color .5s ease-in-out;
}

#webchat .webchat__suggested-action:hover {
    background-color: #4e7380;
    color: #fff;
}

#webchat p, #webchat li, #webchat a {
    font-size: 1em;
}

#webchat p a, #webchat li a {
    color: #333;
    font-weight: 700;
    text-decoration: none;
    position: relative
}

#webchat p a:hover, #webchat li a:hover {
    color: #4e7380
}


/* Light (300) */
@font-face {
    font-family: 'HUKSans';
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url('fonts/HUKSans-Light.woff2') format('woff2'),
    url('fonts/HUKSans-Light.woff') format('woff');
}

@font-face {
    font-family: 'HUKSans';
    font-weight: 300;
    font-style: italic;
    font-display: swap;
    src: url('fonts/HUKSans-LightItalic.woff2') format('woff2'),
    url('fonts/HUKSans-LightItalic.woff') format('woff');
}

/* Regular (400) */
@font-face {
    font-family: 'HUKSans';
    font-weight: 400; /* oder normal */
    font-style: normal;
    font-display: swap;
    src: url('fonts/HUKSans-Regular.woff2') format('woff2'),
    url('fonts/HUKSans-Regular.woff') format('woff');
}

@font-face {
    font-family: 'HUKSans';
    font-weight: 400;
    font-style: italic;
    font-display: swap;
    src: url('fonts/HUKSans-Italic.woff2') format('woff2'),
    url('fonts/HUKSans-Italic.woff') format('woff');
}

/* Bold (700) */
@font-face {
    font-family: 'HUKSans';
    font-weight: 700; /* oder bold */
    font-style: normal;
    font-display: swap;
    src: url('fonts/HUKSans-Bold.woff2') format('woff2'),
    url('fonts/HUKSans-Bold.woff') format('woff');
}

@font-face {
    font-family: 'HUKSans';
    font-weight: 700;
    font-style: italic;
    font-display: swap;
    src: url('fonts/HUKSans-BoldItalic.woff2') format('woff2'),
    url('fonts/HUKSans-BoldItalic.woff') format('woff');
}

/* Black (900) */
@font-face {
    font-family: 'HUKSans';
    font-weight: 900;
    font-style: normal;
    font-display: swap;
    src: url('fonts/HUKSans-Black.woff2') format('woff2'),
    url('fonts/HUKSans-Black.woff') format('woff');
}

@font-face {
    font-family: 'HUKSans';
    font-weight: 900;
    font-style: italic;
    font-display: swap;
    src: url('fonts/HUKSans-BlackItalic.woff2') format('woff2'),
    url('fonts/HUKSans-BlackItalic.woff') format('woff');
}

@font-face {
    font-family: "FabricMDL2Icons";
    src: url("data:application/octet-stream;base64,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") format("truetype")
}

.ac-adaptiveCard .ac-pushButton:not(:disabled):not([aria-disabled="true"]) {
    background: #fff;
    border: 1px solid #4e7380;
    border-radius: 2px;
    color: #4C7383;
    font-size: inherit;
    font-weight: 400;
    height: 52px;
    padding: 1px 20px;
    transition: background-color .5s ease-in-out;
}

.ac-adaptiveCard .ac-pushButton:not(:disabled):not([aria-disabled="true"]):hover {
    background-color: #4e7380;
    color: #fff;
    cursor: pointer;
}

.ac-adaptiveCard .ac-pushButton:not(:disabled):not([aria-disabled="true"]) > div {
    text-overflow: clip !important;
    white-space: normal !important;
}

.webchat__bubble__content ol {
    padding-inline-start: 2.5em;
}

.webchat__bubble__content ol li {
    list-style-type: decimal;
}

.webchat__bubble__content ul {
    padding-inline-start: 2.5em;
}

.webchat__bubble__content ul li {
    list-style-type: circle;
}

#incidents {
    background: #FFF;
    border-style: solid;
    border-color: #97abb6;
    border-width: 0px 1px 0px 1px;
}

#incidents .incident {
    background: #F0F0F0;
    border: 2px solid #EB373C;
    border-radius: 10px;
    color: #333;
    min-height: 38px;
    padding: 10px;
    position: relative;
    margin: 10px;
}

#incidents .incident__close {
    background: transparent;
    border: none;
    position: absolute;
    right: 0.3em;
    top: 0.5em;
}

#incidents .ms-Icon {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-family: "FabricMDL2Icons";
    font-style: normal;
    font-weight: normal;
    font-size: 0.8em;
    speak: none;
}

#incidents .ms-Icon--ChromeClose:before {
    content: ""
}

#incidents .ms-Icon--ChromeMinimize:before {
    content: ""
}

#incidents .ms-Icon--CircleShapeSolid:before {
    content: ""
}

#incidents .ms-Icon--Message:before {
    content: ""
}

#incidents .ms-Icon--MessageFill:before {
    content: ""
}

#incidents .ms-Icon--Robot:before {
    content: ""
}

#incidents .ms-Icon--Switch:before {
    content: ""
}

.IncidentIcon0 {
    fill: #FCD41A;
}

.IncidentIcon1 {
    fill: #FFFFFF;
}

.IncidentIcon2 {
    fill: #4E7380;
}

.IncidentIcon3 {
    clip-path: url(#SVGID_00000152224069452531044190000018172262254880465587_);
    fill: #FFFFFF;
}

.IncidentIcon4 {
    clip-path: url(#SVGID_00000085930277051513151740000015831028096305598083_);
    fill: #FFFFFF;
}

.IncidentIcon5 {
    fill: #1D1D1B;
}

#incidents .incident .title {
    color: #EB373C;
    font-weight: 700;
    padding-left: 10px;
    padding-top: 5px;
}

#incidents .incident .title__wrapper {
    display: flex;
}

#incidents .incident p {
    margin-top: 0;
}

.webchat__send-box {
    margin: 10px;
    border-radius: 10px;
    overflow: hidden;
}
/*
.webchat__send-box__main {
    background-color: white !important;
}

.webchat__send-button {
    background-color: white !important;
}
*/
.webchat__stacked-layout__avatar-gutter {
    display: none !important;
}