/* colors.css */

/* Light Mode (default) */
:root {
  --main-bg: #ffffff;
  --sec-bg: #d6d6d6;

  --main-font: black;
  --sec-font: #7c7c7c;

  --akzent: #00c8c8; /*#00c8c8 oder #008a8a*/

  --instagram: #c13584;
  --snapchat: #fffc00;
  --tiktok: black;
  --facebook: #3b5998;
  --youtube: red;

  --shadow: black;
  --warn: #e74c3c;
  --readonly-bg: #e9ecef;
  --readonly-font: #6c757d;
  --label-club-bg: rgba(79, 70, 229, 0.12);
  --label-club-text: #4338ca;
  --label-bar-bg: rgba(245, 158, 11, 0.18);
  --label-bar-text: #92400e;
  /* Kompatibel mit Web-UI */
  --button-text: white;
  --card-shadow: rgba(0, 0, 0, 0.2);
  --card-shadow-hover: rgba(0, 0, 0, 0.4);
}

/* Dark Mode */
[data-theme="dark"] {
  --main-bg: #121212;
  --sec-bg: #333333;

  --main-font: white;
  --sec-font: #aaa;

  --akzent: #00c8c8;

  --instagram: #c13584;
  --snapchat: #fffc00;
  --tiktok: white;
  --facebook: #3b5998;
  --youtube: red;

  --shadow: black;
  --warn: #e74c3c;

  --label-club-bg: rgba(79, 70, 229, 0.18);
  --label-club-text: #a5b4fc;
  --label-bar-bg: rgba(245, 158, 11, 0.22);
  --label-bar-text: #fbbf24;

  --button-text: white;
  --card-shadow: rgba(0, 0, 0, 0.3);
  --card-shadow-hover: rgba(0, 0, 0, 0.5);
}