.logo {
  width: 100%;
  background: #14183f;
}

.logo img {
  padding: 0.5rem;
  border-radius: 0;
}

.modules {
  display: flex;
  flex-wrap: wrap;
  padding-top: 0;
  --color-light: #f3f4f6;
  --color-base:  #595959;
  --color-dark:  #454545;
  --color-fg:    #ffffff;

  .module-wrapper {
    padding: 12px;

    .module-border {
      position: relative;
      background: var(--color-base);
      border: 6px solid var(--color-base);
      border-radius: 22px;
    }

    .module {
      display: flex;
      flex-direction: column;
      padding: 8px 16px;
      border: 6px solid transparent;
      border-radius: 16px;
      min-height: 360px;
      color: var(--color-dark);
      background-color: var(--color-light);
      cursor: pointer;
      text-decoration: none;
    }

    .mini-module {
      display: flex;
      flex-direction: column;
      padding: 8px 16px;
      border: 6px solid transparent;
      border-radius: 16px;
      color: var(--color-dark);
      background-color: var(--color-light);
      cursor: pointer;
      text-decoration: none;
    }

    .module-list {
      position: absolute;
      display: flex;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      pointer-events: none;

      .module-cont {
        display: flex;
        flex-grow: 1;
        padding: 4rem 2rem;
      }

      .module-cont.na {
        display: flex;
        justify-content: center;
        align-items: center;
        user-select: none;
      }
      
      .module-cont > div {
        pointer-events: all;
        display: block;
        height: min-content;
        
        a {
          color: var(--text);
        }
      }
    }

    .module-border:hover,
    .module:hover {
      /*border-width: 6px;*/
      border-color: var(--color-base);
    }
    .module-border:not(.na):active {
      scale: 0.98;
    }
    .module.na {
      cursor: unset;
    }
  }

}

/* Estadísticas del Estado */
.status.block {
  background: white;
  border-radius: 8px;
  margin-bottom: 2rem;
}

.status.block .stat-number {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--color-base);
  line-height: 1;
}

.status.block .stat-label {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #6b7280;
}