/**
 * shadcn/ui design tokens for Curbwaxers member section only
 * Loaded only on member pages (profile, wijzig-profiel, account-instellingen, create-post, submit-event)
 * Adapted for dark theme with lime accent
 */

body.cw-member-page {
  /* shadcn design tokens - Curbwaxers dark theme */
  --radius: 0.5rem;
  --radius-lg: 0.75rem;
  --background: #1a1a18;
  --foreground: #ffffff;
  --card: rgba(26, 26, 24, 0.6);
  --card-foreground: #ffffff;
  --popover: #1a1a18;
  --popover-foreground: #ffffff;
  --primary: #CCFF58;
  --primary-foreground: #1a1a18;
  --secondary: #4a4d52;
  --secondary-foreground: #ffffff;
  --muted: #4a4d52;
  --muted-foreground: #ffffff;
  --accent: #4a4d52;
  --accent-foreground: #CCFF58;
  --destructive: #dc2626;
  --destructive-foreground: #ffffff;
  --border: #4a4d52;
  --input: #4a4d52;
  --ring: rgba(204, 255, 88, 0.5);
}

/* shadcn-style components for member section */
body.cw-member-page .cw-member-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--border);
  background-color: var(--card);
  padding: 1.5rem;
  transition: border-color 0.2s, background-color 0.2s;
}

body.cw-member-page a.cw-member-card:hover {
  border-color: rgba(204, 255, 88, 0.5);
  background-color: var(--background);
}

body.cw-member-page .cw-member-card h3 {
  color: var(--foreground);
  font-weight: 600;
  margin: 0 0 0.5rem 0;
}

body.cw-member-page a.cw-member-card:hover h3 {
  color: var(--primary);
}

body.cw-member-page .cw-member-card p {
  color: var(--muted-foreground);
  font-size: 0.875rem;
  margin: 0;
}

body.cw-member-page .cw-member-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background-color: rgba(26, 26, 24, 0.8);
  color: var(--muted-foreground);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s, background-color 0.2s, color 0.2s;
}

body.cw-member-page .cw-member-nav-link:hover {
  background-color: rgba(74, 77, 82, 0.3);
  color: var(--primary);
  border-color: rgba(204, 255, 88, 0.5);
}

body.cw-member-page .cw-member-nav-link[aria-current="page"] {
  border-color: var(--primary);
  color: var(--primary);
}

body.cw-member-page .cw-member-input {
  height: 2.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius);
  border: 1px solid var(--input);
  background-color: var(--background);
  color: var(--foreground);
  font-size: 0.875rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}

body.cw-member-page .cw-member-input:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 2px var(--ring);
}

body.cw-member-page .cw-member-input::placeholder {
  color: var(--muted-foreground);
}

body.cw-member-page .cw-member-textarea {
  min-height: 6rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius);
  border: 1px solid var(--input);
  background-color: var(--background);
  color: var(--foreground);
  font-size: 0.875rem;
  font-family: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
}

body.cw-member-page .cw-member-textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 2px var(--ring);
}

body.cw-member-page .cw-member-textarea::placeholder {
  color: var(--muted-foreground);
}

body.cw-member-page .cw-member-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.5rem;
  padding: 0 1.5rem;
  border-radius: var(--radius);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s, background-color 0.2s;
}

body.cw-member-page .cw-member-btn-primary {
  background-color: var(--primary);
  color: var(--primary-foreground);
  border: none;
}

body.cw-member-page .cw-member-btn-primary:hover {
  opacity: 0.9;
}

body.cw-member-page .cw-member-btn-outline {
  background-color: transparent;
  border: 1px solid var(--border);
  color: var(--foreground);
}

body.cw-member-page .cw-member-btn-outline:hover {
  background-color: rgba(74, 77, 82, 0.3);
}

body.cw-member-page .cw-member-btn-destructive {
  background-color: transparent;
  border: 1px solid rgba(220, 38, 38, 0.6);
  color: #f87171;
}

body.cw-member-page .cw-member-btn-destructive:hover {
  background-color: rgba(220, 38, 38, 0.2);
}

body.cw-member-page .cw-member-label {
  color: var(--primary);
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 0.25rem;
}

body.cw-member-page .cw-member-alert {
  padding: 1rem;
  border-radius: var(--radius);
  font-size: 0.875rem;
}

body.cw-member-page .cw-member-alert-destructive {
  border: 1px solid rgba(220, 38, 38, 0.5);
  background-color: rgba(220, 38, 38, 0.1);
  color: #f87171;
}

body.cw-member-page .cw-member-alert-success {
  border: 1px solid rgba(204, 255, 88, 0.5);
  background-color: rgba(204, 255, 88, 0.1);
  color: var(--primary);
}

/* WYSIWYG editor - lime theme */
body.cw-member-page .cw-member-editor .wp-editor-container {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

body.cw-member-page .cw-member-editor .wp-editor-wrap {
  border: none;
}

body.cw-member-page .cw-member-editor .mce-toolbar-grp,
body.cw-member-page .cw-member-editor .mce-panel {
  background: #1a1a18 !important;
  border-color: var(--border) !important;
}

body.cw-member-page .cw-member-editor .mce-btn button,
body.cw-member-page .cw-member-editor .mce-btn .mce-ico {
  color: var(--primary) !important;
}

body.cw-member-page .cw-member-editor .mce-btn:hover button,
body.cw-member-page .cw-member-editor .mce-btn:hover .mce-ico,
body.cw-member-page .cw-member-editor .mce-btn.mce-active button,
body.cw-member-page .cw-member-editor .mce-btn.mce-active .mce-ico {
  color: #1a1a18 !important;
}

body.cw-member-page .cw-member-editor .mce-btn:hover {
  background: rgba(204, 255, 88, 0.2) !important;
}

body.cw-member-page .cw-member-editor .mce-btn.mce-active {
  background: var(--primary) !important;
}

body.cw-member-page .cw-member-editor .qt-dfw {
  color: var(--primary) !important;
  border-color: var(--border) !important;
  background: #1a1a18 !important;
}

body.cw-member-page .cw-member-editor .wp-editor-area {
  background: #1a1a18 !important;
  color: #ffffff !important;
  border-color: var(--border) !important;
}

body.cw-member-page .cw-member-editor .wp-media-buttons .button {
  background: var(--primary) !important;
  color: #1a1a18 !important;
  border-color: var(--primary) !important;
}

body.cw-member-page .cw-member-editor .wp-media-buttons .button:hover {
  opacity: 0.9;
}