/* ===========================================
   ADMIN — Dashboard Superando Crisis PY
   =========================================== */
:root{
  --azul-osc:#0a2540;
  --azul:#14406b;
  --dorado:#c89a47;
  --dorado-osc:#9a7530;
  --verde:#2e7d57;
  --rojo:#a8323a;
  --gris-1:#fafbfd;
  --gris-2:#f0f2f6;
  --gris-3:#e6ebf1;
  --gris-4:#a1a1a6;
  --gris-5:#5a6b80;
  --texto:#1d1d1f;
  --sombra:0 6px 24px rgba(10,37,64,.08);
  --sombra-fuerte:0 18px 50px rgba(10,37,64,.18);
  --font:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:var(--font);color:var(--texto);background:var(--gris-1)}
button{font-family:var(--font);cursor:pointer}
code{background:#f0f2f6;padding:2px 6px;border-radius:4px;font-size:.85em}

/* ===== LOGIN ===== */
.login-screen{
  position:fixed;inset:0;background:linear-gradient(135deg,#0a2540 0%,#14406b 100%);
  display:flex;align-items:center;justify-content:center;z-index:10000;
}
.login-card{
  background:#fff;border-radius:24px;
  padding:48px 44px;width:380px;max-width:calc(100vw - 32px);
  box-shadow:0 30px 80px rgba(0,0,0,.4);
  text-align:center;
}
.login-logo{display:flex;justify-content:center;margin-bottom:18px}
.login-card h1{
  font-size:1.4rem;font-weight:700;color:var(--azul-osc);
  margin:0 0 4px;letter-spacing:-.01em;
}
.login-card > p{color:var(--gris-5);font-size:.85rem;margin:0 0 28px}
.login-form{display:flex;flex-direction:column;gap:14px;text-align:left}
.login-form label{display:flex;flex-direction:column;gap:6px}
.login-form label span{font-size:.78rem;font-weight:600;color:var(--azul-osc);letter-spacing:.3px;text-transform:uppercase}
.login-form input{
  border:1px solid var(--gris-3);border-radius:12px;
  padding:11px 14px;font-size:.95rem;font-family:inherit;
  background:#fafbfd;outline:none;
  transition:border .15s, box-shadow .15s;
}
.login-form input:focus{border-color:var(--dorado);background:#fff;box-shadow:0 0 0 3px rgba(200,154,71,.15)}
.btn-pri{
  background:var(--azul-osc);color:#fff;border:none;
  padding:12px 24px;border-radius:980px;
  font-size:.92rem;font-weight:600;
  transition:background .15s, transform .1s;
}
.btn-pri:hover{background:var(--azul)}
.btn-pri:active{transform:translateY(1px)}
.login-error{
  background:#fdeaec;color:var(--rojo);
  padding:9px 12px;border-radius:8px;
  font-size:.82rem;font-weight:500;
}
.login-help{
  font-size:.75rem;color:var(--gris-4);text-align:center;
  padding-top:10px;border-top:1px solid var(--gris-3);
  display:flex;flex-direction:column;gap:8px;align-items:center;
}
.login-help code{background:#fff5e0;color:var(--dorado-osc);font-weight:600}
.login-reset{
  color:var(--dorado-osc);text-decoration:none;
  font-size:.78rem;font-weight:500;
  border-bottom:1px dashed transparent;
  transition:border-color .15s;
}
.login-reset:hover{border-bottom-color:var(--dorado-osc)}

/* ===== APP LAYOUT ===== */
.admin-app{min-height:100vh}
.admin-top{
  background:#fff;border-bottom:1px solid var(--gris-3);
  padding:14px 28px;
  display:flex;align-items:center;gap:32px;
  position:sticky;top:0;z-index:100;
  box-shadow:0 2px 12px rgba(10,37,64,.04);
}
.brand{display:flex;align-items:center;gap:12px}
.brand > div{display:flex;flex-direction:column;line-height:1.2}
.brand strong{font-size:.95rem;color:var(--azul-osc);font-weight:700}
.brand span{font-size:.72rem;color:var(--gris-5);letter-spacing:.3px}

.admin-tabs{display:flex;gap:4px;flex:1}
.tab{
  background:transparent;border:none;
  padding:9px 16px;border-radius:980px;
  font-size:.88rem;font-weight:600;color:var(--gris-5);
  display:inline-flex;align-items:center;gap:8px;
  transition:background .15s, color .15s;
}
.tab:hover{background:var(--gris-2);color:var(--azul-osc)}
.tab.activo{background:var(--azul-osc);color:#fff}
.tab.activo .badge{background:#fff;color:var(--azul-osc)}
.tab .badge{
  background:var(--dorado);color:#fff;
  padding:1px 8px;border-radius:980px;
  font-size:.7rem;font-weight:700;line-height:1.4;
}

.admin-actions{display:flex;gap:8px}
.btn-ghost{
  background:transparent;border:1px solid var(--gris-3);
  padding:8px 14px;border-radius:980px;
  font-size:.82rem;font-weight:500;color:var(--azul-osc);
  transition:background .15s, border .15s;
}
.btn-ghost:hover:not(:disabled){background:var(--gris-2);border-color:var(--gris-4)}
.btn-ghost:disabled{opacity:.4;cursor:not-allowed}

.tab-pane{display:none;padding:32px;max-width:1400px;margin:0 auto}
.tab-pane.activo{display:block}
.pane-head{margin-bottom:24px}
.pane-head h2{font-size:1.65rem;font-weight:700;color:var(--azul-osc);margin:0 0 6px;letter-spacing:-.015em}
.pane-head p{color:var(--gris-5);font-size:.95rem;margin:0;max-width:780px}

/* ===== TAB CONTENIDO ===== */
.content-layout{
  display:grid;grid-template-columns:280px 1fr;gap:20px;
  height:calc(100vh - 220px);min-height:540px;
}
.page-list{
  background:#fff;border-radius:14px;
  overflow-y:auto;padding:8px;
  box-shadow:var(--sombra);
}
.page-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 12px;border-radius:8px;
  font-size:.88rem;color:var(--texto);
  cursor:pointer;transition:background .12s;
  margin-bottom:2px;
}
.page-item:hover{background:var(--gris-2)}
.page-item.activo{background:var(--azul-osc);color:#fff}
.page-item .mod{
  background:var(--dorado);color:#fff;
  padding:1px 7px;border-radius:980px;
  font-size:.65rem;font-weight:700;
}
.page-item.activo .mod{background:#fff;color:var(--dorado-osc)}

.page-editor{
  background:#fff;border-radius:14px;overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:var(--sombra);
}
.editor-toolbar{
  background:#fafbfd;border-bottom:1px solid var(--gris-3);
  padding:12px 18px;display:flex;justify-content:space-between;align-items:center;
}
.editor-toolbar #editingLabel{font-size:.9rem;font-weight:600;color:var(--azul-osc)}
.editor-buttons{display:flex;gap:8px}
#editorFrame{flex:1;border:none;background:#fff;width:100%}
.editor-help{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:40px;color:var(--gris-4);font-size:.95rem;text-align:center;
}
.btn-pri-sm{
  background:var(--verde);color:#fff;border:none;
  padding:8px 14px;border-radius:980px;
  font-size:.82rem;font-weight:600;
  transition:background .15s, transform .1s;
}
.btn-pri-sm:hover:not(:disabled){background:#26654a}
.btn-pri-sm:disabled{opacity:.4;cursor:not-allowed;background:var(--gris-4)}
.save-toast{
  position:absolute;bottom:24px;right:24px;
  background:var(--verde);color:#fff;
  padding:10px 18px;border-radius:10px;
  font-size:.88rem;font-weight:600;
  box-shadow:0 8px 24px rgba(46,125,87,.35);
  animation:toastIn .25s ease-out;
}
@keyframes toastIn{ from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.page-editor{position:relative}

/* ===== TABS y FILE DROP en VIDEOS ===== */
.vform-tabs{
  display:flex;gap:4px;
  margin-bottom:16px;
  background:var(--gris-2);
  padding:4px;border-radius:10px;
  width:fit-content;
}
.vform-tab{
  background:transparent;border:none;
  padding:8px 16px;border-radius:8px;
  font-size:.86rem;font-weight:600;color:var(--gris-5);
  cursor:pointer;transition:background .15s, color .15s;
}
.vform-tab:hover{color:var(--azul-osc)}
.vform-tab.activo{background:#fff;color:var(--azul-osc);box-shadow:0 1px 4px rgba(10,37,64,.1)}
.vform-pane{display:none}
.vform-pane.activo{display:grid}
#vidFormFile{grid-template-columns:1fr;gap:12px;max-width:560px}

.file-drop{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border:2px dashed var(--gris-3);border-radius:14px;
  padding:36px 24px;cursor:pointer;
  background:var(--gris-1);
  transition:border-color .2s, background .2s;
  text-align:center;
}
.file-drop:hover, .file-drop.drag-over{
  border-color:var(--dorado);background:#fff5e0;
}
.file-drop input[type="file"]{display:none}
.file-drop .fd-icon{
  font-size:2.4rem;color:var(--dorado);line-height:1;
  margin-bottom:10px;
}
.file-drop .fd-text{font-size:.95rem;color:var(--azul-osc);margin-bottom:4px}
.file-drop .fd-text strong{font-weight:700}
.file-drop .fd-info{font-size:.78rem;color:var(--gris-4)}
.file-drop.con-archivo .fd-icon{color:var(--verde)}
.file-drop.con-archivo .fd-text strong{color:var(--verde)}

.upload-progress{display:flex;align-items:center;gap:10px}
.up-bar{
  flex:1;height:8px;border-radius:980px;background:var(--gris-2);
  overflow:hidden;
}
.up-fill{
  height:100%;background:linear-gradient(90deg,var(--dorado),var(--verde));
  width:0;transition:width .2s;
}
.up-label{font-size:.78rem;font-weight:600;color:var(--gris-5);min-width:46px;text-align:right}

.vid-card .vid-type{
  position:absolute;top:8px;left:8px;
  background:rgba(10,37,64,.85);color:#fff;
  padding:3px 9px;border-radius:980px;
  font-size:.7rem;font-weight:600;
  z-index:2;
}
.vid-thumb video{width:100%;height:100%;object-fit:cover;background:#000}

/* ===== TAB CONFIGURACIÓN ===== */
.config-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px;
}
.config-card{
  background:#fff;border-radius:14px;padding:22px 24px;
  box-shadow:var(--sombra);
}
.config-card.full{grid-column:1/-1}
.config-card h3{margin:0 0 4px;font-size:1.05rem;color:var(--azul-osc);font-weight:700}
.config-card .config-desc{margin:0 0 16px;color:var(--gris-5);font-size:.86rem;line-height:1.5}
.config-form{display:flex;flex-direction:column;gap:10px}
.config-form label{display:flex;flex-direction:column;gap:5px}
.config-form label span{font-size:.74rem;font-weight:600;color:var(--azul-osc);letter-spacing:.3px;text-transform:uppercase}
.config-form input{
  border:1px solid var(--gris-3);border-radius:10px;
  padding:10px 14px;font-size:.92rem;font-family:inherit;
  background:#fafbfd;outline:none;
}
.config-form input:focus{border-color:var(--dorado);background:#fff;box-shadow:0 0 0 3px rgba(200,154,71,.12)}
.config-msg{padding:9px 12px;border-radius:8px;font-size:.85rem;font-weight:500}
.config-msg.ok{background:#e8f5ed;color:var(--verde);border:1px solid #c4e1d0}
.config-msg.err{background:#fdeaec;color:var(--rojo);border:1px solid #f7c8cc}

.logo-preview{
  background:#0a2540;border-radius:12px;
  height:140px;display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;color:#fff;
  background-size:contain;background-position:center;background-repeat:no-repeat;
  position:relative;
  border:1px dashed rgba(255,255,255,.18);
  transition:border-color .2s, background .2s;
}
.logo-preview:hover{border-color:rgba(200,154,71,.55)}
.logo-preview .logo-default{
  font-size:.86rem;color:#8fa1bb;
  display:flex;flex-direction:column;align-items:center;gap:6px;
}
.logo-preview .logo-default::before{
  content:"🖼";font-size:1.8rem;line-height:1;opacity:.55;
}
.logo-preview img{
  max-height:108px;max-width:80%;object-fit:contain;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.3));
}
.logo-preview .preview-badge{
  position:absolute;top:8px;right:10px;
  background:rgba(46,125,87,.92);color:#fff;
  padding:3px 10px;border-radius:980px;
  font-size:.68rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
}

.file-drop.small{
  padding:18px 16px;
}
.file-drop.small .fd-icon{font-size:1.6rem;margin-bottom:6px}
.file-drop.small .fd-text{font-size:.86rem}

.img-overrides{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;
}
.img-ov-card{
  background:var(--gris-1);border-radius:10px;overflow:hidden;
  border:1px solid var(--gris-3);
}
.img-ov-card .ov-thumb{
  aspect-ratio:16/10;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.img-ov-card .ov-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.img-ov-card .ov-info{padding:8px 10px;font-size:.76rem;color:var(--gris-5)}
.img-ov-card .ov-info code{font-size:.72rem;background:transparent;padding:0;color:var(--azul-osc)}
.img-ov-card .ov-actions{display:flex;justify-content:flex-end;padding:6px 10px;border-top:1px solid var(--gris-3)}
.img-ov-card .ov-actions button{background:transparent;border:none;color:var(--rojo);font-size:.78rem;cursor:pointer;padding:2px 6px;border-radius:4px}
.img-ov-card .ov-actions button:hover{background:#fdeaec}
.img-overrides-empty{padding:24px;text-align:center;color:var(--gris-4);font-size:.9rem;grid-column:1/-1}

/* ===== MODAL ===== */
.modal{
  position:fixed;inset:0;background:rgba(10,37,64,.55);
  display:flex;align-items:center;justify-content:center;
  z-index:10001;padding:20px;
  animation:fadeIn .15s ease;
}
.modal[hidden]{display:none !important}
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }
.modal-card{
  background:#fff;border-radius:18px;
  width:520px;max-width:100%;max-height:90vh;overflow:auto;
  box-shadow:0 30px 80px rgba(0,0,0,.4);
  animation:modalIn .2s ease;
}
@keyframes modalIn{ from{opacity:0;transform:translateY(20px) scale(.98)} to{opacity:1;transform:translateY(0) scale(1)} }
.modal-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 22px;border-bottom:1px solid var(--gris-3);
}
.modal-head h3{margin:0;font-size:1.1rem;font-weight:700;color:var(--azul-osc)}
.modal-close{
  background:var(--gris-2);border:none;width:30px;height:30px;border-radius:50%;
  font-size:1.3rem;color:var(--gris-5);cursor:pointer;line-height:1;
}
.modal-close:hover{background:var(--gris-3);color:var(--rojo)}
.modal-body{padding:22px}
.modal-current{
  background:var(--gris-1);border-radius:10px;padding:14px;
  margin-bottom:18px;text-align:center;
}
.modal-current .modal-label{display:block;font-size:.76rem;color:var(--gris-5);text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-bottom:8px}
.modal-current img{max-height:120px;max-width:100%;object-fit:contain;border-radius:6px}
.modal-foot{
  display:flex;justify-content:flex-end;gap:10px;
  padding:14px 22px;border-top:1px solid var(--gris-3);background:var(--gris-1);
}

/* ===== TAB VIDEOS ===== */
.vid-form-wrap{background:#fff;border-radius:14px;padding:20px 24px;box-shadow:var(--sombra);margin-bottom:24px}
.vid-form{display:grid;grid-template-columns:1.6fr 2fr 1fr auto;gap:10px}
.vid-form input{
  border:1px solid var(--gris-3);border-radius:10px;
  padding:10px 14px;font-size:.92rem;font-family:inherit;
  background:#fafbfd;outline:none;
}
.vid-form input:focus{border-color:var(--dorado);background:#fff;box-shadow:0 0 0 3px rgba(200,154,71,.12)}
.vid-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.vid-card{
  background:#fff;border-radius:14px;overflow:hidden;
  box-shadow:var(--sombra);transition:transform .15s, box-shadow .15s;
}
.vid-card:hover{transform:translateY(-2px);box-shadow:var(--sombra-fuerte)}
.vid-thumb{aspect-ratio:16/9;background:#0a2540;position:relative;display:flex;align-items:center;justify-content:center;color:#fff}
.vid-thumb iframe{width:100%;height:100%;border:none}
.vid-body{padding:14px 16px}
.vid-body h4{margin:0 0 4px;font-size:.95rem;color:var(--azul-osc)}
.vid-body .vid-meta{font-size:.78rem;color:var(--gris-5);margin-bottom:8px}
.vid-actions{display:flex;gap:6px}
.vid-actions button{
  background:transparent;border:1px solid var(--gris-3);
  padding:5px 10px;border-radius:6px;font-size:.78rem;
  color:var(--azul-osc);
}
.vid-actions button:hover{background:var(--gris-2)}
.vid-actions button.del{color:var(--rojo)}
.vid-actions button.del:hover{background:#fdeaec;border-color:var(--rojo)}

/* ===== TAB COMENTARIOS ===== */
.com-filters, .crm-filters{
  display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap;align-items:center;
}
.chip{
  background:#fff;border:1px solid var(--gris-3);
  padding:7px 14px;border-radius:980px;
  font-size:.82rem;font-weight:500;color:var(--azul-osc);
  transition:all .15s;
}
.chip:hover{background:var(--gris-2)}
.chip.activo{background:var(--azul-osc);color:#fff;border-color:var(--azul-osc)}
.chip.btn-csv{margin-left:auto;background:var(--verde);color:#fff;border-color:var(--verde)}
.chip.btn-csv:hover{background:#26654a}
.com-admin-list{display:flex;flex-direction:column;gap:14px}
.com-card{
  background:#fff;border-radius:14px;padding:18px 22px;
  box-shadow:var(--sombra);border-left:4px solid var(--dorado);
}
.com-card.resp{border-left-color:var(--verde)}
.com-card-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:8px;gap:12px}
.com-card-head h4{margin:0 0 2px;font-size:1rem;color:var(--azul-osc)}
.com-card-head .meta{font-size:.78rem;color:var(--gris-5)}
.com-card-head .estado{
  padding:2px 10px;border-radius:980px;font-size:.7rem;font-weight:700;
  background:#fff5e0;color:var(--dorado-osc);
}
.com-card.resp .estado{background:#e8f5ed;color:var(--verde)}
.com-mensaje{
  background:var(--gris-1);padding:12px 14px;border-radius:10px;
  font-size:.92rem;line-height:1.5;color:var(--texto);margin-bottom:12px;
}
.com-respuesta-existente{
  background:#e8f5ed;border-left:3px solid var(--verde);
  padding:10px 14px;border-radius:8px;font-size:.9rem;color:var(--azul-osc);
  margin-bottom:10px;
}
.com-respuesta-existente strong{color:var(--verde)}
.com-resp-form{display:flex;gap:8px;align-items:stretch}
.com-resp-form textarea{
  flex:1;border:1px solid var(--gris-3);border-radius:10px;
  padding:10px 14px;font-size:.9rem;font-family:inherit;
  resize:vertical;min-height:50px;outline:none;
}
.com-resp-form textarea:focus{border-color:var(--dorado);box-shadow:0 0 0 3px rgba(200,154,71,.12)}
.com-resp-form button{
  background:var(--azul-osc);color:#fff;border:none;
  padding:0 18px;border-radius:10px;font-size:.85rem;font-weight:600;
}
.com-resp-form button:hover{background:var(--azul)}

/* ===== TAB CRM ===== */
.crm-stats{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;margin-bottom:24px;
}
.crm-stat{
  background:#fff;border-radius:14px;padding:18px 22px;
  box-shadow:var(--sombra);
}
.crm-stat .num{font-size:1.9rem;font-weight:700;color:var(--azul-osc);line-height:1;letter-spacing:-.02em}
.crm-stat .label{font-size:.78rem;color:var(--gris-5);text-transform:uppercase;letter-spacing:.5px;margin-top:6px;font-weight:600}
.crm-table-wrap{
  background:#fff;border-radius:14px;overflow:auto;
  box-shadow:var(--sombra);
}
.crm-table{
  width:100%;border-collapse:collapse;font-size:.88rem;
}
.crm-table th{
  background:var(--gris-1);
  text-align:left;padding:12px 16px;
  font-size:.72rem;font-weight:700;color:var(--azul-osc);
  text-transform:uppercase;letter-spacing:.5px;
  border-bottom:1px solid var(--gris-3);
}
.crm-table td{
  padding:14px 16px;border-bottom:1px solid var(--gris-2);color:var(--texto);
  vertical-align:middle;
}
.crm-table tr:last-child td{border-bottom:none}
.crm-table tr:hover td{background:var(--gris-1)}
.crm-table .pill{padding:2px 9px;border-radius:980px;font-size:.72rem;font-weight:600}
.crm-table .pill.empresa{background:#fff5e0;color:var(--dorado-osc)}
.crm-table .pill.acreedor{background:#e0eef7;color:var(--azul-osc)}
.crm-table .estado-sel{
  border:1px solid var(--gris-3);border-radius:8px;
  padding:4px 8px;font-size:.78rem;font-family:inherit;background:#fff;outline:none;
}
.crm-table .estado-sel:focus{border-color:var(--dorado)}
.crm-table .row-del{
  background:transparent;border:none;color:var(--rojo);
  font-size:1.2rem;line-height:1;padding:4px 8px;border-radius:4px;
}
.crm-table .row-del:hover{background:#fdeaec}
.crm-empty{padding:40px;text-align:center;color:var(--gris-4);font-size:.95rem}

@media (max-width:1000px){
  .admin-top{flex-wrap:wrap;gap:14px;padding:12px 18px}
  .admin-tabs{order:3;width:100%;overflow-x:auto}
  .tab-pane{padding:20px}
  .content-layout{grid-template-columns:1fr;height:auto}
  .page-list{max-height:200px}
  .vid-form{grid-template-columns:1fr;gap:8px}
}
