@import "../_colors";
@import "../queries";

// Dialogs
body .ui-dialog {
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.4);
    position: relative;

    & .ui-dialog-content {
        padding: 15px;
        overflow-y: auto;
    }

    & .ui-dialog-header,
        .ui-dialog-footer {
        border-radius: 0 0 4px 4px;
    }
}

body .ui-dialog:not(.ui-confirmdialog) {
    & .ui-dialog-content {
        padding-bottom: 0;
        margin-bottom: 15px;
    }
}

body .ui-dialog .ui-dialog-titlebar {
    padding: 15px !important;
    border-bottom: 1px solid #e5eaea;

    & .ui-dialog-title {
        display: inline-block;
        padding-right: 20px;
    }

    & .ui-dialog-titlebar-close {
        align-items: center;
        display: flex;
        height: 36px;
        justify-content: center;
        position: absolute;
        right: 15px;
        top: 15px;
        width: 36px;
    }

    & .ui-dialog-titlebar-icon {
        color: $secondary-dark-text-color;
        border: 0 none;
        transition: color 0.3s;
        padding: 0;
    }

    & .ui-dialog-titlebar-icon:hover {
        color: highlight($secondary-dark-text-color);
    }
}

body .ui-dialog .ui-dialog-buttonpane {
    padding: 5px 10px;
    text-align: right;
}

body .ui-dialog .ui-dialog-footer {
    padding: 15px;
    border: none;
    border-top: 1px solid #e5eaea;
    text-align: right;
    direction: rtl;
    & .ui-button,
    body .ui-dialog .ui-dialog-buttonpane button {
        margin: 0 10px;
        &:first-child {
            margin-right: 0;
        }
        &:last-child {
            margin: 0;
        }
    }
}

@media #{$sm-devices} {
    body .ui-dialog:not(.ui-confirmdialog) {
        height: 100%;
        max-height: 100%;
        width: 100%;
    }
}

@media #{$md-devices} {
    body .ui-dialog:not(.ui-confirmdialog) {
        min-width: 450px;
        max-height: 70%;
        max-width: 70%;
    }
}

// Confirm dialog

body .ui-dialog.ui-confirmdialog {
    max-width: 450px;
}

body .ui-widget-overlay {
    background-color: rgba(77, 74, 74, 0.9);
    opacity: 1;
}