.jox-artrade-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 30px; margin-top: 40px; width: 100%; min-width: 100%; max-width: 100%; }

.jox-artrade-form { width: 100%; }
.jox-artrade-form .jox-artrade-fields { display: flex; justify-content: space-between; gap: 5px; flex-wrap: wrap; }
/* Form Elements */
.jox-artrade-form select { padding: 8px; border: 0; border-bottom: 1px solid #666; border-radius: 0px; background: transparent; color: #fff; width: 46%; font-size: 1.2rem; font-weight: 300; }
.jox-artrade-form select:has(option[selected]), .jox-artrade-form select option:checked, .jox-artrade-form select:focus{ color: var(--e-global-color-accent); }
.jox-artrade-form input { padding: 8px; border: 1px solid #ccc; border-radius: 6px; background: transparent; color: #fff; }
.jox-artrade-form input:not([value=""]), .jox-artrade-form input:not(:placeholder-shown)  { color: var(--e-global-color-accent); }
.jox-artrade-form select option { color: #ccc; background-color: #000; }
.jox-artrade-form button { padding: 10px 14px; border: 1px solid #ccc; cursor: pointer; }
.jox-artrade-results{margin-top:40px; font-weight: 300; font-size: 1.5rem; color: #FFF;}
.jox-artrade-noresults{margin-top:40px; font-weight: 300; font-size: 1.5rem; color: var(--e-global-color-accent)}
/* Form specifics */
.jox-artrade-form .jox-artrade-reset { padding: 10px 14px; border: 1px solid #ccc; text-decoration: none; display: inline-block; color:#ccc;}
.jox-artrade-checkbox { margin-top: 5px; font-family: var(--e-global-typography-primary-font-family); margin-right: auto; color: #fff; width: 50%; padding-left: 10px; display: flex; align-items: center; gap: 10px; font-size: 1.5rem; font-weight: 300; }
.jox-artrade-checkbox:has(input:checked) { color: var(--e-global-color-accent); }
.jox-artrade-submit { margin-top: 5px; font-family: "Helvetica Neue", sans-serif !important; border-radius: 0px; }
.jox-artrade-submit[disabled] { background-color: #333; }
.jox-artrade-reset { margin-top: 5px; font-family: "Helvetica Neue", sans-serif !important; border-radius: 0px; padding: 10px 14px; border: 1px solid #ccc; text-decoration: none; display: inline-block; }
.jox-artrade-form input[type=text] { border-radius: 0px; width: 46%; border: 0; border-bottom: 1px solid #666;  font-weight: 300; font-size: 1.2rem }
.jox-artrade-form input::placeholder { color: #ffffff; }
@media (min-width: 1024px){
  .jox-artrade-form select, .jox-artrade-form input[type=text]{ width: 22%; font-size: 1.5rem;}
}
/* Grid */
/* Items */
.jox-artrade-item img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; transition: all 500ms ease 0s; }
.jox-artrade-item:hover img { filter: grayscale(1) contrast(2); }
.jox-artrade-meta { margin-top: 8px; }
.jox-artrade-title { font-weight: 300; color: #fff; font-size: 1rem; }
.jox-artrade-caption { font-weight: 300; color: #ccc; font-size: 1rem; }
/* Pagination */
.jox-artrade-pagination { display: flex; gap: 8px; justify-content: center; margin: 24px 0; }
.jox-artrade-pagination a { padding: 8px 10px; border: 1px solid #ddd; text-decoration: none; }
.jox-artrade-pagination a.is-current { font-weight: 700; }
/* Lightbox */
.jox-artrade-lightbox { position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.85); display: none; align-items: center; justify-content: center; padding: 0; }
.jox-artrade-lightbox.is-open { display: flex; }
.jox-artrade-lightbox-inner { max-width: 90vw; max-height: 90vh; }
.jox-artrade-lightbox-media img { max-width: 90vw; max-height: 70vh; border-radius: 12px; display: block; margin: 0 auto; }
.jox-artrade-lightbox-media video { max-width: 90vw; max-height: 70vh; border-radius: 12px; display: block; margin: 0 auto; }
.jox-artrade-lightbox-meta { color: #fff; margin-top: 12px; text-align: center; }
.jox-artrade-lightbox-title { font-weight: 700; }
.jox-artrade-lightbox-close { position: absolute; top: 14px; right: 16px; color: #fff; font-size: 28px; cursor: pointer; line-height: 1; }
.jox-artrade-lightbox-nav { position: absolute; top: 50%; transform: translateY(-50%); color: #fff; font-size: 40px; cursor: pointer; user-select: none; padding: 8px 12px; }
.jox-artrade-lightbox-prev { left: 10px; }
.jox-artrade-lightbox-next { right: 10px; }
/* Video placeholders */
.jox-artrade-item a { position: relative; display: block; aspect-ratio: 16 / 9; }
.jox-artrade-thumb { width: 100%; height: auto; display: block; border-radius: 4px; }
.jox-artrade-thumb-video-img { aspect-ratio: 16 / 9; object-fit: cover; }
.jox-artrade-thumb-placeholder { width: 100%; height: 100%; background: #f2f2f2; position: relative; border-radius: 4px; }
/* Catalog views */
.jox-artrade-catalog-title { margin: 0 0 16px 0; }
.jox-artrade-catalog-cities { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0 20px; flex-direction: row; }
.jox-artrade-catalog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 30px; margin-top: 40px; }
.jox-artrade-catalog-card { text-decoration: none; display: block; }
.jox-artrade-catalog-card-media { width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #f2f2f2; display: flex; align-items: center; justify-content: center; }
.jox-artrade-catalog-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: all 500ms ease 0s; }
.jox-artrade-catalog-card-media video { width: 100%; height: 100%; object-fit: cover; display: block; transition: all 500ms ease 0s; }
.jox-artrade-catalog-card-media:hover img { filter: grayscale(1) contrast(2); }
.jox-artrade-catalog-card-media:hover video { filter: grayscale(1) contrast(2); }
.jox-artrade-catalog-card-title { margin-top: 8px; color: #fff; font-weight: 300; font-size: 1rem; }
/* Breadcrumbs */
.jox-artrade-breadcrumbs { margin: -20px 0 10px 0; font-size: 16px; color: #fff; }
.jox-artrade-breadcrumbs a { text-decoration: none; }
/* Video Play Selector */
.jox-artrade-video-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 45px; height: 45px; background-image: url('play-icon.svg'); background-size: contain; background-repeat: no-repeat; background-position: center; opacity: .65; pointer-events: none; box-shadow: 0 0 1px 1px #ffffff6b; border-radius: 50%; }
.jox-artrade-video-play:hover { opacity: .2; }
/* Glightbox */
.glightbox-clean .gslide-description { background: transparent !important; text-align: center; }
.glightbox-clean .gdesc-inner { padding: 10px 0 30px !important; color: #fff; font-family: var(--e-global-typography-primary-font-family); }
.glightbox-clean .gdesc-inner h4 { color: #fff; font-family: var(--e-global-typography-primary-font-family); font-weight: 700; font-size: 1.2rem; margin-bottom: 5px; }
/* Links */
a.jox-artrade-city-link { display: inline-block; border: none; color: #FFFFFF; font-size: 1.2rem; font-weight: 200; text-decoration: none; transition: all 500ms ease 0s; 
padding-right: 10px; }
#citylist_home a.jox-artrade-city-link { font-size: 1.2rem; padding-right: 5px;}
a.jox-artrade-city-link:after { content:'/'; margin-left: 10px; color:#666}
#citylist_home a.jox-artrade-city-link:after { content:'/'; margin-left: 5px; color:#666}
@media (min-width: 768px){
    #citylist_home a.jox-artrade-city-link { font-size: 1.5rem; }
    a.jox-artrade-city-link { font-size: 2.5rem; padding-right: 10px;}
}

/* cities links  + hotspots items */
.uc-hotspots-items {
    --delay-iniziale: 1s; 
    --incremento: 0.15s;
}
.jox-artrade-catalog-cities {
    --delay-iniziale: 1s; 
    --incremento: 0.15s;
}
.ue_hotspot-item {
    opacity: 0;
    animation: simpleFadeIn 0.5s ease forwards;
    animation-delay: calc(var(--delay-iniziale) + (var(--i) * var(--incremento)));
}
.jox-artrade-city-link {
    opacity: 0;
    animation: simpleFadeOut 0.5s ease forwards;
    animation-delay: calc(var(--delay-iniziale) + (var(--i) * var(--incremento)));
}
.ue_hotspot-item:nth-child(1),  .jox-artrade-city-link:nth-child(1)  { --i: 0; }
.ue_hotspot-item:nth-child(2),  .jox-artrade-city-link:nth-child(2)  { --i: 1; }
.ue_hotspot-item:nth-child(3),  .jox-artrade-city-link:nth-child(3)  { --i: 2; }
.ue_hotspot-item:nth-child(4),  .jox-artrade-city-link:nth-child(4)  { --i: 3; }
.ue_hotspot-item:nth-child(5),  .jox-artrade-city-link:nth-child(5)  { --i: 4; }
.ue_hotspot-item:nth-child(6),  .jox-artrade-city-link:nth-child(6)  { --i: 5; }
.ue_hotspot-item:nth-child(7),  .jox-artrade-city-link:nth-child(7)  { --i: 6; }
.ue_hotspot-item:nth-child(8),  .jox-artrade-city-link:nth-child(8)  { --i: 7; }
.ue_hotspot-item:nth-child(9),  .jox-artrade-city-link:nth-child(9)  { --i: 8; }
.ue_hotspot-item:nth-child(10), .jox-artrade-city-link:nth-child(10) { --i: 9; }
.ue_hotspot-item:nth-child(11), .jox-artrade-city-link:nth-child(11) { --i: 10; }
.ue_hotspot-item:nth-child(12), .jox-artrade-city-link:nth-child(12) { --i: 11; }
.ue_hotspot-item:nth-child(13), .jox-artrade-city-link:nth-child(13) { --i: 12; }

@keyframes simpleFadeIn {
    from { opacity: 0; transform: scale(10); }
    to { opacity: 1; transform:  scale(1); }
}
@keyframes simpleFadeOut {
    from { opacity: 0; transform: scale(0); }
    to { opacity: 1; transform:  scale(1); }
}