.list-categories li{
    margin-bottom: 12px;
    font-size: 15px;
 }



.search-box {
   margin-bottom: 20px;
   position: relative;
}

.list-performers {
   list-style: none;
   padding: 0;
}



.is-performer {
   display: flex;
   align-items: center;
   margin-bottom: 15px;
   padding: 10px;
   border-bottom: 1px solid #f1f1f1;
   border-radius: 8px;
   margin: 0;
   padding: 0;
}
li.is-performer a.link-wrapper {
   position: relative;
   width: 100%;
   display: block;
   height: 100%;
   padding: 24px 12px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}


.performer-avatar {
   width: 48px;
   height: 48px;
   border-radius: 50%;
   position:absolute;

}

.performer-info {
   margin-left: 72px;
}

.is-performer strong {
   font-size: 15px;
   margin-bottom: 5px;
   display: block;
}




.list-performers li.is-performer:hover {
   cursor: pointer;
   webkit-box-shadow: 0 2px 4px rgba(0,0,0,.2);
   -moz-box-shadow: 0 2px 4px rgba(0,0,0,.2);
   box-shadow: 0 2px 4px rgb(0 0 0/20%);
   border: 1px solid #E5E5E5;
   transition: box-shadow 200ms ease-out 0s;
   z-index: 1
}

.list-performers li.is-performer strong:hover {
   text-decoration: underline
}



.item-card .img-contain{
   position: relative;
}
.item-card .img-contain .mask{
   position: absolute;
   z-index: 4;
   background: rgb(0 0 0 / 70%);
   color: white;
   text-align:center;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 500;
   font-size: clamp(0.5rem, 2vw, 1.3rem);
   padding: 8px;
}


.search-box {
   margin: 16px 0;
   display: flex;
}

#search-input {
   width: 100%;
   padding: 16px 16px;
   border-radius: 36px;
   background-color: #F1F1F1;
   outline: none;
   transition: all 0.3s ease;
   font-size: 15px;
   line-height: 24px;
   height: 56px;
   border: none;   
}
#search-input::placeholder{
   color: #888;
   opacity: 1;
}

#search-input:focus {
   box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
   background-color: #f8f8f8;
}



.spinner {
   display: inline-block;
   width: 80px;
   height: 80px;
   border: 8px solid rgba(0, 0, 0, 0.1);
   border-radius: 50%;
   border-top-color: #007bff;
   animation: spin 1s linear infinite;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
}

@keyframes spin {
   to { transform: rotate(360deg); }
}


#more-information{
   max-width: 700px;
}

#more-information h3{
   font-weight: 500;
}




.nearby-events-fallback {
   display: flex;
   align-items: center;
   justify-content: center;
   height: 160px;
   border-radius: 20px;
   border: 10px solid white;
   background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('/assets/images/city-backer.jpg') center / cover;
   color: white !important;
   font-size: 18px;
   text-decoration: none;
   height: clamp(160px, 30vw, 220px);
}

.nearby-events-fallback [data-is='icon'] {
   margin-right: 8px;
}