/*CUSTOM CSS*/
:root {
  --custom-blue: #00cfe8;
  --custom-indigo: #6610f2;
  --custom-purple: #7367f0;
  --custom-pink: #ec86b5;
  --custom-red: #ea5455;
  --custom-orange: #ff9f43;
  --custom-yellow: #ffc107;
  --custom-green: #28c76f;
  --custom-teal: #57cda9;
  --custom-cyan: #17a2b8;
  --custom-white: #fff;
  --custom-gray: #dedede;
  --custom-gray-dark: #1e1e1e;
  --custom-primary: #7367f0;
  --custom-secondary: #82868b;
  --custom-success: #a7ffa7;
  --custom-info: #6ed7e2;
  --custom-warning: #febb7c;
  --custom-danger: #f0b0b0;
  --custom-light: #f6f6f6;
  --custom-dark: #4b4b4b;
  --custom-line-height: 1.5;
  --custom-nutraline-color: #573074;
}

html,
body {
  height: 100%;
  font-size: 0.938rem !important;
}

body {
  background-color: #f9f9f9 !important;
  color: #192435 !important;
  overflow-x: hidden !important;
}

[data-theme="light"] {
  --primary-color: #ffffff;
  --secondary-color: #ffffff;
  --accent-color: #ffc107;
  --opacity-color-1: rgba(255, 226, 96, 0.43);
  --opacity-color-2: rgba(255, 226, 96, 0.15);
  --primary-text-color: #192435;
}
[data-theme="dark"] {
  --primary-color: #192435;
  --secondary-color: #ffffff;
  --accent-color: #ffc107;
  --opacity-color-1: rgba(255, 255, 255, 0.43);
  --opacity-color-2: rgba(255, 255, 255, 0.15);
  --primary-text-color: #ffffff;
}

.custom-radio {
  width: 50%;
}

.table thead th {
  border-top: 2px solid rgba(255, 226, 96, 0.15) !important;
  border-bottom: 2px solid rgba(255, 226, 96, 0.15) !important;
}

.table thead th {
  color: #ffc107 !important;
  background-color: rgba(255, 226, 96, 0.15) !important;
  text-transform: uppercase !important;
}

.table td:not(:first-child),
.table th:not(:first-child) {
  text-align: center !important;
}

.table .thead-light [data-sort]::after {
  color: #ffc107;
  content: url("data:image/svg+xml;utf8,<svg width='6' height='10' viewBox='0 0 6 10' fill='%23ffc107' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M3 0L6 4H0L3 0ZM3 10L0 6H6L3 10Z'/></svg>") !important;
}

.btn-primary,
.ngx-pagination .current,
.swal2-styled.swal2-confirm {
  background-color: #3071a9 !important;
  border-color: #3071a9 !important;
}


.theme-blue .bs-datepicker-head,
.theme-blue .bs-datepicker-body table td span.selected,
.theme-blue .bs-datepicker-body table td.selected span,
.theme-blue .bs-datepicker-body table td span[class*="select-"]:after,
.theme-blue .bs-datepicker-body table td[class*="select-"] span:after {
  background-color: #3071a9 !important;
}
.theme-blue .bs-datepicker-body table td.week span {
  color: #3071a9 !important;
}

.overlay-shown {
  z-index: 3000 !important;
}

.custom-bg-cyan {
  background-color: var(--custom-teal);
}
.custom-bg-pink {
  background-color: var(--custom-pink);
}
.custom-bg-light {
  background-color: var(--custom-light) !important;
}
.custom-bg-primary {
  background-color: var(--custom-primary);
}
.custom-bg-secondary {
  background-color: var(--custom-secondary);
}
.custom-bg-success {
  background-color: var(--custom-success);
  color: #4c4c4c;
}
.custom-bg-disabled {
  background-color: var(--custom-gray);
  color: #4c4c4c;
}
.custom-bg-info {
  background-color: var(--custom-info);
}
.custom-bg-warning {
  background-color: var(--custom-warning);
}
.custom-bg-danger {
  background-color: var(--custom-danger);
}
.custom-bg-purple {
  background-color: var(--custom-purple);
  color: #fff;
}
.custom-bg-arpis {
  background-color: rgb(4, 6, 6) !important;
  color: rgb(255, 255, 255) !important;
}

.custom-checkbox-label {
  font-size: 0.875rem;
}



/*CUSTOM SELECT COLOR*/
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  border-color: #6ffb6f !important;
  background-color: #00f700;
}

/*CUSTOM INPUT*/
input[readonly] {
  pointer-events: none;
  cursor: pointer;
}



/*CUSTOM TEXT*/

.custom-text-message {
  font-size: 1rem;
  font-weight: 300;
  line-height: 1.7;
}

.card-header,
.card-footer {
  background-color: #fff !important;
}



/*Truncate styles*/
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.truncate.truncate-20 {
  max-width: 20ch;
}

.truncate.truncate-30 {
  max-width: 30ch;
}

.truncate.truncate-40 {
  max-width: 40ch;
}
@media (max-width: 500px) {
  .truncate.truncate-20,
  .truncate.truncate-30,
  .truncate.truncate-40 {
    max-width: 50vw;
  }
}

/*Switch styles*/
/* The switch - the box around the slider */
.switch {
  position: relative;
  display: block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider {
  background-color: #00f700;
}

input:focus + .slider {
  box-shadow: 0 0 1px #00f700;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}






/*RESPONSIVE TABLE*/
@media (max-width: 500px) {
  .table thead {
    display: none;
  }

  .table,
  .table tbody,
  .table tr,
  .table td {
    display: block;
    width: 100%;
  }
  .table tr {
    margin-bottom: 15px;
  }
  .table td {
    text-align: right;
    position: relative;
    display: flex;
    padding-right: 1rem;
    align-items: center;
    justify-content: space-between;
  }
  .table td::before {
    content: attr(data-label);
    position: relative;
    left: 0;
    width: 50%;
    font-size: 15px;
    font-weight: bold;
    text-align: left;
  }
  .table caption {
    display: block;
  }
}

/*SLIDER*/
/*Switch styles*/
/* The switch - the box around the slider */
.switch {
  position: relative;
  display: block;
  width: 48px; /*doble de height - 8*/
  height: 28px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--opacity-color-1);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: var(--accent-color);
  -webkit-transition: 0.4s;
  transition: 0.4s;
}

input:checked + .slider {
  background-color: var(--opacity-color-1);
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--accent-color);
}

input:checked + .slider:before {
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 28px;
}

.slider.round:before {
  border-radius: 50%;
}

@media (min-width: 1024px) {
  section {
    max-width: 1440px !important;
    margin: 0 auto;
  }
}

.card {
  border: 1px solid rgba(216, 216, 216, 0.6) !important;
  box-shadow: 0 0 1rem 0 rgba(25, 36, 53, 0.04) !important;
}

hr {
  width: 100%;
}




/*SCROLLBAR*/
/* width */
*::-webkit-scrollbar {
  width: 10px;
}

/* Track */
*::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
*::-webkit-scrollbar-thumb {
  background: rgba(255, 226, 96, 0.43);
}

/* Handle on hover */
*::-webkit-scrollbar-thumb:hover {
  background: var(--accent-color);
}
