.background,
.gtkstyle-fallback {
    background-color: bg_color(2);
    color: $fg-color;
}

assistant,
dialog,
messagedialog,
message-dialog,
printdialog,
window.csd:not(.popup):not(.menu) {
    > decoration {
        margin: rem(12px);
    }
}

assistant,
printdialog,
window:not(.popup):not(.menu) {
    > decoration {
        border-radius: rem(6px) rem(6px) 0 0;
    }

    // We only draw shadows for client-side decorations
    &.csd {
        > decoration {
            box-shadow:
                // Intentionally not in ems since it's used as a stroke
                0 0 0 1px $toplevel-border-color,
                // Force shadows to be the same size to prevent jumpy resize transition
                0 13px 16px 4px transparent,
                shadow(4);

            &:backdrop {
                box-shadow:
                    0 0 0 1px $toplevel-border-color,
                    0 13px 16px 4px transparent,
                    shadow(2);
            }
        }

        &.maximized > decoration {
            background-color: black;
            border-radius: 0;
            box-shadow: none;
        }

        &.tiled:not(.maximized) {
            > decoration {
                background-color: black;
                border-radius: 0;
                box-shadow:
                    0 0 0 1px $toplevel-border-color,
                    0 13px 16px 4px transparent,
                    shadow(1);
            }

            &.tiled-left {
                &.tiled-top .titlebar {
                    border-top-right-radius: 0;
                }

                &.tiled-bottom actionbar {
                    border-bottom-right-radius: 0;
                }
            }

            &.tiled-right {
                &.tiled-top .titlebar {
                    border-top-left-radius: 0;
                }

                &.tiled-bottom actionbar {
                    border-bottom-left-radius: 0;
                }
            }
        }
    }

    &.rounded {
        border-radius: 0 0 rem(6px) rem(6px);

        > decoration {
            border-radius: rem(6px);
        }
    }

    // SSD doesn't calculate rems correctly
    &.ssd decoration {
        border-radius: 6px 6px 0 0;
        // Can't be applied directly to the window
        box-shadow: 0 0 0 1px $toplevel-border-color;
        margin: 12px;
    }

    // Hdy.Window
    &.unified {
        border-radius: rem(6px);

        decoration,
        decoration-overlay {
            border-radius: rem(6px);
        }

        decoration-overlay {
            box-shadow: outset-highlight();
        }
    }
}

dialog,
messagedialog,
message-dialog {
    box-shadow: outset-highlight("bottom");

    > decoration {
        border-radius: rem(6px);
        box-shadow:
            // Intentionally not in ems since it's used as a stroke
            0 0 0 1px $toplevel-border-color,
            // Force shadows to be the same size to prevent jumpy resize transition
            0 13px 16px 4px transparent,
            shadow(3);

        &:backdrop {
            box-shadow:
                // Intentionally not in ems since it's used as a stroke
                0 0 0 1px $toplevel-border-color,
                // Force shadows to be the same size to prevent jumpy resize transition
                0 13px 16px 4px transparent,
                shadow(2);
        }
    }

    &.csd {
        border-radius: 0 0 rem(6px) rem(6px);
    }

    // These should should in 12px borders around buttons
    .dialog-action-area {
        // Compensate for off-by-one
        margin: rem(7px);
        margin-bottom: rem(8px);
    }
}

messagedialog .dialog-action-area,
message-dialog .dialog-action-area {
    // Double space between content and actions
    margin-top: rem(16px);
}
