/* ============================================================
   WISO MESSAGE / CONFIRM / ERROR / WARNING – PREMIUM STYLE v3
   Änderungen ggü v2:
   - Copy Button nur sichtbar wenn details[open]
   - Copy Button als Icon + Text (Clipboard)
   - kleine, edle Dialog-Animation (fade+scale)
   - Overlay noch „bildfreundlicher“ (SVG sichtbar)
   - Details: saubere Abrundung/Abstände beibehalten
   - Themes: light/dark/contrast-light/contrast-dark

   WISO MESSAGE / CONFIRM / ERROR / WARNING – PREMIUM STYLE v3.1
   Fixes:
   1) SVG immer unten rechts (statt center)
   2) Details-Block nicht so breit -> passend zur Textbreite
   ============================================================ */


/* ------------------------------------------------------------
   THEME TOKENS (global)
   ------------------------------------------------------------ */
html[data-wiso-theme="light"] {
    --wmsg-text: rgba(20, 24, 32, .92);
    --wmsg-text-muted: rgba(20, 24, 32, .70);
    --wmsg-header: rgba(20, 24, 32, .96);
    --wmsg-glass: rgba(255, 255, 255, .78);
    --wmsg-glass-strong: rgba(255, 255, 255, .90);
    --wmsg-overlay-top: rgba(255, 255, 255, .02);
    --wmsg-overlay-mid: rgba(255, 255, 255, .06);
    --wmsg-overlay-bot: rgba(255, 255, 255, .10);
    --wmsg-border: rgba(0, 0, 0, .10);
    --wmsg-shadow: 0 26px 70px rgba(0, 0, 0, .22);
    --wmsg-details-bg: rgba(255, 255, 255, .58);
    --wmsg-details-border: rgba(0, 0, 0, .10);
    --wmsg-pre-bg: rgba(0, 0, 0, .06);
    --wmsg-pre-text: rgba(20, 24, 32, .92);
    --wmsg-btn-bg: rgba(0, 0, 0, .06);
    --wmsg-btn-border: rgba(0, 0, 0, .14);
    --wmsg-btn-text: rgba(20, 24, 32, .92);
    --wmsg-btn-hover: #0b4f9e;
    --wmsg-btn-hover-text: #fff;
}

html[data-wiso-theme="contrast-light"] {
    --wmsg-text: #000;
    --wmsg-text-muted: rgba(0, 0, 0, .72);
    --wmsg-header: #000;
    --wmsg-glass: rgba(255, 255, 255, .86);
    --wmsg-glass-strong: rgba(255, 255, 255, .94);
    --wmsg-overlay-top: rgba(255, 255, 255, .02);
    --wmsg-overlay-mid: rgba(255, 255, 255, .06);
    --wmsg-overlay-bot: rgba(255, 255, 255, .10);
    --wmsg-border: rgba(0, 0, 0, .14);
    --wmsg-shadow: 0 26px 70px rgba(0, 0, 0, .24);
    --wmsg-details-bg: rgba(255, 255, 255, .72);
    --wmsg-details-border: rgba(0, 0, 0, .14);
    --wmsg-pre-bg: rgba(0, 0, 0, .08);
    --wmsg-pre-text: #000;
    --wmsg-btn-bg: rgba(0, 0, 0, .08);
    --wmsg-btn-border: rgba(0, 0, 0, .16);
    --wmsg-btn-text: #000;
    --wmsg-btn-hover: #0b4f9e;
    --wmsg-btn-hover-text: #fff;
}

html[data-wiso-theme="dark"] {
    --wmsg-text: rgba(255, 255, 255, .92);
    --wmsg-text-muted: rgba(255, 255, 255, .72);
    --wmsg-header: rgba(255, 255, 255, .96);
    --wmsg-glass: rgba(20, 22, 28, .56);
    --wmsg-glass-strong: rgba(20, 22, 28, .66);
    --wmsg-overlay-top: rgba(0, 0, 0, .12);
    --wmsg-overlay-mid: rgba(0, 0, 0, .18);
    --wmsg-overlay-bot: rgba(0, 0, 0, .24);
    --wmsg-border: rgba(255, 255, 255, .10);
    --wmsg-shadow: 0 30px 80px rgba(0, 0, 0, .55);
    --wmsg-details-bg: rgba(255, 255, 255, .06);
    --wmsg-details-border: rgba(255, 255, 255, .12);
    --wmsg-pre-bg: rgba(0, 0, 0, .28);
    --wmsg-pre-text: rgba(255, 255, 255, .92);
    --wmsg-btn-bg: rgba(255, 255, 255, .08);
    --wmsg-btn-border: rgba(255, 255, 255, .16);
    --wmsg-btn-text: rgba(255, 255, 255, .92);
    --wmsg-btn-hover: #0b4f9e;
    --wmsg-btn-hover-text: #fff;
}

html[data-wiso-theme="contrast-dark"] {
    --wmsg-text: #fff;
    --wmsg-text-muted: rgba(255, 255, 255, .78);
    --wmsg-header: #fff;
    --wmsg-glass: rgba(14, 16, 20, .60);
    --wmsg-glass-strong: rgba(14, 16, 20, .70);
    --wmsg-overlay-top: rgba(0, 0, 0, .14);
    --wmsg-overlay-mid: rgba(0, 0, 0, .22);
    --wmsg-overlay-bot: rgba(0, 0, 0, .28);
    --wmsg-border: rgba(255, 255, 255, .16);
    --wmsg-shadow: 0 30px 80px rgba(0, 0, 0, .60);
    --wmsg-details-bg: rgba(255, 255, 255, .08);
    --wmsg-details-border: rgba(255, 255, 255, .18);
    --wmsg-pre-bg: rgba(0, 0, 0, .34);
    --wmsg-pre-text: #fff;
    --wmsg-btn-bg: rgba(255, 255, 255, .10);
    --wmsg-btn-border: rgba(255, 255, 255, .22);
    --wmsg-btn-text: #fff;
    --wmsg-btn-hover: #0b4f9e;
    --wmsg-btn-hover-text: #fff;
}


/* ------------------------------------------------------------
   DIALOG ANIMATION
   ------------------------------------------------------------ */
@keyframes wisoAlertIn {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

.wiso_alert {
    animation: wisoAlertIn 160ms ease-out !important;
    will-change: transform, opacity !important;
}


/* ------------------------------------------------------------
   ALERT WINDOW BASE
   ------------------------------------------------------------ */
.wiso_alert {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    display: grid !important;
    grid-template-rows: auto 1fr auto !important;
    width: 560px !important;
    max-width: 92vw !important;
    min-height: 240px !important;
    max-height: 70vh !important;
    padding: 0 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    /* 1) SVG immer unten rechts */
    background-repeat: no-repeat !important;
    background-position: right 14px bottom 14px !important;
    background-size: auto 62% !important; /* skaliert mit Fensterhöhe, ohne Abschneiden */

    background-color: var(--wmsg-glass) !important;
    border: 1px solid var(--wmsg-border) !important;
    box-shadow: var(--wmsg-shadow) !important;
    z-index: var(--wiso-z-index-overlay-total) !important;
}

    /* Overlay schwach */
    .wiso_alert::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        z-index: 0 !important;
        background: linear-gradient( to bottom, var(--wmsg-overlay-top), var(--wmsg-overlay-mid), var(--wmsg-overlay-bot) ) !important;
        backdrop-filter: blur(1px);
    }


/* ------------------------------------------------------------
   BACKGROUND IMAGES (Pfad ggf. anpassen)
   ------------------------------------------------------------ */
.wiso_error_window,
.wiso_error_window_short,
.wiso_error_window_long {
    background-image: url("../img/error.svg") !important;
}

.wiso_warning_window,
.wiso_warning_window_short,
.wiso_warning_window_long {
    background-image: url("../img/warning.svg") !important;
}

.wiso_message_window,
.wiso_message_window_short,
.wiso_message_window_long {
    background-image: url("../img/message.svg") !important;
}

.wiso_confirm_window,
.wiso_confirm_window_short,
.wiso_confirm_window_long {
    background-image: url("../img/confirm.svg") !important;
}


/* ------------------------------------------------------------
   SIZE MODES
   ------------------------------------------------------------ */
.wiso_confirm_window_short,
.wiso_error_window_short,
.wiso_warning_window_short,
.wiso_message_window_short,
.wiso_confirm_window,
.wiso_error_window,
.wiso_warning_window,
.wiso_message_window {
    width: 540px !important;
    min-height: 230px !important;
    max-height: 62vh !important;
    --wiso-font-size-alert: 18px;
}

.wiso_confirm_window_long,
.wiso_error_window_long,
.wiso_warning_window_long,
.wiso_message_window_long {
    width: 640px !important;
    min-height: 300px !important;
    max-height: 75vh !important;
    --wiso-font-size-alert: 18px;
}


/* ------------------------------------------------------------
   HEADER / CONTENT / FOOTER
   ------------------------------------------------------------ */
.wiso_alert__header,
.wiso_alert__content,
.wiso_alert__footer {
    position: relative !important;
    z-index: 1 !important;
}

/* etwas weniger Breite, damit es optisch nicht "zu breit" wirkt */
.wiso_alert__header,
.wiso_alert__content,
.wiso_alert__footer {
    max-width: 520px !important; /* 2) Textblock stimmiger */
}

.wiso_alert__header {
    padding: 22px 26px 10px 26px !important;
    margin: 0 !important;
    color: var(--wmsg-header) !important;
    font-size: 26px !important;
    font-weight: 650 !important;
    line-height: 1.15 !important;
}

.wiso_alert__content {
    padding: 6px 26px 14px 26px !important;
    margin: 0 !important;
    color: var(--wmsg-text) !important;
    font-size: var(--wiso-font-size-alert, 18px) !important;
    line-height: 1.4 !important;
    overflow-y: auto !important;
    overflow-wrap: break-word !important;
    word-wrap: break-word !important;
}

.wiso_alert__footer {
    padding: 14px 26px 22px 26px !important;
    margin: 0 !important;
    display: flex !important;
    gap: 12px !important;
}

.wiso_alert__footer--left {
    justify-content: flex-start !important;
}


/* ------------------------------------------------------------
   TEXT LAYOUT
   ------------------------------------------------------------ */
.wiso_msg_line {
    min-height: 56px !important;
    display: flex !important;
    align-items: center !important;
    color: var(--wmsg-text) !important;
}

.wiso_msg_long .wiso_msg_summary {
    font-size: 18px !important;
    font-weight: 650 !important;
    margin: 0 0 10px 0 !important;
    color: var(--wmsg-text) !important;
}

.wiso_msg_hint {
    font-size: 14px !important;
    color: var(--wmsg-text-muted) !important;
    margin: 0 0 10px 0 !important;
}


/* ------------------------------------------------------------
   DETAILS BLOCK (2) weniger breit: gleiche Maxbreite wie Text
   + centered im Content
   ------------------------------------------------------------ */
.wiso_msg_details {
    margin-top: 10px !important;
    width: 100% !important;
    max-width: 520px !important; /* 🔥 nicht so breit */
    margin-left: 0 !important; /* stimmig mit Text (nicht zentriert) */
    margin-right: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: var(--wmsg-details-bg) !important;
    border: 1px solid var(--wmsg-details-border) !important;
}

    .wiso_msg_details > summary {
        list-style: none !important;
        cursor: pointer !important;
        user-select: none !important;
        outline: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        padding: 10px 12px !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        color: var(--wmsg-text) !important;
    }

        .wiso_msg_details > summary::after {
            content: "▾" !important;
            opacity: .75 !important;
            font-size: 14px !important;
            margin-left: auto !important;
        }

    .wiso_msg_details[open] > summary::after {
        transform: rotate(180deg);
    }

.wiso_msg_pre {
    margin: 0 !important;
    padding: 12px !important;
    font-size: 12.5px !important;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono","Courier New", monospace !important;
    line-height: 1.35 !important;
    color: var(--wmsg-pre-text) !important;
    background: var(--wmsg-pre-bg) !important;
    white-space: pre-wrap !important;
    word-break: break-word !important;
    max-height: 220px !important;
    overflow: auto !important;
}


/* ------------------------------------------------------------
   COPY BUTTON – only visible when details[open]
   ------------------------------------------------------------ */
.wiso_msg_copywrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(-1px) !important;
    transition: opacity 140ms ease, transform 140ms ease !important;
}

.wiso_msg_details[open] .wiso_msg_copywrap {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
}

.wiso_msg_copybtn {
    height: 28px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    border: 1px solid var(--wmsg-btn-border) !important;
    background: var(--wmsg-btn-bg) !important;
    color: var(--wmsg-btn-text) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    cursor: pointer !important;
    user-select: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: background-color .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease !important;
}

    .wiso_msg_copybtn::before {
        content: "⧉" !important;
        font-size: 13px !important;
        opacity: .90 !important;
    }

    .wiso_msg_copybtn:hover {
        background: var(--wmsg-btn-hover) !important;
        border-color: rgba(255,255,255,.18) !important;
        color: var(--wmsg-btn-hover-text) !important;
        box-shadow: 0 6px 16px rgba(0,0,0,.22) !important;
    }

.wiso_msg_copytoast {
    font-size: 12px !important;
    font-weight: 700 !important;
    opacity: .92 !important;
    color: var(--wmsg-text-muted) !important;
}


/* ------------------------------------------------------------
   FOOTER BUTTONS
   ------------------------------------------------------------ */
.wiso_alert__footer button.wiso_button,
.wiso_alert__footer button.wiso_alert__apply-button {
    height: 36px !important;
    padding: 0 18px !important;
    border-radius: 14px !important;
    border: 1px solid var(--wmsg-btn-border) !important;
    background: var(--wmsg-btn-bg) !important;
    color: var(--wmsg-btn-text) !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: .02em !important;
    transform: none !important;
    transition: background-color .14s ease, color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

    .wiso_alert__footer button.wiso_button:hover,
    .wiso_alert__footer button.wiso_alert__apply-button:hover {
        background: var(--wmsg-btn-hover) !important;
        color: var(--wmsg-btn-hover-text) !important;
        box-shadow: 0 8px 20px rgba(0,0,0,.28) !important;
    }

html[data-wiso-theme="light"] .wiso_alert,
html[data-wiso-theme="contrast-light"] .wiso_alert {
    background-color: var(--wmsg-glass-strong) !important;
}

/* =========================================================
   WISO Confirm immer oberster Layer
   ========================================================= */

.wiso_alert_overlay,
.wiso_confirm_overlay,
.wiso_message_overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483646 !important;
}

.wiso_widget.wiso_alert,
.wiso_alert.wiso_alert--confirm,
.wiso_confirm_window,
.wiso_confirm_window_short,
.wiso_confirm_window_short.wiso_alert,
.wiso_confirm_window_short.wiso_widget {
    position: fixed !important;
    z-index: 2147483647 !important;
}

/* Window/BlurOverlay darunter halten */
.wiso_window,
.wiso_blurOverlay,
.wiso-blurOverlay,
.w6-blur-overlay {
    z-index: auto;
}

.wiso_blurOverlay,
.wiso-blurOverlay,
.w6-blur-overlay {
    z-index: 2147483000 !important;
}