/* =========================================================
   custom_dashboard.css — 全站自定义样式（登录页除外）
   ---------------------------------------------------------
   主题色变量 (--login-* / --color-*) 定义在 custom_login.css，
   本文件直接引用它们（layout.php 先加载 login 再加载本文件）。

   章节顺序：
     1.  全局背景
     2.  顶栏 Header（logo / 标题 / 项目切换器）
     3.  侧边栏 Sidebar
     4.  页面头部标签 Page header
     5.  列表 / 卡片 / 提示 / 搜索框
     6.  顶栏注入组件（视图切换 / 过滤）
     7.  项目概览仪表盘（KPI + 标签页）
     8.  看板 Kanban board
     9.  任务【编辑】弹窗表单布局 (.task-form-*)
     10. 任务【新建】弹窗表单布局 (.custom-task-form-*)
     11. 弹窗通用外观（所有 #modal-box）

   约定：弹窗样式只在本文件里改；task_creation/show.php 不再内联 <style>。
   ========================================================= */

/* custom_dashboard.css */

/* Global Dashboard Background */
body {
    background: var(--login-bg) !important;
    color: var(--login-text-color) !important;
}

/* Header & Title Stack Restructuring */
.header-left {
    display: flex;
    align-items: center;
}

.header-left .logo {
    font-size: 32px;
    margin-right: 15px;
    line-height: 1;
}

.header-titles-stack {
    display
    margin-bottom: 4px;
}

.task-board-title a {
    color: #222 !important;
}

.task-board-title a:hover {
    color: var(--color-primary) !important;
    text-decoration: none;
}

/* Clean up add button */
.board-add-icon {
    color: var(--color-primary) !important;
    font-size: 16px;
    opacity: 0.8;
}

.board-add-icon:hover {
    opacity: 1;
}

/* =========================================================
   9. 任务【编辑】弹窗 — 表单布局 (.task-form-*)
   对应模板：app/Template/task_modification/show.php
   （结构与第 10 节的新建任务弹窗相似，但类名不同；将来可考虑合并成一套）
   ========================================================= */

/* Use CSS Grid for the form container */
.task-form-container {
    display: grid !important;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 20px;
}

/* Make columns fill their grid cells */
.task-form-main-column,
.task-form-secondary-column {
    width: 100% !important;
    float: none !important;
}

/* Bottom area spans across all columns */
.task-form-bottom {
    grid-column: 1 / -1;
    margin-top: 15px;
    padding-top: 20px;
    border-top: 1px solid #f0f0f0;
}

/* Labels */
.task-form-container label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #444;
    margin-bottom: 6px;
    margin-top: 12px;
}

/* Inputs, Selects, Textareas */
.task-form-container input[type="text"],
.task-form-container input[type="number"],
.task-form-container input[type="password"],