@use "./meta.scss" as *;
@use "./options.scss" as *;
@use "./details.scss" as *;
@use "./uploader.scss" as *;
@use "./modal.scss" as *;
@use "./darkmode.scss" as *;
@use "./rtl.scss" as *;
@use "./lite.scss" as *;

.ant-message,
.ant-popover,
.ant-dropdown,
.ant-dropdown-menu-submenu-popup,
.ant-modal-mask,
.ant-modal-wrap {
    z-index: 99999999;

    &.ant-message-bottom {
        bottom: 50px;
        top: initial !important;
    }
}

.rml-description {
    font-size: 10px;
    font-style: intalic;
    opacity: 0.7;
}

// Fix select inputs in WordPress backend
.antd-select-single:not(.antd-select-customize-input) .antd-select-selector {
    box-sizing: border-box;
}

// Reset https://git.io/JLyJJ
.antd-input {
    padding: 4px 11px !important;
    line-height: 1.5715 !important;
    min-height: auto !important;
    box-shadow: none !important;
    border-radius: 2px !important;
    border: 1px solid #d9d9d9 !important;
    outline: none !important;
}

// Fix select dropdowns and messages in modals
.antd-select-dropdown,
.antd-message {
    z-index: 105000000;
}

// Fix modal height and body overflow
.antd-modal-body {
    max-height: calc(100vh - 55px - 200px);
    overflow-y: auto;
}

.antd-select-item {
    line-height: 2;
}

.rml-immediate-license-form {
    .ant-confirm-body > .anticon-info-circle,
    .ant-confirm-btns {
        display: none;
    }

    .ant-confirm-content {
        margin: 0;
    }

    img {
        width: 30px;
        position: absolute;
        top: 27px;
        right: 35px;
    }
}

.rml-container {
    display: block;
    float: left;
}

/* Fix layout crashes for page builders */
.aiot-tree {
    hr {
        margin: 0 !important;
    }

    .page-title-action {
        margin-left: 4px;
        padding: 4px 8px;
        position: relative;
        top: -3px;
        text-decoration: none;
        border: none;
        border: 1px solid #ccc;
        border-radius: 2px;
        background: #f7f7f7;
        text-shadow: none;
        font-weight: 600;
        font-size: 13px;
        line-height: normal;
        color: #0073aa;
        cursor: pointer;
        outline: 0;
    }

    .aiot-toolbar-items > a {
        line-height: 18px;
    }

    .aiot-node-count {
        line-height: 18.2px;
    }
}

.attachment-filters.attachment-filters-rml {
    display: none !important;
}

ul.attachments {
    /* Spin loader */
    &.rml-loading:after {
        line-height: 1;
        content: "\E64D";
        display: block;
        position: fixed;
        border-radius: 99px;
        padding: 10px;
        bottom: 23px;
        left: 50%;
        background: #a6a6a6;
        color: white;
        font-family: anticon !important;
        font-size: 24px;
        animation: loadingCircle 1s infinite linear;
        transition: transform 0.3s ease-in-out;
        will-change: transform;
        border: 2px solid white;
    }

    > li.ui-sortable-placeholder {
        height: 10px !important;
    }
}

/* Shortcut icon with tooltip */
.rml-shortcut-container i.rmlicon-share {
    transform: rotate(-45deg);
    display: block;
    text-shadow:
        0px 1px 1px white,
        0px -1px 1px white,
        1px 0px 1px white,
        -1px 0px 1px white,
        0px 0px 5px black;
    transition: all 50ms ease;
    font-size: 24px;
}

/* Locked icon for folders */
.rml-locked:not(.aiot-forceEnable) {
    .aiot-node-name {
        padding-left: 15px;
        width: calc(100% - 65px) !important;
    }

    .aiot-node-icon:after {
        display: block;
        font-family: "anticon" !important;
        content: "\E67B";
        position: absolute;
        left: 29px;
        top: 5px;
        color: #b7b7b7;
        font-size: 11px;
    }
}

/* Sortable Table List */
.ui-sortable-helper-wp-media-list {
    background: #f9f9f9 !important;
    box-shadow: 0px 0px 5px 3px #326ba5 !important;
    padding: 0px !important;

    td {
        display: none;

        &.title {
            display: table-cell;

            .row-actions {
                opacity: 0;
            }
        }
    }

    th {
        opacity: 0;
    }
}

/* Responsive media modal */
@media all and (max-width: 900px) {
    .media-frame.rml-media-modal {
        .media-menu {
            left: 10px;
            transform: none;
            right: 10px;
            max-width: initial;
            max-height: 500px;

            .rml-modal-container {
                .aiot-tree {
                    margin-top: 15px;
                    margin-left: 0;
                }

                .aiot-pad > div {
                    padding: 0 10px;
                }
            }
        }

        .media-frame-title,
        .media-frame-router,
        .media-frame-content,
        .media-frame-toolbar {
            left: 0 !important;
        }
    }
}

/* Reponsiveness */
@media all and (max-width: 700px) {
    body.activate-aiot {
        #wpbody {
            .rml-container {
                width: 100% !important;
            }
        }
    }
}

/* EML compatibility */
body.upload-php.eml-grid.activate-aiot {
    #wpbody-content {
        float: right !important;
        padding-left: 15px !important;

        > .wrap {
            position: relative;
            left: 0;
            bottom: 0;
            height: 300px;
        }
    }

    #wpbody {
        position: relative !important;
        height: auto;
        left: auto;
        top: auto;
        right: auto;
        bottom: auto;
    }
}

/* Fix Enfold / Avia media picker bug (Thanks to Josh!) */
.avia-media-img-only .media-frame-menu {
    display: block;
}

.avia-media-img-only .media-menu > .media-menu-item,
.avia-media-img-only .media-menu > .separator {
    display: none;
}

// Update notice
tr.rml-update-notice {
    th {
        padding: 0;
    }

    .notice {
        margin: 0 20px 10px 26px;
        border-top: 1px solid #ffb900;
        box-shadow:
            4px 4px 4px #ffb9001a,
            1px 1px 0px #ffb900;

        p {
            margin: 0;
        }
    }
}

// FolderSelector.js
.rml-folder-selector {
    .ant-modal-body {
        padding: 5px;
    }

    .aiot-pad {
        padding: 0 8px;
    }

    .aiot-search {
        margin-left: 16px;
    }

    .aiot-expander-all {
        left: -9px;
    }

    .aiot-context-tree {
        padding: 0 0 0 8px !important;
        overflow: auto;
        max-height: 300px;
    }

    .aiot-tree {
        border-right: 0;

        .aiot-expander:after {
            background: white;
        }
    }

    .aiot-theme-wordpress .aiot-nodes .aiot-node-icon i {
        background: white !important;
        border-top-color: white !important;
        border-bottom-color: white !important;
    }

    .aiot-nodes {
        padding-bottom: 10px !important;
    }

    .ant-modal-footer .ant-btn-primary,
    .aiot-tree-headline {
        display: none;
    }
}

// WPML overwrites this, so we overwrite it again with a more specific specificity
.ant-modal-mask:has(+ .rml-folder-selector),
.ant-modal-wrap.rml-folder-selector {
    z-index: 999999999 !important;
}
