/*
 * Skin: Rental
 * -----------
 * 与后台登录页同一套视觉规范：
 * 主色 #2f54eb / 渐变 #4a7bff -> #2f54eb / 深色 #14213d / 底色 #f2f5fb
 */

/* ============================================================
 * 一、主框架：侧边栏
 * ============================================================ */
body.skin-rental {
    font-family: "PingFang SC", "Microsoft Yahei", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

.skin-rental .wrapper {
    background: #f2f5fb;
}

.skin-rental .main-sidebar,
.skin-rental .left-side {
    background: linear-gradient(180deg, #0f1b3d 0%, #1b2c8c 55%, #174ba0 100%);
    box-shadow: 2px 0 12px rgba(15, 27, 61, .06);
}

.skin-rental .sidebar-menu > li > a {
    color: rgba(255, 255, 255, .74);
    border-left: 3px solid transparent;
    transition: background-color .18s, color .18s;
}

.skin-rental .sidebar-menu > li:hover > a {
    background: rgba(255, 255, 255, .10);
    color: #fff;
    border-left-color: transparent;
}

.skin-rental .sidebar-menu > li.active > a,
.skin-rental .sidebar-menu > li.treeview-open > a {
    background: rgba(255, 255, 255, .14);
    color: #fff;
    border-left-color: #7aa2ff;
}

.skin-rental .sidebar-menu > li > .treeview-menu {
    background: rgba(6, 14, 36, .28);
}

.skin-rental .sidebar-menu .treeview-menu > li > a {
    color: rgba(255, 255, 255, .64);
    border-radius: 6px;
}

.skin-rental .sidebar-menu .treeview-menu > li > a:hover {
    color: #fff;
    background: rgba(255, 255, 255, .08);
}

.skin-rental .sidebar-menu .treeview-menu > li.active > a {
    color: #fff;
    background: rgba(255, 255, 255, .16);
}

.skin-rental .sidebar-menu > li.header {
    color: rgba(255, 255, 255, .38);
    background: rgba(0, 0, 0, .12);
}

.skin-rental .user-panel > .image img {
    border: 2px solid rgba(255, 255, 255, .22);
}

.skin-rental .user-panel > .info,
.skin-rental .user-panel > .info > a {
    color: rgba(255, 255, 255, .86);
}

.skin-rental .user-panel > .info > i.fa-circle.text-success {
    color: #35e0a1 !important;
}

.skin-rental .sidebar-form {
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, .16);
    background: rgba(255, 255, 255, .08);
}

.skin-rental .sidebar-form input[type="text"],
.skin-rental .sidebar-form .btn {
    height: 34px;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

.skin-rental .sidebar-form input[type="text"] {
    color: #fff;
}

.skin-rental .sidebar-form input[type="text"]::-webkit-input-placeholder {
    color: rgba(255, 255, 255, .45);
}

.skin-rental .sidebar-form input[type="text"]::placeholder {
    color: rgba(255, 255, 255, .45);
}

.skin-rental .sidebar-form .btn {
    color: rgba(255, 255, 255, .6);
}

.skin-rental .sidebar-form .menuresult {
    background: #17235c;
    border-radius: 8px;
}

.skin-rental .sidebar-form .menuresult a {
    color: rgba(255, 255, 255, .8);
    border-color: rgba(255, 255, 255, .08);
}

.skin-rental .sidebar-form .menuresult a:hover {
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

/* 折叠状态：弹出的子菜单需要实底，避免渐变透底 */
.skin-rental.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a,
.skin-rental.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

.skin-rental.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
    background: #16235e;
    border-radius: 0 8px 8px 0;
}

.skin-rental.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu > li > a {
    color: rgba(255, 255, 255, .72);
}

.skin-rental .sidebar ::-webkit-scrollbar {
    width: 6px;
}

.skin-rental .sidebar ::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .18);
    border-radius: 3px;
}

.skin-rental .sidebar ::-webkit-scrollbar-track {
    background: transparent;
}

/* ============================================================
 * 二、主框架：顶栏与标签页
 * ============================================================ */
.skin-rental .main-header {
    background: transparent;
    box-shadow: none;
}

.skin-rental .main-header .logo {
    background: #0f1b3d;
    color: #fff;
    font-weight: 700;
    letter-spacing: .5px;
    border-right: none;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.skin-rental .main-header .logo:hover {
    background: #14224b;
}

.skin-rental .main-header .navbar {
    background: #fff;
    border-bottom: 1px solid #e8edf6;
    box-shadow: 0 1px 4px rgba(20, 33, 61, .05);
}

.skin-rental #firstnav {
    box-shadow: none;
}

.skin-rental .main-header .navbar .nav > li > a {
    color: #5b6478;
    transition: background-color .18s, color .18s;
}

.skin-rental .main-header .navbar .nav > li > a:hover,
.skin-rental .main-header .navbar .nav > li > a:focus,
.skin-rental .main-header .navbar .nav .open > a,
.skin-rental .main-header .navbar .nav > .active > a {
    background: #f0f4ff;
    color: #2f54eb;
}

.skin-rental .main-header .navbar .sidebar-toggle {
    color: #5b6478;
}

.skin-rental .main-header .navbar .sidebar-toggle:hover {
    background: #f0f4ff;
    color: #2f54eb;
}

.skin-rental .main-header .navbar .navbar-nav > li > a {
    border-right: none;
}

.skin-rental .main-header .nav-addtabs > li > a {
    color: #8a93a6;
    border-right: 1px solid #f2f5fa;
}

.skin-rental .main-header .nav-addtabs > li > a:hover,
.skin-rental .main-header .nav-addtabs > li > a:focus {
    color: #2f54eb;
    background: #f7f9fe;
}

.skin-rental .main-header .nav-addtabs > li.active > a,
.skin-rental .main-header .nav-addtabs > li.active > a:hover,
.skin-rental .main-header .nav-addtabs > li.active > a:focus {
    background: #eef2ff;
    color: #2f54eb;
    font-weight: 600;
    border-right-color: transparent;
}

.skin-rental .main-header .nav-addtabs li > .close-tab {
    color: #b7c0d4;
}

.skin-rental .main-header li.user-header {
    background: linear-gradient(135deg, #1a2f9e, #2f54eb);
}

/* 顶栏右侧：消息与用户区做成胶囊按钮 */
.skin-rental .main-header .navbar-custom-menu > .nav > li > a {
    display: flex;
    align-items: center;
    height: 36px;
    line-height: 36px;
    margin: 7px 4px;
    padding: 0 12px;
    border-radius: 8px;
    color: #5b6478;
    font-size: 13.5px;
    font-weight: 500;
    transition: background-color .18s, color .18s;
}

.skin-rental .main-header .navbar-custom-menu > .nav > li > a:hover,
.skin-rental .main-header .navbar-custom-menu > .nav > li > a:focus,
.skin-rental .main-header .navbar-custom-menu > .nav > li.open > a {
    background: #f0f4ff;
    color: #2f54eb;
}

.skin-rental .main-header .navbar-custom-menu > .nav > li > a > .fa {
    font-size: 16px;
}

.skin-rental .main-header .user-menu > .dropdown-toggle > .user-image {
    width: 28px;
    height: 28px;
    margin: 0 8px 0 0;
    border: 2px solid #e8edf6;
    border-radius: 50%;
    object-fit: cover;
    transition: border-color .18s;
}

.skin-rental .main-header .user-menu > .dropdown-toggle:hover > .user-image {
    border-color: #c9d7ff;
}

/* 用户名后的下拉箭头 */
.skin-rental .main-header .user-menu > .dropdown-toggle::after {
    content: "";
    flex: none;
    width: 5px;
    height: 5px;
    margin: 0 0 3px 8px;
    border-right: 1.5px solid #8a93a6;
    border-bottom: 1.5px solid #8a93a6;
    transform: rotate(45deg);
    transition: border-color .18s;
}

.skin-rental .main-header .user-menu > .dropdown-toggle:hover::after {
    border-color: #2f54eb;
}

/* 通知红点随胶囊位置微调 */
.skin-rental .main-header .navbar-custom-menu .message-notice .message-dot {
    top: 5px;
    right: 6px;
    width: 7px;
    height: 7px;
    box-shadow: 0 0 0 2px #fff;
}

.skin-rental .main-header .navbar .dropdown-menu {
    border-color: #e8edf6;
    border-radius: 8px;
    box-shadow: 0 12px 30px -14px rgba(20, 33, 61, .3);
    padding: 6px 0;
}

.skin-rental .main-header .navbar .dropdown-menu > li > a {
    color: #5b6478;
    border-radius: 6px;
}

.skin-rental .main-header .navbar .dropdown-menu > li > a:hover {
    background: #f0f4ff;
    color: #2f54eb;
}

.skin-rental .content-wrapper,
.skin-rental .right-side {
    background: #f2f5fb;
}

/* ============================================================
 * 三、内容页：底色、卡片与标题
 * ============================================================ */
body.inside-header {
    background: #f2f5fb;
    color: #5b6478;
    font-family: "PingFang SC", "Microsoft Yahei", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

body.inside-header .panel {
    background: #fff;
    border: 1px solid #e8edf6;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(20, 33, 61, .04);
}

body.inside-header .panel-intro {
    border: 1px solid #e8edf6;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(20, 33, 61, .04);
}

body.inside-header .panel-intro > .panel-heading {
    background: #f7f9fd;
    border-bottom: 1px solid #e8edf6;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

body.inside-header .panel-intro > .panel-heading .panel-lead em {
    color: #14213d;
    font-size: 15px;
    letter-spacing: .2px;
}

body.inside-header .panel-intro > .panel-heading .panel-lead p {
    margin-bottom: 0;
    color: #8a93a6;
    font-size: 12.5px;
}

/* 系统配置这类标题区标签页 */
body.inside-header .panel-intro > .panel-heading .nav-tabs > li > a {
    background: #e6ecfc;
    border-color: #e8edf6;
    color: #5b6478;
    border-radius: 4px 4px 0 0;
}

body.inside-header .panel-intro > .panel-heading .nav-tabs > li > a:hover,
body.inside-header .panel-intro > .panel-heading .nav-tabs > li > a:focus {
    background: #d6e0fb;
    border-color: #e8edf6;
    color: #2f54eb;
}

body.inside-header .panel-intro > .panel-heading .nav-tabs > li.active > a,
body.inside-header .panel-intro > .panel-heading .nav-tabs > li.active > a:hover,
body.inside-header .panel-intro > .panel-heading .nav-tabs > li.active > a:focus {
    background: #fff;
    color: #2f54eb;
    font-weight: 600;
    border-color: #e8edf6;
    border-bottom-color: transparent;
}

body.inside-header .sec-title {
    color: #14213d;
    border-left-color: #2f54eb;
}

/* 业务页状态标签（common/seg-tabs），与「系统配置」页标签同款配色 */
body.inside-header .seg-tabs {
    border-bottom: 1px solid #e8edf6;
}

body.inside-header .seg-tabs > li {
    background: #e6ecfc;
    border-color: #e8edf6;
    color: #5b6478;
}

body.inside-header .seg-tabs > li:hover {
    background: #d6e0fb;
    color: #2f54eb;
}

body.inside-header .seg-tabs > li > a,
body.inside-header .seg-tabs > li > a:hover,
body.inside-header .seg-tabs > li > a:focus {
    color: inherit;
}

body.inside-header .seg-tabs > li.active {
    background: #fff;
    border-color: #e8edf6;
    border-bottom-color: #fff;
    color: #2f54eb;
    font-weight: 600;
}

body.inside-header a:not(.btn) {
    color: #2f54eb;
}

body.inside-header a:not(.btn):hover {
    color: #1d39c4;
}

/* ============================================================
 * 四、内容页：表单与按钮
 * ============================================================ */
body.inside-header .btn {
    border-radius: 6px;
    transition: all .2s;
}

body.inside-header .btn-primary {
    background: linear-gradient(135deg, #4a7bff, #2f54eb);
    border-color: #2f54eb;
    color: #fff;
    box-shadow: 0 6px 14px -8px rgba(47, 84, 235, .8);
}

body.inside-header .btn-primary:hover,
body.inside-header .btn-primary:focus,
body.inside-header .btn-primary:active,
body.inside-header .btn-primary.active {
    background: linear-gradient(135deg, #3d6cf5, #2746d6);
    border-color: #2746d6;
    color: #fff;
}

body.inside-header .btn-default {
    border-color: #dfe6f2;
    color: #5b6478;
    background: #fff;
}

body.inside-header .btn-default:hover,
body.inside-header .btn-default:focus {
    background: #f0f4ff;
    border-color: #c9d7ff;
    color: #2f54eb;
}

body.inside-header .form-control {
    border-color: #dfe6f2;
    border-radius: 6px;
    box-shadow: none;
    color: #2b3548;
}

body.inside-header .form-control:focus {
    border-color: #2f54eb;
    box-shadow: 0 0 0 3px rgba(47, 84, 235, .10);
}

body.inside-header .input-group-addon {
    border-color: #dfe6f2;
    background: #f7f9fd;
    color: #8a93a6;
}

/* ============================================================
 * 五、内容页：表格与分页
 * ============================================================ */
body.inside-header .table > thead > tr > th {
    background: #f7f9fd;
    color: #5b6478;
    font-weight: 600;
    border-bottom-color: #e8edf6;
}

body.inside-header .table > thead > tr > th,
body.inside-header .table > tbody > tr > td,
body.inside-header .table > tbody > tr > th,
body.inside-header .table > tfoot > tr > td {
    border-color: #eef2f8;
}

body.inside-header .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #fafbfe;
}

body.inside-header .table-hover > tbody > tr:hover {
    background-color: #f3f7ff;
}

body.inside-header .fixed-table-container tbody .selected td {
    background-color: rgba(47, 84, 235, .07);
}

body.inside-header .pagination > li > a,
body.inside-header .pagination > li > span {
    margin: 0 2px;
    border-color: #e8edf6;
    border-radius: 6px;
    color: #5b6478;
}

body.inside-header .pagination > li > a:hover,
body.inside-header .pagination > li > span:hover {
    background: #f0f4ff;
    border-color: #c9d7ff;
    color: #2f54eb;
}

body.inside-header .pagination > .active > a,
body.inside-header .pagination > .active > a:hover,
body.inside-header .pagination > .active > span {
    background: #2f54eb;
    border-color: #2f54eb;
    color: #fff;
}

/* ============================================================
 * 六、内容页：弹层、提示与滚动条
 * ============================================================ */
body.inside-header .dropdown-menu {
    border-color: #e8edf6;
    border-radius: 8px;
    box-shadow: 0 12px 30px -14px rgba(20, 33, 61, .3);
}

body.inside-header .modal-content {
    border-color: #e8edf6;
    border-radius: 12px;
    box-shadow: 0 24px 60px -30px rgba(20, 33, 61, .4);
}

/* 弹窗头部：浅灰底 + 深灰字 */
body.inside-header .modal-header,
.skin-rental .modal-header {
    background: #f4f6fa;
    border-bottom: 1px solid #e8edf6;
    border-radius: 12px 12px 0 0;
    color: #5b6478;
}

body.inside-header .layui-layer-fast .layui-layer-title,
.skin-rental .layui-layer-fast .layui-layer-title {
    background: #f4f6fa !important;
    color: #5b6478 !important;
    border-bottom: 1px solid #e8edf6;
}

/* 标题变浅灰后，关闭图标同步改深灰 */
body.inside-header .layui-layer-fast .layui-layer-setwin > a:after,
.skin-rental .layui-layer-fast .layui-layer-setwin > a:after {
    color: #8a93a6;
}

body.inside-header .layui-layer-fast .layui-layer-setwin > a:hover:after,
.skin-rental .layui-layer-fast .layui-layer-setwin > a:hover:after {
    color: #2b3548;
}

body.inside-header .layui-layer-fast .layui-layer-btn,
.skin-rental .layui-layer-fast .layui-layer-btn {
    background: #f7f9fd;
}

body.inside-header .layui-layer-fast .layui-layer-btn .layui-layer-btn0,
.skin-rental .layui-layer-fast .layui-layer-btn .layui-layer-btn0 {
    background: #2f54eb;
    border-color: #2f54eb;
}

body.inside-header .alert {
    border-radius: 8px;
}

body.inside-header ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body.inside-header ::-webkit-scrollbar-thumb {
    background: #c9d4e6;
    border-radius: 4px;
}

body.inside-header ::-webkit-scrollbar-thumb:hover {
    background: #a9b8d4;
}

body.inside-header ::-webkit-scrollbar-track {
    background: transparent;
}
