/* 顶部高度调整 */
.layui-layout-admin .layui-header {
    height: 60px;
}

.layui-layout-admin .layui-header .layui-logo {
    color: #fff;
    font-size: 20px;
    line-height: 60px;
    text-align: center;
    background-color: #16baaa;
    /* 站点名称过长时不换行，超出部分省略号 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 8px;
    box-sizing: border-box;
}

/* Tab 内容区自适应高度（footer 实际高度为 44px，需用高权重选择器覆盖 layui 的 padding-bottom） */
.layui-layout-admin .layui-body {
    bottom: 44px;
    padding-bottom: 0;
}

/* 兼容 layui 新版 tabs 组件（layui-tabs） */
.layui-body .layui-tabs {
    margin: 0;
    height: 100%;
}

.layui-body .layui-tabs .layui-tabs-body {
    padding: 0;
    height: calc(100% - 40px);
}

.layui-body .layui-tabs .layui-tabs-item {
    height: 100%;
}

.layui-body iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* 左侧菜单图标间距 */
.layui-nav-tree .layui-nav-item a i {
    margin-right: 8px;
}

/* ================= 控制台（首页仪表盘） ================= */
body.console-body {
    margin: 0;
    background: #f2f3f5;
}

.console-page {
    padding: 15px;
    box-sizing: border-box;
}

/* 欢迎横幅 */
.console-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 24px 28px;
    margin-bottom: 15px;
    border-radius: 8px;
    background: linear-gradient(120deg, #16baaa 0%, #1e9fff 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(22, 186, 170, .25);
}

.console-banner h2 {
    margin: 0 0 6px;
    font-size: 22px;
    font-weight: 600;
}

.console-banner p {
    margin: 0;
    opacity: .85;
    font-size: 13px;
}

.console-btn-light {
    background: rgba(255, 255, 255, .18) !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .45);
}

.console-btn-light:hover {
    background: rgba(255, 255, 255, .3) !important;
}

/* 统计卡片 */
.console-stat {
    display: flex;
    align-items: center;
    padding: 20px 18px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
    transition: box-shadow .3s, transform .3s;
}

.console-stat:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, .1);
    transform: translateY(-2px);
}

.console-stat-icon {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    margin-right: 14px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
}

.console-stat-num {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    line-height: 1.2;
}

.console-stat-label {
    font-size: 13px;
    color: #888;
    margin: 2px 0;
}

.console-stat-trend {
    font-size: 12px;
    min-height: 18px;   /* 预留一行高度：趋势为空时卡片高度也保持一致 */
    line-height: 18px;
}

.console-stat-trend.up { color: #16b777; }
.console-stat-trend.down { color: #ff5722; }

/* 近7日订单趋势（纯 CSS 柱状图） */
.chart-bars {
    display: flex;
    align-items: stretch;
    height: 240px;
    padding: 6px 4px 0;
}

.chart-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
}

.chart-val {
    font-size: 12px;
    color: #666;
    margin-bottom: 4px;
}

.chart-bar {
    width: 34px;
    border-radius: 6px 6px 0 0;
    background: linear-gradient(180deg, #16baaa, #16b777);
    transition: opacity .3s, transform .3s;
    cursor: default;
}

.chart-bar:hover {
    opacity: .8;
    transform: scaleY(1.02);
    transform-origin: bottom;
}

.chart-day {
    margin-top: 8px;
    font-size: 12px;
    color: #999;
}

/* 服务类型占比 */
.ratio-row {
    margin-bottom: 18px;
}

.ratio-row:last-child {
    margin-bottom: 0;
}

.ratio-head {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    color: #555;
    margin-bottom: 6px;
}

.ratio-track {
    height: 10px;
    border-radius: 5px;
    background: #f0f2f5;
    overflow: hidden;
}

.ratio-bar {
    height: 100%;
    border-radius: 5px;
    transition: width .6s ease;
}

/* 最新订单表格 */
.console-table-wrap {
    padding: 0 10px 10px;
}

.console-table-wrap .layui-table {
    margin: 0;
}

.console-more {
    float: right;
    font-size: 12px;
    color: #1e9fff;
}

/* 订单状态标签 */
.console-tag {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 18px;
}

.tag-orange { background: #fff4e8; color: #ff9d00; }
.tag-blue   { background: #e8f4ff; color: #1e9fff; }
.tag-green  { background: #e7faf3; color: #16b777; }
.tag-gray   { background: #f2f2f2; color: #999; }

/* 待办事项 */
.console-todo {
    margin: 0;
    padding: 0;
    list-style: none;
}

.console-todo-item {
    display: flex;
    align-items: center;
    padding: 13px 6px;
    border-bottom: 1px solid #f2f2f2;
    cursor: pointer;
    font-size: 14px;
    color: #444;
    transition: background .2s;
}

.console-todo-item:last-child {
    border-bottom: none;
}

.console-todo-item:hover {
    background: #f8f9fb;
}

.console-todo-item .layui-badge-dot {
    background: #ff5722;
}

.console-todo-name {
    flex: 1;
}

/* 小屏适配 */
@media screen and (max-width: 768px) {
    .console-banner { padding: 18px; }
    .chart-bar { width: 20px; }
}


/* 头像上传 */
.staff-avatar-box {
    display: flex;
    align-items: center;
    gap: 12px;
}

.staff-avatar-empty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 1px dashed #d2d2d2;
    background: #fafafa;
    color: #bbb;
    font-size: 12px;
}

/* ===== 个人资料：头像上传 ===== */
.avatar-uploader {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 4px 0;
}

.avatar-uploader > img {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #e6e8eb;
    background: #f5f7fa;
    flex-shrink: 0;
}

.avatar-uploader-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.avatar-uploader-body .layui-word-aux {
    font-size: 12px;
    line-height: 1.4;
}

/* 顶栏头像统一裁切，非正方形不变形 */
.layui-header .layui-nav-img {
    object-fit: cover;
}
