:root {
    --primary-color: #22b0af;
    --secondary-color: #4CAF50;
    --text-color: #333;
    --background-color: #f5f5f5;
  }
  
  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  ::-webkit-scrollbar {
    width: 5px;
  }
  
  ::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  
  ::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background-color: #555;
  }
  
  body {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
      'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
      sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
      monospace;
  }

#eventContainer {
    width: 100%;
    max-width: 1230px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    padding: 15px;
}

/* Skeleton loader for the event list — mirrors .eb-event-card layout */
.eb-skeleton-card {
    width: 25%;
    padding: 8px;
    box-sizing: border-box;
}
@media (max-width: 1024px) { .eb-skeleton-card { width: 33.333%; } }
@media (max-width: 767px)  { .eb-skeleton-card { width: 50%; } }
@media (max-width: 575px)  { .eb-skeleton-card { width: 100%; } }
.eb-skeleton-card-content {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 4px;
    overflow: hidden;
}
.eb-skeleton-thumb { width: 100%; height: 170px; }
.eb-skeleton-details { padding: 12px; }
.eb-skeleton-line { height: 12px; border-radius: 4px; margin-bottom: 10px; }
.eb-skeleton-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
}
.eb-skeleton-btn { width: 80px; height: 32px; border-radius: 20px; }
.eb-shimmer {
    background: #eee;
    background-image: linear-gradient(90deg, #eee 0px, #f5f5f5 40px, #eee 80px);
    background-size: 600px 100%;
    animation: eb-shimmer 1.4s infinite linear;
}
@keyframes eb-shimmer {
    0%   { background-position: -300px 0; }
    100% { background-position: 300px 0; }
}