/**
 * colors.css - Zentrale Farbdefinitionen für Mallorca-Zeitung.News
 * Alle Farben sind als CSS Custom Properties definiert
 * Logo-Farben gemäß logo-briefing.md:
 * - Mediterran-Blau: #2B5AA0
 * - Sonnen-Gold: #F4B942
 * - Olivgrün: #8B9D57
 * Light Mode / Tageslicht-Design mit hellen Hintergründen
 */

:root {
  /* Hintergrundfarben (Light Mode / Tageslicht-Design) */
  --color-bg-primary: #FFFFFF;
  --color-bg-secondary: #F8F9FA;
  --color-bg-tertiary: #F0F2F5;
  --color-bg-hover: #E9ECEF;
  
  /* Text-Farben (Dunkel für gute Lesbarkeit) */
  --color-text-primary: #1A1A1A;
  --color-text-secondary: #4A4A4A;
  --color-text-tertiary: #6C757D;
  --color-text-inverted: #FFFFFF;
  
  /* Akzentfarben (Primärfarben aus Logo gemäß logo-briefing.md) */
  --color-accent-blue: #2B5AA0; /* Mediterran-Blau */
  --color-accent-yellow: #F4B942; /* Sonnen-Gold */
  --color-accent-green: #8B9D57; /* Olivgrün */
  --color-accent-gold: #FFD700; /* Goldene Akzente gemäß design.md Regel 006 */
  --color-primary: #2B5AA0;
  --color-primary-hover: #1E3F70; /* Dunkleres Blau für Hover */
  
  /* Navigation und Header */
  --color-nav-bg: #FFFFFF;
  --color-nav-text: #1A1A1A;
  --color-nav-hover: #2B5AA0; /* Mediterran-Blau */
  --color-nav-active: #2B5AA0; /* Mediterran-Blau */
  
  /* Funktionale Farben (gemäß design.md) */
  --color-success: #28A745; /* Erfolg-Grün aus design.md */
  --color-success-bg: rgba(40, 167, 69, 0.1);
  --color-error: #DC3545; /* Fehler-Rot aus design.md */
  --color-error-bg: rgba(220, 53, 69, 0.1);
  --color-error-05: rgba(220, 53, 69, 0.05);
  --color-error-08: rgba(220, 53, 69, 0.08);
  --color-error-15: rgba(220, 53, 69, 0.15);
  --color-error-3: rgba(220, 53, 69, 0.3);
  --color-danger: #DC3545;
  --color-warning: #FFC107; /* Warnung-Orange aus design.md */
  --color-warning-bg: rgba(255, 193, 7, 0.1);
  --color-info: #17A2B8; /* Info-Cyan aus design.md */
  --color-info-bg: rgba(23, 162, 184, 0.1);
  
  /* Buttons */
  --color-button-primary-bg: #2B5AA0; /* Mediterran-Blau */
  --color-button-primary-text: #FFFFFF;
  --color-button-primary-hover: #1E3F70; /* Dunkleres Blau */
  --color-button-secondary-bg: transparent;
  --color-button-secondary-border: #2B5AA0; /* Mediterran-Blau */
  --color-button-secondary-text: #2B5AA0; /* Mediterran-Blau */
  --color-button-secondary-hover: rgba(43, 90, 160, 0.1);
  --color-button-delete-bg: #DC3545;
  --color-button-delete-text: #FFFFFF;
  --color-button-delete-hover: #DC3545;
  
  /* Links */
  --color-link: #2B5AA0; /* Mediterran-Blau */
  --color-link-hover: #F4B942; /* Sonnen-Gold */
  --color-link-visited: #2B5AA0; /* Mediterran-Blau */
  
  /* Rahmen und Trennlinien */
  --color-border: #DEE2E6;
  --color-border-light: #E9ECEF;
  
  /* Schatten */
  --shadow-small: 0 2px 4px rgba(0, 0, 0, 0.1);
  --shadow-medium: 0 4px 8px rgba(0, 0, 0, 0.15);
  --shadow-large: 0 8px 16px rgba(0, 0, 0, 0.2);
  
  /* Transparente Farben für Effekte */
  --color-accent-blue-05: rgba(43, 90, 160, 0.05);
  --color-accent-blue-08: rgba(43, 90, 160, 0.08);
  --color-accent-blue-1: rgba(43, 90, 160, 0.1);
  --color-accent-blue-2: rgba(43, 90, 160, 0.2);
  --color-accent-blue-3: rgba(43, 90, 160, 0.3);
  --color-accent-blue-5: rgba(43, 90, 160, 0.5);
  --color-accent-yellow-1: rgba(244, 185, 66, 0.1);
  --color-accent-yellow-2: rgba(244, 185, 66, 0.2);
  --color-accent-green-1: rgba(139, 157, 87, 0.1);
  --color-accent-green-2: rgba(139, 157, 87, 0.2);
  --color-white-2: rgba(255, 255, 255, 0.2);
  --color-white-3: rgba(255, 255, 255, 0.3);
  --color-black-1: rgba(0, 0, 0, 0.1);
  
  /* Tabellen */
  --color-table-header-bg: #F8F9FA;
  --color-table-header-text: #1A1A1A;
  --color-table-row-bg: #FFFFFF;
  --color-table-row-alt-bg: #F8F9FA;
  --color-table-row-hover: #E9ECEF;
  --color-table-border: #DEE2E6;
  
  /* Code-Blöcke und Technische Darstellungen */
  --color-code-bg: #1A1A1A;
  --color-code-text: #F8F8F2;
  
  /* Social-Media-Farben */
  --color-social-facebook: #1b74e4;
  --color-social-instagram-start: #f09433;
  --color-social-instagram-mid1: #e6683c;
  --color-social-instagram-mid2: #dc2743;
  --color-social-instagram-end: #cc2366;
  --color-social-twitter: #1d9bf0;
  --color-social-tiktok: #111111;
}
