/* Calendario / almanaque YUCORE.
 *
 * Va bajo .yu-app, así que hereda los tokens y la tipografía de
 * yucore-app.css: la misma paleta, los mismos bordes y los mismos radios que
 * la agenda, la Lista de amigos y los asistentes. Antes tenía su propia
 * escala —degradado azul, reloj de 56px, sombras de 24px— y por eso parecía
 * de otro sistema.
 */

.yu-app .yucore-cal-wrap { max-width: 1180px; margin: 0 auto; }

/* ---- Cabecera con el reloj ----
   El reloj es un dato, no un cartel: la hora de Colombia importa porque el
   equipo trabaja repartido, pero no es lo que se viene a mirar aquí. */
.yu-app .yucore-clock-bar {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  padding: 12px 16px;
  margin-bottom: 14px;
  background: var(--franja);
  border: 1px solid var(--borde);
  border-radius: var(--radio-lg);
}
.yu-app .yucore-clock {
  font-size: 26px; font-weight: 700; line-height: 1;
  color: var(--tinta); font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
}
.yu-app .yucore-clock .sec { color: var(--tinta-suave); font-weight: 600; }
.yu-app .yucore-date {
  font-size: 14px; font-weight: 600; color: var(--tinta-media);
  text-transform: capitalize;
}
.yu-app .yucore-tz { font-size: 12px; color: var(--tinta-suave); margin-left: auto; }

/* ---- Calendario y panel ---- */
.yu-app .yucore-cal-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) 300px;
  gap: 14px; align-items: start;
}
.yu-app .yucore-cal-main,
.yu-app .yucore-upcoming {
  background: var(--superficie);
  border: 1px solid var(--borde);
  border-radius: var(--radio-lg);
  padding: 16px;
}
.yu-app .yucore-upcoming { position: sticky; top: 12px; }
.yu-app #yucore-calendar { min-height: 540px; }

/* ---- FullCalendar ----
   Pinta su rejilla con un <table>, así que primero hay que apagarle lo que
   yucore-app.css le pone a TODAS las tablas: ancho mínimo de 940px, franjas
   alternas y realce al pasar por encima. Sin esto la rejilla se desborda y
   los días se pintan a rayas. */
.yu-app #yucore-calendar table { min-width: 0; width: 100%; }
.yu-app #yucore-calendar thead th {
  padding: 0; font-size: inherit; letter-spacing: 0; text-transform: none;
  color: inherit; border-bottom: 0;
}
.yu-app #yucore-calendar tbody td {
  padding: 0; font-size: inherit; border-bottom: 0; vertical-align: top;
}
.yu-app #yucore-calendar tbody tr:nth-child(even) td,
.yu-app #yucore-calendar tbody tr:hover td { background: transparent; }

.yu-app .fc { --fc-border-color: var(--borde); --fc-today-bg-color: var(--azul-suave); }
.yu-app .fc .fc-toolbar { gap: 10px; flex-wrap: wrap; }
.yu-app .fc .fc-toolbar-title {
  font-size: 16px; font-weight: 600; color: var(--tinta); text-transform: capitalize;
}
.yu-app .fc .fc-button-primary {
  background: var(--superficie) !important;
  border: 1px solid var(--borde-fuerte) !important;
  color: var(--tinta-media) !important;
  font-size: 13px; font-weight: 500;
  padding: 5px 11px;
  border-radius: var(--radio) !important;
  box-shadow: none !important;
  text-transform: capitalize;
}
.yu-app .fc .fc-button-primary:hover {
  background: var(--franja) !important; color: var(--tinta) !important;
}
.yu-app .fc .fc-button-primary:not(:disabled).fc-button-active,
.yu-app .fc .fc-button-primary:not(:disabled):active {
  background: var(--azul) !important;
  border-color: var(--azul) !important;
  color: #fff !important;
}
.yu-app .fc .fc-button-primary:disabled { opacity: .45; }
.yu-app .fc .fc-col-header-cell-cushion {
  color: var(--tinta-suave); font-weight: 600; font-size: 11px;
  text-transform: uppercase; letter-spacing: .05em; padding: 8px 4px;
}
.yu-app .fc .fc-daygrid-day-number { color: var(--tinta-media); font-size: 12.5px; padding: 5px 7px; }
.yu-app .fc .fc-day-today .fc-daygrid-day-number { color: var(--azul); font-weight: 700; }
.yu-app .fc .fc-day-other .fc-daygrid-day-number { color: var(--tinta-suave); opacity: .55; }
.yu-app .fc-event {
  border: 0; border-radius: var(--radio-sm);
  font-size: 11.5px; font-weight: 500; padding: 1px 5px; cursor: pointer;
}
.yu-app .fc .fc-daygrid-more-link { font-size: 11px; color: var(--azul-medio); font-weight: 600; }
.yu-app .fc .fc-list-day-cushion { background: var(--franja); }
.yu-app .fc .fc-list-event:hover td { background: var(--azul-suave); }

/* ---- Leyenda ---- */
.yu-app .yucore-legend {
  display: flex; flex-wrap: wrap; gap: 6px 14px;
  margin-top: 12px; padding-top: 12px;
  border-top: 1px solid var(--borde);
  font-size: 12.5px; color: var(--tinta-suave);
}
.yu-app .yucore-legend span { display: inline-flex; align-items: center; gap: 6px; }
.yu-app .yucore-legend i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; }

/* ---- Próximos ---- */
.yu-app .yucore-upcoming h3 {
  margin: 0 0 10px; padding-bottom: 9px;
  font-size: 13px; font-weight: 600; color: var(--tinta);
  border-bottom: 1px solid var(--borde);
}
.yu-app .yucore-upcoming-list {
  display: flex; flex-direction: column; gap: 2px;
  max-height: 520px; overflow-y: auto;
}
.yu-app .yucore-up-item {
  display: flex; gap: 9px; align-items: center;
  padding: 8px 6px; border-radius: var(--radio);
  text-decoration: none; color: inherit; overflow: hidden;
  border-bottom: 1px solid var(--linea-suave);
}
.yu-app .yucore-up-item:last-child { border-bottom: 0; }
.yu-app a.yucore-up-item:hover { background: var(--azul-suave); }
.yu-app .yucore-up-dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 7px; }
.yu-app .yucore-up-dot--event { background: var(--azul-medio); }
.yu-app .yucore-up-dot--birthday { background: var(--oro); }
.yu-app .yucore-up-dot--holiday { background: var(--rojo); }
.yu-app .yucore-up-dot--commemorative { background: var(--verde); }
.yu-app .yucore-up-body { flex: 1 1 auto; min-width: 0; }
.yu-app .yucore-up-title {
  display: block; font-size: 13px; font-weight: 500; color: var(--tinta);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.yu-app .yucore-up-when { display: block; font-size: 11.5px; color: var(--tinta-suave); }
/* La etiqueta no lleva el color a fondo lleno: en dorado, el texto blanco no
   se lee. Fondo tenue y el color en el texto, que sí contrasta. */
.yu-app .yucore-up-badge {
  flex: 0 0 auto; font-size: 10.5px; font-weight: 600;
  padding: 2px 8px; border-radius: var(--pill);
  white-space: nowrap; background: var(--franja); color: var(--tinta-media);
}
.yu-app .yucore-up-badge--event { background: var(--azul-suave); color: var(--azul); }
.yu-app .yucore-up-badge--birthday { background: #FDF3DC; color: #7A5200; }
.yu-app .yucore-up-badge--holiday { background: #FDECEB; color: #8A1610; }
.yu-app .yucore-up-badge--commemorative { background: #E8F3EC; color: #1F6B41; }
.yu-app .yucore-loading { color: var(--tinta-suave); font-size: 13px; padding: 10px 6px; }

/* ---- Modo dashlet: solo reloj y próximos ---- */
.yu-app .yucore-cal-wrap.is-dashlet { padding: 0; }
.yu-app .yucore-cal-wrap.is-dashlet .yucore-cal-grid { grid-template-columns: 1fr; }
.yu-app .yucore-cal-wrap.is-dashlet .yucore-clock { font-size: 21px; }
.yu-app .yucore-cal-wrap.is-dashlet .yucore-upcoming { border: 0; padding: 0; position: static; }
.yu-app .yucore-cal-fulllink {
  display: inline-block; margin-top: 10px; font-size: 13px; font-weight: 500;
  color: var(--azul-medio); text-decoration: none;
}
.yu-app .yucore-cal-fulllink:hover { text-decoration: underline; }

@media (max-width: 880px) {
  .yu-app .yucore-cal-grid { grid-template-columns: 1fr; }
  .yu-app .yucore-upcoming { position: static; }
  .yu-app .yucore-tz { margin-left: 0; width: 100%; }
}


/* ===== Panel de inicio YUCORE (KPIs + accesos rápidos) ===== */
.yucore-home { font-family:'Inter',system-ui,sans-serif; }
.yucore-kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; }
.yucore-kpi { display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #e4e8ef; border-radius:14px; padding:14px 16px; box-shadow:0 4px 14px rgba(18,42,82,.07); }
.yucore-kpi-ico { width:46px; height:46px; flex:0 0 46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:20px; }
.yucore-kpi-num { font-size:26px; font-weight:800; color:#1B3A6B; line-height:1; font-variant-numeric:tabular-nums; }
.yucore-kpi-lbl { font-size:12.5px; color:#66707f; font-weight:600; margin-top:4px; }
.yucore-qa-title { margin:18px 0 10px; font-size:14px; font-weight:700; color:#1B3A6B; text-transform:uppercase; letter-spacing:.03em; }
.yucore-qa { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.yucore-qa-btn { display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:11px; background:#f4f6fa; border:1px solid #e4e8ef; color:#1B3A6B; text-decoration:none; font-weight:600; font-size:13.5px; transition:all .15s; }
.yucore-qa-btn:hover { background:#1B3A6B; color:#fff !important; transform:translateY(-2px); box-shadow:0 6px 16px rgba(18,42,82,.18); }
.yucore-qa-btn:hover .crm-i { color:#F2A900 !important; }
.yucore-qa-btn .crm-i { color:#2B5AA0; font-size:16px; }

/* ===== Asistente de YuCoRe =====
   Rediseñado el 25-sep-2026. Antes era una tarjeta que ocupaba la mitad de la
   pantalla, con el «Choose Files» del navegador crudo comiéndose un tercio del
   ancho de la caja de escribir.

   La misma hoja sirve para los dos sitios donde vive: la página entera
   —«yucore-ai--pagina», que crece hasta el borde— y el recuadro del inicio,
   que se queda contenido. Lo que manda esa diferencia es una sola clase. */
.yucore-ai {
  --ai-azul: #1F4B85;
  --ai-azul-claro: #EAF3FF;
  --ai-fondo: #F6F8FC;
  --ai-tinta: #172B4D;
  --ai-tinta-suave: #667085;
  --ai-borde: #E1E7F0;
  --ai-verde: #22C55E;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  display: flex;
  flex-direction: column;
  min-height: 340px;
  color: var(--ai-tinta);
}

/* Como página: una aplicación, no una tarjeta. Crece hasta donde llega la
   ventana y se queda ahí; lo que se mueve por dentro son los mensajes. */
.yucore-ai--pagina {
  height: calc(100vh - 210px);
  min-height: 520px;
  background: #fff;
  border: 1px solid var(--ai-borde);
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(23, 43, 77, .04), 0 8px 24px rgba(23, 43, 77, .045);
  overflow: hidden;
}

/* ---------- la cabecera ---------- */
.yucore-ai-head {
  display: flex; align-items: center; gap: 12px;
  padding-bottom: 12px; margin-bottom: 10px;
  border-bottom: 1px solid var(--ai-borde);
}
.yucore-ai--pagina .yucore-ai-head {
  flex: 0 0 auto; height: 72px; box-sizing: border-box;
  padding: 0 20px; margin: 0;
  background: #fff;
}
.yucore-ai-avatar {
  width: 40px; height: 40px; border-radius: 11px; flex: 0 0 40px;
  background: var(--ai-azul);
  display: flex; align-items: center; justify-content: center;
}
.yucore-ai-quien { flex: 1; min-width: 0; }
.yucore-ai-name {
  font-weight: 700; color: var(--ai-tinta); font-size: 15.5px;
  letter-spacing: -.01em; line-height: 1.2;
}
.yucore-ai-sub {
  font-size: 12.5px; color: var(--ai-tinta-suave); margin-top: 1px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* «En línea» dice que el asistente está configurado y responde. No es adorno:
   si falta la clave del proveedor, el chat ni siquiera se dibuja. */
.yucore-ai-vivo {
  display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px;
  border-radius: 999px; background: #ECFDF3; color: #15803D;
  font-size: 11.5px; font-weight: 600; white-space: nowrap; flex: 0 0 auto;
}
.yucore-ai-vivo::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: var(--ai-verde);
}
.yucore-ai .yucore-ai-clear {
  cursor: pointer; color: #9AA3B2; background: transparent !important;
  border: 0 !important; box-shadow: none !important;
  padding: 7px; border-radius: 9px; flex: 0 0 auto;
  display: flex !important; align-items: center; transition: all .15s;
}
.yucore-ai .yucore-ai-clear:hover { background: #FDE8E7 !important; color: #E1251B; }

/* ---------- el cuerpo: lo único que hace scroll ---------- */
.yucore-ai-cuerpo {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
  overflow-y: auto; overflow-x: hidden;
}
/* Un fondo apenas tintado: separa la conversación de la cabecera y del pie
   —que son blancos— sin meter una línea más. */
.yucore-ai--pagina .yucore-ai-cuerpo {
  padding: 0 20px; background: #FBFCFE;
}

/* ---------- el saludo, cuando no hay conversación ---------- */
.yucore-ai-bienvenida {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  padding: 26px 8px; gap: 6px;
}
.yucore-ai-bienvenida[hidden] { display: none; }
/* El saludo, en grande y redondo. En el boceto es el ancla de la pantalla
   vacía: si es pequeño, el módulo parece una tarjeta con un logo perdido. */
.yucore-ai-marca {
  width: 92px; height: 92px; border-radius: 50%; margin-bottom: 14px;
  background: radial-gradient(circle at 50% 45%, #F0F6FF 0%, var(--ai-azul-claro) 100%);
  color: var(--ai-azul);
  display: flex; align-items: center; justify-content: center;
}
.yucore-ai-marca svg { width: 46px; height: 46px; }
.yucore-ai-hola {
  margin: 0; font-size: 27px; font-weight: 700; color: var(--ai-tinta);
  letter-spacing: -.02em;
}
.yucore-ai-intro {
  margin: 0 0 26px; font-size: 14.5px; color: var(--ai-tinta-suave);
  line-height: 1.6; max-width: 470px;
}
.yucore-ai-sugerencias {
  display: grid; gap: 12px; width: 100%; max-width: 780px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* Las tarjetas son <button>, y el CRM pinta TODOS los botones de azul oscuro
   con más especificidad que una clase suelta. Sin ganarle, las cuatro salían
   azul marino, con el texto ilegible y en una sola línea. De ahí el !important
   y el selector doble: no es descuido, es la única forma de que un componente
   propio sobreviva dentro del CSS de CiviCRM. */
.yucore-ai .yucore-ai-sug,
.yucore-ai .yucore-ai-sug:focus {
  display: flex !important; flex-direction: row; align-items: center;
  gap: 13px; text-align: left; width: 100%; box-sizing: border-box;
  padding: 14px 16px !important; border: 1px solid #E3EAF5 !important;
  border-radius: 13px !important; background: #fff !important;
  color: var(--ai-tinta) !important; cursor: pointer;
  font: inherit !important; text-shadow: none !important; box-shadow: none !important;
  transition: background .2s, border-color .2s, transform .2s;
}
.yucore-ai .yucore-ai-sug:hover {
  background: var(--ai-azul-claro) !important; border-color: #C9DDF7 !important;
  transform: translateY(-1px);
}
/* El icono en su propio cuadrado, como en el boceto: separa el «qué» del
   «cómo se pregunta» y hace que las cuatro se lean de un vistazo. */
.yucore-ai .yucore-ai-sug__ico {
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: 11px;
  background: var(--ai-azul-claro); font-size: 17px; line-height: 1;
}
.yucore-ai .yucore-ai-sug__texto { flex: 1; min-width: 0; }
.yucore-ai .yucore-ai-sug__t {
  display: block; font-size: 13.5px; font-weight: 600; color: var(--ai-tinta);
}
.yucore-ai .yucore-ai-sug__q {
  display: block; font-size: 12px; color: var(--ai-tinta-suave); line-height: 1.4;
  margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.yucore-ai .yucore-ai-sug__ir {
  flex: 0 0 auto; color: #B6C2D4; display: flex; align-items: center;
  transition: color .2s, transform .2s;
}
.yucore-ai .yucore-ai-sug:hover .yucore-ai-sug__ir {
  color: var(--ai-azul); transform: translateX(2px);
}

/* ---------- los mensajes ---------- */
.yucore-ai-msgs {
  display: flex; flex-direction: column; gap: 12px; padding: 16px 2px;
}
.yucore-ai-msgs:empty { display: none; }
.yucore-ai-msg {
  padding: 10px 14px; border-radius: 15px; font-size: 13.8px; line-height: 1.55;
  word-wrap: break-word; overflow-wrap: anywhere;
}
.yucore-ai-msg.bot {
  background: #F4F7FB; color: var(--ai-tinta);
  align-self: flex-start; max-width: 75%; border-bottom-left-radius: 5px;
}
.yucore-ai-msg.user {
  background: var(--ai-azul); color: #fff;
  align-self: flex-end; max-width: 70%; border-bottom-right-radius: 5px;
}
.yucore-ai-msg a { color: inherit; text-decoration: underline; }
.yucore-ai-msg.bot a { color: var(--ai-azul); }
.yucore-ai-msg ul, .yucore-ai-msg ol { margin: 6px 0; padding-left: 20px; }
.yucore-ai-msg li { margin: 2px 0; }
.yucore-ai-msg code {
  background: rgba(23, 43, 77, .07); padding: 1px 5px; border-radius: 5px;
  font-size: 12.5px; font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace;
}
.yucore-ai-msg.user code { background: rgba(255, 255, 255, .2); }
.yucore-ai-msg pre {
  background: rgba(23, 43, 77, .06); padding: 10px 12px; border-radius: 9px;
  overflow-x: auto; font-size: 12.5px; margin: 8px 0;
  font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace;
}
.yucore-ai-msg table { border-collapse: collapse; margin: 8px 0; font-size: 13px; }
.yucore-ai-msg th, .yucore-ai-msg td {
  border: 1px solid var(--ai-borde); padding: 5px 9px; text-align: left;
}
/* «YuCoRe está escribiendo…»: decirlo con palabras y no con tres puntos.
   Los puntos no dicen si está pensando o si se colgó. */
.yucore-ai-msg.typing {
  color: var(--ai-tinta-suave); font-size: 13px; background: #F4F7FB;
  display: inline-flex; align-items: center; gap: 7px;
}
.yucore-ai-msg.typing::after {
  content: ''; width: 5px; height: 5px; border-radius: 50%;
  background: var(--ai-tinta-suave); animation: yucore-ai-late 1s infinite;
}
@keyframes yucore-ai-late { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }

/* ---------- el pie: no se mueve nunca ---------- */
.yucore-ai-pie { flex: 0 0 auto; }
.yucore-ai--pagina .yucore-ai-pie {
  padding: 12px 20px 16px; background: #fff;
  border-top: 1px solid var(--ai-borde);
}
.yucore-ai-files { display: flex; flex-wrap: wrap; gap: 6px; }
.yucore-ai-files:empty { display: none; }
.yucore-ai-chip {
  background: var(--ai-azul-claro); color: var(--ai-azul); border-radius: 999px;
  padding: 4px 11px; font-size: 12px; font-weight: 600; margin-bottom: 8px;
}
.yucore-ai-chip a { cursor: pointer; color: #E1251B; margin-left: 5px; font-weight: 700; }
.yucore-ai-input {
  display: flex; align-items: flex-end; gap: 8px; box-sizing: border-box;
  min-height: 56px; padding: 8px 10px;
  border: 1px solid #DCE4EF; border-radius: 14px; background: #fff;
  box-shadow: 0 1px 2px rgba(23, 43, 77, .04);
  transition: border-color .15s, box-shadow .15s;
}
.yucore-ai-input:focus-within {
  border-color: #B8CFEC; box-shadow: 0 0 0 3px rgba(31, 75, 133, .08);
}
.yucore-ai-input textarea {
  flex: 1; min-width: 0; border: 0 !important; outline: 0; resize: none;
  font-size: 14px; font-family: inherit; color: var(--ai-tinta);
  line-height: 1.5; padding: 9px 2px; max-height: 120px; background: transparent;
}
.yucore-ai-attach {
  cursor: pointer; color: var(--ai-tinta-suave); padding: 9px;
  display: flex; align-items: center; border-radius: 9px; transition: all .15s;
}
.yucore-ai-attach:hover { background: var(--ai-azul-claro); color: var(--ai-azul); }
/* El «Choose Files / No file chosen» del navegador salía crudo y se comía un
   tercio de la caja de escribir. El atributo `hidden` del HTML no bastaba: el
   CSS del CRM le pone `display` a todos los input y gana por especificidad. */
.yucore-ai-attach input[type="file"] { display: none !important; }
.yucore-ai .yucore-ai-send {
  background: var(--ai-azul) !important; color: #fff; border: 0 !important;
  box-shadow: none !important; flex: 0 0 38px;
  width: 38px; height: 38px; border-radius: 11px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: all .15s;
}
.yucore-ai .yucore-ai-send:hover { background: #17395F !important; }
.yucore-ai-send:disabled { opacity: .45; cursor: default; }

.yucore-ai-disabled {
  background: #FFF8E8; border: 1px solid #F2D98A; color: #7A5C00;
  border-radius: 12px; padding: 14px; font-size: 13.5px; margin: 14px 0;
}
.yucore-ai--pagina .yucore-ai-disabled { margin: 16px 20px; }
.yucore-ai-disabled a { font-weight: 600; }

@media (max-width: 900px) {
  /* En el móvil la barra del CRM ocupa menos y la pantalla es lo único que
     hay: el asistente se la queda entera. */
  .yucore-ai--pagina { height: calc(100vh - 150px); border-radius: 14px; }
  .yucore-ai--pagina .yucore-ai-head { height: 62px; padding: 0 14px; }
  .yucore-ai--pagina .yucore-ai-cuerpo { padding: 0 14px; }
  .yucore-ai--pagina .yucore-ai-pie { padding: 10px 14px 12px; }
  .yucore-ai-sub { display: none; }
  .yucore-ai-sugerencias { grid-template-columns: 1fr; max-width: none; }
  .yucore-ai-msg.bot, .yucore-ai-msg.user { max-width: 88%; }
  .yucore-ai-hola { font-size: 19px; }
}

/* ===== Omnicanal: badges, canales y bandeja ===== */
.yucore-badge { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; border-radius:999px; padding:2px 9px; }
.yucore-badge.ok { background:#eaf3ec; color:#2e8b57; }
.yucore-badge.err { background:#fde8e7; color:#E1251B; }
.yucore-badge.off { background:#eef0f4; color:#66707f; }
.yucore-badge.unread { background:#E1251B; color:#fff; }
.yucore-badge.unread.sm { padding:0 7px; font-size:11px; min-width:18px; justify-content:center; }

/* selector de tipo de canal */
.yucore-type-picker { display:flex; flex-wrap:wrap; gap:8px; }
.yucore-type-chip { display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:11px; background:#f4f6fa; border:1px solid #e4e8ef; color:#1B3A6B; text-decoration:none; font-weight:600; font-size:13.5px; transition:all .15s; }
.yucore-type-chip:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(18,42,82,.12); }
.yucore-type-chip.active { background:#1B3A6B; color:#fff; }
.yucore-type-chip.disabled { opacity:.5; cursor:not-allowed; }
.yucore-type-chip small { opacity:.7; font-weight:500; }

/* bandeja unificada */
.yucore-inbox { font-family:'Inter',system-ui,sans-serif; }
.yucore-inbox-layout { display:grid; grid-template-columns:320px 1fr; gap:16px; min-height:480px; }
.yucore-inbox-side { background:#fff; border:1px solid #e4e8ef; border-radius:14px; overflow:hidden; display:flex; flex-direction:column; }
.yucore-inbox-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #eef0f4; }
.yucore-inbox-title { font-weight:800; color:#1B3A6B; font-size:14.5px; }
.yucore-refresh { border:0; background:none; cursor:pointer; color:#66707f; font-size:15px; }
.yucore-refresh:hover { color:#1B3A6B; }
.yucore-conv-list { list-style:none; margin:0; padding:0; overflow-y:auto; flex:1; }
.yucore-conv-list li { border-bottom:1px solid #f2f4f7; }
.yucore-conv-item, .yucore-conv-list li > a { display:flex; align-items:center; gap:10px; padding:11px 14px; text-decoration:none; color:#1f2733; }
.yucore-conv-item:hover, .yucore-conv-list li > a:hover { background:#f6f8fb; }
.yucore-conv-item.active { background:#eef3fb; box-shadow:inset 3px 0 0 #1B3A6B; }
.yucore-conv-meta { display:flex; flex-direction:column; flex:1; min-width:0; }
.yucore-conv-name { font-weight:700; font-size:13.5px; color:#1B3A6B; }
.yucore-conv-last { font-size:12.5px; color:#66707f; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.yucore-inbox-main { background:#fff; border:1px solid #e4e8ef; border-radius:14px; display:flex; flex-direction:column; }
.yucore-thread-head { padding:12px 16px; border-bottom:1px solid #eef0f4; color:#1B3A6B; }
.yucore-thread-empty { color:#9aa3b2; }
.yucore-thread { flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; max-height:420px; }
.yucore-msg { max-width:78%; padding:9px 13px; border-radius:14px; font-size:13.5px; line-height:1.45; }
.yucore-msg.in { background:#f1f4f9; color:#1f2733; align-self:flex-start; border-bottom-left-radius:4px; }
.yucore-msg.out { background:#1B3A6B; color:#fff; align-self:flex-end; border-bottom-right-radius:4px; }
.yucore-msg-meta { font-size:10.5px; opacity:.6; margin-top:3px; }
.yucore-reply { display:flex; gap:8px; padding:10px 12px; border-top:1px solid #eef0f4; }
.yucore-reply textarea { flex:1; border:1px solid #e4e8ef; border-radius:12px; padding:8px 12px; resize:none; font-family:inherit; font-size:14px; }
.yucore-reply button { flex:0 0 auto; }
.yucore-inbox-empty { text-align:center; color:#66707f; padding:26px 16px; }
.yucore-inbox-empty .crm-i { font-size:24px; color:#c2c9d4; display:block; margin-bottom:8px; }

/* dashlet compacto */
.yucore-inbox-dashlet { font-family:'Inter',system-ui,sans-serif; }
.yucore-inbox-all { display:inline-block; margin-top:8px; font-size:13px; font-weight:600; color:#1B3A6B; text-decoration:none; }
.yucore-inbox-all:hover { text-decoration:underline; }

/* hub: tira de canales arriba de la bandeja */
.yucore-channels-strip { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px; }
.yucore-chan-pill { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px; background:#fff; border:1px solid #e4e8ef; font-weight:600; font-size:13px; color:#1B3A6B; cursor:pointer; transition:all .15s; user-select:none; }
.yucore-chan-pill:hover { box-shadow:0 4px 12px rgba(18,42,82,.12); transform:translateY(-1px); }
.yucore-chan-pill.off { opacity:.55; }
.yucore-chan-pill.soon { opacity:.4; cursor:default; }
.yucore-chan-pill.soon:hover { transform:none; box-shadow:none; }
.yucore-chan-pill.filtering { background:#1B3A6B; color:#fff; border-color:#1B3A6B; }
.yucore-chan-pill.filtering i { color:#fff !important; }
.yucore-chan-pill small { opacity:.7; font-weight:500; font-size:11px; }
.yucore-aitag { color:#2e8b57; font-size:12px; }
.yucore-chan-add { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:#f4f6fa; border:1px solid #e4e8ef; color:#1B3A6B; text-decoration:none; }
.yucore-chan-add:hover { background:#1B3A6B; color:#fff; }

/* área de respuesta enriquecida */
.yucore-reply { flex-direction:column; align-items:stretch; gap:8px; }
.yucore-reply-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.yucore-ai-suggest, .yucore-schedule-btn { display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border-radius:10px; border:1px solid #e4e8ef; background:#f4f6fa; color:#1B3A6B; font-weight:600; font-size:12.5px; cursor:pointer; }
.yucore-ai-suggest:hover { background:#eef3fb; border-color:#1B3A6B; }
.yucore-ai-suggest.loading { opacity:.6; pointer-events:none; }
.yucore-ai-suggest i { color:#2B5AA0; }
.yucore-schedule-btn:hover { background:#fdf2d6; border-color:#b8860b; color:#7a5c00; }
.yucore-send-btn { margin-left:auto; }
#yucore-schedule-when { border:1px solid #e4e8ef; border-radius:9px; padding:6px 8px; font-family:inherit; }

/* toggle auto-IA en la cabecera */
.yucore-ai-toggle { display:inline-flex; align-items:center; gap:5px; margin-left:12px; font-size:12.5px; font-weight:600; color:#2e8b57; cursor:pointer; }
.yucore-ai-toggle input { accent-color:#2e8b57; }

/* programados */
.yucore-scheduled { border-top:1px dashed #e4e8ef; padding:8px 12px; background:#fffdf6; }
.yucore-sched-title { font-size:12px; font-weight:700; color:#b8860b; margin-bottom:5px; }
.yucore-sched-item { display:flex; align-items:center; gap:10px; font-size:12.5px; color:#5c5340; padding:3px 0; }
.yucore-sched-item > span:first-child { font-variant-numeric:tabular-nums; color:#b8860b; white-space:nowrap; }
.yucore-sched-body { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.yucore-sched-cancel { color:#E1251B; cursor:pointer; font-weight:700; text-decoration:none; }

/* ===== Hub de Mensajería: barra de pestañas unificada ===== */
.yucore-hub-nav { display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin:0 0 18px; padding-bottom:0; border-bottom:2px solid #e4e8ef; }
.yucore-hub-title { font-family:'Inter',system-ui,sans-serif; font-weight:800; font-size:18px; color:#1B3A6B; display:flex; align-items:center; gap:8px; padding-bottom:10px; }
.yucore-hub-title .crm-i { color:#2B5AA0; }
.yucore-hub-tabs { display:flex; gap:4px; flex-wrap:wrap; }
.yucore-hub-tab { display:inline-flex; align-items:center; gap:7px; padding:10px 16px; font-weight:600; font-size:13.5px; color:#66707f; text-decoration:none; border-bottom:3px solid transparent; margin-bottom:-2px; transition:all .15s; }
.yucore-hub-tab:hover { color:#1B3A6B; background:#f6f8fb; }
.yucore-hub-tab.active { color:#1B3A6B; border-bottom-color:#1B3A6B; }
.yucore-hub-tab .crm-i { color:inherit; }

/* refuerzo del acceso "configurar canales" en la tira */
.yucore-chan-add { width:auto; border-radius:999px; padding:0 14px; height:34px; gap:6px; font-size:12.5px; font-weight:600; }

/* ===== Detalle de canal (sub-tabs) ===== */
.yucore-channel-detail { font-family:'Inter',system-ui,sans-serif; }
.yucore-chd-head { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.yucore-chd-id { display:flex; align-items:center; gap:14px; }
.yucore-chd-id > .crm-i { font-size:32px; }
.yucore-chd-name { font-weight:800; font-size:19px; color:#1B3A6B; }
.yucore-chd-type { font-size:13px; color:#66707f; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.yucore-chd-back { color:#2B5AA0; text-decoration:none; font-weight:600; font-size:13px; }
.yucore-chd-back:hover { color:#1B3A6B; }
.yucore-badge.ai { background:#eaf3ec; color:#2e8b57; }
.yucore-subtabs { display:flex; gap:4px; border-bottom:2px solid #e4e8ef; margin-bottom:18px; flex-wrap:wrap; }
.yucore-subtab { display:inline-flex; align-items:center; gap:7px; padding:10px 16px; font-weight:600; font-size:13.5px; color:#66707f; text-decoration:none; border-bottom:3px solid transparent; margin-bottom:-2px; }
.yucore-subtab:hover { color:#1B3A6B; background:#f6f8fb; }
.yucore-subtab.active { color:#1B3A6B; border-bottom-color:#1B3A6B; }
.yucore-subpanel { max-width:760px; }
.yucore-chan-link { font-weight:600; color:#1B3A6B; text-decoration:none; }
.yucore-chan-link:hover { text-decoration:underline; }
.yucore-danger-link { background:none; border:0; color:#E1251B; cursor:pointer; font-weight:600; padding:4px 0; }
.yucore-danger-link:hover { text-decoration:underline; }

/* ===== Tarjetas de automatización ===== */
.yucore-auto-card { background:#fff; border:1px solid #e4e8ef; border-radius:14px; padding:16px 18px; margin-bottom:14px; box-shadow:0 2px 8px rgba(18,42,82,.05); }
.yucore-auto-card-head { font-weight:800; color:#1B3A6B; font-size:14.5px; display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.yucore-auto-card-head .crm-i { color:#2B5AA0; }
.yucore-auto-toggle { display:flex; align-items:center; gap:9px; font-size:13.5px; font-weight:600; color:#1f2733; cursor:pointer; margin:6px 0; }
.yucore-auto-toggle input { accent-color:#1B3A6B; width:16px; height:16px; }
.yucore-auto-row { display:flex; gap:18px; align-items:center; margin:10px 0; font-size:13.5px; }
.yucore-auto-row input[type=time] { border:1px solid #e4e8ef; border-radius:8px; padding:5px 8px; }
.yucore-auto-days { display:flex; gap:6px; flex-wrap:wrap; margin:10px 0; }
.yucore-day { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:9px; background:#f4f6fa; border:1px solid #e4e8ef; font-size:12.5px; font-weight:600; color:#66707f; cursor:pointer; }
.yucore-day.on { background:#eef3fb; color:#1B3A6B; border-color:#1B3A6B; }
.yucore-day input { display:none; }
.yucore-auto-card textarea { width:100%; border:1px solid #e4e8ef; border-radius:10px; padding:9px 11px; font-family:inherit; font-size:13.5px; resize:vertical; margin-top:6px; }
.yucore-auto-warn { background:#fff8e8; border:1px solid #f2d98a; color:#7a5c00; border-radius:10px; padding:11px 13px; font-size:13px; }
.yucore-auto-warn a { font-weight:700; }
.yucore-pair { display:flex; gap:8px; margin-bottom:7px; align-items:center; }
.yucore-pair input { flex:1; border:1px solid #e4e8ef; border-radius:9px; padding:7px 10px; font-family:inherit; font-size:13px; }
.yucore-pair input:first-child { flex:0 0 180px; }
.yucore-pair-del { background:none; border:0; color:#E1251B; cursor:pointer; font-weight:700; font-size:14px; flex:0 0 auto; }
.yucore-add-pair { display:inline-flex; align-items:center; gap:6px; background:#f4f6fa; border:1px solid #e4e8ef; border-radius:9px; padding:6px 12px; font-weight:600; font-size:12.5px; color:#1B3A6B; cursor:pointer; margin-top:4px; }
.yucore-add-pair:hover { background:#eef3fb; }
.yucore-auto-table .description { font-weight:400; }

/* ===== Plantillas de WhatsApp ===== */
.yucore-tpl-toolbar { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.yucore-tpl-count { font-weight:700; color:#1B3A6B; }
.yucore-tpl-table td, .yucore-tpl-table th { vertical-align:middle; }
.yucore-tpl-grid { display:grid; grid-template-columns:1fr 320px; gap:24px; align-items:start; }
.yucore-tpl-fields h4 { margin:18px 0 6px; color:#1B3A6B; }
.yucore-tpl-fields h4 small { color:#9aa3b2; font-weight:500; }
.yucore-tpl-fields textarea, .yucore-tpl-fields input[type=text], .yucore-tpl-fields select { font-family:inherit; }
.yucore-tpl-fields textarea { width:100%; border:1px solid #e4e8ef; border-radius:10px; padding:9px 11px; font-size:13.5px; }
.yucore-ph-box, .yucore-map-box { background:#fffdf6; border:1px dashed #e4d9a8; border-radius:11px; padding:11px 13px; margin-top:10px; }
.yucore-btn-row { display:flex; gap:7px; align-items:center; margin-bottom:7px; flex-wrap:wrap; }
.yucore-btn-row select, .yucore-btn-row input { border:1px solid #e4e8ef; border-radius:9px; padding:7px 9px; font-size:13px; }
.yucore-btn-row input { flex:1; min-width:120px; }

/* vista previa estilo teléfono */
.yucore-tpl-preview { position:sticky; top:12px; }
.yucore-phone { background:#0b141a; border-radius:22px; padding:8px; box-shadow:0 10px 30px rgba(18,42,82,.25); }
.yucore-phone-bar { color:#fff; font-weight:700; font-size:13px; padding:8px 12px; display:flex; align-items:center; gap:8px; }
.yucore-phone-bar .crm-i { color:#25D366; }
.yucore-phone-screen { background:#e5ddd5 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3C/svg%3E"); border-radius:0 0 16px 16px; padding:14px 10px; min-height:300px; }
.yucore-bubble { background:#fff; border-radius:8px; padding:8px 10px 4px; max-width:88%; box-shadow:0 1px 1px rgba(0,0,0,.12); font-size:13.5px; color:#1f2733; position:relative; }
.yucore-bubble .pv-header { font-weight:700; margin-bottom:4px; }
.yucore-bubble .pv-body { white-space:pre-wrap; line-height:1.45; }
.yucore-bubble .pv-footer { color:#8a93a2; font-size:12px; margin-top:5px; }
.yucore-bubble .pv-time { text-align:right; color:#8a93a2; font-size:10.5px; margin-top:2px; }
.yucore-bubble-btns { margin-top:4px; display:flex; flex-direction:column; gap:3px; max-width:88%; }
.pv-btn { background:#fff; color:#1f9bd6; text-align:center; padding:8px; border-radius:8px; font-size:13.5px; font-weight:600; box-shadow:0 1px 1px rgba(0,0,0,.12); }

/* ===== Difusiones ===== */
.yucore-bc-head { display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.yucore-bc-name { font-size:18px; font-weight:800; color:#1B3A6B; border:0; border-bottom:2px dashed #e4e8ef; padding:4px 2px; flex:1; max-width:480px; font-family:inherit; }
.yucore-step { background:#fff; border:1px solid #e4e8ef; border-radius:14px; margin-bottom:14px; overflow:hidden; }
.yucore-step-h { display:flex; align-items:center; gap:10px; font-weight:800; color:#1B3A6B; padding:12px 16px; background:#f6f8fb; border-bottom:1px solid #eef0f4; }
.yucore-step-n { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:50%; background:#1B3A6B; color:#fff; font-size:13px; }
.yucore-step-b { padding:14px 16px; }
.yucore-step-b select, .yucore-step-b input[type=date], .yucore-step-b input[type=time] { border:1px solid #e4e8ef; border-radius:9px; padding:7px 10px; font-family:inherit; font-size:13.5px; }
.yucore-seg-list { display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; }
.yucore-seg-item { display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border:1px solid #e4e8ef; border-radius:10px; font-size:13.5px; cursor:pointer; }
.yucore-seg-item small { color:#9aa3b2; }
.yucore-radio { display:block; margin:6px 0; font-size:14px; cursor:pointer; }

/* responsive: bandeja en una columna en pantallas pequeñas */
@media (max-width:880px) { .yucore-inbox-layout { grid-template-columns:1fr; } .yucore-hub-nav { gap:8px; } .yucore-tpl-grid { grid-template-columns:1fr; } }