/* =========================
   BOARDS BROWSER
========================= */
.boards-page { padding: 24px; }
.boards-page-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-bottom: 22px; }
.boards-page-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.boards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.board-browser-card, .board-thumb-card { width: 100%; border: 1px solid var(--line); border-radius: 16px; background: #ffffff; padding: 14px; text-align: left; cursor: pointer; box-shadow: var(--shadow); transition: 0.18s ease; }
.board-browser-card:hover, .board-thumb-card:hover { background: #fafcff; border-color: #b7c6df; transform: translateY(-1px); }
.board-browser-card.active, .board-thumb-card.active { background: var(--accent-soft); border-color: var(--accent); }
.board-browser-title, .board-thumb-title { font-size: 1.125rem; font-weight: 700; color: var(--text); }
.board-thumb-desc { font-size: 0.8125rem; color: var(--muted); }
.board-thumb-canvas { position: relative; height: 140px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbff; overflow: hidden; margin-bottom: 12px; }
.board-thumb-empty { height: 140px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbff; display: flex; align-items: center; justify-content: center; color: var(--muted); margin-bottom: 12px; font-size: 0.8125rem; }
.board-thumb-card { position: relative; }
.board-card-main { width: 100%; border: none; background: transparent; padding: 0; text-align: left; cursor: pointer; }
.board-card-actions { margin-top: 10px; display: flex; justify-content: flex-end; }
.board-select-btn { width: 40px; min-width: 40px; height: 40px; padding: 0; }
.board-select-btn.active { background: var(--accent-soft); border-color: var(--accent); }

/* =========================
   BOARD WORKSPACE
========================= */
.board-workspace-layout { display: grid; grid-template-columns: 1fr 360px; gap: 22px; padding: 24px; min-height: calc(100vh - 58px); }
.board-workspace-main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.board-workspace-toolbar-card, .board-workspace-canvas-card, .board-workspace-rightbar .asset-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.board-workspace-toolbar-card, .board-workspace-canvas-card { padding: 18px; }
.board-workspace-toolbar-top { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: end; }
.board-title-block { min-width: 0; }
.board-toolbar-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.board-workspace-canvas-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.board-workspace-canvas-title { font-size: 1.25rem; font-weight: 800; }
.board-workspace-rightbar { display: flex; flex-direction: column; gap: 18px; }
.board-canvas { position: relative; min-height: 720px; border: 1px solid var(--line); border-radius: 14px; background: #f9fbff; overflow: auto; }
.board-canvas.empty { display: flex; align-items: center; justify-content: center; color: var(--muted); text-align: center; }
.board-empty-text { color: var(--muted); text-align: center; padding-top: 160px; }
.board-note { position: absolute; width: 180px; min-height: 120px; border: 1px solid; border-radius: 14px; padding: 10px; box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06); cursor: move; user-select: none; transition: box-shadow 0.15s ease; }
.board-note:hover { box-shadow: 0 8px 20px rgba(16, 24, 40, 0.10); }
.board-note.selected { outline: 2px solid #7aa2e3; outline-offset: 2px; }
.board-note-minihead { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 0.6875rem; color: #667085; font-weight: 700; margin-bottom: 8px; }
.board-note-text-preview { font-size: 0.875rem; line-height: 1.4; color: #344054; word-break: break-word; white-space: pre-wrap; }
.selected-note-panel, .board-summary-preview { border: 1px solid var(--line); border-radius: 12px; background: #fafbfe; padding: 14px; }
.selected-note-panel.empty, .board-summary-preview.empty { min-height: 150px; display: flex; align-items: center; justify-content: center; text-align: center; color: var(--muted); }
.selected-note-textarea { min-height: 180px; }
.groups-list { display: flex; flex-direction: column; gap: 10px; }
.group-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 12px; background: #fafbfe; padding: 10px 12px; }
.group-row-title { font-weight: 700; color: var(--text); }
.group-row-meta { font-size: 0.8125rem; color: var(--muted); margin-top: 4px; }

/* =========================
   SUMMARY (TABLEROS)
========================= */
.board-summary-text { margin: 0; white-space: pre-wrap; font-family: inherit; font-size: 0.875rem; line-height: 1.55; color: #344054; }
.summary-actions { display: flex; gap: 10px; margin: 10px 0 14px 0; }
.summary-actions button { height: 40px; min-width: 140px; }

/* Overrides de Tema (Dark) */
:root.dark .board-workspace-toolbar-card, :root.dark .board-workspace-canvas-card, :root.dark .board-workspace-rightbar .asset-card, :root.dark .board-browser-card, :root.dark .board-thumb-card { background: var(--panel); color: var(--text); border-color: var(--line); }
:root.dark .board-canvas, :root.dark .selected-note-panel, :root.dark .board-summary-preview, :root.dark .group-row { background: #1d2230; color: var(--text); border-color: var(--line); }
:root.dark .board-browser-title, :root.dark .board-thumb-title, :root.dark .board-workspace-canvas-title, :root.dark .group-row-title { color: var(--text); }
:root.dark .board-empty-text, :root.dark .board-summary-text, :root.dark .board-note-minihead, :root.dark .board-note-text-preview { color: var(--muted); }
:root.dark .board-browser-card:hover, :root.dark .board-thumb-card:hover { background: #22293a; border-color: #3c4961; }
:root.dark .board-browser-card.active, :root.dark .board-thumb-card.active, :root.dark .board-select-btn.active { background: var(--accent-soft); border-color: var(--accent); }
:root.dark .board-thumb-canvas, :root.dark .board-thumb-empty { background: #161c28; border-color: var(--line); color: var(--muted); }
:root.dark .board-canvas.empty { background: #161c28; color: var(--muted); }

/* Overrides de Tema (Crema) */
:root.crema .board-workspace-toolbar-card, :root.crema .board-workspace-canvas-card, :root.crema .board-workspace-rightbar .asset-card, :root.crema .board-browser-card, :root.crema .board-thumb-card { background: var(--panel); color: var(--text); border-color: var(--line); }
:root.crema .board-canvas, :root.crema .selected-note-panel, :root.crema .board-summary-preview, :root.crema .group-row { background: #fff8ee; color: var(--text); border-color: var(--line); }
:root.crema .board-browser-card.active, :root.crema .board-thumb-card.active, :root.crema .board-select-btn.active { background: var(--accent-soft); border-color: var(--accent); }

/* Responsive */
@media (max-width: 1280px) { .board-workspace-layout { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .boards-page-toolbar, .board-workspace-toolbar-top { grid-template-columns: 1fr; } }