/* EIC Portal V18.10 - Mobile First hardening
   Celular es la superficie primaria. Este archivo se carga al final y solo corrige
   layout/interaccion; no cambia permisos ni datos. */
:root{--eic-mobile-gap:12px}
html,body{max-width:100%;overflow-x:hidden}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
*,*::before,*::after{box-sizing:border-box}
img,video,canvas,svg,iframe{max-width:100%}
button,input,select,textarea{font:inherit}
input,select,textarea{max-width:100%;min-width:0}
button,a,[role="button"],summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.portal-shell,#portal,#n9-panel,.n9-card,.modal,.modal-section,.table-wrap{min-width:0;max-width:100%}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.n9-row,.fs-row,.ra-ref,.ra-event,.m181-grid>*{min-width:0}
.n9-row strong,.n9-row small,.fs-row strong,.fs-row small,.ra-event-body,.ra-ref-main{overflow-wrap:anywhere;word-break:break-word}

/* Los módulos retirados temporalmente no deben reaparecer por código heredado. */
#view-workload,#view-appointments,#appointmentModal,#newAppointmentButton{display:none!important}

/* Los modales siempre deben estar por encima de la navegación. */
.modal-backdrop{z-index:2400!important}
#documentModal{z-index:2600!important}
#signatureModal{z-index:2700!important}
#notificationPanel{z-index:900!important}
.toast,.n9-toast{z-index:5000!important}
.n9-dialog{z-index:3000!important}
.n9-dialog::backdrop{background:rgba(15,20,27,.48)}

/* Impide zoom automático de iOS en campos de formulario. */
@media(max-width:700px){
  input,select,textarea,.form-grid input,.form-grid select,.form-grid textarea,.n9-field input,.n9-field select,.n9-field textarea{font-size:16px!important}
  body{overflow-x:hidden!important}
  #portal{padding-left:max(10px,env(safe-area-inset-left))!important;padding-right:max(10px,env(safe-area-inset-right))!important}
  #portal .portal-shell{width:100%!important;max-width:100%!important;margin:0!important}

  /* Navegación: compacta pero tocable. */
  #n9-nav.n17-nav{z-index:800!important;gap:8px!important}
  .n17-nav-actions>.n9-btn,.n17-menu>summary{min-width:46px!important;min-height:46px!important}
  .n17-menu-panel{z-index:850!important;grid-template-columns:1fr!important;left:max(8px,env(safe-area-inset-left))!important;right:max(8px,env(safe-area-inset-right))!important;top:max(72px,calc(env(safe-area-inset-top) + 58px))!important;width:auto!important;max-height:calc(100dvh - 88px - env(safe-area-inset-bottom))!important;padding:10px!important;border-radius:16px!important}
  .n17-menu-group{min-width:0!important}
  .n17-menu-group .n9-btn{min-height:46px!important;width:100%!important;justify-content:flex-start!important}

  /* Encabezados: título + descripción + acción sin desbordar. */
  .n9-section-head,.ra-head,.fs-head,.ip188-head,.m181-head{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important}
  .n9-section-head>div,.ra-head>div,.fs-head>div,.ip188-head>div,.m181-head>div{min-width:0!important}
  .n9-section-head h1,.ra-head h1,.fs-head h1,.ip188-head h1{font-size:24px!important;line-height:1.08!important;margin-top:0!important}
  .n9-section-head p,.ra-head p,.fs-head p,.ip188-head p{font-size:13px!important;line-height:1.45!important;max-width:none!important}
  .n9-section-actions{width:100%!important;display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important}
  .n9-section-actions>.n9-btn{width:auto!important;min-width:46px!important;min-height:46px!important}

  /* Formularios generales: una columna en celular. */
  .form-grid,.n9-two,.m181-grid,.ra-filter-grid,.ra-two,.fs-form-row,.fs-owner-grid,.ip188-triplet,.choice-grid,.brand-grid,.device-types{grid-template-columns:1fr!important}
  .form-grid .wide{grid-column:auto!important}
  .customer-search{grid-template-columns:1fr!important}
  .customer-search button{width:100%!important;min-height:46px!important}
  .select-card{min-height:58px!important;flex-direction:row!important;justify-content:flex-start!important;text-align:left!important;padding:10px 12px!important}
  .choice-grid .pill-choice,.pill-choice{min-height:46px!important;height:auto!important;padding:10px 12px!important}
  .modal-section{padding:13px!important;margin-top:10px!important}
  .modal-section h3{font-size:17px!important}
  .field,.form-grid input,.form-grid select,.customer-search input{min-height:48px!important;height:48px!important}
  .form-grid textarea{min-height:110px!important}

  /* Modales: hoja completa/semicompleta, sin quedar detrás del header. */
  .modal-backdrop{padding:0!important;place-items:end stretch!important;align-items:end!important;background:rgba(15,20,27,.46)!important}
  .modal{width:100%!important;max-width:none!important;max-height:calc(100dvh - max(8px,env(safe-area-inset-top)))!important;margin:0!important;border-radius:22px 22px 0 0!important;padding:14px!important;padding-bottom:max(14px,env(safe-area-inset-bottom))!important;overscroll-behavior:contain!important}
  .modal.wide{width:100%!important}
  .modal-head{position:sticky!important;top:-14px!important;z-index:8!important;background:#fff!important;padding:14px 0 10px!important;margin-top:-14px!important;border-bottom:1px solid #edf0f4!important}
  .modal-head h2{font-size:22px!important;line-height:1.1!important;min-width:0!important;overflow-wrap:anywhere!important}
  .close-modal{flex:0 0 46px!important;width:46px!important;height:46px!important;border-radius:13px!important}
  .modal-actions{position:sticky!important;bottom:calc(-1 * max(14px,env(safe-area-inset-bottom)))!important;z-index:7!important;background:#fff!important;padding:10px 0 max(14px,env(safe-area-inset-bottom))!important;margin-bottom:calc(-1 * max(14px,env(safe-area-inset-bottom)))!important;flex-wrap:wrap!important}
  .modal-actions button{flex:1 1 140px!important;min-height:48px!important;height:auto!important}

  /* Nota completa: ocupa la pantalla y el iframe usa todo el alto disponible. */
  #documentModal{align-items:stretch!important;place-items:stretch!important}
  #documentModal .document-modal{height:100dvh!important;max-height:100dvh!important;border-radius:0!important;display:flex!important;flex-direction:column!important;padding-top:max(10px,env(safe-area-inset-top))!important}
  #documentModal .modal-head{top:calc(-1 * max(10px,env(safe-area-inset-top)))!important;padding-top:max(14px,env(safe-area-inset-top))!important;margin-top:calc(-1 * max(10px,env(safe-area-inset-top)))!important}
  .document-tools{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;flex:0 0 auto!important}
  .document-tools label{font-size:12px!important}
  .document-tools select,.document-tools button{width:100%!important;min-height:48px!important}
  .document-frame{flex:1 1 auto!important;width:100%!important;height:auto!important;min-height:0!important;border-radius:12px!important}

  /* Firma: documento + firma sin desbordamiento horizontal. */
  #signatureModal .modal{height:100dvh!important;max-height:100dvh!important;border-radius:0!important;display:flex!important;flex-direction:column!important;padding-top:max(10px,env(safe-area-inset-top))!important}
  .signature-document-frame{width:100%!important;min-height:160px!important;height:28dvh!important;flex:0 0 auto!important}
  .signature-box{height:190px!important;flex:0 0 auto!important}
  .signature-tools{flex-direction:column!important;align-items:stretch!important}
  .signature-tools button{width:100%!important;min-height:44px!important}

  /* Dialogs de módulos nuevos. */
  .n9-dialog{width:calc(100% - 16px)!important;max-width:none!important;max-height:calc(100dvh - 16px)!important;margin:auto!important;padding:16px!important;border-radius:18px!important}
  .n9-dialog-body{min-width:0!important;overflow-x:hidden!important}
  .n9-dialog .n9-field input,.n9-dialog .n9-field select,.n9-dialog .n9-field textarea{width:100%!important;min-height:46px!important}

  /* Remisiones: prioridad lectura móvil. */
  #view-notes .n91-note-collection.n91-grid{grid-template-columns:1fr!important;gap:8px!important}
  #view-notes .n91-note-card{min-height:132px!important;padding:12px!important}
  #view-notes .n91-card-customer strong{font-size:15px!important}
  #view-notes .n91-card-device strong,#view-notes .n91-card-failure{font-size:12px!important}
  #view-notes .n91-notes-tools{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  #view-notes .n91-view-switch{margin-left:auto!important}

  /* Tablas y tarjetas administrativas. */
  .notes-layout,.users-layout{min-width:0!important;width:100%!important}
  .n9-card,.ra-card,.fs-card,.ip188-card,.m181-panel{padding:14px!important;border-radius:16px!important}
  .ra-counts{grid-template-columns:1fr 1fr!important}
  .ra-event{grid-template-columns:34px minmax(0,1fr)!important}
  .ra-event-top{flex-direction:column!important;gap:2px!important}
  .fs-row,.fs-alert{flex-direction:column!important;align-items:stretch!important;gap:10px!important}
  .fs-row>div:last-child,.fs-alert>div:last-child{text-align:left!important}
  .fs-link{margin-left:0!important}

  /* Visor de Seguridad: controles útiles en pantalla angosta. */
  .fs-viewer-bar{flex-direction:column!important;align-items:stretch!important}
  .fs-viewer-actions{max-width:none!important;width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  .fs-viewer-actions button{min-height:42px!important}
  .fs-layout-half main,.fs-layout-two main{grid-template-columns:1fr!important;grid-template-rows:1fr 1fr!important}
}

@media(max-width:390px){
  #portal{padding-left:8px!important;padding-right:8px!important}
  .n17-menu-panel{left:6px!important;right:6px!important}
  .ra-counts{grid-template-columns:1fr!important}
  .fs-viewer-actions{grid-template-columns:1fr!important}
}

@media print{
  #n9-nav,.portal-top,#notificationPanel,.toast,.n9-toast,.n17-menu-panel{display:none!important}
}


/* EIC Portal V18.11 - cliente: seis accesos, campana y notificaciones mobile-first */
.n1811-bell{position:relative!important}.n1811-bell-badge{position:absolute;right:5px;top:4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#d7192d;color:#fff;font-size:10px;line-height:18px;text-align:center;font-weight:900;box-shadow:0 0 0 2px #fff}.n1811-bell-badge[hidden]{display:none!important}
#portal.n17-customer-home.n17-home-mode #n9-panel{overflow-y:auto!important;overscroll-behavior:contain!important;padding-bottom:max(8px,env(safe-area-inset-bottom))!important}
#portal.n17-customer-home.n17-home-mode .n17-home-grid.n17-home-grid-six{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:none!important;grid-auto-rows:minmax(138px,auto)!important;flex:0 0 auto!important}
#portal.n17-customer-home.n17-home-mode .n17-home-card small{display:block!important}
#portal.n17-customer-home.n17-home-mode .n17-home-status{flex:0 0 auto!important}
#portal.n9-alt #notificationPanel.open{display:block!important;position:fixed!important;z-index:4200!important;top:max(78px,calc(env(safe-area-inset-top) + 58px))!important;right:max(12px,env(safe-area-inset-right))!important;width:min(410px,calc(100vw - 24px))!important;max-height:calc(100dvh - 96px - env(safe-area-inset-bottom))!important;overflow:auto!important;background:#fff!important;border:1px solid #dbe1e8!important;border-radius:18px!important;box-shadow:0 24px 70px rgba(15,23,42,.22)!important;padding:10px!important}
#notificationList{display:grid!important;gap:7px!important}.notice-item.n1811-notice{width:100%;border:1px solid #e4e7ec;background:#fff;border-radius:13px;padding:11px;text-align:left;display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;color:#101828}.notice-item.n1811-notice:active{background:#f8fafc}.n1811-notice-type{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-weight:950;font-size:11px}.n1811-notice-type.r{background:#fff1f2;color:#c0102a}.n1811-notice-type.v{background:#eff8ff;color:#175cd3}.n1811-notice-type.g{background:#f0fdf4;color:#067647}.n1811-notice-type.c{background:#fff7ed;color:#b54708}.n1811-notice-type.n{background:#f2f4f7;color:#344054}.n1811-notice-copy{min-width:0}.n1811-notice-copy b{display:block;font-size:12px;line-height:1.25}.n1811-notice-copy span{display:block;font-size:11px;color:#667085;line-height:1.35;margin-top:2px}.n1811-notice-copy time{display:block;font-size:9px;color:#98a2b3;margin-top:5px}.n1811-account-exit{margin-top:12px!important}
@media(max-width:700px){
  #portal.n17-customer-home #n9-nav .n17-nav-actions{gap:8px!important}.n1811-bell-label{display:none!important}.n1811-bell{min-width:54px!important;width:54px!important;padding:0!important;justify-content:center!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-screen{overflow:visible!important;height:auto!important;min-height:100%!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-grid.n17-home-grid-six{gap:8px!important;grid-auto-rows:minmax(150px,auto)!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-card{padding:12px 9px!important;gap:6px!important;border-radius:18px!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-card .n9-icon{width:35px!important;height:35px!important;flex-basis:35px!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-card span{font-size:15px!important;line-height:1.08!important}
  #portal.n17-customer-home.n17-home-mode .n17-home-card small{display:block!important;font-size:9.5px!important;line-height:1.22!important;margin-top:2px!important;max-width:25ch!important}
  #portal.n9-alt #notificationPanel.open{left:8px!important;right:8px!important;width:auto!important;top:max(76px,calc(env(safe-area-inset-top) + 56px))!important;max-height:calc(100dvh - 88px - env(safe-area-inset-bottom))!important;border-radius:17px!important}
  .ra-services .ra-counts{grid-template-columns:1fr 1fr!important}
}
@media(max-width:390px){#portal.n17-customer-home.n17-home-mode .n17-home-grid.n17-home-grid-six{grid-auto-rows:minmax(142px,auto)!important}#portal.n17-customer-home.n17-home-mode .n17-home-card small{font-size:9px!important}}
