/* ─────────────────────────────────────────────────────────────────────────────
   Panel IIDEA — skin de administración estilo WordPress (wp-admin).
   Paleta y métricas calcadas de WP: barra y menú #1d2327, acento #2271b1,
   fondo #f0f0f1, tipografía de sistema a 13px, botones de 3px de radio.
   ──────────────────────────────────────────────────────────────────────────── */
:root {
  --wp-bar: #1d2327;        /* barra superior + menú lateral */
  --wp-menu-hover: #2c3338;
  --wp-accent: #2271b1;     /* azul de enlaces/botones de WP */
  --wp-accent-dark: #135e96;
  --wp-accent-light: #72aee6;
  --wp-body: #f0f0f1;       /* fondo del área de trabajo */
  --wp-text: #3c434a;
  --wp-head: #1d2327;
  --wp-border: #c3c4c7;
  --wp-border-soft: #dcdcde;
  --wp-muted: #646970;
  --wp-success: #00a32a;
  --wp-error: #d63638;
  --wp-warning: #dba617;
  --grad: linear-gradient(162deg, #3a4fe3, #a93fc4, #f0617e); /* marca IIDEA */
  --bar-h: 32px;
  --menu-w: 160px;
}
* { box-sizing: border-box; }
html { height: 100%; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  font-size: 13px;
  line-height: 1.4;
  color: var(--wp-text);
  background: var(--wp-body);
}
a { color: var(--wp-accent); text-decoration: none; }
a:hover { color: var(--wp-accent-dark); }
/* Enlaces DENTRO de un párrafo: el azul sobre el gris del texto no llega a 3:1,
   así que el subrayado es lo que los distingue (WCAG 1.4.1 — link-in-text-block).
   Los enlaces sueltos (menús, acciones, tarjetas) no lo necesitan. */
.ai-intro p a, .ba-howto a, .brand-why p a, .review-empty a, .ag-publish-note a,
.wp-subtitle a, .ed-field-help a, .ba-sub a { text-decoration: underline; }
.muted { color: var(--wp-muted); }
.error { color: var(--wp-error); font-weight: 600; }
[hidden] { display: none !important; }

/* ── Login (réplica de wp-login.php) ───────────────────────────────────────── */
body.login { background: var(--wp-body); display: flex; flex-direction: column; align-items: center; padding-top: 8vh; min-height: 100vh; }
#login { width: 320px; max-width: calc(100vw - 40px); }
.login-logo { margin: 0 auto 24px; display: block; width: 84px; height: 84px; border-radius: 50%; background: var(--grad); display: grid; place-items: center; }
.login-logo span { color: #fff; font-weight: 800; font-size: 30px; letter-spacing: -0.03em; }
.login-form {
  background: #fff; border: 1px solid var(--wp-border); padding: 26px 24px 30px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04); font-size: 14px;
}
.login-form p { margin: 0 0 18px; color: var(--wp-text); }
.login-form .button-primary { width: 100%; padding: 8px 12px; font-size: 14px; }
.login-error {
  background: #fff; border: 1px solid var(--wp-border); border-left: 4px solid var(--wp-error);
  box-shadow: 0 1px 3px rgba(0,0,0,0.04); padding: 12px; margin-bottom: 20px; font-size: 14px;
}
.login-nav { text-align: center; margin: 16px 0 0; font-size: 13px; }
.login-nav a { color: var(--wp-muted); }
.login-nav a:hover { color: var(--wp-accent); }

/* ── Barra de administración ───────────────────────────────────────────────── */
.wpadminbar {
  position: fixed; top: 0; left: 0; right: 0; height: var(--bar-h); z-index: 999;
  background: var(--wp-bar); color: #f0f0f1;
  display: flex; align-items: stretch; justify-content: space-between;
  font-size: 13px;
}
.ab-left, .ab-right { display: flex; align-items: stretch; }
.ab-group { position: relative; display: flex; align-items: stretch; }
.ab-item {
  display: flex; align-items: center; gap: 6px; padding: 0 10px; color: #f0f0f1;
  background: none; border: 0; font: inherit; cursor: pointer; text-decoration: none; height: var(--bar-h);
}
.ab-group:hover .ab-item, .ab-item:hover { background: var(--wp-menu-hover); color: var(--wp-accent-light); }
.ab-logo {
  width: 18px; height: 18px; border-radius: 50%; background: var(--grad); display: inline-block; flex-shrink: 0;
}
.ab-ico svg { width: 16px; height: 16px; display: block; fill: currentColor; }
.ab-user b { font-weight: 600; }
.ab-avatar {
  width: 20px; height: 20px; border-radius: 50%; background: var(--grad); color: #fff;
  display: inline-grid; place-items: center; font-size: 10px; font-weight: 700; margin-left: 2px;
}
/* Submenús desplegables de la barra (como los flyouts de #wpadminbar) */
.ab-sub {
  display: none; position: absolute; top: var(--bar-h); left: 0; min-width: 160px;
  background: var(--wp-menu-hover); box-shadow: 0 3px 5px rgba(0,0,0,0.2); padding: 6px 0; z-index: 1001;
}
.ab-sub-right { left: auto; right: 0; }
/* :focus-within además de :hover — si no, "Salir" y los enlaces del submenú son
   inalcanzables con el teclado (están en display:none hasta pasar el ratón). */
.ab-group:hover .ab-sub, .ab-group:focus-within .ab-sub { display: block; }
.ab-sub a, .ab-sub-link {
  display: block; width: 100%; text-align: left; padding: 6px 12px; color: #f0f0f1;
  background: none; border: 0; font: inherit; cursor: pointer; text-decoration: none;
}
.ab-sub a:hover, .ab-sub-link:hover { color: var(--wp-accent-light); }
.ab-sub form { margin: 0; }

/* ── Menú lateral ──────────────────────────────────────────────────────────── */
.adminmenu {
  position: fixed; top: var(--bar-h); left: 0; bottom: 0; width: var(--menu-w); z-index: 998;
  background: var(--wp-bar); display: flex; flex-direction: column;
  /* Sin overflow:auto — recortaría los submenús flotantes (flyouts). */
  overflow: visible;
}
#wp-menu { flex: 1; padding-top: 8px; }
.menu-item { width: 100%; position: relative; }
.menu-link {
  display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 10px;
  background: none; border: 0; color: #f0f0f1; font: inherit; font-size: 14px;
  cursor: pointer; text-align: left; text-decoration: none;
}
.menu-link:hover { color: var(--wp-accent-light); background: var(--wp-menu-hover); }
.menu-item.current > .menu-link { background: var(--wp-accent); color: #fff; }
.menu-ico { width: 20px; height: 20px; flex-shrink: 0; color: #a7aaad; }
.menu-ico svg { width: 20px; height: 20px; display: block; fill: currentColor; }
.menu-link:hover .menu-ico, .menu-item.current > .menu-link .menu-ico { color: inherit; }
.menu-sep { height: 1px; margin: 8px 0; background: rgba(255,255,255,0.1); }
/* Insignia de pendientes (borradores en la cola de revisión), como el contador
   de actualizaciones de WP. Blanco sobre #d63638 ≈ 4.8:1 — cumple AA. */
.menu-badge {
  margin-left: auto; min-width: 18px; height: 18px; padding: 0 6px; border-radius: 9px;
  background: var(--wp-error); color: #fff; font-size: 11px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
body.folded .menu-badge { position: absolute; top: 4px; right: 2px; margin: 0; }
/* Cabecera de grupo del menú (segmentación clara: Contenido / Biblioteca / …). */
.menu-group {
  font-size: 10px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  /* #a7aaad sobre el sidebar (#1d2327) ≈ 5.3:1 — cumple WCAG AA (4.5:1). */
  color: #a7aaad; padding: 14px 12px 5px; margin-top: 4px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.menu-group:first-child { border-top: 0; margin-top: 0; }
/* Con el menú plegado, la cabecera se reduce a un separador (sin texto). */
body.folded .menu-group { font-size: 0; padding: 8px 0 0; border-top: 1px solid rgba(255,255,255,.1); margin: 8px 8px 0; }
/* Submenú: desplegado bajo la sección activa; flyout al pasar el mouse por las demás */
.submenu { display: none; background: #2c3338; padding: 6px 0; }
.submenu a {
  display: block; padding: 6px 12px 6px 38px; color: #b4b9be; font-size: 13px; cursor: pointer;
}
.submenu a:hover { color: var(--wp-accent-light); }
.submenu a.current { color: #fff; font-weight: 600; }
.submenu-head { display: none; padding: 8px 12px; color: #fff; font-weight: 600; font-size: 13px; }
.menu-item.current .submenu { display: block; }
.menu-item:not(.current):hover .submenu {
  display: block; position: absolute; left: 100%; top: 0; width: 180px;
  box-shadow: 0 3px 5px rgba(0,0,0,0.25); z-index: 1000;
}
.menu-item:not(.current):hover .submenu a { padding-left: 14px; }
.menu-item:not(.current):hover .submenu-head { display: block; }
.menu-item:not(.current):hover .submenu-head + a,
.menu-item:not(.current):hover .submenu a { padding-left: 14px; }
.collapse-menu {
  display: flex; align-items: center; gap: 8px; padding: 10px; border: 0;
  color: #a7aaad; font: inherit; cursor: pointer; border-top: 1px solid rgba(255,255,255,0.1);
  /* Fondo EXPLÍCITO, no `none`. Visualmente es idéntico —ya se veía este color,
     heredado de .adminmenu— pero .adminmenu es position:fixed y axe no siempre
     logra resolver el fondo a través de un ancestro fijo: caía al fondo de
     página (#f0f0f1) y reportaba 2,05:1 sobre un fondo que este elemento nunca
     tiene. El contraste real es 6,81:1 (#a7aaad sobre #1d2327). Declararlo aquí
     quita la ambigüedad y vuelve determinista la prueba de a11y, que fallaba
     solo en CI. */
  background: var(--wp-bar);
}
.collapse-menu:hover { color: var(--wp-accent-light); }

/* Menú plegado (como "Cerrar menú" de WP): solo iconos + flyouts al pasar el mouse */
body.folded .adminmenu { width: 36px; overflow: visible; }
body.folded .menu-label, body.folded .collapse-label { display: none; }
body.folded .menu-item .submenu { display: none; }
body.folded .menu-item:hover .submenu {
  display: block; position: absolute; left: 100%; top: 0; width: 180px;
  box-shadow: 0 3px 5px rgba(0,0,0,0.25); z-index: 1000;
}
body.folded .menu-item:hover .submenu-head { display: block; }
body.folded .menu-item:hover .submenu a { padding-left: 14px; }
body.folded .wpbody { margin-left: 36px; }
body.folded .collapse-arrow { transform: rotate(180deg); }

/* ── Cuerpo ────────────────────────────────────────────────────────────────── */
.wpbody { margin-left: var(--menu-w); padding-top: var(--bar-h); min-height: 100vh; display: flex; flex-direction: column; }
.wpbody-content { flex: 1; padding: 20px 20px 40px; }
.wp-footer {
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding: 12px 20px; border-top: 1px solid var(--wp-border-soft); color: var(--wp-muted); font-size: 12px;
}

/* Encabezado de pantalla, como .wrap de wp-admin */
.wrap { max-width: 1200px; }
/* Pantallas de edición que aprovechan todo el ancho (editor de páginas). */
.wrap-wide { max-width: 1600px; }
.wrap > h1.wp-heading {
  font-size: 23px; font-weight: 400; color: var(--wp-head); margin: 0 0 8px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; line-height: 1.3;
}
.page-title-action {
  display: inline-block; padding: 4px 8px; font-size: 13px; font-weight: 400;
  border: 1px solid var(--wp-accent); border-radius: 3px; background: #f6f7f7; color: var(--wp-accent);
  cursor: pointer; text-decoration: none;
}
.page-title-action:hover { background: #f0f0f1; border-color: var(--wp-accent-dark); color: var(--wp-accent-dark); }
.wp-subtitle { margin: 0 0 14px; color: var(--wp-muted); }

/* ── Botones (WP .button / .button-primary) ────────────────────────────────── */
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 5px 12px; min-height: 30px; border-radius: 3px; cursor: pointer;
  border: 1px solid var(--wp-accent); background: #f6f7f7; color: var(--wp-accent);
  font: inherit; font-size: 13px; line-height: 1.2; text-decoration: none;
}
.button:hover { background: #f0f0f1; border-color: var(--wp-accent-dark); color: var(--wp-accent-dark); }
.button:disabled { opacity: 0.55; cursor: default; }
.button-primary { background: var(--wp-accent); border-color: var(--wp-accent); color: #fff; }
.button-primary:hover { background: var(--wp-accent-dark); border-color: var(--wp-accent-dark); color: #fff; }
/* #b32d2e sobre blanco ≈ 5.9:1 — cumple AA (el --wp-error #d63638 se queda ~4:1). */
.button-link-delete { border: 0; background: none; color: #b32d2e; cursor: pointer; font: inherit; padding: 5px 0; }
.button-link-delete:hover { text-decoration: underline; }
.button-hero { padding: 8px 18px; font-size: 14px; }

/* ── Avisos (WP .notice, descartables) ─────────────────────────────────────── */
.notice {
  position: relative; background: #fff; border: 1px solid var(--wp-border); border-left-width: 4px;
  border-radius: 2px; box-shadow: 0 1px 1px rgba(0,0,0,0.04); margin: 0 0 15px;
  padding: 8px 38px 8px 12px; font-size: 13px;
}
.notice.ok { border-left-color: var(--wp-success); }
.notice.err { border-left-color: var(--wp-error); }
.notice a { font-weight: 600; }
/* Desvanecido de los avisos de éxito que se descartan solos. */
.notice-fade { opacity: 0; transition: opacity .3s ease; }
@media (prefers-reduced-motion: reduce) { .notice-fade { transition: none; } }
.notice-dismiss {
  position: absolute; top: 0; right: 0; padding: 8px 10px; background: none; border: 0;
  color: var(--wp-muted); font-size: 14px; line-height: 1; cursor: pointer;
}
.notice-dismiss:hover { color: var(--wp-error); }

/* ── Spinner de carga (como el de wp-admin) ────────────────────────────────── */
.spinner {
  display: inline-block; width: 18px; height: 18px; vertical-align: middle; margin-right: 6px;
  border: 2px solid var(--wp-border); border-top-color: var(--wp-accent); border-radius: 50%;
  animation: wp-spin 0.7s linear infinite;
}
@keyframes wp-spin { to { transform: rotate(360deg); } }
/* Solo para lectores de pantalla (oculto visualmente, sigue en el árbol a11y). */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
@media (prefers-reduced-motion: reduce) { .spinner { animation-duration: 2s; } }

/* ── Modal de confirmación (reemplaza confirm()) ─────────────────────────── */
.cm-back{ position:fixed; inset:0; z-index:1000; background:rgba(1,21,74,.35); display:flex; align-items:center; justify-content:center; padding:20px; }
.cm-box{ background:#fff; border-radius:10px; box-shadow:0 20px 60px -12px rgba(1,21,74,.4); max-width:440px; width:100%; padding:22px 24px; }
.cm-title{ font-size:17px; font-weight:700; color:var(--wp-head); margin:0 0 8px; }
.cm-msg{ font-size:14px; color:var(--wp-text); margin:0 0 20px; white-space:pre-line; line-height:1.5; }
.cm-actions{ display:flex; justify-content:flex-end; gap:10px; }
.button-danger{ background:var(--wp-error); border-color:var(--wp-error); color:#fff; }
.button-danger:hover{ background:#a02020; border-color:#a02020; color:#fff; }
.cm-box .button:focus-visible{ outline:2px solid var(--wp-accent); outline-offset:2px; }
@media (prefers-reduced-motion: no-preference){ .cm-box{ animation:cm-in .14s ease; } }
@keyframes cm-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }

/* ── Paleta de comandos / salto rápido (Ctrl/Cmd+K) ──────────────────────── */
.ab-search{ display:inline-flex; align-items:center; gap:6px; }
.ab-search-ico{ font-size:15px; }
.ab-kbd, .ab-search .ab-kbd{ margin-left:6px; font-size:11px; padding:1px 5px; border-radius:4px; background:rgba(255,255,255,.14); color:#c3c4c7; }
@media (max-width:782px){ .ab-search span:not(.ab-search-ico), .ab-search .ab-kbd{ display:none; } }
.cmdk-back{ position:fixed; inset:0; z-index:1001; background:rgba(1,21,74,.35); display:flex; align-items:flex-start; justify-content:center; padding:12vh 16px 16px; }
.cmdk-box{ background:#fff; border-radius:12px; box-shadow:0 24px 70px -14px rgba(1,21,74,.45); width:100%; max-width:560px; display:flex; flex-direction:column; max-height:70vh; overflow:hidden; }
.cmdk-input{ border:0; border-bottom:1px solid var(--wp-border-soft); padding:15px 18px; font-size:16px; outline:none; color:var(--wp-head); }
.cmdk-list{ list-style:none; margin:0; padding:6px; overflow:auto; }
.cmdk-item{ display:flex; flex-direction:column; gap:3px; padding:9px 12px; border-radius:8px; cursor:pointer; }
.cmdk-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cmdk-item.active{ background:var(--wp-accent); color:#fff; }
.cmdk-item.active .cmdk-hint{ color:rgba(255,255,255,.82); }
.cmdk-item.active .cmdk-snippet{ color:rgba(255,255,255,.9); }
.cmdk-label{ font-size:14px; font-weight:500; }
.cmdk-hint{ font-size:12px; color:var(--wp-muted); white-space:nowrap; }
.cmdk-snippet{ font-size:12px; color:var(--wp-muted); line-height:1.35; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.cmdk-empty{ padding:14px 12px; }
.cmdk-foot{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:8px 14px; border-top:1px solid var(--wp-border-soft); font-size:12px; }
.cmdk-foot kbd{ min-width:16px; padding:1px 5px; font-size:11px; }
@media (prefers-reduced-motion: no-preference){ .cmdk-box{ animation:cm-in .14s ease; } }

/* ── Opciones de pantalla / Ayuda (pestañas superiores de wp-admin) ────────── */
.screen-meta-links { display: flex; justify-content: flex-end; gap: 4px; margin: -12px 0 6px; }
.screen-meta-toggle {
  background: #fff; border: 1px solid var(--wp-border-soft); border-top: 0; border-radius: 0 0 3px 3px;
  padding: 3px 10px 4px; font: inherit; font-size: 12px; color: var(--wp-muted); cursor: pointer;
}
.screen-meta-toggle:hover { color: var(--wp-accent); }
.screen-meta-toggle .arrow { font-size: 9px; margin-left: 4px; }
.screen-meta-panel {
  background: #fff; border: 1px solid var(--wp-border-soft); border-top: 0;
  padding: 14px 16px; margin: -6px 0 14px; font-size: 13px;
}
.screen-meta-panel h3 { margin: 0 0 8px; font-size: 13px; color: var(--wp-head); }
.screen-meta-panel .cols { display: flex; gap: 16px; flex-wrap: wrap; }
.screen-meta-panel label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.screen-meta-panel p { margin: 0 0 8px; }

/* ── Edición rápida (inline edit de WP) ────────────────────────────────────── */
tr.inline-edit-row td { background: #f6f7f7; border-bottom: 1px solid var(--wp-border); padding: 14px 12px; }
.inline-edit-title { font-weight: 600; text-transform: uppercase; font-size: 11px; letter-spacing: 0.04em; color: var(--wp-muted); margin-bottom: 10px; }
.inline-edit-fields { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 10px; margin-bottom: 10px; }
.inline-edit-fields label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--wp-head); font-weight: 600; }
.inline-edit-fields input, .inline-edit-fields select {
  font: inherit; font-weight: 400; padding: 5px 8px; border: 1px solid var(--wp-border); border-radius: 3px; width: 100%;
}
.inline-edit-actions { display: flex; gap: 8px; align-items: center; }
@media (max-width: 782px) { .inline-edit-fields { grid-template-columns: 1fr 1fr; } }

/* ── Columna de casillas (bulk actions) ────────────────────────────────────── */
.check-column { width: 30px; padding-right: 0 !important; }
.check-column input { margin: 0; }
.bulkactions { display: flex; gap: 6px; align-items: center; }
.bulkactions select { font: inherit; padding: 4px 8px; border: 1px solid var(--wp-border); border-radius: 3px; }

/* ── Tabla de listado (WP .wp-list-table) ──────────────────────────────────── */
.subsubsub { margin: 4px 0 6px; padding: 0; list-style: none; display: flex; gap: 4px; flex-wrap: wrap; font-size: 13px; }
.subsubsub li { display: inline; }
.subsubsub a { cursor: pointer; }
.subsubsub a.current { color: var(--wp-head); font-weight: 600; }
.subsubsub .count { color: var(--wp-muted); }
.subsubsub li:not(:last-child)::after { content: " |"; color: var(--wp-border); }
.tablenav { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 8px 0; flex-wrap: wrap; }
.tablenav .displaying-num { color: var(--wp-muted); white-space: nowrap; }
.wp-list-table {
  width: 100%; border-collapse: collapse; background: #fff;
  border: 1px solid var(--wp-border); box-shadow: 0 1px 1px rgba(0,0,0,0.04);
}
.wp-list-table th {
  text-align: left; padding: 8px 10px; font-size: 13px; font-weight: 400; color: var(--wp-head);
  border-bottom: 1px solid var(--wp-border);
}
.wp-list-table td { padding: 8px 10px; vertical-align: top; border-bottom: 1px solid var(--wp-border-soft); }
.wp-list-table tbody tr:nth-child(odd) { background: #f6f7f7; }
.wp-list-table tbody tr:hover { background: #f0f6fc; }
.wp-list-table tr:last-child td { border-bottom: 0; }
.row-title { font-weight: 600; font-size: 14px; color: var(--wp-accent); cursor: pointer; }
.row-title:hover { color: var(--wp-accent-dark); }
.row-state { color: var(--wp-head); font-weight: 600; }
.row-actions { font-size: 13px; margin-top: 2px; visibility: hidden; }
tr:hover .row-actions, tr:focus-within .row-actions { visibility: visible; }
.row-actions span:not(:last-child)::after { content: " | "; color: var(--wp-border); }
.row-actions a { cursor: pointer; }
.row-actions .trash a { color: var(--wp-error); }
.i18n-warn { color: #92400e; background: #fef3c7; border: 1px solid #fbbf24; border-radius: 4px; padding: 1px 7px; font-size: 12px; font-weight: 600; display: inline-block; margin-top: 4px; }
.i18n-row-warn { box-shadow: inset 3px 0 0 #f59e0b; }
.locale-missing { color: var(--wp-muted); font-size: 13px; }
.cat-manage-i18n { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cat-add-i18n { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.review-locale { margin: 8px 0; }
.review-locale b { display: inline-block; min-width: 28px; color: var(--wp-head); }
.column-thumb { width: 52px; }
.column-thumb img { width: 44px; height: 44px; object-fit: cover; border-radius: 2px; display: block; }
.column-date, .column-author, .column-cat { white-space: nowrap; }

/* ── Escritorio (dashboard) ────────────────────────────────────────────────── */
.welcome-panel {
  position: relative; background: #fff; border: 1px solid var(--wp-border); border-left: 4px solid var(--wp-accent);
  box-shadow: 0 1px 1px rgba(0,0,0,0.04); padding: 20px; margin-bottom: 20px;
}
.welcome-panel h2 { margin: 0 0 6px; font-size: 21px; font-weight: 400; color: var(--wp-head); }
.welcome-panel .about-description { margin: 0 0 16px; font-size: 14px; color: var(--wp-muted); }
.welcome-panel-columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.welcome-panel-column h3 { margin: 0 0 8px; font-size: 14px; color: var(--wp-head); }
.welcome-panel-column ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.welcome-panel-column a { cursor: pointer; }
/* Aclaración bajo un enlace. Va en su propia línea (no detrás del enlace) para
   que el enlace no quede "dentro de un párrafo": ahí el azul sobre el gris no
   alcanza 3:1 y haría falta subrayarlo (WCAG 1.4.1 — link-in-text-block). */
.welcome-hint { display: block; color: var(--wp-muted); font-size: 12px; margin-top: 1px; }
.dashboard-widgets { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.postbox { background: #fff; border: 1px solid var(--wp-border); box-shadow: 0 1px 1px rgba(0,0,0,0.04); }
.postbox + .postbox { margin-top: 20px; }
.postbox-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; border-bottom: 1px solid var(--wp-border-soft);
}
.postbox-header h2 { margin: 0; font-size: 14px; font-weight: 600; color: var(--wp-head); }
/* Fila de acciones en la cabecera de una caja (p.ej. staging / página en vivo).
   Envuelve en pantallas estrechas en vez de desbordar la cabecera. */
.deploy-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.postbox .inside { padding: 12px; }
.glance-list { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; list-style: none; }
.glance-list li { display: flex; align-items: center; gap: 6px; }
.glance-list a { cursor: pointer; font-size: 14px; }
.glance-ico { color: var(--wp-muted); display: inline-flex; }
.glance-ico svg { width: 16px; height: 16px; fill: currentColor; }
.activity-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.activity-list .act-date { color: var(--wp-muted); white-space: nowrap; margin-right: 8px; }
/* Enlaces subrayados dentro de bloques de texto: distinguibles sin depender del
   color (WCAG 1.4.1). Aplica a la actividad del escritorio y a párrafos "muted". */
.activity-list a, .inside p a, .wp-subtitle a, .muted a, .post-permalink a { text-decoration: underline; }
.quick-draft input[type="text"], .quick-draft textarea, .quick-draft select {
  width: 100%; padding: 6px 8px; border: 1px solid var(--wp-border); border-radius: 3px; font: inherit; margin-bottom: 8px;
}
.promote-box { border-left: 4px solid var(--wp-warning); }
.promote-box .inside { display: flex; flex-direction: column; gap: 10px; }

/* ── Formularios / campos ──────────────────────────────────────────────────── */
.ed-field { display: flex; flex-direction: column; gap: 3px; margin-bottom: 10px; }
.ed-field-label { font-size: 13px; font-weight: 600; color: var(--wp-head); }
.ed-field-help { font-size: 12px; }
.ed-field input[type="text"], .ed-field input[type="number"], .ed-field input:not([type]),
.ed-field textarea, .ed-field select, .ed-cta input, .form-input {
  width: 100%; border: 1px solid var(--wp-border); border-radius: 3px; padding: 6px 8px;
  font: inherit; color: var(--wp-text); background: #fff;
}
.ed-field input:focus, .ed-field textarea:focus, .ed-field select:focus, .form-input:focus {
  outline: none; border-color: var(--wp-accent); box-shadow: 0 0 0 1px var(--wp-accent);
}
.ed-field textarea { resize: vertical; }
.ed-field-check { flex-direction: row; align-items: center; gap: 8px; }
.ed-field-check span { font-weight: 400; }
.ed-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ed-array { border: 1px solid var(--wp-border-soft); border-radius: 3px; padding: 8px; background: #f6f7f7; margin-bottom: 10px; }
.ed-array-title { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--wp-muted); margin-bottom: 6px; }
.ed-array-item { background: #fff; border: 1px solid var(--wp-border-soft); border-radius: 3px; padding: 8px; margin-bottom: 6px; }
.ed-array-item-head { display: flex; align-items: center; gap: 3px; justify-content: flex-end; margin-bottom: 4px; }
.ed-array-item-head .muted { margin-right: auto; font-size: 12px; }
.ed-array-add { width: 100%; }
.ed-iconbtn {
  border: 1px solid var(--wp-border); background: #fff; border-radius: 3px; width: 28px; height: 28px;
  cursor: pointer; font-size: 13px; line-height: 1; display: inline-grid; place-items: center; color: var(--wp-text);
}
.ed-iconbtn:hover { border-color: var(--wp-accent); color: var(--wp-accent); }
.ed-iconbtn.danger:hover { border-color: var(--wp-error); color: var(--wp-error); background: #fcf0f1; }
.ed-image-ctrl { display: flex; flex-direction: column; gap: 6px; }
.ed-image-preview {
  border: 1px solid var(--wp-border); border-radius: 3px; background: #f6f7f7; min-height: 70px;
  display: grid; place-items: center; overflow: hidden; padding: 4px;
}
.ed-image-preview img { max-width: 100%; max-height: 140px; border-radius: 2px; display: block; }
.ed-image-btns { display: flex; gap: 6px; flex-wrap: wrap; }
/* Barra de formato ligera sobre textareas HTML/Markdown */
.ed-rt { display: flex; flex-direction: column; }
.ed-rtbar { display: flex; gap: 3px; margin-bottom: 4px; flex-wrap: wrap; }
.ed-rtbtn {
  min-width: 30px; height: 28px; padding: 0 7px; border: 1px solid var(--wp-border); background: #f6f7f7;
  border-radius: 3px; cursor: pointer; font-size: 13px; font-weight: 700; color: var(--wp-text); line-height: 1;
}
.ed-rtbtn:hover { border-color: var(--wp-accent); color: var(--wp-accent); background: #fff; }
.ed-rtbtn.it { font-style: italic; font-weight: 500; }

/* ── Editor de entradas (clásico de WP: título + cuerpo + cajas laterales) ── */
.post-editor { display: grid; grid-template-columns: 1fr 280px; gap: 20px; align-items: start; max-width: 1200px; }
.post-editor-main { min-width: 0; }
.post-title-input {
  width: 100%; padding: 8px 10px; font-size: 1.7em; line-height: 1.2; border: 1px solid var(--wp-border);
  border-radius: 3px; background: #fff; font-family: inherit; color: var(--wp-head); margin-bottom: 6px;
}
.post-title-input:focus { outline: none; border-color: var(--wp-accent); box-shadow: 0 0 0 1px var(--wp-accent); }
.post-permalink { margin: 0 0 10px; font-size: 13px; }
.post-body-box textarea { min-height: 380px; font-family: Consolas, Monaco, monospace; font-size: 13px; line-height: 1.6; }
.post-side .postbox + .postbox { margin-top: 16px; }
.misc-pub-section { padding: 6px 0; border-bottom: 1px solid var(--wp-border-soft); font-size: 13px; }
.misc-pub-section:last-of-type { border-bottom: 0; }
.misc-pub-section select, .misc-pub-section input[type="date"] {
  font: inherit; padding: 3px 6px; border: 1px solid var(--wp-border); border-radius: 3px;
}
.publishing-actions { display: flex; justify-content: space-between; align-items: center; padding-top: 10px; }
.cat-list { margin: 0; padding: 0; list-style: none; max-height: 170px; overflow: auto; display: flex; flex-direction: column; gap: 5px; }
.cat-list label { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.featured-preview { margin-top: 8px; }
.featured-preview img { max-width: 100%; border-radius: 2px; display: block; }

/* ── Biblioteca de medios ──────────────────────────────────────────────────── */
/* Carpetas de la biblioteca de medios: barra de filtro + destino de subida. */
.media-bar { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; justify-content: space-between; margin: 0 0 16px; }
.media-folders { display: flex; flex-wrap: wrap; gap: 8px; }
.media-folder-chip {
  border: 1px solid var(--wp-border); background: #fff; color: var(--wp-text);
  border-radius: 999px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; line-height: 1.2;
}
.media-folder-chip:hover { border-color: var(--wp-accent); color: var(--wp-accent); }
.media-folder-chip.active { background: var(--wp-accent); border-color: var(--wp-accent); color: #fff; }
.media-folder-chip:focus-visible { outline: 2px solid var(--wp-accent); outline-offset: 2px; }
.media-upload-folder { font-size: 13px; color: var(--wp-muted); }
.media-upload-folder input { width: 130px; margin-left: 6px; }
#media-modal-folders { margin-bottom: 12px; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.media-item {
  border: 1px solid var(--wp-border); background: #fff; border-radius: 2px; cursor: pointer;
  display: flex; flex-direction: column; overflow: hidden; padding: 0; font: inherit; text-align: left;
}
.media-item:hover, .media-item:focus { outline: 2px solid var(--wp-accent); outline-offset: -2px; }
.media-item img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; background: #f6f7f7; }
.media-item .media-name {
  padding: 5px 7px; font-size: 11px; color: var(--wp-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* Documentos: no hay miniatura, así que el "icono" es la extensión en grande. */
.media-doc-ico {
  width: 100%; aspect-ratio: 1; display: grid; place-items: center;
  background: #f6f7f7; border-bottom: 1px solid var(--wp-border);
  font-size: 15px; font-weight: 700; letter-spacing: 0.04em; color: var(--wp-muted);
}
.media-item-doc .media-doc-ico { color: var(--wp-accent); }
/* Campo de documento en los formularios (control "doc"). */
.ed-doc-state {
  padding: 8px 10px; background: #f6f7f7; border: 1px solid var(--wp-border);
  border-radius: 2px; font-size: 12px; margin-bottom: 6px;
}
.ed-doc-file { font-weight: 600; }

/* ── Fechas de inicio ──────────────────────────────────────────────────────── */
.intake-summary { display: flex; flex-wrap: wrap; gap: 28px; }
.intake-stat { display: flex; flex-direction: column; gap: 2px; }
.intake-stat-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--wp-muted); }
.intake-stat-value { font-size: 20px; color: var(--wp-head); }
.intake-warn { color: var(--wp-error); font-weight: 600; }
.intake-year { margin: 16px 0 8px; font-size: 13px; color: var(--wp-muted); }
.intake-year:first-child { margin-top: 0; }
.intake-row { display: flex; flex-wrap: wrap; gap: 8px; }
.intake-chip {
  display: flex; align-items: center; gap: 4px; padding: 3px 4px 3px 8px;
  border: 1px solid var(--wp-border); border-radius: 2px; background: #fff;
}
/* Una fecha ya pasada sigue siendo válida (histórico), pero se distingue de las
   que el sitio está anunciando. El borde discontinuo hace de señal no cromática;
   bajar la opacidad del bloque entero rompería el contraste del texto. */
.intake-chip.is-past { background: #f6f7f7; border-style: dashed; }
.intake-chip.is-past .intake-date { color: var(--wp-muted); }
.intake-date { border: 0; padding: 2px; font: inherit; background: transparent; color: inherit; }
.intake-date:focus { outline: 2px solid var(--wp-accent); outline-offset: 1px; }
.intake-del {
  border: 0; background: transparent; cursor: pointer; color: var(--wp-muted);
  font-size: 13px; line-height: 1; padding: 4px 5px; border-radius: 2px;
}
.intake-del:hover { background: var(--wp-error); color: #fff; }
.intake-del:focus-visible { outline: 2px solid var(--wp-accent); outline-offset: 1px; }
/* Celda: envuelve la imagen + su casilla de selección (acciones en lote). */
.media-cell { position: relative; }
.media-cell.selected .media-item { outline: 3px solid var(--wp-accent); outline-offset: -3px; }
.media-check {
  position: absolute; top: 6px; left: 6px; width: 18px; height: 18px; margin: 0; cursor: pointer;
  opacity: 0; transition: opacity 0.12s; z-index: 2; accent-color: var(--wp-accent);
  background: #fff; border-radius: 3px; box-shadow: 0 0 0 2px rgba(255,255,255,0.85);
}
.media-cell:hover .media-check, .media-check:focus-visible, .media-cell.selected .media-check { opacity: 1; }
/* Barra de acciones en lote: aparece al marcar imágenes. */
.media-selbar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 8px 12px; margin: 0 0 12px; border: 1px solid var(--wp-border);
  border-radius: 3px; background: #fff8e5;
}
.media-selcount { color: var(--wp-text); }
/* Renombrar imagen (formulario en línea del panel de detalle). */
.media-rename { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--wp-border); }
.media-rename-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
.media-rename-row .form-input { flex: 1; min-width: 160px; }
/* Rejilla resaltada al arrastrar imágenes encima. */
.media-grid.dragover {
  outline: 2px dashed var(--wp-accent); outline-offset: 4px; border-radius: 4px;
  background: rgba(34, 113, 177, 0.05);
}

/* ── Marca (guía IA): slots de medida de imagen ──────────────────────────────── */
.brand-slots { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.brand-slot { display: grid; grid-template-columns: 1.4fr 1.1fr 1.4fr auto; gap: 8px; align-items: center; width: 100%; }
@media (max-width: 640px) { .brand-slot { grid-template-columns: 1fr; } }
.brand-objlist { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; width: 100%; }
.brand-objrow { display: flex; gap: 8px; align-items: center; width: 100%; }
.brand-objrow .form-input { flex: 1; min-width: 0; }
.brand-objrow .form-input.grow { flex: 2; }
@media (max-width: 640px) { .brand-objrow { flex-wrap: wrap; } }

/* ── Equipo y acceso ─────────────────────────────────────────────────────────── */
.team-list{ margin:6px 0 0; padding-left:18px; }
.team-list li{ margin:6px 0; }
.team-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.team-chip{ background:#eef1f8; border:1px solid var(--wp-border); border-radius:999px; padding:3px 10px; font-size:13px; }
.ed-tag.tag-admin{ background:var(--wp-accent); color:#fff; }

/* ── Chuleta de atajos de teclado ────────────────────────────────────────────── */
.sc-back{ position:fixed; inset:0; background:rgba(1,21,74,.55); display:grid; place-items:center; padding:24px; z-index:1100; }
.sc-box{ background:#fff; border-radius:12px; width:min(460px,100%); padding:18px 20px 20px; box-shadow:0 24px 70px -14px rgba(1,21,74,.5); }
.sc-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.sc-head h2{ margin:0; font-size:18px; color:var(--wp-head); }
.sc-table{ width:100%; border-collapse:collapse; }
.sc-table td{ padding:8px 0; border-top:1px solid var(--wp-border-soft); font-size:14px; vertical-align:middle; }
.sc-table tr:first-child td{ border-top:0; }
.sc-keys{ text-align:right; white-space:nowrap; }
.sc-plus{ color:var(--wp-muted); margin:0 4px; }
.sc-foot{ margin:12px 0 0; font-size:12px; }
kbd{ display:inline-block; min-width:20px; text-align:center; padding:2px 6px; font:600 12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;
  color:var(--wp-head); background:#f4f6fb; border:1px solid var(--wp-border); border-bottom-width:2px; border-radius:5px; }

/* ── Vista previa de entrada (artículo en iframe) ────────────────────────────── */
.pv-open{ width:100%; margin:4px 0 10px; }
.pv-back{ position:fixed; inset:0; background:rgba(1,21,74,.55); display:grid; place-items:center; padding:24px; z-index:1100; }
.pv-shell{ background:#fff; border-radius:12px; width:min(860px,100%); height:min(88vh,900px); display:flex; flex-direction:column; overflow:hidden; box-shadow:0 24px 70px -14px rgba(1,21,74,.5); }
.pv-bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; border-bottom:1px solid var(--wp-border-soft); }
.pv-bar-title{ font-weight:600; color:var(--wp-head); }
.pv-frame{ flex:1; width:100%; border:0; background:#fff; }

/* ── Modales ───────────────────────────────────────────────────────────────── */
.wp-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: grid; place-items: center; padding: 24px; z-index: 1000; }
.wp-modal-card {
  background: #fff; border-radius: 4px; width: min(560px, 100%); max-height: 84vh; overflow: auto;
  padding: 16px; box-shadow: 0 5px 30px rgba(0,0,0,0.3);
}
.wp-modal-wide { width: min(940px, 100%); }
.wp-modal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; gap: 10px; }
.wp-modal-head-actions { display: flex; gap: 6px; }
.wp-modal-search {
  width: 100%; padding: 7px 10px; margin-bottom: 10px; border: 1px solid var(--wp-border); border-radius: 3px; font: inherit;
}
.ed-picker-list { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.ed-picker-item {
  display: flex; flex-direction: column; gap: 3px; text-align: left; border: 1px solid var(--wp-border);
  background: #f6f7f7; border-radius: 6px; padding: 9px 10px; cursor: pointer; font: inherit; font-size: 13px;
}
.ed-picker-item:hover { border-color: var(--wp-accent); background: #fff; box-shadow: 0 2px 8px rgba(1,21,74,.08); }
/* Selector visual de bloques (galería): miniatura wireframe arriba, texto abajo. */
.bp-card { gap: 7px; }
.bp-thumb { width: 100%; height: auto; display: block; border: 1px solid #e0e6f2; border-radius: 4px; }
.bp-meta { display: flex; flex-direction: column; gap: 2px; }
.ed-picker-desc { font-size: 12px; font-weight: 400; color: var(--wp-muted); line-height: 1.35; }

/* .ed-tag: etiqueta pequeña ("borrador", "actual"…) usada en varias pantallas. */
.ed-tag {
  font-size: 10px; font-weight: 700; text-transform: uppercase; background: var(--wp-border-soft);
  color: var(--wp-muted); border-radius: 2px; padding: 1px 5px;
}

/* ── Apariencia ────────────────────────────────────────────────────────────── */
.theme-editor { max-width: 760px; }
.theme-grad-preview { height: 56px; border-radius: 3px; border: 1px solid var(--wp-border); margin-bottom: 10px; }
.theme-stops { display: flex; flex-direction: column; gap: 6px; }
.theme-stop { display: flex; gap: 6px; align-items: center; }
.theme-stop input[type="color"] { width: 44px; height: 30px; padding: 1px; border: 1px solid var(--wp-border); border-radius: 3px; background: #fff; cursor: pointer; }
.theme-stop input[type="number"] { width: 76px; }
.color-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.color-row input[type="color"] { width: 44px; height: 30px; padding: 1px; border: 1px solid var(--wp-border); border-radius: 3px; background: #fff; cursor: pointer; }

/* ── Asistente IA ──────────────────────────────────────────────────────────── */
.wp-agent { max-width: 860px; }

/* Tarjeta "cómo funciona": el modelo mental en 3 pasos, visible por defecto. */
.ai-intro {
  max-width: 860px; background: #fff; border: 1px solid var(--wp-border-soft);
  border-left: 4px solid var(--wp-accent); border-radius: 4px;
  padding: 16px 20px; margin: 0 0 18px;
}
.ai-intro-head { display: flex; align-items: center; gap: 12px; }
.ai-intro-head h2 { margin: 0; font-size: 16px; font-weight: 600; color: var(--wp-head); }
.ai-intro-x {
  margin-left: auto; border: 1px solid transparent; background: none; cursor: pointer;
  color: var(--wp-muted); font-size: 14px; line-height: 1; border-radius: 3px;
  /* 24×24 mínimo (WCAG 2.2 – 2.5.8 Target Size). */
  min-width: 24px; min-height: 24px;
}
.ai-intro-x:hover { color: var(--wp-error); border-color: var(--wp-border); }
.ai-steps {
  list-style: none; margin: 14px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.ai-steps li { display: grid; grid-template-columns: 26px 1fr; grid-template-rows: auto auto; gap: 2px 10px; }
.ai-step-n {
  grid-row: span 2; width: 26px; height: 26px; border-radius: 50%;
  background: var(--grad); color: #fff; font-weight: 700; font-size: 13px;
  display: grid; place-items: center;
}
.ai-steps b { font-size: 13px; color: var(--wp-head); }
.ai-steps span:not(.ai-step-n) { font-size: 13px; color: var(--wp-muted); line-height: 1.5; }
.ai-intro-foot {
  margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--wp-border-soft);
  font-size: 13px; color: var(--wp-muted);
}

/* Selector de modo: botones de alternancia (aria-pressed), no pestañas falsas. */
.mode { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.ag-modes-lead { font-weight: 600; color: var(--wp-head); margin-right: 4px; }
.mode-btn {
  border: 1px solid var(--wp-border); background: #f6f7f7; color: var(--wp-text);
  border-radius: 3px; padding: 6px 12px; font: inherit; cursor: pointer; min-height: 30px;
}
.mode-btn:hover { border-color: var(--wp-accent); color: var(--wp-accent); }
.mode-btn.active { background: var(--wp-accent); color: #fff; border-color: var(--wp-accent); font-weight: 600; }
/* El estado activo NO se comunica solo con color (WCAG 1.4.1): lleva un ✓. */
.mode-btn.active::before { content: "✓ "; }
.mode-btn:focus-visible { outline: 2px solid var(--wp-accent); outline-offset: 2px; }
.ag-mode-desc {
  margin: 0 0 14px; font-size: 13px; color: var(--wp-muted);
  background: #f6f7f7; border-radius: 3px; padding: 8px 12px;
}

/* Aviso de publicación: qué pasa exactamente al pulsar Enviar. */
.ag-publish-note {
  margin: 12px 0 0; font-size: 13px; color: var(--wp-text); line-height: 1.6;
  background: #fcf9e8; border: 1px solid #f0e2a0; border-radius: 4px; padding: 10px 14px;
}
.ag-publish-ico { color: var(--wp-warning); margin-right: 6px; font-size: 9px; vertical-align: 2px; }

/* Etiqueta del cuadro de texto: visible, no solo un placeholder. */
.ag-prompt-label { display: block; font-weight: 600; color: var(--wp-head); margin-bottom: 5px; }
.wp-agent textarea {
  width: 100%; border: 1px solid var(--wp-border); border-radius: 3px; padding: 10px 12px;
  font: inherit; font-size: 14px; resize: vertical; color: var(--wp-text);
}
.wp-agent textarea:focus { outline: none; border-color: var(--wp-accent); box-shadow: 0 0 0 1px var(--wp-accent); }
.wp-agent .button-primary { margin-top: 10px; }
.log { margin-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.entry {
  padding: 8px 12px; border-radius: 3px; background: #fff; border: 1px solid var(--wp-border-soft);
  font-size: 13px; line-height: 1.5; display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: baseline;
}
/* Rótulo de quién habla / en qué punto va: el texto acompaña al color, nunca
   se queda solo el matiz para distinguir un paso de un error (WCAG 1.4.1). */
.entry-label {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: var(--wp-muted); white-space: nowrap; display: inline-flex; align-items: center; gap: 5px;
}
.entry-ico { font-size: 12px; }
.entry-text { white-space: pre-wrap; }
.entry-link { font-weight: 600; white-space: nowrap; }
.entry-you { background: var(--wp-bar); color: #fff; border-color: var(--wp-bar); }
.entry-you .entry-label { color: #c3c4c7; }
.entry-routed { color: var(--wp-muted); }
.entry-agent { border-left: 4px solid var(--wp-accent-light); }
.entry-step { color: var(--wp-muted); border-style: dashed; }
.entry-pr { border-left: 4px solid var(--wp-success); background: #f4fbf5; }
.entry-pr .entry-label { color: #007017; }
.entry-done { border-left: 4px solid var(--wp-accent); }
.entry-done .entry-text { font-weight: 600; color: var(--wp-head); }
.entry-error { border-left: 4px solid var(--wp-error); color: var(--wp-error); }
.entry-error .entry-label { color: var(--wp-error); }

/* Vacío del registro y "trabajando…": estados con salida, no cajas en blanco. */
.ag-empty {
  border: 1px dashed var(--wp-border); border-radius: 4px; padding: 18px 16px;
  text-align: center; color: var(--wp-muted); font-size: 13px;
  display: flex; flex-direction: column; gap: 4px;
}
.ag-empty b { color: var(--wp-head); font-size: 14px; }
.ag-working {
  display: flex; align-items: center; gap: 9px; padding: 9px 12px; font-size: 13px;
  color: var(--wp-muted); background: #f6f7f7; border-radius: 3px;
}

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 960px) {
  .post-editor { grid-template-columns: 1fr; }
  .dashboard-widgets, .welcome-panel-columns { grid-template-columns: 1fr; }
  .ai-steps, .ba-flow { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 782px) {
  .adminmenu { width: 36px; }
  .menu-label, .collapse-menu, .submenu { display: none; }
  /* Con el menú reducido a iconos, la cabecera de grupo se queda sin sitio: sin
     esto su texto se desborda sobre el contenido (se notaba con el grupo
     "Inteligencia artificial"). Se convierte en un separador, como al plegar. */
  .menu-group { font-size: 0; padding: 8px 0 0; border-top: 1px solid rgba(255,255,255,.1); margin: 8px 8px 0; }
  .menu-badge { position: absolute; top: 4px; right: 2px; margin: 0; }
  .wpbody { margin-left: 36px; }
  .ed-cta, .ed-picker-list { grid-template-columns: 1fr; }
  .ab-user { display: none; }
}

/* ── Asistente: adjuntos y acciones ────────────────────────────────────────── */
/* Sugerencias del asistente: chips clicables que precargan el prompt. Van
   agrupadas por tema para que además sirvan de catálogo de capacidades. */
.ag-suggest { margin: 14px 0 14px; }
.ag-suggest-lead { margin: 0 0 10px; font-size: 13px; color: var(--wp-muted); }
.ag-suggest-group { margin-bottom: 10px; }
.ag-suggest-title {
  margin: 0 0 6px; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em; color: var(--wp-muted);
}
.ag-suggest-row { display: flex; flex-wrap: wrap; gap: 8px; }
.ag-chip {
  border: 1px solid var(--wp-border); background: #fff; color: var(--wp-text);
  border-radius: 999px; padding: 6px 13px; font-size: 13px; cursor: pointer; line-height: 1.3;
  text-align: left; transition: background .12s, border-color .12s;
}
.ag-chip:hover { background: var(--wp-body); border-color: var(--wp-accent); color: var(--wp-accent); }
.ag-chip:focus-visible { outline: 2px solid var(--wp-accent); outline-offset: 2px; }
.ag-actions { display: flex; gap: 8px; margin-top: 10px; align-items: center; flex-wrap: wrap; }
.ag-hint { font-size: 12px; margin-left: auto; }
.ag-hint kbd { background: #fff; border: 1px solid var(--wp-border); border-bottom-width: 2px; border-radius: 3px; padding: 0 5px; font: inherit; font-size: 11px; color: var(--wp-head); }
#ag-prompt, #rd-prompt { resize: vertical; overflow-y: auto; min-height: 52px; transition: height .05s; }
.btn-ico { display: inline-flex; margin-right: 4px; }
.btn-ico svg { width: 16px; height: 16px; fill: currentColor; }
.ag-attach-list { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; }
.ag-attach-chip {
  display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--wp-border);
  background: #fff; border-radius: 3px; padding: 3px 6px; font-size: 12px;
}
.ag-attach-chip img { width: 28px; height: 28px; object-fit: cover; border-radius: 2px; }
.ag-attach-x { border: 0; background: none; cursor: pointer; color: var(--wp-muted); font-size: 12px; }
.ag-attach-x:hover { color: var(--wp-error); }
.wp-agent .log { margin-top: 0; margin-bottom: 12px; max-height: 420px; overflow-y: auto; }

/* ── Estado del sitio (deploy) ─────────────────────────────────────────────── */
/* Estado del build dentro de una línea "Publicado" del chat del asistente. */
.ag-deploy { display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; }
.deploy-ok { color: var(--wp-success); }
.deploy-pending { color: var(--wp-warning); }
.deploy-fail { color: var(--wp-error); }

/* ── Vista previa Markdown del editor de entradas ──────────────────────────── */
.md-tabs { display: inline-flex; gap: 2px; }
.md-tab {
  border: 1px solid var(--wp-border); background: #f6f7f7; padding: 3px 10px; font: inherit;
  font-size: 12px; cursor: pointer; color: var(--wp-muted); border-radius: 3px;
}
.md-tab.current { background: #fff; color: var(--wp-head); font-weight: 600; }
.md-preview { font-size: 14px; line-height: 1.7; color: var(--wp-text); padding: 4px 2px; }
.md-preview h2, .md-preview h3, .md-preview h4 { color: var(--wp-head); margin: 1em 0 0.4em; }
.md-preview p { margin: 0 0 0.8em; }
.md-preview blockquote { border-left: 4px solid var(--wp-border); margin: 0 0 0.8em; padding: 4px 12px; color: var(--wp-muted); }
.md-preview ul, .md-preview ol { margin: 0 0 0.8em; padding-left: 1.4em; }
.md-preview code { background: #f0f0f1; border-radius: 2px; padding: 1px 4px; font-size: 13px; }

/* ── Enlace permanente editable (entradas nuevas) ──────────────────────────── */
.post-slug-input { width: auto; min-width: 180px; display: inline-block; padding: 2px 6px; font-size: 13px; }

/* ── Revisiones ────────────────────────────────────────────────────────────── */
.revisions-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.revisions-list li { display: flex; flex-direction: column; gap: 1px; border-bottom: 1px solid var(--wp-border-soft); padding-bottom: 6px; }
.revisions-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.rev-when { font-weight: 600; font-size: 12px; color: var(--wp-head); }
.rev-msg { font-size: 12px; }
.rev-load { cursor: pointer; font-size: 12px; align-self: flex-start; }

/* ── Gestor de categorías ──────────────────────────────────────────────────── */
.cat-manage { margin: 0 0 12px; padding: 0; list-style: none; display: flex; flex-direction: column; }
.cat-manage-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--wp-border-soft); }
.cat-manage-row .cat-name { font-weight: 600; color: var(--wp-head); flex: 1; }
.cat-add { display: flex; gap: 8px; }
.cat-add input { flex: 1; }

/* ═══════════════════════════════════════════════════════════════════════════
   Editor VISUAL de páginas (lienzo WYSIWYG) — reemplaza la lista de bloques +
   panel de campos por una vista fiel de la página editable in-situ.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
  --ink: #01154a;
  --brand-blue:#3a4fe3; --brand-orchid:#a93fc4; --brand-pink:#f0617e;
  --grad-iidea: linear-gradient(162deg, var(--brand-blue), var(--brand-orchid), var(--brand-pink));
}
.vc-shell{ max-width:1180px; margin:0 auto; }
.vc-topbar{
  position:sticky; top:var(--bar-h); z-index:20; display:flex; align-items:center; gap:10px;
  background:#fff; border:1px solid var(--wp-border-soft); border-radius:10px;
  padding:9px 12px; margin-bottom:12px; box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.vc-crumb{ font-weight:600; color:var(--wp-head); font-size:14px; }
.vc-crumb small{ color:var(--wp-muted); font-weight:400; margin-left:6px; }
.vc-spacer{ flex:1; }
/* Grupo Deshacer/Rehacer: dos botones con icono unidos, junto al título. */
.vc-undoredo{ display:inline-flex; gap:2px; margin-left:6px; }
.vc-undoredo .button{ min-width:32px; padding:4px 8px; font-size:15px; line-height:1; }
.vc-undoredo .button:disabled{ opacity:.4; cursor:default; }
.vc-device{
  background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 10px 40px -12px rgba(1,21,74,.28), 0 2px 8px rgba(1,21,74,.06);
  border:1px solid #e7e9f2;
}
.vc-hint{ text-align:center; color:var(--wp-muted); margin:14px 0 4px; }

/* ── Editor visual de carreras (encabezado editable + secciones) ───────────── */
/* El hero reproduce la cabecera real: banner de fondo (overlay oscuro) + texto
   encima; sin banner, fondo navy como en el sitio. */
.cv-hero{ position:relative; min-height:290px; display:flex; flex-direction:column; justify-content:flex-end; gap:9px; background:#01154a; background-size:cover; background-position:center; color:#fff; padding:32px; }
.cv-hero.has-banner::before{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(1,10,40,.94), rgba(1,10,40,.55) 55%, rgba(1,10,40,.35)); }
.cv-hero-body{ position:relative; z-index:1; display:flex; flex-direction:column; gap:8px; max-width:620px; }
.cv-eyebrow{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#9db4ff; }
.cv-title{ font-size:30px; font-weight:800; line-height:1.08; letter-spacing:-.02em; }
.cv-tagline{ font-size:16px; color:#dbe4ff; font-weight:500; }
.cv-desc{ font-size:14px; color:#dbe1ee; line-height:1.55; }
.cv-hero [data-edit]{ border-radius:6px; padding:2px 4px; margin:-2px -4px; transition:box-shadow .12s, background .12s; }
.cv-hero [data-edit]:hover{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.22); }
.cv-hero [data-edit]:focus{ outline:none; box-shadow:inset 0 0 0 2px rgba(157,180,255,.75); background:rgba(0,0,0,.25); }
.cv-hero [data-edit][data-ph]:empty::before{ content:attr(data-ph); color:rgba(255,255,255,.55); }
.cv-banner-btn{ position:absolute; top:14px; left:14px; z-index:2; }
/* Imagen de tarjeta: slot pequeño y rotulado (arriba a la derecha). */
.cv-hero-card{ position:absolute; top:14px; right:14px; z-index:2; width:150px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); border-radius:10px; padding:8px; }
.cv-hero-card-cap{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:rgba(255,255,255,.85); margin-bottom:6px; text-align:center; }
.cv-img{ position:relative; }
.cv-img img{ width:100%; border-radius:8px; display:block; aspect-ratio:1/1; object-fit:cover; background:rgba(255,255,255,.08); }
.cv-hero-card .cv-img-btn{ position:static; width:100%; margin-top:6px; }
.cv-img-empty{ width:100%; padding:18px 10px; border:1px dashed rgba(255,255,255,.45); background:rgba(255,255,255,.06); color:#fff; border-radius:8px; cursor:pointer; font-size:12px; }
.cv-section{ background:#fff; border-top:1px solid var(--wp-border-soft); }
.cv-section-head{ font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--wp-head); padding:12px 18px; background:var(--wp-body); border-bottom:1px solid var(--wp-border-soft); }
.cv-section-body{ padding:16px 18px; }
.cv-vis{ display:inline-flex; align-items:center; }
.cv-vis .cv-dot{ width:8px; height:8px; border-radius:50%; background:var(--wp-success); margin-right:6px; }
.cv-vis.is-hidden{ color:var(--wp-muted); }
.cv-vis.is-hidden .cv-dot{ background:var(--wp-muted); }
@media (max-width:782px){
  .cv-hero{ padding:20px 16px 16px; min-height:0; }
  .cv-title{ font-size:23px; }
  .cv-hero-card{ position:static; width:100%; margin-top:14px; display:flex; align-items:center; gap:10px; }
  .cv-hero-card-cap{ margin:0; text-align:left; }
  .cv-hero-card .cv-img{ width:64px; flex:0 0 64px; }
  .cv-hero-card .cv-img-btn{ position:absolute; }
  .cv-banner-btn{ position:static; align-self:flex-start; margin-bottom:12px; }
}

/* ── Ajustes del sitio: editor de navegación + barra de guardado ────────────── */
.nav-editor{ display:flex; flex-direction:column; gap:12px; }
.nav-item-card{ border:1px solid var(--wp-border); border-radius:6px; padding:12px; background:var(--wp-body); }
.nav-item-head{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.nav-item-head .form-input{ flex:1; min-width:120px; }
.nav-item-head .form-input:first-child{ flex:0 0 190px; max-width:190px; }
.nav-move{ padding:2px 9px; text-decoration:none; }
/* El primero no sube y el último no baja: la flecha se apaga en vez de no hacer nada. */
.nav-move:disabled{ opacity:.35; cursor:default; }
.nav-careers{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--wp-muted); margin:9px 0 2px; }
.nav-children{ margin:6px 0 0 16px; padding-left:12px; border-left:2px solid var(--wp-border-soft); display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.nav-child-row{ display:flex; gap:6px; align-items:center; width:100%; }
.nav-child-row .form-input{ flex:1; }
.settings-save{ position:sticky; bottom:0; background:#f0f0f1; padding:14px 0; margin-top:10px; border-top:1px solid var(--wp-border); }

/* ── Automatización del blog ───────────────────────────────────────────────── */
.ba-sub{ margin:-2px 0 12px; font-size:13px; }
/* Encuadre de la pantalla de Marca: para qué sirve rellenar todo esto. */
.brand-why {
  background: #fff; border: 1px solid var(--wp-border-soft); border-left: 4px solid var(--wp-accent);
  border-radius: 4px; padding: 16px 20px; margin: 0 0 18px; max-width: 900px;
}
.brand-why h2 { margin: 0 0 8px; font-size: 16px; font-weight: 600; color: var(--wp-head); }
.brand-why p { margin: 0 0 8px; font-size: 13px; line-height: 1.6; }
.brand-why-note { color: var(--wp-muted); margin-bottom: 0 !important; }

/* "Qué hace, paso a paso": el recorrido completo del bot, siempre visible. */
.ba-howto {
  background: #fff; border: 1px solid var(--wp-border-soft); border-left: 4px solid var(--wp-accent);
  border-radius: 4px; padding: 16px 20px; margin: 0 0 18px;
}
.ba-howto h2 { margin: 0 0 14px; font-size: 16px; font-weight: 600; color: var(--wp-head); }
.ba-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.ba-flow li { display: grid; grid-template-columns: 26px 1fr; grid-template-rows: auto auto; gap: 2px 10px; }
.ba-flow-n {
  grid-row: span 2; width: 26px; height: 26px; border-radius: 50%;
  background: var(--grad); color: #fff; font-weight: 700; font-size: 13px;
  display: grid; place-items: center;
}
.ba-flow b { font-size: 13px; color: var(--wp-head); }
.ba-flow span:not(.ba-flow-n) { font-size: 12px; color: var(--wp-muted); line-height: 1.5; }
.ba-howto-safe {
  margin: 16px 0 0; padding: 10px 14px; font-size: 13px; line-height: 1.6;
  background: #f4fbf5; border: 1px solid #b8e6c1; border-radius: 4px; color: var(--wp-text);
}
.ba-progress { border: 1px solid var(--wp-border); border-radius: 4px; padding: 12px 16px; margin: 0 0 18px; background: #fff; }
.ba-progress-head { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-weight: 600; }
.ba-progress-log { max-height: 220px; overflow: auto; border: 1px solid var(--wp-border-soft); border-radius: 4px; padding: 8px 10px; background: var(--wp-body); }
.ba-status { border: 1px solid var(--wp-border); border-radius: 4px; padding: 12px 16px; margin: 0 0 18px; background: #fff; }
.ba-status.ok { border-left: 4px solid var(--wp-success); }
.ba-status.warn { border-left: 4px solid var(--wp-warning, #dba617); background: #fffbeb; }
.ba-status-line { margin: 0 0 6px; font-size: 14px; }
.ba-toggle{ display:inline-flex; align-items:center; gap:9px; font-weight:600; cursor:pointer; padding:8px 12px; border:1px solid var(--wp-border); border-radius:6px; margin-bottom:14px; }
.ba-toggle.on{ border-color:var(--wp-success); background:rgba(0,163,42,.07); }
.ba-days{ display:flex; flex-wrap:wrap; gap:6px; }
.ba-day{ display:inline-flex; align-items:center; gap:5px; border:1px solid var(--wp-border); border-radius:999px; padding:5px 11px; font-size:13px; cursor:pointer; user-select:none; }
.ba-day.on{ background:var(--wp-accent); border-color:var(--wp-accent); color:#fff; }
.ba-day input{ margin:0; }
.ba-list, .ba-notify-list{ display:flex; flex-direction:column; gap:8px; align-items:flex-start; width:100%; }
.ba-topic{ width:100%; }
.ba-gear{ font-size:15px; line-height:1; opacity:.55; }
.ba-gear:hover{ opacity:1; }
.ba-gear.on{ opacity:1; color:var(--wp-accent); }
.ba-topic-adv{ margin:6px 0 10px 4px; padding:10px 12px; border:1px solid var(--wp-border); border-left:3px solid var(--wp-accent); border-radius:6px; background:#fff; width:100%; }
.ba-row{ display:flex; gap:6px; align-items:center; width:100%; }
.ba-row .form-input{ flex:1; }
.ba-cards{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.ba-card{ border:1px solid var(--wp-border); border-radius:6px; padding:12px; background:var(--wp-body); width:100%; }
.ba-card-head{ display:flex; gap:8px; align-items:center; }
.ba-card-head .form-input{ flex:1; }
.ba-check{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--wp-muted); margin:9px 0; }
.ba-opts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.ba-opt .ed-field-label{ font-size:12px; }
@media (max-width:600px){ .ba-opts{ grid-template-columns:1fr; } }
/* Analizar competencia (huecos de temas) */
.ba-analyze{ margin-top:12px; }
.ba-gaps{ margin-top:12px; padding:12px 14px; border:1px solid var(--wp-border); border-radius:6px; background:#fff; }
.ba-gap-chips{ display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 4px; }
.ba-gap-chip{ border:1px dashed var(--wp-accent); color:var(--wp-accent); background:rgba(34,113,177,.06); border-radius:999px; padding:5px 11px; font-size:13px; font-weight:600; cursor:pointer; }
.ba-gap-chip:hover{ background:var(--wp-accent); color:#fff; }
.ba-gap-chip:disabled{ opacity:.5; cursor:default; border-style:solid; }
.ba-comp-list{ margin:12px 0 0; padding-left:18px; }
.ba-comp-list > li{ margin:6px 0; }
.ba-titles{ margin:4px 0 0; padding-left:16px; color:var(--wp-muted); font-size:13px; }
/* Estimación de volumen/consumo */
.ba-estimate p{ margin:2px 0; }

/* ── Cola de revisión (borradores auto-generados) ──────────────────────────── */
.review-list{ display:flex; flex-direction:column; gap:14px; }
.review-empty{ padding:28px; text-align:center; background:#fff; border:1px solid var(--wp-border); border-radius:6px; display:flex; flex-direction:column; gap:6px; }
.review-empty b{ color:var(--wp-head); font-size:14px; }
.review-card{ display:flex; gap:18px; justify-content:space-between; align-items:flex-start; background:#fff; border:1px solid var(--wp-border); border-left:4px solid var(--wp-accent); border-radius:6px; padding:16px 18px; }
.review-thumb{ flex:0 0 112px; width:112px; height:70px; border-radius:4px; overflow:hidden; background:#eef1f8; display:block; }
.review-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.review-thumb-empty{ border:1px dashed var(--wp-border); }
.review-main{ min-width:0; flex:1; }
.review-badges{ display:flex; align-items:center; gap:10px; margin-bottom:4px; font-size:12px; }
.review-topic{ background:var(--wp-accent); color:#fff; border-radius:999px; padding:2px 10px; font-weight:600; font-size:11px; }
.review-card h2{ margin:2px 0 6px; font-size:17px; color:var(--wp-head); }
.review-excerpt{ margin:0; color:var(--wp-muted); font-size:13.5px; line-height:1.5; }
.review-actions{ display:flex; flex-direction:column; gap:7px; flex:0 0 auto; align-items:stretch; }
.review-actions .button{ text-align:center; white-space:nowrap; }
.review-actions .button-link-delete{ font-size:12px; }
@media (max-width:640px){ .review-card{ flex-direction:column; } .review-actions{ flex-direction:row; flex-wrap:wrap; } }

/* Detalle de un par: vista previa + chat, antes de publicar. */
.review-detail{
  display:grid; grid-template-columns: 1fr 1fr; gap:18px; align-items:start;
}
.rd-preview, .rd-chat{
  background:#fff; border:1px solid var(--wp-border); border-radius:6px; padding:16px 18px;
  min-width:0;
}
.rd-cover-wrap{ margin:0 0 12px; }
.rd-cover{ width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:6px; display:block; background:#eef1f8; }
.rd-cover-empty{ display:grid; place-items:center; color:var(--wp-muted); font-size:13px; border:1px dashed var(--wp-border); }
.rd-badges{ display:flex; align-items:center; gap:10px; margin-bottom:10px; font-size:12px; flex-wrap:wrap; }
.rd-tabs{ display:inline-flex; gap:2px; margin-bottom:10px; }
.rd-tab{
  border:1px solid var(--wp-border); background:#f6f7f7; padding:4px 12px; font:inherit;
  font-size:12px; cursor:pointer; color:var(--wp-muted); border-radius:3px;
}
.rd-tab.current{ background:#fff; color:var(--wp-head); font-weight:600; }
.rd-title{ margin:0 0 8px; font-size:22px; line-height:1.25; color:var(--wp-head); }
.rd-excerpt{ margin:0 0 14px; color:var(--wp-muted); font-size:14px; line-height:1.5; }
.rd-seo{ margin:-6px 0 14px; font-size:12.5px; color:var(--wp-muted); }
.rd-seo code{ font-size:12px; }
.rd-body{ font-size:14px; line-height:1.7; }
.rd-checks{ margin:0 0 14px; padding:10px 12px; background:#f6f7f7; border:1px solid var(--wp-border); border-radius:6px; }
.rd-checks h3{ margin:0 0 8px; font-size:13px; display:flex; justify-content:space-between; gap:8px; }
.rd-checks ul{ margin:0; padding:0; list-style:none; display:grid; gap:4px; }
.rd-checks li{ font-size:12.5px; padding-left:18px; position:relative; }
.rd-checks li::before{ position:absolute; left:0; }
.rd-checks li.ok{ color:#007017; }
.rd-checks li.ok::before{ content:"✓"; }
.rd-checks li.fail{ color:#b32d2e; }
.rd-checks li.fail::before{ content:"✗"; }
.rd-checks li.warn{ color:#9d6b00; }
.rd-checks li.warn::before{ content:"!"; }
.rd-checks p{ margin:8px 0 0; font-size:12px; }
.rd-faq{ margin:16px 0 0; padding-top:12px; border-top:1px solid var(--wp-border); }
.rd-faq h3{ margin:0 0 8px; font-size:13px; }
.rd-faq ul{ margin:0; padding:0; list-style:none; display:grid; gap:8px; }
.rd-faq li p{ margin:4px 0 0; color:var(--wp-muted); font-size:13px; line-height:1.45; }
.review-seogeo{ font-size:11px; font-weight:600; padding:2px 7px; border-radius:999px; }
.review-seogeo.ok{ background:#f4fbf5; color:#007017; }
.review-seogeo.warn{ background:#fff6e5; color:#9d6b00; }
.review-seogeo.fail{ background:#fcf0f1; color:#b32d2e; }
.rd-chat .log{ margin-top:0; margin-bottom:12px; max-height:420px; overflow-y:auto; }
.rd-chat textarea{
  width:100%; border:1px solid var(--wp-border); border-radius:3px; padding:10px 12px;
  font:inherit; font-size:14px; resize:vertical; color:var(--wp-text);
}
.rd-chat textarea:focus{ outline:none; border-color:var(--wp-accent); box-shadow:0 0 0 1px var(--wp-accent); }
.rd-bar{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  margin-top:16px; padding:12px 16px; background:#fff;
  border:1px solid var(--wp-border); border-radius:6px;
}
.entry-saved{ border-left:4px solid var(--wp-success); background:#f4fbf5; }
.entry-saved .entry-label{ color:#007017; }
@media (max-width:960px){ .review-detail{ grid-template-columns:1fr; } }

.vc-block{ position:relative; }
.vc-block .vc-outline{ position:absolute; inset:0; pointer-events:none; z-index:6; box-shadow:inset 0 0 0 0 transparent; transition:box-shadow .12s; }
.vc-block:hover .vc-outline{ box-shadow:inset 0 0 0 2px rgba(34,113,177,.45); }
.vc-block.sel .vc-outline{ box-shadow:inset 0 0 0 2px var(--wp-accent); }
.vc-chip{
  position:absolute; top:8px; left:8px; z-index:8; display:none; align-items:center; gap:6px;
  background:var(--wp-bar); color:#fff; font-size:11px; font-weight:600; padding:3px 9px;
  border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.vc-chip .vc-drag{ cursor:grab; opacity:.7; }
.vc-chip .vc-drag:active{ cursor:grabbing; }
.vc-block:hover .vc-chip, .vc-block.sel .vc-chip{ display:inline-flex; }
.vc-tools{
  position:absolute; top:8px; right:8px; z-index:8; display:none; gap:2px;
  background:#fff; border:1px solid var(--wp-border-soft); border-radius:8px; padding:2px;
  box-shadow:0 2px 8px rgba(0,0,0,.14);
}
.vc-block:hover .vc-tools, .vc-block.sel .vc-tools{ display:flex; }
.vc-tools button{ border:0; background:transparent; width:26px; height:26px; border-radius:6px; cursor:pointer; font-size:13px; color:var(--wp-text); display:grid; place-items:center; }
.vc-tools button:hover{ background:var(--wp-body); }
.vc-tools button.danger:hover{ background:#fce8e8; color:var(--wp-error); }
.vc-block.is-hidden{ opacity:.42; }
.vc-hidden-tag{ position:absolute; top:8px; left:50%; transform:translateX(-50%); z-index:8; background:#fff3cd; color:#7a5c00; border:1px solid #f2e0a0; font-size:11px; font-weight:600; padding:2px 8px; border-radius:20px; }
.vc-block.drop-before .vc-outline{ box-shadow:inset 0 4px 0 0 var(--wp-accent); }
.vc-block.drop-after .vc-outline{ box-shadow:inset 0 -4px 0 0 var(--wp-accent); }
.vc-block.dragging{ opacity:.4; }

.vc-layoutbar{
  position:sticky; top:calc(var(--bar-h) + 56px); z-index:15; display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  background:#fff; border:1px solid var(--wp-accent); border-radius:10px; padding:7px 10px; margin-bottom:12px;
  box-shadow:0 3px 10px rgba(34,113,177,.14);
}
.vc-layoutbar .lb-title{ font-weight:700; font-size:12px; color:var(--wp-accent); margin-right:2px; }
.vc-seg{ display:inline-flex; border:1px solid var(--wp-border); border-radius:8px; overflow:hidden; }
.vc-seg button{ border:0; background:#fff; padding:5px 9px; cursor:pointer; font-size:12px; color:var(--wp-text); display:inline-flex; align-items:center; gap:5px; }
.vc-seg button+button{ border-left:1px solid var(--wp-border); }
.vc-seg button.on{ background:var(--wp-accent); color:#fff; }
.vc-group{ display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--wp-muted); }
.vc-step{ display:inline-flex; align-items:center; border:1px solid var(--wp-border); border-radius:8px; overflow:hidden; }
.vc-step button{ border:0; background:#fff; width:26px; height:26px; cursor:pointer; font-size:14px; }
.vc-step span{ min-width:26px; text-align:center; font-weight:700; color:var(--wp-head); }
.vc-adv-btn{ margin-left:auto; }

[data-edit]{ outline:none; cursor:text; border-radius:4px; transition:box-shadow .1s, background .1s; }
[data-edit]:hover{ box-shadow:0 0 0 2px rgba(34,113,177,.18); }
.vc-on-dark [data-edit]:hover{ box-shadow:0 0 0 2px rgba(255,255,255,.3); }
[data-edit]:focus{ box-shadow:0 0 0 2px var(--wp-accent); background:rgba(34,113,177,.06); }
.vc-on-dark [data-edit]:focus{ background:rgba(255,255,255,.08); }
[data-edit][data-ph]:empty::before{ content:attr(data-ph); opacity:.5; }

.vc-ins{ position:relative; height:0; }
.vc-ins button{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:9;
  width:28px; height:28px; border-radius:50%; border:1px solid var(--wp-accent);
  background:#fff; color:var(--wp-accent); font-size:17px; line-height:1; cursor:pointer;
  opacity:0; transition:opacity .12s; box-shadow:0 2px 6px rgba(0,0,0,.12);
}
.vc-ins:hover button{ opacity:1; }
.vc-ins::before{ content:""; position:absolute; left:6%; right:6%; top:50%; height:2px; background:var(--wp-accent); opacity:0; transition:opacity .12s; border-radius:2px; }
.vc-ins:hover::before{ opacity:.25; }

/* Aspecto fiel de los bloques (colores reales del tema) */
.b{ padding:44px 48px; }
.b-brand{ background:var(--grad-iidea); color:#fff; }
.b-dark{ background:var(--ink); color:#fff; }
.b-light{ background:#fff; color:var(--ink); }
.b-tint{ background:#f6f7fb; color:var(--ink); }
.b-eyebrow{ font-size:12px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; opacity:.85; display:inline-block; }
.b-brand .b-eyebrow, .b-dark .b-eyebrow{ background:rgba(255,255,255,.12); padding:5px 12px; border-radius:20px; opacity:1; }
.b-h{ display:block; font-weight:900; letter-spacing:-.02em; line-height:1.04; font-size:clamp(26px,3.2vw,42px); margin:14px 0 0; }
.b-sub{ display:block; font-size:16px; line-height:1.5; margin-top:12px; max-width:46ch; opacity:.9; }
.b-hero-center .b-sub{ margin-left:auto; margin-right:auto; }
.b-cta-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.b-cta{ border-radius:999px; padding:11px 22px; font-size:13px; font-weight:700; display:inline-block; cursor:text; }
.b-cta.primary{ background:#fff; color:var(--ink); }
.b-cta.secondary{ border:1px solid rgba(255,255,255,.5); color:#fff; }
.b-light .b-cta.primary{ background:var(--ink); color:#fff; }
.b-light .b-cta.secondary{ border:1px solid rgba(1,21,74,.25); color:var(--ink); }
.b-wordmark{ font-weight:900; text-transform:lowercase; letter-spacing:-.04em; }
.b-hero-grid{ display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; }
.b-hero-center{ text-align:center; max-width:640px; margin:0 auto; position:relative; z-index:1; }
/* Hero centrado CON imagen: la imagen es el fondo a sangre (con overlay), igual
   que en el sitio. El texto va centrado encima. */
.b-hero-hasbg{ position:relative; background-size:cover; background-position:center; overflow:hidden; }
.b-hero-hasbg::before{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(1,10,40,.85), rgba(1,10,40,.45)); z-index:0; }
.b-hero-bgbtn{ z-index:2; }
.b-order-left .b-hero-text{ order:2; } .b-order-left .b-media{ order:1; }
/* Aviso de sección dinámica (careerShowcase/newsGrid/pricingGrid): deja claro
   qué muestra y dónde se edita, en vez de una sección casi vacía. */
.b-dynamic{ display:flex; gap:9px; align-items:flex-start; background:#eef3ff; border:1px dashed #9db4ff; border-radius:8px; padding:11px 13px; margin-top:16px; font-size:13px; line-height:1.5; color:#2b3550; text-align:left; }
.b-dynamic-ic{ font-size:16px; line-height:1.2; }
.b-dynamic a{ font-weight:700; color:var(--wp-accent); }
/* Rendición de cuentas: periodos → fases → documentos, editable in-situ. */
.b-acc-period{ margin-top:16px; }
.b-acc-yearrow{ display:flex; align-items:center; gap:10px; }
.b-acc-year{ font-size:20px; font-weight:800; color:var(--wp-head); }
.b-acc-phase{ border:1px solid var(--wp-border); border-radius:8px; padding:12px 14px; margin-top:10px; background:#fff; }
.b-acc-phase-head{ display:flex; align-items:center; gap:9px; }
.b-acc-num{ flex:0 0 24px; width:24px; height:24px; border-radius:50%; background:var(--wp-accent); color:#fff; display:grid; place-items:center; font-size:12px; font-weight:700; }
.b-acc-title{ font-weight:700; font-size:15px; flex:1; }
.b-acc-desc{ color:var(--wp-muted); font-size:13px; margin:5px 0 9px 33px; }
.b-acc-docs{ display:flex; flex-direction:column; gap:6px; margin-left:33px; }
/* La fila de un documento envuelve: con los botones de subir no cabe de una
   sola línea en pantallas estrechas, y antes se salía de la tarjeta. */
.b-acc-doc{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
/* Botones "Biblioteca" / "⬆ Subir" dentro de la fila: mismo aspecto que el
   resto de botones del panel, en tamaño reducido. */
.b-acc-doc-btn{
  border:1px solid var(--wp-border); background:#f6f7f7; color:var(--wp-text);
  border-radius:3px; cursor:pointer; font-size:11px; padding:3px 8px; white-space:nowrap;
}
.b-acc-doc-btn:hover:not(:disabled){ background:#f0f0f1; border-color:var(--wp-accent); color:var(--wp-accent); }
.b-acc-doc-btn:disabled{ opacity:0.6; cursor:default; }
.b-acc-doc-btn:focus-visible{ outline:2px solid var(--wp-accent); outline-offset:1px; }
.b-acc-dot{ width:9px; height:9px; border-radius:50%; flex:0 0 9px; }
.b-acc-dot.pub{ background:var(--wp-success); } .b-acc-dot.pend{ background:#c9a227; }
.b-acc-doc-t{ font-size:13px; min-width:120px; }
.b-acc-href{ flex:1; min-width:130px; font-size:12px; padding:3px 7px; }
.b-acc-doc-st{ font-size:11px; font-weight:600; white-space:nowrap; }
.b-acc-doc-st.pub{ color:var(--wp-success); } .b-acc-doc-st.pend{ color:#8a6d1a; }
.b-acc-doc-x{ border:0; background:none; color:var(--wp-muted); cursor:pointer; font-size:13px; padding:2px 4px; }
.b-add-sm{ font-size:12px; padding:3px 9px; }
.b-media{ position:relative; }
.b-imgslot{ position:relative; aspect-ratio:4/3; border-radius:16px; overflow:hidden; background:linear-gradient(135deg,#c9d2f2,#e7d3ee); display:grid; place-items:center; box-shadow:0 20px 40px -14px rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.35); }
.b-imgslot img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.b-img-ph{ color:#5b6aa8; font-size:13px; font-weight:600; text-align:center; display:grid; gap:6px; justify-items:center; padding:12px; }
.b-img-ph .ic{ font-size:26px; opacity:.7; }
.b-img-edit{ position:absolute; bottom:8px; right:8px; background:rgba(0,0,0,.55); color:#fff; font-size:11px; padding:4px 9px; border-radius:6px; cursor:pointer; border:0; }
.b-imgslot{ position:relative; }
/* Aviso in-situ: imagen sin texto alternativo (accesibilidad + SEO). */
.b-alt-warn{ position:absolute; bottom:8px; left:8px; z-index:3; background:#fde68a; color:#7a4f01; font-size:11px; font-weight:700; padding:3px 8px; border-radius:6px; box-shadow:0 1px 4px rgba(0,0,0,.25); pointer-events:none; }
.b-stats{ display:grid; gap:20px; text-align:center; }
.b-stat .v{ display:block; font-weight:900; font-size:clamp(28px,3.4vw,40px); background:var(--grad-iidea); -webkit-background-clip:text; background-clip:text; color:transparent; }
.b-stat .l{ display:block; font-size:13px; color:#5b647f; margin-top:4px; }
.b-sec-head{ text-align:left; margin-bottom:26px; }
.b-sec-head.center{ text-align:center; }
.b-sec-head .b-h{ font-size:clamp(22px,2.6vw,32px); }
.b-sec-head .b-sub{ max-width:60ch; }
.b-sec-head.center .b-sub{ margin-left:auto; margin-right:auto; }
.b-steps{ display:grid; gap:18px; }
.b-step{ border:1px solid #e6e8f0; border-radius:14px; padding:20px; background:#fff; }
.b-step .n{ width:34px; height:34px; border-radius:50%; background:var(--grad-iidea); color:#fff; font-weight:800; display:grid; place-items:center; margin-bottom:12px; }
.b-step .t{ display:block; font-weight:800; font-size:15px; }
.b-step .d{ display:block; font-size:13px; color:#5b647f; margin-top:6px; line-height:1.45; }
.b-cards{ display:grid; gap:16px; }
.b-card{ border:1px solid #e6e8f0; border-radius:14px; padding:20px; background:#fff; }
.b-card .t{ display:block; font-weight:800; font-size:15px; }
.b-card .d{ display:block; font-size:13px; color:#5b647f; margin-top:6px; line-height:1.45; }
.b-card .b-imgslot{ aspect-ratio:16/10; margin-bottom:12px; box-shadow:none; }
.b-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; margin-bottom:20px; }
.b-actions .b-cta{ background:#eef1fb; color:var(--brand-blue); }
.b-faq{ display:grid; gap:10px; max-width:820px; }
.b-faq .qa{ border:1px solid #e6e8f0; border-radius:12px; padding:16px 18px; background:#fff; }
.b-faq .q{ font-weight:800; font-size:14px; display:flex; justify-content:space-between; gap:10px; }
.b-faq .a{ display:block; font-size:13px; color:#5b647f; margin-top:8px; line-height:1.5; }
.b-banner{ text-align:center; }
.b-lead{ display:grid; place-items:center; }
.b-leadcard{ width:100%; max-width:420px; background:#fff; border-radius:16px; padding:24px; box-shadow:0 16px 40px -14px rgba(1,21,74,.3); border:1px solid #eceeff; color:var(--ink); }
.b-leadcard .t{ font-weight:800; font-size:18px; }
.b-leadcard .row{ border:1px solid #e6e8f0; border-radius:12px; padding:12px 14px; color:#9aa2b8; font-size:13px; margin-top:10px; }
.b-leadcard .send{ margin-top:14px; text-align:center; background:var(--ink); color:#fff; border-radius:999px; padding:12px; font-weight:700; font-size:13px; }
.b-generic .b-field{ margin-top:10px; }
.b-generic .b-fl{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#8a90a3; display:block; margin-bottom:2px; }

/* Cajón de ajustes avanzados (campos completos, reutiliza renderField) */
.vc-drawer-back{ position:fixed; inset:0; background:rgba(1,21,74,.25); z-index:60; display:none; }
.vc-drawer-back.open{ display:block; }
/* Arranca bajo la barra de administración (z-index 999): si empezara en top:0,
   su cabecera (título + ✕) quedaría oculta y sin poder cerrarse. */
.vc-drawer{ position:fixed; top:var(--bar-h); right:0; height:calc(100% - var(--bar-h)); width:380px; max-width:92vw; background:#fff; z-index:61; transform:translateX(100%); transition:transform .2s ease; box-shadow:-8px 0 30px rgba(0,0,0,.18); display:flex; flex-direction:column; }
.vc-drawer.open{ transform:none; }
.vc-drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--wp-border-soft); }
.vc-drawer-head strong{ font-size:14px; color:var(--wp-head); }
.vc-drawer-body{ padding:14px 16px; overflow:auto; }
/* Panel "SEO de la página" (dentro del cajón). */
.seo-count{ display:block; font-size:11px; text-align:right; margin-top:2px; }
.seo-img-row{ display:flex; gap:8px; align-items:center; }
.seo-img-row input{ flex:1; min-width:0; }
.seo-og-prev{ display:block; margin-top:8px; max-width:100%; border-radius:6px; border:1px solid var(--wp-border-soft); }

@media (max-width:900px){ .b-hero-grid{ grid-template-columns:1fr; } .b{ padding:30px 22px; } }
@media (prefers-reduced-motion: reduce){ .vc-drawer{ transition:none; } }

/* ── Editor visual en móvil / tablet ──────────────────────────────────────── */
@media (max-width:782px){
  /* La barra del editor envuelve: el título ocupa su línea y los botones bajan. */
  .vc-topbar{ flex-wrap:wrap; gap:6px; padding:8px 10px; }
  .vc-crumb{ flex-basis:100%; }
  .vc-spacer{ display:none; }
  .vc-topbar .button{ font-size:12px; padding:5px 9px; }
  .vc-undoredo .button{ min-width:30px; }
  .vc-hint{ font-size:12px; }
  .vc-shell{ padding:0 2px; }
}
/* En pantallas táctiles NO hay hover: los controles que dependían de él (el "+"
   para añadir secciones y la etiqueta de la sección) deben verse siempre, o el
   editor sería inservible con el dedo. Las herramientas de sección aparecen al
   TOCAR la sección (queda seleccionada). */
@media (hover: none){
  .vc-ins button{ opacity:.6; }
  .vc-ins button:active{ opacity:1; }
  .vc-block .vc-chip{ display:inline-flex; }
}

/* Ítems editables en el lienzo: agregar / quitar / reordenar botones y tarjetas */
.b-item{ position:relative; }
.b-item-tools{
  position:absolute; top:6px; right:6px; display:none; gap:2px; z-index:5;
  background:#fff; border:1px solid var(--wp-border-soft); border-radius:7px; padding:2px;
  box-shadow:0 2px 6px rgba(0,0,0,.14);
}
.b-item:hover .b-item-tools{ display:flex; }
.b-item-tools button{ border:0; background:transparent; width:22px; height:22px; border-radius:5px; cursor:pointer; font-size:12px; color:var(--wp-text); line-height:1; }
.b-item-tools button:hover{ background:var(--wp-body); }
.b-stat.b-item .b-item-tools{ top:0; right:0; }
.b-add{
  border:1.5px dashed var(--wp-border); border-radius:14px; padding:18px; min-height:66px;
  background:transparent; color:var(--wp-muted); cursor:pointer; font-weight:700; font-size:13px;
  display:flex; align-items:center; justify-content:center; transition:border-color .12s, color .12s, background .12s;
}
.b-add:hover{ border-color:var(--wp-accent); color:var(--wp-accent); background:rgba(34,113,177,.04); }
.b-add-inline{
  border:1.5px dashed var(--wp-border); border-radius:999px; padding:9px 16px;
  background:transparent; color:var(--wp-muted); cursor:pointer; font-weight:700; font-size:13px;
}
.b-add-inline:hover{ border-color:var(--wp-accent); color:var(--wp-accent); }
.vc-on-dark .b-add-inline{ border-color:rgba(255,255,255,.45); color:rgba(255,255,255,.9); }
.vc-on-dark .b-add-inline:hover{ border-color:#fff; color:#fff; background:rgba(255,255,255,.08); }
.b-btnwrap{ position:relative; display:inline-flex; }
.b-item-x{
  position:absolute; top:-8px; right:-8px; width:20px; height:20px; border-radius:50%;
  border:1px solid var(--wp-border); background:#fff; color:var(--wp-error); font-size:11px; line-height:1;
  cursor:pointer; display:none; align-items:center; justify-content:center; z-index:6; box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.b-btnwrap:hover .b-item-x{ display:flex; }

/* Contenido libre (richContent): piezas apilables + menú de "agregar pieza" */
.b-rc{ max-width:52ch; }
.b-rc.b-rc-wide{ max-width:100%; }
.b-rc.b-rc-center{ text-align:center; margin-left:auto; margin-right:auto; }
.b-rc.b-rc-center .b-cta-row{ justify-content:center; }
.b-rc.b-rc-center .b-imgslot{ margin-left:auto; margin-right:auto; }
.b-rc-empty{ padding:6px 0 12px; }
.b-rc > .b-item{ margin:8px 0; }
.b-h-sm{ font-size:clamp(20px,2.4vw,26px); }
.b-spacer{ border:1px dashed var(--wp-border); border-radius:8px; color:var(--wp-muted); text-align:center; padding:8px; font-size:12px; }
.vc-on-dark .b-spacer{ border-color:rgba(255,255,255,.35); color:rgba(255,255,255,.7); }
.b-rc-list{ margin:0; padding-left:22px; }
.b-rc-li{ position:relative; margin:4px 0; }
.b-rc-litext{ display:inline-block; min-width:60px; }
.b-li-x{ border:0; background:transparent; color:var(--wp-error); cursor:pointer; font-size:11px; margin-left:6px; opacity:0; }
.b-rc-li:hover .b-li-x{ opacity:.8; }
.b-addpiece{ position:relative; margin-top:10px; }
.b-addpiece .b-add{ min-height:auto; padding:12px; width:100%; }
.b-addpiece-menu{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.b-addpiece-opt{ border:1px solid var(--wp-border); background:#fff; border-radius:999px; padding:6px 12px; font-size:12px; font-weight:600; color:var(--wp-text); cursor:pointer; }
.b-addpiece-opt:hover{ border-color:var(--wp-accent); color:var(--wp-accent); }
.vc-on-dark .b-addpiece-opt{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.3); color:#fff; }

/* Widget de uso del Asistente IA (escritorio) */
.usage-bar { height: 8px; border-radius: 6px; background: var(--wp-border-soft); overflow: hidden; }
.usage-bar span { display: block; height: 100%; background: var(--grad); }
.usage-top { list-style: none; margin: 8px 0 0; padding: 0; font-size: 12.5px; }
.usage-top li { display: flex; justify-content: space-between; gap: 10px; padding: 2px 0; border-top: 1px solid var(--wp-border-soft); }

/* Accesibilidad: foco de teclado visible en los controles del editor visual. */
.vc-tools button:focus-visible,
.b-item-tools button:focus-visible,
.b-add:focus-visible,
.b-add-inline:focus-visible,
.b-addpiece-opt:focus-visible,
.b-item-x:focus-visible,
.b-li-x:focus-visible,
.b-img-edit:focus-visible,
.vc-seg button:focus-visible,
.vc-step button:focus-visible,
.vc-ins button:focus-visible,
.vc-chip .vc-drag:focus-visible {
  outline: 2px solid var(--wp-accent);
  outline-offset: 2px;
  border-radius: 6px;
}
[data-edit]:focus-visible { outline: 2px solid var(--wp-accent); outline-offset: 1px; }

/* Alta de carrera (listado de Carreras) */
.career-new { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0 4px; padding: 14px 16px; background: #fff; border: 1px solid var(--wp-border); border-radius: 4px; }
.career-new label { font-weight: 600; }
.career-new input { min-width: 260px; padding: 6px 10px; border: 1px solid var(--wp-border); border-radius: 4px; }
.career-new .wp-subtitle { flex-basis: 100%; margin: 2px 0 0; }

/* Textos de la plantilla de carrera */
.cl-row { display: grid; grid-template-columns: 190px 1fr; align-items: start; gap: 12px; margin-bottom: 10px; }
.cl-row .cl-key { padding-top: 7px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: var(--wp-head); word-break: break-word; }
.cl-row input, .cl-row textarea { width: 100%; padding: 6px 10px; border: 1px solid var(--wp-border); border-radius: 4px; font: inherit; }
.cl-row textarea { min-height: 74px; resize: vertical; }
@media (max-width: 640px) { .cl-row { grid-template-columns: 1fr; gap: 4px; } .cl-row .cl-key { padding-top: 0; } }
