/*////////////////////////////////////////////////////////////////////
  VARIABLES Y FUENTES
////////////////////////////////////////////////////////////////////*/

/* //variables de tipografía (si no existen, define estos custom props en tu :root global) */
:root{
  --font-size-theme: 16px;       /* //tamaño base de fuente */
  --font-family-theme: 'ubuntu', system-ui, sans-serif; /* //fuente base */
}

/* //font-face: asegúrate de que las rutas existen y están servidas con el mime correcto */
@font-face{
  font-family: "awesome";
  src: url("../fonts/fontawesome-webfont.ttf") format("truetype");
  font-display: swap;
}

@font-face{
  font-family: "ubuntu";
  src: url("../fonts/Ubuntu-Regular.ttf") format("truetype");
  font-display: swap;
}


/*////////////////////////////////////////////////////////////////////
  RESET + BASE
////////////////////////////////////////////////////////////////////*/

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: var(--font-size-theme); /* //antes: var(--font-theme) -> probable typo */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;                /* //nota: desactiva selección global (ver excepción abajo) */
  outline: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -o-user-select: none;
}

/* //permite seleccionar texto dentro de inputs/textarea (útil para UX) */
input, textarea{
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
  outline: none;
}

/* //tipografía base */
body{
  font-family: var(--font-family-theme);
  line-height: 1.5;
  color: #000;
  background: #fff;
}

/* //enlaces */
a{
  color: black;
  text-decoration: none;
}

/* //listas */
ul, ol{
  list-style: none;
  padding: 0;
  margin: 0;
}

li a{
  display: block;
  min-width: 14mm;
}

/* //iconos (usa la familia cargada arriba) */
.icon{
  font-family: "awesome", sans-serif; /* //antes: "Awesome" (insensible a may/min, pero unificamos) */
  width: min-content;
}

i{ pointer-events: none; }

/* //párrafos y body ya reseteados; aquí solo evitamos colisiones */
p{ margin: 0; }

/* //cabeceras */
h1, h2, h3, h4, h5, h6{
  font-feature-settings: "lnum";
  font-variant-numeric: lining-nums;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

h1{ font-size: 32px; }
h2{ font-size: 28px; }
h3{ font-size: 24px; }
h4{ font-size: 20px; }
h5{ font-size: 16px; }

/* //sticky para cabeceras de tabla */
th{
  padding: 2px;
  top: 0;
  background: #f1f1f2;
}

/* //helpers */
.hb{ display: none; }

.disabled {
   display: none;
}

/*////////////////////////////////////////////////////////////////////
  ESTADOS DE INPUTS Y AUTOFILL
////////////////////////////////////////////////////////////////////*/

/* //corrige typo: usa las variables adecuadas para tamaño y familia */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus{
  border: none;
  font-size: var(--font-size-theme);
  font-family: var(--font-family-theme);
}

/* //focus estilo bootstrap-like */
textarea:focus, input:focus{
  color: #212529;
  background-color: #fff;
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(13,110,253,.25);
}

/* //números alineados a la derecha y sin spinners en webkit */
input[type=number]{ text-align: end; }
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}


/*////////////////////////////////////////////////////////////////////
  IMÁGENES DE ESTADO (SPRITES COMO BACKGROUND)
////////////////////////////////////////////////////////////////////*/

[class*="img-"]{
  width: 20px;
  height: 20px;
  display: inline-block;
  background-size: cover;
  background-position: center;
}

.img-invoiced-pending{ background-image: url(../icons/nota-pendientex.png); }
.img-invoiced{          background-image: url(../icons/nota-facturadax.png); }
.img-payment-charged{   background-image: url(../icons/estado-cobradox.png); }
.img-payment-pending{   background-image: url(../icons/estado-pendientex.png); } /* //duplicado eliminado */
.img-payment-partial{   background-image: url(../icons/estado-parcialx.png); }


/*////////////////////////////////////////////////////////////////////
  DATATABLES / TABLAS
////////////////////////////////////////////////////////////////////*/

table.dataTable.nowrap th,
table.dataTable.nowrap td{
  white-space: inherit; /* //permite romper nowrap heredado */
}

.responsible > span.badge.badge-success{ margin: 1px; }

table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover{
  background-color: #0b341530; /* //verde muy suave al hover */
}

tbody td[class*="tot"]{
  text-align: end;
}

[class^='table-']{
  background: #ffffff8f;
  height: 100%;
}

.dataTables_wrapper .dataTables_length select{ width: 80px; }

[class*="paginate_"]{
  display: inline-block;
  padding: 2px;
}

ul.pagination{ margin-bottom: 4em; }

tr.group > td:hover{ background: white; }

[id*="_length"] *{ display: inline-block; }
[id*="_filter"] *{ display: inline-block; }

[id*="_filter"] label input{ width: 13em; }

tbody{ background: #f9f9f9; }


/*////////////////////////////////////////////////////////////////////
  MÓDULO TIEMPOS
////////////////////////////////////////////////////////////////////*/

td.scale-time > button{
  border-radius: 0;
  border: 1px solid gray;
  box-shadow: 1px 2px 3px gray;
}

td.scale-time > *{
  width: 4mm;
  padding: 0;
  font-size: 10px;
}

.scale-time h4{
  width: 100%;
  color: gray;
}

td.actions-time{ text-align: end; }
td.actions-time:hover{ background-color: white; }

input.my-time-result.form-control,
input.my-time-result-group.form-control{
  float: right;
  background: none;
  padding: 0;
  margin: 6px;
  border: none;
  text-align: start;
  padding-left: 0;
  font-weight: 500;
  color: gray;
  width: 2em;
}

td.total_group{ display: none; }


/*////////////////////////////////////////////////////////////////////
  VALIDACIONES
////////////////////////////////////////////////////////////////////*/

.invalid-email{
  border: 1px solid red !important;
  color: red !important;
}


/*////////////////////////////////////////////////////////////////////
  SPINNER / LOADING
////////////////////////////////////////////////////////////////////*/

.spinner-border.loading{
  display: none;
  position: fixed;
  z-index: 1000;
  top: calc(50% - 1em);
  left: calc(50% - 1em);
  color: #0a58ca;
  font-size: 24px;
  width: 2em;
  height: 2em;
}

.spinner-block{
  position: fixed;
  z-index: 10000;
  inset: 0;                 /* //equivale a top/left/right/bottom:0 */
  display: flex;
  width: 100%;
  height: 100%;
  background: transparent;  /* //por si necesitas bloquear clics, puedes usar rgba */
}


/*////////////////////////////////////////////////////////////////////
  PRINT
////////////////////////////////////////////////////////////////////*/

@media print{
  #table-times{
    background: red;  /* //debug visual (quitar en producción) */
    color: green;     /* //debug visual (quitar en producción) */
  }
}

/* ================== FIN ================== */