/* Shared surface for access screens and notice cards. Explicit classes also
   support the standalone PHP preview, where Blade components are not compiled. */
.access-card {
    display: block;
    width: 100%;
    max-width: 420px;
    padding: 36px;
    border: 1px solid #ffffff22;
    border-radius: 24px;
    background: linear-gradient(135deg, #242121, #141414);
    box-shadow: 0 25px 80px #0005;
}
@media (max-width: 400px) {
    .access-card { padding: 26px; }
}
.profile-art {
  position: relative;
}

.profile-tier-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 6px 11px;
  border: 1px solid transparent;
  border-radius: 999px;

  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;

  backdrop-filter: blur(8px);
}

.profile-tier-badge--standard {
  color: #e5e5e5;
  background: rgba(24, 24, 24, .85);
  border-color: rgba(255, 255, 255, .22);
}

.profile-tier-badge--premium {
  color: #f5d99e;
  background: rgba(45, 32, 15, .9);
  border-color: rgba(211, 177, 113, .65);
}

.profile-tier-badge--elite {
  color: #17120a;
  background: linear-gradient(135deg, #f4dda9, #b88b42);
  border-color: #e3c78c;
}
.profile-art {
  position: relative;
}

.profile-art > .profile-tier-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
}

.profile-art > .advertisement-new-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 3;
}
.advertisement-new-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 5;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 3px 7px;
  border-radius: 4px;

  background: #dc2626;
  color: #fff;

  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-transform: uppercase;

  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  pointer-events: none;
}
.profile-tier-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 3px 7px;
  border-radius: 4px;

  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.03em;
  text-transform: uppercase;

  white-space: nowrap;
  box-sizing: border-box;
}

/* Keep individual tier colors */
.profile-tier-badge--standard {
  background: #242424;
  color: #fff;
  border: none;
}

.profile-tier-badge--premium {
  background: #a67c32;
  color: #fff;
  border: none;
}

.profile-tier-badge--elite {
  background: linear-gradient(135deg, #d4af37, #8c6824);
  color: #fff;
  border: none;
}
.profile-art > .profile-tier-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 3;
}
.profile-image-container {
  position: relative;
}

.profile-image-container .profile-art {
  display: block;
}

.profile-whatsapp {
  position: absolute;
  bottom: 12px;
  right: 12px;
  z-index: 5;

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

  width: 38px;
  height: 38px;

  border-radius: 50%;
  background: #25d366;
  color: #fff;

  box-shadow: 0 3px 12px rgba(0, 0, 0, .3);
  transition: transform .2s ease, background .2s ease;
}

.profile-whatsapp:hover {
  background: #1ebe5d;
  transform: scale(1.08);
}

.profile-whatsapp:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
@media (max-width: 639px) {
  .directory-card .profile-tier-badge, .directory-card .advertisement-new-badge {
    font-size: 8px;
    padding: 3px 5px;
    line-height: 1;
    white-space: nowrap;
  }
}