/* YouTube Logo Compliance CSS */
/* CRITICAL: Follow YouTube branding guidelines exactly */

/* YouTube Logo Container - Proper clear space */
.youtube-logo-container {
  /* Clear space = triangle size in icon */
  padding: 1em;
  display: inline-block;
  position: relative;
}

/* YouTube Logo - Official usage */
.youtube-logo {
  /* REQUIRED: No color changes, stretching, or effects */
  filter: none !important;
  transform: none !important;
  mix-blend-mode: normal !important;
  
  /* REQUIRED: No rotation or flipping */
  transform-origin: center !important;
  
  /* REQUIRED: Proper sizing */
  max-width: none;
  height: auto;
}

/* YouTube Icon - Official usage */
.youtube-icon {
  /* REQUIRED: No color changes, stretching, or effects */
  filter: none !important;
  transform: none !important;
  mix-blend-mode: normal !important;
  
  /* REQUIRED: No rotation or flipping */
  transform-origin: center !important;
  
  /* REQUIRED: Clear space = triangle size */
  margin: calc(1em) !important;
}

/* PROHIBITED: Logo on red backgrounds - use monochrome version */
.red-background .youtube-logo-color,
.red-background .youtube-icon-color {
  display: none !important;
}

.red-background .youtube-logo-monochrome,
.red-background .youtube-icon-monochrome {
  display: block !important;
}

/* PROHIBITED: Any effects on YouTube logos */
.youtube-logo,
.youtube-icon {
  /* No shadows */
  box-shadow: none !important;
  
  /* No glow effects */
  filter: none !important;
  
  /* No color changes */
  filter: brightness(1) contrast(1) saturate(1) !important;
  
  /* No opacity changes */
  opacity: 1 !important;
}

/* PROHIBITED: Partial covering with text/graphics */
.youtube-logo-container,
.youtube-icon-container {
  /* Ensure no overlapping elements */
  z-index: 1;
  position: relative;
}

/* PROHIBITED: Using in phrases or sentences */
.youtube-logo-inline,
.youtube-icon-inline {
  /* Ensure proper spacing */
  margin: 0 0.25em;
  vertical-align: middle;
}

/* REQUIRED: Link to YouTube content */
.youtube-logo-link,
.youtube-icon-link {
  display: inline-block;
  text-decoration: none;
}

.youtube-logo-link:hover,
.youtube-icon-link:hover {
  /* Minimal hover effect - no color changes */
  opacity: 0.9;
}

/* PROHIBITED: Placing image within logo */
.youtube-logo img,
.youtube-icon img {
  /* No nested images */
  display: none !important;
}

/* PROHIBITED: Stretching or distorting */
.youtube-logo img,
.youtube-icon img {
  /* Maintain aspect ratio */
  object-fit: contain;
  width: auto;
  height: auto;
}

/* Dark theme support */
.dark-theme .youtube-logo-color,
.dark-theme .youtube-icon-color {
  display: none;
}

.dark-theme .youtube-logo-monochrome,
.dark-theme .youtube-icon-monochrome {
  display: block;
}

/* Light theme support */
.light-theme .youtube-logo-monochrome,
.light-theme .youtube-icon-monochrome {
  display: none;
}

.light-theme .youtube-logo-color,
.light-theme .youtube-icon-color {
  display: block;
}

/* Responsive design */
@media (max-width: 768px) {
  .youtube-logo-container,
  .youtube-icon-container {
    /* Maintain clear space on mobile */
    padding: 0.5em;
  }
  
  .youtube-logo,
  .youtube-icon {
    /* Scale appropriately */
    max-width: 100%;
    height: auto;
  }
}

/* Accessibility */
.youtube-logo[alt],
.youtube-icon[alt] {
  /* Ensure alt text is present */
  alt: "YouTube";
}

/* Print styles */
@media print {
  .youtube-logo,
  .youtube-icon {
    /* Ensure visibility in print */
    filter: none !important;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
  }
} 