:root {
  color-scheme: light;
  --yn-purple-950: #210942;
  --yn-purple-900: #2b0b57;
  --yn-purple-700: #4c167d;
  --yn-purple-500: #7a36b5;
  --yn-violet-300: #caa5eb;
  --yn-teal-700: #006f67;
  --yn-teal-500: #00a98f;
  --yn-teal-300: #66e3ce;
  --yn-surface: #fbf9ff;
  --yn-card: #ffffff;
  --yn-text: #210942;
  --yn-muted: #6c6177;
  --yn-border: #e5dcf0;
  --yn-success: #168765;
  --yn-warning: #b86c00;
  --yn-danger: #b62d48;
  --yn-radius-sm: 12px;
  --yn-radius-md: 18px;
  --yn-radius-lg: 28px;
  --yn-shadow-sm: 0 8px 24px rgb(33 9 66 / 8%);
  --yn-shadow-lg: 0 24px 70px rgb(33 9 66 / 16%);
  --yn-gradient: linear-gradient(135deg, var(--yn-purple-700), var(--yn-purple-500));
}

.yn-image-state {
  position: relative;
  overflow: hidden;
  background: #efe8f7;
}

.yn-image-state > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.yn-image-state[data-verified="0"]::after {
  content: "الصورة قيد التوثيق";
  position: absolute;
  inset-inline: 12px;
  bottom: 12px;
  padding: 7px 10px;
  border: 1px solid rgb(255 255 255 / 48%);
  border-radius: 999px;
  background: rgb(33 9 66 / 78%);
  color: #fff;
  font: 700 12px/1.4 Tahoma, Arial, sans-serif;
  text-align: center;
  backdrop-filter: blur(10px);
}