/* ══════════════════════════════════════════════════════════════
   Newsday Admin CSS  v0.8
   ══════════════════════════════════════════════════════════════ */

/* ── VARIABLES & RESET ─────────────────────────────────────── */
:root {
  --blue:#5068e8; --blue2:#3d55d6;
  --dark:#12122a; --dark2:#1e293b;
  --bg:#f0f2f5;   --bg2:#f8fafc;
  --border:#e2e8f0;
  --muted:#94a3b8;
  --ink:#1a1a2e;
  --topbar-h:52px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--ink);
     height:100vh;display:flex;flex-direction:column;overflow:hidden;user-select:none}
code{background:#f1f5f9;padding:1px 6px;border-radius:4px;font-size:11px}
.empty-hint{color:var(--muted);font-size:13px}

/* ── LOGIN ──────────────────────────────────────────────────── */
#login-overlay{position:fixed;inset:0;background:#0f0f20;z-index:9999;display:flex;align-items:center;justify-content:center}
#login-overlay.hidden{display:none}
.login-card{background:#1a1a2e;border:1px solid #2a2a50;border-radius:14px;padding:40px 36px;width:340px;box-shadow:0 24px 80px rgba(0,0,0,.6)}
.login-logo{font-size:24px;font-weight:800;color:#7c9ff5;text-align:center;margin-bottom:4px}
.login-logo span{color:#c0c8e8}
.login-sub{text-align:center;font-size:13px;color:#4a5080;margin-bottom:28px}
.lbl{display:block;font-size:12px;font-weight:600;color:#7888b8;margin-bottom:5px;margin-top:16px;text-transform:uppercase;letter-spacing:.4px}
.linput{width:100%;background:#0f0f1a;border:1px solid #2a2a50;border-radius:7px;padding:10px 12px;font-size:14px;color:#e0e6ff;outline:none;font-family:inherit;transition:border .15s}
.linput:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(80,104,232,.15)}
.lbtn{width:100%;margin-top:22px;background:var(--blue);color:#fff;border:none;border-radius:8px;padding:12px;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s}
.lbtn:hover{background:var(--blue2)}
.lerr{background:rgba(239,68,68,.12);color:#f87171;border-radius:6px;padding:9px 13px;font-size:12px;margin-bottom:10px;display:none}
.lerr.show{display:block}
.lmode{margin-top:14px;font-size:11px;color:#4a5080;text-align:center}
.lmode span{color:var(--blue);text-decoration:underline;cursor:pointer}

/* ── TOPBAR ─────────────────────────────────────────────────── */
#topbar{display:flex;align-items:center;padding:0 16px 0 14px;height:var(--topbar-h);
        background:var(--dark);flex-shrink:0;z-index:100;border-bottom:1px solid #1e1e3a;gap:0}
#logo{font-size:16px;font-weight:800;color:#7c9ff5;white-space:nowrap;margin-right:16px;flex-shrink:0}
#logo span{color:#c0c8e8}
#logo small{font-size:9px;font-weight:400;color:#4a5080;margin-left:3px;vertical-align:middle}

/* ── TAB NAVIGATION ─────────────────────────────────────────── */
.tab-nav{display:flex;align-items:stretch;height:100%;flex:1;overflow-x:auto;scrollbar-width:none}
.tab-nav::-webkit-scrollbar{display:none}
.tnav-btn{display:flex;align-items:center;gap:6px;padding:0 14px;border:none;
          background:transparent;color:#9aaed4;font-size:12px;font-weight:600;cursor:pointer;
          white-space:nowrap;height:100%;border-bottom:3px solid transparent;
          transition:color .14s,background .14s,border-color .14s;letter-spacing:.2px}
.tnav-btn:hover{color:#e2eaff;background:rgba(255,255,255,.09);border-bottom-color:rgba(124,159,245,.4)}
.tnav-btn.active{color:#fff;border-bottom-color:#7c9ff5;background:rgba(80,104,232,.22);
                 text-shadow:0 0 12px rgba(124,159,245,.5)}

/* ── TOP ACTIONS ─────────────────────────────────────────────── */
.top-actions{display:flex;align-items:center;gap:6px;flex-shrink:0;margin-left:10px}
#conn-badge{font-size:10px;font-weight:700;padding:3px 9px;border-radius:10px;white-space:nowrap}
.conn-on{background:#064e3b;color:#4ade80}
.conn-off{background:#1e2440;color:#7888b8}
.conn-dirty{background:#422006;color:#fb923c}
.conn-sync-btn{color:#fbbf24;cursor:pointer;font-weight:700;white-space:nowrap;margin-left:2px}
.conn-sync-btn:hover{text-decoration:underline}

/* ── BOTONES ─────────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:6px;border:none;
     font-size:12px;font-weight:500;cursor:pointer;transition:all .14s;white-space:nowrap;font-family:inherit}
.btn-sm{padding:4px 9px;font-size:11px}
.btn-ghost{background:transparent;color:#9aa8d0}
.btn-ghost:hover{background:rgba(255,255,255,.09);color:#fff}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue2)}
.btn-green{background:#16a34a;color:#fff}
.btn-green:hover{background:#15803d}
.btn-red{background:transparent;color:#f87171}
.btn-red:hover{background:rgba(248,113,113,.12)}
.tb{padding:4px 7px;border:none;background:none;border-radius:4px;cursor:pointer;
    font-size:12px;color:#64748b;min-width:26px;text-align:center;transition:all .1s;font-family:inherit}
.tb:hover{background:#f1f5f9;color:var(--ink)}
.tb.on{background:#eff3ff;color:var(--blue)}
.tsep2{width:1px;background:#e2e8f0;margin:2px 3px;flex-shrink:0}
.tsep-v{width:1px;height:18px;background:#e2e8f0;flex-shrink:0}
.save-msg{font-size:12px;color:#64748b;align-self:center}

/* ── TAB PANELS ──────────────────────────────────────────────── */
#tabpanels{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0}
.tabpanel{display:none;flex:1;overflow:hidden;flex-direction:column;min-height:0}
.tabpanel.active{display:flex}
.tab-scroll{flex:1;overflow-y:auto;padding:28px}

/* ── DASHBOARD ───────────────────────────────────────────────── */
.dash-scroll{flex:1;overflow-y:auto;padding:24px 28px}
.dash-head{margin-bottom:20px}
.dash-head h1{font-size:22px;font-weight:800;color:#0f172a;margin-bottom:4px}
.dash-head p{font-size:13px;color:var(--muted)}
.dash-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-bottom:24px}
.stat-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px 18px;
           transition:box-shadow .15s;cursor:default}
.stat-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.07)}
.stat-n{font-size:28px;font-weight:800;line-height:1;margin-bottom:4px}
.stat-l{font-size:12px;color:var(--muted);font-weight:500}
.stat-blue  .stat-n{color:var(--blue)}
.stat-green .stat-n{color:#16a34a}
.stat-amber .stat-n{color:#d97706}
.stat-slate .stat-n{color:#64748b}
.dash-body{display:grid;grid-template-columns:1fr 220px 260px;gap:20px}
@media(max-width:1100px){.dash-body{grid-template-columns:1fr 240px}}
@media(max-width:700px){.dash-body{grid-template-columns:1fr}}
.dash-section{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px;margin-bottom:16px}
.dash-section h3{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:12px;
                 text-transform:uppercase;letter-spacing:.5px}
.dash-post-row{display:flex;align-items:center;gap:10px;padding:8px 0;
               border-bottom:1px solid #f8fafc;cursor:pointer;border-radius:4px;transition:background .1s}
.dash-post-row:last-child{border-bottom:none}
.dash-post-row:hover{background:#f8faff;padding:8px 6px}
.dpr-title{font-size:13px;font-weight:600;color:#0f172a;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dpr-date{font-size:11px;color:var(--muted);flex-shrink:0}
.status-pill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;flex-shrink:0}
.pill-pub{background:#dcfce7;color:#166534}
.pill-bor{background:#f1f5f9;color:#64748b}
.qa-grid{display:flex;flex-direction:column;gap:7px}
.qa-btn{display:flex;align-items:center;gap:8px;padding:9px 12px;
        border:1px solid var(--border);border-radius:8px;background:#fff;color:#334155;
        font-size:12px;font-weight:500;cursor:pointer;transition:all .13s;
        text-decoration:none;width:100%;font-family:inherit}
.qa-btn:hover{border-color:var(--blue);background:#f0f3ff;color:var(--blue)}

/* ── MANTENIMIENTO ─────────────────────────────────────────────── */
.maint-widget{background:#fff;border:2px solid var(--border);border-radius:12px;padding:16px 20px;margin-bottom:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.maint-widget.maint-on{border-color:#f59e0b;background:#fffbeb}
.maint-icon{font-size:28px;flex-shrink:0}
.maint-info{flex:1;min-width:160px}
.maint-info h3{font-size:13px;font-weight:700;color:#0f172a;margin-bottom:2px}
.maint-info p{font-size:11px;color:var(--muted);line-height:1.4}
.maint-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;display:inline-block;margin-top:4px}
.maint-badge-on{background:#fef3c7;color:#92400e}
.maint-badge-off{background:#f1f5f9;color:#64748b}
.maint-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.maint-page-sel{font-size:12px;border:1px solid var(--border);border-radius:6px;padding:5px 8px;background:#fff;color:#334155;font-family:inherit;max-width:160px}
.maint-toggle{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}
.maint-toggle input{opacity:0;width:0;height:0}
.maint-toggle-slider{position:absolute;cursor:pointer;inset:0;background:#cbd5e1;border-radius:24px;transition:.2s}
.maint-toggle-slider:before{content:'';position:absolute;height:18px;width:18px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s}
.maint-toggle input:checked+.maint-toggle-slider{background:#f59e0b}
.maint-toggle input:checked+.maint-toggle-slider:before{transform:translateX(20px)}

/* ── TAG CLOUD ─────────────────────────────────────────────────── */
.tag-cloud{display:flex;flex-wrap:wrap;gap:5px;padding-top:4px}
.tag-cloud-item{display:inline-block;padding:2px 9px;border-radius:12px;background:#f1f5f9;color:#475569;font-size:11px;font-weight:500;cursor:pointer;transition:background .12s}
.tag-cloud-item:hover{background:#e0e7ff;color:#5068e8}
.tag-cloud-item.tc-lg{font-size:14px;padding:3px 12px;font-weight:700;color:#5068e8;background:#eef2ff}
.tag-cloud-item.tc-md{font-size:12px;padding:3px 10px;font-weight:600}

/* ── DISCO ─────────────────────────────────────────────────────── */
.disk-row{display:flex;align-items:center;gap:8px;margin-bottom:9px}
.disk-row:last-child{margin-bottom:0}
.disk-label{font-size:11px;color:#64748b;width:50px;flex-shrink:0}
.disk-bar-wrap{flex:1;background:#f1f5f9;border-radius:6px;height:7px;overflow:hidden}
.disk-bar{height:100%;border-radius:6px;background:var(--blue);transition:width .4s}
.disk-val{font-size:10px;color:var(--muted);width:46px;text-align:right;flex-shrink:0}

/* ── MAQUETAR: preview global header/footer ────────────────────── */
.maq-hf-preview{width:100%;background:#12122a;color:#94a3b8;font-size:11px;padding:6px 16px;
                display:flex;align-items:center;gap:10px;flex-wrap:wrap;opacity:.85;
                border-radius:4px;margin:2px 0;min-height:30px;box-sizing:border-box}
.maq-hf-preview .hfp-lbl{font-size:9px;font-weight:700;text-transform:uppercase;
                           letter-spacing:.8px;color:#5068e8;flex-shrink:0;margin-right:4px}
.maq-hf-preview .hfp-block{background:rgba(255,255,255,.07);border-radius:4px;
                             padding:2px 8px;font-size:10px;white-space:nowrap}
.maq-hf-preview .hfp-empty{color:#475569;font-style:italic;font-size:10px}

/* ── PÁGINAS WIDGET ────────────────────────────────────────────── */
.pages-widget-row{display:flex;align-items:center;gap:6px;padding:5px 0;border-bottom:1px solid #f8fafc;font-size:12px;color:#334155}
.pages-widget-row:last-child{border-bottom:none}
.pages-widget-row .pg-slug{color:var(--muted);font-size:11px;margin-left:auto;font-family:monospace}

/* ── ESCRIBIR TAB ─────────────────────────────────────────────── */
#escribir-inner{display:flex;flex:1;overflow:hidden;height:100%}

#posts-sidebar{width:220px;flex-shrink:0;display:flex;flex-direction:column;
               background:#fff;border-right:1px solid var(--border);overflow:hidden}
.ps-head{display:flex;align-items:center;justify-content:space-between;
         padding:10px 12px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--bg2)}
.ps-head-lbl{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
#posts-list{flex:1;overflow-y:auto}
.pli{display:flex;align-items:center;gap:8px;padding:9px 12px;cursor:pointer;
     border-bottom:1px solid #f8fafc;transition:background .1s}
.pli:hover{background:#f8faff}
.pli.cur{background:#eff3ff;border-left:3px solid var(--blue)}
.pli-info{flex:1;min-width:0}
.pli-t{font-size:12px;font-weight:600;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pli-d{font-size:10px;color:var(--muted);margin-top:1px}
.pli-del{background:none;border:none;color:#ef4444;cursor:pointer;font-size:11px;
         padding:2px 5px;opacity:0;transition:opacity .1s;flex-shrink:0}
.pli:hover .pli-del{opacity:1}
.pli-lock{font-size:9px;vertical-align:middle;opacity:.8}

#editor-panel{flex:1;display:flex;flex-direction:column;background:#fff;
              border-right:1px solid var(--border);overflow:hidden;min-width:0}
.ed-topbar{display:flex;align-items:center;gap:6px;padding:7px 12px;
           border-bottom:1px solid var(--border);flex-shrink:0;background:var(--bg2);flex-wrap:wrap}
.ed-topbar-title{font-size:12px;font-weight:600;color:#64748b;flex:1;
                 overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#status-badge{font-size:10px;font-weight:700;padding:2px 9px;border-radius:20px;
              letter-spacing:.5px;text-transform:uppercase;flex-shrink:0}
.sb-draft{background:#1e2440;color:#7888b8}
.sb-pub{background:#063826;color:#4ade80}

#post-title{width:100%;border:none;outline:none;font-size:19px;font-weight:700;
            color:#0f172a;line-height:1.3;resize:none;font-family:inherit;
            background:transparent;padding:14px 18px 0}
#post-title::placeholder{color:#cbd5e1}

#meta-bar{display:flex;gap:6px;padding:8px 18px;border-bottom:1px solid #f1f5f9;flex-wrap:wrap}
.mi{border:1px solid var(--border);border-radius:5px;padding:4px 7px;font-size:12px;
    color:#475569;background:var(--bg2);outline:none;font-family:inherit}
.mi:focus{border-color:var(--blue);background:#fff}
#meta-tags{flex:1;min-width:80px}

#ed-toolbar{display:flex;gap:1px;padding:5px 12px;border-bottom:1px solid #f1f5f9;
            flex-wrap:wrap;background:var(--bg2);flex-shrink:0}
#ed-body{flex:1;padding:16px 20px;overflow-y:auto;font-size:14px;line-height:1.85;
         color:#334155;outline:none;user-select:text}
#ed-body:empty::before{content:'Escribe el contenido aquí…';color:#cbd5e1;pointer-events:none}
#ed-body h1{font-size:22px;font-weight:700;margin-bottom:10px}
#ed-body h2{font-size:17px;font-weight:600;margin-bottom:8px}
#ed-body h3{font-size:14px;font-weight:600;margin-bottom:6px}
#ed-body p{margin-bottom:9px}
#ed-body blockquote{border-left:3px solid var(--blue);margin:10px 0;padding:7px 14px;
                    color:#64748b;background:var(--bg2);border-radius:0 4px 4px 0}
#ed-body ul,#ed-body ol{margin:7px 0 7px 22px}
#ed-body li{margin-bottom:3px}
#ed-body a{color:var(--blue)}
#ed-body img{max-width:100%;border-radius:4px}

.ed-foot{display:flex;align-items:center;gap:8px;padding:7px 18px;
         border-top:1px solid #f1f5f9;flex-shrink:0;background:var(--bg2)}
#wc{font-size:11px;color:var(--muted);flex:1}

#media-sidebar{width:180px;flex-shrink:0;display:flex;flex-direction:column;
               background:var(--bg2);border-left:1px solid var(--border);overflow:hidden}
.ms-head{padding:10px 12px;font-size:11px;font-weight:700;color:var(--muted);
         text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--border);
         background:#fff;flex-shrink:0}
#media-mini-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(2,1fr);
                 gap:5px;padding:8px;align-content:start}
.mini-img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;cursor:grab;
          border:2px solid transparent;transition:border-color .1s}
.mini-img:hover{border-color:var(--blue)}
.ms-all-btn{margin:6px 8px 8px;font-size:11px;border:1px solid var(--border);
            color:#334155;background:#fff;border-radius:6px;padding:6px 0;
            width:calc(100% - 16px);justify-content:center}

/* ── MAQUETAR TAB ─────────────────────────────────────────────── */
#maquetar-inner{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}
#lt-toolbar{display:flex;align-items:center;gap:7px;padding:7px 12px;
            background:#fff;border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap}
#lt-toolbar label{font-size:11px;color:#64748b;white-space:nowrap}
.lsel{border:1px solid var(--border);border-radius:5px;padding:4px 7px;font-size:12px;
      background:var(--bg2);outline:none;cursor:pointer;font-family:inherit;color:#334155}
.lsel:focus{border-color:var(--blue)}
#lt-hint{margin-left:auto;font-size:11px;color:var(--muted);white-space:nowrap}

#palette{display:flex;gap:5px;padding:7px 12px;background:#f5f7fb;
         border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;align-items:center}
#pal-label{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;
           margin-right:3px;white-space:nowrap}
.pb{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 8px;
    border-radius:6px;border:1.5px solid var(--border);background:#fff;cursor:pointer;
    font-size:10px;color:#64748b;transition:all .13s;min-width:50px;text-align:center}
.pb:hover{border-color:var(--blue);background:#f0f3ff;color:var(--blue)}
.pb.on{border-color:var(--blue);background:var(--blue);color:#fff}
.pb-ic{font-size:14px;line-height:1}

#gwork{flex:1;overflow:auto;padding:20px;background:#e8ebf0;min-height:0}
#gpage{background:#fff;box-shadow:0 4px 28px rgba(0,0,0,.12);border-radius:3px;margin:0 auto;max-width:980px;position:relative}
#gcanvas{display:grid;position:relative}
#govl{position:absolute;inset:0;display:grid;pointer-events:none;z-index:1}
.gcell{border:1px dashed #dde3f0}
#phi{position:absolute;background:rgba(80,104,232,.13);border:2px solid var(--blue);
     border-radius:3px;pointer-events:none;z-index:8;display:none}

/* ── BLOQUES ─────────────────────────────────────────────────── */
.gblock{position:absolute;border-radius:3px;overflow:hidden;transition:box-shadow .13s;
        cursor:move;display:flex;flex-direction:column;z-index:10}
.gblock:hover{box-shadow:0 2px 14px rgba(80,104,232,.22)}
.gblock.sel{box-shadow:0 0 0 2.5px var(--blue),0 4px 18px rgba(80,104,232,.28)!important}
.bh{display:flex;align-items:center;gap:5px;padding:3px 7px;font-size:10px;font-weight:700;
    letter-spacing:.4px;text-transform:uppercase;cursor:move;user-select:none;flex-shrink:0;line-height:1.8}
.bdel{margin-left:auto;cursor:pointer;opacity:.55;padding:1px 4px;border-radius:3px;font-size:11px}
.bdel:hover{opacity:1;background:rgba(0,0,0,.18)}
.bmedia{cursor:pointer;opacity:.6;padding:1px 4px;border-radius:3px;font-size:11px;margin-left:2px}
.bmedia:hover{opacity:1;background:rgba(0,0,0,.14)}
.bcnt{flex:1;overflow:hidden;padding:5px 9px;font-size:12px;line-height:1.5;word-break:break-word}
.brsz{position:absolute;bottom:0;right:0;width:13px;height:13px;cursor:se-resize;
      background:rgba(0,0,0,.18);border-radius:3px 0 0 0;display:flex;align-items:center;
      justify-content:center;font-size:9px;color:rgba(255,255,255,.8);z-index:12}
.bt-header{background:#12122a;color:#fff}.bt-header .bh{background:#0a0a1a}.bt-header .bcnt{color:#c0c8e8;font-size:20px;font-weight:700}
.bt-nav{background:#1e293b;color:#fff}.bt-nav .bh{background:#0f172a}.bt-nav .bcnt{color:#94a3b8;font-size:12px;display:flex;align-items:center;gap:16px}
.bt-content{background:#fff;border:1.5px solid var(--border)}.bt-content .bh{background:var(--bg2);color:#334155;border-bottom:1px solid var(--border)}.bt-content .bcnt{color:#64748b;font-size:11px;font-style:italic}
.bt-sidebar{background:var(--bg2);border:1.5px solid var(--border)}.bt-sidebar .bh{background:#f1f5f9;color:#475569;border-bottom:1px solid var(--border)}.bt-sidebar .bcnt{color:#64748b}
.bt-image{background:#f9fafb;border:1.5px dashed #cbd5e1}.bt-image .bh{background:#f1f5f9;color:#64748b;border-bottom:1px dashed #cbd5e1}.bt-image .bcnt{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#cbd5e1}
.bt-image .bcnt img{width:100%;height:100%;object-fit:cover;border-radius:0}
.bt-text{background:#fff;border:1.5px solid var(--border)}.bt-text .bh{background:#f0f9ff;color:#0369a1;border-bottom:1px solid #bae6fd}.bt-text .bcnt{color:#334155}
.bt-pullquote{background:#eff6ff;border:1.5px solid #bfdbfe}.bt-pullquote .bh{background:#dbeafe;color:#1d4ed8;border-bottom:1px solid #bfdbfe}.bt-pullquote .bcnt{font-style:italic;color:#1e40af;font-size:13px}
.bt-footer{background:#1e293b;color:#fff}.bt-footer .bh{background:#0f172a}.bt-footer .bcnt{color:#64748b}
.bt-separator{background:transparent;border:1.5px dashed var(--border)}.bt-separator .bh{background:var(--bg2);color:var(--muted);border-bottom:1px solid var(--border)}.bt-separator .bcnt{display:flex;align-items:center}.bt-separator .bcnt::after{content:'';flex:1;height:2px;background:#e2e8f0;border-radius:1px}
.bt-ad{background:#fffbeb;border:1.5px dashed #fde68a}.bt-ad .bh{background:#fef3c7;color:#92400e;border-bottom:1px dashed #fde68a}.bt-ad .bcnt{display:flex;align-items:center;justify-content:center;color:#d97706;font-size:11px;font-weight:600;text-align:center}

/* ── PROPS PANEL ─────────────────────────────────────────────── */
#props{position:fixed;right:0;bottom:0;width:210px;background:#fff;
       border-top:1px solid var(--border);border-left:1px solid var(--border);
       padding:10px 12px;font-size:12px;z-index:300;display:none;
       border-radius:8px 0 0 0;box-shadow:-2px -2px 12px rgba(0,0,0,.06)}
#props.vis{display:block}
#props h4{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:9px}
.pr{display:flex;align-items:center;gap:6px;margin-bottom:7px}
.pl{width:55px;color:#64748b;flex-shrink:0;font-size:11px}
.pi{flex:1;border:1px solid var(--border);border-radius:4px;padding:3px 6px;
    font-size:11px;outline:none;font-family:inherit}
.pi:focus{border-color:var(--blue)}

/* ── ORGANIZAR TAB ───────────────────────────────────────────── */
.org-layout{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}
.org-subtabs{display:flex;padding:0 16px;background:#fff;border-bottom:1px solid var(--border);flex-shrink:0}
.org-tab{padding:11px 16px;border:none;background:transparent;color:#64748b;font-size:13px;
         font-weight:500;cursor:pointer;border-bottom:2px solid transparent;
         transition:all .13s;margin-bottom:-1px;font-family:inherit}
.org-tab:hover{color:var(--blue)}
.org-tab.on{color:var(--blue);border-bottom-color:var(--blue)}
.org-content{flex:1;overflow:hidden;display:flex;min-height:0}
.org-panel{display:none;flex:1;overflow-y:auto;padding:20px 24px}
.org-panel.on{display:block}
.org-footer{padding:12px 20px;border-top:1px solid var(--border);
            background:var(--bg2);display:flex;gap:8px;align-items:center;flex-shrink:0}
.dtab-hint{font-size:12px;color:#64748b;margin-bottom:16px;padding:10px 13px;
           background:var(--bg2);border-radius:6px;line-height:1.6;border:1px solid var(--border)}

/* Páginas estáticas */
.pages-layout{display:grid;grid-template-columns:240px 1fr;height:100%;overflow:hidden}
.pages-sidebar{border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;background:#fff}
.pages-sidebar-head{padding:10px 12px;border-bottom:1px solid var(--border);
                    display:flex;align-items:center;justify-content:space-between;
                    flex-shrink:0;background:var(--bg2)}
.pages-sidebar-lbl{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
#pages-list-inner{flex:1;overflow-y:auto}
.page-item{display:flex;align-items:center;gap:8px;padding:9px 14px;cursor:pointer;
           border-bottom:1px solid #f8fafc;transition:background .1s}
.page-item:hover{background:#f8faff}
.page-item.sel{background:#eff3ff;border-left:3px solid var(--blue)}
.page-item-t{font-size:12px;font-weight:600;color:#0f172a;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.page-item-s{font-size:10px;color:var(--muted);font-family:monospace}
.page-editor{padding:20px 24px;overflow-y:auto;display:flex;flex-direction:column;gap:12px;background:#fff}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.3px}
.form-input{border:1px solid var(--border);border-radius:6px;padding:8px 11px;font-size:13px;
            outline:none;font-family:inherit;background:#fff;transition:border .15s}
.form-input:focus{border-color:var(--blue)}
.form-textarea{min-height:220px;resize:vertical;line-height:1.7}

/* Nav/Anuncios */
.ni-row{display:flex;align-items:center;gap:5px;padding:6px 0;border-bottom:1px solid #f8fafc;flex-wrap:wrap}
.ni-label{width:130px!important;flex-shrink:0}
.ni-target{flex:1;min-width:80px}
.sinp{border:1px solid var(--border);border-radius:5px;padding:6px 9px;font-size:13px;
      outline:none;font-family:inherit;background:#fff}
.sinp:focus{border-color:var(--blue)}
.az-zone{border:1px solid var(--border);border-radius:8px;padding:13px 16px;margin-bottom:10px;background:var(--bg2)}
.az-head{display:flex;align-items:center;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.az-label{flex:1;min-width:120px}
.az-code{width:100%;font-family:monospace;font-size:12px;resize:vertical;
         border:1px solid var(--border);border-radius:5px;padding:7px 9px;outline:none;color:#334155}
.az-code:focus{border-color:var(--blue)}
.srow{display:flex;gap:8px;margin-bottom:10px;align-items:center}
.slbl{width:120px;font-size:12px;color:#64748b;flex-shrink:0}
.token-display{font-size:11px;background:#f1f5f9;border-radius:5px;padding:7px 9px;flex:1;
               word-break:break-all;color:#64748b;cursor:pointer;user-select:all}

/* Etiquetas */
.tags-grid{display:flex;flex-wrap:wrap;gap:8px}
.tag-pill{display:inline-flex;align-items:center;gap:6px;background:#fff;
          border:1px solid var(--border);border-radius:20px;padding:5px 13px;
          font-size:12px;color:#334155;cursor:pointer;transition:all .13s}
.tag-pill:hover{border-color:var(--blue);background:#f0f3ff;color:var(--blue)}
.tag-count{background:var(--blue);color:#fff;border-radius:10px;padding:1px 7px;font-size:10px;font-weight:700}

/* ── MODELAR TAB ─────────────────────────────────────────────── */
.mod-layout{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}
.mod-subtabs{display:flex;padding:0 16px;background:#fff;border-bottom:1px solid var(--border);flex-shrink:0}
.mod-tab{padding:11px 16px;border:none;background:transparent;color:#64748b;font-size:13px;
         font-weight:500;cursor:pointer;border-bottom:2px solid transparent;
         transition:all .13s;margin-bottom:-1px;font-family:inherit}
.mod-tab:hover{color:var(--blue)}
.mod-tab.on{color:var(--blue);border-bottom-color:var(--blue)}
.mod-content{flex:1;overflow-y:auto;padding:20px 24px}
.mod-panel{display:none}
.mod-panel.on{display:block}
.mod-footer{padding:12px 20px;border-top:1px solid var(--border);
            background:var(--bg2);display:flex;gap:8px;align-items:center;flex-shrink:0}
.hf-preview{display:flex;width:100%;min-height:52px;border:1px solid var(--border);
            border-radius:6px;overflow:hidden;margin-bottom:14px;background:var(--bg2)}
.hfp-blk{min-height:52px;display:flex;align-items:center;justify-content:center;
          font-size:11px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;
          padding:4px 10px;flex-shrink:0}
.hfb-row{display:flex;align-items:flex-start;gap:7px;padding:10px 0;border-bottom:1px solid #f8fafc}
.hfb-btns{display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.hf-palette{display:flex;gap:5px;flex-wrap:wrap;padding:12px 0 2px;
            border-top:1px solid #f1f5f9;margin-top:10px;align-items:center}
.hf-pal-lbl{font-size:10px;color:var(--muted);font-weight:700;text-transform:uppercase;margin-right:2px}

/* ── MEDIOS TAB ──────────────────────────────────────────────── */
.medios-layout{display:flex;flex-direction:column;flex:1;overflow:hidden;min-height:0}
.medios-toolbar{display:flex;align-items:center;gap:12px;padding:8px 16px;
                background:#fff;border-bottom:1px solid var(--border);flex-shrink:0}
#medios-filter-tabs{display:flex;gap:4px}
.mmtab{padding:5px 12px;border:1px solid transparent;border-radius:5px;cursor:pointer;
       font-size:12px;font-weight:500;color:#64748b;background:transparent;transition:all .13s;font-family:inherit}
.mmtab:hover{color:var(--blue)}
.mmtab.on{color:var(--blue);background:#eff3ff;border-color:#c7d2fe}
.medios-drop-zone{border:2px dashed #e2e8f0;padding:10px 20px;text-align:center;
                  background:var(--bg2);transition:all .15s;flex-shrink:0;
                  display:flex;align-items:center;justify-content:center;gap:10px;
                  font-size:13px;color:var(--muted)}
.medios-drop-zone.drag{border-color:var(--blue);background:#f0f3ff;color:var(--blue)}
.medios-main{display:flex;flex:1;overflow:hidden;min-height:0}
.medios-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
             gap:12px;padding:16px;flex:1;overflow-y:auto;align-content:start}
.medios-item{border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer;
             transition:all .13s;background:var(--bg2);position:relative}
.medios-item:hover{border-color:var(--blue)}
.medios-item.sel{border-color:var(--blue);box-shadow:0 0 0 3px rgba(80,104,232,.15)}
.medios-thumb{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.medios-icon{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
             font-size:42px;background:#f1f5f9}
.medios-name{font-size:10px;color:#64748b;padding:5px 7px;background:#fff;
             white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.medios-del{position:absolute;top:5px;right:5px;background:rgba(0,0,0,.55);color:#fff;
            border:none;border-radius:4px;width:22px;height:22px;cursor:pointer;
            font-size:12px;display:none;align-items:center;justify-content:center;line-height:1}
.medios-item:hover .medios-del{display:flex}
.medios-detail{width:220px;flex-shrink:0;border-left:1px solid var(--border);
               padding:16px;background:#fff;overflow-y:auto;
               display:flex;flex-direction:column;align-items:center;text-align:center}
.medios-detail-empty{color:var(--muted);font-size:13px;padding:40px 0;line-height:1.6}
#medios-preview{max-width:100%;max-height:140px;object-fit:contain;border-radius:6px;margin-bottom:10px}

/* ── PUBLICAR TAB ────────────────────────────────────────────── */
.pub-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:900px}
@media(max-width:700px){.pub-layout{grid-template-columns:1fr}}
.pub-section{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:16px}
.pub-section h3{font-size:14px;font-weight:700;color:#334155;margin-bottom:8px;display:flex;align-items:center;gap:6px}
.pub-section p{font-size:13px;color:#64748b;margin-bottom:12px;line-height:1.6}
.gen-result{border-radius:6px;padding:10px 12px;font-size:12px;margin-top:8px;display:none;line-height:1.5}
.gen-result.vis{display:block}
.gen-result:not(.err){background:#f0fdf4;border:1px solid #bbf7d0;color:#166534}
.gen-result.err{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}
#gen-list{margin-top:6px;max-height:120px;overflow-y:auto}
#gen-list code{display:block;font-size:11px;margin-bottom:2px;background:#dcfce7;padding:2px 6px;border-radius:3px}

/* ── AJUSTES TAB ─────────────────────────────────────────────── */
.ajustes-layout{max-width:560px}
.aj-section{background:#fff;border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:16px}
.aj-section h3{font-size:14px;font-weight:700;color:#334155;margin-bottom:14px;
               padding-bottom:10px;border-bottom:1px solid #f1f5f9}

/* ── MEDIA MODAL ─────────────────────────────────────────────── */
.mov{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:500;display:none;
     align-items:flex-start;justify-content:center;padding-top:40px;overflow-y:auto}
.mov.vis{display:flex}
.modal{background:#fff;border-radius:12px;padding:24px;width:100%;max-width:640px;
       box-shadow:0 20px 60px rgba(0,0,0,.25);margin-bottom:40px}
.modal.wide{max-width:860px}
.modal h2{font-size:17px;margin-bottom:14px;color:#0f172a}
.mclose{float:right;cursor:pointer;color:var(--muted);font-size:20px;line-height:1;margin-left:12px}
.mclose:hover{color:#ef4444}
#upload-zone{border:2px dashed var(--border);border-radius:10px;padding:26px;text-align:center;
             cursor:pointer;transition:all .15s;margin-bottom:16px;background:var(--bg2)}
#upload-zone:hover,#upload-zone.drag{border-color:var(--blue);background:#f0f3ff}
.uz-ic{font-size:32px;margin-bottom:8px}
#upload-zone p{font-size:13px;color:#64748b}
#upload-zone small{font-size:11px;color:var(--muted)}
#upload-file-input{display:none}
.upload-progress{background:#f1f5f9;border-radius:6px;height:4px;margin-top:8px;overflow:hidden;display:none}
.upload-bar{height:100%;background:var(--blue);width:0;transition:width .3s;border-radius:6px}
#media-tabs{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid var(--border);padding-bottom:0}
.mtab{padding:7px 14px;border-radius:6px 6px 0 0;border:1px solid transparent;border-bottom:none;
      cursor:pointer;font-size:13px;font-weight:500;color:#64748b;background:transparent;
      transition:all .13s;margin-bottom:-1px;font-family:inherit}
.mtab:hover{color:var(--blue);background:#f8faff}
.mtab.on{color:var(--blue);background:#fff;border-color:var(--border);border-bottom-color:#fff}
#media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;max-height:360px;overflow-y:auto}
.mitem{border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;transition:all .13s;background:var(--bg2);position:relative}
.mitem:hover{border-color:var(--blue)}
.mitem.sel{border-color:var(--blue);box-shadow:0 0 0 3px rgba(80,104,232,.15)}
.mitem-thumb{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#f1f5f9}
.mitem-icon{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:36px;background:#f1f5f9}
.mitem-name{font-size:10px;color:#64748b;padding:4px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#fff}
.mitem-del{position:absolute;top:4px;right:4px;background:rgba(0,0,0,.5);color:#fff;border:none;
           border-radius:4px;width:20px;height:20px;cursor:pointer;font-size:11px;
           display:none;align-items:center;justify-content:center;line-height:1}
.mitem:hover .mitem-del{display:flex}
#media-actions{display:flex;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid #f1f5f9;align-items:center}
#media-info{font-size:12px;color:#64748b;flex:1}
.media-empty{text-align:center;padding:32px;color:var(--muted);font-size:13px}

/* ── TOAST & SPINNER ─────────────────────────────────────────── */
#toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#12122a;
       color:#e2e8ff;padding:9px 18px;border-radius:8px;font-size:12px;z-index:9999;
       opacity:0;transition:opacity .25s;pointer-events:none;white-space:nowrap}
#toast.show{opacity:1}
.spin{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.3);
      border-top-color:#fff;border-radius:50%;animation:sp .6s linear infinite;
      vertical-align:middle;margin-right:4px}
@keyframes sp{to{transform:rotate(360deg)}}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:3px}

/* ── GRID BLOCKS ─────────────────────────────────────────────── */
#govl{position:absolute;inset:0;pointer-events:none;z-index:2}
.gblock{pointer-events:all;user-select:none}

/* ── MEDIOS DETAIL ────────────────────────────────────────────── */
#medios-preview{max-width:100%;max-height:140px;object-fit:contain;border-radius:6px;display:block;margin:0 auto}

/* ── NAV/AD ROWS ─────────────────────────────────────────────── */
.nav-item-row,.ad-zone-row{display:flex;align-items:center;gap:6px;padding:6px 0;
  border-bottom:1px solid #f8fafc;flex-wrap:wrap}

/* ── PAGES EDITOR ────────────────────────────────────────────── */
.page-ed-inner{padding:16px;display:flex;flex-direction:column;gap:12px;height:100%;overflow-y:auto}
.page-fields{display:flex;flex-direction:column;gap:8px}

/* ── GEN FILE LISTING ─────────────────────────────────────────── */
.gen-file{font-family:monospace;font-size:11px;padding:2px 6px;background:#dcfce7;
          border-radius:3px;margin-bottom:2px;color:#166534}

/* ── MEDIOS DROP PROGRESS ─────────────────────────────────────── */
#medios-progress{background:#f1f5f9;border-radius:6px;height:4px;margin-top:6px;
                 overflow:hidden;display:none;width:100%}

/* ── DASHBOARD BACKUP SECTION ─────────────────────────────────── */
.dash-backup-section{}
.dash-backup-head{display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-bottom:12px}
.dash-backup-head h3{margin:0;font-size:14px;font-weight:700;color:var(--ink)}
.backup-header-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.backup-list{display:flex;flex-direction:column;gap:4px;max-height:220px;overflow-y:auto}
.backup-row{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:6px;
  background:#f8fafc;border:1px solid #f1f5f9}
.backup-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.backup-name{font-size:12px;font-weight:600;color:#334155;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.backup-meta{font-size:11px;color:#94a3b8}
.backup-actions{display:flex;gap:4px;flex-shrink:0}

/* ── PUBLICAR v2 (layout con preview) ────────────────────────── */
#tab-publicar{overflow:hidden}
.pub-v2-layout{display:flex;height:100%;overflow:hidden}
.pub-v2-controls{width:300px;flex-shrink:0;padding:20px;overflow-y:auto;
  border-right:1px solid var(--border);display:flex;flex-direction:column;gap:0}
.pub-v2-preview{flex:1;display:flex;flex-direction:column;overflow:hidden;
  background:#e8ecf0;min-width:0}
.preview-bar{display:flex;align-items:center;gap:4px;padding:6px 8px;
  background:#1e293b;border-bottom:1px solid #334155;flex-shrink:0}
.preview-nav-btn{background:#334155;color:#cbd5e1;border:none;border-radius:4px;
  padding:4px 8px;font-size:13px;cursor:pointer;line-height:1;text-decoration:none;
  display:inline-flex;align-items:center;transition:background .15s}
.preview-nav-btn:hover{background:#475569;color:#fff}
.preview-url-input{flex:1;background:#0f172a;border:1px solid #334155;color:#94a3b8;
  font-size:11px;font-family:monospace;padding:4px 8px;border-radius:4px;min-width:0}
.preview-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:#64748b;text-align:center;padding:40px}
.preview-iframe{flex:1;width:100%;border:none;background:#fff}

/* ── GESTOR DE TEMAS (Modelar > Temas) ───────────────────────── */
.theme-toolbar{display:flex;align-items:center;gap:10px;padding:16px 20px 0;flex-wrap:wrap}
.theme-btn-new,.theme-btn-upload,.theme-btn-help{
  font-size:12px;font-weight:700;padding:6px 14px;border-radius:7px;
  cursor:pointer;border:none;text-decoration:none;display:inline-flex;align-items:center;gap:5px;
  transition:background .15s}
.theme-btn-new{background:#5068e8;color:#fff}
.theme-btn-new:hover{background:#3d55d6}
.theme-btn-upload{background:#f1f5f9;color:#334155;border:1px solid #e2e8f0}
.theme-btn-upload:hover{background:#e8edf5}
.theme-btn-help{background:transparent;color:#64748b;border:1px solid #e2e8f0;font-size:11px}
.theme-btn-help:hover{color:#5068e8;border-color:#5068e8}
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:16px;padding:16px 20px}
.theme-loading{padding:24px;color:#94a3b8;font-size:13px}
.theme-card{border:2px solid var(--border);border-radius:10px;overflow:hidden;
  cursor:pointer;transition:border-color .18s,box-shadow .18s;position:relative;
  background:var(--surface)}
.theme-card:hover{border-color:#5068e8;box-shadow:0 4px 14px rgba(80,104,232,.15)}
.theme-card--active{border-color:#5068e8;box-shadow:0 0 0 3px rgba(80,104,232,.18)}
.theme-swatch{height:100px;display:flex;flex-direction:column;overflow:hidden}
.ts-header{height:32px;flex-shrink:0}
.ts-body{flex:1;padding:8px 10px;display:flex;flex-direction:column;gap:5px;justify-content:center}
.ts-line{height:6px;border-radius:3px;width:80%}
.theme-info{padding:10px 12px 8px}
.theme-name{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:3px}
.theme-desc{font-size:11px;color:#94a3b8;line-height:1.4}
.theme-badge{position:absolute;top:8px;right:8px;background:#5068e8;color:#fff;
  font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;letter-spacing:.3px}
.theme-card-actions{display:flex;gap:5px;padding:0 10px 10px}
.tc-act{font-size:11px;font-weight:600;padding:4px 10px;border-radius:6px;border:none;
  cursor:pointer;transition:background .14s}
.tc-edit{background:#eff6ff;color:#2563eb}.tc-edit:hover{background:#dbeafe}
.tc-del{background:#fef2f2;color:#dc2626}.tc-del:hover{background:#fee2e2}

/* ── EDITOR DE TEMAS ───────────────────────────────────────────── */
.theme-editor{border-top:1px solid var(--border);margin-top:8px;background:var(--bg)}
.te-header{display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;background:var(--surface);border-bottom:1px solid var(--border)}
.te-header span{font-size:14px;font-weight:700;color:var(--ink)}
.te-close{border:none;background:none;font-size:18px;color:#94a3b8;cursor:pointer;
  line-height:1;padding:2px 6px;border-radius:5px}
.te-close:hover{background:#f1f5f9;color:#334155}
.te-body{padding:20px}
.te-section{margin-bottom:16px}
.te-field-row{display:flex;gap:12px}
.te-field{display:flex;flex-direction:column;gap:4px;flex:1}
.te-field label,.te-row label{font-size:12px;font-weight:600;color:#475569;white-space:nowrap}
.te-field input[type=text]{border:1px solid #e2e8f0;border-radius:7px;padding:7px 10px;
  font-size:13px;color:#1e293b;width:100%;outline:none;font-family:inherit}
.te-field input:focus{border-color:#5068e8;box-shadow:0 0 0 2px rgba(80,104,232,.12)}
.te-cols{display:grid;grid-template-columns:280px 1fr;gap:20px;margin-top:16px}
@media(max-width:800px){.te-cols{grid-template-columns:1fr}}
.te-controls{display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:500px;
  padding-right:8px}
.te-section-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;
  color:#94a3b8;margin:10px 0 4px;border-bottom:1px solid var(--border);padding-bottom:4px}
.te-row{display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:var(--surface);border-radius:7px;padding:5px 10px;border:1px solid var(--border)}
.te-row label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.te-row.te-row--select{flex-direction:column;align-items:flex-start;gap:4px}
.te-row.te-row--select select{width:100%;border:1px solid #e2e8f0;border-radius:6px;
  padding:5px 8px;font-size:12px;color:#1e293b;background:#fff;cursor:pointer}
.te-color{width:40px;height:28px;border:1px solid #e2e8f0;border-radius:5px;
  padding:0 2px;cursor:pointer;flex-shrink:0;background:none}
/* Preview del tema */
.te-preview-col{display:flex;flex-direction:column;gap:8px}
.te-preview-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:#94a3b8}
.te-preview{border-radius:10px;overflow:hidden;border:1px solid var(--border);
  background:var(--th-body-bg,#f0f2f5);font-size:12px;min-height:400px;
  box-shadow:var(--th-wrap-shadow,none)}
.tep-header{background:var(--th-header-bg,#12122a);color:var(--th-header-fg,#fff);
  padding:10px 14px;display:flex;align-items:center;justify-content:space-between}
.tep-logo{font-weight:800;font-size:14px;font-family:var(--th-ui-font,system-ui)}
.tep-nav{display:flex;gap:10px}
.tep-nav a{color:var(--th-nav-fg,#94a3b8);font-size:11px;cursor:default;
  font-family:var(--th-ui-font,system-ui)}
.tep-body{padding:14px;background:var(--th-wrap-bg,#fff);margin:10px;border-radius:8px;
  box-shadow:var(--th-wrap-shadow,none)}
.tep-hero{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--th-border,#e2e8f0)}
.tep-tag{display:inline-block;background:var(--th-tag-bg,#f1f5f9);color:var(--th-tag-fg,#64748b);
  font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
  padding:2px 8px;border-radius:10px;margin-bottom:5px}
.tep-title{font-family:var(--th-body-font,Georgia,serif);font-size:16px;font-weight:700;
  color:var(--th-heading,#0f172a);line-height:1.3;margin-bottom:4px}
.tep-meta{font-size:10px;color:var(--th-muted,#94a3b8)}
.tep-p{font-family:var(--th-body-font,Georgia,serif);font-size:12px;
  color:var(--th-text,#334155);line-height:1.6;margin-bottom:8px}
.tep-pullquote{border-left:3px solid var(--th-pullquote-border,#3b82f6);
  background:var(--th-pullquote-bg,#eff6ff);color:var(--th-pullquote-fg,#1d4ed8);
  padding:8px 12px;margin:10px 0;font-style:italic;font-size:12px;border-radius:0 6px 6px 0;
  font-family:var(--th-body-font,Georgia,serif)}
.tep-img-wrap{margin:8px 0}
.tep-img{height:60px;background:var(--th-accent,#5068e8);opacity:.15;
  border-radius:var(--th-img-radius,4px);box-shadow:var(--th-img-shadow,none);
  max-width:var(--th-img-max-width,100%)}
.tep-caption{font-size:10px;color:var(--th-muted,#94a3b8);text-align:center;margin-top:3px}
.tep-cards{display:flex;gap:8px;margin-top:12px}
.tep-card{flex:1;background:var(--th-card-bg,#fff);border:1px solid var(--th-card-border,#e2e8f0);
  border-radius:7px;padding:8px 10px}
.tep-card-tag{font-size:9px;font-weight:700;color:var(--th-accent,#5068e8);margin-bottom:3px;
  text-transform:uppercase;letter-spacing:.4px}
.tep-card-title{font-size:11px;color:var(--th-heading,#0f172a);font-weight:600;line-height:1.3;
  font-family:var(--th-body-font,Georgia,serif)}
.tep-footer{background:var(--th-footer-bg,#1e293b);color:var(--th-footer-fg,#64748b);
  padding:10px 14px;font-size:10px;text-align:center;margin-top:10px;border-top:1px solid rgba(255,255,255,.05)}
/* Acciones del editor */
.te-actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.te-save,.te-export,.te-delete{padding:9px 18px;border:none;border-radius:8px;font-size:13px;
  font-weight:700;cursor:pointer;transition:background .15s}
.te-save{background:#5068e8;color:#fff}.te-save:hover{background:#3d55d6}
.te-export{background:#f1f5f9;color:#334155;border:1px solid #e2e8f0}.te-export:hover{background:#e2e8f0}
.te-delete{background:#fef2f2;color:#dc2626;border:1px solid #fecaca;margin-left:auto}
.te-delete:hover{background:#fee2e2}

/* ── IDIOMA DE CONTENIDO (Ajustes) ───────────────────────────── */
.lang-check-group{display:flex;flex-direction:column;gap:8px;padding:4px 0}
.lang-check{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;
  padding:6px 10px;border-radius:6px;border:1px solid var(--border);background:var(--surface);
  transition:border-color .15s}
.lang-check:hover{border-color:#5068e8}
.lang-check input[type=checkbox]{width:15px;height:15px;accent-color:#5068e8;cursor:pointer;flex-shrink:0}
.lang-primary-badge{font-size:10px;font-weight:700;background:#5068e8;color:#fff;
  padding:1px 7px;border-radius:10px;letter-spacing:.3px;margin-left:4px}

/* ── Organizar v2 ─────────────────────────────────────────── */
.org2-layout {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 20px 80px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.org2-section {
  padding: 28px 0;
}
.org2-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
}
.org2-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}
.org2-hint {
  font-size: 12px;
  color: #94a3b8;
}
.org2-divider {
  height: 1px;
  background: #e2e8f0;
}
.org2-save-bar {
  position: sticky;
  bottom: 0;
  background: #fff;
  border-top: 1px solid #e2e8f0;
  padding: 14px 0;
  display: flex;
  align-items: center;
  gap: 12px;
  z-index: 10;
}

/* ── Homepage type cards ──────────────────────────────────── */
.hp-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 16px;
}
.hp-card {
  border: 2px solid #e2e8f0;
  border-radius: 10px;
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
  background: #fff;
}
.hp-card:hover { border-color: #5068e8; box-shadow: 0 4px 16px rgba(80,104,232,.12); }
.hp-card--active { border-color: #5068e8; background: #eff6ff; box-shadow: 0 4px 16px rgba(80,104,232,.15); }
.hp-card-thumb svg { width: 100%; height: auto; display: block; border-radius: 5px; }
.hp-card-label { font-size: 13px; font-weight: 700; color: #0f172a; margin-top: 10px; }
.hp-card-desc  { font-size: 11px; color: #64748b; margin-top: 3px; line-height: 1.4; }
.hp-sub-selector {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  font-size: 13px;
  font-weight: 600;
}
.hp-sub-selector select { flex: 1; max-width: 280px; }

/* ── Portadas grid ────────────────────────────────────────── */
.portadas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}
.portada-card {
  border: 2px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  transition: border-color .15s;
}
.portada-card--active { border-color: #5068e8; }
.portada-thumb { background: #f8fafc; padding: 10px; }
.portada-thumb svg { width: 100%; height: auto; display: block; }
.portada-info {
  padding: 10px 12px 6px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.portada-name { font-size: 13px; font-weight: 700; color: #0f172a; flex: 1; }
.portada-badge { font-size: 10px; color: #5068e8; font-weight: 700; }
.portada-actions {
  padding: 0 12px 12px;
  display: flex;
  gap: 6px;
}

/* ── Section templates ────────────────────────────────────── */
.section-tpl-grid { display: flex; flex-direction: column; gap: 10px; }
.st-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}
.st-icon { font-size: 20px; flex-shrink: 0; }
.st-info { flex: 1; min-width: 0; }
.st-name { font-size: 13px; font-weight: 600; color: #0f172a; }
.st-desc { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.st-select { width: 220px; flex-shrink: 0; }

/* ── Block assignment ─────────────────────────────────────── */
.ba-context-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.ba-ctx-btn {
  padding: 6px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  background: #f8fafc;
  font-size: 13px;
  cursor: pointer;
  font-weight: 500;
  transition: all .15s;
}
.ba-ctx-btn.on {
  background: #5068e8;
  color: #fff;
  border-color: #5068e8;
}
.block-assignment-panel {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  overflow: hidden;
}
.ba-layout-name {
  padding: 10px 14px;
  font-size: 12px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  color: #64748b;
}
.ba-blocks { padding: 8px; }
.ba-block-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 6px;
  margin-bottom: 4px;
  background: #fff;
  border: 1px solid #f1f5f9;
}
.ba-block-type {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  width: 100px;
  flex-shrink: 0;
}
.ba-type-sel { width: 160px; flex-shrink: 0; }
.ba-ref-wrap { flex: 1; min-width: 0; }

/* ── Nav list enhanced ────────────────────────────────────── */
.ni-row { flex-wrap: nowrap; }

/* ══════════════════════════════════════════════════════════════
   MAQUETAR — Selector de tipo de página y plantillas guardadas
   ══════════════════════════════════════════════════════════════ */

/* Step labels */
.maq-step-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: #64748b;
  padding: 8px 14px 4px;
}

/* ── Type picker ──────────────────────────────────────────── */
#maq-type-picker-wrap {
  background: #fff;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.maq-type-picker {
  display: flex;
  gap: 8px;
  padding: 6px 14px 10px;
  flex-wrap: wrap;
}
.maq-type-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  border: 2px solid var(--border);
  border-radius: 8px;
  background: var(--bg2);
  cursor: pointer;
  transition: all .14s;
  min-width: 72px;
  text-align: center;
}
.maq-type-card:hover {
  border-color: var(--blue);
  background: #f0f3ff;
}
.maq-type-card.active {
  border-color: var(--blue);
  background: #eff3ff;
  box-shadow: 0 0 0 3px rgba(80,104,232,.12);
}
.maq-type-ic {
  font-size: 20px;
  line-height: 1;
}
.maq-type-name {
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
}
.maq-type-card.active .maq-type-name {
  color: var(--blue);
}

/* ── Saved layouts browser ────────────────────────────────── */
#maq-saved-wrap {
  background: #f8fafc;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.maq-saved-layouts {
  display: flex;
  gap: 8px;
  padding: 4px 14px 8px;
  flex-wrap: wrap;
  min-height: 46px;
  align-items: center;
}
.maq-saved-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border: 2px solid var(--border);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
  color: #334155;
  transition: all .13s;
  max-width: 220px;
}
.maq-saved-card:hover {
  border-color: var(--blue);
  background: #f0f3ff;
  color: var(--blue);
}
.maq-saved-card--active {
  border-color: var(--blue);
  background: #eff3ff;
  color: var(--blue);
  font-weight: 600;
}
.maq-saved-thumb {
  width: 36px;
  height: 28px;
  background: #e8ebf0;
  border-radius: 3px;
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}
.maq-saved-info {
  flex: 1;
  min-width: 0;
}
.maq-saved-name {
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.maq-saved-badge {
  font-size: 10px;
  color: #5068e8;
  background: #e0e7ff;
  border-radius: 8px;
  padding: 1px 6px;
  font-weight: 700;
  white-space: nowrap;
}
.maq-saved-del {
  color: #ef4444;
  cursor: pointer;
  padding: 2px 4px;
  border-radius: 4px;
  font-size: 13px;
  opacity: 0;
  transition: opacity .1s;
  flex-shrink: 0;
}
.maq-saved-card:hover .maq-saved-del {
  opacity: 1;
}
.maq-saved-count-badge {
  font-size: 10px;
  font-weight: 700;
  background: var(--blue);
  color: #fff;
  border-radius: 10px;
  padding: 1px 7px;
  margin-left: 4px;
  vertical-align: middle;
  display: none;
}
.maq-saved-count-badge.vis {
  display: inline;
}
.maq-no-saved {
  font-size: 12px;
  color: var(--muted);
  font-style: italic;
  padding: 4px 0;
}
.maq-or {
  padding: 4px 14px 8px;
  font-size: 11px;
  color: #94a3b8;
  text-align: center;
}

/* ── HF preview strips in Maquetar ───────────────────────── */
.maq-hint-hf {
  cursor: default;
  pointer-events: none;
  font-style: italic;
}
.maq-hint-hf::before {
  content: '⚓ ';
  font-style: normal;
  font-size: 10px;
}

/* ══════════════════════════════════════════════════════════════
   MODELAR — HF block rows (expanded branding fields)
   ══════════════════════════════════════════════════════════════ */

/* Container row for a header/footer block */
.hfb-row--brand {
  background: #f8fafc;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 10px;
  overflow: hidden;
}

/* Row head (title + controls) */
.hfb-row-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: #f1f5f9;
  border-bottom: 1px solid var(--border);
}
.hfb-icon { font-size: 15px; flex-shrink: 0; }
.hfb-label {
  font-size: 12px;
  font-weight: 700;
  color: #334155;
  flex: 1;
  letter-spacing: .2px;
}
.hfb-nav-hint {
  font-size: 11px;
  color: #94a3b8;
  font-style: italic;
  padding: 10px 14px;
}

/* Brand fields grid */
.hfb-brand-fields {
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.hfb-brand-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.hfb-lbl {
  width: 100px;
  font-size: 11px;
  color: #64748b;
  flex-shrink: 0;
  font-weight: 500;
}
.hfb-inp {
  flex: 1;
  border: 1px solid var(--border);
  border-radius: 5px;
  padding: 5px 8px;
  font-size: 12px;
  font-family: inherit;
  outline: none;
  background: #fff;
  transition: border-color .14s;
}
.hfb-inp:focus {
  border-color: var(--blue);
}
.hfb-logo-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.hfb-logo-preview {
  width: 36px;
  height: 36px;
  object-fit: contain;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: #f8fafc;
  flex-shrink: 0;
  display: none;
}
.hfb-logo-preview.vis {
  display: block;
}
.hfb-toggle-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.hfb-toggle-row input[type=checkbox] {
  accent-color: var(--blue);
  width: 15px;
  height: 15px;
  cursor: pointer;
}
.hfb-toggle-lbl {
  font-size: 12px;
  color: #475569;
  cursor: pointer;
}

/* ══════════════════════════════════════════════════════════════
   AJUSTES — Acerca de
   ══════════════════════════════════════════════════════════════ */
.aj-about {}
.about-card {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.about-logo {
  font-size: 22px;
  font-weight: 800;
  color: #5068e8;
}
.about-logo span { color: #94a3b8; }
.about-version {
  font-size: 12px;
  font-weight: 700;
  background: #eff3ff;
  color: #5068e8;
  border: 1px solid #c7d2fe;
  border-radius: 20px;
  padding: 3px 11px;
  letter-spacing: .3px;
}
.about-desc {
  font-size: 13px;
  color: #64748b;
  line-height: 1.6;
  margin-bottom: 16px;
}
.about-meta {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  font-size: 12px;
}
.about-meta-row {
  display: flex;
  gap: 0;
  border-bottom: 1px solid #f1f5f9;
}
.about-meta-row:last-child { border-bottom: none; }
.about-meta-lbl {
  width: 100px;
  flex-shrink: 0;
  padding: 9px 12px;
  background: #f8fafc;
  color: #64748b;
  font-weight: 600;
  border-right: 1px solid var(--border);
}
.about-meta-val {
  padding: 9px 12px;
  color: #334155;
  line-height: 1.6;
  flex: 1;
}

/* ── ACCESO EN EDITOR ───────────────────────────────────────── */
.meta-access-sel { min-width: 130px; }
#meta-bar select.meta-access-sel {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}
#meta-bar select.meta-access-sel option[value="public"] { background:#fff }
#meta-bar select.meta-access-sel option[value="members"]{ background:#e0f2fe }
#meta-bar select.meta-access-sel option[value="subscriber"]{ background:#ede9fe }
#meta-bar select.meta-access-sel option[value="premium"]{ background:#fef9c3 }

/* ── USUARIOS DEL PANEL Y LECTORES ─────────────────────────── */
.usr-layout {
  max-width: 960px;
  margin: 0 auto;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.usr-section {
  background: #fff;
  border-radius: 12px;
  border: 1px solid var(--border);
  padding: 24px;
}
.usr-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.usr-title {
  font-size: 16px;
  font-weight: 700;
  color: #12122a;
  margin-bottom: 4px;
}
.usr-hint {
  font-size: 12px;
  color: #64748b;
  max-width: 540px;
}
.usr-roles-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
  padding: 12px;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px solid var(--border);
}
.url-role-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #475569;
}
/* Role badges */
.usr-role-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.role-admin      { background: #fef3c7; color: #92400e; }
.role-editor     { background: #dbeafe; color: #1e40af; }
.role-escritor   { background: #dcfce7; color: #15803d; }
.role-maquetador { background: #fae8ff; color: #7e22ce; }
.role-publicista { background: #fee2e2; color: #991b1b; }
/* Reader tier badges */
.rdr-tier-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.rdr-tier-free       { background: #e0f2fe; color: #0369a1; }
.rdr-tier-subscriber { background: #ede9fe; color: #6d28d9; }
.rdr-tier-premium    { background: #fef9c3; color: #92400e; }
/* User row */
.usr-list { display: flex; flex-direction: column; gap: 8px; }
.usr-row, .rdr-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #fafafa;
  transition: background .12s;
}
.usr-row:hover, .rdr-row:hover { background: #f1f5f9; }
.rdr-inactive { opacity: .6; }
.usr-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: #3d55d6; color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px; flex-shrink: 0;
}
.rdr-av { background: #0369a1; }
.usr-info { flex: 1; min-width: 0; }
.usr-name {
  font-size: 13px; font-weight: 600; color: #1e293b;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.usr-meta { font-size: 11px; color: #94a3b8; margin-top: 2px; }
.usr-email { color: #475569; }
.usr-role { flex-shrink: 0; }
.usr-actions { display: flex; gap: 6px; flex-shrink: 0; }
.usr-btn {
  padding: 4px 10px; border: 1px solid var(--border); border-radius: 6px;
  font-size: 11px; font-weight: 600; cursor: pointer; background: #fff;
  color: #475569; transition: background .12s, border-color .12s;
}
.usr-btn:hover { background: #f1f5f9; }
.usr-btn-edit:hover { border-color: var(--blue); color: var(--blue); }
.usr-btn-del { color: #dc2626; }
.usr-btn-del:hover { background: #fef2f2; border-color: #fca5a5; }
.usr-empty { font-size: 13px; color: var(--muted); padding: 16px; text-align: center; }
.usr-me-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  background: #dbeafe; color: #1e40af; border-radius: 8px; padding: 1px 6px;
  vertical-align: middle;
}
.usr-inactive-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  background: #f3f4f6; color: #9ca3af; border-radius: 8px; padding: 1px 6px;
  vertical-align: middle;
}
/* Readers filters */
.usr-filters {
  display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px;
}
/* Readers stats */
.rdr-stats-row {
  display: flex; flex-wrap: wrap; gap: 10px;
  margin-bottom: 14px; font-size: 12px;
}
.rdr-stat { color: #475569; }
.tier-free-badge  { color: #0369a1; }
.tier-sub-badge   { color: #6d28d9; }
.tier-prem-badge  { color: #92400e; }
/* Readers paginator */
.rdr-paginator {
  display: flex; align-items: center; gap: 8px; margin-top: 10px;
  font-size: 12px; color: #64748b;
}
.rdr-page-info { flex: 1; }
/* Portal hint */
.rdr-portal-hint {
  margin-top: 14px; font-size: 12px; color: #64748b;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.rdr-portal-link { color: var(--blue); text-decoration: none; font-weight: 600; }
.rdr-portal-link:hover { text-decoration: underline; }

/* ── NIVELES DE ACCESO ──────────────────────────────────────── */
.access-levels-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}
.access-level-card {
  border-radius: 10px;
  padding: 16px;
  border: 1.5px solid transparent;
}
.al-icon { font-size: 22px; margin-bottom: 8px; }
.al-name { font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.al-desc { font-size: 11px; color: #64748b; line-height: 1.5; }
.al-public     { background: #f0fdf4; border-color: #bbf7d0; }
.al-members    { background: #e0f2fe; border-color: #bae6fd; }
.al-subscriber { background: #ede9fe; border-color: #ddd6fe; }
.al-premium    { background: #fef9c3; border-color: #fde68a; }

/* ── MODALES (panel user / reader) ─────────────────────────── */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1200;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.modal-box {
  background: #fff; border-radius: 14px; padding: 28px;
  width: 100%; max-width: 460px; max-height: 90vh; overflow-y: auto;
  box-shadow: 0 24px 80px rgba(0,0,0,.25);
}
.modal-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
}
.modal-head h3 { font-size: 16px; font-weight: 700; color: #12122a; }
.modal-foot {
  display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px;
}
.mf-row { margin-bottom: 12px; }
.mf-lbl { display: block; font-size: 11px; font-weight: 600; color: #64748b; margin-bottom: 5px; text-transform: uppercase; letter-spacing: .3px; }
.mf-err { color: #dc2626; font-size: 12px; background: #fef2f2; border-radius: 6px; padding: 8px 12px; }
.mf-hint { font-size: 11px; color: #64748b; background: #f8fafc; border-radius: 6px; padding: 8px 12px; margin-bottom: 12px; min-height: 28px; }

/* ══════════════════════════════════════════════════════════════
   PAGE BUILDER — Editor UI (admin panel)
   ══════════════════════════════════════════════════════════════ */

/* ── Wrapper del editor ──────────────────────────────────────── */
.pb-editor{display:flex;flex-direction:column;height:100%;overflow:hidden;background:#f8fafc}

/* ── Topbar del constructor ──────────────────────────────────── */
.pb-topbar{display:flex;align-items:center;gap:8px;padding:8px 14px;
           background:#fff;border-bottom:1px solid var(--border);flex-shrink:0}
.pb-tb-title{font-size:13px;font-weight:700;color:#0f172a;flex:1;
             white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pb-tb-actions{display:flex;gap:6px;flex-shrink:0}

/* ── Barra de meta-datos ─────────────────────────────────────── */
.pb-meta-bar{display:flex;align-items:center;gap:8px;padding:8px 14px;
             background:#f0f2f5;border-bottom:1px solid var(--border);
             flex-shrink:0;flex-wrap:wrap}
.pb-meta-lbl{font-size:10px;font-weight:700;text-transform:uppercase;
             letter-spacing:.4px;color:#94a3b8;white-space:nowrap;flex-shrink:0}
.pb-meta-inp{flex:1;min-width:100px;font-size:12px}
.pb-meta-slug{font-family:monospace;max-width:160px}

/* ── Área de secciones ───────────────────────────────────────── */
.pb-sections{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}

/* ── Botón "Nueva sección" ───────────────────────────────────── */
.pb-add-sec-wrap{padding:10px 16px 16px;flex-shrink:0}
.pb-add-sec-btn{width:100%;padding:10px;border:2px dashed #cbd5e1;border-radius:10px;
                background:transparent;color:#94a3b8;font-size:13px;font-weight:600;
                cursor:pointer;transition:all .15s;font-family:inherit}
.pb-add-sec-btn:hover{border-color:var(--blue);color:var(--blue);background:#f0f3ff}

/* ── Tarjeta de sección ──────────────────────────────────────── */
.pb-sec-card{background:#fff;border:1px solid var(--border);border-radius:12px;
             overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.pb-sec-head{display:flex;align-items:center;gap:8px;padding:10px 14px;
             background:var(--dark);color:#9aaed4;flex-wrap:wrap;gap:6px}
.pb-sec-badge{background:var(--blue);color:#fff;font-size:10px;font-weight:700;
              width:20px;height:20px;border-radius:50%;display:flex;align-items:center;
              justify-content:center;flex-shrink:0}
.pb-sec-title{font-size:12px;font-weight:600;flex:1;color:#c8d3ed}
.pb-sec-controls{display:flex;align-items:center;gap:4px;flex-wrap:nowrap}

/* ── Fondo de sección ────────────────────────────────────────── */
.pb-bg-row{display:flex;align-items:center;gap:8px;padding:10px 14px;
           background:#f8fafc;border-bottom:1px solid var(--border);flex-wrap:wrap}
.pb-bg-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;
           color:#94a3b8;flex-shrink:0}
.pb-bg-tabs{display:flex;gap:4px;flex-wrap:wrap}
.pb-bg-tab{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:500;
           color:#64748b;padding:3px 8px;border-radius:5px;cursor:pointer;
           border:1px solid transparent;transition:all .12s;white-space:nowrap}
.pb-bg-tab input{display:none}
.pb-bg-tab:hover{background:#eff3ff;color:var(--blue)}
.pb-bg-tab.on{background:#eff3ff;color:var(--blue);border-color:#c7d2fe}
.pb-bg-opts{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:4px}
.pb-color-inp{width:32px;height:24px;padding:1px 2px;border:1px solid var(--border);
              border-radius:4px;cursor:pointer;background:none}
.pb-color-text{width:88px;font-size:11px;font-family:monospace}
.pb-grad-arrow{color:#94a3b8;font-size:12px;flex-shrink:0}
.pb-overlay-label{display:flex;align-items:center;gap:5px;font-size:10px;
                  color:#94a3b8;white-space:nowrap}
.pb-overlay-pct{font-size:10px;color:#94a3b8;width:28px;text-align:right}

/* ── Área de componentes ─────────────────────────────────────── */
.pb-cmps{padding:12px 14px;display:flex;flex-direction:column;gap:10px;min-height:40px}
.pb-cmps-empty{color:#94a3b8;font-size:12px;text-align:center;padding:16px 0}

/* ── Tarjeta de componente ───────────────────────────────────── */
.pb-cmp-card{background:#f8fafc;border:1px solid var(--border);border-radius:9px;overflow:hidden}
.pb-cmp-head{display:flex;align-items:center;gap:8px;padding:8px 12px;
             background:#f1f5f9;border-bottom:1px solid var(--border)}
.pb-cmp-ic{font-size:14px;flex-shrink:0}
.pb-cmp-type{font-size:11px;font-weight:700;color:#475569;flex:1;text-transform:uppercase;letter-spacing:.4px}
.pb-cmp-acts{display:flex;gap:3px}
.pb-cmp-fields{padding:12px 14px;display:flex;flex-direction:column;gap:9px}

/* ── Fila de campo ───────────────────────────────────────────── */
.pb-field-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.pb-field-lbl{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.35px;
              color:#94a3b8;white-space:nowrap;flex-shrink:0;min-width:52px}
.pb-field-inp{flex:1;min-width:120px}
.pb-textarea{flex:1;min-width:0;resize:vertical;font-size:13px;line-height:1.5;min-height:60px}
.pb-html-ta{font-family:monospace;font-size:12px}

/* ── Paleta de componentes ───────────────────────────────────── */
.pb-cmp-palette{display:flex;align-items:center;gap:5px;padding:10px 14px;
                background:#f0f2f5;border-top:1px solid var(--border);flex-wrap:wrap}
.pb-pal-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;
            color:#94a3b8;flex-shrink:0;margin-right:3px}
.pb-pal-btn{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:500;
            color:#475569;padding:4px 9px;border:1px solid var(--border);border-radius:6px;
            background:#fff;cursor:pointer;transition:all .12s;font-family:inherit;white-space:nowrap}
.pb-pal-btn:hover{border-color:var(--blue);color:var(--blue);background:#eff3ff}

/* ── Selectores mini ─────────────────────────────────────────── */
.pb-mini-sel{font-size:11px;border:1px solid var(--border);border-radius:5px;
             padding:3px 6px;background:#fff;color:#475569;cursor:pointer;font-family:inherit}
.pb-mini-sel:focus{border-color:var(--blue);outline:none}

/* ── Card grid items ─────────────────────────────────────────── */
.pb-card-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.pb-card-item{background:#fff;border:1px solid var(--border);border-radius:8px;
              padding:10px 12px}
.pb-card-head{display:flex;align-items:center;justify-content:space-between;
              margin-bottom:8px}
.pb-card-num{font-size:10px;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.4px}
.pb-card-fields{display:flex;flex-direction:column;gap:7px}

/* ── Stats / Features items ──────────────────────────────────── */
.pb-stat-list,.pb-feat-list{display:flex;flex-direction:column;gap:7px}
.pb-stat-item,.pb-feat-item{display:flex;align-items:center;gap:6px;
              background:#fff;border:1px solid var(--border);border-radius:7px;padding:7px 10px}

/* ── Botón Constructor en page editor ───────────────────────── */
.pb-constructor-btn{background:linear-gradient(135deg,#5068e8,#7c54e8)!important;
                    font-weight:700!important}
.pb-constructor-btn:hover{opacity:.9;transform:translateY(-1px)}

/* ── ACTUALIZACIONES (Ajustes) ─────────────────────────────── */
.upd-version-bar{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.upd-ver-lbl{font-size:12px;color:#64748b;font-weight:600}
.upd-ver-badge{background:#eff3ff;color:var(--blue);font-size:12px;font-weight:700;
               padding:3px 10px;border-radius:20px;border:1px solid #c7d2fe}

.upd-block{background:#f8fafc;border:1px solid var(--border);border-radius:10px;padding:16px}
.upd-block-title{font-size:13px;font-weight:700;color:#0f172a;margin-bottom:6px}
.upd-block-desc{font-size:12px;color:#64748b;margin:0 0 12px;line-height:1.5}

.upd-drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;
               gap:6px;border:2px dashed #cbd5e1;border-radius:8px;padding:24px 16px;
               cursor:pointer;transition:all .15s;color:#94a3b8;text-align:center}
.upd-drop-zone:hover,.upd-drop-zone.drag{border-color:var(--blue);background:#eff3ff;color:var(--blue)}

.upd-file-chosen{display:flex;align-items:center;gap:8px;margin-top:8px;padding:7px 12px;
                 background:#fff;border:1px solid var(--border);border-radius:7px}

.upd-protected-bar{display:flex;align-items:center;flex-wrap:wrap;gap:5px;
                   margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.upd-prot-lbl{font-size:11px;color:#94a3b8;white-space:nowrap}
.upd-protected-bar code{font-size:11px;background:#f1f5f9;padding:2px 6px;border-radius:4px;color:#475569}

.upd-result{margin-top:12px;border:1px solid var(--border);border-radius:8px;
            overflow:hidden;max-height:260px;overflow-y:auto}
.upd-result-head{padding:8px 12px;background:#f8fafc;font-size:12px;font-weight:600;
                 color:#334155;border-bottom:1px solid var(--border)}
.upd-file-row{font-size:11px;padding:4px 12px;font-family:monospace;border-bottom:1px solid #f8fafc}
.upd-file-row:last-child{border-bottom:none}
.upd-ok{color:#15803d;background:#f0fdf4}
.upd-skip{color:#92400e;background:#fffbeb}
.upd-err{color:#dc2626;background:#fef2f2}
.upd-details summary{font-size:11px;color:#64748b;padding:4px 12px;cursor:pointer}
.upd-err-block{padding:8px 12px}

/* ── Panel Páginas en Modelar (mpg) ─────────────────────────── */
/* ── Layout 3 columnas: sidebar | editor | preview ─────────── */
.mpg-layout{display:flex;height:100%;min-height:500px;gap:0;overflow:hidden}

/* Sidebar */
.mpg-sidebar{width:200px;flex-shrink:0;border-right:1px solid var(--border);
             display:flex;flex-direction:column;background:#f8fafc}
.mpg-sidebar-head{display:flex;align-items:center;justify-content:space-between;
                  padding:10px 12px;border-bottom:1px solid var(--border)}
.mpg-sidebar-title{font-size:13px;font-weight:700;color:#0f172a}
.mpg-list{flex:1;overflow-y:auto;padding:6px}
.mpg-item{padding:8px 10px;border-radius:7px;cursor:pointer;margin-bottom:3px;
          border:1px solid transparent;transition:all .12s}
.mpg-item:hover{background:#fff;border-color:var(--border)}
.mpg-item.on{background:#eff3ff;border-color:#c7d2fe}
.mpg-item-title{font-size:12px;font-weight:600;color:#0f172a;
                white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpg-item-slug{font-size:10px;color:#94a3b8;margin-top:2px;
               white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Editor (columna central) */
.mpg-editor{flex:1;min-width:0;overflow-y:auto;position:relative;
            border-right:1px solid var(--border)}
.mpg-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;
           height:100%;padding:40px;text-align:center;color:#94a3b8}
#mpg-editor .pb-editor{min-height:100%}

/* Preview (columna derecha) */
.mpg-preview-pane{flex:1;min-width:0;display:flex;flex-direction:column;background:#e2e8f0}
.mpg-preview-head{display:flex;align-items:center;justify-content:space-between;
                  padding:6px 12px;background:#fff;border-bottom:1px solid var(--border);
                  flex-shrink:0;font-size:11px;font-weight:600;color:#64748b;
                  text-transform:uppercase;letter-spacing:.05em}
.mpg-preview-scale{display:flex;gap:4px}
.mpg-scale-btn{background:none;border:1px solid #e2e8f0;border-radius:5px;
               padding:2px 7px;cursor:pointer;font-size:13px;transition:all .12s}
.mpg-scale-btn:hover,.mpg-scale-btn.on{background:#eff3ff;border-color:#c7d2fe}
.mpg-preview-wrap{flex:1;overflow:auto;display:flex;align-items:flex-start;
                  justify-content:center;padding:12px}
.mpg-preview-frame{width:100%;height:100%;min-height:400px;border:none;
                   border-radius:6px;background:#fff;
                   box-shadow:0 4px 24px rgba(0,0,0,.10);display:block}
.mpg-preview-frame.scaled{transform-origin:top center}
.mpg-preview-empty{color:#94a3b8;font-size:13px;padding:40px;text-align:center;width:100%}

/* mod-paginas: sin padding, altura completa */
#mod-paginas.mod-panel.on{display:flex;flex-direction:column;height:100%;margin:-20px -24px}
#mod-paginas .mpg-layout{flex:1;min-height:0}

/* Fix scroll en mpg-editor: pb-editor crece, mpg-editor scrollea */
#mpg-editor .pb-editor   { height:auto; min-height:100%; overflow:visible }
#mpg-editor .pb-sections { flex:none; overflow-y:visible; min-height:0 }

/* ════════════════════════════════════════════════════════════════
   AJUSTES — Layout 3 columnas (v1.0)
   ════════════════════════════════════════════════════════════════ */
.aj3-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
            align-items:start;padding:20px 24px}
@media(max-width:1100px){.aj3-layout{grid-template-columns:1fr 1fr}}
@media(max-width:700px) {.aj3-layout{grid-template-columns:1fr}}
.aj3-col{display:flex;flex-direction:column;gap:16px}

/* ════════════════════════════════════════════════════════════════
   PLUGINS — Tarjetas + Drop zone
   ════════════════════════════════════════════════════════════════ */

/* Drop zone */
.plg-drop-zone{border:2px dashed #cbd5e1;border-radius:10px;padding:18px 12px;
               text-align:center;cursor:pointer;display:flex;flex-direction:column;
               align-items:center;gap:5px;background:#f8fafc;transition:all .15s;
               font-size:13px;color:#64748b}
.plg-drop-zone:hover,.plg-drop-zone.drag{border-color:#5068e8;background:#eff3ff;color:#5068e8}

/* Barra de instalación */
.plg-install-bar{display:flex;align-items:center;gap:8px;padding:8px;
                 background:#f1f5f9;border-radius:8px;margin-top:8px}

/* Grid de tarjetas */
.plg-grid{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.plg-empty{text-align:center;padding:20px;color:#94a3b8;font-size:13px}

/* Tarjeta de plugin */
.plg-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:14px;
          transition:border-color .15s}
.plg-card--off{opacity:.55}
.plg-card-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.plg-card-name{font-size:13px;font-weight:700;color:#0f172a;flex:1;
               white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plg-ver{font-size:10px;font-weight:600;color:#64748b;background:#f1f5f9;
         padding:2px 6px;border-radius:4px;flex-shrink:0}
.plg-card-acts{display:flex;align-items:center;gap:6px;flex-shrink:0}
.plg-desc{font-size:11px;color:#64748b;line-height:1.5;margin-bottom:6px}
.plg-comps{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.plg-comp-badge{font-size:10px;background:#eff3ff;color:#5068e8;
                border-radius:4px;padding:2px 7px;font-weight:600}
.plg-author{font-size:10px;color:#94a3b8}

/* Toggle switch */
.plg-toggle{display:inline-flex;align-items:center;cursor:pointer;position:relative;
            width:34px;height:18px}
.plg-toggle input{opacity:0;width:0;height:0;position:absolute}
.plg-toggle-track{width:34px;height:18px;background:#e2e8f0;border-radius:9px;
                  transition:background .15s;display:block}
.plg-toggle input:checked + .plg-toggle-track{background:#5068e8}
.plg-toggle-track::after{content:'';position:absolute;top:2px;left:2px;
  width:14px;height:14px;border-radius:50%;background:#fff;transition:left .15s;
  box-shadow:0 1px 3px rgba(0,0,0,.25)}
.plg-toggle input:checked ~ .plg-toggle-track::after{left:18px}

/* ════════════════════════════════════════════════════════════════
   FAVICON TAB
   ════════════════════════════════════════════════════════════════ */
.fav-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;padding:4px 0 8px}
@media(max-width:700px){.fav-layout{grid-template-columns:1fr}}

/* Zona de subida */
.fav-drop-zone{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:32px 20px;border:2px dashed rgba(255,255,255,.15);
  border-radius:12px;text-align:center;cursor:pointer;
  transition:border-color .15s,background .15s;min-height:180px;
}
.fav-drop-zone:hover,.fav-drop-zone.drag{
  border-color:#5068e8;background:rgba(80,104,232,.07);
}
.fav-drop-zone p{font-size:13px;opacity:.7;margin:0}

/* Vista previa */
.fav-preview-col{
  display:flex;flex-direction:column;gap:16px;
  padding:20px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);border-radius:12px;min-height:180px;
}
.fav-no-icon{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;height:100%;min-height:140px;
}
.fav-sizes-grid{display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap}
.fav-size-item{display:flex;flex-direction:column;align-items:center;gap:6px}
.fav-prev-img{
  object-fit:cover;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}
.fav-size-lbl{font-size:11px;opacity:.6;text-align:center;line-height:1.3}
.fav-size-lbl small{opacity:.7}

.fav-files-list{font-size:11px;opacity:.5;line-height:1.6;margin-top:4px}
.fav-file-row::before{content:'📄 ';opacity:.6}
