/*
 * truckflow-modern-clean.css
 * Unified modern theme for legacy truckFLOW (AngularJS + Bootstrap 3).
 *
 * Generated from the user's current stylesheet.
 * Exact duplicate selector blocks were consolidated.
 * Later declarations were kept as the canonical values.
 *
 * Load AFTER bootstrap.css, bootstrap-theme.css and the legacy truckflow.css.
 */

/* =========================================================
   VARIABLES
   ========================================================= */

:root {
  --tf-primary: #E52343;
  --tf-primary-hover: #CB1835;
  --tf-primary-soft: rgba(229, 35, 67, .09);
  --tf-bg: #EEF3F7;
  --tf-surface: #FFFFFF;
  --tf-surface-alt: #F5F8FB;
  --tf-surface-hover: #EAF1F6;
  --tf-text: #233547;
  --tf-text-secondary: #607487;
  --tf-text-muted: #91A2B3;
  --tf-border: #DCE5EC;
  --tf-border-strong: #CBD7E1;
  --tf-success: #21845A;
  --tf-warning: #B7791F;
  --tf-danger: #C93A46;
  --tf-info: #3A6F9D;
  --tf-radius-xs: 6px;
  --tf-radius-sm: 8px;
  --tf-radius-md: 11px;
  --tf-radius-lg: 15px;
  --tf-shadow-xs: 0 1px 2px rgba(38, 59, 77, .04);
  --tf-shadow-sm: 0 4px 14px rgba(38, 59, 77, .07);
  --tf-shadow-md: 0 14px 36px rgba(38, 59, 77, .11);
  --tf-navbar: #30485D;
  --tf-navbar-hover: #3A566E;
  --tf-navbar-text: #F7FAFC;
}


/* =========================================================
   BASE
   ========================================================= */

html,
body {
  min-height: 100%;
}

body,
.bodyFondo {
  background: var(--tf-bg) !important;
  color: var(--tf-text);
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.container-fluid {
  padding-left: 20px;
  padding-right: 20px;
}

.pointer,
[ng-click],
[data-toggle] {
  cursor: pointer;
}

.form-group {
  font-size: 12px;
}

.help-block,
.msgValid {
  margin-top: 5px;
  margin-bottom: 0;
  font-size: 11px;
}

.msgValid,
.has-error .help-block {
  color: var(--tf-danger) !important;
}

.switch {
  border-radius: 999px;
}

html,
body,
.bodyFondo {
  background: linear-gradient(180deg, #F3F6F9 0%, var(--tf-bg) 100%) !important;
  color: var(--tf-text) !important;
}

body {
  scrollbar-color: #AABBC9 #EEF3F7;
}

::selection {
  color: #fff;
  background: rgba(229, 35, 67, .82);
}

a {
  transition: color .15s ease, background-color .15s ease, border-color .15s ease;
  color: #3D6F98;
}

a:hover,
a:focus {
  color: #294F70;
}


/* =========================================================
   TITLES
   ========================================================= */

h4 {
  margin: 12px 0 20px;
}

h4:after {
  display: none !important;
}

.titleTabs {
  color: var(--tf-text) !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600;
}

.title {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  margin: 0;
  color: #263A4D !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-size: 21px !important;
  font-weight: 650 !important;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

.title:before {
  content: "";
  width: 4px;
  height: 22px;
  margin-right: 10px;
  border-radius: 3px;
  background: linear-gradient(180deg, #EF3654 0%, #D91D3C 100%) !important;
  box-shadow: 0 2px 6px rgba(229, 35, 67, .22);
}


/* =========================================================
   NAVBAR
   ========================================================= */

.navbar-inverse .container-fluid {
  padding-left: 0;
  padding-right: 0;
}

.navbar-header {
  min-height: 58px;
  display: flex;
  align-items: center;
}

.navbar-brand {
  height: 58px !important;
  padding: 11px 15px !important;
  display: flex !important;
  align-items: center;
  font-size: 15px !important;
}

.navbar-brand img {
  max-height: 36px;
  width: auto;
}

.navbar-nav>li.active,
.navbar-nav>li.active>a:focus,
.navbar-nav>.open>a {
  border-bottom: 0 !important;
}

.navbar-text {
  margin-top: 19px !important;
  margin-bottom: 19px !important;
  color: rgba(248, 250, 252, .88) !important;
}

.navbar-right>a.navbar-text {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 58px;
  padding: 0 8px;
  text-decoration: none;
}

.navbar-right .glyphicon,
.navbar-right .fas,
.navbar-right .far {
  font-size: 14px;
}

.navbar-right .cerrarSesion {
  color: rgba(255, 255, 255, .78);
}

.navbar-right .cerrarSesion:hover {
  color: #fff;
}

.dropdown-menu {
  padding: 7px;
  border: 1px solid var(--tf-border);
  border-radius: var(--tf-radius-md);
  background: var(--tf-surface);
  box-shadow: var(--tf-shadow-md);
}

.dropdown-menu>li>a {
  padding: 8px 11px;
  border-radius: 6px;
  color: var(--tf-text);
  font-size: 12px;
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
  color: var(--tf-text);
  background: var(--tf-surface-hover);
}

.navbar-inverse {
  min-height: 58px;
  margin-bottom: 0 !important;
  padding: 0 16px !important;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #2B4155 0%, #354F66 55%, #3A566E 100%) !important;
  box-shadow: 0 5px 18px rgba(35, 53, 71, .14) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
}

.navbar-nav>li>a {
  min-height: 58px;
  padding: 19px 14px !important;
  color: rgba(247, 250, 252, .80) !important;
  font-size: 12px !important;
  font-weight: 500;
  border: 0 !important;
  background: transparent !important;
}

.navbar-nav>li>a:hover,
.navbar-nav>li>a:focus,
.navbar-nav>.active>a,
.navbar-nav>.active>a:hover,
.navbar-nav>.active>a:focus,
.navbar-nav>.open>a,
.navbar-nav>.open>a:hover,
.navbar-nav>.open>a:focus {
  color: #fff !important;
  background: rgba(255, 255, 255, .075) !important;
  box-shadow: inset 0 -3px 0 var(--tf-primary) !important;
}

.navbar-text,
.navbar-right .cerrarSesion {
  color: rgba(247, 250, 252, .84) !important;
}

.dropdown-menu,
.popover,
.ui-select-choices,
.angucomplete-dropdown {
  border-color: #D6E1E9 !important;
  box-shadow: 0 12px 30px rgba(38, 59, 77, .13) !important;
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus,
.ui-select-choices-row:hover,
.angucomplete-row:hover {
  background: #EDF3F7 !important;
  color: #2E475C !important;
}

.navbar-inverse .navbar-header>a.navbar-brand~a.navbar-brand {
  display: none !important;
}


/* =========================================================
   FORMS
   ========================================================= */

label,
.label,
.form-group {
  color: var(--tf-text-secondary) !important;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

label,
.label {
  margin-bottom: 6px;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
}

textarea.form-control {
  height: auto !important;
  min-height: 90px;
  resize: vertical;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  color: #00233c !important;
  background: #F2F4F7 !important;
  border-color: var(--tf-border) !important;
  cursor: not-allowed;
}

.input-sm,
.form-control.input-sm {
  height: 36px !important;
  padding: 7px 10px !important;
  font-size: 12px !important;
  border-radius: var(--tf-radius-sm) !important;
}

.has-error .form-control:focus {
  box-shadow: 0 0 0 3px rgba(198, 40, 40, .10) !important;
}

.asterisco,
.required label:after {
  color: var(--tf-primary);
}

.border-lable-flt,
.border-lable-flt-angucomplete,
.border-lable-flt-select {
  color: var(--tf-text-secondary) !important;
  font-weight: 600 !important;
}

.border-lable-flt label,
.border-lable-flt>span,
.border-lable-flt-angucomplete label,
.border-lable-flt-angucomplete>span,
.border-lable-flt-select label,
.border-lable-flt-select>span {
  top: -0.65em !important;
  left: 10px !important;
  padding: 0 4px !important;
  color: var(--tf-text-secondary) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  background: var(--tf-surface);
  z-index: 4;
}

.border-lable-flt label::after,
.border-lable-flt>span::after,
.border-lable-flt-angucomplete label::after,
.border-lable-flt-angucomplete>span::after,
.border-lable-flt-select label::after,
.border-lable-flt-select>span::after {
  display: none !important;
}

.ui-select-bootstrap>.ui-select-match {
  outline: 0;
}

.ui-select-bootstrap .ui-select-toggle {
  padding-right: 30px !important;
}

.ui-select-bootstrap .ui-select-choices-row>span {
  padding: 8px 12px;
  font-size: 12px;
}

.ui-select-bootstrap .ui-select-choices-row.active>span,
.ui-select-bootstrap .ui-select-choices-row:hover>span {
  color: var(--tf-text);
  background: var(--tf-surface-hover);
}

.ui-select-bootstrap .ui-select-choices {
  margin-top: 5px;
  padding: 6px;
  border: 1px solid var(--tf-border);
  border-radius: var(--tf-radius-md);
  box-shadow: var(--tf-shadow-md);
}

.ui-select-highlight,
.highlight {
  color: var(--tf-primary) !important;
  font-weight: 700 !important;
}

.angucomplete-dropdown {
  margin-top: 5px;
  padding: 6px;
  border: 1px solid var(--tf-border) !important;
  border-radius: var(--tf-radius-md) !important;
  background: var(--tf-surface) !important;
  box-shadow: var(--tf-shadow-md);
}

.angucomplete-row {
  padding: 8px 10px !important;
  border-radius: 6px;
}

.angucomplete-selected-row {
  color: var(--tf-text) !important;
  background: var(--tf-surface-hover) !important;
}

.angucomplete-description {
  color: var(--tf-text-secondary);
  font-size: 11px !important;
}

.numerico,
.numericoLabel {
  color: var(--tf-info) !important;
}

fieldset.scheduler-border {
  padding: 16px !important;
  border: 1px solid var(--tf-border) !important;
  border-radius: var(--tf-radius-md);
}

legend.scheduler-border {
  padding: 0 7px;
  color: var(--tf-text-secondary) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.form-control,
.ui-select-bootstrap .ui-select-toggle,
.angucomplete-holder input,
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="date"],
select,
textarea {
  color: var(--tf-text) !important;
  background: #F8FAFC !important;
  border-color: var(--tf-border) !important;
}

.form-control:hover,
.ui-select-bootstrap .ui-select-toggle:hover,
.angucomplete-holder input:hover,
input:hover,
select:hover,
textarea:hover {
  border-color: #B9C9D6 !important;
}

.form-control:focus,
.ui-select-bootstrap.open .ui-select-toggle,
.angucomplete-holder input:focus,
input:focus,
select:focus,
textarea:focus {
  background: #FFFFFF !important;
  border-color: #7898B2 !important;
  box-shadow: 0 0 0 3px rgba(69, 111, 145, .11) !important;
}

.has-error .form-control,
.has-error input,
.has-error select,
.has-error textarea {
  border-color: #D76570 !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.form-control,
.ui-select-bootstrap>.ui-select-match>.btn {
  height: 38px !important;
  padding: 8px 11px !important;
  color: var(--tf-text) !important;
  font-size: 13px !important;
  line-height: 20px !important;
  background: var(--tf-surface) !important;
  border: 1px solid var(--tf-border-strong) !important;
  border-radius: var(--tf-radius-sm) !important;
  box-shadow: var(--tf-shadow-xs) !important;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.form-control:hover,
.ui-select-bootstrap>.ui-select-match>.btn:hover {
  border-color: #B9C0CC !important;
}

.form-control:focus,
.ui-select-bootstrap.open>.ui-select-match>.btn,
.ui-select-bootstrap>.ui-select-match>.btn:focus {
  border-color: var(--tf-primary) !important;
  box-shadow: 0 0 0 3px var(--tf-primary-soft) !important;
  outline: 0 !important;
}

.input-group-btn>.btn {
  height: 38px;
  border-color: var(--tf-border-strong);
}

.has-error .form-control,
.has-error .ui-select-bootstrap>.ui-select-match>.btn {
  border-color: var(--tf-danger) !important;
}

.btn:active {
  transform: translateY(1px);
}

.btn-sm {
  min-height: 32px;
  padding: 6px 11px;
  font-size: 11px;
}

.btn-xs {
  min-height: 27px;
  padding: 4px 8px;
  font-size: 10px;
}

.btn-default:hover,
.btn-outline-default:hover {
  color: var(--tf-text) !important;
  background: var(--tf-surface-hover) !important;
  border-color: #B9C0CC !important;
}

.btn-success,
.btn-outline-success {
  color: #fff !important;
  background: var(--tf-success) !important;
  border: 1px solid var(--tf-success) !important;
}

.btn-success:hover,
.btn-outline-success:hover {
  color: #fff !important;
  filter: brightness(.94);
}

.btn-danger,
.btn-outline-danger {
  color: #fff !important;
  background: var(--tf-danger) !important;
  border-color: var(--tf-danger) !important;
}

.btn[disabled],
.btn.disabled,
fieldset[disabled] .btn {
  opacity: .5;
  cursor: not-allowed;
}

.buttons,
.buttonEditar,
.buttonEliminarBlanco,
.antenita {
  transition: transform .12s ease, opacity .12s ease, color .12s ease;
}

.buttons:hover,
.buttonEditar:hover,
.buttonEliminarBlanco:hover,
.antenita:hover {
  transform: translateY(-1px);
  opacity: .85;
}

.btn {
  min-height: 34px;
  padding: 7px 13px;
  border-radius: var(--tf-radius-sm) !important;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  box-shadow: none !important;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .08s ease;
}

.btn-default,
.btn-outline-default {
  color: #52697D !important;
  background: #FFFFFF !important;
  border: 1px solid var(--tf-border-strong) !important;
  border-color: #C9D6E0 !important;
}

.btn-default:hover,
.btn-default:focus,
.btn-outline-default:hover,
.btn-outline-default:focus {
  color: #30485D !important;
  background: #EDF3F7 !important;
  border-color: #AEC0CE !important;
}

.btn-primary,
.btn-outline-info {
  color: #fff !important;
  background: linear-gradient(180deg, #EB3452 0%, #E52343 100%) !important;
  border: 1px solid var(--tf-primary) !important;
  border-color: #E52343 !important;
  box-shadow: 0 3px 10px rgba(229, 35, 67, .16) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-outline-info:hover,
.btn-outline-info:focus {
  color: #fff !important;
  background: linear-gradient(180deg, #D92543 0%, #C91B37 100%) !important;
  border-color: #C91B37 !important;
}


/* =========================================================
   TABLES
   ========================================================= */

.table-responsive {
  border: 0;
}

.table>tbody>tr:first-child>td {
  border-top: 0 !important;
}

.table>tfoot>tr>td,
.totalFoot {
  color: var(--tf-text) !important;
  font-weight: 700;
  background: var(--tf-surface-alt);
}

.ad-table-lite,
[ad-table-lite] {
  display: block;
  margin-top: 8px;
}

.table {
  margin-bottom: 18px;
  color: var(--tf-text);
  font-size: 12px;
  background: var(--tf-surface);
  border: 1px solid var(--tf-border);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--tf-radius-md);
  box-shadow: 0 2px 8px rgba(38, 59, 77, .045) !important;
  overflow: hidden;
  border-color: var(--tf-border) !important;
}

.table>thead>tr>th {
  padding: 10px 12px !important;
  color: #536A7D !important;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .035em;
  vertical-align: middle;
  background: linear-gradient(180deg, #F3F7FA 0%, #EDF3F7 100%) !important;
  border-bottom: 1px solid var(--tf-border) !important;
  border-bottom-color: #D8E3EB !important;
}

.table>tbody>tr>td,
.table>tfoot>tr>td {
  padding: 9px 12px !important;
  vertical-align: middle;
  border-top: 1px solid #EEF0F3 !important;
  border-top-color: #E9EFF4 !important;
}

.table-striped>tbody>tr:nth-of-type(odd) {
  background: #FAFCFD !important;
}

.table-hover>tbody>tr:hover,
.table>tbody>tr:hover {
  background: #EDF4F8 !important;
}


/* =========================================================
   PANELS
   ========================================================= */

.panel {
  margin-bottom: 18px;
  border: 1px solid var(--tf-border) !important;
  border-radius: var(--tf-radius-md);
  background: var(--tf-surface);
  box-shadow: var(--tf-shadow-xs);
  overflow: hidden;
}

.panel-title {
  color: var(--tf-text) !important;
  font-size: 13px;
  font-weight: 600;
}

.panel-body {
  padding: 16px;
}

.panel,
.well {
  border-color: var(--tf-border) !important;
  box-shadow: 0 3px 12px rgba(38, 59, 77, .045) !important;
}

.panel>.panel-heading {
  min-height: 42px;
  padding: 11px 14px !important;
  color: var(--tf-text) !important;
  text-align: left !important;
  background: #37566d !important;
  border: 0 !important;
  border-bottom: 1px solid var(--tf-border) !important;
  border-bottom-color: var(--tf-border) !important;
}

.well {
  min-height: 20px;
  margin-bottom: 18px;
  padding: 16px;
  background: #F5F8FB !important;
  border: 1px solid var(--tf-border);
  border-radius: var(--tf-radius-md);
  box-shadow: none;
}


/* =========================================================
   MODALS
   ========================================================= */

.modal {
  padding: 18px !important;
}

.modal:before {
  display: none !important;
}

.modal-dialog {
  display: block !important;
  margin: 30px auto !important;
  text-align: left;
  vertical-align: initial !important;
}

.login-main-modal .modal-content {
  overflow: hidden !important;
  border: none !important;
  border-radius: var(--tf-radius-lg);
  background: transparent !important;
  box-shadow: unset !important;
}

.login-main-modal .modal-open .modal {
  overflow-y: hidden;
}

.modal-title {
  margin: 0;
  color: var(--tf-text) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 22px;
}

.modal-header .close {
  position: absolute;
  top: 13px;
  right: 15px;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0;
  color: var(--tf-text-secondary) !important;
  font-size: 22px;
  font-weight: 400;
  line-height: 28px;
  text-align: center;
  text-shadow: none;
  opacity: 1;
  background: var(--tf-surface-alt) !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

.modal-header .close:hover {
  color: var(--tf-text) !important;
  background: #ECEEF2 !important;
}

.modal-body {
  padding: 20px !important;
  background: var(--tf-surface);
}

.modal-body form {
  margin: 0;
}

.modal-header {
  position: relative;
  min-height: 58px;
  padding: 18px 54px 16px 20px !important;
  color: var(--tf-text) !important;
  text-align: left !important;
  background: linear-gradient(180deg, #FFFFFF 0%, #F8FAFC 100%) !important;
  border-bottom: 1px solid var(--tf-border) !important;
  border-radius: 0 !important;
}

.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 20px !important;
  background: #F8FAFC !important;
  border-top: 1px solid var(--tf-border);
  border-top-color: var(--tf-border) !important;
}


/* =========================================================
   TABS
   ========================================================= */

.nav-pills {
  margin-bottom: 14px;
  padding: 4px;
  background: #EFF1F4 !important;
  border-radius: var(--tf-radius-md);
  font-size: 11px;
}

.nav-pills>li {
  background: transparent !important;
}

.nav-pills>li>a {
  margin: 0 2px;
  padding: 8px 12px;
  color: var(--tf-text-secondary) !important;
  font-size: 11px;
  font-weight: 600;
  text-transform: none;
  border-radius: var(--tf-radius-sm) !important;
}

.nav-pills>li>a:hover {
  color: var(--tf-text) !important;
  background: rgba(255, 255, 255, .65) !important;
}

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
  color: var(--tf-text) !important;
  background: var(--tf-surface) !important;
  border-bottom: 0 !important;
  box-shadow: var(--tf-shadow-sm);
}

.innerTab {
  padding: 14px 4px 4px;
}

.tab-container {
  padding: 16px;
  background: var(--tf-surface) !important;
  border-color: var(--tf-border) !important;
}

.nav-tabs {
  border-bottom: 1px solid var(--tf-border);
  border-bottom-color: #D7E2EA !important;
}

.nav-tabs>li>a {
  margin-right: 4px;
  padding: 9px 12px;
  color: #6A7D8E !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.nav-tabs>li>a:hover {
  color: #334E65 !important;
  background: #EDF3F7 !important;
  border-color: transparent !important;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
  color: #2C4357 !important;
  font-weight: 600;
  border-bottom-color: var(--tf-primary) !important;
  background: #FFFFFF !important;
  border-color: #D7E2EA #D7E2EA #FFFFFF !important;
  box-shadow: inset 0 3px 0 var(--tf-primary);
}


/* =========================================================
   PAGINATION
   ========================================================= */

.pagination {
  margin: 10px 0;
}

.pagination>li>a,
.pagination>li>span {
  min-width: 32px;
  margin: 0 2px;
  padding: 6px 9px;
  color: #486B87 !important;
  text-align: center;
  background: #FFFFFF !important;
  border: 1px solid var(--tf-border);
  border-radius: 6px !important;
  border-color: #D7E2EA !important;
}

.pagination>li>a:hover,
.pagination>li>span:hover {
  color: #2B4C67 !important;
  background: #EDF3F7 !important;
  border-color: var(--tf-border-strong);
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover {
  color: #fff !important;
  background: #456F91 !important;
  border-color: #456F91 !important;
}


/* =========================================================
   FEEDBACK
   ========================================================= */

.alert {
  border: 1px solid transparent;
  border-radius: var(--tf-radius-md);
  box-shadow: none;
}

.alert-warning {
  color: #7A4B00;
  background: #FFF7E6;
  border-color: #F5D79B;
}

.popover {
  border: 1px solid var(--tf-border);
  border-radius: var(--tf-radius-md);
  box-shadow: var(--tf-shadow-md);
}

.popover-title {
  padding: 10px 12px !important;
  color: var(--tf-text) !important;
  font-size: 11px !important;
  line-height: 16px !important;
  text-align: left !important;
  background: var(--tf-surface-alt) !important;
  border-bottom: 1px solid var(--tf-border) !important;
}

.popover-content {
  padding: 12px !important;
  color: var(--tf-text-secondary);
  font-size: 11px !important;
}

.alert-info {
  color: #345D7C !important;
  background: #EEF5FA !important;
  border-color: #CFE0EC !important;
}

.badge {
  padding: 3px 8px;
  font-size: 10px;
  border-radius: 999px;
  background: #5C7488 !important;
}


/* =========================================================
   SCROLLBAR
   ========================================================= */

::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

::-webkit-scrollbar-track {
  background: #EEF3F7;
  border-radius: 999px;
}

::-webkit-scrollbar-thumb {
  background: #B0C0CD;
  border: 2px solid #ECEEF1;
  border-radius: 999px;
  border-color: #EEF3F7;
}

::-webkit-scrollbar-thumb:hover {
  background: #91A6B6;
}


/* =========================================================
   LOGIN
   ========================================================= */

.login-error {
  min-height: 20px;
  margin-bottom: 8px;
}

.login-password-wrap {
  position: relative;
}

.login-input::placeholder {
  color: #98a2b3;
  font-weight: 400;
}

.login-input:hover {
  background: #fff;
  border-color: #c7ced7;
}

.login-input:focus {
  background: #fff;
  border-color: #e30524;
  box-shadow: 0 0 0 4px rgba(227, 5, 36, .075);
}

.login-password-icon {
  position: absolute;
  top: 50%;
  right: 16px;
  margin: 0;
  transform: translateY(-50%);
  color: #98a2b3;
  cursor: pointer;
}

.login-password-icon:hover {
  color: #344054;
}

.login-link {
  display: block;
  margin-top: 8px;
  color: #7a8493;
  font-size: 10.5px;
  font-weight: 500;
  text-align: right;
  text-decoration: none;
}

.login-link:hover,
.login-link:focus {
  color: #e30524;
  text-decoration: none;
}

.login-submit:hover,
.login-submit:focus {
  color: #fff;
  background: #c9001d;
  border-color: #c9001d;
  box-shadow: 0 12px 24px rgba(227, 5, 36, .21);
}

.login-submit:active {
  transform: translateY(1px);
}

.login-recovery-modal.in .modal-dialog {
  width: 620px !important;
  max-width: calc(100vw - 32px) !important;
  margin: 8vh auto !important;
}

.login-recovery-content {
  padding: 42px;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(16, 24, 40, .18) !important;
}

.login-recovery-header {
  margin-bottom: 28px;
  text-align: center;
}

.login-recovery-header i {
  margin-bottom: 12px;
  color: #e30524;
  font-size: 34px;
}

.login-recovery-header h3 {
  margin: 0 0 8px;
  color: #1f242b;
  font-size: 22px;
  font-weight: 700;
}

.login-recovery-header p {
  margin: 0;
  color: #667085;
  font-size: 12px;
}

.login-recovery-content form {
  padding: 0 !important;
}

.login-recovery-actions {
  margin-top: 26px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.login-form {
  padding: 0 !important;
  margin: 0;
  max-width: 100% !important;
}

.login-product-name {
  font-size: 35px !important;
  font-weight: 800 !important;
  line-height: 1;
  letter-spacing: -2px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 0 !important;
}

.login-product-truck {
  color: #ffffff !important;
}

.login-product-flow {
  margin-left: -1px !important;
  color: #d83b50 !important;
}

.login-product-subtitle {
  margin-top: 7px !important;
  color: rgba(255, 255, 255, .58) !important;
  font-size: 12px !important;
  font-weight: 500;
}

.login-field {
  margin-bottom: 22px !important;
}

.login-input {
  display: block;
  width: 100%;
  height: 54px !important;
  padding: 0 46px 0 16px;
  color: #20242a;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  font-weight: 500;
  background: #f7f8fa;
  border: 1px solid #dde2e8;
  border-radius: 12px !important;
  outline: none;
  box-shadow: none;
  transition: background-color .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
}

.login-page {
  min-height: calc(95vh - 75px);
  padding: 10px 16px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
}

.login-shell {
  width: min(1340px, 100%) !important;
  min-height: 570px !important;
  display: flex;
  overflow: hidden;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.login-brand {
  width: 45% !important;
  min-height: 570px !important;
  padding: 42px !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: none !important;
  border-top-left-radius: 22px !important;
  border-bottom-left-radius: 22px !important;
  background-image: url("../img/truckflow-fondo.png") !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  border-radius: 22px 0 0 22px !important;
  overflow: hidden !important;
}

.login-panel {
  width: 55% !important;
  min-height: 570px !important;
  padding: 58px 82px !important;
  display: flex;
  align-items: center;
  background: #FFFFFF !important;
  border-top-right-radius: 22px !important;
  border-bottom-right-radius: 22px !important;
  border-radius: 0 22px 22px 0 !important;
}

.login-panel-inner {
  width: 100%;
  max-width: 510px !important;
  margin: 0 auto;
}

.login-title {
  margin: 0 0 38px !important;
  color: #24384A !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.15;
  letter-spacing: -.035em !important;
  text-align: center !important;
  margin-bottom: 16px !important;
}

.login-input,
.login-form .form-control {
  color: #31475A !important;
  background: #F7F9FB !important;
  border-color: #D4DFE7 !important;
}

.login-input:focus,
.login-form .form-control:focus {
  background: #fff !important;
  border-color: #7898B2 !important;
  box-shadow: 0 0 0 3px rgba(69, 111, 145, .10) !important;
}

.login-submit {
  width: 100%;
  height: 52px;
  margin-top: 8px;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .3px;
  background: linear-gradient(180deg, #EB3452 0%, #E52343 100%) !important;
  border: 1px solid #e30524;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(227, 5, 36, .17);
  transition: background-color .15s ease,
    transform .1s ease,
    box-shadow .15s ease;
  border-color: #E52343 !important;
}

.login-submit:hover:not([disabled]) {
  background: linear-gradient(180deg, #D92543 0%, #C91B37 100%) !important;
}

.login-submit[disabled] {
  color: #A7B2BD !important;
  background: #E9EDF1 !important;
  border-color: #E9EDF1 !important;
  box-shadow: none;
  opacity: 1;
}

.login-footer {
  margin-top: 46px !important;
  color: #A5B2BE !important;
  font-size: 9px;
  font-weight: 600;
  text-align: center !important;
}

.login-product,
.login-product-name,
.login-product-truck,
.login-product-flow,
.login-product-subtitle {
  display: none !important;
}

.login-client {
  border-top: 1px solid rgba(255, 255, 255, .18) !important;
  margin-top: 140%;
  position: relative !important;
  z-index: 2 !important;
}

.login-client img {
    margin-top: 10px !important;
    display: block;
    max-width: 130px !important;
    max-height: 65px !important;
    width: auto !important;
    height: auto !important;
    margin-left: 5px !important;
     object-fit: contain !important;
}

.login-subtitle {
  color: #748799 !important;
  text-align: center;
  margin-bottom: 34px !important;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 991px) {
  .container-fluid {
    padding-left: 14px;
    padding-right: 14px;
  }

  .navbar-inverse {
    padding: 0 8px !important;
  }

  .navbar-nav>li>a {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .modal-dialog {
    width: auto;
    margin: 16px !important;
  }
}

@media (max-width: 900px) {
  .login-page {
    padding: 14px !important;
  }

  .login-title {
    font-size: 30px !important;
  }

  .login-shell {
    width: 100% !important;
    min-height: 550px !important;
  }

  .login-brand {
    width: 40% !important;
    padding: 34px !important;
    min-height: 550px !important;
  }

  .login-panel {
    width: 60% !important;
    padding: 50px 40px !important;
    min-height: 550px !important;
  }
}

@media (max-width: 767px) {
  .navbar-header {
    display: block;
  }

  .navbar-brand {
    display: inline-flex !important;
  }

  .navbar-nav>li>a {
    min-height: auto;
    padding: 11px 12px !important;
  }

  .navbar-right>a.navbar-text {
    min-height: auto;
    padding: 10px 12px;
  }

  .modal {
    padding: 0 !important;
  }

  .modal-dialog {
    margin: 10px !important;
  }

  .modal-body,
  .modal-header,
  .modal-footer {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .modal-footer {
    flex-wrap: wrap;
  }

  .modal-footer .btn {
    flex: 1 1 auto;
  }

  .title {
    font-size: 18px !important;
  }
}

@media (max-width: 720px) {
  .login-page {
    min-height: calc(100vh - 58px);
    padding: 8px !important;
  }

  .login-shell {
    min-height: calc(100vh - 74px) !important;
    border-radius: 18px !important;
  }

  .login-footer {
    margin-top: 38px !important;
  }

  .login-brand {
    display: none !important;
  }

  .login-panel {
    width: 100% !important;
    min-height: calc(100vh - 78px) !important;
    padding: 42px 24px !important;
    border-radius: 18px !important;
  }

  .login-title {
    font-size: 28px !important;
    margin-bottom: 30px !important;
  }
}

/* =========================================================
   TRUCKFLOW POLISH V6
   Targeted visual polish only:
   - navbar / submenus
   - admin tables
   - standard modals
   - loading spinner
   ========================================================= */

/* ---------------------------------------------------------
   NAVBAR
   Keep slate-blue base. No black active blocks.
   --------------------------------------------------------- */

.navbar-inverse {
  background: linear-gradient(90deg, #35536a 0%, #3d5d74 100%) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
  box-shadow: 0 2px 10px rgba(37, 58, 75, .10) !important;
}

.navbar-inverse .navbar-nav>li>a {
  color: rgba(255, 255, 255, .76) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transition: color .15s ease, background-color .15s ease !important;
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus,
.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:hover,
.navbar-inverse .navbar-nav>.open>a:focus {
  color: #fff !important;
  background: rgba(255, 255, 255, .07) !important;
  box-shadow: none !important;
}

/* Active menu = soft blue surface + thin red accent only */
.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:hover,
.navbar-inverse .navbar-nav>.active>a:focus {
  color: #fff !important;
  font-weight: 600 !important;
  background: rgba(255, 255, 255, .10) !important;
  box-shadow: inset 0 -2px 0 #e65a6e !important;
}

/* Kill the old legacy black state */
.navbar-nav li a:hover,
.navbar-nav>.active>a {
  background-image: none !important;
}

/* ---------------------------------------------------------
   DROPDOWNS / SUBMENUS
   --------------------------------------------------------- */

.navbar-inverse .dropdown-menu,
.dropdown-menu {
  min-width: 190px;
  padding: 6px !important;
  margin-top: 5px !important;

  background: #fff !important;

  border: 1px solid #dce5eb !important;
  border-radius: 10px !important;

  box-shadow: 0 12px 30px rgba(41, 64, 81, .14) !important;
}

.navbar-inverse .dropdown-menu>li>a,
.dropdown-menu>li>a {
  padding: 8px 10px !important;

  color: #607587 !important;
  font-size: 11px !important;
  font-weight: 500 !important;

  background: transparent !important;

  border: 0 !important;
  border-left: 3px solid transparent !important;
  border-radius: 7px !important;
}

.navbar-inverse .dropdown-menu>li>a:hover,
.navbar-inverse .dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
  color: #31495b !important;
  background: #eef4f7 !important;
  border-left-color: #7aa6b7 !important;
}

/* Active submenu: no black */
.navbar-inverse .dropdown-menu>.active>a,
.navbar-inverse .dropdown-menu>.active>a:hover,
.navbar-inverse .dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a,
.dropdown-menu>.active>a:hover,
.dropdown-menu>.active>a:focus {
  color: #2f4859 !important;
  font-weight: 600 !important;
  background: #e8f1f5 !important;
  border-left-color: #2f9aa4 !important;
}

/* ---------------------------------------------------------
   ADMIN TABLES
   Make them feel like a proper data grid.
   --------------------------------------------------------- */

ad-table-lite .table,
[ad-table-lite] .table,
.table.table-condensed,
.table.table-sm {
  background: #fff !important;
  border: 1px solid #d9e3e9 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Header */
ad-table-lite .table>thead>tr>th,
[ad-table-lite] .table>thead>tr>th,
.table.table-condensed>thead>tr>th,
.table.table-sm>thead>tr>th {
  padding: 11px 12px !important;

  color: white !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .025em !important;

  background: #38566d !important;

  border: 0 !important;
  border-bottom: 1px solid #d3e0e7 !important;
}

/* Filter/search row */
ad-table-lite .table>thead>tr+tr>th,
ad-table-lite .table>thead>tr+tr>td,
[ad-table-lite] .table>thead>tr+tr>th,
[ad-table-lite] .table>thead>tr+tr>td {
  padding: 8px 10px !important;

  background: #f7fafc !important;

  border-bottom: 1px solid #e1e9ee !important;
}

ad-table-lite .table thead .form-control,
[ad-table-lite] .table thead .form-control {
  height: 32px !important;

  padding: 5px 9px !important;

  font-size: 11px !important;

  background: #fff !important;

  border: 1px solid #d4dfe6 !important;
  border-radius: 7px !important;

  box-shadow: none !important;
}

ad-table-lite .table thead .form-control:focus,
[ad-table-lite] .table thead .form-control:focus {
  border-color: #86a9bc !important;
  box-shadow: 0 0 0 3px rgba(89, 137, 163, .10) !important;
}

/* Rows */
ad-table-lite .table>tbody>tr,
[ad-table-lite] .table>tbody>tr,
.table.table-condensed>tbody>tr,
.table.table-sm>tbody>tr {
  background: #fff !important;
}

ad-table-lite .table>tbody>tr>td,
[ad-table-lite] .table>tbody>tr>td,
.table.table-condensed>tbody>tr>td,
.table.table-sm>tbody>tr>td {
  padding: 9px 12px !important;

  color: #33495a !important;
  font-size: 10.5px !important;

  border-top: 1px solid #e9eff3 !important;
}

ad-table-lite .table>tbody>tr:hover,
[ad-table-lite] .table>tbody>tr:hover,
.table.table-condensed>tbody>tr:hover,
.table.table-sm>tbody>tr:hover {
  background: #f1f6f9 !important;
}

/* Table action icons */
ad-table-lite .glyphicon-edit,
ad-table-lite .fa-edit,
ad-table-lite .buttonEditar,
[ad-table-lite] .glyphicon-edit,
[ad-table-lite] .fa-edit,
[ad-table-lite] .buttonEditar {
  color: #188e99 !important;
}

ad-table-lite .glyphicon-trash,
ad-table-lite .fa-trash,
ad-table-lite .buttonEliminarBlanco,
[ad-table-lite] .glyphicon-trash,
[ad-table-lite] .fa-trash,
[ad-table-lite] .buttonEliminarBlanco {
  color: #c95a65 !important;
}

/* Pagination */
ad-table-lite .pagination>li>a,
ad-table-lite .pagination>li>span,
[ad-table-lite] .pagination>li>a,
[ad-table-lite] .pagination>li>span {
  color: #567084 !important;
  background: #fff !important;
  border-color: #d5e0e7 !important;
}

ad-table-lite .pagination>.active>a,
ad-table-lite .pagination>.active>span,
[ad-table-lite] .pagination>.active>a,
[ad-table-lite] .pagination>.active>span {
  color: #fff !important;
  background: #3d8f98 !important;
  border-color: #3d8f98 !important;
}

/* ---------------------------------------------------------
   STANDARD MODALS
   --------------------------------------------------------- */

.modal-backdrop.in {
  opacity: .44 !important;
  background: #223541 !important;
}

.modal-content {
  background: #fff !important;
  border: 1px solid #dbe4ea !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 68px rgba(32, 49, 62, .20) !important;
}

/* Softer blue-gray header */
.modal-header {
  min-height: 56px !important;
  padding: 16px 52px 14px 22px !important;

  background: #f1f6f9 !important;

  border-bottom: 1px solid #dce6ec !important;
}

.modal-title {
  color: #31495a !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* Cleaner close */
.modal-header .close {
  color: #61788a !important;
  background: #e6eff4 !important;
}

.modal-header .close:hover {
  color: #31495a !important;
  background: #d9e6ed !important;
}

.modal-body {
  background: #fff !important;
}

/* Tabs inside modal: neutral with teal accent */
.modal-body .nav-tabs>li>a {
  color: #6e8191 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
}

.modal-body .nav-tabs>li>a:hover {
  color: #31495a !important;
  background: #f5f8fa !important;
}

.modal-body .nav-tabs>li.active>a,
.modal-body .nav-tabs>li.active>a:hover,
.modal-body .nav-tabs>li.active>a:focus {
  color: #31495a !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 2px solid #3d98a1 !important;
  box-shadow: none !important;
}

/* Modal inner grouped area */
.modal-body .tab-container,
.modal-body fieldset.scheduler-border {
  background: #f8fbfc !important;
  border: 1px solid #dbe5eb !important;
  border-radius: 10px !important;
}

/* Modal footer */
.modal-footer {
  padding: 12px 22px !important;

  background: #f5f8fa !important;

  border-top: 1px solid #dce5eb !important;
}

/* Keep operation buttons familiar */
.modal-footer .btn-success,
.modal-footer .btn-outline-success {
  background: #25885d !important;
  border-color: #25885d !important;
}

.modal-footer .btn-default,
.modal-footer .btn-outline-default {
  color: #526c7e !important;
  background: #fff !important;
  border-color: #cbd9e2 !important;
}

/* ---------------------------------------------------------
   LOADING SPINNER
   Neutralize the old red dotted look.
   --------------------------------------------------------- */

.spinner>div,
.spinner-line,
.us-spinner {
  color: #6f97aa !important;
}

/* Common spinner SVG/canvas parents */
[us-spinner] {
  opacity: .72;
}

/* =========================================================
   LOGIN RECOVERY MODAL - SAFE FIX V3
   Keep Bootstrap's native modal stacking/z-index.
   Only style the recovery card itself.
   ========================================================= */

.login-recovery-modal .modal-dialog,
.login-recovery-modal.in .modal-dialog {
  width: 520px !important;
  max-width: calc(100vw - 32px) !important;
  margin: 22vh auto !important;
}

.login-recovery-modal .login-recovery-content,
.login-recovery-modal .modal-content {
  background: #ffffff !important;
  border: 1px solid #dce5eb !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 65px rgba(31, 49, 64, .20) !important;
  opacity: 1 !important;
}

.login-recovery-modal .login-recovery-header {
  margin-bottom: 24px !important;
  text-align: center !important;
  background: transparent !important;
  border: 0 !important;
}

.login-recovery-modal .login-recovery-header i {
  color: #d94a5f !important;
  font-size: 30px !important;
}

.login-recovery-modal .login-recovery-header h3 {
  color: #30485a !important;
}

.login-recovery-modal .login-recovery-header p {
  color: #748798 !important;
}

.login-recovery-modal .login-recovery-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  margin-top: 22px !important;
}

/* Important: do NOT override modal/backdrop z-index here. */

@media (max-width: 600px) {

  .login-recovery-modal .modal-dialog,
  .login-recovery-modal.in .modal-dialog {
    width: auto !important;
    margin: 20px 14px !important;
  }
}

/* =========================================================
   DATA GRID + MODAL POLISH V4
   Scoped changes only: admin grids + standard application modals.
   ========================================================= */

/* ---------------------------------------------------------
   ADMIN DATA GRIDS
   --------------------------------------------------------- */

ad-table-lite,
[ad-table-lite] {
  display: block;
}

ad-table-lite .table,
[ad-table-lite] .table {
  margin-bottom: 0 !important;

  background: #fff !important;

  border: 1px solid #d9e3e9 !important;
  border-radius: 12px !important;

  box-shadow: 0 3px 12px rgba(45, 66, 82, .055) !important;

  overflow: hidden;
}

/* Header */
ad-table-lite .table>thead>tr:first-child>th,
[ad-table-lite] .table>thead>tr:first-child>th {
  height: 44px !important;
  padding: 11px 14px !important;

  color: white !important;

  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase;

  vertical-align: middle !important;

  background: 38566d !important;

  border: 0 !important;
  border-bottom: 1px solid #d0dde5 !important;
}

/* Search/filter row */
ad-table-lite .table>thead>tr:nth-child(2)>th,
ad-table-lite .table>thead>tr:nth-child(2)>td,
[ad-table-lite] .table>thead>tr:nth-child(2)>th,
[ad-table-lite] .table>thead>tr:nth-child(2)>td {
  padding: 9px 12px !important;

  background: #f8fbfc !important;

  border: 0 !important;
  border-bottom: 1px solid #dfe8ed !important;
}

ad-table-lite .table thead .form-control,
[ad-table-lite] .table thead .form-control {
  height: 32px !important;
  padding: 5px 9px !important;

  color: #3b5364 !important;
  font-size: 11px !important;

  background: #fff !important;

  border: 1px solid #d1dde5 !important;
  border-radius: 7px !important;

  box-shadow: none !important;
}

ad-table-lite .table thead .form-control:focus,
[ad-table-lite] .table thead .form-control:focus {
  border-color: #7ea5ba !important;
  box-shadow: 0 0 0 3px rgba(80, 139, 164, .10) !important;
}

/* Rows */
ad-table-lite .table>tbody>tr,
[ad-table-lite] .table>tbody>tr {
  height: 46px !important;
  background: #fff !important;

  transition: background-color .12s ease !important;
}

ad-table-lite .table>tbody>tr>td,
[ad-table-lite] .table>tbody>tr>td {
  padding: 10px 14px !important;

  color: #314859 !important;
  font-size: 10.5px !important;

  vertical-align: middle !important;

  border: 0 !important;
  border-top: 1px solid #e8eef2 !important;
}

ad-table-lite .table>tbody>tr:first-child>td,
[ad-table-lite] .table>tbody>tr:first-child>td {
  border-top: 0 !important;
}

/* Remove legacy striping */
ad-table-lite .table-striped>tbody>tr:nth-of-type(odd),
ad-table-lite .table-striped>tbody>tr:nth-of-type(even),
[ad-table-lite] .table-striped>tbody>tr:nth-of-type(odd),
[ad-table-lite] .table-striped>tbody>tr:nth-of-type(even) {
  background: #fff !important;
}

ad-table-lite .table>tbody>tr:hover,
[ad-table-lite] .table>tbody>tr:hover {
  background: #f2f7fa !important;
}

/* Action icons */
ad-table-lite .buttonEditar,
ad-table-lite .fa-edit,
ad-table-lite .glyphicon-edit,
[ad-table-lite] .buttonEditar,
[ad-table-lite] .fa-edit,
[ad-table-lite] .glyphicon-edit {
  color: #178e99 !important;
}

ad-table-lite .buttonEliminarBlanco,
ad-table-lite .fa-trash,
ad-table-lite .glyphicon-trash,
[ad-table-lite] .buttonEliminarBlanco,
[ad-table-lite] .fa-trash,
[ad-table-lite] .glyphicon-trash {
  color: #c95a65 !important;
}

/* Pagination / footer */
ad-table-lite .pagination,
[ad-table-lite] .pagination {
  margin: 8px 0 !important;
}

ad-table-lite .pagination>li>a,
ad-table-lite .pagination>li>span,
[ad-table-lite] .pagination>li>a,
[ad-table-lite] .pagination>li>span {
  min-width: 30px !important;
  height: 30px !important;

  margin: 0 2px !important;
  padding: 5px 8px !important;

  color: #567084 !important;
  font-size: 10px !important;
  font-weight: 600 !important;

  background: #fff !important;

  border: 1px solid #d4dfe6 !important;
  border-radius: 6px !important;

  box-shadow: none !important;
}

ad-table-lite .pagination>li>a:hover,
ad-table-lite .pagination>li>span:hover,
[ad-table-lite] .pagination>li>a:hover,
[ad-table-lite] .pagination>li>span:hover {
  color: #31495a !important;
  background: #edf4f7 !important;
}

ad-table-lite .pagination>.active>a,
ad-table-lite .pagination>.active>span,
[ad-table-lite] .pagination>.active>a,
[ad-table-lite] .pagination>.active>span {
  color: #fff !important;
  background: #3a8f99 !important;
  border-color: #3a8f99 !important;
}

/* ---------------------------------------------------------
   STANDARD APPLICATION MODALS
   Excludes login modal/recovery by class.
   --------------------------------------------------------- */

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-content {
  background: #fff !important;

  border: 1px solid #d9e3e9 !important;
  border-radius: 14px !important;

  box-shadow: 0 22px 60px rgba(31, 48, 61, .18) !important;

  overflow: hidden !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-header {
  min-height: 54px !important;

  padding: 15px 48px 14px 20px !important;

  background: #37566d !important;

  border-bottom: 1px solid #d9e4ea !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-title {
  color: white !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body {
  padding: 20px 22px !important;
  background: #fff !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer {
  padding: 11px 20px !important;

  background: #f6f9fb !important;

  border-top: 1px solid #dce6ec !important;
}

/* Close button */
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-header .close {
  position: absolute !important;
  top: 10px !important;
  right: 12px !important;

  width: 32px !important;
  height: 32px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;

  color: #667c8d !important;

  font-size: 20px !important;
  line-height: 1 !important;

  background: #e8f0f4 !important;

  border: 0 !important;
  border-radius: 50% !important;

  opacity: 1 !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-header .close:hover {
  color: #31495a !important;
  background: #dbe7ed !important;
}

/* Labels and fields inside modals */
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body label,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .label {
  color: #5a7184 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .form-control,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .ui-select-bootstrap>.ui-select-match>.btn {
  background: #f8fafc !important;

  border: 1px solid #d3dee6 !important;
  border-radius: 7px !important;

  box-shadow: none !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .form-control:focus,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .ui-select-bootstrap.open>.ui-select-match>.btn {
  background: #fff !important;
  border-color: #7fa3b8 !important;
  box-shadow: 0 0 0 3px rgba(80, 139, 164, .10) !important;
}

/* Tabs inside modal */
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .nav-tabs {
  margin-top: 8px !important;
  margin-bottom: 14px !important;

  border-bottom: 1px solid #dbe5eb !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .nav-tabs>li>a {
  margin-right: 12px !important;
  padding: 8px 3px !important;

  color: #708494 !important;

  font-size: 10px !important;
  font-weight: 600 !important;

  background: transparent !important;

  border: 0 !important;
  border-bottom: 2px solid transparent !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .nav-tabs>li.active>a,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .nav-tabs>li.active>a:hover,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .nav-tabs>li.active>a:focus {
  color: #30485a !important;

  background: transparent !important;

  border: 0 !important;
  border-bottom: 2px solid #3c98a1 !important;

  box-shadow: none !important;
}

/* Inner grouped content */
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .tab-container,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body fieldset.scheduler-border,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-body .well {
  background: #f8fbfc !important;

  border: 1px solid #dbe5eb !important;
  border-radius: 10px !important;

  box-shadow: none !important;
}

/* Footer buttons */
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer .btn {
  min-height: 32px !important;

  padding: 6px 12px !important;

  font-size: 10px !important;
  font-weight: 700 !important;

  border-radius: 7px !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer .btn-success,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer .btn-outline-success {
  color: #fff !important;
  background: #25885d !important;
  border-color: #25885d !important;
}

.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer .btn-default,
.modal:not(.login-main-modal):not(.login-recovery-modal) .modal-footer .btn-outline-default {
  color: #526b7d !important;
  background: #fff !important;
  border-color: #cad8e1 !important;
}

#txtTelefono {
  padding-left: 40px !important;
}

#txtAcoplado1 {
  width: 125px !important;
}

#txtAcoplado2 {
  width: 125px !important;
}

/* =========================================================
   TITULOS DE VISTA
   ========================================================= */

body.tf-sidebar-legacy-view h2,
body.tf-sidebar-legacy-view h3 {
  position: relative;

  margin: 18px 0 22px 26px !important;
  padding-left: 14px !important;

  color: #263b4f !important;

  font-size: 20px !important;
  font-weight: 650 !important;

  line-height: 1.25 !important;

  letter-spacing: -.2px;
}

/* barra de acento */
body.tf-sidebar-legacy-view h2::before,
body.tf-sidebar-legacy-view h3::before {
  content: "";

  position: absolute;

  left: 0;
  top: 2px;

  width: 3px;
  height: calc(100% - 4px);

  border-radius: 4px;

  background: #e30524;
}

/* =========================================================
   PAGE HEADER / TITULO DE VISTA
   ========================================================= */

body.tf-sidebar-legacy-view h2,
body.tf-sidebar-legacy-view h3 {
  display: flex;
  align-items: center;

  min-height: 54px;

  margin: 16px 24px 18px !important;
  padding: 0 18px !important;

  color: #263b4f !important;

  background: #f7fafc !important;

  border: 1px solid #dfe8ee !important;
  border-left: 4px solid #e30524 !important;

  border-radius: 10px !important;

  box-shadow: none !important;

  font-size: 20px !important;
  font-weight: 650 !important;

  line-height: 1.2 !important;
}


/* Si alguna vista ya tenía una barra roja con ::before */
body.tf-sidebar-legacy-view h2::before,
body.tf-sidebar-legacy-view h3::before {
  display: none !important;
}


/* =========================================================
   CONTENEDORES DE TABLA
   ========================================================= */

body.tf-sidebar-legacy-view .panel,
body.tf-sidebar-legacy-view .well,
body.tf-sidebar-legacy-view .table-responsive {
  background: transparent !important;

  border: 0 !important;

  box-shadow: none !important;
}


/* =========================================================
   TABLA PRINCIPAL
   ========================================================= */

body.tf-sidebar-legacy-view table {
  margin-bottom: 0 !important;

  background: #ffffff !important;

  border-collapse: separate !important;
  border-spacing: 0 !important;

  border: 1px solid #dce6ec !important;
  border-radius: 8px !important;

  overflow: hidden !important;

  box-shadow: none !important;
}


/* =========================================================
   HEADER
   ========================================================= */

body.tf-sidebar-legacy-view table thead th {
  background: #365b73 !important;

  color: #ffffff !important;

  border: 0 !important;

  padding: 10px 9px !important;

  font-size: 10px !important;
  font-weight: 600 !important;

  text-shadow: none !important;
}


/* =========================================================
   FILTROS
   ========================================================= */

body.tf-sidebar-legacy-view table thead input,
body.tf-sidebar-legacy-view table thead select {
  height: 30px !important;

  padding: 4px 8px !important;

  background: #ffffff !important;

  border: 1px solid #cfdae2 !important;
  border-radius: 6px !important;

  box-shadow: none !important;

  font-size: 10px !important;
}


/* =========================================================
   FILAS
   ========================================================= */

body.tf-sidebar-legacy-view table tbody td {
  padding: 9px 9px !important;

  color: #334e61 !important;

  background: #ffffff !important;

  border-top: 1px solid #edf2f5 !important;

  vertical-align: middle !important;
}


/* hover suave */
body.tf-sidebar-legacy-view table tbody tr:hover td {
  background: #f8fbfc !important;
}


/* =========================================================
   CONTENEDOR EXTERNO QUE HOY SE VE COMO "CAJÓN"
   ========================================================= */

body.tf-sidebar-legacy-view .panel-default,
body.tf-sidebar-legacy-view .panel-body,
body.tf-sidebar-legacy-view .well {
  margin-left: 20px !important;
  margin-right: 20px !important;

  padding-left: 0 !important;
  padding-right: 0 !important;

  background: transparent !important;

  border: 0 !important;

  box-shadow: none !important;
}


/* =========================================================
   PAGINACION / FOOTER TABLA
   ========================================================= */

body.tf-sidebar-legacy-view .pagination {
  margin: 10px 0 !important;
}

body.tf-sidebar-legacy-view .pagination>li>a,
body.tf-sidebar-legacy-view .pagination>li>span {
  border-radius: 6px !important;

  border: 1px solid #d6e1e7 !important;

  box-shadow: none !important;
}


/* =========================================================
   BOTONES / ICONOS DE ACCION
   ========================================================= */
body.tf-sidebar-legacy-view .ad-table-lite-container {
  box-shadow: none !important;
}

.indicadorEstadoVioleta {
  color: #ffffff !important;
}

.fa-angle-left {
  left: unset !important;
}

@media (min-width: 768px) {
  .col-sm-2 {
    width: 18% !important;
  }
}

@media (min-width: 768px) {
  .col-sm-4 {
    width: 30.333333% !important;
  }
}

@media (min-width: 768px) {
  .col-sm-3 {
    width: 23% !important;
  }
}

@media (min-width: 768px) {
  .col-sm-5 {
    width: 39.666667% !important;
  }
}

@media (min-width: 768px) {
  .col-sm-6 {
    width: 45% !important;
  }
}

.sweet-alert .indicadorEstadoVioleta{
  color: #3D2044 !important;
}

html body .sweet-alert h2 {
  background: none !important;
  border: none !important;
  border-left: none !important;
}

@media (min-width: 768px) {
    .col-sm-10 {
        width: 85.333333%;
    }
}

section#balanza {
  border-radius: 1em !important;
  position: absolute !important;
  left: 50% !important;
  margin-left: 890px !important;
  margin-top: -175px !important;
}

section#balanza .indicadorEstadoNaranja{
  color: #F9BC12 !important;
  font-size: 18px !important;
}


* {
    scrollbar-width: thin;
    scrollbar-color: #38566d #eef3f7;
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: #eef3f7;
}

*::-webkit-scrollbar-thumb {
    background: #38566d;
    border-radius: 8px;
}

*::-webkit-scrollbar-thumb:hover {
    background: #6f8798;
}

.panel>.panel-heading>.row{
  color: white !important;
}

/* =========================================================
   UIB DATEPICKER - FIX GLOBAL
   ========================================================= */

.uib-datepicker-popup.dropdown-menu {
    width: auto !important;
    height: auto !important;
    min-width: 290px !important;

    padding: 5px !important;

    overflow: visible !important;
    top: auto !important;
    bottom: calc(100% + 6px) !important;
    z-index: 9999 !important;
    left: 0 !important;
}


/* Calendario */
.uib-datepicker-popup .uib-datepicker {
    width: 100% !important;
    height: auto !important;
}


/* Evitar estilos globales de tablas */
body.tf-sidebar-legacy-view .uib-datepicker-popup table,
.uib-datepicker-popup table {
    width: 100% !important;

    margin: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;

    box-shadow: none !important;
}


/* Celdas */
body.tf-sidebar-legacy-view .uib-datepicker-popup th,
body.tf-sidebar-legacy-view .uib-datepicker-popup td,
.uib-datepicker-popup th,
.uib-datepicker-popup td {
    padding: 1px !important;

    background: transparent !important;

    border: 0 !important;

    text-align: center !important;
    vertical-align: middle !important;
}


/* =========================================================
   BOTONES DE LOS DÍAS
   ========================================================= */

.uib-datepicker-popup .uib-day .btn,
.uib-datepicker-popup .uib-month .btn,
.uib-datepicker-popup .uib-year .btn {
    width: 100% !important;
    min-width: 32px !important;

    height: 30px !important;
    min-height: 30px !important;

    margin: 0 !important;
    padding: 4px 6px !important;

    font-size: 11px !important;
    line-height: 20px !important;

    box-shadow: none !important;
}


/* =========================================================
   HEADER DEL CALENDARIO
   ========================================================= */

.uib-datepicker-popup thead .btn {
    width: auto !important;

    height: 30px !important;
    min-height: 30px !important;

    margin: 0 !important;
    padding: 4px 8px !important;

    box-shadow: none !important;
}


/* Botón central: mes / año */
.uib-datepicker-popup thead th:nth-child(2) .btn {
    width: 100% !important;
}


/* =========================================================
   FOOTER: HOY / BORRAR / CERRAR
   ========================================================= */

.uib-datepicker-popup > li:last-child {
    padding: 5px !important;
    white-space: nowrap !important;
}

.uib-datepicker-popup > li:last-child .btn {
    width: auto !important;
    min-width: 0 !important;

    height: 30px !important;
    min-height: 30px !important;

    margin: 0 2px !important;
    padding: 5px 10px !important;

    font-size: 11px !important;
}


/* No aplicar hover global de tablas */
body.tf-sidebar-legacy-view .uib-datepicker-popup tbody > tr:hover {
    background: transparent !important;
}

.modal-content:has(.uib-datepicker-popup),
.modal-body:has(.uib-datepicker-popup),
.tab-content:has(.uib-datepicker-popup),
.tab-pane:has(.uib-datepicker-popup),
.panel:has(.uib-datepicker-popup),
.panel-body:has(.uib-datepicker-popup) {
    overflow: visible !important;
}

/* =========================================================
   UIB TIMEPICKER - RESET
   Evita estilos globales de tablas
   ========================================================= */

body.tf-sidebar-legacy-view .uib-timepicker,
body.tf-sidebar-legacy-view .uib-timepicker table,
.uib-timepicker,
.uib-timepicker table {
    width: auto !important;

    margin: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;

    border-collapse: collapse !important;
    border-spacing: 0 !important;

    border-radius: 0 !important;

    overflow: visible !important;

    box-shadow: none !important;

    margin-left: 12px !important;
    margin-top: 8px !important;
}

body.tf-sidebar-legacy-view .uib-timepicker th,
body.tf-sidebar-legacy-view .uib-timepicker td,
.uib-timepicker th,
.uib-timepicker td {
    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 1px 1px !important;

    background: transparent !important;

    border: 0 !important;

    text-align: center !important;
    vertical-align: middle !important;
}

.uib-timepicker input {
    width: 50px !important;

    text-align: center !important;

    margin: 0 !important;
}

.uib-timepicker .btn {
    min-width: 0 !important;
    min-height: 0 !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 2px 6px !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;
}

/* =========================================================
   TIMEPICKER COMPACTO
   ========================================================= */

.uib-timepicker {
    display: inline-block !important;
    width: auto !important;
}

.uib-timepicker table {
    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.uib-timepicker td {
    width: auto !important;
    min-width: 0 !important;

    padding: 0 1px !important;

    background: transparent !important;
    border: 0 !important;
}

.uib-timepicker input.form-control {
    width: 35px !important;
    min-width: 35px !important;
    max-width: 35px !important;

    height: 30px !important;
    min-height: 30px !important;

    padding: 3px 4px !important;

    font-size: 11px !important;
    text-align: center !important;
}

.uib-timepicker .btn {
    width: 22px !important;
    min-width: 22px !important;

    height: 18px !important;
    min-height: 18px !important;

    padding: 0 !important;
    margin: 0 auto !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    font-size: 9px !important;
}

body:has(#eventsDatePicker) .uib-datepicker-popup.dropdown-menu {
    top: 57px !important;
    bottom: auto !important;
}

body:has(#eventsDatePicker1) .uib-datepicker-popup.dropdown-menu {
    top: 57px !important;
    bottom: auto !important;
}

body:has(#eventsDatePicker2) .uib-datepicker-popup.dropdown-menu {
    top: 35px !important;
    bottom: auto !important;
}

.list-group-item {
  padding: 8px 15px !important;
}

/* =========================================================
   SIDEBAR MODULE - DROPDOWNS NATIVOS
   ========================================================= */

.tf-sidebar--module .dropdown-menu {
    position: static !important;

    float: none !important;

    width: calc(100% - 8px) !important;
    min-width: 0 !important;

    margin: 2px 0 6px 8px !important;
    padding: 2px 0 2px 8px !important;

    background: transparent !important;

    border: 0 !important;
    border-left: 1px solid rgba(255,255,255,.09) !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* Cerrado */

.tf-sidebar--module
.dropdown:not(.open) > .dropdown-menu,

.tf-sidebar--module
.dropdown-submenu:not(.open) > .dropdown-menu {
    display: none !important;
}


/* Abierto */

.tf-sidebar--module
.dropdown.open > .dropdown-menu,

.tf-sidebar--module
.dropdown-submenu.open > .dropdown-menu {
    display: block !important;
}


/* =========================================================
   ITEMS SUBMENU
   ========================================================= */

.tf-sidebar--module .dropdown-menu > li {
    float: none !important;

    width: 100% !important;

    margin: 1px 0 !important;

    list-style: none !important;
}


.tf-sidebar--module .dropdown-menu > li > a {
    width: 100% !important;

    display: flex !important;
    align-items: center !important;

    min-height: 32px !important;

    padding: 6px 9px !important;

    color: rgba(255,255,255,.56) !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 6px !important;

    font-size: 12px !important;
    font-weight: 400 !important;

    text-decoration: none !important;

    box-shadow: none !important;
}


.tf-sidebar--module .dropdown-menu > li > a:hover,
.tf-sidebar--module .dropdown-menu > li > a:focus {
    color: #fff !important;

    background: rgba(255,255,255,.055) !important;
}


/* =========================================================
   TOP LEVEL ABIERTO / ACTIVO
   ========================================================= */

.tf-sidebar--module
.tf-sidebar__menu > li.open > a,

.tf-sidebar--module
.tf-sidebar__menu > li.active > a {
    color: #fff !important;

    background: var(--tf-sidebar-active) !important;
}


/* Flecha top level */

.tf-sidebar--module
.tf-sidebar__menu > li.dropdown > a .caret {
    margin-left: auto !important;

    transition: transform .18s ease;

    opacity: .55;
}


.tf-sidebar--module
.tf-sidebar__menu > li.dropdown.open > a .caret {
    transform: rotate(180deg);
}


/* =========================================================
   SUBMENU MULTINIVEL
   ========================================================= */

.tf-sidebar--module .dropdown-submenu {
    position: relative !important;
}


.tf-sidebar--module
.dropdown-submenu > a::after {
    content: "›";

    margin-left: auto;

    color: rgba(255,255,255,.38);

    font-size: 13px;

    transition: transform .18s ease;
}


.tf-sidebar--module
.dropdown-submenu.open > a::after {
    transform: rotate(90deg);
}


.tf-sidebar--module
.dropdown-submenu > .dropdown-menu {
    width: calc(100% - 8px) !important;

    margin-left: 8px !important;

    border-left-color: rgba(255,255,255,.07) !important;
}

@media (min-width: 992px) {
    .col-md-3 {
        width: 24%;
    }
}

@media (min-width: 992px) {
    .col-md-6 {
        width: 45%;
    }
}