/* ==========================================================================
 * yuanjing 应用前端样式（wwwroot/static/yuanjing.css）
 *
 * 托管方式：ahserver 的 ConfiguredServer.get_css_files() 会扫描 website.paths
 * （本应用 = $[workdir]$/wwwroot）下的全部 .css 并注入 bricks header.tmpl 的
 * cssfiles() 循环 —— 因此本文件**无需手工 <link>**，随应用单入口单端口自动下发。
 *
 * 约束：本文件对全站生效（含各模块页面），选择器一律加 yj- 前缀，避免污染
 * bricks 与模块自身样式。
 * ========================================================================== */

/* ---------- 侧边导航菜单项（index.ui 的 Menu：menuitem_css = yj-menuitem） ---------- */
.yj-menuitem {
    display: block;
    padding: 8px 10px;
    margin: 2px 0;
    border-radius: 6px;
    color: #d1d5db !important;
    font-size: 13px;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.yj-menuitem:hover {
    background-color: #1f2937;
    color: #ffffff !important;
}

.yj-menuitem.active,
.yj-menuitem.selected {
    background-color: #2563eb;
    color: #ffffff !important;
}

/* ---------- 顶栏按钮 ---------- */
.yj-btn {
    padding: 5px 12px;
    border-radius: 6px;
    border: 1px solid #d1d5db;
    background-color: #ffffff;
    color: #374151;
    font-size: 12px;
    cursor: pointer;
    line-height: 1.6;
}

.yj-btn:hover {
    background-color: #f3f4f6;
    border-color: #9ca3af;
}

.yj-btn:active {
    background-color: #e5e7eb;
}

/* ---------- 卡片 / 面板 ---------- */
.yj-card {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.yj-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
    transform: translateY(-1px);
}

.yj-panel {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

/* 顶栏占位（把右侧按钮推到行尾） */
.yj-filler {
    flex-grow: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 列表区文本换行保护（工作台三栏内的 Text 明细） */
.yj-list {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.7;
}

/* ---------- 深色主题下的适配（bricks 以 html[data-theme] 切换） ---------- */
html[data-theme="dark"] .yj-card,
html[data-theme="dark"] .yj-panel {
    background-color: #1f2937 !important;
    border-color: #374151 !important;
    color: #e5e7eb;
}

html[data-theme="dark"] .yj-btn {
    background-color: #374151;
    color: #e5e7eb;
    border-color: #4b5563;
}

html[data-theme="dark"] .yj-btn:hover {
    background-color: #4b5563;
}

/* ---------- 窄屏（< 900px）：工作台三栏允许换行 ---------- */
@media (max-width: 900px) {
    .yj-panel {
        min-width: 100%;
    }
}