#search-dialog el-dialog-panel {
  --search-surface: var(--background);
  --search-ink: var(--foreground);
  border-radius: 0 0 24px 24px;
  background: color-mix(in srgb, var(--search-surface) var(--header-glass-opacity, 100%), transparent) !important;
  color: var(--search-ink);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
  -webkit-backdrop-filter: blur(var(--header-glass-blur, 0px));
  backdrop-filter: blur(var(--header-glass-blur, 0px));
}

#search-dialog .form-input-wrapper {
  height: 48px;
  padding-inline: 16px 8px;
  border: 1px solid color-mix(in srgb, var(--search-ink) 26%, transparent) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--search-ink) 7%, transparent);
  color: var(--search-ink);
  box-shadow: none !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#search-dialog .form-input-wrapper:focus-within {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 28%, transparent) !important;
}

#search-dialog input[type="search"] {
  border: 0;
  outline: none;
  background: transparent !important;
  color: var(--search-ink) !important;
  font-size: 16px;
}

#search-dialog input[type="search"]::placeholder {
  color: color-mix(in srgb, var(--search-ink) 60%, transparent);
}

#search-dialog input[type="search"]::-webkit-search-cancel-button,
#search-dialog input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

#search-dialog [data-slot="icon"],
#search-dialog [data-search-clear] {
  color: color-mix(in srgb, var(--search-ink) 80%, transparent) !important;
}

#search-dialog [command="close"] {
  width: 40px;
  height: 40px;
  border: 1px solid color-mix(in srgb, var(--search-ink) 26%, transparent);
  border-radius: 999px;
  color: var(--search-ink);
  transition: background-color 0.2s ease;
}

#search-dialog [command="close"]:hover,
#search-dialog [command="close"]:focus-visible {
  background: color-mix(in srgb, var(--search-ink) 10%, transparent);
}

#search-dialog :is(.text-foreground, .text-muted, [data-search-all-link]) {
  color: var(--search-ink) !important;
}

#search-dialog .text-muted {
  opacity: 0.72;
}

#search-dialog .border-border-light {
  border-color: color-mix(in srgb, var(--search-ink) 16%, transparent) !important;
}

#search-dialog [data-search-products] {
  gap: 12px;
  padding-bottom: 6px;
  scrollbar-width: none;
}

#search-dialog [data-search-products]::-webkit-scrollbar {
  display: none;
}

#search-dialog [data-search-products] > a {
  width: clamp(150px, 42vw, 220px) !important;
}

#search-dialog [data-search-products] > a > div:first-child {
  border-radius: var(--product-card-border-radius, 16px);
}

.zid-kit-auth-dialog .MuiBackdrop-root {
  background: rgba(0, 0, 0, 0.45) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.zid-kit-auth-dialog .MuiPaper-root {
  border: 1px solid color-mix(in srgb, var(--foreground) 14%, transparent);
  border-radius: 20px !important;
  background: var(--background) !important;
  color: var(--foreground) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35) !important;
}

.zid-kit-auth-dialog .MuiPaper-root :is(.MuiDialogTitle-root, .MuiTypography-root, .MuiFormLabel-root, .MuiInputBase-input, .MuiInputAdornment-root, .MuiSvgIcon-root) {
  color: inherit !important;
}

.zid-kit-auth-dialog .MuiPaper-root .MuiTypography-body2 {
  opacity: 0.75;
}

.zid-kit-auth-dialog .MuiDialogContent-root div {
  background-color: transparent !important;
}

.zid-kit-auth-dialog .MuiDialogContent-root .MuiOutlinedInput-root {
  border-radius: 999px !important;
  background-color: color-mix(in srgb, var(--foreground) 7%, transparent) !important;
  color: inherit !important;
}

.zid-kit-auth-dialog .MuiOutlinedInput-notchedOutline {
  border: 1px solid color-mix(in srgb, var(--foreground) 28%, transparent) !important;
  border-radius: 999px !important;
}

.zid-kit-auth-dialog .Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 28%, transparent);
}

.zid-kit-auth-dialog .MuiFormLabel-root.Mui-focused {
  color: var(--primary) !important;
}

.zid-kit-auth-dialog .MuiButton-contained {
  border: 1px solid var(--primary) !important;
  border-radius: 999px !important;
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  box-shadow: none !important;
}

.zid-kit-auth-dialog .MuiButton-contained * {
  color: inherit !important;
}

.zid-kit-auth-dialog .MuiButton-contained:hover {
  filter: brightness(1.08);
}

.zid-kit-auth-dialog .MuiButton-contained.Mui-disabled {
  opacity: 0.55;
}

.zid-kit-auth-dialog .MuiButton-text,
.zid-kit-auth-dialog .MuiButton-outlined,
.zid-kit-auth-dialog .MuiLink-root {
  color: var(--primary) !important;
}

.zid-kit-auth-dialog .MuiButton-outlined {
  border-color: var(--primary) !important;
  border-radius: 999px !important;
}

.zid-kit-auth-dialog .MuiIconButton-root {
  border: 1px solid color-mix(in srgb, var(--foreground) 24%, transparent);
  color: inherit !important;
}