/**
 * RuoYi ??????????????????? include :: header/footer ????????��??
 */
@media (max-width: 767px) {
    html, body {
        -webkit-text-size-adjust: 100%;
        overflow-x: hidden;
    }

    /* ?��?????? */
    .container-div {
        padding: 0 8px 12px;
    }

    .container-div .row {
        margin-left: 0;
        margin-right: 0;
    }

    /* ??????????????????????????????????????? */
    .search-collapse {
        display: none;
        padding: 8px 10px 10px;
    }

    .search-collapse.mobile-search-open {
        display: block !important;
    }

    .select-list li {
        float: none;
        width: 100%;
        margin: 6px 0;
    }

    .select-list li p,
    .select-list li label:not(.radio-box) {
        float: none;
        width: auto;
        text-align: left;
        display: block;
        margin-bottom: 4px;
    }

    .select-list li input,
    .select-list li select,
    .select-list .select2-container {
        width: 100% !important;
        max-width: 100%;
    }

    .select-list .select-time input {
        width: 100% !important;
    }

    /* ????????????? */
    #toolbar,
    .btn-group-sm,
    .treetable-bars .tool-left,
    .fixed-table-toolbar .columns,
    .fixed-table-toolbar .bs-bars {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        width: 100%;
        margin-bottom: 8px;
    }

    #toolbar .btn,
    .btn-group-sm .btn,
    .treetable-bars .btn {
        margin: 0 !important;
        padding: 6px 10px;
        font-size: 12px;
    }

    /* ?????????? */
    .select-table,
    .table-striped,
    .bootstrap-table,
    .fixed-table-container,
    .treetable-table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .fixed-table-body {
        overflow-x: auto !important;
    }

    .bootstrap-table .table {
        min-width: 560px;
    }

    /* ??? */
    .fixed-table-pagination {
        font-size: 12px;
    }

    .fixed-table-pagination .pagination-detail,
    .fixed-table-pagination .pagination {
        float: none !important;
        text-align: center;
        margin: 6px 0;
    }

    .fixed-table-pagination .page-list {
        display: none;
    }

    /* ???????? / ??? */
    .form-horizontal .control-label {
        text-align: left;
        padding-top: 7px;
        margin-bottom: 4px;
    }

    .form-horizontal .form-group {
        margin-left: 0;
        margin-right: 0;
    }

    .form-horizontal [class*="col-sm-"],
    .form-horizontal [class*="col-md-"],
    .form-horizontal [class*="col-lg-"] {
        width: 100%;
        float: none;
        padding-left: 10px;
        padding-right: 10px;
    }

    .main-content {
        padding: 10px;
    }

    .box-main,
    .nav-main {
        margin: 0;
    }

    /* ??????????????????????????? */
    .ui-layout-west {
        display: none !important;
    }

    .ui-layout-center {
        width: 100% !important;
        left: 0 !important;
    }

    .ui-layout-resizer-west {
        display: none !important;
    }

    /* layer ???? */
    .layui-layer {
        max-width: 96vw !important;
    }

    .layui-layer-content {
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .layui-layer-iframe iframe {
        width: 100% !important;
    }

    /* ?????????????bots ?????? type:1 layer?? */
    #addDiv,
    #editDiv,
    #baomingDiv,
    [id$="Div"][style*="display: none"] {
        max-width: 100%;
    }

    /* ????? */
    img[style*="max-width"] {
        max-width: 100% !important;
        height: auto !important;
    }

    /* ?????????????? */
    .ry-mobile-search-toggle {
        position: fixed;
        right: 12px;
        bottom: 72px;
        z-index: 9990;
        width: 48px;
        height: 48px;
        border-radius: 50%;
        border: none;
        background: #1ab394;
        color: #fff;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
        font-size: 13px;
        line-height: 1.2;
        padding: 6px;
    }

    .ry-mobile-search-toggle.active {
        background: #f8ac59;
    }
}

/* ????? index / index-topnav */
@media (max-width: 767px) {
    body.fixed-sidebar #page-wrapper {
        margin-left: 0;
    }

    .navbar-static-top {
        min-height: 44px;
    }

    .navbar-top-links li a {
        padding: 12px 8px;
        min-height: 44px;
    }

    .content-tabs {
        height: auto;
        min-height: 36px;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .content-tabs .menuTab {
        display: inline-block;
        float: none;
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 12px;
        padding: 0 8px;
    }

    .content-tabs .roll-nav {
        display: none;
    }

    #content-main {
        height: calc(100vh - 88px) !important;
    }

    .RuoYi_iframe {
        height: 100% !important;
    }

    .navbar-minimalize {
        padding: 12px 14px;
    }
}

/* ???? */
@media (max-width: 767px) {
    .signinpanel {
        margin: 20px 12px;
        width: auto;
    }

    .signinpanel .row > [class*="col-"] {
        width: 100%;
        float: none;
        padding: 0;
    }

    .signinpanel .signin-info {
        display: none;
    }

    .signinpanel form {
        margin-top: 0;
    }
}

/* Layui ????? bots.html ?? */
@media (max-width: 767px) {
    body.childrenBody {
        padding: 8px;
        overflow-x: auto;
    }

    .layui-form-item .layui-form-label {
        width: 100%;
        text-align: left;
        padding: 8px 0 4px;
    }

    .layui-form-item .layui-input-block {
        margin-left: 0;
    }

    .layui-table-view {
        overflow-x: auto;
    }
}

@media (max-width: 767px) {
    .lockscreen-wrapper {
        margin: 15% auto;
        padding: 0 16px;
        max-width: 100%;
    }

    .lockscreen-item {
        width: 100%;
        max-width: 320px;
    }

    .lockscreen-time {
        font-size: 40px;
    }
}
