.ui-dialog{
    font-size        : @font-size-base;
    padding          : 0;
    border-width     : @dialog-border-width;
    border-style     : solid;
    border-color     : @dialog-border-color;
    background-color : @dialog-bg;
    z-index          : 1001;
    //    max-width        : 90%;
    //    .box-shadow(4px 4px 4px @gray-dark);
    // Title bar
    .ui-dialog-titlebar{
        font-size   : @font-size-large;
        background  : @dialog-header-bg;
        color       : @dialog-header-color;
        position    : relative;
        line-height : 40px;
        height      : 40px;
        padding     : 0 @grid-margin-width/2;
        overflow    : hidden;

        & > *{
            font-size : @font-size-base;
        }

        .ui-draggable &{
            cursor : move;
        }
    }

    .ui-dialog-title{
        max-width      : 90%;
        text-transform : capitalize;
        .text-overflow;
    }

    .ui-dialog-titlebar-close{
        position   : absolute;
        top        : 0;
        bottom     : 0;
        right      : @padding-large-vertical;
        margin     : auto;
        padding    : 0;
        border     : none;
        background : transparent;
        .link-color(@dialog-header-color, @brand-error);
        .icon-size(13px);

        &:before{
            margin : 0;
        }

        &:hover{
            background : transparent;
        }

        .ui-icon-closethick{
        }

        .ui-button-text{
            display : none;
        }
    }

    // Content
    .ui-dialog-content{
        position   : relative;
        border     : 0;
        padding    : 0 @grid-margin-width/2;
        background : @dialog-content-bg;
        overflow   : auto;
    }

    // Buttons
    .ui-dialog-buttonpane{
        overflow         : hidden;
        text-align       : left;
        border-width     : 1px 0 0 0;
        background-image : none;
        padding          : @padding-base-vertical (@grid-margin-width / 2) 10px;

        .ui-dialog-buttonset{
            float : right;
        }

        .ui-dialog-buttonpane button{
            margin : .5em .4em .5em 0;
            cursor : pointer;
        }
    }
}

& when (@dialog-resizable = true){
    .ui-resizable-handle{
        position  : absolute;
        font-size : 0.1px;
        display   : block;
    }
    .ui-resizable-n{
        cursor : n-resize;
        height : 7px;
        width  : 100%;
        top    : -5px;
        left   : 0;
    }
    .ui-resizable-e{
        cursor : e-resize;
        width  : 7px;
        right  : -5px;
        top    : 0;
        height : 100%;
    }
    .ui-resizable-s{
        cursor : s-resize;
        height : 7px;
        width  : 100%;
        bottom : -5px;
        left   : 0;
    }
    .ui-resizable-w{
        cursor : w-resize;
        width  : 7px;
        left   : -5px;
        top    : 0;
        height : 100%;
    }
    .ui-resizable-se{
        width  : 12px;
        height : 12px;
        right  : -5px;
        bottom : -5px;
    }
    .ui-resizable-sw{
        cursor : sw-resize;
        width  : 9px;
        height : 9px;
        left   : -5px;
        bottom : -5px;
    }
    .ui-resizable-ne{
        cursor : ne-resize;
        width  : 9px;
        height : 9px;
        right  : -5px;
        top    : -5px;
    }
    .ui-resizable-nw{
        cursor : nw-resize;
        width  : 9px;
        height : 9px;
        left   : -5px;
        top    : -5px;
    }
}

@media only screen and (max-height : @tpopup-base-height){
    body > [aria-describedby="toasterPopup"][style*="height: @{tpopup-base-height};"]{
        margin-top : 0 !important;
    }
}

@media only screen and (max-height : @tpopup-medium-height){
    body > [aria-describedby="toasterPopup"][style*="height: @{tpopup-medium-height};"]{
        margin-top : 0 !important;
    }
}

@media only screen and (max-height : @tpopup-small-height){
    body > [aria-describedby="toasterPopup"][style*="height: @{tpopup-small-height};"]{
        margin-top : 0 !important;
    }
}

@media only screen and (max-width : @tpopup-base-width){
    body > [aria-describedby="toasterPopup"][style*="width: @{tpopup-base-width};"]{
        margin-left : 0 !important;
    }
}

@media only screen and (max-width : @tpopup-medium-width){
    body > [aria-describedby="toasterPopup"][style*="width: @{tpopup-medium-width};"]{
        margin-left : 0 !important;
    }
}

@media only screen and (max-width : @tpopup-small-width){
    body > [aria-describedby="toasterPopup"][style*="width: @{tpopup-small-width};"]{
        margin-left : 0 !important;
    }
}