@font-face{
    font-family: Roboto;
    src: url('../fonts/Roboto-Medium.ttf');
}

@font-face {
    font-family: Poppins;
    src: url('../fonts/Poppins-Regular.ttf');
  }
  
  @font-face {
      font-family: Open-Sans-Regular;
      src: url('../fonts/OpenSans-Regular.ttf');
    }

@font-face {
  font-family: Poppins-Bold;
  src: url('../fonts/Poppins-Bold.ttf');
}

*{
    font-family: Poppins, sans-serif;
}

body {
    font-family: Poppins, sans-serif !important;
    background-color: #FAFAFA;
    color: var(--tertiary) !important;
    margin: 0px;
}

.centered {
    position: fixed;
    top: 50%;
    left: 50%;
    /* bring your own prefixes */
    transform: translate(-50%, -50%);
}

textarea {
    resize: vertical;
}

textarea::placeholder{
    white-space: nowrap;
    overflow: hidden;
    text-overflow:ellipsis;
}

.disable-pointer-events {
    pointer-events: none;
}

.enable-pointer-events {
    pointer-events: auto;
}

.espaciado-paneles {
    margin-top: 10px;
}

/* Estilo de headers */
.header{
    padding: 10px 0px ;
}
.header-title{
    padding-bottom: 13px;
}

.espaciado-header-mobile{
    padding-bottom: 10px;
}

.iconoAyuda{
    
    padding-left: 10px;
    cursor: pointer
}

.espaciadoFiltroFechas{
    padding-bottom: 26px
}


/* Estilo de inputs para tablas */
.mat-table .mat-input-infix.mat-form-field-infix {
    border-top: 0.70em solid transparent;
}

.mat-table .mat-input-wrapper.mat-form-field-wrapper {
    padding-bottom: 15px;
}


/* Fix para posicion de select de material */
.full-width {
    width: 97%;
}

.width-100 {
    width: 100%;
}

/*This will work only for firefox*/
@-moz-document url-prefix() {
    .full-width-moz {
        width: 54% !important;
    }

    .textarea-one-line-moz {
        overflow-x: hidden!important;
    }

    input[type=number]:disabled {
        -moz-appearance:textfield;
    }
}

.mat-input-subscript-wrapper {
    margin-top: 0 !important;
}

.mat-input-container {
    margin-bottom: -2px !important;
}

.mat-select {
    margin-bottom: -4px !important;
    margin-top: -10px !important;
}

.mat-select-value {
    max-width: 100% !important;
}

.mat-option{
    line-height: 32px !important;
    height: 32px !important;
}

.mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) {
    background: rgba(0, 0, 0, 0.14)!important;
}

.mat-tooltip {
    font-size: var(--font-size-s) !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    background-color: rgba(97, 97, 97, 0.95) !important;
}

.mat-checkbox-ripple {
    left: -3px !important;
    top: -3px !important;
    height: 27px !important;
    width: 27px !important;
    border-radius: 100% !important;
}

.mat-radio-ripple {
    left: -3px !important;
    top: -3px !important;
    height: 27px !important;
    width: 27px !important;
    border-radius: 100% !important; 
}

/*MATERIAL DISABLED FIELDS*/
.mat-input-underline.mat-disabled {
    background-image: unset !important;
}

.mat-select-disabled .mat-select-underline {
    background-image: unset !important;
}

.mat-select-disabled .mat-select-value, .mat-select-arrow{
    color: var(--tertiary);
}

.mat-select-disabled .mat-select-arrow {
    display: none;
}

.mat-input-element:disabled {
    color: var(--tertiary);
}

/*MATERIAL UNDERLINE*/
.mat-input-underline {
    bottom: 1.49688em !important;
}

/*MATERIAL PLACEHOLDERS*/
.mat-form-field-can-float.mat-form-field-should-float .mat-input-placeholder {
    font-size: var(--font-size-l) !important;
    font-weight: bold;
}

/*MATERIAL DROPDOWN*/
.mat-select-trigger {
    font-size: var(--font-size-m) !important;
    margin-top: 10px !important;
    margin-bottom: 4px;
}

.mat-select-placeholder.mat-floating-placeholder {
    top: -14px !important;
    font-size: var(--font-size-l) !important;
    font-weight: bold;
}

.selectTenant .mat-select-value {
    color: white !important;
    position: relative;
    top: 6px;
}
.selectTenant .mat-form-field .mat-select-arrow-wrapper{
    color: white !important;
}

/*MATERIAL CALENDAR*/
.mat-calendar-body-cell, .mat-calendar-body, .mat-calendar-table, .mat-calendar-table-header, .mat-calendar-body-label {
    padding: 14px !important;
    border-style: none;
}

.mat-calendar-table-header-divider, thead.mat-calendar-table-header tr th {
    padding: 4px !important;
    border-style: none;
}

.mat-calendar-period-button .centered {
    font-family: Roboto,"Helvetica Neue",sans-serif;
}

.mat-datepicker-toggle{
    margin-right: 6px!important;
}

.mat-datepicker-toggle:focus {
    border-radius: 25%;
    outline: none;
    box-shadow: 0 0 6px #1976d2;
    -moz-box-shadow: 0 0 6px #1976d2;
    -webkit-box-shadow: 0 0 6px #1976d2;
    background-color: #e0e0e0;
    transition: box-shadow ease-in 0.1s;
}

:not(.mat-calendar-body-disabled):hover > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected),
.cdk-keyboard-focused .mat-calendar-body-active > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    background-color: rgba(51, 51, 51, 0.6)!important;
}

/*MATERIAL CARDs*/
.mat-card {
    padding: 0px 15px 10px 15px !important;
    box-shadow: 0 2px 1px -1px #0003, 0 1px 1px #00000024, 0 1px 3px #0000001f !important;
    border-radius: 0px !important;
}

.mat-card-title {
    margin-bottom: 0px !important;
    font-family: Poppins;
    letter-spacing: 0.5px;    
    color: var(--tertiary) !important;
    font-size: var(--font-size-m) !important;
    font-weight: 600;
}

.mat-card-header {
    align-content: center;
    padding: 5px;
    background: white;
    margin: 0 -15px;
    margin-bottom: 10px;
    position: relative;
}

.cardBorder{
    border-bottom-style: solid !important;
    border-bottom-width: 1px !important;
    border-bottom-color: #f3f3f3 !important;
}

.mat-card-content{
    margin-bottom: 0px !important;
}

/*CLASE PARA BOTON DE EXPANDIR EN ENCABEZADO*/
.card-expand-button .mat-button {
    line-height: 10px !important;
    position: absolute;
    right: 5px;
    margin-top:-3px!important;
}

/*VALIDADOR*/

.validation-error {
    font-size: var(--font-size-s);
    color: var(--danger);
    margin-top: -18px;
    margin-bottom: 3.5px;
}

.validation-error-dropdown {
    font-size: var(--font-size-s);
    color: var(--danger);
}

/*SPINNER*/
.spinner-input{
    position: absolute;
    right: 20px;
    top: 1px;
}
.spinner-input, .spinner-input svg {
    width: 15px !important;
    height: 15px !important;
}

.with-spinner{
    position: relative;
}


/* TABLES */
.mat-header-row, .mat-row {
    padding: 0 clamp(8px, 2%, 16px) !important;
    min-height: 45px !important;
}

.mat-header-cell {
    font-size: var(--font-size-m) !important;
    font-weight: 600 !important;    
    font-family: Poppins !important;
    padding: 0px;
}

.mat-cell{
    font-family: Poppins !important;
    font-size: var(--font-size-m)
}

mat-cell:last-child, mat-footer-cell:last-child, mat-header-cell:last-child {
    padding-right: 0!important;
}

mat-cell:first-child, mat-header-cell:first-child{
    padding-left: 0px !important;
}

.creation-row {
    background-color: #FAFAFA;
}

.margen-tabla{
    margin-right: 24px;
    margin-left: 24px;
}

.espaciado-final-tabla{
    padding-bottom: 70px !important;
}

.mat-paginator-page-size{
    align-items: center !important;
}

.mat-paginator {
    background: transparent !important;
  }
  
  .mat-paginator-container{
      flex-wrap: nowrap !important;
  }
  
  .paginator{
      background-color: white !important; 
  }

.mat-paginator-range-label{
    margin: 0px !important;
}

/*mat-expansion-panel*/
.mat-expansion-panel-content > .mat-expansion-panel-body {
    padding: 0px 0px 16px !important;
}

/* Otros */

.quitar-margenes {
    margin: 0;
}

iframe{
    width: 99%!important;
}

.clickable{
  cursor: pointer;
}

.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow:ellipsis;
}

.disabled-field {
    color:#909090;
    font-weight: 400;
    padding-bottom: 4px
}

.estiloFila{
  resize: none !important;
  overflow: hidden !important;
}

.mat-form-field-disabled .mat-form-field-underline {
    background-image: none !important;
}

.componentes-obligatorios {
    color: var(--danger);
}

/* Gestion de usuarios */
.permisosUsuario {
   margin-left: 22px;
   margin-right: 22px;
   margin-bottom: 40px;
}

.permisosUsuario-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
}

.permisosUsuario label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 8px;
}

.offset-col-sm-1 {
    padding-left: 30px;
}

.permisos-boton {
    right:18px;
    position: fixed;
    bottom: 10px;
}

.mat-radio-label-content {
    display: inline-block;
    order: 0;
    line-height: inherit;
    padding-left: 8px;
    padding-right: 15px !important;
}

.margen-top {
    margin-top: 30px;
}

.margin-top20{
    margin-top: 20px;
}

/* Gestion de tenants */

.centrar {
    text-align: center;
}

.gestionParamtenant input.mat-input-element {
    margin-top: 1.16em;
}

.mat-autocomplete-panel {
    min-width: 354px !important;
}

/*** Gestion Kitfe ***/
.margen-gk {
    margin-top: 10px;
    margin-left: 24px;
    margin-right: 24px;
}

.margin-top-gk {
    margin-top: 10px;
}

.padding-card-gk {
    padding: 20px;
}

.centrar-gk {
    margin: 0 auto;
}

.item-gk {
    width: 100%;
}

.gk-boton {
    right:18px;
    position: fixed;
    bottom: 10px;
}

.mat-button-toggle-checked{
  background-color: #CCCCCC !important;
}

/*** Padding Inputs  ***/
.mat-form-field-appearance-legacy .mat-form-field-wrapper {
    padding-bottom: 0.9em;
}

.mat-form-field-infix {
    display: block;
    position: relative;
    flex: auto;
    min-width: 0;
    width: 100% !important;
}

/*OtrosCampos*/
.cardInterior{
    border-radius: 0 !important;
    padding: 0px !important;

}
.input-nombre-otro-campo{
    border-top-style: none;
    border-right-style: none;
    border-left-style: none;
}

.mat-simple-snackbar-action {
    color: #FFF !important;
}

/* Subir Productos / Servicios desde Excel */
.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
   font-size: 1.25em;
   font-weight: 700;
   color: #FFF;
   display: inline-block;
   cursor: pointer;
}

.inputfile:focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

.inputfile + label * {
    pointer-events: none;
}

.chooser-btn-position {
    position: fixed;
    right: 0;
    bottom: 24px;
    z-index: 2000;
    margin-right: 80px;
}

/* CSS nueva iconos */

.mat-mini-fab .mat-button-wrapper {
    padding: 0px !important;
    display: inline-block;
    line-height: 25px !important;
}

.mat-fab .mat-button-wrapper {
    padding: 0px !important;
}

.iconosMenu {
    margin-right: 10px;
    opacity: 0.6;
    width: 20px;
}

.iconosTablas {
    opacity: 0.65 !important;
}

.iconos-opacidad{
    opacity: 0.54;
}

.iconos-XS{
  font-size: var(--size-icon-xs);
}

.iconos-S{
  font-size: var(--size-icon-s);
} 

.iconos-M {
  font-size: var(--size-icon-m);
}

.iconos-L{
  font-size: var(--size-icon-l);
}

.iconosAzul:hover {
    color: var(--info);
    opacity: 1;
}

.iconosRojo:hover {
    color: var(--danger);
    opacity: 1;
}

.iconosVerde:hover {
    color: var(--success);
    opacity: 1;
}


.listadoTenantIcon {
    color: #FFF; 
    margin-right: 10px !important;
}

.mat-row:hover {
    background: #d1d0d04d;
}

.fondoBlanco {
    background: #FFF;
    padding-top: 10px;
}

.dialogsIcons {
    margin-top: -7.5px !important;
}

.dialogsIconsVerticalAling > .svg-inline--fa.fa-lg{
    vertical-align: -0.1em !important;
}

.mat-dialog-container{
    border-radius: 4px !important;
}

.titulos{ 
  font-family: "Poppins", sans-serif;
  font-size: var(--font-size-m);
}

.mat-menu-item {
  font-family: "Poppins", sans-serif;
  font-size: var(--font-size-m);
  height: 40px !important;
  display: flex !important;
  align-items: center !important;
}

.mat-option{
  font-family: "Poppins", sans-serif;
  font-size: var(--font-size-m);
}

.mat-tab-label{
  font-family: 'Poppins-Bold', sans-serif;
  font-size: var(--font-size-m);
}

button{
  font-family: 'Poppins', sans-serif !important;
}

h1 {
    margin: 0px 0px 0px  0px;
    font-size: var(--font-size-xxl);
    color: var(--kitfe-secondary);
    font-weight: 500;
    font-family: 'Poppins' !important;
}

h2 {
  margin: 0px 0px 0px;
  color: var(--kitfe-secondary);
  font-size: var(--font-size-xl);
  font-family: 'Poppins', sans-serif !important;
  font-weight: 500;
  text-align: left;
}

h3{
    font-size: var(--font-size-l);
    font-family: Poppins, sans-serif !important;
    font-weight: 500;
    margin: 0px;
}

.botonDialog{
  padding-left: 25px !important;
  padding-right: 25px !important;
}

.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar{
  background: var(--kitfe-secondary);
  height: 3px;
} 

p{
  font-size: var(--font-size-m);
  font-family: 'Poppins', sans-serif !important;
  text-align: left;
}

.montoEmitidos{
  font-family: 'Poppins-Bold', sans-serif;
}

.colorAcciones{
  background-color: white !important;
}

.colorAccionesIcono{
  color: var(--tertiary);
}

.tooltip-rechazo {
  white-space: pre-line;
}

.mat-menu-content:not(:empty) {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.numeros-font {
    font-family: 'Open-Sans-Regular' !important;
}

.mat-icon-button:last-child{
    padding-right: 0px !important;
}

.dialogBlur {
    backdrop-filter: blur(5px);
}

.margen-responsive-tabla{
    margin-right: 10px;
    margin-left: 10px;
}

.espaciado-final-tabla{
    padding-bottom: 70px !important;
}

.mat-paginator-page-size{
    align-items: center !important;
}

.mat-paginator {
    background: transparent !important;
}

  .mat-paginator-container{
      flex-wrap: nowrap !important;
}

  .paginator{
      background-color: white !important; 
}

.mat-paginator-range-label{
    margin: 0px !important;
}

.mat-paginator-page-size-select {
    margin: 0 !important;
    width: 35px !important;
}

.mat-paginator .mat-select-value-text {
    font-size: var(--font-size-s) !important;
}

.blur-backgroungd{
    filter: blur(4px);
    pointer-events: none;
    user-select: none;
    transition: filter 0.3s ease-in-out;
}

.hide-recaptcha {
  visibility: hidden !important;
}