/* SIGUE360 V6.9.72 — Diseño adaptable.
   Notebook (≤1500 px de ancho o ≤820 px de alto): encabezado compacto en una sola franja, sin textos que salten de línea.
   Celular (≤760 px): barra superior mínima, contenido a una columna y barra de navegación inferior propia.
   Se carga al final: sólo ajusta medidas, no cambia funciones. */

/* ── Botón visible para abrir los módulos (antes sólo había una flechita escondida abajo a la izquierda) ── */
.app .workspace .topline .top-actions .s360ModBtn{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 12px;border-radius:10px;border:1px solid rgba(90,220,248,.35);background:rgba(13,72,101,.55);color:#eaf8fd;font:700 12px Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.app .workspace .topline .top-actions .s360ModBtn:hover{border-color:#5fe3ff}
.app .workspace .topline .top-actions .cleanGlobalNav58911{display:flex!important;gap:8px;align-items:flex-start}

/* El título del módulo ya está en la cabecera de cada pantalla: el de la franja superior se superponía. */
.app .workspace .topline .titleblock{display:none!important}
.app .workspace .topline{justify-content:flex-end!important}
.app .workspace .topline .top-actions #morganOperator>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}

/* Mi SIGUE360: acciones del espacio */
.s360SpaceNube{grid-template-columns:46px minmax(0,1fr)!important}
.s360SpaceNube .s360SpaceAcc{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.s360SpaceNube .s360SpaceAcc button{font-size:12px!important;min-height:36px!important;padding:0 12px!important}
.s360SpaceNube .s360SpaceAcc em{display:inline-block;margin-left:4px;background:#e5677d;color:#fff;border-radius:9px;padding:0 6px;font-style:normal}
.s360Equipo{scroll-margin-top:90px}
.s360Solicitudes,.s360Espacios{padding:12px;border:1px solid var(--ui-border-rgba,rgba(127,160,200,.25));border-radius:10px;margin-bottom:14px}
.s360Solicitudes{border-color:rgba(255,196,92,.55);background:rgba(255,196,92,.06)}
.s360Solicitudes select{padding:6px 8px;border-radius:8px;background:transparent;color:inherit;border:1px solid rgba(127,160,200,.35)}
.s360Solicitudes select option{color:#000}
.s360Espacios .btn{margin:4px 6px 0 0}
.s360Borrar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}.s360Borrar input{flex:1;min-width:180px;padding:8px 10px;border-radius:8px;border:1px solid rgba(255,120,120,.5);background:transparent;color:inherit}

/* ═════════ NOTEBOOK ═════════ */
@media (min-width:901px){
  .app .workspace .topline{height:auto!important;min-height:0!important;flex:0 0 auto!important;padding-bottom:4px;flex-wrap:nowrap!important}
  .app .workspace .topline .top-actions{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:8px!important;min-width:0}
  .app .workspace .topline .top-actions #s624AgentStack,.app .workspace .topline .top-actions #s624DateStack{display:flex!important;flex-direction:row!important;gap:8px!important;align-items:center!important}
  .app .workspace .topline .top-actions #v55AgentContext{width:auto!important;max-width:250px;min-height:46px!important;height:46px!important;padding:6px 10px!important;overflow:hidden}
  .app .workspace .topline .top-actions #v55AgentContext span span,.app .workspace .topline .top-actions #v55AgentContext br{display:none!important}
  .app .workspace .topline .top-actions #v55AgentContext b{display:block;max-width:200px;overflow:hidden;text-overflow:ellipsis}
  .app .workspace .topline .top-actions #aiBtn{display:none!important}
  .app .workspace .topline .top-actions #v55AgentContext br{display:none}
  .app .workspace .topline .top-actions #aiBtn{width:auto!important;min-height:46px!important;height:46px!important;padding:4px 12px 4px 6px!important}
  .app .workspace .topline .top-actions #aiBtn .aiorb{width:32px!important;height:32px!important}
  .app .workspace .topline .top-actions .datebox{min-height:46px!important;height:46px!important;padding:5px 12px!important;width:auto!important}
  .app .workspace .topline .top-actions .datebox b{font-size:17px!important;white-space:nowrap}
  .app .workspace .topline .top-actions .datebox small,.app .workspace .topline .top-actions #aiBtn b,.app .workspace .topline .top-actions #aiBtn small,.app .workspace .topline .top-actions #v55AgentContext b,.app .workspace .topline .top-actions #s622Notify span{white-space:nowrap!important}
  .app .workspace .topline .top-actions #s624AgentStack,.app .workspace .topline .top-actions #s624DateStack{flex:0 0 auto!important;min-width:0!important;flex-basis:auto!important;width:auto!important;max-width:none!important}
  .app .workspace .topline .top-actions #s624AgentStack>*,.app .workspace .topline .top-actions #s624DateStack>*{width:auto!important;flex:0 0 auto!important}
  .app .workspace .topline .top-actions #s622Notify{min-height:46px!important;height:46px!important;width:auto!important;padding:0 14px!important}
  .app .workspace .topline .top-actions #morganOperator{flex-wrap:nowrap!important;gap:6px!important;min-width:0}
  .app .workspace .topline .top-actions #morganOperator>span{max-width:230px;font-size:11px!important}
  .app .workspace .topline .top-actions .cleanGlobalNav58911 button{min-height:46px!important}
  .app .workspace .topline .top-actions .s360ModBtn{min-height:46px}
}
@media (max-width:1280px){
  .app .workspace .topline .top-actions #morganOperator>span{display:none!important}
  .app .workspace .topline .top-actions #aiBtn small,.app .workspace .topline .top-actions #aiBtn div:not(.aiorb) small{display:none!important}
  .app .workspace .topline .top-actions #v55AgentContext{max-width:190px}
}
@media (max-width:1180px) and (min-width:901px){
  .app .workspace .topline .top-actions .datebox{display:none!important}
  .app .workspace .topline .top-actions #v55AgentContext{display:none!important}
  .app .workspace .topline .top-actions #aiBtn div:not(.aiorb){display:none!important}
  .app .workspace .topline .top-actions .datebox small{display:none!important}
  .app .workspace .topline .top-actions #s622Notify span:nth-child(2){display:none!important}
}

/* Textos de tarjetas que se pisaban: siempre cortan dentro de su caja */
#mainCanvas .card,#mainCanvas section,#mainCanvas [class*="Card"]{min-width:0;overflow-wrap:anywhere}
#mainCanvas .sectionTitle{flex-wrap:wrap;gap:6px}
#mainCanvas .sectionTitle h3{min-width:0}

/* ═════════ CELULAR ═════════ */
#s360MobBrand,#s360BottomNav,#s360Mas{display:none}
@media (max-width:900px){
  html,body{font-size:14px}
  .bg{background-position:-120px 0!important;opacity:.35}
  #menuEdge,#navDrawer,.syncBar,.brandbar{display:none!important}
  .workspace{left:0!important;right:0!important;bottom:62px!important;padding:0!important;gap:0!important;background:linear-gradient(180deg,#061a2b,#04101d)!important}

  /* Barra superior mínima */
  .app .workspace .topline{flex-wrap:nowrap!important;position:relative!important;height:54px!important;min-height:54px!important;flex:0 0 54px!important;padding:0 8px!important;margin:0!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;background:#071c2e;border-bottom:1px solid rgba(90,220,248,.25);z-index:60!important}
  #s360MobBrand{display:flex;align-items:center;gap:6px;font:900 19px Inter,system-ui,sans-serif;letter-spacing:.02em;color:#dfe9ee;min-width:0;white-space:nowrap}
  #s360MobBrand b{color:#23d3ff}#s360MobBrand small{display:none;font:600 11px Inter,system-ui;color:#8faab7;overflow:hidden;text-overflow:ellipsis;max-width:120px}
  .app .workspace .topline .top-actions{display:flex!important;flex-wrap:nowrap!important;gap:6px!important;align-items:center!important;flex:0 0 auto!important;margin:0!important}
  .app .workspace .topline .top-actions #morganOperator,.app .workspace .topline .top-actions #s624AgentStack,.app .workspace .topline .top-actions .datebox,.app .workspace .topline .top-actions .s360ModBtn{display:none!important}
  .app .workspace .topline .top-actions #s624DateStack{display:flex!important;margin:0!important}
  .app .workspace .topline .top-actions .cleanGlobalNav58911 button{min-height:38px!important;height:38px!important;padding:0 10px!important;font-size:12px!important;width:auto!important}
  .app .workspace .topline .top-actions #s622Notify{min-height:38px!important;height:38px!important;width:auto!important;padding:0 10px!important;margin:0!important}
  .app .workspace .topline .top-actions #s622Notify span:nth-child(2){display:none!important}

  /* Contenido */
  #mainCanvas,.canvas{padding:0 10px 18px!important;margin:0!important;top:0!important}
  #mainCanvas .page{padding-left:0!important;padding-right:0!important;max-width:100%!important;min-width:0!important}
  #mainCanvas .card{padding:12px!important;border-radius:12px!important}
  #mainCanvas h1{font-size:22px!important}#mainCanvas h2{font-size:20px!important}#mainCanvas h3{font-size:16px!important}
  #mainCanvas input,#mainCanvas select,#mainCanvas textarea{font-size:16px!important;max-width:100%}
  #mainCanvas img,#mainCanvas svg,#mainCanvas canvas,#mainCanvas iframe{max-width:100%}
  #mainCanvas .toolbar,#mainCanvas .agFiltros,#mainCanvas .comTabs,#mainCanvas .mailBar,#mainCanvas .mailSelBar{flex-wrap:wrap!important}
  #mainCanvas .btn{min-height:38px}

  /* Cabecera de cada módulo */
  .app #mainCanvas .page > .ownerFloatChrome588,.app #mainCanvas .page > .roleFloatChrome5885,.app #mainCanvas .page > .s622PageBar{min-height:52px!important;padding:6px 8px!important;margin:0 0 10px!important;gap:8px!important}
  .app #mainCanvas .page > .ownerFloatChrome588{max-width:100%!important;box-sizing:border-box!important}
  .ownerFloatTitle588{min-width:0!important;flex:1 1 0!important;overflow:hidden}
  .ownerBackBtn588,.roleBackBtn5885{min-width:0!important;min-height:38px!important;padding:6px 10px!important;font-size:13px!important}
  .ownerFloatTitle588 b,.ownerFloatTitle588 h2{font-size:17px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ownerFloatTitle588 small,.ownerFloatTitle588 p,.ownerFloatContext588{display:none!important}

  /* Clases que pone el ajuste automático */
  .s360G1{grid-template-columns:minmax(0,1fr)!important;grid-column:auto}
  .s360G1>*{grid-column:auto!important;min-width:0}
  .s360G2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .s360G2>*{grid-column:auto!important;min-width:0}
  .s360Wrap{flex-wrap:wrap!important}
  .s360Wrap>*{min-width:0;max-width:100%}
  .s360XScroll{overflow-x:auto!important;-webkit-overflow-scrolling:touch;max-width:100%}
  .s360Max{max-width:100%!important;min-width:0!important;width:auto!important}

  /* Paneles y ventanas emergentes a pantalla completa */
  .comModal{padding:0!important;align-items:stretch!important}
  .comDialog{width:100%!important;max-height:100%!important;height:100%;border-radius:0!important}
  .mailLayout{grid-template-columns:1fr!important}
  .mailCarpetas{position:static!important;flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto}
  .mailCarpetas .mailCarp{width:auto!important;flex:0 0 auto}.mailCarpetas .mailEt{display:none}
  .agLectura{min-height:0}
  #s623Tray{left:0!important;right:0!important;top:54px!important;bottom:62px!important;width:auto!important;max-width:none!important;border-radius:0!important}

  /* Estado de la nube: compacto, sobre la barra inferior */
  #nubePill{bottom:68px!important;left:auto!important;right:8px!important;transform:none!important;padding:4px 10px!important;font-size:11px!important;max-width:calc(100vw - 16px)}
  #nubePill>span:nth-child(2){display:none!important}
  #nubePill.s360Ok{display:none!important}

  /* Barra inferior */
  #s360BottomNav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;height:62px;z-index:99990;background:#06182a;border-top:1px solid rgba(90,220,248,.3);padding-bottom:env(safe-area-inset-bottom)}
  #s360BottomNav button{border:0;background:none;color:#9cc6d6;font:600 10.5px Inter,system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;position:relative}
  #s360BottomNav button span{font-size:20px;line-height:1}
  #s360BottomNav button.on{color:#23d3ff}
  #s360BottomNav button em{position:absolute;top:6px;left:54%;background:#e5677d;color:#fff;border-radius:9px;font:700 10px Inter;padding:0 5px;font-style:normal}
  #s360Mas{position:fixed;left:0;right:0;bottom:62px;top:54px;z-index:99989;background:rgba(2,10,18,.6);align-items:flex-end}
  #s360Mas.open{display:flex}
  #s360Mas .s360MasHoja{width:100%;max-height:100%;overflow:auto;background:#0a2236;border-top:1px solid rgba(90,220,248,.35);border-radius:16px 16px 0 0;padding:14px 12px 18px}
  #s360Mas h4{margin:4px 4px 10px;color:#8faab7;font:700 11px Inter;letter-spacing:.08em;text-transform:uppercase}
  #s360Mas .s360MasGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  #s360Mas .s360MasGrid button{min-height:70px;border-radius:12px;border:1px solid rgba(90,220,248,.22);background:rgba(13,72,101,.35);color:#eaf8fd;font:600 12px Inter;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:6px}
  #s360Mas .s360MasGrid button span{font-size:22px}
  #s360Mas .s360MasGrid button.on{border-color:#23d3ff;background:rgba(31,184,220,.22)}
  #s360Mas .s360MasExtra{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
  #s360Mas .s360MasExtra button{flex:1 1 45%;min-height:42px;border-radius:10px;border:1px solid rgba(90,220,248,.3);background:transparent;color:#eaf8fd;font:600 13px Inter}
}