/* Custom styles for The Byline website */

/* Custom scrollbar */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Prevent horizontal scroll */
html,
body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Mobile modal fixes */
@media (max-width: 640px) {
  .modal-content {
    margin: 1rem;
    max-height: 85vh;
    width: calc(100vw - 2rem);
  }
}

/* Text shadows */
.text-shadow-lap-device {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

@media (min-width: 768px) {
  .md\:text-shadow-med-device {
    text-shadow: 10px -2px 3.5px rgb(0 0 0 / 0.20);
  }
}

/* Article content styles */
.article-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.9rem;
}

.article-content th,
.article-content td {
  border: 1px solid #ddd;
  padding: 0.75rem;
  text-align: left;
}

.article-content th {
  background-color: #f8f9fa;
  font-weight: 600;
}

/* Custom animations */
@keyframes scroll {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

@keyframes fadeIn {
  0% { opacity: 0; transform: translateY(-10px); }
  100% { opacity: 1; transform: translateY(0); }
}

.animate-scroll {
  animation: scroll 40s linear infinite;
}

.animate-fadeIn {
  animation: fadeIn 0.8s ease-out forwards;
}

/* Custom color utilities */
.bg-byline-dark {
  background-color: #1a1a2e;
}

.text-byline-red {
  color: #B91C1C;
}

.bg-byline-light {
  background-color: #FEE2E2;
}

.text-byline-yellow {
  color: #FEB300;
}

/* Responsive utilities */
@media (max-width: 768px) {
  .mobile-hidden {
    display: none;
  }
}

@media (min-width: 769px) {
  .desktop-hidden {
    display: none;
  }
}

/* Image credit styling */
.image-credit {
  font-style: italic;
  background-color: rgba(0, 0, 0, 0.05);
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  margin-top: -4px;
}