/* VanillyNeko account console — cute pastel layout */

body[data-page-id="account"] .keycloak__loading-container,
#app .pf-v5-c-page {
  font-family: var(--vn-font);
}

body[data-page-id="account"] .keycloak__loading-container {
  background:
    radial-gradient(ellipse 70% 50% at 50% 0%, rgba(167, 139, 218, 0.16), transparent 60%),
    url("../img/background.png") center / cover no-repeat fixed,
    var(--vn-bg) !important;
}

body[data-page-id="account"] .keycloak__loading-container::before {
  content: "✦";
  position: absolute;
  top: 18%;
  right: 16%;
  font-size: 1.5rem;
  color: rgba(232, 164, 200, 0.5);
  animation: vn-float 5s ease-in-out infinite;
}

#app .pf-v5-c-page {
  background:
    radial-gradient(ellipse 80% 40% at 50% 0%, rgba(167, 139, 218, 0.1), transparent 55%),
    var(--vn-bg) !important;
}

.pf-v5-c-page,
.pf-v5-c-page__main-section,
.pf-v5-c-page__main,
.pf-v5-c-drawer__content {
  background-color: transparent !important;
}

.pf-v5-c-page__main-section.pf-m-light,
.pf-v5-c-page__main-section.pf-m-light-100 {
  background-color: transparent !important;
}

.pf-v5-c-masthead {
  background: rgba(20, 14, 28, 0.92) !important;
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(196, 167, 231, 0.16);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

.pf-v5-c-page__sidebar,
.pf-v5-c-page__sidebar-body {
  background: rgba(26, 18, 36, 0.96) !important;
  border-right: 1px solid rgba(196, 167, 231, 0.12);
}

.pf-v5-c-nav__link {
  border-radius: 12px;
  margin: 2px 8px;
  font-weight: 600;
}

.pf-v5-c-nav__link.pf-m-current {
  background: rgba(167, 139, 218, 0.16) !important;
}

.pf-v5-c-card,
.pf-v5-c-panel,
.pf-v5-c-data-list,
.pf-v5-c-table,
.pf-v5-c-tile {
  border-radius: var(--vn-radius-sm) !important;
  border: 1px solid rgba(196, 167, 231, 0.16) !important;
  box-shadow: var(--vn-glow);
}

.pf-v5-c-button.pf-m-primary {
  background: var(--vn-gradient-btn) !important;
  border: none !important;
  border-radius: var(--vn-radius-pill) !important;
  color: #1a0f24 !important;
  font-weight: 800 !important;
}

.pf-v5-c-button.pf-m-secondary {
  border-radius: var(--vn-radius-pill) !important;
  font-weight: 700;
}

.pf-v5-c-tabs__link {
  font-weight: 700;
  border-radius: 10px 10px 0 0;
}

.pf-v5-c-tabs__link.pf-m-current {
  color: var(--vn-accent) !important;
}

.pf-v5-c-breadcrumb__link,
.pf-v5-c-dropdown__toggle,
.pf-v5-c-toolbar,
.pf-v5-c-switch__label {
  color: var(--vn-text) !important;
  font-weight: 600;
}

.pf-v5-c-dropdown__menu-item,
.pf-v5-c-menu__item {
  background-color: var(--vn-surface) !important;
  color: var(--vn-text) !important;
  border-radius: 8px;
}

.pf-v5-c-dropdown__menu-item:hover,
.pf-v5-c-menu__item:hover {
  background-color: var(--vn-bg-elevated) !important;
}

#vn-admin-console-item {
  width: 100%;
  text-align: left;
}

.pf-v5-c-modal-box {
  border-radius: var(--vn-radius) !important;
  border: 1px solid rgba(196, 167, 231, 0.2) !important;
  box-shadow: var(--vn-glow), 0 24px 64px rgba(0, 0, 0, 0.45) !important;
}

.pf-v5-c-helper-text__item-text {
  color: var(--vn-text-muted) !important;
}

.pf-v5-c-form-control,
input[type="text"],
input[type="password"],
input[type="email"] {
  border-radius: var(--vn-radius-sm) !important;
}

@keyframes vn-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}