/* cw · 20261111g · Pie «Sistema creado por X-BUSINESS».
   El texto va DENTRO de la imagen. Versión horizontal en escritorio
   (260–280 px), compacta de dos líneas en celular. Clara u oscura
   según el tema (botón de luna o preferencia del aparato).
   Tras revisión de Danny: más chico (270 px escritorio, 190 px celular). */

.credito-xbiz {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 8px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: transparent;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
.credito-xbiz img {
  display: none;
  height: auto;
  width: 270px;
  max-width: min(280px, 92vw);
}
/* Predeterminado: fondo claro/beige, una línea. */
.credito-xbiz .credito-h-claro { display: block; }

:root[data-tema="oscuro"] .credito-xbiz .credito-h-claro { display: none; }
:root[data-tema="oscuro"] .credito-xbiz .credito-h-oscuro { display: block; }

@media (prefers-color-scheme: dark) {
  :root:not([data-tema]) .credito-xbiz .credito-h-claro { display: none; }
  :root:not([data-tema]) .credito-xbiz .credito-h-oscuro { display: block; }
}

/* Celular: versión compacta de dos líneas, 180–200 px. */
@media (max-width: 640px) {
  .credito-xbiz {
    padding-top: 6px;
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .credito-xbiz .credito-h-claro,
  .credito-xbiz .credito-h-oscuro { display: none !important; }
  .credito-xbiz img {
    width: 190px;
    max-width: min(200px, 88vw);
  }
  .credito-xbiz .credito-c-claro { display: block; }

  :root[data-tema="oscuro"] .credito-xbiz .credito-c-claro { display: none; }
  :root[data-tema="oscuro"] .credito-xbiz .credito-c-oscuro { display: block; }

  @media (prefers-color-scheme: dark) {
    :root:not([data-tema]) .credito-xbiz .credito-c-claro { display: none; }
    :root:not([data-tema]) .credito-xbiz .credito-c-oscuro { display: block; }
  }
}

/* Fondos oscuros propios, sin data-tema: login verde de Compras y
   login/bienvenida olivo de Nómina. */
html:has(> body > #login:not(.hide) > .lbox) .credito-xbiz .credito-h-claro,
html:has(> body > #login-screen:not([style*="display:none"])) .credito-xbiz .credito-h-claro,
html:has(> body > #welcome-screen:not([style*="display:none"])) .credito-xbiz .credito-h-claro {
  display: none;
}
html:has(> body > #login:not(.hide) > .lbox) .credito-xbiz .credito-h-oscuro,
html:has(> body > #login-screen:not([style*="display:none"])) .credito-xbiz .credito-h-oscuro,
html:has(> body > #welcome-screen:not([style*="display:none"])) .credito-xbiz .credito-h-oscuro {
  display: block;
}
@media (max-width: 640px) {
  html:has(> body > #login:not(.hide) > .lbox) .credito-xbiz .credito-c-claro,
  html:has(> body > #login-screen:not([style*="display:none"])) .credito-xbiz .credito-c-claro,
  html:has(> body > #welcome-screen:not([style*="display:none"])) .credito-xbiz .credito-c-claro {
    display: none !important;
  }
  html:has(> body > #login:not(.hide) > .lbox) .credito-xbiz .credito-c-oscuro,
  html:has(> body > #login-screen:not([style*="display:none"])) .credito-xbiz .credito-c-oscuro,
  html:has(> body > #welcome-screen:not([style*="display:none"])) .credito-xbiz .credito-c-oscuro {
    display: block !important;
  }
  html:has(> body > #login:not(.hide) > .lbox) .credito-xbiz .credito-h-oscuro,
  html:has(> body > #login-screen:not([style*="display:none"])) .credito-xbiz .credito-h-oscuro,
  html:has(> body > #welcome-screen:not([style*="display:none"])) .credito-xbiz .credito-h-oscuro {
    display: none !important;
  }
}

/* No va en reportes impresos ni PDF (son pantallas, no hojas). */
@media print {
  .credito-xbiz { display: none !important; }
}
body[class*="imprimiendo"] > .credito-xbiz,
html.en-marco .credito-xbiz,
body.dentro .credito-xbiz {
  display: none !important;
}

/* App principal (index.html): el pie queda mero abajo, centrado.
   Si el contenido es corto, se pega al borde inferior sin scroll de más.
   El login deja de medir 100vh para no empujar el pie fuera de la pantalla. */
body:has(> #barra):has(> #cuerpo) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body:has(> #barra):has(> #cuerpo) > #cuerpo {
  flex: 1 1 auto;
  min-height: 0;
}
body.sin-sesion:has(> #cuerpo) main#vista {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 0;
  max-width: none;
  margin: 0;
  width: 100%;
}
body.sin-sesion:has(> #cuerpo) #cuerpo {
  display: flex;
  flex-direction: column;
}
body.sin-sesion:has(> #cuerpo) .login-envoltura {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  height: auto;
}

/* Ventas, abierto solo (no dentro del marco de Menogranos). */
body:has(> #login):has(> #app):not(.dentro) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body:has(> #login):has(> #app):not(.dentro) > #login {
  flex: 1 1 auto;
  min-height: 0;
}
body:has(> #login):has(> #app):not(.dentro) > #app:not(.hide) {
  flex: 1 1 auto;
  min-height: 0;
}

/* Compras, abierto solo. */
body:has(> #login > .lbox) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body:has(> #login:not(.hide) > .lbox) > #login {
  flex: 1 1 auto;
  min-height: 0;
}
body:has(> #app:not(.hide) .shell) > #app {
  flex: 1 1 auto;
  min-height: 0;
}

/* Nómina, abierto solo. */
body:has(> #login-screen) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body:has(> #login-screen:not([style*="display:none"])) > #login-screen,
body:has(> #welcome-screen:not([style*="display:none"])) > #welcome-screen,
body:has(> #app-root:not([style*="display:none"])) > #app-root {
  flex: 1 1 auto;
  min-height: 0;
}

/* Link del chofer: el crédito va debajo del pie de contactos, a todo lo ancho. */
body:has(> #chofer) {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
body:has(> #chofer) > #chofer {
  flex: 1 1 auto;
}