/* URLTexter Brand Color Palette */
/* Use these CSS custom properties in your projects */

:root {
  /* Primary Brand Colors */
  --urltexter-red: #D73527;
  --urltexter-blue: #4A90E2;
  
  /* Neutral Colors */
  --white: #FFFFFF;
  --light-gray: #F8F9FA;
  --medium-gray: #E9ECEF;
  --dark-gray: #6C757D;
  --black: #212529;
  
  /* Accent Colors */
  --success-green: #28A745;
  --warning-orange: #FFC107;
  --commission-gold: #FFD700;
  --error-red: #DC3545;
  --info-blue: #17A2B8;
  
  /* Gradient Combinations */
  --primary-gradient: linear-gradient(135deg, #D73527 0%, #4A90E2 100%);
  --light-gradient: linear-gradient(135deg, #F8F9FA 0%, #E9ECEF 100%);
  
  /* Text Colors */
  --text-primary: #212529;
  --text-secondary: #6C757D;
  --text-muted: #666666;
  --text-light: rgba(255, 255, 255, 0.8);
  
  /* Background Colors */
  --bg-primary: #FFFFFF;
  --bg-secondary: #F8F9FA;
  --bg-tertiary: #E9ECEF;
  --bg-dark: #212529;
  
  /* Border Colors */
  --border-light: #E9ECEF;
  --border-medium: #6C757D;
  --border-dark: #212529;
  
  /* Shadow Colors */
  --shadow-light: rgba(0, 0, 0, 0.1);
  --shadow-medium: rgba(0, 0, 0, 0.2);
  --shadow-dark: rgba(0, 0, 0, 0.3);
}

/* Color Classes for Easy Implementation */

/* Background Colors */
.bg-urltexter-red { background-color: var(--urltexter-red); }
.bg-urltexter-blue { background-color: var(--urltexter-blue); }
.bg-primary-gradient { background: var(--primary-gradient); }
.bg-light { background-color: var(--light-gray); }
.bg-white { background-color: var(--white); }
.bg-dark { background-color: var(--black); }

/* Text Colors */
.text-urltexter-red { color: var(--urltexter-red); }
.text-urltexter-blue { color: var(--urltexter-blue); }
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }
.text-white { color: var(--white); }

/* Border Colors */
.border-urltexter-red { border-color: var(--urltexter-red); }
.border-urltexter-blue { border-color: var(--urltexter-blue); }
.border-light { border-color: var(--border-light); }

/* Hover States */
.hover-urltexter-red:hover { background-color: #b82a1f; }
.hover-urltexter-blue:hover { background-color: #357abd; }

/* Color Accessibility Information */
/*
Color Contrast Ratios (WCAG AA Compliance):
- URLTexter Red (#D73527) on White: 5.2:1 ✓
- URLTexter Blue (#4A90E2) on White: 3.1:1 ⚠️ (use with caution for text)
- Dark Gray (#6C757D) on White: 4.6:1 ✓
- Black (#212529) on White: 16.6:1 ✓
- White on URLTexter Red: 5.2:1 ✓
- White on URLTexter Blue: 3.1:1 ⚠️
- White on Black: 16.6:1 ✓

Recommendations:
- Use URLTexter Blue for large text or backgrounds only
- For small text, use URLTexter Red or Black for best accessibility
- Always test color combinations for sufficient contrast
*/

/* Print Styles */
@media print {
  :root {
    /* Convert colors to print-friendly versions */
    --urltexter-red: #000000;
    --urltexter-blue: #000000;
    --primary-gradient: none;
  }
  
  .bg-primary-gradient {
    background: #F8F9FA !important;
    border: 1px solid #212529 !important;
  }
}

/* Color Swatches for Reference */
/*
Primary Red (#D73527):
RGB: 215, 53, 39
HSL: 5°, 69%, 50%
CMYK: 0%, 75%, 82%, 16%

Primary Blue (#4A90E2):
RGB: 74, 144, 226
HSL: 212°, 72%, 59%
CMYK: 67%, 36%, 0%, 11%
*/