.nav-link-easg {
      width: 100%;
      height: 40px;
      text-align:left;
      padding: 10px;
      color: #d6d6d6;
      cursor: pointer;
      font-size: 12px !important;
    }

    .nav-link-easg:hover {
      background-color: #0863c7 !important;
    }

    .sidebar-easg {
      width:200px; background-color: rgb(10, 57, 109); border-right: 2px solid #b92234; height: 100vh; position:fixed; left:0; top:0; z-index:4;
    }

    .sidebar-logo {
      width: 100% !important; text-align: center !important; padding-top: 15px !important; padding-bottom: 15px !important;
    }

    .w3-dropdown-hover, .w3-dropdown-content:hover {
        width: 100% !important;
    }

    .w3-button {
        width: 100% !important;
        text-align: left !important;
        padding-left: 10px !important;
        color: #bdc3c9 !important;
    }

    .w3-dropdown-content {
        margin-left: 190px !important;
        margin-top: -38px !important;
    }

    /* TORRE ONE */
    .tv-wrapper {
      width: 100%;
      height: calc(100vh - 15.5px);
      overflow: hidden;
      background: #F5F7FA;
    }

    .torre-one {
      min-height: 100%;
      display: flex;
      flex-direction: column;
    }

    .torre-one header {
      padding: 12px 24px;
      border-radius: 6px;
      background: linear-gradient(90deg, #E31837 0%, #B00E2A 100%);
      transform-origin: top left;
    }

    .torre-one h4, 
    .torre-one h6,
    .torre-one span,
    .torre-one table,
    .torre-one .grid-tdr {
      font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    }

    .torre-one h6 {
      letter-spacing: 2px;
      font-weight: 700;
      font-size: 14px !important;
    }

    .torre-one .brand {
      margin-bottom: 0;
      font-weight: 800;
      font-size: 26px;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: #FFF;
    }

    .torre-one .brand .pink {
      color: #FFD4DA;
    }

    .torre-one .title {
      margin-bottom: 0;
      text-align: center;
      font-size: 22px;
      font-weight: 600;
      letter-spacing: 3px;
      text-transform: uppercase;
      color: #FFF;
    }

    .torre-one .time {
      font-variant-numeric: tabular-nums;
      font-weight: 700;
      font-size: 18px;
      color: #FFF;
    }

    .card-mo {
      border-radius: 5px !important;
      position: relative;
      display: flex;
      flex-direction: column;
      min-width: 0;
      word-wrap: break-word;
      background-color: #FFF;
      box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
    }

    .card-header-mo {
      padding: 7px 14px;
      border: none;
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      background-color: #0D3C69;
    }

    .card-body-mo {
      flex: 1 1 auto;
      min-height: 1px;
      border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px;
    }

    .card-body-tdr {
      flex: 1;
      padding: 6px;
      overflow: hidden;
      min-height: 0;
    }

    /* TDR */
    .grid-tdr {
      display: grid;
      grid-template-columns: 140px repeat(5, 1fr);
      grid-auto-rows: 1fr;
      gap: 4px;
      height: 100%;
    }

    .th-tdr {
      height: 67.83px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      font-weight: 700;
      text-transform: uppercase;
      border-radius: 4px;
      font-variant-numeric: tabular-nums;
    }

    .th-tdr.head {
      font-size: 14px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: #0D3C69;
      background: #E9EEF5;
    }

    .th-tdr.label {
      font-size: 16px;
      font-weight: 700;
      letter-spacing: 1px;
      justify-content: flex-start;
      padding-left: 16px;
      color: #0D3C69;
      background: #F0F3F8;
    }

    .v-ok {
      color: #1E8E3E;
      background: #E6F4EA;
    }

    .v-dang {
      color: #C62828;
      background: #FDECEC;
    }

    /* GENERAL TORRE ONE */
    .table-striped-mo tbody tr:not(:last-child) {
      border-bottom: 1px solid #E7ECF2;
    }

    .table-striped-mo tbody tr:nth-child(even) td {  
      background: #F3F6FA;
    }

    .th-mo {
      padding: 6px 4px !important;
      font-size: 12px !important;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-align: center;
      text-transform: uppercase;
      color: #FFF;
      background-color: #0D3C69;
    }

    .th-mo:not(:last-child) {
      border-right: 1px solid rgba(255, 255, 255, .15);
    }

    .badge-pill-mo {
      padding: 4px 10px;
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      border-radius: 13px;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      cursor: default;
      color: #FFF;
      background: rgba(255, 255, 255, .18);
    }

    .badge-pill-mo .dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: #6EE6A3;
      box-shadow: 0 0 6px #6EE6A3;
    }

    .dot-off {
      background: #FFF2C2 !important;
      box-shadow: 0 0 6px #FFF2C2 !important;
    }

    .badge-pill-mo-text {
      padding: 2px 8px;
      border-radius: 10px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .5px;
      text-transform: uppercase;
      color: #FFF;
      background: rgba(255, 255, 255, .2);
    }

    .def-limits {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: center;
    }

    .lim {
      padding: 3px 8px;
      border-radius: 4px;
      display: inline-flex;
      align-items: baseline;
      gap: 4px;
      font-size: 12px;
      font-weight: 600;
      background: #F0F3F8;
    }

    .lim .k {
      text-transform: uppercase;
      letter-spacing: 1px;
      color: #5A6882;
    }

    .lim .v {
      font-weight: 800;
      font-size: 14px;
      color: #0D3C69;
    }

    .fw-800 {
      font-weight: 800 !important;
    }

    /* OTP */
    .td-otp {
      padding: 4px !important;
      font-size: 15px;
      font-weight: 600;
      color: #0D3C69;
    }

    .base .td-otp {
      font-weight: 800 !important;
      background-color: #FFF6E0;
    }

    /* DIFERIDOS */
    .td-def {
      padding: 4px !important;
    }

    .fleet {
      font-size: 18px;
      font-weight: 800;
      color: #0D3C69;
    }

    .pct-ok {
      color: #1E8E3E;
    }

    .pct-warn {
      color: #C08A00;
    }

    .pct-dang {
      color: #C62828;
    }

    /* AOG */
    .table-aog tbody tr:not(:last-child) {
      border-bottom: 1px solid #E7ECF2;
    }

    .td-aog {
      padding: 4px !important;
      font-weight: 600;
      text-align: center;
      vertical-align: middle !important;
      color: #0D3C69;
    }

    .td-aog-reg {
      font-weight: 800;
      text-align: left;
    }

    .wait {
      background: #FDECEC;
    }

    .eval {
      background: #FFF2C2;
    }

    .status-pill {
      padding: 1px 6px;
      border-radius: 8px;
      display: inline-block;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      color: #fff;
    }

    .status-wait {
      background: #C62828;
    }

    .status-eval {
      background: #C08A00;
    }

    .td-aog.reason {
      font-size: 11px;
      font-weight: 500;
      text-align: left;
      vertical-align: middle;
      color: #5A6882;
    }
    /* SKELETON */
    .skeleton {
      width: 50%;
      margin: 0 auto;
      background: linear-gradient(
        90deg,
      #e5e7eb 25%,
      #f3f4f6 37%,
      #e5e7eb 63%
      );
      background-size: 400% 100%;
      animation: skeleton-loading 1.4s ease infinite;
      border-radius: 4px;
    }

    .skeleton-container:not(:last-child) {
      margin-bottom: .25rem;
    }

    .sk-text {
      height: 12px;
      width: 70%;
      margin: 0 auto;
    }

    .sk-label {
      height: 14px;
      width: 60%;
    }

    .sk-number {
      height: 14px;
      width: 50%;
      margin: 0 auto;
    }

    /* FOOTER */
    .footer-mo {
      padding: 6px 16px;
      font-size: 13px;
      letter-spacing: 1px;
      border-radius: 6px;
      color: #B7C1D4;
      background: #0D1A33;
    }

    @keyframes skeleton-loading {
      0% {
        background-position: 100% 50%;
      }
      100% {
        background-position: 0 50%;
      }
    }

    /* FADE */
    .fade-value {
      transition: all 0.3s ease;
    }

    .fade-update {
      animation: fadeGlow 0.4s ease;
    }

    @keyframes fadeGlow {
      0% {
        opacity: 0.5;
        background-color: rgba(255,255,255,0.08);
      }
      100% {
        opacity: 1;
        background-color: transparent;
      }
    }
    /* END CARDS TORRE ONE */

    @media screen and (max-width: 768px) {
      .sidebar-easg {
        display:none !important;
      }
    }


    @media screen and (min-width: 768px) {
      .sidebared {
        margin-left:200px !important;
      }

      .nav-logo, #nav-options {
        display: none !important;
      }
    }

    .form-control, .card-header, .card, .card-body  {
      border-radius: 0px !important;
    }

    body, h1, h2, h3, h4, h5, h6, span, p {
      font-family: 'Recursive', sans-serif !important;
    }

    button, input, select, a, .modal-header, .modal-footer {
      border-radius: 0px !important;
    }

    th, .card-header {
        font-size:16px !important;
    }

    .no-csv .exportCSV {
      display: none;
    }

    .bg-light-success {
      background-color: #c1f47a !important;
    }

    .grid-container-3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2px;
    }

    .mr-9 {
      margin-right: .9rem !important;
    }

    .mb-15 {
      margin-bottom: 1.55rem !important;
    }

    .mb-2r {
      margin-bottom: 2rem !important;
    }

    .gap-1 {
      gap: .5rem;
    }

    .gap-2 {
      gap: 1rem;
    }

    .fs-1 {
      font-size: 1rem !important;
    }

    .b-table-sticky-header > .table.b-table > thead > tr > th {
      top: -1px !important;
    }

    .table-cycle {
      margin-bottom: 0 !important;
    }

    .table-cycle thead tr th {
      border-top: 0 !important;
    }

    .table-cycle tbody tr td {
      padding: 0;
    }
  
    .table-cycle tbody tr td:first-of-type {
      padding: .5rem .75rem;
    }

    .table-cycle tbody tr td button,
    .table-cycle tbody tr td div {
      font-size: 15px !important;
      padding: .5rem .75rem;
    }

    #accordionSummaries button:focus {
      box-shadow: none !important;
    }

    .table-pm tbody td {
      font-size: 0.875rem;
      vertical-align: middle;
    }

    .table-mh thead tr:not(:last-of-type) th {
      border-bottom-width: 1px !important;
    }