:root {
  --ez-card-border: rgba(148, 163, 184, 0.18);
  --ez-card-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  --ez-card-shadow-hover: 0 24px 52px rgba(15, 23, 42, 0.12);
  --ez-card-highlight: rgba(255, 255, 255, 0.65);
  --ez-card-surface: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 255, 0.9));
}

body.dark-theme {
  --ez-card-border: rgba(255, 255, 255, 0.09);
  --ez-card-shadow: 0 20px 46px rgba(2, 6, 23, 0.38);
  --ez-card-shadow-hover: 0 26px 60px rgba(2, 6, 23, 0.48);
  --ez-card-highlight: rgba(255, 255, 255, 0.1);
  --ez-card-surface: linear-gradient(180deg, rgba(18, 25, 40, 0.96), rgba(11, 18, 32, 0.92));
}

.dashboard-container .welcome-card,
.shop-container .welcome-card,
.account-container .welcome-card,
.account-container .balance-card,
.dashboard-container .stats-grid .stats-card,
.shop-container .stats-grid .stats-card,
.account-container .stats-grid .stats-card,
.account-container .rules-grid .rule-item {
  position: relative;
  overflow: hidden !important;
  border-radius: 24px !important;
  border: 1px solid var(--ez-card-border) !important;
  background: var(--ez-card-surface) !important;
  box-shadow: var(--ez-card-shadow) !important;
  background-clip: padding-box;
  isolation: isolate;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
}

.dashboard-container .dashboard-card,
.dashboard-container .subscription-card,
.dashboard-container .notice-card,
.dashboard-container .pending-items-card,
.dashboard-container .download-card,
.dashboard-container .import-card,
.shop-container .dashboard-card,
.shop-container .plans-wrapper .plan-card,
.shop-container .filter-toggle-container .filter-toggle-wrapper,
.shop-container .no-plans-message,
.account-container .dashboard-card {
  overflow: hidden;
  background-clip: padding-box;
  isolation: isolate;
}

.dashboard-container .notice-card .notice-item,
.dashboard-container .pending-items-card .pending-item,
.dashboard-container .download-card .download-options .download-option,
.shop-container .plans-wrapper .discount-calculation {
  overflow: hidden;
  background-clip: padding-box;
}

.dashboard-container .welcome-card::before,
.shop-container .welcome-card::before,
.account-container .welcome-card::before,
.account-container .balance-card::before,
.dashboard-container .stats-grid .stats-card::before,
.shop-container .stats-grid .stats-card::before,
.account-container .stats-grid .stats-card::before,
.account-container .rules-grid .rule-item::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(var(--ez-accent-rgb, var(--theme-color-rgb)), 0.16), transparent 44%),
    radial-gradient(circle at 100% 0, rgba(var(--ez-accent-rgb, var(--theme-color-rgb)), 0.18), transparent 28%);
  pointer-events: none;
  border-radius: inherit;
}

.dashboard-container .welcome-card::after,
.shop-container .welcome-card::after,
.account-container .welcome-card::after,
.account-container .balance-card::after,
.dashboard-container .stats-grid .stats-card::after,
.shop-container .stats-grid .stats-card::after,
.account-container .stats-grid .stats-card::after,
.account-container .rules-grid .rule-item::after {
  content: "";
  position: absolute;
  inset: 1px 1px auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--ez-card-highlight), transparent);
  opacity: 0.85;
  pointer-events: none;
  border-radius: inherit;
}

.dashboard-container .welcome-card > *,
.shop-container .welcome-card > *,
.account-container .welcome-card > *,
.account-container .balance-card > *,
.dashboard-container .stats-grid .stats-card > *,
.shop-container .stats-grid .stats-card > *,
.account-container .stats-grid .stats-card > *,
.account-container .rules-grid .rule-item > * {
  position: relative;
  z-index: 1;
}

.dashboard-container .welcome-card:hover,
.shop-container .welcome-card:hover,
.account-container .welcome-card:hover,
.account-container .balance-card:hover,
.dashboard-container .stats-grid .stats-card:hover,
.shop-container .stats-grid .stats-card:hover,
.account-container .stats-grid .stats-card:hover,
.account-container .rules-grid .rule-item:hover {
  transform: translateY(-4px);
  box-shadow: var(--ez-card-shadow-hover) !important;
}

.dashboard-container .welcome-card .card-title,
.shop-container .welcome-card .card-title,
.account-container .welcome-card .card-title,
.account-container .balance-card .card-title,
.dashboard-container .stats-grid .stats-card .stats-value,
.shop-container .stats-grid .stats-card .stats-value,
.account-container .stats-grid .stats-card .stats-value {
  letter-spacing: -0.02em;
}

.dashboard-container .welcome-card .card-title,
.shop-container .welcome-card .card-title,
.account-container .welcome-card .card-title,
.account-container .balance-card .card-title {
  font-size: 20px !important;
  font-weight: 700 !important;
}

.dashboard-container .welcome-card .card-body > p,
.shop-container .welcome-card .card-body > p,
.account-container .welcome-card .card-body > p {
  font-size: 15px;
  line-height: 1.7;
  color: rgba(var(--text-color-rgb), 0.72);
}

.dashboard-container .stats-grid .stats-card,
.shop-container .stats-grid .stats-card,
.account-container .stats-grid .stats-card {
  min-height: 132px;
  gap: 18px !important;
  padding: 22px 20px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease !important;
}

.dashboard-container .stats-grid .stats-card .stats-icon,
.shop-container .stats-grid .stats-card .stats-icon,
.account-container .stats-grid .stats-card .stats-icon,
.account-container .rules-grid .rule-item .rule-icon {
  position: relative;
  width: 62px !important;
  height: 62px !important;
  border-radius: 18px !important;
  margin-right: 0 !important;
  flex: 0 0 62px;
  background: linear-gradient(135deg, rgba(var(--ez-accent-rgb, var(--theme-color-rgb)), 0.18), rgba(var(--ez-accent-rgb, var(--theme-color-rgb)), 0.08)) !important;
  color: rgb(var(--ez-accent-rgb, var(--theme-color-rgb))) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.35),
    0 12px 24px rgba(var(--ez-accent-rgb, var(--theme-color-rgb)), 0.16);
}

.dashboard-container .stats-grid .stats-card .stats-icon::after,
.shop-container .stats-grid .stats-card .stats-icon::after,
.account-container .stats-grid .stats-card .stats-icon::after,
.account-container .rules-grid .rule-item .rule-icon::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 14px;
  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.42), transparent 62%);
  pointer-events: none;
}

.dashboard-container .stats-grid .stats-card .stats-value,
.shop-container .stats-grid .stats-card .stats-value,
.account-container .stats-grid .stats-card .stats-value {
  font-size: 24px !important;
  font-weight: 800 !important;
  margin-bottom: 8px !important;
}

.dashboard-container .stats-grid .stats-card .stats-label,
.shop-container .stats-grid .stats-card .stats-label,
.account-container .stats-grid .stats-card .stats-label {
  font-size: 13px !important;
  color: rgba(var(--text-color-rgb), 0.68) !important;
  letter-spacing: 0.04em;
}

.dashboard-container .stats-grid .stats-card .chevron-icon,
.shop-container .stats-grid .stats-card .chevron-icon,
.account-container .stats-grid .stats-card .chevron-icon {
  color: rgb(var(--ez-accent-rgb, var(--theme-color-rgb))) !important;
  opacity: 0.72 !important;
}

.dashboard-container .stats-grid .stats-card:hover .chevron-icon,
.shop-container .stats-grid .stats-card:hover .chevron-icon,
.account-container .stats-grid .stats-card:hover .chevron-icon {
  transform: translateX(5px) !important;
  opacity: 1 !important;
}

.dashboard-container .stats-grid .stats-card:nth-child(1) {
  --ez-accent-rgb: 10, 184, 166;
}

.dashboard-container .stats-grid .stats-card:nth-child(2) {
  --ez-accent-rgb: 245, 158, 11;
}

.dashboard-container .stats-grid .stats-card:nth-child(3) {
  --ez-accent-rgb: 59, 130, 246;
}

.dashboard-container .stats-grid .stats-card:nth-child(4) {
  --ez-accent-rgb: 139, 92, 246;
}

.shop-container .stats-grid .stats-card:nth-child(1) {
  --ez-accent-rgb: 37, 99, 235;
}

.shop-container .stats-grid .stats-card:nth-child(2) {
  --ez-accent-rgb: 6, 182, 212;
}

.shop-container .stats-grid .stats-card:nth-child(3) {
  --ez-accent-rgb: 236, 72, 153;
}

.shop-container .stats-grid .stats-card:nth-child(4) {
  --ez-accent-rgb: 16, 185, 129;
}

.account-container .stats-grid .stats-card:nth-child(1) {
  --ez-accent-rgb: 14, 165, 233;
}

.account-container .stats-grid .stats-card:nth-child(2) {
  --ez-accent-rgb: 249, 115, 22;
}

.account-container .stats-grid .stats-card:nth-child(3) {
  --ez-accent-rgb: 34, 197, 94;
}

.account-container .stats-grid .stats-card:nth-child(4) {
  --ez-accent-rgb: 168, 85, 247;
}

.dashboard-container .welcome-card {
  --ez-accent-rgb: 59, 130, 246;
  padding: 24px 24px 22px !important;
}

.shop-container .welcome-card {
  --ez-accent-rgb: 14, 165, 233;
  padding: 24px 24px 22px !important;
}

.account-container .welcome-card {
  --ez-accent-rgb: 99, 102, 241;
  padding: 24px 24px 22px !important;
}

.account-container .balance-card {
  --ez-accent-rgb: 56, 189, 248;
  padding: 24px !important;
}

.account-container .balance-card .balance-value {
  font-size: 36px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em;
}

.account-container .balance-card .balance-actions {
  gap: 12px !important;
}

.account-container .balance-card .balance-actions .btn-primary,
.account-container .balance-card .balance-actions .withdraw-btn {
  border-radius: 14px !important;
  min-width: 148px !important;
  box-shadow: 0 12px 24px rgba(var(--theme-color-rgb), 0.16);
}

.account-container .dashboard-card.welcome-card,
.account-container .dashboard-card.balance-card,
.account-container .dashboard-card .invite-card-inner {
  overflow: hidden !important;
  background-clip: padding-box;
  isolation: isolate;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
}

.account-container .dashboard-card .invite-card-inner::before,
.account-container .dashboard-card .invite-card-inner .card-decoration {
  border-radius: inherit;
}

.account-container .dashboard-card .records-table-wrapper {
  overflow: hidden !important;
  overflow-x: auto !important;
  border-radius: 18px !important;
  background-clip: padding-box;
  isolation: isolate;
}

.account-container[data-v-4e8102e9] .welcome-card::before,
.account-container[data-v-4e8102e9] .welcome-card::after,
.account-container[data-v-4e8102e9] .balance-card::before,
.account-container[data-v-4e8102e9] .balance-card::after,
.account-container[data-v-4e8102e9] .stats-grid .stats-card::before,
.account-container[data-v-4e8102e9] .stats-grid .stats-card::after,
.account-container[data-v-4e8102e9] .rules-grid .rule-item::before,
.account-container[data-v-4e8102e9] .rules-grid .rule-item::after {
  content: none !important;
}

.account-container .rules-grid .rule-item {
  min-height: 116px;
  gap: 16px !important;
  padding: 18px !important;
  align-items: center !important;
}

.account-container .rules-grid .rule-item:nth-child(1) {
  --ez-accent-rgb: 59, 130, 246;
}

.account-container .rules-grid .rule-item:nth-child(2) {
  --ez-accent-rgb: 16, 185, 129;
}

.account-container .rules-grid .rule-item:nth-child(3) {
  --ez-accent-rgb: 249, 115, 22;
}

.account-container .rules-grid .rule-item:nth-child(4) {
  --ez-accent-rgb: 168, 85, 247;
}

.account-container .rules-grid .rule-item .rule-content h3 {
  font-size: 16px !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
}

.account-container .rules-grid .rule-item .rule-content p {
  line-height: 1.6 !important;
  color: rgba(var(--text-color-rgb), 0.7) !important;
}

.dashboard-container .welcome-card .user-email {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  margin-top: 16px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(var(--theme-color-rgb), 0.12) !important;
  border-radius: 999px;
  background: rgba(var(--theme-color-rgb), 0.06);
}

@media (max-width: 768px) {
  .dashboard-container .welcome-card,
  .shop-container .welcome-card,
  .account-container .welcome-card,
  .account-container .balance-card,
  .dashboard-container .stats-grid .stats-card,
  .shop-container .stats-grid .stats-card,
  .account-container .stats-grid .stats-card,
  .account-container .rules-grid .rule-item {
    border-radius: 20px !important;
  }

  .dashboard-container .stats-grid .stats-card,
  .shop-container .stats-grid .stats-card,
  .account-container .stats-grid .stats-card {
    min-height: 120px;
    padding: 18px 16px !important;
  }

  .dashboard-container .stats-grid .stats-card .stats-icon,
  .shop-container .stats-grid .stats-card .stats-icon,
  .account-container .stats-grid .stats-card .stats-icon,
  .account-container .rules-grid .rule-item .rule-icon {
    width: 56px !important;
    height: 56px !important;
    flex-basis: 56px;
  }

  .dashboard-container .stats-grid .stats-card .stats-value,
  .shop-container .stats-grid .stats-card .stats-value,
  .account-container .stats-grid .stats-card .stats-value {
    font-size: 21px !important;
  }

  .account-container .balance-card .balance-value {
    font-size: 30px !important;
  }
}
