/* =========================================================
   PORTAL CARDS
========================================================= */

.portal {
  width: min(780px, 100%);

  padding: 9px;

  background:
    rgba(4, 9, 16, 0.80);

  border: 1px solid rgba(255, 255, 255, 0.12);

  border-radius: 8px;

  box-shadow:
    0 25px 70px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);

  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.portal-link {
  position: relative;

  min-height: 82px;

  margin-bottom: 8px;

  padding: 15px 18px;

  display: flex;
  align-items: center;

  color: var(--white);

  text-decoration: none;

  background:
    linear-gradient(
      90deg,
      rgba(19, 30, 46, 0.92),
      rgba(12, 20, 32, 0.82)
    );

  border: 1px solid var(--border);

  border-radius: 6px;

  overflow: hidden;

  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}

.portal-link:last-child {
  margin-bottom: 0;
}

.portal-link:hover {
  background: var(--card-hover);

  border-color:
    rgba(49, 152, 255, 0.38);

  transform: translateX(3px);
}

/* Blue side bar */
.portal-link::before {
  content: "";

  position: absolute;

  left: 0;
  top: 0;

  width: 4px;
  height: 100%;

  background: var(--blue);

  opacity: 0.95;
}