/* =========================
   EDITOR
========================= */
.editor-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 24px; padding: 24px; min-height: calc(100vh - 58px); }
.editor-layout.sidebar-collapsed { grid-template-columns: 0 minmax(0, 1fr); }
.editor-sidebar { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 16px; box-shadow: var(--shadow); min-width: 0; overflow: hidden; }
.editor-layout.sidebar-collapsed .editor-sidebar { padding: 0; border: none; box-shadow: none; overflow: hidden; }
.editor-sidebar-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.editor-sidebar-title { font-size: 1.375rem; font-weight: 800; }
.editor-sidebar-actions { display: flex; gap: 8px; }
.editor-entry-list { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.editor-entry-item { padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; background: #fff; }
.editor-entry-item:hover { border-color: #b7c6df; background: #fafcff; }
.editor-entry-item.active { background: var(--accent-soft); border-color: var(--accent); }
.editor-entry-empty { color: var(--muted); padding: 10px 2px; }
.editor-entry-item-title { font-weight: 600; }
.editor-entry-item-meta { margin-top: 4px; font-size: 0.75rem; color: #8a8f98; }
.editor-main { min-width: 0; }
.editor-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 22px; }
.editor-primary-column { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.editor-assets-column { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.editor-form-card, .editor-preview-card, .asset-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 18px 22px; box-shadow: var(--shadow); width: 100%; min-width: 0; box-sizing: border-box; }
.editor-form-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }
.editor-form-actions button { width: 100%; height: 48px; }
.editor-meta-row { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: end; margin-top: 8px; }
.editor-meta-block { min-width: 0; }
.editor-check-wrap { padding-bottom: 10px; white-space: nowrap; }
.editor-status { margin-top: 14px; min-height: 20px; font-size: 0.875rem; color: var(--muted); }
.editor-preview-title, .asset-card-title { font-size: 1.25rem; font-weight: 800; margin-bottom: 12px; }
.asset-card-head, .infobox-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.editor-preview-card .reader-body p, .editor-preview-card .reader-paragraph { text-align: justify; }

/* CATEGORY MENU */
.category-control-wrap { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; }
.category-gear-wrap { position: relative; }
.gear-btn { width: 44px; min-width: 44px; height: 44px; padding: 0; font-size: 1.125rem; }
.category-menu { position: absolute; top: 50px; right: 0; min-width: 220px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); padding: 8px; z-index: 40; }
.category-menu-item { width: 100%; text-align: left; border: none; background: transparent; border-radius: 10px; padding: 10px 12px; cursor: pointer; font-size: 0.875rem; }
.category-menu-item:hover { background: #f5f7fb; }
.category-menu-item.danger { color: #a12626; }
.category-menu-item.danger:hover { background: #fff3f3; }

/* STRUCTURE */
.editor-structure-card { margin: 18px 0 16px 0; padding: 14px; border: 1px solid #e6e8ee; border-radius: 14px; background: #fafbfe; }
.structure-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; cursor: pointer; }
.editor-structure-title { font-weight: 700; color: #374151; }
.structure-toggle-clean { border: none; background: transparent; padding: 0; margin: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.structure-toggle-icon { font-size: 1.125rem; color: #667085; line-height: 1; }
.structure-panel[hidden] { display: none !important; }
.editor-structure-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.editor-check-line { display: flex; align-items: center; gap: 8px; min-height: 44px; color: #374151; }
.editor-structure-field { display: flex; flex-direction: column; gap: 6px; }
.editor-structure-help { margin-top: 10px; font-size: 0.8125rem; color: #6b7280; }
.structure-children-box { margin-top: 16px; border-top: 1px solid #e6e8ee; padding-top: 14px; }
.structure-children-title { font-weight: 700; color: #374151; margin-bottom: 10px; }
.children-list { display: flex; flex-direction: column; gap: 12px; }
.children-empty { color: #8a8f98; font-size: 0.875rem; }
.child-entry-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid #e6e8ee; border-radius: 16px; background: #fafbfe; }
.child-entry-main { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; text-align: left; width: 100%; min-width: 0; padding: 12px 14px; border: 1px solid #dfe3ea; border-radius: 12px; background: #ffffff; cursor: pointer; }
.child-entry-main:hover { background: #f8f9fc; }
.child-entry-title { font-weight: 700; color: #344054; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }
.child-entry-meta { margin-top: 4px; font-size: 0.75rem; color: #98a2b3; }
.child-entry-actions { display: flex; gap: 8px; align-items: center; }
.child-entry-actions .nav-btn.small, .child-entry-actions .danger-btn.small, .child-entry-actions .small { width: 42px; min-width: 42px; height: 42px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }

/* INFOBOX EDITOR */
.infobox-top-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.infobox-top-actions .primary-btn, .infobox-top-actions .nav-btn, .infobox-top-actions .small-action-btn { width: 100%; height: 48px; min-width: 0; padding: 0 16px; justify-content: center; }
.small-action-btn { font-size: 0.875rem; }
.infobox-editor-list { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.infobox-block-editor { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid #e6e8ee; border-radius: 12px; background: #fafbfe; }
.infobox-block-main.section input { width: 100%; height: 48px; text-align: center; font-weight: 700; }
.infobox-block-main.item { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.infobox-block-main.item .editor-input { height: 48px; }
.infobox-row-actions { display: flex; gap: 10px; align-items: center; }
.infobox-row-actions .nav-btn.small, .infobox-row-actions .small { width: 48px; min-width: 48px; height: 48px; padding: 0; }
.asset-card .primary-btn, .asset-card .nav-btn { border-radius: 12px; }

/* Overrides de Tema (Dark) */
:root.dark .editor-sidebar, :root.dark .editor-form-card, :root.dark .editor-preview-card, :root.dark .asset-card { background: var(--panel); border-color: var(--line); color: var(--text); }
:root.dark .editor-entry-item, :root.dark .child-entry-main, :root.dark .editor-structure-card, :root.dark .child-entry-row, :root.dark .infobox-block-editor { background: #1d2230; color: var(--text); border-color: var(--line); }
:root.dark .editor-sidebar-title, :root.dark .editor-preview-title, :root.dark .asset-card-title, :root.dark .editor-structure-title, :root.dark .structure-children-title, :root.dark .child-entry-title, :root.dark .editor-entry-item-title, :root.dark .editor-entry-item-meta { color: var(--text); }
:root.dark .editor-status, :root.dark .editor-structure-help, :root.dark .children-empty, :root.dark .infobox-empty { color: var(--muted); }
:root.dark .editor-check-line { color: var(--text); }
:root.dark .structure-children-box { border-color: var(--line); }
:root.dark .child-entry-main:hover, :root.dark .editor-entry-item:hover { background: #22293a; border-color: #3c4961; }
:root.dark .editor-entry-item.active { background: var(--accent-soft); border-color: var(--accent); }

/* Overrides de Tema (Crema) */
:root.crema .editor-sidebar, :root.crema .editor-form-card, :root.crema .editor-preview-card, :root.crema .asset-card { background: var(--panel); border-color: var(--line); color: var(--text); }
:root.crema .editor-entry-item, :root.crema .child-entry-main, :root.crema .editor-structure-card, :root.crema .child-entry-row, :root.crema .infobox-block-editor { background: #fff8ee; color: var(--text); border-color: var(--line); }
:root.crema .editor-entry-item.active { background: var(--accent-soft); border-color: var(--accent); }

/* Responsive */
@media (max-width: 1280px) { .editor-workspace { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .editor-layout, .app-shell { grid-template-columns: 1fr; } .editor-structure-grid, .editor-meta-row { grid-template-columns: 1fr; } .infobox-top-actions, .infobox-block-editor, .infobox-block-main.item { grid-template-columns: 1fr; } .infobox-row-actions { justify-content: flex-end; } }
@media (max-width: 720px) { .child-entry-row { grid-template-columns: 1fr; } .child-entry-actions { justify-content: flex-end; } }
