/*STYLES FOR LOGIN (START)*/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
.auth-wrapper {
height: 100vh;
display: flex;
flex-wrap: wrap;
font-family: 'Open Sans', sans-serif;
}
.auth-side-img {
width: calc(100% - 400px);
}
.auth-bg-img {
background-size: cover;
background-attachment: fixed;
}
.auth-banner-sian {
position: absolute;
bottom: 15px;
left: 10px;
padding-left: 7rem;
padding-bottom: 7rem;
}
.auth-banner-sian .auth-text {
margin-top: 10px;
font-family: 'Open Sans', sans-serif;
}
.auth-side-form {
width: 400px;
background-color: #F6F6F6;
display: flex;
flex-direction: column;
flex-wrap: wrap;
}
.auth-form-header {
height: 35%;
width: 100%;
padding: 5px 20px 10px 20px;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
}
.auth-img-logo {
max-width: 200px;
max-height: 150px;
}
.auth-img-logo.svg {
height: 50px;
max-width: 200px;
max-height: 150px;
}
.auth-form-content {
height: 40%;
width: 100%;
padding: 20px 60px 0px 60px;
margin: 0px;
box-sizing: border-box;
}
.auth-user.form-control, .auth-password.form-control {
border-radius: 0px;
font-size: 15px;
padding: 20px 10px;
}
.auth-btn-login.btn-default {
display: inline-block;
font-weight: normal;
font-size: 11px;
line-height: 1.45;
text-align: center;
white-space: nowrap;
cursor: pointer;
user-select: none;
padding: 6px 10px;
margin-top: 15px;
margin-bottom: 0px;
border-radius: 0px;
color: #ffffff;
background-color: #FF6B00;
border: 1px solid transparent;
border-color: #FF6B00;
}
.auth-btn-login.btn-default:active, .auth-btn-login.btn-default:hover, .auth-btn-login.btn-default:active:hover, .auth-btn-login.btn-default:active:focus {
color: #ffffff;
background-color: #FF6B00;
border-color: #FF6B00;
opacity: 0.7;
}
.auth-wrapper-recover-account {
margin-top: 25px;
display: none;
}
.auth-wrapper-recover-account a {
color: #3DAE2B;
}
.auth-sian-banner-gris {
width: 130px;
}
.auth-form-footer {
width: 100%;
height: 25%;
padding: 20px 20px 10px 20px;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-end;
}
.auth-form-footer .auth-text {
font-family: 'Open Sans', sans-serif;
font-size: 15px;
margin: 10px 0px;
}
@media (max-width: 575.98px) {
.auth-side-img {
width: 0px;
display: none;
}
.auth-side-form {
width: 100%;
}
}
/*STYLES FOR LOGIN (END)*/
body.bg-banner-1 {
background-size:cover;
background-attachment:fixed;
}
/*STYLES FOR PAGE (START)*/
div#page {
margin-top: 65px;
padding: 0px;
}
/*STYLES FOR PAGE (END)*/
li.sian-navbar-first{
font-size: 16px;
}
li.sian-navbar-first > a{
color: #077FF7 !important;
}
li.sian-navbar-first:hover > a{
color: black !important;
}
a.no-border{
border: none;
}
div.us-detail > table td, div.us-detail > table th {
padding: 3px 0px !important;
text-align: left;
}
div.us-detail > table td:nth-child(2), div.us-detail > table th:nth-child(2){
padding: 3px 10px !important;
text-align: left;
}
h1.page-title{
padding-bottom: 12px;
}
.ct-form-control {
min-width: 100px;
}
.colorpicker-element:hover
{
cursor: pointer;
}
select[readonly]:hover
{
cursor: not-allowed;
}
div.us-select2-div
{
overflow: hidden;
}
div.us-select2-div span.us-span:hover
{
cursor: pointer;
animation-play-state: paused
}
div.us-select2-div span.us-span-readonly
{
background-color: rgb(238, 238, 238);
}
/* Make it move */
@keyframes marquee {
0% {
margin-left: 100%;
transform: translateX(0%);
}
100% {
margin-left: 0;
transform: translateX(-100%);
}
}
input.sian-force-tooltip:disabled {
pointer-events: auto;
}
input.sian-force-tooltip:-moz-read-only { /* For Firefox */
pointer-events: auto;
}
input.sian-force-tooltip:read-only {
pointer-events: auto;
}
.grid-view
{
padding-top: 10px;
}
.tableFixHead
{
overflow-y: auto;
height: 100px;
}
.tableFixHead thead th {
position: sticky;
top: 30px; /* Es el alto del navbar*/
background:#fff;
}
/*chat de soporte*/
.d-hotline {
background-color: #FF6B00 !important;
color: #ffff !important;
border-color: transparent #3DAE2B transparent transparent;
}
.icon-ic_chat_icon:before {
font-size: 50px;
}
.custom_fc_frame {
right: 50px !important;
bottom: 30px !important;
}
/* =====================================================================
Tipografia del sistema: Inter (SIAN-7697)
Es la familia de SIAN 2 (`font-sans` de su Tailwind). Se aplica a TODO el
ERP por decision expresa, no solo a la cabecera: la fuente se carga en
SIANAssets::registerCoreCss, que corre en cada pagina.
Ojo al revisar: cambiar la familia base mueve el ancho de todo el texto,
asi que las columnas de los grids, los botones y los formularios se ven
ligeramente distintos. Es esperado.
===================================================================== */
body,
button,
input,
select,
textarea,
.auth-wrapper,
.auth-banner-sian .auth-text {
font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* =====================================================================
View Transitions entre navegaciones
ACTIVACION. Esta regla es la que enciende las transiciones entre
documentos. Cuidado si se busca documentacion vieja: el
`` era la sintaxis
del origin trial de Chrome de 2023 y NO llego a la especificacion
final — no hace nada. La forma vigente es esta regla CSS
(View Transitions Level 2, Chrome 126+ / Safari 18.2+).
Tiene que estar presente en la pagina que se deja Y en la que se
entra. Como vive en styles.css, que carga en los tres layouts via
SIANAssets::registerCoreCss, eso se cumple solo.
En navegadores sin soporte la regla se ignora y la navegacion queda
exactamente como estaba.
===================================================================== */
@view-transition {
navigation: auto;
}
/* Fundido con una elevacion minima, no un desplazamiento completo.
Esto es una herramienta de trabajo donde se navega decenas de veces al
dia: un slide de pantalla completa es un patron de app movil, cansa a
la decima vez y en las pantallas con grids grandes el snapshot es caro
y se nota el tiron. 10px y 200ms alcanzan para borrar el corte blanco
sin pedir atencion.
mix-blend-mode: normal evita el aclarado (plus-lighter) que el
navegador aplica por defecto y que se ve sucio sobre fondos claros. */
::view-transition-old(root),
::view-transition-new(root) {
mix-blend-mode: normal;
animation-duration: 0.2s;
animation-timing-function: cubic-bezier(.4, 0, .2, 1);
}
::view-transition-old(root) {
animation-name: sian-vt-out;
}
::view-transition-new(root) {
animation-name: sian-vt-in;
}
@keyframes sian-vt-out {
to {
opacity: 0;
transform: translateY(-10px);
}
}
@keyframes sian-vt-in {
from {
opacity: 0;
transform: translateY(10px);
}
}
/* ---------------------------------------------------------------------
La barra superior queda fija.
Es chrome de la aplicacion, no contenido: verla desvanecerse en cada
clic delata la recarga. Con su propio nombre de transicion el
navegador la saca del snapshot de `root` y la trata como el mismo
elemento entre paginas, asi que se queda quieta mientras el contenido
cambia debajo — que es como se comporta una SPA.
--------------------------------------------------------------------- */
.navbar-fixed-top {
view-transition-name: sian-navbar;
}
::view-transition-old(sian-navbar),
::view-transition-new(sian-navbar) {
animation: none;
mix-blend-mode: normal;
}
/* ---------------------------------------------------------------------
Elemento compartido: la fila del grid se transforma en el titulo del
documento.
El nombre se lo pone sian-view-transitions.js a la fila que se
pulsa, justo antes de navegar (tiene que ser unico en la pagina, y un
grid tiene cientos de filas). El destino es el