/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    
    Autor     : Oswaldo Cruz
    Fecha      : 09/03/2015, 21:10:54
*/

#escritorio_content table:hover {
  color: green;

  box-shadow: 10px 10px 5px #888888;

  background: rgba(226, 226, 226, 1);
  background: linear-gradient(
    to right,
    rgba(226, 226, 226, 1) 0%,
    rgba(209, 209, 209, 1) 7%,
    rgba(219, 219, 219, 1) 12%,
    rgba(209, 209, 209, 1) 84%,
    rgba(209, 209, 209, 1) 89%,
    rgba(254, 254, 254, 1) 100%
  );

  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border: none;
}

#escritorio_content {
  background: transparent !important;
}

/* Estilos globales .ui-* eliminados: el aspecto de PrimeFaces lo define el tema (Saga) en web.xml */

.divCentrado {
  width: 100%;
  height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

body {
  width: 100%;
  height: 100%;
  margin-left: 0px;
  margin-top: 0px;
}

.informacion {
  position: absolute;
  font-size: 0.75rem;
  padding-top: 10px;
  line-height: 23px;

  background: rgba(250, 250, 250, 1);
  background: linear-gradient(
    to right,
    rgba(250, 250, 250, 1) 0%,
    rgba(230, 230, 230, 1) 7%,
    rgba(242, 242, 242, 1) 12%,
    rgba(230, 230, 230, 1) 84%,
    rgba(230, 230, 230, 1) 89%,
    rgba(255, 255, 255, 1) 100%
  );

  opacity: 0.95;
}

.fondo_acceder {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}

.fondo_estudiantil {
  position: fixed;
  top: 30px;
  left: 8px;

  width: calc(100% - 20px);
  height: 100%;
  background-size: cover;

  background: radial-gradient(#999999 15%, transparent 16%) 4px 4px;
  background-color: #233a7f;
  background-size: 8px 8px;

  z-index: -1;
  animation: animatedBackground 120s linear infinite;
}

.registroOK {
  position: fixed;
  top: 30px;
  left: 8px;

  width: calc(100% - 16px);
  height: calc(100% - 30px);
  background-color: #001e6b;

  z-index: -1;
}

.divLogin {
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);

  width: 340px;
  min-height: 380px;

  padding: 20px;

  align-items: center;
  justify-content: center;

  background: rgba(250, 250, 250, 1);
  background: linear-gradient(
    to right,
    rgba(250, 250, 250, 1) 0%,
    rgba(230, 230, 230, 1) 7%,
    rgba(242, 242, 242, 1) 12%,
    rgba(230, 230, 230, 1) 84%,
    rgba(230, 230, 230, 1) 89%,
    rgba(255, 255, 255, 1) 100%
  );

  border: 3px groove greenyellow;

  -webkit-box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
  -moz-box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
  box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
}

.divRegistro {
  position: absolute;
  top: calc(50% - 230px);
  right: calc(50% - 230px);

  width: 460px;

  background: rgba(250, 250, 250, 1);
  background: linear-gradient(
    to right,
    rgba(250, 250, 250, 1) 0%,
    rgba(230, 230, 230, 1) 7%,
    rgba(242, 242, 242, 1) 12%,
    rgba(230, 230, 230, 1) 84%,
    rgba(230, 230, 230, 1) 89%,
    rgba(255, 255, 255, 1) 100%
  );

  border: 3px groove greenyellow;

  -webkit-box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
  -moz-box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
  box-shadow: 20px 27px 25px -10px rgba(0, 0, 0, 1);
}

.contactos {
  background: white;
}

.cabeza {
  background: white;
}

.izquierda {
  width: 98%;
  float: left;
  background: white;
}

.arriba {
  position: fixed;
  top: 40px;
  left: 0px;
  right: 0px;
  height: 35px;

  text-align: center;
  box-shadow: 5px 5px 5px #333333;

  background: rgba(226, 226, 226, 1);
  background: linear-gradient(
    to bottom,
    rgba(226, 226, 226, 1) 0%,
    rgba(209, 209, 209, 1) 7%,
    rgba(255, 255, 255, 1) 48%,
    rgba(255, 255, 255, 1) 55%,
    rgba(219, 219, 219, 1) 89%,
    rgba(254, 254, 254, 1) 100%
  );
}

.arriba.portal-menubar-strip {
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.08);
  z-index: 105;
}

.derecha {
  float: right;
  background: transparent;
  box-shadow: 15px 15px 7px #333333;
}

.contenedorConsumo {
  width: 100%;
  height: 90vh;
  text-align: center;
}

.formulario {
  padding: 25px;
}

.centro {
  box-shadow: 15px 15px 10px #666666;
  width: calc(100% - 20px);
  margin: 0 auto;

  background: rgba(255, 255, 255, 1);
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 1) 0%,
    rgba(246, 246, 246, 1) 47%,
    rgba(237, 237, 237, 1) 100%
  );
}

#menuForm2:menuprinc {
  width: 100%;
}

.divTransparente {
  background: none;
}

.divFormulario {
  box-shadow: 15px 15px 7px #333333;
}

.divReg2 {
  box-shadow: 10px 10px 5px #666666;
}

.divNorm {
  width: 100%;
  height: 100%;
}

.div_contendor_resp {
  position: relative;
  padding-bottom: 56.25%; /*panorámico*/
  padding-top: 0px;
  height: 0;
}
.div_contendor_resp iframe {
  position: absolute;
  top: 0;
  left: 15%;
  width: 70%;
  height: 75%;
}

.divTxtVideos {
  width: 100%;
  text-align: center;
  margin-bottom: 15px;
  font-size: 1.5rem;
  color: black;
}

.facEncabCamp {
  box-shadow: 0px 0px 0px #222 inset;
  border-style: hidden;
  border-bottom: ridge;
  border-bottom-width: 2px;
  width: 100%;
  background-color: transparent;
}

#ProveedorForm\:buscaProveedor {
  width: 99%;
}

#ProveedorForm\:buscaProveedor_input {
  width: 100%;
  border: none;
  background: transparent;
  -moz-box-shadow: inset 0 2px 2px #fff;
  -webkit-box-shadow: inset 0 2px 2px #fff;
  box-shadow: inset 0 2px 2px #fff;

  border-style: hidden;
  border-bottom: ridge;
  border-bottom-width: 2px;
  background-color: transparent;
}

#clienteForm\:buscaCliente {
  width: 99%;
}

#clienteForm\:buscaCliente_input {
  width: 100%;
  border: none;
  background: transparent;
  -moz-box-shadow: inset 0 2px 2px #fff;
  -webkit-box-shadow: inset 0 2px 2px #fff;
  box-shadow: inset 0 2px 2px #fff;

  border-style: hidden;
  border-bottom: ridge;
  border-bottom-width: 2px;
  background-color: transparent;
}

.encabFact {
  font-size: 28px;
  font-style: italic;
}

.razonSocFact {
  font-size: 0.75rem;
}

.dirTelCiuFact {
  font-size: 8px;
}

.numFact {
  border-style: groove;
  border-width: 2px;
}

.tabla_detalle {
}

.campos_detalle {
  text-align: center;
  font-size: 10px;
}

.columnas_detalle {
  font-size: 8px;
}

.suman {
  border-color: appworkspace;
  text-align: center;
}

.celdas_detalle {
  width: 100%;
  text-align: center;
}

.celdas_detalle_prod {
  width: 100%;
  text-align: left;
}

.panelCli {
  text-align: left;
  border: 0;
}

.panelProv {
  text-align: left;
  border: 1px;
}

.panel_factu {
  width: 95%;
}

.sumLab {
  text-align: left;
}

.sumCamp {
  text-align: center;
}

.sumLabIVA12 {
  text-align: center;
  padding-left: 10px;
}

.encabezado {
  color: #ffffff;
  font-size: 17px;
  font-weight: bold;
  font-style: normal;
  font-family: 'Segoe UI', Arial, sans-serif;
  margin-top: 0;
  margin-left: 0;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  letter-spacing: 0.02em;
}

.panel_cabecera {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 40px;
  text-align: center;

  background: rgb(255, 255, 255);
  background: linear-gradient(
    45deg,
    rgba(255, 255, 255, 1) 20%,
    rgba(240, 240, 240, 0.8) 100%
  );
}

/* Cabecera portal: logo a la izquierda; título + usuario a la derecha */
.panel_cabecera.portal-header-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0 0.65rem 0 0.45rem;
  text-align: left;
  box-sizing: border-box;
  z-index: 110;
  height: 48px;
  min-height: 48px;
}

.portal-header-logo {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  min-width: 0;
}

.portal-header-logo-link {
  text-decoration: none;
  color: inherit;
  display: inline-flex;
  align-items: center;
}

.portal-header-right {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
}

.portal-header-context-text {
  color: #0f172a;
  font-size: 0.8125rem;
  font-weight: 600;
  font-family: "Segoe UI", Arial, sans-serif;
  line-height: 1.3;
  letter-spacing: 0.02em;
  text-align: right;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-header-actions {
  flex: 0 0 auto;
}

/* Portal: layout lateral (fondo sólido para logo claro) */
.principal_portal {
  --portal-sidebar-w: min(17.25rem, 42vw);
  --portal-rail-w: 3.375rem;
  /* Tonos del isologo (fondo HTML de referencia) */
  --portal-nav-bg: #0b1120;
  --portal-nav-text: #f1f5f9;
  --portal-nav-muted: #94a3b8;
  --portal-nav-line: rgba(148, 163, 184, 0.14);
}

.principal_portal .portal-body {
  display: flex;
  align-items: stretch;
  width: 100%;
  margin-top: 0;
  min-height: 100vh;
  box-sizing: border-box;
}

.portal-mobile-topbar {
  display: none;
}

.principal_portal .portal-sidebar {
  position: fixed;
  left: 0;
  top: 0;
  width: var(--portal-sidebar-w);
  height: 100vh;
  max-height: 100vh;
  overflow: hidden;
  z-index: 95;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--portal-nav-line);
  background-color: #0b1120;
  background-image:
    linear-gradient(
      180deg,
      rgba(11, 17, 32, 0.15) 0%,
      transparent 45%,
      rgba(11, 17, 32, 0.45) 100%
    ),
    radial-gradient(
      ellipse 120% 85% at 50% -25%,
      rgba(56, 189, 248, 0.16),
      transparent 55%
    ),
    radial-gradient(
      ellipse 70% 55% at 100% 100%,
      rgba(99, 102, 241, 0.1),
      transparent 50%
    ),
    var(--portal-nav-pattern, none);
  background-size: 100% 100%, 100% 100%, 100% 100%, 420px 420px;
  background-repeat: no-repeat, no-repeat, no-repeat, repeat;
  box-shadow: 4px 0 36px rgba(0, 0, 0, 0.22);
  transition:
    width 0.32s cubic-bezier(0.33, 1, 0.68, 1),
    box-shadow 0.32s ease,
    border-color 0.22s ease;
}

.principal_portal .contenido_portal {
  margin-left: var(--portal-sidebar-w);
  width: calc(100% - var(--portal-sidebar-w));
  max-width: calc(100% - var(--portal-sidebar-w));
  float: none !important;
  top: 0 !important;
  position: relative;
  min-height: 100vh;
  height: auto !important;
  overflow-y: auto;
  box-sizing: border-box;
  padding-top: 0;
  margin-top: 0;
  transition:
    margin-left 0.32s cubic-bezier(0.33, 1, 0.68, 1),
    width 0.32s cubic-bezier(0.33, 1, 0.68, 1),
    max-width 0.32s cubic-bezier(0.33, 1, 0.68, 1);
  background: linear-gradient(165deg, #f1f5f9 0%, #e8edf4 50%, #f8fafc 100%);
}

.principal_portal .portal-page-inner.contenedor {
  background: transparent;
  box-shadow: none;
  min-height: calc(100vh - 0px);
  padding-bottom: 1.5rem;
}

.principal_portal #divContenido.contenido_.contenido_portal {
  padding-top: 0;
  min-height: 100vh;
}

.principal_portal #divContenido.contenido_portal > *:first-child {
  margin-top: 0;
}

.principal_portal.portal-sidebar--collapsed .portal-sidebar {
  width: var(--portal-rail-w);
  border-right: 1px solid var(--portal-nav-line);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.06);
}

.principal_portal.portal-sidebar--collapsed .contenido_portal {
  margin-left: var(--portal-rail-w);
  width: calc(100% - var(--portal-rail-w));
  max-width: calc(100% - var(--portal-rail-w));
}

/* Menú expandido sobre carril: el contenido se encoge a la par (misma animación) */
.principal_portal.portal-sidebar--collapsed.portal-sidebar--peek .contenido_portal {
  margin-left: var(--portal-sidebar-w);
  width: calc(100% - var(--portal-sidebar-w));
  max-width: calc(100% - var(--portal-sidebar-w));
}

.principal_portal.portal-sidebar--collapsed.portal-sidebar--peek .portal-sidebar {
  width: var(--portal-sidebar-w);
  box-shadow: 4px 0 28px rgba(0, 0, 0, 0.18);
  z-index: 95;
}

.principal_portal.portal-sidebar--collapsed:not(.portal-sidebar--peek)
  .portal-sidebar-cuenta-form,
.principal_portal.portal-sidebar--collapsed:not(.portal-sidebar--peek)
  .portal-sidebar-menu-form {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  overflow: hidden;
  margin: 0;
  padding: 0;
  border: 0;
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.principal_portal.portal-sidebar--collapsed.portal-sidebar--peek
  .portal-sidebar-cuenta-form,
.principal_portal.portal-sidebar--collapsed.portal-sidebar--peek
  .portal-sidebar-menu-form {
  position: relative;
  left: auto;
  top: auto;
  width: auto;
  height: auto;
  overflow: visible;
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.portal-sidebar-rail-expand-btn {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 4;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.35rem 0.2rem;
  border: none;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.06);
  color: #cbd5e1;
  cursor: pointer;
  font-family: inherit;
}

.portal-sidebar-rail-expand-btn:hover {
  color: #f8fafc;
  background: rgba(255, 255, 255, 0.1);
}

.portal-sidebar-rail-accent {
  position: absolute;
  left: 0;
  top: 12%;
  bottom: 12%;
  width: 3px;
  border-radius: 0 4px 4px 0;
  background: rgba(226, 232, 240, 0.35);
  box-shadow: none;
}

.portal-sidebar-rail-icon {
  font-size: 1rem;
  line-height: 1;
  margin-top: 0.15rem;
}

.portal-sidebar-rail-label {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  font-size: 0.59rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  opacity: 0.9;
  padding-top: 0.35rem;
}

.principal_portal.portal-sidebar--collapsed:not(.portal-sidebar--peek)
  .portal-sidebar-rail-expand-btn {
  display: flex;
}

.principal_portal.portal-sidebar--collapsed.portal-sidebar--peek
  .portal-sidebar-rail-expand-btn {
  display: none;
}

.portal-sidebar-collapse-btn {
  display: none;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.07);
  color: #e2e8f0;
  cursor: pointer;
}

.portal-sidebar-collapse-btn:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(148, 163, 184, 0.55);
  color: #f8fafc;
}

@media (min-width: 993px) {
  .portal-sidebar-collapse-btn {
    display: inline-flex;
  }
}

.portal-sidebar-cuenta-form {
  flex: 0 0 auto;
  margin: 0;
}

.portal-sidebar-menu-form {
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.portal-sidebar-pinned-top {
  padding: 0.85rem 0.65rem 0.75rem;
  border-bottom: 1px solid var(--portal-nav-line);
  background: transparent;
}

.portal-sidebar-brand-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
}

.portal-sidebar-logo {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
}

.portal-sidebar-logo-link,
.portal-sidebar-logo a.portal-sidebar-logo-link,
.portal-sidebar-logo a.ui-link {
  text-decoration: none;
  color: inherit;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  align-content: center;
  line-height: 1;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  gap: 0.55rem;
  padding: 0.2rem 0.4rem 0.2rem 0.15rem;
  font-family: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

.portal-ecuasof-logo-mark-wrap {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
}

.portal-ecuasof-logo-mark {
  width: clamp(40px, 11vw, 54px);
  height: auto;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
}

.portal-ecuasof-logo-text {
  flex: 0 1 auto;
  min-width: 0;
  font-size: clamp(2rem, 3.6vw, 1.78rem);
  font-weight: 700;
  letter-spacing: -0.04em;
  color: #f8fafc;
  line-height: 1;
  white-space: nowrap;
  text-shadow: none;
  overflow: hidden;
  text-overflow: ellipsis;
}

@keyframes portal-ecuasof-ai-pulse {
  0%,
  100% {
    transform: scale(1);
    opacity: 1;
    filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8));
  }
  50% {
    transform: scale(0.85);
    opacity: 0.6;
    filter: drop-shadow(0 0 18px rgba(255, 255, 255, 1));
  }
}

.portal-ecuasof-ai-pulse {
  animation: portal-ecuasof-ai-pulse 3s infinite ease-in-out;
  transform-origin: center;
  transform-box: fill-box;
}

.portal-sidebar-user-card {
  margin-top: 0.75rem;
  padding: 0.7rem 0.55rem 0.6rem;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.18);
  border: 1px solid var(--portal-nav-line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.portal-sidebar-field-label {
  display: block;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--portal-nav-muted);
  margin-bottom: 0.2rem;
  opacity: 0.95;
}

.portal-sidebar-field-label-user {
  color: #cbd5e1;
  opacity: 0.92;
}

.portal-sidebar-empresa-nombre {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  color: #fde68a;
  line-height: 1.35;
  word-break: break-word;
  letter-spacing: 0.01em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.portal-sidebar-usuario {
  margin-top: 0.55rem;
  padding-top: 0.55rem;
  border-top: 1px dashed rgba(148, 163, 184, 0.22);
}

.portal-sidebar-usuario-nombre {
  display: block;
  font-size: 0.78rem;
  font-weight: 600;
  color: #f8fafc;
  line-height: 1.4;
  word-break: break-word;
  letter-spacing: 0.01em;
}

.portal-sidebar-user-actions {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 0.35rem;
  margin-top: 0.5rem;
}

/* Cuenta y Salir: mismo estilo (contorno claro sobre fondo sólido) */
.portal-sidebar-nav-btn,
a.portal-sidebar-nav-btn,
a.portal-sidebar-nav-btn:visited,
.portal-sidebar-nav-btn.ui-commandlink,
.portal-sidebar-nav-btn.ui-commandlink:visited {
  flex: 1 1 0;
  min-width: 0;
  box-sizing: border-box;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.32rem 0.55rem !important;
  min-height: 1.85rem !important;
  border-radius: 999px !important;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  white-space: nowrap;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(226, 232, 240, 0.45) !important;
  color: #f8fafc !important;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

/* PrimeFaces a veces aplica tipografía distinta al commandLink */
.portal-sidebar-nav-btn.ui-commandlink {
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
}

.portal-sidebar-nav-btn.ui-commandlink .ui-icon {
  margin: 0 !important;
}

a.portal-sidebar-nav-btn:hover,
.portal-sidebar-nav-btn.ui-commandlink:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.75) !important;
  color: #ffffff !important;
}

.portal-sidebar-nav-btn--salir.ui-commandlink:hover {
  background: rgba(248, 113, 113, 0.14) !important;
  border-color: rgba(252, 165, 165, 0.45) !important;
  color: #fecaca !important;
}

.portal-sidebar-nav-btn .portal-sidebar-action-inner {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.32rem !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

/* Texto generado por h:outputText vs contenido del commandLink: misma caja */
.portal-sidebar-nav-btn .portal-sidebar-action-inner > span {
  font-family: inherit !important;
  font-size: 1em !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  color: inherit !important;
}

.portal-sidebar-nav-btn .portal-sidebar-action-inner .pi {
  font-size: 1.15em !important;
  line-height: 1;
  opacity: 0.88;
}

.portal-sidebar-pinned-filters {
  flex: 0 0 auto;
  padding: 0.65rem 0.65rem 0.45rem;
  background: transparent;
}

.portal-sidebar-menu-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.15rem 0.45rem 1rem;
  -webkit-overflow-scrolling: touch;
  background: transparent;
}

.portal-sidebar-menu-scroll::-webkit-scrollbar {
  width: 6px;
}

.portal-sidebar-menu-scroll::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.35);
  border-radius: 6px;
}

.portal-sidebar-menu-scroll::-webkit-scrollbar-track {
  background: rgba(11, 17, 32, 0.9);
}

.portal-menu-filter-container {
  position: relative;
  margin-bottom: 0;
  padding: 0;
}

.portal-menu-filter-container i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 0.85rem;
  z-index: 10;
}

.portal-menu-filter-container .ui-inputfield {
  width: 100%;
  padding: 0.5rem 0.65rem 0.5rem 2rem !important;
  border-radius: 10px !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  background: rgba(255, 255, 255, 0.055) !important;
  color: #e2e8f0 !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  font-size: 0.8125rem !important;
}

.portal-menu-filter-container .ui-inputfield::placeholder {
  color: #94a3b8;
  opacity: 1;
}

.portal-menu-filter-container .ui-inputfield:focus {
  border-color: rgba(255, 255, 255, 0.4) !important;
  background: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1) !important;
}

/* Panel menú lateral: navegación con iconos, estilo ejecutivo */
.portal-panelmenu.ui-panelmenu {
  width: 100%;
  border: none !important;
}

/* Cabeceras */
.portal-panelmenu .ui-panelmenu-header {
  background: transparent !important;
  border: none !important;
  margin-top: 0.35rem !important;
}

.portal-panelmenu .ui-panelmenu-header a {
  font-weight: 700 !important;
  color: #dfe7f2 !important;
  font-size: 0.68rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  border-radius: 8px;
  gap: 0.4rem;
  pointer-events: none; /* Desactivar interacción para evitar colapso */
}

.portal-panelmenu .ui-panelmenu-header a::before {
  content: "";
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  border-radius: 2px;
  background: rgba(226, 232, 240, 0.45);
  box-shadow: none;
  opacity: 0.95;
}


/* Forzar contenido siempre visible (sin flickering) */
.portal-panelmenu .ui-panelmenu-content {
  display: block !important;
  height: auto !important;
  border: none !important;
  background: transparent !important;
  padding: 0.12rem 0 0.5rem 0.5rem !important;
  border-left: 1px solid var(--portal-nav-line);
  margin-left: 0.55rem;
}

/* Ocultar las flechas si ya no es colapsable (estética más de lista) */
.portal-panelmenu .ui-panelmenu-header .ui-icon,
.portal-panelmenu .ui-panelmenu-header .ui-panelmenu-icon {
  display: none !important;
}


/* Ítems del menú dinámico sin iconos (MenuController no asigna .icon) */
.portal-panelmenu .ui-menuitem-link {
  padding: 0.42rem 0.45rem !important;
  border-radius: 8px !important;
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important;
  color: #b8c4d4 !important;
  font-size: 0.805rem !important;
  font-weight: 500 !important;
  margin: 3px 0 !important;
}

.portal-panelmenu .ui-menuitem-link:hover {
  background: rgba(255, 255, 255, 0.075) !important;
  color: #fbbf24 !important;
  box-shadow: inset 3px 0 0 0 rgba(226, 232, 240, 0.55);
}

.portal-panelmenu .ui-menuitem-link:hover .ui-menuitem-text {
  color: #fbbf24 !important;
}

.portal-panelmenu .ui-menuitem-link.ui-state-active {
  background: rgba(255, 255, 255, 0.09) !important;
  color: #fbbf24 !important;
  box-shadow: inset 3px 0 0 0 rgba(241, 245, 249, 0.75);
}

.portal-panelmenu .ui-menuitem-link.ui-state-active .ui-menuitem-text {
  color: #fbbf24 !important;
}

.portal-panelmenu .ui-menuitem-link .ui-menuitem-icon {
  display: none !important;
}

/* Ajuste de scrollbar para el sidebar */
.principal_portal .columna_portal {
  overflow-x: hidden;
}

.contenedor {
  min-height: 100vh;
  padding-top: 0px;
  padding-bottom: 20px;

  background-color: rgba(240, 240, 240, 0.8);
}

.panel_cabeceraMovil {
  position: fixed;
  top: 0px;
  left: 0px;
  height: 52px;
  width: 100%;

  background: rgba(3, 53, 122, 1);
  background: linear-gradient(
    45deg,
    rgba(3, 53, 122, 1) 0%,
    rgba(3, 53, 122, 1) 1%,
    rgba(66, 115, 179, 1) 11%,
    rgba(35, 153, 229, 1) 41%,
    rgba(35, 153, 229, 1) 60%,
    rgba(114, 174, 207, 1) 85%,
    rgba(182, 225, 252, 1) 100%
  );
}

.panel_cabecera_2 {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;

  height: 35px;
  text-align: center;

  background: rgba(3, 53, 122, 1);
  background: linear-gradient(
    45deg,
    rgba(3, 53, 122, 1) 0%,
    rgba(3, 53, 122, 1) 1%,
    rgba(66, 115, 179, 1) 11%,
    rgba(35, 153, 229, 1) 41%,
    rgba(35, 153, 229, 1) 60%,
    rgba(114, 174, 207, 1) 85%,
    rgba(182, 225, 252, 1) 100%
  );

  z-index: 1000;
}

.formRegExt {
  background-color: rgba(255, 255, 255, 0.5);
  color: black;
  text-shadow: 3px 3px 5px #fff;
}

.formRegInt {
  background-color: rgba(255, 255, 255, 0.6);
  color: black;
}

.menuMovil {
  position: fixed;
  top: 40px;
  bottom: 0px;
  left: 0px;
  max-width: 400px;
  width: 90%;
  background-color: white;
  opacity: 0.95;
  border-right: #000 groove 5px;
  display: none;
  overflow-y: scroll;
  overflow-x: hidden;
  z-index: 50;
}

.contMenu {
  width: 100%;
}

.btn_menuMovil {
  position: fixed;
  left: 8px;
  color: white;
  font-size: 28px;
  font-family: Arial, sans-serif;
  line-height: 52px;
}

.btn_menuMovilDer {
  position: fixed;
  top: 5px;
  right: 5px;
  color: white;
  font-size: 1.875rem;
  font-family: Arial, sans-serif;
}

.reging {
  color: white;
  font-size: 0.69rem;
  text-align: right;
}

.pie {
  font-size: 0.75rem;
  font-weight: bold;
}

.pagini {
  margin-left: 40px;
  width: 430px;
  text-align: justify;
  font-size: 0.94rem;
}

.pagini2 {
  margin-left: 10px;
  text-align: justify;
  font-size: 0.94rem;
}

.tituloEst {
  padding-top: 10px;
  position: absolute;
  width: 100%;
}

.tituloEstMovil {
  padding-top: 0px;
  position: absolute;
  width: 100%;
  line-height: 52px;
  text-align: center;
}

.botonTipoMenu {
  display: block;
  color: #000;
  padding: 8px 16px;
  text-decoration: none;
  font-size: 0.75rem;
}

.botonTipoMenu:hover {
  background-color: #619ab2;
  color: white;
  font-size: 0.75rem;
  font-weight: bold;
}

.regingEst {
  position: relative;
  display: block;
  float: right;
  top: 12px;
  font-size: 0.875rem;
  color: black;
}

.espere {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 12px;
  padding: 20px 28px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.22);
  z-index: 9999;
}

/* ── Estilos Dialogo Espere Moderno ── */
.dialogo-espere-moderno.ui-dialog {
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
  border: none !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow: hidden;
  padding: 0 !important;
}

.dialogo-espere-moderno .ui-dialog-content {
  padding: 0 !important;
  overflow: hidden !important;
}

.espere-moderno-contenido {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2.5rem 3.5rem;
  min-width: 320px;
}

.espere-spinner-container {
  margin-bottom: 1.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(3, 53, 122, 0.08); /* Brand blue light */
}

.espere-spinner-icon {
  font-size: 2.2rem !important;
  color: #03357a; /* Brand blue */
}

.espere-texto-container {
  text-align: center;
}

.espere-titulo {
  margin: 0 0 0.5rem 0;
  color: #0f172a;
  font-size: 1.25rem;
  font-weight: 600;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  letter-spacing: -0.02em;
}

.espere-subtitulo {
  margin: 0;
  color: #64748b;
  font-size: 0.95rem;
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* Para el template móvil */
.espere-moderno-mobile {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(15, 23, 42, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 99999;
}

.espere-moderno-mobile .espere-moderno-contenido {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 16px;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  padding: 2rem 2.5rem;
  min-width: 260px;
}

/* ── MostrarReporte: filtros full-width + reporte en dialog ── */
.reporte-filtros-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.07);
  padding: 1.5rem 1.75rem;
  margin: 1.25rem 1.5rem;
  max-width: 1100px;
}

.reporte-filtros-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem 1.25rem;
  margin-bottom: 1.25rem;
}

.reporte-filtros-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.reporte-filtros-field .ui-outputlabel {
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
}

.reporte-filtros-field .ui-calendar,
.reporte-filtros-field .ui-selectonemenu,
.reporte-filtros-field .ui-inputfield {
  width: 100% !important;
  box-sizing: border-box !important;
}

.reporte-filtros-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
}

/* iframe dentro del dialog */
.reporte-dialog-iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  background: white;
}

.reporte-dialog-iframe.loaded {
  opacity: 1;
}

/* clases antiguas — se conservan para otros usos que pueda haber */
.gridReportes { }
.filtroReportes  { width: 10%; height: 70vh; }
.contenReportes  { width: 90%; height: 70vh; }
.filtroReportesPanel { width: 10rem; height: 70vh; margin: 15px 0 20px 15px; }
.contenReportesPanel  { width: 98%; height: 73vh; }
.contenReportesPanel2 { width: 50vw; height: 35vh; }
.contenReportesPanel3 { margin-top: 5px; width: 98%; height: 70vh; }

.reportes  { width: 98%; height: 70vh; }
.reportes2 { width: 98%; height: 35vh; }
.reportes3 { margin-top: 10px; width: 98%; height: 60vh; }

.facturaVenta {
  width: 98%;
  height: 75vh;
}

.reporteExterno {
  width: 95vw;
  height: 85vh;
}

.buscadorFact {
  width: 100%;
  height: 100%;
}

/* —— Archivo de comprobantes (historial/ListarComprobantes) —— */
.archivo-comprobantes-panel.ui-panel {
  border-radius: 10px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
  border: 1px solid rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.archivo-comprobantes-panel .ui-panel-titlebar {
  font-weight: 600;
  font-size: 1rem;
}

.archivo-comprobantes-panel .ui-panel-content {
  padding: 1rem 1.25rem 1.25rem;
}

.archivo-filtros-form {
  text-align: left;
}

.archivo-filtros-grid.ui-panelgrid .ui-panelgrid-cell {
  padding: 0.75rem 0.6rem !important;
}

.archivo-filtros-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.35rem !important;
  min-width: 0 !important;
}

.archivo-filtros-grid .ui-outputlabel {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.25rem;
  white-space: nowrap;
}

.archivo-filtros-field .ui-selectonemenu,
.archivo-filtros-field .ui-calendar,
.archivo-filtros-field .ui-autocomplete,
.archivo-filtros-field .ui-inputmask,
.archivo-filtros-field .ui-button {
  width: 100% !important;
  box-sizing: border-box !important;
}

.archivo-filtros-inline {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.archivo-filtros-inline .ui-autocomplete {
  flex: 1 1 auto;
  min-width: 0;
}

.archivo-btn-clear.ui-button {
  flex: 0 0 auto;
  margin: 0 !important;
  color: #64748b !important;
}

.archivo-btn-clear.ui-button:hover {
  color: #cf222e !important;
  background-color: rgba(207, 34, 46, 0.05) !important;
}

.archivo-filtros-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-top: 0.25rem;
}

.archivo-filtros-actions .ui-button {
  margin-top: 0 !important;
}

.archivo-comprobantes-tabla-wrap {
  margin-top: 1.25rem;
}

.archivo-comprobantes-datalist {
  width: 100%;
}

.archivo-comprobantes-datalist .ui-datatable-empty-message {
  padding: 2rem 1rem;
  color: #64748b;
  font-size: 0.95rem;
}

.archivo-comprobantes-estado {
  text-align: center;
  line-height: 1.35;
}

.archivo-comprobantes-estado-sri {
  font-size: 1.25rem;
  font-weight: bold;
  color: #cf222e;
}

.archivo-comprobantes-accion-anular {
  margin-left: 0.75rem;
}

.ventanaCodBarras {
  margin-top: 10px;
  margin-bottom: 10px;
}

.pieOT {
  background: white;
}

#OrdenTrabajoCreateForm:idcliente_label {
  background-color: #bbcad9;
}

#OrdenTrabajoCreateForm:idcliente_input {
  background-color: #bbcad9;
}

.cabFact ¨ {
  border-style: hidden;
  border-bottom: ridge;
}

#panelDescuento {
  border: none;
}

#panelDescuento {
  border: none;
}

#panelProvRet {
  border: none;
}

#panelBuscar {
  border: none;
}

#facturap2 {
  border: none;
}

#facturap3 {
  border: none;
}

#detalle12 {
  border: none;
}

#panelCompra {
  border: none;
}

.popup {
  position: absolute;
  top: 50%;
  left: 50%;

  border: 2px solid black;
  border-radius: 7px;

  box-shadow: 5px 5px 10px black;

  background: rgba(250, 250, 250, 1);
  background: linear-gradient(
    to right,
    rgba(250, 250, 250, 1) 0%,
    rgba(230, 230, 230, 1) 7%,
    rgba(242, 242, 242, 1) 12%,
    rgba(230, 230, 230, 1) 84%,
    rgba(230, 230, 230, 1) 89%,
    rgba(255, 255, 255, 1) 100%
  );

  opacity: 0.99;
}

.popup_reset_passwd_new {
  width: 400px;
  margin-left: -200px;
  margin-top: -80px;
}

.popup_reset_passwd {
  width: 400px;
  margin-left: -200px;
  margin-top: -200px;
}

.popup_info {
  width: 320px;
  margin-left: -160px;
  margin-top: -160px;
}

[class*="close-"] {
  position: absolute;
  width: 30px;
  height: 30px;
  cursor: pointer;
  text-decoration: none;
  text-indent: 0;
  left: 10px;
  top: 10px;
  z-index: 103;
}

.close-thik:after {
  content: "X";
  display: block;
  position: absolute;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #17669b;
  color: white;
  font-size: 0.94rem;
  font-weight: bolder;
  text-align: center;
  line-height: 30px;
  text-indent: 0;
}

.principal_ {
  width: 100%;
}
.cabecera_ {
  position: fixed;
  top: 0px;
  height: 80px;
  width: 100%;
  z-index: 100;
}

.cabecera_.portal-header-shell {
  height: 48px;
}

.pie_ {
  position: fixed;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 40px;

  background-color: #619ab2;
  background: rgba(226, 226, 226, 1);
  background: linear-gradient(
    to bottom,
    rgba(226, 226, 226, 1) 0%,
    rgba(209, 209, 209, 1) 7%,
    rgba(255, 255, 255, 1) 48%,
    rgba(255, 255, 255, 1) 55%,
    rgba(219, 219, 219, 1) 89%,
    rgba(254, 254, 254, 1) 100%
  );

  z-index: 2;
}

.pie_texto {
  position: fixed;
  right: 20px;

  margin-top: 12px;
  font-size: 0.875rem;
  font-weight: bold;
}

.menu_ {
  position: fixed;
  left: 0px;
  width: 0px;
  overflow-y: scroll;
  overflow-x: hidden;

  z-index: 102;
}
.menu_parte1 {
  height: calc(100vh - 110px);
  width: 72px;
  text-align: center;
  position: fixed;
  z-index: 1;

  background: rgba(199, 199, 199, 1);
  background: linear-gradient(
    to right,
    rgba(199, 199, 199, 1) 0%,
    rgba(255, 255, 255, 1) 51%,
    rgba(199, 199, 199, 1) 100%
  );
}
.menu_parte2 {
  float: left;
  height: calc(100vh - 110px);
  width: 100%;
  margin-left: 0px;
  z-index: 3;
}

.menu_parte2 ul li {
  background: white;
}

.contenido_ {
  position: relative;
  top: 0;
  float: left;
  min-height: calc(100vh - 48px);
  width: 100%;
  overflow-y: auto;
}

.accederTemplate {
  width: 120px;
  height: 30px;

  border: 1px solid #168dd9;
  box-shadow: 0 1px 0 #53bcff inset, 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  background: #27abff;
  background: linear-gradient(top, #27abff 0%, #059eff 100%);
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;

  color: white;
  font-weight: bold;
  text-shadow: 0 -1px 0 #1584de;
  text-align: center;
  display: table;
}

.boton_azul .ui-button-text,
.boton_rojo .ui-button-text,
.boton_verde .ui-button-text {
  color: white;
  font-weight: bold;
  text-shadow: 0 0 2px #000;
  -moz-text-shadow: 0 0 2px #000;
  -webkit-text-shadow: 0 0 2px #000;
}

.campoLogin {
  width: 100%;
  background: none;
  border: none;
  border-bottom: 1px solid black;
  font-size: 1rem;
  margin-top: 0.1rem;
}

.textoLogin {
  font-size: 1rem;
  margin-top: 0.1rem;
}

.chkLogin {
  font-size: 1rem;
  margin-top: 0.1rem;
}

.botonLogin {
  height: 3rem;
  font-size: 1rem;
}

.iconoTxt {
  color: blue;
  font-size: 0.8rem;
  text-align: center;
  text-decoration: none;
}

.iconosLogin {
  height: 1.5rem;
  width: 1.5rem;
}

.divIcons {
  float: left;
  width: 33%;
  margin-top: 1rem;
}

.botonMovil {
  width: 48%;
  height: 3rem;
  margin: 0.4rem 0;
  padding: 0.6rem 0.4rem;
  font-size: 0.95rem !important;
  line-height: 1.4;
  border-radius: 6px;
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.1s ease;
}

.botonMovil:active {
  opacity: 0.82;
  transform: scale(0.97);
}

.botonMovilAncho {
  padding: 0.6rem;
  width: 100%;
  height: 3rem;
  margin: 0.4rem 0;
  font-size: 0.95rem !important;
  line-height: 1.4;
  border-radius: 6px;
  cursor: pointer;
  transition: opacity 0.15s ease, transform 0.1s ease;
  box-sizing: border-box;
}

.botonMovilAncho:active {
  opacity: 0.82;
  transform: scale(0.98);
}

.boton_azul {
  background: #145885 !important;
  box-shadow: 0 1px 0 #145885 inset, 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  border: 1px solid #145885 !important;
  font-size: 0.8rem !important;
  color: #fff;
}

.boton_rojo {
  background: #990000 !important;
  box-shadow: 0 1px 0 #990000 inset, 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  border: 1px solid #990000 !important;
  font-size: 0.8rem !important;
  color: #fff;
}

.link_cancelar {
  display: block;
  position: absolute;
  right: 15px;
  bottom: 15px;
}

.boton_verde {
  background: #008855 !important;
  box-shadow: 0 1px 0 #008844 inset, 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  border: 1px solid #008833 !important;
  font-size: 0.8rem !important;
  color: #fff;
}

.texto_movil {
  font-size: 1rem !important;
  color: #1a1a2e;
  display: block;
  line-height: 1.6;
  padding: 2px 0;
}

.campo_movil {
  width: 100%;
  font-size: 1rem !important;
  height: 2.5rem;
  padding: 0 0.5rem;
  border-radius: 5px;
  border: 1px solid #aac4e0;
  box-sizing: border-box;
}

/* ═══════════════════════════════════════════
   CLASES UTILITARIAS MÓVIL (mvl-*)
   ═══════════════════════════════════════════ */

/* Contenedor de página móvil */
.mvl-page {
  padding: 12px 10px 70px 10px;
  max-width: 600px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Tarjeta de sección */
.mvl-card {
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  padding: 14px 14px;
  margin-bottom: 14px;
}

/* Label descriptivo pequeño */
.mvl-label {
  font-size: 0.72rem;
  color: #6c8299;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 8px;
  margin-bottom: 1px;
  display: block;
}

/* Valor destacado */
.mvl-value {
  font-size: 1rem;
  color: #1a1a2e;
  font-weight: 600;
  display: block;
}

/* Tabla de totales responsive */
.mvl-totales {
  width: 100%;
  border-collapse: collapse;
  font-weight: bold;
}

.mvl-totales td {
  padding: 9px 10px;
  border-bottom: 1px solid #e0e8f0;
  font-size: 1rem;
}

.mvl-totales td:last-child {
  text-align: right;
  color: #145885;
}

.mvl-totales tr.mvl-total-final td {
  font-size: 1.1rem;
  color: #03357a;
  border-bottom: none;
  font-weight: 800;
}

.mvl-totales tr:last-child td {
  border-bottom: none;
}

/* Separador de sección */
.mvl-sep {
  border: none;
  border-top: 1px solid #dce8f2;
  margin: 10px 0;
}

.entrada {
  width: 90%;
  margin-left: 5%;
  background: none;
  border: none;
  border-bottom: 1px solid black;
  font-size: 1.2rem;
  margin-top: 1.2rem;
}

.boton {
  width: 90%;
  margin-left: 5%;
}

.splash-bg {
  position: relative;
  height: 27%;

  background: radial-gradient(#cccccc 15%, transparent 16%) 4px 4px;
  background-color: #233a7f;
  background-size: 8px 8px;

  -webkit-box-shadow: 15px 17px 15px -10px rgba(0, 0, 0, 1);
  -moz-box-shadow: 15px 17px 15px -10px rgba(0, 0, 0, 1);
  box-shadow: 15px 17px 15px -10px rgba(0, 0, 0, 1);

  z-index: 1;
  animation: animatedBackground 30s linear infinite;
}

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 100% 0;
  }
}

.splash-info {
  position: relative;
  z-index: 2;
  margin-top: -64px;
  text-align: center;
}

.splash-logo {
  margin: auto;
  background-size: 100%;
  width: 37%;
}

.splash-intro {
  font-size: 1.25rem;
  font-weight: bold;
  max-width: 80%;
  margin: auto;
  margin-top: 18px;
  margin-bottom: 8px;
}

button.login {
  margin-top: 25px;
  background-color: white;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
  color: #333;

  &.activated {
    background-color: rgb(220, 220, 220);
  }
}

.camposInputProd {
  box-shadow: 0px 0px 0px inset;
  border-style: hidden;
  width: 90%;
  margin-left: 1rem;
  background: transparent;
}

.link_a_boton {
  width: 120px;
  height: 30px;

  border: 1px solid #168dd9;
  box-shadow: 0 1px 0 #53bcff inset, 0 1px 2px rgba(0, 0, 0, 0.2) !important;
  background: #27abff;
  background: linear-gradient(top, #27abff 0%, #059eff 100%);
  -webkit-transition: none;
  -moz-transition: none;
  -o-transition: none;

  color: white;
  font-weight: bold;
  text-shadow: 0 -1px 0 #1584de;
  text-align: center;
  text-decoration: none;
}

/* ═══════════════════════════════════════════════════════
   CLASES SEMÁNTICAS DE ESTADO
   Reemplazan los colores inline dispersos (color:blue, color:red, etc.)
   ═══════════════════════════════════════════════════════ */

/* Estado OK / aprobado / enviado */
.estado-ok {
  color: #1a7f37;
  font-weight: bold;
}

/* Estado error / rechazado / anulado */
.estado-error {
  color: #cf222e;
  font-weight: bold;
}

/* Estado info / pendiente */
.estado-info {
  color: #0969da;
  font-weight: bold;
}

/* Estado alerta / advertencia */
.estado-alerta {
  color: #9a6700;
  font-weight: bold;
}

/* Texto de mensajes de estado (en tablas de historial/compras) */
.lbl-numero-doc { color: #cf222e; font-size: 0.85rem; }
.lbl-fecha-doc  { color: #0969da; font-size: 0.85rem; }
.lbl-razon-doc  { color: #1a1a2e; font-size: 0.85rem; }

/* Indicador visual ✓ / ✗ en tablas */
.indicador-ok    { font-size: 1.2rem; font-weight: bold; color: #1a7f37; }
.indicador-error { font-size: 1.1rem; font-weight: bold; color: #cf222e; }
.indicador-neu   { font-size: 1.2rem; font-weight: bold; color: #9a6700; }


/* Espaciado elegante para grupos de botones en los footers de datatable */
.ui-datatable .ui-datatable-footer {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  align-items: center !important;
  justify-content: flex-start !important;
  background-color: transparent !important;
  border-top: 1px solid #e2e8f0 !important;
  padding: 0.8rem 1rem !important;
}

/* Evitar que todos los botones ocupen el 100% o pierdan su flow */
.ui-datatable .ui-datatable-footer .ui-button {
  margin: 0 !important;
  flex: 0 0 auto !important;
}

/* --- Premium Report Styles --- */
.premium-report-dialog.ui-dialog {
    max-height: 95vh !important;
    top: 2.5vh !important;
}

.premium-report-dialog.ui-dialog .ui-dialog-titlebar {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    padding: 0 15px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    height: 45px !important;
}

.premium-report-dialog.ui-dialog .ui-dialog-title {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    color: #475569 !important;
    margin: 0 !important;
}

.premium-report-dialog.ui-dialog .ui-dialog-titlebar .ui-widget-header-facet {
    justify-self: end !important;
}

.premium-report-dialog.ui-dialog .ui-dialog-content {
    padding: 0 !important;
    overflow: hidden !important;
    height: calc(95vh - 50px) !important; /* Ajuste preciso para evitar scroll externo */
}

.report-iframe-container {
    position: relative;
    width: 100%;
    height: 100%; /* Ahora lo controla el padre */
    background: #525659; /* Color similar al fondo del PDF para consistencia */
}

.premium-report-actions {
    display: flex !important;
    gap: 5px !important;
    align-items: center !important;
    height: 100% !important;
}

.report-iframe-container {
    position: relative;
    width: 100%;
    height: calc(100vh - 120px);
    background: #f1f5f9;
}

.report-iframe-container iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    background: white;
}

.report-iframe-container iframe.loaded {
    opacity: 1;
}

.report-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    z-index: 10;
}

.report-loader-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #e2e8f0;
    border-top: 3px solid #03357a;
    border-radius: 50%;
    animation: report-spin 1s linear infinite;
}

.report-loader-text {
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

@keyframes report-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.ui-dialog.premium-report-dialog {
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
}

/* --- Piloto responsive: portal, cabecera, menú lateral, usuario/admin --- */
.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;
}

.portal-header-leading {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex: 0 1 auto;
  min-width: 0;
}

.portal-menu-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(148, 163, 184, 0.4);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.07);
  color: #f1f5f9;
  cursor: pointer;
}

.portal-menu-toggle:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(148, 163, 184, 0.55);
}

.portal-menu-toggle-icon {
  font-size: 1.25rem;
  line-height: 1;
}

.portal-sidebar-backdrop {
  display: none;
}

body.portal-sidebar-open-body {
  overflow: hidden;
}

@media (max-width: 992px) {
  .portal-mobile-topbar {
    position: sticky;
    top: 0;
    z-index: 110;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-height: 3.35rem;
    padding: max(0.45rem, env(safe-area-inset-top)) 0.75rem 0.45rem;
    box-sizing: border-box;
    background: #0b1120;
    color: #f8fafc;
    border-bottom: 1px solid rgba(148, 163, 184, 0.22);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.16);
  }

  .portal-menu-toggle {
    display: inline-flex;
  }

  .portal-mobile-menu-toggle {
    background: rgba(255, 255, 255, 0.1);
  }

  .portal-mobile-brand,
  .portal-mobile-brand:visited {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-width: 0;
    color: #f8fafc;
    text-decoration: none;
  }

  .portal-mobile-brand-text {
    display: block;
    font-family: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1;
    color: inherit;
  }

  .portal-sidebar-rail-expand-btn {
    display: none !important;
  }

  .principal_portal .portal-sidebar {
    width: min(19rem, 88vw);
    transform: translateX(-102%);
    transition: transform 0.22s ease;
    z-index: 120;
    box-shadow: none;
  }

  .principal_portal.portal-sidebar-open .portal-sidebar {
    transform: translateX(0);
    box-shadow: 4px 0 20px rgba(15, 23, 42, 0.18);
  }

  .portal-sidebar-backdrop {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 115;
    background: rgba(15, 23, 42, 0.5);
    -webkit-tap-highlight-color: transparent;
  }

  .principal_portal.portal-sidebar-open .portal-sidebar-backdrop {
    display: block;
  }

  .principal_portal .contenido_portal {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 576px) {
  #logo_ecuasof {
    height: 28px !important;
  }

  .portal-sidebar-logo-link {
    gap: 0.42rem;
    padding: 0.18rem 0.28rem 0.18rem 0.12rem;
  }

  .portal-ecuasof-logo-mark {
    width: 36px;
  }

  .portal-ecuasof-logo-text {
    font-size: 1.22rem;
  }
}

/* Contenedor principal de páginas (template.xhtml) */
.contenedor .centro {
  box-sizing: border-box;
  max-width: 100%;
}

@media (max-width: 992px) {
  .contenedor {
    padding-left: 0.35rem;
    padding-right: 0.35rem;
  }

  .contenedor .centro {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-shadow: none;
  }
}

/* Barra de acciones + tablas con scroll horizontal */
.portal-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 0.75rem;
}

.portal-toolbar h1,
.portal-toolbar h2 {
  margin: 0;
  flex: 1 1 12rem;
  min-width: 0;
}

.portal-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
  align-items: center;
}

.table-scroll-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-scroll-wrap .ui-datatable,
.table-scroll-wrap .ui-datatable table {
  min-width: 640px;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper {
  max-height: min(58vh, 20rem) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper::-webkit-scrollbar {
  width: 0.65rem;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper::-webkit-scrollbar-track {
  background: #eef2f7;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border: 2px solid #eef2f7;
  border-radius: 999px;
}

.ui-selectonemenu-panel.ecuasof-selectonemenu-scrollable-panel::after {
  content: "Deslice para ver más";
  position: sticky;
  bottom: 0;
  display: block;
  padding: 0.35rem 0.5rem;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.86), #f8fafc);
  border-top: 1px solid #e2e8f0;
  color: #64748b;
  font-size: 0.72rem;
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}

/* Sin min-width forzado: prioridades responsive + reglas propias por vista */
@media (max-width: 992px) {
  .table-scroll-wrap.portal-datatable-responsive-mobile .ui-datatable,
  .table-scroll-wrap.portal-datatable-responsive-mobile .ui-datatable table {
    min-width: 0 !important;
    width: 100%;
  }

  .portal-personas-list .portal-personas-mobile-hide {
    display: none !important;
  }
}

/* Gestión usuarios (móvil): solo Razón social + Editar; el resto en pantallas mayores */
@media screen and (max-width: 992px) {
  .portal-usuarios-admin-datatable .ui-column-p-9,
  .portal-usuarios-admin-datatable .ui-column-p-10,
  .portal-usuarios-admin-datatable .ui-column-p-20,
  .portal-usuarios-admin-datatable .ui-column-p-22,
  .portal-usuarios-admin-datatable .ui-column-p-24 {
    display: none !important;
  }

  .portal-usuarios-admin-datatable .ui-column-p-1,
  .portal-usuarios-admin-datatable .ui-column-p-2 {
    display: table-cell !important;
  }

  .portal-usuarios-admin-datatable td.ui-column-p-1,
  .portal-usuarios-admin-datatable th.ui-column-p-1 {
    white-space: normal;
    word-break: break-word;
  }

  .portal-usuarios-admin-datatable td.ui-column-p-2,
  .portal-usuarios-admin-datatable th.ui-column-p-2 {
    width: 4rem;
    min-width: 3.5rem;
    text-align: center;
  }

  .portal-usuarios-admin-datatable table {
    table-layout: auto !important;
  }
}

/* Submenú pestañas (edición cuenta): scroll horizontal para ver todas */
.portal-tabmenu-mobile-only {
  display: none;
}

@media (max-width: 992px) {
  .portal-tabmenu-mobile-only {
    display: block;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 0 0.65rem;
    padding-right: 2px;
  }

  .portal-tabmenu-desktop-only {
    display: none !important;
  }

  .portal-tabmovil-label {
    display: block;
    font-size: 0.8rem;
    font-weight: 600;
    color: #0f172a;
    margin-bottom: 0.35rem;
  }

  .portal-user-edit-tab-select.ui-selectonemenu,
  .portal-user-edit-tab-select,
  select.portal-user-edit-tab-native {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
    max-width: 100%;
  }

  select.portal-user-edit-tab-native {
    display: block;
    padding: 0.45rem 0.6rem;
    font-size: 0.95rem;
    line-height: 1.35;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background-color: #fff;
    color: #0f172a;
  }

  .portal-gestion-usuario-panel.ui-panel .ui-panel-content {
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
  }
}

@media (min-width: 993px) {
  .portal-tabmenu-desktop-only {
    display: block;
  }
}

.portal-submenusuario-tabs {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 0.35rem;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.portal-submenusuario-tabs > form {
  display: block;
  width: max-content;
  min-width: 100%;
}

.portal-tabmenu-responsive.ui-tabmenu {
  width: max-content;
  min-width: 100%;
  border: none !important;
  background: transparent !important;
}

.portal-tabmenu-responsive.ui-tabmenu .ui-tabmenu-nav {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  overflow: visible;
  width: max-content;
  min-width: 100%;
  gap: 0;
  margin: 0;
  padding: 0 2px 8px 0;
}

.portal-tabmenu-responsive.ui-tabmenu .ui-tabmenu-nav .ui-tabmenuitem {
  flex: 0 0 auto;
}

.portal-tabmenu-responsive.ui-tabmenu .ui-tabmenu-nav .ui-menuitem-link {
  white-space: nowrap;
  padding: 0.72rem 0.9rem;
  font-size: 0.95rem;
  line-height: 1.2;
}

@media (max-width: 992px) {
  .portal-tabmenu-responsive.ui-tabmenu .ui-tabmenu-nav .ui-menuitem-link {
    font-size: 0.9rem;
    padding: 0.65rem 0.75rem;
  }
}

/* Historial de contratos: en estrecho solo Fecha Inicio y Fecha Fin */
@media screen and (max-width: 992px) {
  .portal-contrato-historial-table thead tr:first-child {
    display: none !important;
  }

  .portal-contrato-historial-table thead tr:last-child th:not(:nth-child(4)):not(:nth-child(5)) {
    display: none !important;
  }

  .portal-contrato-historial-table tbody tr > td:not(:nth-child(4)):not(:nth-child(5)) {
    display: none !important;
  }

  .portal-contrato-historial-table thead tr:last-child th:nth-child(4),
  .portal-contrato-historial-table thead tr:last-child th:nth-child(5),
  .portal-contrato-historial-table tbody tr > td:nth-child(4),
  .portal-contrato-historial-table tbody tr > td:nth-child(5) {
    display: table-cell !important;
    white-space: normal !important;
    word-break: normal;
    overflow-wrap: break-word;
    min-width: 6rem;
    max-width: 46vw;
    vertical-align: top;
  }

  .portal-contrato-historial-table table {
    table-layout: auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .portal-contrato-historial-table .ui-datatable-tablewrapper {
    overflow: visible !important;
  }

  .portal-contrato-historial-table .ui-column-p-20,
  .portal-contrato-historial-table .ui-column-p-21,
  .portal-contrato-historial-table .ui-column-p-22,
  .portal-contrato-historial-table .ui-column-p-23,
  .portal-contrato-historial-table .ui-column-p-24,
  .portal-contrato-historial-table .ui-column-p-25,
  .portal-contrato-historial-table .ui-column-p-26,
  .portal-contrato-historial-table .ui-column-p-27 {
    display: none !important;
  }

  .portal-contrato-historial-table .ui-column-p-1,
  .portal-contrato-historial-table .ui-column-p-2 {
    display: table-cell !important;
  }
}

/* Diálogo crear / copiar contrato: contenido desplazable y botones alcanzables en móvil */
@media screen and (max-width: 992px) {
  .portal-contrato-create-dialog.ui-dialog {
    width: 94vw !important;
    max-width: 94vw !important;
    height: auto !important;
    max-height: 96vh !important;
    margin: 0 !important;
    top: 2vh !important;
    left: 3vw !important;
    position: fixed !important;
  }

  body .portal-contrato-create-dialog .ui-dialog-content {
    max-height: calc(96vh - 5.5rem) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding: 0.75rem !important;
    box-sizing: border-box !important;
  }

  .portal-contrato-create-dialog .portal-contrato-create-form-grid .ui-panelgrid-cell {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-contrato-create-dialog .portal-contrato-create-form-grid {
    width: 100% !important;
  }

  .portal-contrato-create-dialog .ui-selectonemenu {
    width: 100% !important;
    min-width: 0 !important;
  }

  .portal-contrato-create-dialog .ui-calendar .ui-inputfield {
    width: 100% !important;
    max-width: none !important;
  }

  .portal-contrato-create-dialog .ui-inputnumber .ui-inputtext {
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-contrato-create-dialog .portal-textarea-fluid {
    width: 100% !important;
    max-width: none !important;
    min-height: 5rem;
    box-sizing: border-box;
  }

  .portal-contrato-create-dialog table.portal-contrato-fecha-row tr {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
  }

  .portal-contrato-create-dialog table.portal-contrato-fecha-row td {
    display: block !important;
    width: 100% !important;
  }

  .portal-contrato-create-dialog .portal-contrato-link-shortcut {
    padding: 0.4rem 0 !important;
  }

  .portal-contrato-create-dialog .portal-contrato-dialog-actions {
    margin-top: 1rem;
    padding: 0.85rem 0 0.25rem;
    border-top: 1px solid #e2e8f0;
    background: #fff;
  }

  .portal-contrato-create-dialog .portal-contrato-dialog-actions .ui-button {
    width: 100% !important;
    margin: 0.35rem 0 !important;
    box-sizing: border-box;
    display: block !important;
  }
}

.portal-contrato-create-dialog .portal-contrato-dialog-actions {
  margin-top: 1rem;
  padding-top: 0.65rem;
  border-top: 1px solid #e2e8f0;
}

.portal-contrato-create-dialog .portal-select-fluid.ui-selectonemenu {
  width: 100%;
  max-width: 28rem;
}

.portal-contrato-actions,
.portal-list-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.85rem;
}

.portal-contrato-actions .ui-button,
.portal-list-actions .ui-button {
  min-height: 2.25rem;
}

/* Panel edición administración de usuarios (PrimeFaces panelGrid + tablas anidadas) */
.portal-gestion-usuario-panel .ui-panel-titlebar {
  flex-wrap: wrap;
}

.portal-user-edit-body {
  text-align: center;
}

.portal-user-edit-body > .ui-panel,
.portal-user-edit-body .ui-panel {
  text-align: left;
}

@media (min-width: 993px) {
  .portal-gestion-usuario-panel .portal-admin-datos-cuenta,
  .portal-gestion-usuario-panel .portal-admin-datos-cuenta.ui-panelgrid {
    margin-left: auto;
    margin-right: auto;
  }
}

.portal-user-edit-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.5rem;
}

.portal-user-edit-toolbar .portal-user-edit-close {
  float: none;
}

.portal-section-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 0.85rem;
  margin-bottom: 0.75rem;
}

.portal-section-title-row h2 {
  margin: 0;
}

.portal-form-grid {
  display: grid;
  grid-template-columns: minmax(10rem, max-content) minmax(14rem, 28rem);
  gap: 0.7rem 1rem;
  align-items: center;
  width: min(100%, 52rem);
  margin: 0 auto 1rem;
  box-sizing: border-box;
  text-align: left;
}

.portal-form-grid-three {
  grid-template-columns: repeat(3, minmax(8rem, max-content) minmax(8rem, 1fr));
  width: min(100%, 68rem);
}

.portal-secuenciales-grid {
  grid-template-columns: repeat(2, minmax(9rem, max-content) minmax(8rem, 1fr));
  width: min(100%, 68rem);
}

.portal-form-grid .ui-inputfield,
.portal-form-grid input:not([type="hidden"]),
.portal-form-grid textarea,
.portal-form-grid .ui-selectonemenu,
.portal-form-grid .ui-calendar,
.portal-form-grid .ui-inputnumber,
.portal-form-grid .ui-password {
  width: 100% !important;
  max-width: 100%;
  box-sizing: border-box;
}

.portal-field-note {
  font-size: 0.82rem;
  line-height: 1.35;
  color: #64748b;
}

.portal-field-note label,
.portal-field-note .ui-outputlabel {
  display: block;
  color: #334155;
}

.portal-inline-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
}

.portal-ruc-search-row {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
}

.portal-ruc-search-row .portal-input-fluid {
  flex: 1 1 auto;
  min-width: 0;
}

.portal-firma-actions-row {
  display: grid;
  grid-template-columns: minmax(10rem, max-content) minmax(12rem, 20rem) auto;
  gap: 0.7rem 0.8rem;
  align-items: center;
  width: min(100%, 52rem);
  margin: 1rem auto;
  text-align: left;
}

.portal-account-layout {
  display: grid;
  gap: 1rem;
  width: min(100%, 1120px);
  margin: 0 auto;
  text-align: left;
}

.portal-mi-cuenta .portal-account-card,
.portal-mi-cuenta .portal-account-card.ui-panel {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.portal-mi-cuenta .portal-account-card .ui-panel-titlebar {
  border-radius: 8px 8px 0 0;
  border-color: #dbe4ee;
  background: #f8fafc;
  color: #0f3d5e;
  font-weight: 700;
}

.portal-mi-cuenta .portal-account-card .ui-panel-content {
  padding: 1rem;
  box-sizing: border-box;
}

.portal-mi-cuenta h2 {
  margin: 0.25rem 0 0.85rem;
  color: #0f3d5e;
  font-size: 1.25rem;
  line-height: 1.25;
}

.portal-mi-cuenta .ui-panelgrid {
  width: 100%;
}

.portal-mi-cuenta .ui-panelgrid .ui-panelgrid-cell {
  padding: 0.45rem 0.6rem;
  vertical-align: middle;
}

.portal-mi-cuenta .ui-inputfield,
.portal-mi-cuenta input:not([type="hidden"]),
.portal-mi-cuenta textarea,
.portal-mi-cuenta .ui-selectonemenu,
.portal-mi-cuenta .ui-inputnumber,
.portal-mi-cuenta .ui-inputnumber input {
  max-width: 100%;
  box-sizing: border-box;
}

.portal-mi-cuenta .ui-panelgrid .ui-inputfield,
.portal-mi-cuenta .ui-panelgrid input:not([type="hidden"]),
.portal-mi-cuenta .ui-panelgrid textarea,
.portal-mi-cuenta .ui-panelgrid .ui-selectonemenu,
.portal-mi-cuenta .ui-panelgrid .ui-inputnumber {
  width: min(100%, 22rem) !important;
}

.portal-signature-card {
  display: block;
  padding: 1rem;
}

.portal-account-section-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: start;
  margin-bottom: 0.85rem;
}

.portal-account-section-header h2 {
  margin-bottom: 0.25rem;
}

.portal-account-section-header p {
  margin: 0;
  color: #64748b;
  line-height: 1.4;
}

.portal-signature-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.3rem 0.65rem;
  border: 1px solid #b7e0c0;
  border-radius: 999px;
  background: #eefaf1;
  color: #18642e;
  font-size: 0.82rem;
  font-weight: 700;
  white-space: nowrap;
}

.portal-signature-status-empty {
  border-color: #f0c1a1;
  background: #fff7ed;
  color: #9a3412;
}

.portal-upload-zone {
  margin: 0.75rem 0;
}

.portal-mi-cuenta .ui-fileupload {
  max-width: 100%;
}

.portal-mi-cuenta .ui-fileupload-content {
  overflow-x: auto;
}

.portal-signature-path,
.portal-signature-key-status {
  min-width: 0;
  margin: 0.65rem 0;
  padding: 0.65rem 0.75rem;
  border: 1px solid #dbe4ee;
  border-radius: 6px;
  background: #f8fafc;
  color: #334155;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.portal-signature-path span {
  display: inline-block;
  margin-right: 0.35rem;
  color: #0f3d5e;
  font-weight: 700;
}

.portal-account-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.portal-account-footer {
  padding: 1rem 0;
  text-align: center;
  color: #64748b;
}

.portal-dialog-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 0.8rem;
  border-top: 1px solid #e2e8f0;
}

.portal-scroll-dialog.ui-dialog {
  width: min(94vw, 760px) !important;
  max-width: 94vw;
  max-height: 92vh !important;
  box-sizing: border-box;
}

body .portal-scroll-dialog .ui-dialog-content {
  max-height: calc(92vh - 4.75rem) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
}

body .portal-scroll-dialog .ui-dialog-titlebar {
  box-sizing: border-box;
  flex: 0 0 auto;
}

.portal-persona-dialog.ui-dialog {
  width: min(95vw, 900px) !important;
}

.portal-persona-report-dialog.ui-dialog {
  width: 95vw !important;
}

body .portal-persona-report-dialog .ui-dialog-content {
  height: calc(92vh - 4.75rem) !important;
}

body .portal-persona-dialog .ui-dialog-content {
  padding-bottom: 1rem;
}

.portal-dialog-scroll-body {
  max-height: calc(92vh - 4.75rem);
  overflow-y: auto;
  overflow-x: hidden;
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  padding: 0 0.25rem 1.25rem;
}

body .portal-persona-dialog .portal-dialog-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  background: #fff;
}

.portal-cliente-relacion-grid {
  display: grid;
  grid-template-columns: minmax(9rem, 1fr) auto;
  gap: 0.75rem 1rem;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

.portal-inventario-dialog.ui-dialog {
  width: min(96vw, 1120px) !important;
}

.portal-inventario-grid {
  display: grid;
  grid-template-columns: minmax(20rem, 1.2fr) minmax(18rem, 0.8fr);
  gap: 1rem 1.5rem;
  align-items: start;
  width: 100%;
  box-sizing: border-box;
}

.portal-producto-grid {
  grid-template-columns: minmax(0, 64rem);
  justify-content: start;
}

.portal-producto-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem 1rem;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.portal-producto-identidad {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 0.85rem 1rem;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.portal-field-nombre .ui-inputtextarea,
.portal-field-codbarras .ui-inputfield {
  width: 100% !important;
  box-sizing: border-box;
}

.portal-section-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem 1rem;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.portal-field {
  display: grid;
  gap: 0.3rem;
  align-content: start;
  min-width: 0;
}

.portal-field label,
.portal-field .ui-outputlabel {
  font-weight: 600;
  color: #334155;
}

.portal-span-3 {
  grid-column: 1 / -1;
}

.portal-section-title {
  margin: 0.15rem 0 -0.25rem;
  padding-top: 0.8rem;
  border-top: 1px solid #e2e8f0;
  color: #1f5f8b;
  font-weight: 700;
}

.portal-inventario-fields,
.portal-inventario-side-fields {
  display: grid;
  grid-template-columns: minmax(9rem, max-content) minmax(14rem, 1fr);
  gap: 0.7rem 1rem;
  align-items: center;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

.portal-inventario-side-fields {
  grid-template-columns: minmax(7rem, max-content) minmax(12rem, 1fr);
  margin-top: 1rem;
}

.portal-inventario-inline {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  align-items: center;
  min-width: 0;
}

.portal-inventario-fast-title {
  grid-column: 1 / -1;
  margin: 0.35rem 0 -0.15rem;
  padding-top: 0.75rem;
  border-top: 1px solid #e2e8f0;
  color: #1f5f8b;
  font-weight: 700;
}

.portal-inventario-fast-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(8rem, max-content) minmax(10rem, 1fr);
  gap: 0.6rem 0.85rem;
  align-items: center;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.portal-section-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.55rem 0.75rem;
  align-items: start;
  margin-top: 0.15rem;
}

.portal-section-summary > :first-child {
  min-height: 2.1rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
}

.portal-inventario-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.55rem 0.75rem;
  align-items: start;
  min-width: 0;
}

.portal-inventario-summary > :first-child {
  min-height: 2.1rem;
  padding: 0.45rem 0.6rem;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
}

.portal-more-button {
  white-space: nowrap;
}

.portal-advanced-toggle {
  justify-self: start;
}

.portal-producto-extra {
  grid-column: 1 / -1;
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.portal-extra-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  padding-top: 0.35rem;
}

.portal-producto-avanzado {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}

.portal-hidden {
  display: none !important;
}

.portal-inventario-stack {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}

.portal-inventario-dialog .portal-dialog-scroll-body,
.portal-inventario-grid > *,
.portal-producto-form > *,
.portal-producto-identidad > *,
.portal-section-grid > *,
.portal-field > *,
.portal-inventario-fields > *,
.portal-inventario-side-fields > *,
.portal-inventario-inline > *,
.portal-inventario-fast-grid > *,
.portal-section-summary > *,
.portal-inventario-summary > *,
.portal-producto-extra > *,
.portal-producto-avanzado > *,
.portal-inventario-stack > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.portal-inventario-dialog .ui-inputfield,
.portal-inventario-dialog input:not([type="hidden"]),
.portal-inventario-dialog textarea,
.portal-inventario-dialog .ui-selectonemenu,
.portal-inventario-dialog .ui-inputnumber,
.portal-inventario-dialog .ui-inputnumber input,
.portal-inventario-dialog .ui-calendar,
.portal-inventario-dialog .ui-autocomplete {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.portal-inventario-dialog .ui-selectonemenu-label {
  width: auto !important;
  max-width: calc(100% - 2rem);
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-inventario-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 1rem;
  padding: 0.85rem 0 1.2rem;
  border-top: 1px solid #e2e8f0;
}

.portal-inventario-actions-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.portal-inventario-actions .ui-button,
.portal-inventario-actions .ui-commandlink {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.portal-inventario-dialog .portal-dialog-actions,
.portal-inventario-dialog .portal-inventario-actions {
  align-items: center;
}

.portal-inventario-dialog .portal-dialog-actions .ui-button,
.portal-inventario-dialog .portal-inventario-actions .ui-button {
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  min-height: auto;
  line-height: 1.25;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.portal-inventario-dialog .portal-dialog-actions .ui-button .ui-button-text,
.portal-inventario-dialog .portal-inventario-actions .ui-button .ui-button-text {
  padding: 0;
  line-height: 1.25;
}

.portal-import-panel {
  display: grid;
  gap: 0.75rem;
}

.portal-inventario-filtros {
  display: inline-grid;
  grid-template-columns: repeat(4, minmax(10rem, 14rem));
  gap: 0.65rem 0.8rem;
  align-items: end;
  width: auto;
  max-width: 100%;
  justify-content: start;
}

.portal-icon-action.ui-button {
  width: 2.25rem !important;
  height: 2.25rem;
  min-width: 2.25rem;
  padding: 0 !important;
}

.factu-form-grid,
.factu-form-grid-three,
.factu-options-grid,
.factu-retention-values {
  display: grid;
  gap: 0.75rem 1rem;
  align-items: end;
  width: 100%;
  box-sizing: border-box;
  text-align: left;
}

.factu-form-grid {
  grid-template-columns: repeat(2, minmax(12rem, 1fr));
}

.factu-form-grid-three {
  grid-template-columns: repeat(3, minmax(11rem, 1fr));
}

.factu-options-grid {
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}

.factu-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
  box-sizing: border-box;
}

.factu-field label,
.factu-field .ui-outputlabel,
.factu-options-grid .ui-outputlabel {
  font-size: 0.82rem;
  font-weight: 700;
  color: #334155;
}

.factu-dialog.ui-dialog {
  width: min(96vw, 980px) !important;
}

.cotejar-dialog.ui-dialog {
  width: min(99vw, 1500px) !important;
}

.cotejar-dialog-body {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 0.25rem 0.5rem 1.25rem;
  overflow-x: hidden;
}

.cotejar-upload {
  max-width: 34rem;
}

.cotejar-upload .ui-fileupload,
.cotejar-upload .ui-fileupload-content,
.cotejar-upload .ui-fileupload-buttonbar {
  box-sizing: border-box;
  width: 100%;
}

.cotejar-table-wrap {
  width: 100%;
  overflow-x: hidden;
}

.cotejar-table.ui-datatable {
  width: 100%;
}

.cotejar-table.ui-datatable table {
  width: 100% !important;
  table-layout: fixed;
}

.cotejar-table th,
.cotejar-table td {
  vertical-align: top;
  box-sizing: border-box;
  padding: 0.55rem 0.5rem !important;
}

.cotejar-table th {
  white-space: normal;
}

.cotejar-table .ui-column-title,
.cotejar-header-label {
  display: block;
  margin-bottom: 0.35rem;
  color: #334155;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}

.cotejar-help {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 1rem;
  margin: 0.15rem 0 0.85rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid #dbe3ec;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: 0.82rem;
  font-weight: 600;
}

.cotejar-table .ui-selectonemenu,
.cotejar-table .ui-inputnumber,
.cotejar-table .ui-inputnumber input,
.cotejar-table .ui-inputfield,
.cotejar-table input:not([type="hidden"]) {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.cotejar-col-check {
  width: 4.6rem;
  text-align: left;
}

.cotejar-col-producto {
  width: 34rem;
}

.cotejar-col-valor,
.cotejar-col-tipo,
.cotejar-col-proposito,
.cotejar-col-utilidad {
  width: 7.5rem;
}

.cotejar-col-proposito {
  width: 9.5rem;
}

.cotejar-col-utilidad {
  width: 11.5rem;
}

.cotejar-col-check .cotejar-header-label {
  min-height: 2rem;
  margin-bottom: 0.3rem;
  font-size: 0.72rem;
  text-align: left;
}

.cotejar-col-check .ui-chkbox {
  margin-left: 0;
  margin-right: auto;
}

.cotejar-check-cell {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  min-height: 2.4rem;
}

.cotejar-text-wrap {
  display: block;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.cotejar-producto-cell {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.cotejar-field-label,
.cotejar-select-label {
  display: block;
  color: #047857;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.cotejar-product-section {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  min-width: 0;
  padding: 0.45rem 0.55rem;
  border: 1px solid #dbe3ec;
  border-left: 4px solid #059669;
  border-radius: 6px;
  background: #fff;
}

.cotejar-xml-section {
  background: #f8fafc;
  border-left-color: #dc2626;
}

.cotejar-db-section {
  background: #f7fef9;
  border-left-color: #059669;
}

.cotejar-code-text {
  display: inline-block;
  margin-right: 0.4rem;
  color: #b91c1c;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.25;
}

.cotejar-xml-text {
  display: block;
  color: #334155;
  font-size: 0.82rem;
}

.cotejar-select-label {
  margin-top: 0;
}

.cotejar-producto-select {
  min-width: 0 !important;
}

.cotejar-col-utilidad .ui-inputnumber {
  display: block;
  width: 100% !important;
}

.cotejar-col-utilidad .ui-inputnumber input {
  min-width: 8.5rem !important;
  padding-left: 0.65rem !important;
  padding-right: 0.65rem !important;
  text-align: right;
}

.cotejar-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  padding: 0.9rem 0 0.25rem;
  background: #fff;
  text-align: center;
}

.cotejar-actions .ui-button {
  max-width: 100%;
}

.cotejar-warning {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.5rem 0 0.25rem;
}

@media (max-width: 768px) {
  .cotejar-dialog.ui-dialog {
    width: 98vw !important;
  }

  .cotejar-dialog-body {
    padding-inline: 0.25rem;
  }

  .cotejar-upload {
    max-width: 100%;
  }

  body .cotejar-table.ui-datatable-reflow .ui-datatable-data td {
    display: grid !important;
    grid-template-columns: minmax(6.5rem, 34%) minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0.55rem 0.65rem !important;
    text-align: left !important;
  }

  body .cotejar-table.ui-datatable-reflow .ui-datatable-data tr {
    display: block;
    margin-bottom: 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
  }

  body .cotejar-table.ui-datatable-reflow .ui-column-title {
    display: block;
    margin: 0;
    color: #475569;
    font-size: 0.76rem;
    font-weight: 700;
  }

  body .cotejar-table.ui-datatable-reflow .cotejar-col-producto {
    grid-template-columns: 1fr;
  }

  body .cotejar-table.ui-datatable-reflow .cotejar-col-producto .ui-column-title {
    margin-bottom: 0.35rem;
  }

  .cotejar-col-producto,
  .cotejar-col-check,
  .cotejar-col-valor,
  .cotejar-col-tipo,
  .cotejar-col-proposito,
  .cotejar-col-utilidad {
    width: auto !important;
    min-width: 0 !important;
  }

  .cotejar-actions .ui-button {
    width: 100%;
  }
}

@media (min-width: 769px) {
  .cotejar-table .ui-datatable-tablewrapper {
    overflow-x: hidden !important;
  }
}

.factu-detalle-dialog.ui-dialog {
  width: min(94vw, 560px) !important;
}

body .factu-detalle-dialog .portal-dialog-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  background: #fff;
}

.factu-dialog .ui-dialog-content,
.factu-dialog .portal-dialog-scroll-body {
  box-sizing: border-box;
}

.factu-form-grid .ui-inputfield,
.factu-form-grid input:not([type="hidden"]),
.factu-form-grid textarea,
.factu-form-grid .ui-selectonemenu,
.factu-form-grid .ui-inputnumber,
.factu-form-grid .ui-inputnumber input,
.factu-form-grid .ui-calendar,
.factu-form-grid-three .ui-inputfield,
.factu-form-grid-three input:not([type="hidden"]),
.factu-form-grid-three textarea,
.factu-form-grid-three .ui-selectonemenu,
.factu-form-grid-three .ui-inputnumber,
.factu-form-grid-three .ui-inputnumber input,
.factu-form-grid-three .ui-calendar,
.factu-dialog .ui-inputfield,
.factu-dialog input:not([type="hidden"]),
.factu-dialog textarea,
.factu-dialog .ui-selectonemenu,
.factu-dialog .ui-inputnumber,
.factu-dialog .ui-inputnumber input,
.factu-dialog .ui-calendar {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.factu-retention-values {
  grid-template-columns: minmax(10rem, max-content) minmax(10rem, 14rem);
  justify-content: end;
  align-items: center;
}

.factu-retention-values h3 {
  grid-column: 1 / -1;
  margin: 0.5rem 0 0.25rem;
  text-align: right;
}

.portal-stack-md table,
.portal-stack-md tbody,
.portal-stack-md tr,
.portal-stack-md td {
  box-sizing: border-box;
}

/* Anchos fluidos (formularios cuenta) */
.portal-gestion-usuario-panel .portal-input-fluid {
  width: 100%;
  max-width: 22rem;
  box-sizing: border-box;
}

.portal-gestion-usuario-panel .portal-select-fluid {
  min-width: 12rem;
  max-width: 100%;
}

.portal-gestion-usuario-panel .portal-textarea-fluid {
  width: 100%;
  max-width: 36rem;
  box-sizing: border-box;
}

.portal-mobile-dialog.ui-dialog {
  max-width: min(420px, 94vw);
}

@media (max-width: 992px) {
  .portal-mobile-dialog.ui-dialog {
    width: 92vw !important;
  }

  .portal-user-edit-body {
    text-align: left;
  }

  .portal-gestion-usuario-panel .portal-user-edit-title,
  .portal-gestion-usuario-panel .portal-user-edit-body h2 {
    font-size: 1.1rem;
    line-height: 1.3;
    word-break: break-word;
    text-align: left;
    margin: 0.65rem 0;
  }

  .portal-gestion-usuario-panel .portal-btn-full-mobile {
    width: 100%;
    margin: 0.35rem 0 !important;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .ui-datatable-footer,
  .portal-gestion-usuario-panel .ui-datatable tfoot td {
    text-align: center !important;
  }

  .portal-gestion-usuario-panel .ui-datatable-footer .ui-button,
  .portal-gestion-usuario-panel .ui-datatable tfoot .ui-button {
    margin: 0.25rem !important;
  }

  .portal-gestion-usuario-panel .ui-fileupload {
    max-width: 100%;
  }

  .portal-gestion-usuario-panel .ui-fileupload .ui-fileupload-buttonbar .ui-button {
    margin: 0.2rem;
  }

  .portal-gestion-usuario-panel .ui-selectonemenu {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .ui-selectonemenu .ui-selectonemenu-label {
    width: auto;
  }

  .portal-gestion-usuario-panel .ui-calendar .ui-inputfield,
  .portal-gestion-usuario-panel .ui-calendar input {
    width: 100% !important;
    max-width: none;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .ui-inputnumber .ui-inputtext {
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .portal-section-title-row td {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
  }

  .portal-gestion-usuario-panel
    table.portal-ruc-search-row
    tbody
    tr {
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
  }

  .portal-gestion-usuario-panel table.portal-ruc-search-row td {
    display: block !important;
    width: auto !important;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel table.portal-ruc-search-row td:first-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .portal-gestion-usuario-panel .portal-ruc-search-row {
    width: 100%;
  }

  .portal-gestion-usuario-panel .portal-input-fluid {
    max-width: none;
    width: 100% !important;
  }

  .portal-gestion-usuario-panel .portal-select-fluid {
    width: 100% !important;
    min-width: 0 !important;
  }

  .portal-gestion-usuario-panel .portal-textarea-fluid {
    max-width: none;
  }

  .portal-gestion-usuario-panel table.portal-firma-actions-row tr,
  .portal-gestion-usuario-panel table.portal-firma-actions-row td {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
  }

  .portal-gestion-usuario-panel table.portal-firma-actions-row td .ui-button {
    margin-top: 0.5rem;
  }

  .portal-gestion-usuario-panel .ui-panelgrid .ui-panelgrid-cell,
  .portal-mi-cuenta .ui-panelgrid .ui-panelgrid-cell {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .ui-panelgrid,
  .portal-mi-cuenta .ui-panelgrid {
    width: 100%;
  }

  .portal-gestion-usuario-panel .ui-inputfield,
  .portal-gestion-usuario-panel input:not([type="hidden"]),
  .portal-gestion-usuario-panel select,
  .portal-mi-cuenta .ui-inputfield,
  .portal-mi-cuenta input:not([type="hidden"]) {
    max-width: 100%;
    box-sizing: border-box;
  }

  .portal-stack-md tr,
  .portal-stack-md td {
    display: block;
    width: 100% !important;
  }

  .portal-gestion-usuario-panel #ContratoListForm .ui-panel-content > .ui-button {
    display: block;
    width: 100%;
    margin: 0.35rem 0;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel #estadoUsForm .ui-button {
    width: 100%;
    margin: 0.35rem 0;
    box-sizing: border-box;
  }

  .portal-gestion-usuario-panel .portal-mobile-hide {
    display: none !important;
  }

  .portal-gestion-usuario-panel .portal-mobile-primary {
    width: auto !important;
    min-width: 12rem;
  }

  .portal-contrato-actions,
  .portal-list-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .portal-contrato-actions .ui-button,
  .portal-list-actions .ui-button {
    width: 100%;
    box-sizing: border-box;
  }

  .portal-section-title-row {
    align-items: stretch;
    flex-direction: column;
  }

  .portal-form-grid,
  .portal-form-grid-three,
  .portal-secuenciales-grid {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    gap: 0.35rem;
    margin-left: 0;
    margin-right: 0;
  }

  .portal-form-grid label,
  .portal-form-grid .ui-outputlabel,
  .portal-readonly-grid > span:nth-child(odd) {
    margin-top: 0.45rem;
    font-weight: 700;
    color: #334155;
  }

  .portal-inline-actions,
  .portal-dialog-actions,
  .portal-firma-actions-row {
    align-items: stretch;
    flex-direction: column;
  }

  .portal-mi-cuenta .portal-account-layout {
    width: 100%;
    gap: 0.85rem;
  }

  .portal-mi-cuenta .portal-account-card .ui-panel-content,
  .portal-mi-cuenta .portal-signature-card {
    padding: 0.85rem;
  }

  .portal-mi-cuenta .portal-account-section-header {
    grid-template-columns: 1fr;
  }

  .portal-mi-cuenta .portal-signature-status {
    justify-self: start;
    white-space: normal;
  }

  .portal-mi-cuenta .portal-firma-actions-row {
    grid-template-columns: 1fr;
    width: 100%;
    margin: 0.85rem 0;
  }

  .portal-mi-cuenta .ui-panelgrid .ui-inputfield,
  .portal-mi-cuenta .ui-panelgrid input:not([type="hidden"]),
  .portal-mi-cuenta .ui-panelgrid textarea,
  .portal-mi-cuenta .ui-panelgrid .ui-selectonemenu,
  .portal-mi-cuenta .ui-panelgrid .ui-inputnumber,
  .portal-mi-cuenta .portal-firma-actions-row .ui-password,
  .portal-mi-cuenta .portal-firma-actions-row .ui-inputfield {
    width: 100% !important;
  }

  .portal-mi-cuenta .ui-fileupload .ui-fileupload-buttonbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
  }

  .portal-mi-cuenta .ui-fileupload .ui-fileupload-buttonbar .ui-button {
    flex: 1 1 9rem;
    margin: 0 !important;
    box-sizing: border-box;
  }

  .portal-dialog-actions .ui-button,
  .portal-inline-actions .ui-button,
  .portal-inline-actions .ui-commandlink,
  .portal-firma-actions-row .ui-button {
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-scroll-dialog.ui-dialog {
    width: 94vw !important;
    max-height: 92vh;
  }

  .portal-cliente-relacion-grid {
    grid-template-columns: 1fr auto;
    gap: 0.65rem 0.75rem;
  }

  .portal-inventario-grid,
  .portal-inventario-fields,
  .portal-producto-grid .portal-inventario-fields,
  .portal-inventario-side-fields,
  .portal-inventario-inline,
  .portal-inventario-fast-grid,
  .portal-section-summary,
  .portal-inventario-summary {
    grid-template-columns: 1fr;
  }

  .portal-producto-form,
  .portal-section-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-producto-identidad {
    grid-template-columns: 1fr;
  }

  .portal-inventario-grid {
    gap: 0.85rem;
  }

  .portal-inventario-fields,
  .portal-inventario-side-fields {
    gap: 0.35rem;
  }

  .portal-inventario-fields label,
  .portal-inventario-fields .ui-outputlabel,
  .portal-inventario-side-fields label,
  .portal-inventario-side-fields .ui-outputlabel,
  .portal-inventario-fast-grid label,
  .portal-inventario-fast-grid .ui-outputlabel {
    margin-top: 0.45rem;
    font-weight: 700;
    color: #334155;
  }

  .portal-inventario-actions,
  .portal-inventario-actions-group {
    align-items: stretch;
    flex-direction: column;
  }

  .portal-inventario-actions .ui-button,
  .portal-inventario-actions .ui-commandlink,
  .portal-extra-actions .ui-button {
    width: 100% !important;
    box-sizing: border-box;
  }

  .portal-inventario-filtros {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .portal-inventario-mobile-hide {
    display: none !important;
  }

  .portal-inventario-mobile-nombre,
  .portal-inventario-mobile-editar {
    display: table-cell !important;
  }

  .portal-inventario-mobile-nombre {
    white-space: normal;
    word-break: break-word;
  }

  .portal-inventario-mobile-editar {
    width: 4rem;
    min-width: 3.5rem;
    text-align: center;
  }

  .factu-form-grid,
  .factu-form-grid-three,
  .factu-options-grid,
  .factu-retention-values {
    grid-template-columns: 1fr;
  }

  .factu-retention-values {
    justify-content: stretch;
  }

  .factu-retention-values h3 {
    text-align: left;
  }
}

@media (max-width: 640px) {
  .portal-producto-form,
  .portal-section-grid {
    grid-template-columns: 1fr;
  }
}

/* Registrar Persona: solo el contenido interno hace scroll (no tocar .ui-dialog) */
.cliente-registro-persona-scroll {
  box-sizing: border-box;
  max-height: calc(90vh - 5rem);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

/* Modern responsive grid system for contabilidad module */
.conta-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 1rem;
  width: 100%;
  box-sizing: border-box;
  align-items: end;
  padding: 0.5rem 0;
}

.conta-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  width: 100%;
  box-sizing: border-box;
}

.conta-form-group > label,
.conta-form-group > .ui-outputlabel {
  font-weight: 600 !important;
  font-size: 0.825rem !important;
  color: #334155 !important;
  margin-bottom: 0.15rem;
  text-align: left;
}

.conta-form-group .ui-inputfield,
.conta-form-group .ui-selectonemenu {
  width: 100% !important;
  box-sizing: border-box;
}

.conta-col-1  { grid-column: span 1; }
.conta-col-2  { grid-column: span 2; }
.conta-col-3  { grid-column: span 3; }
.conta-col-4  { grid-column: span 4; }
.conta-col-5  { grid-column: span 5; }
.conta-col-6  { grid-column: span 6; }
.conta-col-7  { grid-column: span 7; }
.conta-col-8  { grid-column: span 8; }
.conta-col-9  { grid-column: span 9; }
.conta-col-10 { grid-column: span 10; }
.conta-col-11 { grid-column: span 11; }
.conta-col-12 { grid-column: span 12; }

.conta-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin-top: 1rem;
}

@media (max-width: 992px) {
  .conta-col-md-6 { grid-column: span 6 !important; }
  .conta-col-md-12 { grid-column: span 12 !important; }
}

@media (max-width: 768px) {
  .conta-grid {
    gap: 0.75rem;
  }
  .conta-col-1, .conta-col-2, .conta-col-3, .conta-col-4, .conta-col-5, .conta-col-6,
  .conta-col-7, .conta-col-8, .conta-col-9, .conta-col-10, .conta-col-11, .conta-col-12 {
    grid-column: span 12 !important;
  }
}