/* r17 (Piero 06/11): campana de avisos (módulo 105) y Bandeja con tus pendientes (módulo 106).
   La campana va en la barra de arriba, antes del botón de la cuenta; el panel se abre debajo de ella y no cubre la barra de abajo del celular. */

/* ---------- campana ---------- */
.mc-camp-boton { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0 !important;
  border-radius: 12px; border: 1px solid var(--linea, #2f2b70); background: var(--sup-2, #1d1a4f); color: var(--texto, #f4f3ff); cursor: pointer; box-shadow: none; text-transform: none; }
.mc-camp-boton:hover { background: var(--sup-3, #262263); }
.mc-camp-boton:focus-visible, .mc-camp-panel button:focus-visible, .mc-bj button:focus-visible, .mc-camp-enlace:focus-visible { outline: 2px solid var(--info, #00d4ff); outline-offset: 2px; }
.mc-camp-boton[aria-expanded="true"] { border-color: var(--violeta, #8b5cf6); background: var(--sup-3, #262263); }
.mc-camp-boton svg { display: block; pointer-events: none; }
.mc-camp-num { position: absolute; top: -6px; right: -6px; min-width: 20px; height: 20px; padding: 0 5px; box-sizing: border-box; border-radius: 10px; background: var(--rojo, #ff2d55); color: #fff;
  font: 800 12px/20px var(--f-datos, system-ui, sans-serif); text-align: center; border: 2px solid var(--noche, #0b0a24); }
.mc-camp-num[hidden] { display: none; }
.mc-camp-late { animation: mc-camp-late .9s ease-out 1; }
@keyframes mc-camp-late { 0% { box-shadow: 0 0 0 0 rgba(255, 45, 85, .7); } 100% { box-shadow: 0 0 0 14px rgba(255, 45, 85, 0); } }
@media (prefers-reduced-motion: reduce) { .mc-camp-late { animation: none; } }
.mc-camp-vivo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* En celular la campana tiene su propia celda en la fila de arriba (logo · ES|EN · espacio · mundo · lupa · campana · cuenta · menú). */
@media (max-width: 560px) {
  html body.marcador .nav-container { grid-template-columns: auto auto minmax(0, 1fr) auto auto auto auto auto !important;
    grid-template-areas: "logo idioma . world lupa campana cuenta menu" "review review review review review review review review" "accountmode accountmode accountmode accountmode accountmode accountmode accountmode accountmode" "buscar buscar buscar buscar buscar buscar buscar buscar" "ticker ticker ticker ticker ticker ticker ticker ticker" !important; }
  html body.marcador #mc-camp-boton { grid-area: campana; width: 36px; min-width: 36px; height: 40px; min-height: 40px; border-radius: 10px; }
  .mc-camp-num { top: -7px; right: -5px; }
}
@media (min-width: 561px) and (max-width: 1023px) { body.marcador #mc-camp-boton { order: 4; } }

/* ---------- panel ---------- */
.mc-camp-panel { position: fixed; z-index: 9998; display: flex; flex-direction: column; box-sizing: border-box; max-width: calc(100vw - 16px);
  background: var(--sup-1, #14123a); color: var(--texto, #f4f3ff); border: 1px solid var(--linea-fuerte, #463f9a); border-radius: 16px; box-shadow: 0 18px 50px rgba(5, 4, 20, .75); font: 500 15px/1.4 var(--f-texto, system-ui, sans-serif); overflow: hidden; }
.mc-camp-panel[hidden] { display: none; }
.mc-camp-cabecera { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px 8px; }
.mc-camp-titulo { margin: 0; font: 800 22px/1.1 var(--f-display, sans-serif); letter-spacing: .02em; color: var(--texto, #f4f3ff); text-transform: none; }
.mc-camp-cerrar { width: 44px; height: 44px; min-width: 44px; padding: 0; border: 0; background: none; color: var(--suave, #b9b6dd); font-size: 28px; line-height: 1; cursor: pointer; border-radius: 10px; box-shadow: none; }
.mc-camp-cerrar:hover { background: var(--sup-2, #1d1a4f); color: var(--texto, #f4f3ff); }
.mc-camp-barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 0 14px 10px; border-bottom: 1px solid var(--linea, #2f2b70); }
.mc-camp-tabs { display: inline-flex; gap: 4px; padding: 3px; border-radius: 10px; background: var(--sup-2, #1d1a4f); }
.mc-camp-tab { min-height: 36px; padding: 0 12px; border: 0; border-radius: 8px; background: none; color: var(--suave, #b9b6dd); font: 700 14px var(--f-datos, sans-serif); cursor: pointer; box-shadow: none; text-transform: none; }
.mc-camp-tab-on { background: var(--violeta-boton, #7344f0); color: #fff; }
.mc-camp-btn { min-height: 40px; padding: 6px 12px; border-radius: 10px; border: 1px solid var(--linea-fuerte, #463f9a); background: var(--sup-2, #1d1a4f); color: var(--texto, #f4f3ff); font: 700 14px var(--f-datos, sans-serif); cursor: pointer; box-shadow: none; text-transform: none; }
.mc-camp-btn:hover:not(:disabled) { background: var(--sup-3, #262263); }
.mc-camp-btn:disabled { opacity: .6; cursor: default; }
.mc-camp-lista-caja { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 0; }
.mc-camp-vacio { margin: 0; padding: 24px 16px; text-align: center; color: var(--suave, #b9b6dd); }
.mc-camp-vacio p { margin: 0 0 12px; }
.mc-camp-mas { display: block; margin: 8px auto 12px; }
.mc-camp-pie { padding: 10px 14px; border-top: 1px solid var(--linea, #2f2b70); text-align: right; }
.mc-camp-enlace { color: var(--violeta-texto, #b49dff); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; min-height: 36px; display: inline-flex; align-items: center; }

/* ---------- una fila de aviso (campana y Bandeja) ---------- */
.mc-camp-lista { list-style: none; margin: 0; padding: 0; }
.mc-camp-fila { display: grid; grid-template-columns: 12px minmax(0, 1fr); gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--linea, #2f2b70); }
.mc-camp-fila:last-child { border-bottom: 0; }
.mc-camp-punto { width: 10px; height: 10px; margin-top: 6px; border-radius: 50%; background: transparent; border: 1px solid var(--linea-fuerte, #463f9a); }
.mc-camp-sin-leer .mc-camp-punto { background: var(--rojo, #ff2d55); border-color: var(--rojo, #ff2d55); }
.mc-camp-sin-leer { background: rgba(139, 92, 246, .08); }
.mc-camp-cuerpo { min-width: 0; }
.mc-camp-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.mc-camp-tit { min-width: 0; overflow-wrap: anywhere; font: 700 15px/1.3 var(--f-datos, sans-serif); color: var(--texto, #f4f3ff); }
.mc-camp-hace { flex: 0 0 auto; font-size: 12px; color: var(--tenue, #9792c8); white-space: nowrap; }
.mc-camp-chip { display: inline-block; margin: 4px 0 0; padding: 1px 8px; border-radius: 999px; background: rgba(245, 197, 66, .16); border: 1px solid var(--espera, #f5c542); color: var(--espera, #f5c542); font: 800 12px/1.5 var(--f-datos, sans-serif); }
.mc-camp-txt { margin: 4px 0 0; color: var(--suave, #b9b6dd); font-size: 14px; overflow-wrap: anywhere; white-space: pre-line; }
.mc-camp-orig { margin: 3px 0 0; color: var(--suave, #b9b6dd); font-size: 12px; opacity: .75; overflow-wrap: anywhere; }
.mc-camp-acc { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.mc-camp-ir, .mc-camp-leer, .mc-camp-quitar { min-height: 40px; padding: 6px 14px; border-radius: 10px; font: 700 14px var(--f-datos, sans-serif); cursor: pointer; box-shadow: none; text-transform: none; }
.mc-camp-ir { border: 0; background: var(--violeta-boton, #7344f0); color: #fff; }
.mc-camp-ir:hover:not(:disabled) { background: var(--violeta, #8b5cf6); }
.mc-camp-quitar { border: 1px solid var(--linea-fuerte, #463f9a); background: transparent; color: var(--texto, #f4f3ff); }
.mc-camp-quitar:hover:not(:disabled) { background: var(--sup-2, #1d1a4f); }
.mc-camp-quitado { align-self: center; font: 600 14px var(--f-datos, sans-serif); color: var(--suave, #b9b6dd); }
.mc-camp-leer { border: 1px solid var(--linea-fuerte, #463f9a); background: transparent; color: var(--suave, #b9b6dd); }
.mc-camp-leer:hover:not(:disabled) { background: var(--sup-2, #1d1a4f); color: var(--texto, #f4f3ff); }
.mc-camp-ir:disabled, .mc-camp-leer:disabled { opacity: .6; cursor: default; }
.mc-camp-msg { margin: 8px 0 0; padding: 0; font-size: 13px; color: var(--espera, #f5c542); }
.mc-camp-msg[hidden] { display: none; }
.mc-camp-resalta { outline: 3px solid var(--violeta, #8b5cf6); outline-offset: 4px; border-radius: 12px; transition: outline-color .4s; }

/* ---------- Bandeja ---------- */
.mc-bj { max-width: 920px; margin: 0 auto; padding: 8px 4px 40px; color: var(--texto, #f4f3ff); }
.mc-bj-cab h1 { margin: 8px 0 4px; font: 800 30px/1.1 var(--f-display, sans-serif); letter-spacing: .02em; text-transform: none; color: var(--texto, #f4f3ff); }
.mc-bj-intro { margin: 0 0 16px; color: var(--suave, #b9b6dd); }
.mc-bj-sec { margin: 0 0 18px; border: 1px solid var(--linea, #2f2b70); border-radius: 16px; background: var(--sup-1, #14123a); overflow: hidden; }
.mc-bj-sec > h2 { margin: 0; padding: 12px 14px 4px; font: 800 20px/1.2 var(--f-display, sans-serif); letter-spacing: .02em; text-transform: none; color: var(--texto, #f4f3ff); }
.mc-bj-sec > .mc-bj-nota { margin: 0; padding: 0 14px 8px; color: var(--tenue, #9792c8); font-size: 14px; }
.mc-bj-sec .mc-camp-lista { border-top: 1px solid var(--linea, #2f2b70); }
.mc-bj-vacio { margin: 0; padding: 14px; color: var(--suave, #b9b6dd); }
.mc-bj-colas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linea, #2f2b70); }
.mc-bj-cola { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 12px 14px; border-bottom: 1px solid var(--linea, #2f2b70); }
.mc-bj-cola:last-child { border-bottom: 0; }
.mc-bj-cola-t { min-width: 0; font: 700 16px var(--f-datos, sans-serif); }
.mc-bj-cola-n { margin-left: 8px; padding: 0 9px; border-radius: 999px; background: var(--rojo, #ff2d55); color: #fff; font: 800 13px/22px var(--f-datos, sans-serif); }
.mc-bj-cola-d { display: block; margin-top: 2px; font: 400 13px var(--f-texto, sans-serif); color: var(--tenue, #9792c8); }
.mc-bj-enlaces { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--linea, #2f2b70); }
.mc-bj-btn { min-height: 40px; padding: 6px 14px; border-radius: 10px; border: 0; background: var(--violeta-boton, #7344f0); color: #fff; font: 700 14px var(--f-datos, sans-serif); cursor: pointer; box-shadow: none; text-transform: none; text-decoration: none; display: inline-flex; align-items: center; }
.mc-bj-btn:hover:not(:disabled) { background: var(--violeta, #8b5cf6); }
.mc-bj-btn:disabled { opacity: .6; cursor: default; }
.mc-bj-btn-2 { background: transparent; border: 1px solid var(--linea-fuerte, #463f9a); color: var(--texto, #f4f3ff); }
.mc-bj-btn-2:hover:not(:disabled) { background: var(--sup-2, #1d1a4f); }

/* Pedidos de privacidad (solo Súper Admin) */
.mc-bj-pedidos { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linea, #2f2b70); }
.mc-bj-pedido { padding: 12px 14px; border-bottom: 1px solid var(--linea, #2f2b70); }
.mc-bj-pedido:last-child { border-bottom: 0; }
.mc-bj-pedido-cab { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.mc-bj-pedido-tipo { font: 800 16px var(--f-datos, sans-serif); }
.mc-bj-pedido-estado { padding: 0 8px; border-radius: 999px; font: 800 12px/20px var(--f-datos, sans-serif); border: 1px solid var(--espera, #f5c542); color: var(--espera, #f5c542); }
.mc-bj-pedido-estado.ok { border-color: var(--ok, #20e89b); color: var(--ok, #20e89b); }
.mc-bj-pedido-quien, .mc-bj-pedido-fecha { font-size: 13px; color: var(--tenue, #9792c8); overflow-wrap: anywhere; }
.mc-bj-pedido-det { margin: 6px 0 0; color: var(--suave, #b9b6dd); overflow-wrap: anywhere; white-space: pre-line; }
.mc-bj-pedido-nota { margin: 6px 0 0; font-size: 13px; color: var(--ok, #20e89b); overflow-wrap: anywhere; }
.mc-bj-form { display: grid; gap: 8px; margin-top: 10px; }
.mc-bj-form label { font: 700 13px var(--f-datos, sans-serif); color: var(--suave, #b9b6dd); }
.mc-bj-form textarea { width: 100%; box-sizing: border-box; min-height: 70px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--linea-fuerte, #463f9a); background: var(--noche, #0b0a24); color: var(--texto, #f4f3ff); font: 400 15px var(--f-texto, sans-serif); resize: vertical; }
.mc-bj-form .mc-bj-fila { display: flex; flex-wrap: wrap; gap: 8px; }
.mc-bj-estado { margin: 8px 0 0; font-size: 14px; color: var(--suave, #b9b6dd); }
.mc-bj-estado.error { color: var(--error, #ff6b6b); }
.mc-bj-estado.ok { color: var(--ok, #20e89b); }
.mc-bj-filtro { display: inline-flex; gap: 4px; margin: 0 14px 8px; padding: 3px; border-radius: 10px; background: var(--sup-2, #1d1a4f); }

@media (max-width: 560px) {
  .mc-bj-cab h1 { font-size: 26px; }
  .mc-camp-fila { padding: 12px 12px; gap: 8px; }
  .mc-camp-cab { flex-wrap: wrap; }
  .mc-camp-acc > button { flex: 1 1 100%; }
  .mc-bj-cola > .mc-bj-btn { flex: 1 1 100%; justify-content: center; }
  .mc-bj-form .mc-bj-fila > button { flex: 1 1 100%; }
}

/* Portal de Administración: la campana es un botón más de la barra propia (no se encoge ni se sale). */
html body #ticopa-portal-header > #mc-camp-boton { flex: 0 0 40px; width: 40px; min-width: 40px; max-width: 40px; height: 40px; min-height: 40px; padding: 0 !important; border-radius: 12px !important; }
html body #ticopa-portal-header > #mc-camp-boton svg { display: block !important; }