.chat-message {
    .message-content {
        .card-buttons,
        .message-buttons {
            .pf2e-toolbelt-target-buttons {
                display: flex;
                gap: 1px;

                button[data-save],
                button[data-action="roll-area-damage"],
                button[data-action="roll-fake-check"] {
                    flex: 1;
                    border-radius: 0 4px 4px 0;

                    &:has(+ button) {
                        border-radius: 0;
                    }
                }

                button[class^="pf2e-toolbelt-target-"] {
                    width: 2.4em;
                    border-radius: 4px 0 0 4px;
                }

                button.pf2e-toolbelt-target-expend {
                    i {
                        background-size: contain;
                        height: 100%;
                        width: 100%;
                        background-repeat: no-repeat;
                        background-position: center;
                    }

                    span {
                        position: absolute;
                        color: white;
                        text-shadow:
                            0 0 2px black,
                            0 0 2px black,
                            0 0 2px black;
                        font-weight: bold;
                        padding-left: 1em;
                        padding-top: 0.9em;
                    }

                    &:disabled {
                        opacity: 0.5;
                    }
                }

                button.pf2e-toolbelt-target-rollSaves {
                    border-radius: 0 4px 4px 0;
                }
            }
        }

        .dice-result {
            .pf2e-toolbelt-target-buttons {
                position: absolute;
                left: 1px;
                bottom: 1px;
                display: flex;
                gap: 1px;
                align-items: center;

                button {
                    height: 1.4rem;
                    width: 1.4rem;
                    min-height: revert;
                }

                button.pf2e-toolbelt-target-expend {
                    padding: 0;

                    i {
                        background-size: contain;
                        height: 1em;
                        width: 100%;
                        background-repeat: no-repeat;
                        background-position: center;
                    }

                    span {
                        display: none;
                    }

                    &:disabled {
                        opacity: 0.5;
                    }
                }

                .pf2e-toolbelt-target-toggleDamageRows {
                    &.expanded {
                        .expand {
                            display: none;
                        }
                    }

                    &:not(.expanded) {
                        .collapse {
                            display: none;
                        }
                    }
                }
            }
        }

        .chat-card {
            footer {
                .pf2e-toolbelt-target-buttons {
                    display: inline-flex;
                    float: right;
                    margin-bottom: -1px;
                    height: 100%;
                    gap: 0.5em;
                }

                span:has(+ .pf2e-toolbelt-target-buttons) {
                    border-right: 0;
                }
            }
        }
    }

    .message-content .pf2e-toolbelt-target-targetRows .target-row {
        --criticalSuccess: #008000;
        --success: #0000ff;
        --failure: #ff6a00;
        --criticalFailure: #ff0000;
        --drag-over: #368a8b45;
        --highlight: #00000021;

        user-select: none;

        hr {
            margin-block: 0.2em;
        }

        .target-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.5em;
            height: 1.7em;

            .name,
            .controls {
                height: 100%;
                display: flex;
                align-items: center;
                white-space: nowrap;
                height: 100%;
            }

            .name {
                font-weight: bold;
                overflow: hidden;
                text-overflow: ellipsis;
                flex: 1;

                i {
                    &:not(.empty) {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        width: 18px;
                    }

                    &.fa-person {
                        font-size: 1.1em;
                        margin-top: -1px;
                    }
                }
            }

            .controls {
                hr {
                    width: 0;
                    border: none;
                    border-left: 2px groove white;
                    height: 70%;
                    margin: -1px 0.3em 0 0.4em;
                }

                .observe,
                .roll,
                .reroll {
                    display: flex;
                    align-items: center;
                }

                .degree,
                i.die,
                i.ban,
                i.unknown {
                    width: 1.05rem;
                    display: inline-block;
                    text-align: center;
                }

                .degree {
                    font-size: 1.1em;
                    line-height: 1;

                    &.show {
                        &.criticalSuccess {
                            color: var(--criticalSuccess);
                        }

                        &.success {
                            color: var(--success);
                        }

                        &.failure {
                            color: var(--failure);
                        }

                        &.criticalFailure {
                            text-shadow: 0 0 black;
                            color: var(--criticalFailure);
                        }
                    }
                }

                i {
                    &.die {
                        font-size: 0.95em;
                        margin-top: 0.5px;
                    }

                    &.rotate {
                        font-size: 0.9em;
                        margin-right: 2px;
                    }

                    &.reroll {
                        font-size: 0.9em;
                        opacity: 0.8;
                        margin-top: 2px;
                    }

                    &.list {
                        font-size: 0.96em;
                        margin-right: 0.3em;
                    }
                }

                &.has-significant-modifiers {
                    &.ESSENTIAL {
                        --significant-glow: var(--pf2emm-color-essential);
                    }

                    &.HELPFUL {
                        --significant-glow: var(--pf2emm-color-helpful);
                    }

                    &.HARMFUL {
                        --significant-glow: var(--pf2emm-color-harmful);
                    }

                    &.DETRIMENTAL {
                        --significant-glow: var(--pf2emm-color-detrimental);
                    }

                    .save {
                        animation: pf2e-toolbelt-blinking 0.4s infinite alternate;

                        @keyframes pf2e-toolbelt-blinking {
                            from {
                                text-shadow: 0 0 0 var(--significant-glow);
                            }

                            to {
                                text-shadow: 0 0 6px var(--significant-glow);
                            }
                        }
                    }
                }
            }
        }

        .damage-application {
            margin-top: 0;
            margin-bottom: 0.4em;

            &.small {
                button {
                    --button-size: 1.2em;

                    height: var(--button-size);

                    img,
                    i,
                    span:has(+ span) {
                        display: none;
                    }
                }
            }

            &.success button[data-multiplier="0.5"] {
                box-shadow: inset 0 0 6px var(--success);
            }

            &.failure button[data-multiplier="1"] {
                box-shadow: inset 0 0 6px var(--failure);
            }

            &.criticalFailure button[data-multiplier="2"] {
                box-shadow: inset 0 0 6px var(--criticalFailure);
            }

            &.applied {
                button {
                    filter: blur(1px);
                }
            }
        }

        &.drag-over {
            .target-header {
                background: var(--drag-over);
            }
        }

        &:last-child {
            .damage-application {
                margin-bottom: 0;

                + .damage-application {
                    margin-top: 2px;
                }
            }
        }
    }

    .message-content .pf2e-toolbelt-target-targetRows:not(.pf2e-toolbelt-target-actionRows) {
        .target-row:first-child {
            margin-top: 0.4em;
        }
    }

    &.pf2e-toolbelt-check-gm {
        .message-content .card-buttons .pf2e-toolbelt-target-buttons {
            button[data-action="merge-to-damage"] {
                display: none;
                border-radius: 0;
            }
        }

        &:has(+ .pf2e-toolbelt-damage) {
            .message-content .card-buttons .pf2e-toolbelt-target-buttons {
                button[data-action="merge-to-damage"] {
                    display: block;
                }
            }
        }
    }
}

body.pf2e-toolbelt-target-helper-save-colorblind {
    .message-content .pf2e-toolbelt-target-targetRows .target-row {
        --criticalSuccess: #009e73;
        --success: #0072b2;
        --failure: #d55e00;
        --criticalFailure: #cc79a7;
    }
}

[role="tooltip"] {
    .pf2e-toolbelt-target-save {
        display: flex;
        flex-direction: column;
        align-items: start;
        gap: 0.2em;

        .result {
            i {
                font-size: 0.8em;
            }
        }

        .note {
            font-style: italic;
            font-size: 0.9em;
            align-self: flex-end;
            margin-left: 2em;

            i {
                font-size: 0.95em;

                &:not(.rotate) {
                    opacity: 0.8;
                }
            }
        }

        .excluded {
            text-decoration: line-through;
        }

        .ESSENTIAL {
            color: var(--pf2emm-color-essential);
        }

        .HELPFUL {
            color: var(--pf2emm-color-helpful);
        }

        .HARMFUL {
            color: var(--pf2emm-color-harmful);
        }

        .DETRIMENTAL {
            color: var(--pf2emm-color-detrimental);
        }
    }

    .pf2e-toolbelt-target-notes {
        list-style: none;
        padding: 0;

        .roll-note {
            strong {
                &::after {
                    content: ":";
                }
            }
        }
    }
}

.application.dialog.pf2e-toolbelt {
    .window-content {
        input[type="radio"] {
            --checkbox-size: 1rem;
        }
    }

    .dialog-content {
        label {
            i {
                font-size: 1.2em;
                width: 1.6em;
                text-align: center;
            }
        }
    }
}

.application.dialog.pf2e-toolbelt.pf2e-toolbelt-template-helper {
    min-width: revert;

    .window-header {
        flex: 1 2em;
        --button-size: 12px;
    }

    .window-content {
        padding: 0.1em 0.6em 0.5em;
    }

    .dialog-form {
        gap: 0.3em;
    }

    .dialog-content {
        display: grid;
        grid-template-rows: repeat(3, 1fr);
        grid-template-columns: auto auto;
        gap: 0 1em;
        align-items: center;
        font-size: 0.9em;

        label {
            display: flex;
            align-items: center;
            white-space: nowrap;

            input {
                &[type="radio"] {
                    --checkbox-size: 13px;

                    margin-inline: 0.3em;
                }

                &[type="checkbox"] {
                    --checkbox-size: 16px;
                }
            }
        }
    }

    .form-footer {
        button {
            --button-size: 1.5rem;

            padding: 0;
        }
    }
}
