:root {
  --primary: #667eea;
  --secondary: #7257b3;
  --accent: #cbd5e1;
  --header-bg: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
  --button-bg: #fff;
  --button-active-bg: var(--secondary);
  --button-hover-bg: #e6eaff;
  --button-text: var(--primary);
  --button-active-text: #fff;
  --app-version: var(--accent);

  /* Add these: */
  --btn-primary: #667eea;
  --btn-primary-hover: #5a67d8;
  --btn-secondary: #f3f3f3;
  --btn-secondary-hover: #e2e8f0;
  --btn-secondary-text: #666;
  --btn-danger: #ef4444;
  --btn-danger-hover: #dc2626;
  --btn-green: #22c55e;
  --btn-green-hover: #16a34a;

  --error: #e53e3e;
  --error-bg: rgba(255, 107, 107, 0.1);

  --form-bg: #fff;
  --form-shadow: #667eea22;
  --form-heading: #667eea;
  --form-label: #444;
  --form-input-bg: #f8fafc;
  --form-input-border: #cbd5e1;
  --form-loading: #666;

  --list-bg: #fff5;
  --list-item-bg: #f8fafc;
  --list-item-border-good: #38c172;
  --list-item-border-bad: #e53e3e;
  --list-item-bg-good: #f0fff4;
  --list-item-bg-bad: #fff5f5;
  --list-image-bg: #eee;
  --delete-btn-hover-bg: #ffeaea;
  --delete-btn-hover-shadow: #ef444422;
  --checkbox-accent: #667eea;
  --list-loading-color: #888;

  --modal-bg: #fff;
  --modal-text: #222;
  --modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
  --dialog-message: #444;
  --dialog-child-name: #667eea;
  --info-image-bg: #eee;
  --info-points: #667eea;
  --loading-color: #fff;

  /* ChildrenListView styles */
  --card-bg: #fff;
  --card-title: #333;
  --card-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  --kebab-icon-color: #666;
  --kebab-menu-bg: #f7fafc;
  --kebab-menu-border: #bcc1c9;
  --kebab-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.18), 0 1.5px 6px rgba(102, 126, 234, 0.08);
  --kebab-menu-blur: 11px;
  --menu-item-color: #333;
  --menu-item-hover-bg: rgba(0, 0, 0, 0.04);
  --menu-item-danger: #ff4d4f;
  --modal-bg: #fff;
  --modal-text: #222;
  --modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
  --fab-bg: #667eea;
  --fab-hover-bg: #5a67d8;
  --fab-active-bg: #4c51bf;
  --no-children-color: #fdfdfd;
  --sub-message-color: #b5ccff;
  --sign-in-btn-bg: #fff;
  --sign-in-btn-color: #2563eb;
  --sign-in-btn-border: #2563eb;
  --sign-in-btn-hover-bg: #2563eb;
  --sign-in-btn-hover-color: #fff;
  --child-image-bg: #fff;
  --age-color: #666;
  --points-color: #444;

  /* Image Picker styles */
  --icon-btn-bg: #f3f3f3;
  --icon-btn-color: #667eea;
  --icon-btn-shadow: 0 2px 8px rgba(102, 126, 234, 0.07);
  --selectable-image-border: #e6e6e6;
  --selectable-image-bg: #fafbff;
  --selectable-image-selected: #667eea;
  --loading-text: #888;
  --modal-bg: #fff;
  --modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);

  /* ChildDetailCard color variables */
  --detail-card-bg: #fff;
  --detail-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.13);

  --child-name-color: #333;
  --child-age-color: #666;

  --points-label-color: #888;
  --points-value-color: #667eea;

  /* ChildEditView styles */
  --form-label-color: #333;
  --form-input-bg: #fafbff;
  --form-input-border: #e6e6e6;
  --form-input-color: #222;
  --form-input-focus: #667eea;

  /*Reward/Task Assignment styles*/
  --assign-heading-color: #ffffff;
  --assign-no-items-color: #fdfdfd;
  --assign-sub-message-color: #b5ccff;
  --assign-create-btn-bg: #fff;
  --assign-create-btn-color: #2563eb;
  --assign-create-btn-border: #2563eb;
  --assign-create-btn-hover-bg: #2563eb;
  --assign-create-btn-hover-color: #fff;

  --notification-reward-name: #ef4444;

  /* ChildLists styles */
  --child-list-bg: rgba(255, 255, 255, 0.1);
  --child-list-title-color: #fff;
  --child-list-loading-color: #fff;
  --child-list-scrollbar-track: rgba(255, 255, 255, 0.05);
  --child-list-scrollbar-thumb: linear-gradient(
    180deg,
    rgba(102, 126, 234, 0.8),
    rgba(118, 75, 162, 0.8)
  );
  --child-list-scrollbar-thumb-hover: linear-gradient(
    180deg,
    rgba(102, 126, 234, 1),
    rgba(118, 75, 162, 1)
  );
  --child-list-scrollbar-thumb-border: 2px solid rgba(255, 255, 255, 0.08);

  --item-card-bg: rgba(255, 255, 255, 0.12);
  --item-card-border: 1px solid rgba(255, 255, 255, 0.08);
  --item-card-good-border: rgba(46, 204, 113, 0.9);
  --item-card-good-bg: rgba(46, 204, 113, 0.06);
  --item-card-bad-border: rgba(255, 99, 71, 0.95);
  --item-card-bad-bg: rgba(255, 99, 71, 0.03);
  --item-card-ready-shadow: 0 0 0 3px #667eea88, 0 0 12px #667eea44;
  --item-card-ready-border: #667eea;
  --item-card-hover-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);

  --item-name-color: #fff;

  --item-points-color: #ffd166;
  --item-points-shadow:
    -1px -1px 0 #1a3d1f, 1px -1px 0 #1a3d1f, -1px 1px 0 #1a3d1f, 1px 1px 0 #1a3d1f;
  --item-points-ready-color: #38c172;

  --pending-block-bg: #222b;
  --pending-block-color: #62ff7a;

  /* TaskEditView styles */
  --toggle-btn-bg: #f3f3f3;
  --toggle-btn-color: #444;
  --toggle-btn-border: #cbd5e1;

  --toggle-btn-good-bg: #38c172;
  --toggle-btn-good-color: #fff;
  --toggle-btn-good-shadow: #38c17233;
  --toggle-btn-good-border: #38c172;

  --toggle-btn-bad-bg: #e53e3e;
  --toggle-btn-bad-color: #fff;
  --toggle-btn-bad-shadow: #e53e3e33;
  --toggle-btn-bad-border: #e53e3e;
}