:root {
	--font-family: 'Libre Franklin', 'Arial', sans-serif;
  ---animation-delay: .3s;
  &[data-theme="dark"]{
    --color-primary: #1F1F1F;
  }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font-family);
}

html {
	width: 100%;
	height: 100%;
	padding: 10px;
	scroll-behavior: smooth;
	background-color: var(--background-S360);
  transition: background-color var(---animation-delay);
  overflow-x: hidden;
}

body {
	overflow-x: hidden;
	height: 100%;

  /* Centrar visualmente la barra de scroll */
  &::-webkit-scrollbar {
    height: 8px; /* Altura de la barra de desplazamiento */
    width: 8px;
  }

  &::-webkit-scrollbar-track {
    background-color: var(--background-scroll);
    border-radius: 30px;
  }

  &::-webkit-scrollbar-thumb {
    background-color: #999;
    border-radius: 30px;
    cursor: pointer;
  }

  &::-webkit-scrollbar-thumb:hover {
    background: #818080; /* Color cuando se pasa el cursor */
  }

}

.DisplayNone{
  display: none !important;
}

.filterWithContent{
  background-color: #6c757d !important;
}

.filterContainer {
  & button:disabled {
    opacity: 0.3;
    cursor: not-allowed;

    & span {
      cursor: not-allowed !important;
    }
  }
}

.containerView{
  height: calc(93vh - 4px);
}

.tableST {
  &.swalOPC-content {
    max-width: 66% !important;
    overflow-x: hidden;
    #containerTableCalculos{
      width: 100%;
      overflow: auto;
      padding-right: 1px;
      &::-webkit-scrollbar-track
      {
          background-color: transparent;
      }

      &::-webkit-scrollbar
      {
          height: 6px;
          width: 8px;
      }

      &::-webkit-scrollbar-thumb
      {
          border-radius: 30px;
          background-color: #999;
          cursor: pointer;
      }
    }
  }
}


.basic-input--filled {
  #I_Fecha {
    cursor: pointer;
  }
  & label {
    cursor: pointer !important;
  }
}

.graphexpand {
  span {
    color: var(--color-text-S360);
  }
}

.basic-input--disabled .block-icon{
  display: none;
}


@media (max-height: 765px)  {
  .containerView{
    height: calc(93vh - 30px);
  }
}

@media (max-width: 1279px)  {
  .containerView{
    height: calc(93vh - 30px);
  }
}