/* 添喜玥护理管理系统 — 对齐护士长 PC 原型风格 */
:root {
  --sidebar-bg: #1a2332;
  --sidebar-hover: #243147;
  --primary: #2563eb;
  --bg: #f0f2f5;
  --card-radius: 12px;
}
body { background: var(--bg); font-size: 14px; }

/* 布局 */
.layout { display: flex; min-height: 100vh; }
.sidebar {
  width: 220px; flex: 0 0 220px; background: var(--sidebar-bg);
  color: #cbd5e1; padding: 0 0 24px; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.brand {
  color: #fff; font-size: 17px; font-weight: 600; padding: 20px 18px 6px;
}
.brand small { display: block; font-size: 12px; color: #94a3b8; font-weight: 400; margin-top: 2px; }
.menu { margin-top: 12px; }
.menu-group {
  padding: 14px 18px 6px; font-size: 12px; color: #8195b3;
  letter-spacing: 1px;
}
.menu-item {
  display: block; color: #cbd5e1; text-decoration: none;
  padding: 10px 18px; border-left: 3px solid transparent;
}
.menu-item:hover { background: var(--sidebar-hover); color: #fff; text-decoration: none; }
.menu-item.active {
  background: rgba(37, 99, 235, .18); color: #fff; border-left-color: var(--primary);
}
.menu-item.sub { padding-left: 34px; font-size: 13px; }

.main { flex: 1; min-width: 0; }
.topbar {
  background: #fff; padding: 14px 24px; display: flex; align-items: center;
  justify-content: space-between; border-bottom: 1px solid #e5e7eb;
  position: sticky; top: 0; z-index: 10;
}
.page-title { font-size: 18px; font-weight: 600; margin: 0; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.user-chip { color: #475569; font-size: 13px; }
.content { padding: 20px 24px; }

/* 卡片 */
.card { border: none; border-radius: var(--card-radius); box-shadow: 0 1px 3px rgba(16, 24, 40, .08); }
.card-header {
  background: #fff; border-bottom: 1px solid #f1f5f9; font-weight: 600;
  border-radius: var(--card-radius) var(--card-radius) 0 0 !important;
}

/* 统计卡 */
.stat-row { display: flex; gap: 16px; flex-wrap: wrap; }
.stat-card {
  flex: 1; min-width: 150px; background: #fff; border-radius: var(--card-radius);
  box-shadow: 0 1px 3px rgba(16, 24, 40, .08); padding: 18px; text-align: center;
}
.stat-card .n { font-size: 26px; font-weight: 700; }
.stat-card .l { color: #64748b; font-size: 13px; margin-top: 2px; }

/* 状态胶囊 */
.pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; }
.pill.ok { background: #d1fae5; color: #065f46; }
.pill.warn { background: #fef3c7; color: #92400e; }
.pill.danger { background: #fee2e2; color: #991b1b; }
.pill.blue { background: #dbeafe; color: #1e40af; }
.pill.pink { background: #fce7f3; color: #9d174d; }
.pill.purple { background: #ede9fe; color: #5b21b6; }
.pill.gray { background: #f1f5f9; color: #475569; }

/* 表格 */
.table th { color: #64748b; font-weight: 600; font-size: 13px; white-space: nowrap; }
.table td { vertical-align: middle; }
.table .actions .btn { padding: 2px 8px; font-size: 12px; }

/* 房间格子墙 */
.room-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px; }
.room-cell {
  border-radius: 10px; padding: 10px 8px; text-align: center; font-size: 13px;
  background: #f8fafc; border: 1px solid #e2e8f0;
}
.room-cell .no { font-weight: 700; font-size: 14px; }
.room-cell.occupied { background: #dbeafe; border-color: #93c5fd; }
.room-cell.repair { background: #fef3c7; border-color: #fcd34d; }

/* 房间画布：自由拖拽摆放（卡片尺寸/槽位几何须与 org.py 中 ROOM_CARD_* 常量一致） */
.room-board { position: relative; }
.room-board .room-cell {
  position: absolute; width: 110px; height: 112px; margin: 0;
  cursor: grab; user-select: none; touch-action: none; overflow: hidden;
}
.room-board .room-cell:active { cursor: grabbing; }
.room-board .room-cell .small { font-size: 12px; line-height: 1.25; }
.room-board .room-cell .my-1 { margin: 2px 0 !important; }
.room-board .room-cell.dragging {
  opacity: .55; z-index: 60;
  box-shadow: 0 6px 16px rgba(16, 24, 40, .22);
}
.room-board .room-cell.overlap { border-style: dashed; border-color: #f87171; }

/* 房间位置图：状态图例（空置/在用/维修/重叠） */
.board-legend {
  display: inline-flex; flex-wrap: wrap; gap: 10px; align-items: center;
  font-size: 12px; color: #64748b; font-weight: 400;
}
.legend-item { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.legend-dot {
  display: inline-block; width: 12px; height: 12px; border-radius: 3px;
  border: 1px solid #cbd5e1; background: #f8fafc;
}
.legend-dot-overlap { background: transparent; border: 1px dashed #f87171; }

/* 房间位置图：画布容器（自定义宽度超出时滚动）、网格坐标线、对齐辅助线、尺寸手柄 */
.board-layout { min-width: 0; }
.board-wrap { overflow: auto; min-width: 0; }
.room-board {
  border: 1px solid #e2e8f0; border-radius: 10px; background: #fcfdff;
}
.room-board.show-grid {
  background-image:
    linear-gradient(to right, rgba(37, 99, 235, .08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(37, 99, 235, .08) 1px, transparent 1px);
}
.room-board.sizing { border-color: var(--primary); }
.board-guide {
  position: absolute; display: none; z-index: 70; pointer-events: none;
}
.board-guide.guide-v { top: 0; bottom: 0; width: 0; border-left: 1px dashed #f43f5e; }
.board-guide.guide-h { left: 0; right: 0; height: 0; border-top: 1px dashed #f43f5e; }
.board-resize {
  position: absolute; right: 0; bottom: 0; width: 20px; height: 20px;
  cursor: nwse-resize; z-index: 50; touch-action: none;
  border-bottom-right-radius: 10px;
  background:
    linear-gradient(135deg, transparent 0 50%, #94a3b8 50% 58%,
                    transparent 58% 66%, #94a3b8 66% 74%, transparent 74% 82%);
}
.board-resize:hover { background-color: rgba(37, 99, 235, .12); }
.board-size-tip {
  position: absolute; right: 28px; bottom: 6px; display: none;
  background: #1a2332; color: #fff; font-size: 12px; border-radius: 6px;
  padding: 2px 8px; z-index: 80; pointer-events: none;
}

/* 房间位置图：画布布置图标（右侧面板拖入；padding/gap/字号均按 em，
   JS 调整 font-size 即可整体等比缩放，100%=12px 基准） */
.room-board .board-item {
  position: absolute; display: inline-flex; align-items: center; gap: .4167em;
  background: #fff; border: 1px solid #cbd5e1; border-radius: 999px;
  padding: .3334em 1em; font-size: 12px; color: #334155; z-index: 10;
  cursor: grab; user-select: none; touch-action: none;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .10);
}
.room-board .board-item:active { cursor: grabbing; }
.room-board .board-item .ico { font-size: 1.25em; line-height: 1; }
.room-board .board-item .t { font-weight: 600; white-space: nowrap; }
.room-board .board-item.dragging {
  opacity: .7; z-index: 65; box-shadow: 0 6px 16px rgba(16, 24, 40, .22);
}
.room-board .board-item.resizing {
  opacity: .85; z-index: 65; box-shadow: 0 3px 10px rgba(16, 24, 40, .18);
}
/* × 移除按钮与缩放手柄：尺寸/偏移用 em 随图标等比缩放——药丸圆角随放大变大，
   固定像素按钮会整体悬到圆角外的不可命中区（悬停一断按钮即隐藏，鼠标够不着）；
   em 保持与圆角的比例重叠，max() 只兜住小图下的最小可点尺寸 */
.room-board .board-item .item-del {
  display: none; position: absolute; top: max(-12px, -.6667em); right: max(-12px, -.6667em);
  width: max(12px, 1.3333em); height: max(12px, 1.3333em); line-height: 1; padding: 0;
  border-radius: 50%; border: none; background: #ef4444; color: #fff;
  cursor: pointer; align-items: center; justify-content: center;
}
.room-board .board-item:hover .item-del { display: inline-flex; }
/* 右下角缩放手柄：悬停图标时出现，拖动调整图标大小 */
.room-board .board-item .item-resize {
  display: none; position: absolute; right: max(-10px, -.5em); bottom: max(-10px, -.5em);
  width: max(10px, 1.0833em); height: max(10px, 1.0833em); box-sizing: border-box;
  cursor: nwse-resize; touch-action: none;
  border: 1px solid #cbd5e1; border-radius: 3px; background-color: #fff;
  background-image:
    linear-gradient(135deg, transparent 0 45%, #94a3b8 45% 60%,
                    transparent 60% 75%, #94a3b8 75% 90%, transparent 90%);
}
.room-board .board-item:hover .item-resize,
.room-board .board-item.resizing .item-resize { display: block; }
.room-board .board-item .item-resize:hover { border-color: var(--primary, #2563eb); }

/* 房间位置图：右侧常用图标面板 */
.board-icon-panel {
  flex: 0 0 150px; width: 150px; background: #fff; border-radius: var(--card-radius);
  border: 1px solid #f1f5f9; padding: 10px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .08);
}
.board-icon-panel .panel-title { font-weight: 600; font-size: 13px; margin-bottom: 8px; }
.board-icon-panel .panel-items { display: flex; flex-wrap: wrap; gap: 6px; }
.board-icon-panel .panel-tip { margin-top: 8px; font-size: 12px; color: #94a3b8; line-height: 1.5; }
.icon-chip {
  display: inline-flex; align-items: center; gap: 4px;
  border: 1px dashed #cbd5e1; border-radius: 8px; background: #f8fafc;
  padding: 5px 8px; font-size: 12px; color: #475569;
  cursor: grab; user-select: none;
}
.icon-chip:hover { border-color: var(--primary); color: var(--primary); background: #eff6ff; }
.icon-chip:active { cursor: grabbing; }
.icon-chip .ico { font-size: 15px; line-height: 1; }
.icon-chip .t { white-space: nowrap; }

/* 楼层管理：拖拽排序（同任务分类） */
#floorTable tr[data-id] .sort-handle { cursor: grab; user-select: none; color: #94a3b8; text-align: center; }
#floorTable tr[data-id]:active .sort-handle { cursor: grabbing; }
#floorTable tr.dragging { opacity: .45; background: #eff6ff; }

/* 护理组列表：拖拽排序（同楼层管理） */
#groupTable tr[data-id] .sort-handle { cursor: grab; user-select: none; color: #94a3b8; text-align: center; }
#groupTable tr[data-id]:active .sort-handle { cursor: grabbing; }
#groupTable tr.dragging { opacity: .45; background: #eff6ff; }

/* 表单 */
.form-card { max-width: 860px; }
.form-section-title {
  font-size: 13px; color: var(--primary); font-weight: 700; margin: 18px 0 10px;
  border-left: 3px solid var(--primary); padding-left: 8px;
}
.required::after { content: " *"; color: #ef4444; }

/* 登录页 */
.login-body {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1a2332 0%, #2563eb 100%);
}
.login-card {
  width: 380px; background: #fff; border-radius: 14px; padding: 34px 32px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}
.login-brand { font-size: 22px; font-weight: 700; text-align: center; }
.login-sub { color: #64748b; text-align: center; margin: 4px 0 20px; font-size: 13px; }
/* 登录框移动端优化：小屏左右留出更多边距、收紧内边距 */
@media (max-width: 480px) {
  .login-card {
    width: calc(100% - 56px);
    max-width: 380px;
    padding: 28px 24px;
  }
}

/* 分页 */
.pager { display: flex; gap: 8px; align-items: center; margin-top: 14px; }
.pager .btn { padding: 2px 10px; font-size: 13px; }
.pager .info { color: #64748b; font-size: 13px; }

/* 任务分类：类型 tab 菜单 */
.cat-tabs { gap: 4px; flex-wrap: wrap; margin-bottom: 0; }
.cat-tab { display: inline-flex; align-items: center; }
.cat-tab-link {
  display: inline-block; padding: 5px 14px; border-radius: 999px;
  color: #475569; text-decoration: none; font-size: 13px; white-space: nowrap;
}
.cat-tab-link:hover { color: var(--primary); text-decoration: none; }
.cat-tab-link.active { background: var(--primary); color: #fff; }
.cat-tab-add {
  border: 1px dashed #94a3b8; background: none; color: #64748b;
  border-radius: 999px; padding: 4px 12px; font-size: 13px; white-space: nowrap;
}
.cat-tab-add:hover { color: var(--primary); border-color: var(--primary); }
.cat-admin { display: none; margin-left: 2px; }
.cat-tabs.manage .cat-admin { display: inline-flex; gap: 2px; }
.btn-ico {
  border: none; background: none; padding: 2px 3px; color: #64748b;
  line-height: 1; display: inline-flex; align-items: center;
}
.btn-ico:hover { color: var(--primary); }
.btn-ico.danger:hover { color: #dc2626; }

/* 任务分类：拖拽排序 */
#catTable tr[data-id] .sort-handle { cursor: grab; user-select: none; color: #94a3b8; text-align: center; }
#catTable tr[data-id]:active .sort-handle { cursor: grabbing; }
#catTable tr.dragging { opacity: .45; background: #eff6ff; }

/* 任务列表：左右布局（左分类 / 右列表） */
.task-side .list-group-item {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  border: none; border-bottom: 1px solid #f1f5f9; padding: 9px 14px;
  color: #334155; font-size: 13px; text-decoration: none; cursor: pointer;
}
.task-side .list-group-item:last-child { border-bottom: none; }
.task-side .list-group-item:hover { background: #f8fafc; color: var(--primary); }
.task-side .list-group-item.active {
  background: rgba(37, 99, 235, .1); color: var(--primary); font-weight: 600;
}
.task-side .list-group-item .text-truncate { min-width: 0; }
.side-count {
  flex: none; min-width: 22px; text-align: center; font-size: 12px;
  color: #64748b; background: #f1f5f9; border-radius: 999px; padding: 0 6px;
}
.task-side .list-group-item.active .side-count { background: var(--primary); color: #fff; }

/* 任务列表：拖拽排序 */
#taskTable tr[data-id] .sort-handle { cursor: grab; user-select: none; color: #94a3b8; text-align: center; }
#taskTable tr[data-id]:active .sort-handle { cursor: grabbing; }
#taskTable tr.dragging { opacity: .45; background: #eff6ff; }

/* ============================================================
   助理A 粉色主题（fix93）：base.html body.theme-pink 仅助理A页面挂载，
   覆盖 --primary 变量 + 按钮聚焦色，不影响护士长/助理B/管理员等角色页面。
   ============================================================ */
body.theme-pink { --primary: #ec4899; }
body.theme-pink .menu-item.active { background: rgba(236, 72, 153, .18); }
body.theme-pink .btn-primary {
  --bs-btn-bg: #ec4899; --bs-btn-border-color: #ec4899;
  --bs-btn-hover-bg: #db2777; --bs-btn-hover-border-color: #db2777;
  --bs-btn-active-bg: #be185d; --bs-btn-active-border-color: #be185d;
  --bs-btn-disabled-bg: #ec4899; --bs-btn-disabled-border-color: #ec4899;
}
body.theme-pink .btn-outline-primary {
  --bs-btn-color: #ec4899; --bs-btn-border-color: #ec4899;
  --bs-btn-hover-bg: #ec4899; --bs-btn-hover-border-color: #ec4899;
  --bs-btn-active-bg: #db2777; --bs-btn-active-border-color: #db2777;
  --bs-btn-disabled-color: #ec4899; --bs-btn-disabled-border-color: #ec4899;
}
body.theme-pink .form-control:focus,
body.theme-pink .form-select:focus {
  border-color: #f9a8c9; box-shadow: 0 0 0 .2rem rgba(236, 72, 153, .15);
}
body.theme-pink .form-check-input:checked { background-color: #ec4899; border-color: #ec4899; }

/* ============================================================
   助理B 紫色主题（助理B-PC版改造方案 §2）：base.html body.theme-purple
   仅助理B页面挂载，镜像上方 theme-pink 同款选择器（主色 #8a5cff），
   不影响护士长/助理A/管理员等角色页面。
   ============================================================ */
body.theme-purple { --primary: #8a5cff; }
body.theme-purple .menu-item.active { background: rgba(138, 92, 255, .18); }
body.theme-purple .btn-primary {
  --bs-btn-bg: #8a5cff; --bs-btn-border-color: #8a5cff;
  --bs-btn-hover-bg: #7442e6; --bs-btn-hover-border-color: #7442e6;
  --bs-btn-active-bg: #5f34c4; --bs-btn-active-border-color: #5f34c4;
  --bs-btn-disabled-bg: #8a5cff; --bs-btn-disabled-border-color: #8a5cff;
}
body.theme-purple .btn-outline-primary {
  --bs-btn-color: #8a5cff; --bs-btn-border-color: #8a5cff;
  --bs-btn-hover-bg: #8a5cff; --bs-btn-hover-border-color: #8a5cff;
  --bs-btn-active-bg: #7442e6; --bs-btn-active-border-color: #7442e6;
  --bs-btn-disabled-color: #8a5cff; --bs-btn-disabled-border-color: #8a5cff;
}
body.theme-purple .form-control:focus,
body.theme-purple .form-select:focus {
  border-color: #c9b8ff; box-shadow: 0 0 0 .2rem rgba(138, 92, 255, .15);
}
body.theme-purple .form-check-input:checked { background-color: #8a5cff; border-color: #8a5cff; }

/* ---- 助理A 看板组件（原型图1/2 版式） ---- */
.a-proj-card { border-top: 3px solid #ec4899; }
.a-badge {
  min-width: 20px; height: 20px; background: #e11d48; color: #fff;
  border-radius: 10px; font-size: 12px; line-height: 20px; text-align: center;
  display: inline-block; padding: 0 6px; font-weight: 600;
}
.a-progress { height: 8px; background: #f1f5f9; border-radius: 4px; overflow: hidden; }
.a-progress-fill { height: 100%; background: linear-gradient(90deg, #f472b6, #ec4899); border-radius: 4px; }
.a-mod-dot {
  flex: none; width: 30px; height: 30px; border-radius: 50%;
  background: #fce7f3; color: #be185d; font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center;
}
.a-summary { line-height: 1.55; }
.a-dashed { border-top: 1px dashed #f9a8c9; opacity: 1; }
.a-op { padding: 8px 0; border-bottom: 1px dashed #f1f5f9; }
.a-op:last-child { border-bottom: none; }
.a-op .a-chk {
  flex: none; width: 22px; height: 22px; border: 2px solid #cbd5e1; border-radius: 6px;
  background: #fff; color: #fff; text-align: center; line-height: 19px;
  font-size: 13px; cursor: pointer; user-select: none;
}
.a-op.done .a-chk { background: #ec4899; border-color: #ec4899; }
.a-op-name { font-weight: 500; }
.a-ph { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.a-cam {
  width: 44px; height: 44px; border: 1px dashed #f9a8c9; border-radius: 8px;
  background: #fff5f9; font-size: 18px; font-style: normal; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.a-cam:hover { background: #ffe4f1; }
.a-thumb { height: 44px; border-radius: 6px; }
.a-btn-pink { background: #ec4899; border-color: #ec4899; color: #fff; font-weight: 600; }
.a-btn-pink:hover, .a-btn-pink:focus { background: #db2777; border-color: #db2777; color: #fff; }
.a-admit-card:hover { outline: 2px solid #f9a8c9; }

/* ---- 助理A 模块页 / PC 向导（fix93 原型 V2.0 对齐） ---- */
/* role-top 粉A圆标（原型 .role-top .av） */
.a-avatar {
  flex: none; width: 32px; height: 32px; border-radius: 50%;
  background: #ec4899; color: #fff; font-size: 15px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}

/* 完整项目任务卡内的模块任务行（原型 .proj-list .task，行点击进模块页） */
.a-proj-row {
  padding: 8px 0; border-bottom: 1px dashed #f1f5f9;
  color: inherit; text-decoration: none;
}
.a-proj-row:last-child { border-bottom: none; }
.a-proj-row:hover { background: #fdf2f8; text-decoration: none; }
.a-proj-row .a-chk { cursor: default; }

/* PC 六步向导（原型 admitWizard：步骤圆点条 + 限宽表单卡 + 新收摘要卡） */
.a-wizard { max-width: 960px; }
.a-wizard .steps { display: flex; gap: 0; }
.a-wizard .steps .st { flex: 1; height: 6px; border-radius: 3px; background: #f1f5f9; }
.a-wizard .steps .st.on { background: #ec4899; }
.a-wizard-step-title {
  font-size: 15px; font-weight: 700; color: #be185d;
  border-left: 3px solid #ec4899; padding-left: 8px;
}
.a-menu-check { padding: 6px 0; border-bottom: 1px dashed #f1f5f9; }
.a-menu-check:last-of-type { border-bottom: none; }
.a-wizard .form-section-title { border-left-color: #ec4899; color: #be185d; }

/* 新收摘要卡（原型 .admit-summary/.as-row） */
.admit-summary {
  background: #fdf2f8; border: 1px solid #fbcfe8; border-radius: 10px; padding: 6px 14px;
}
.admit-summary .as-row {
  display: flex; justify-content: space-between; gap: 16px; padding: 7px 0;
  border-bottom: 1px dashed #f9a8c9; font-size: 13px;
}
.admit-summary .as-row:last-child { border-bottom: none; }
.admit-summary .as-row span { color: #64748b; }
.admit-summary .as-row b { font-weight: 600; text-align: right; }
.a-thumb-miss {
  width: 60px; height: 44px; border-radius: 6px; background: #f1f5f9;
  color: #94a3b8; font-size: 12px;
}