 /* Event Details Specific Styles */
 .event-header {
     position: relative;
     min-height: 400px;
     height: 65vh;
     max-height: 700px;
     overflow: hidden;
     margin-top: 80px;
 }

 .event-header-image {
     width: 100%;
     height: auto;
     object-fit: contain;
     object-position: center center;
     filter: brightness(0.71);
     background-color: #000;
 }

 .event-header-overlay {
     position: absolute;
     bottom: -10px;
     left: 0;
     right: 0;
     background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.7) 50%, transparent 100%);
     padding: 2rem 1.5rem 1.5rem 1.5rem;
     color: white;
 }

 /* Mobile adjustments */
 @media (max-width: 768px) {
     .event-header {
         min-height: 250px;
         height: 40vh;
         max-height: 400px;
         /* margin-top: 70px; */
     }

     .event-header-image {
         object-position: center 10%;
     }

     .event-header-overlay {
         padding: 0.5rem 1rem 0.75rem 1rem;
         background: linear-gradient(to top, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.6) 25%, rgba(0, 0, 0, 0.2) 50%, transparent 70%);
         padding-top: 0;
     }

     .event-header-overlay .container {
         padding-top: 0;
         margin-top: 0;
     }

     .event-header h1 {
         font-size: 1.5rem !important;
         line-height: 1.3;
         margin-bottom: 0.5rem !important;
     }

     .event-header .lead {
         font-size: 0.9rem;
         line-height: 1.4;
         margin-bottom: 0 !important;
     }

     .category-badge {
         font-size: 0.8rem !important;
         padding: 0.3rem 0.8rem !important;
         margin-bottom: 0.3rem !important;
     }
 }

 @media (max-width: 480px) {
     .event-header {
         min-height: 220px;
         height: 35vh;
         max-height: 350px;
     }

     .event-header h1 {
         font-size: 1.25rem !important;
     }

     .event-header .lead {
         font-size: 0.85rem;
     }

     .category-badge {
         font-size: 0.7rem !important;
         padding: 0.15rem 0.3rem;
         margin-bottom: 0.4rem !important;
     }
 }

 .category-badge {
     background: var(--primary-color);
     color: white;
     padding: 0.5rem 1rem;
     border-radius: 50px;
     font-size: 0.875rem;
     font-weight: 600;
     display: inline-flex;
     align-items: center;
     gap: 0.5rem;
     margin-bottom: 1rem;
 }

 .event-meta-card {
     background: var(--glass-bg);
     border: 1px solid var(--glass-border);
     border-radius: 15px;
     padding: 1.5rem;
     backdrop-filter: blur(10px);
     margin-bottom: 1.5rem;
 }

 .meta-item {
     display: flex;
     align-items: center;
     gap: 1rem;
     padding: 1rem 0;
     border-bottom: 1px solid var(--glass-border);
 }

 .meta-item:last-child {
     border-bottom: none;
 }

 .meta-icon {
     width: 50px;
     height: 50px;
     background: var(--primary-gradient);
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     color: white;
     font-size: 1.5rem;
     flex-shrink: 0;
 }

 .ticket-card {
     background: var(--glass-bg);
     border: 2px solid var(--glass-border);
     border-radius: 15px;
     padding: 1.5rem;
     margin-bottom: 1rem;
     transition: all 0.3s ease;
 }

 .ticket-card:hover {
     border-color: var(--primary-color);
     transform: translateY(-2px);
     box-shadow: 0 8px 20px rgba(99, 102, 241, 0.2);
 }

 .ticket-type-badge {
     background: #cf6bf7;
     color: white;
     padding: 0.25rem 0.75rem;
     border-radius: 20px;
     font-size: 0.75rem;
     font-weight: 600;
     text-transform: uppercase;
 }

 .ticket-price {
     font-size: 2rem;
     font-weight: 700;
     color: var(--primary-color);
 }

 .btn-buy-ticket {
     background: #6366f1;
     color: white;
     border: none;
     padding: 0.75rem 2rem;
     border-radius: 50px;
     font-weight: 600;
     transition: all 0.3s ease;
 }

 .btn-buy-ticket:hover {
     transform: scale(1.05);
     box-shadow: 0 8px 20px rgba(99, 102, 241, 0.4);
     color: white;
 }

 .map-container {
     width: 100%;
     height: 400px;
     border-radius: 15px;
     overflow: hidden;
     margin-top: 1.5rem;
 }

 .social-share {
     display: flex;
     gap: 10px;
     margin-top: 15px;
     flex-wrap: wrap;
 }

 .social-share-btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 8px 12px;
     font-size: 1.0rem;
     color: white;
     border-radius: 5px;
     text-decoration: none;
     transition: background-color 0.3s;
 }

 .social-share-btn i {
     font-size: 1.0rem;
 }

 .share-facebook {
     background-color: #4267B2;
 }

 .share-facebook:hover {
     background-color: #365899;
     color: #ccc;
 }

 .share-twitter {
     background-color: #1DA1F2;
 }

 .share-twitter:hover {
     background-color: #0a95dd;
     color: #ccc;
 }

 .share-whatsapp {
     background-color: #25D366;
 }

 .share-whatsapp:hover {
     background-color: #1ebe5d;
     color: #ccc;
 }

 .share-linkedin {
     background-color: #0A66C2;
 }

 .share-linkedin:hover {
     background-color: #084a8a;
     color: #ccc;
 }

 .share-instagram {
     background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
 }

 .share-instagram:hover {
     background: linear-gradient(45deg, #bc1888, #cc2366, #dc2743, #e6683c, #f09433);
     color: #ccc;
 }

 /* Event Description Responsive Content */
 .event-description {
     overflow-wrap: break-word;
     word-wrap: break-word;
 }

 .event-description img {
     max-width: 100% !important;
     height: auto !important;
     display: block;
     margin: 1rem 0;
     border-radius: 10px;
 }

 .event-description iframe {
     max-width: 100% !important;
     width: 100% !important;
     height: auto !important;
     aspect-ratio: 16 / 9;
     border-radius: 10px;
     margin: 1rem 0;
 }

 .event-description p {
     margin-bottom: 1rem;
 }

 .event-description h1,
 .event-description h2,
 .event-description h3 {
     margin-top: 1.5rem;
     margin-bottom: 1rem;
     font-weight: 600;
 }

 .event-description h1 {
     font-size: 1.5rem;
 }

 .event-description h2 {
     font-size: 1.3rem;
 }

 .event-description h3 {
     font-size: 1.1rem;
 }

 .event-description ul,
 .event-description ol {
     margin-left: 1.5rem;
     margin-bottom: 1rem;
 }

 .event-description table {
     width: 100%;
     max-width: 100%;
     overflow-x: auto;
     display: block;
     border-collapse: collapse;
     margin: 1rem 0;
 }

 .event-description table td,
 .event-description table th {
     padding: 0.5rem;
     border: 1px solid var(--glass-border);
 }

 /* Mobile adjustments for description */
 @media (max-width: 768px) {
     .event-description {
         font-size: 0.9rem !important;
     }

     .event-description h1 {
         font-size: 1.3rem;
     }

     .event-description h2 {
         font-size: 1.15rem;
     }

     .event-description h3 {
         font-size: 1rem;
     }

     .event-description iframe {
         height: 250px;
     }
 }

 @media (max-width: 480px) {
     .event-description {
         font-size: 0.85rem !important;
     }

     .event-description iframe {
         height: 200px;
     }
 }

 /* Event Store Animations */
 @keyframes pulse-glow {

     0%,
     100% {
         box-shadow: 0 0 20px rgba(99, 102, 241, 0.3);
     }

     50% {
         box-shadow: 0 0 30px rgba(168, 85, 247, 0.5);
     }
 }

 .event-meta-card:has(.bi-shop) {
     animation: pulse-glow 3s ease-in-out infinite;
 }

 /* Store button hover effects */
 .btn:has(.bi-bag-fill):hover {
     transform: translateY(-2px);
     transition: all 0.3s ease;
 }

 /* Shine effect on store banner */
 @keyframes shine {
     0% {
         background-position: -200% center;
     }

     100% {
         background-position: 200% center;
     }
 }

 .store-shine {
     background: linear-gradient(135deg,
             #6366f1 0%,
             #8b5cf6 25%,
             #a855f7 50%,
             #8b5cf6 75%,
             #6366f1 100%);
     background-size: 200% auto;
     animation: shine 3s linear infinite;
 }

 /* Emoji animation */
 @keyframes float-emoji {

     0%,
     100% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-10px);
     }
 }

 .event-meta-card div[style*="font-size: 4rem"] {
     animation: float-emoji 2s ease-in-out infinite;
 }

 /* Contact modal inputs color -> ensure subject is visible */
 #contactOrganizerModal .form-control {
     background: #0f1724;
     color: #ffffff;
     border-color: rgba(255, 255, 255, 0.08);
 }