.vh-events-shell {
--vh-toolbar-bg: #1b1b1e;
--vh-toolbar-button: #24262b;
--vh-toolbar-button-hover: #2b2e35;
--vh-toolbar-border: rgba(255, 255, 255, 0.08);
--vh-toolbar-text: #f3f4f6;
--vh-toolbar-muted: rgba(243, 244, 246, 0.8);
--vh-surface: #ffffff;
--vh-surface-border: rgba(17, 24, 39, 0.08);
--vh-surface-shadow: 0 18px 40px rgba(17, 24, 39, 0.08);
--vh-accent: #db7e80;
--vh-accent-soft: rgba(219, 126, 128, 0.16);
--vh-text: #20252b;
--vh-muted: #5b6670;
}
.vh-events-shell.is-loading {
pointer-events: none;
opacity: 0.72;
}
.vh-elementor-actor-filter {
--vh-elementor-green: #deffd9;
--vh-elementor-green-strong: #20f400;
--vh-elementor-text: #292d31;
position: relative;
display: inline-block;
margin-left: 0.75rem;
vertical-align: top;
z-index: 12;
}
.vh-elementor-actor-filter[open] {
z-index: 40;
}
.vh-elementor-actor-filter__summary {
list-style: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
min-height: 2.75rem;
padding: 0.75rem 1.15rem;
border: 0;
border-radius: 999px;
background: var(--vh-elementor-green);
color: var(--vh-elementor-text);
cursor: pointer;
font-size: 0.92rem;
font-weight: 800;
letter-spacing: 0;
line-height: 1;
text-transform: uppercase;
white-space: nowrap;
}
.vh-elementor-actor-filter__summary::-webkit-details-marker {
display: none;
}
.vh-elementor-actor-filter__chevron {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1rem;
height: 1rem;
font-size: 1.25rem;
line-height: 1;
transform: translateY(-0.08rem);
transition: transform 0.18s ease;
}
.vh-elementor-actor-filter[open] .vh-elementor-actor-filter__chevron {
transform: translateY(0.06rem) rotate(180deg);
}
.vh-elementor-actor-filter__panel {
position: absolute;
top: calc(100% + 0.55rem);
left: 0;
display: block;
min-width: 19rem;
max-height: min(25rem, calc(100vh - 9rem));
margin: 0;
padding: 0.75rem 0.75rem 0;
overflow-y: auto;
border: 1px solid rgba(0, 0, 0, 0.08);
border-radius: 12px;
background: #fff;
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);
}
.vh-elementor-actor-filter__options {
display: grid;
gap: 0.15rem;
margin: 0;
padding: 0;
border: 0;
}
.vh-elementor-actor-filter__option {
display: flex;
align-items: center;
gap: 0.7rem;
min-height: 2.65rem;
padding: 0.55rem 0.65rem;
border-radius: 8px;
color: var(--vh-elementor-text);
cursor: pointer;
font-size: 0.92rem;
font-weight: 700;
line-height: 1.25;
}
.vh-elementor-actor-filter__option:hover {
background: rgba(32, 244, 0, 0.1);
}
.vh-elementor-actor-filter__option input[type="checkbox"] {
appearance: none;
display: grid;
place-content: center;
width: 1.08rem;
height: 1.08rem;
margin: 0;
flex: 0 0 auto;
border: 2px solid rgba(41, 45, 49, 0.28);
border-radius: 50%;
background: #fff;
cursor: pointer;
}
.vh-elementor-actor-filter__option input[type="checkbox"]::before {
content: "";
width: 0.48rem;
height: 0.48rem;
border-radius: 50%;
background: var(--vh-elementor-green-strong);
transform: scale(0);
transition: transform 0.16s ease;
}
.vh-elementor-actor-filter__option input[type="checkbox"]:checked {
border-color: var(--vh-elementor-green-strong);
}
.vh-elementor-actor-filter__option input[type="checkbox"]:checked::before {
transform: scale(1);
}
.vh-elementor-actor-filter__action {
position: sticky;
bottom: 0;
margin: 0.65rem -0.75rem 0;
padding: 0.75rem;
border-top: 1px solid rgba(0, 0, 0, 0.08);
background: #fff;
}
.vh-elementor-actor-filter__apply {
width: 100%;
min-height: 2.75rem;
padding: 0.75rem 1rem;
border: 0;
border-radius: 999px;
background: var(--vh-elementor-green-strong);
color: var(--vh-elementor-text);
cursor: pointer;
font: inherit;
font-weight: 900;
text-transform: uppercase;
}
.vh-events-toolbar {
margin-bottom: 1.5rem;
padding: 1rem;
border-radius: 18px;
background: var(--vh-toolbar-bg);
box-shadow: 0 18px 36px rgba(0, 0, 0, 0.12);
}
.vh-events-toolbar__row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 1rem;
flex-wrap: wrap;
}
.vh-events-toolbar__main,
.vh-events-toolbar__sort {
display: flex;
align-items: center;
gap: 0.75rem;
flex-wrap: wrap;
}
.vh-events-toolbar__menu {
position: relative;
}
.vh-events-toolbar__menu[open] {
z-index: 20;
}
.vh-events-toolbar__summary {
list-style: none;
display: inline-flex;
align-items: center;
gap: 0.7rem;
min-height: 3.35rem;
padding: 0.9rem 1.1rem;
border-radius: 14px;
border: 1px solid var(--vh-toolbar-border);
background: var(--vh-toolbar-button);
color: var(--vh-toolbar-text);
cursor: pointer;
font-weight: 600;
font-size: 1rem;
line-height: 1.2;
transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.vh-events-toolbar__summary::-webkit-details-marker {
display: none;
}
.vh-events-toolbar__summary:hover,
.vh-events-toolbar__summary:focus {
background: var(--vh-toolbar-button-hover);
}
.vh-events-toolbar__summary.is-active {
border-color: rgba(219, 126, 128, 0.44);
box-shadow: inset 0 0 0 1px rgba(219, 126, 128, 0.25);
}
.vh-events-toolbar__icon,
.vh-events-toolbar__chevron {
width: 1.15rem;
height: 1.15rem;
flex: 0 0 auto;
}
.vh-events-toolbar__chevron {
margin-left: 0.2rem;
color: var(--vh-toolbar-muted);
transition: transform 0.2s ease;
}
.vh-events-toolbar__menu[open] .vh-events-toolbar__chevron {
transform: rotate(180deg);
}
.vh-events-toolbar__panel {
position: absolute;
top: calc(100% + 0.65rem);
left: 0;
min-width: 17rem;
padding: 0.9rem;
border-radius: 16px;
border: 1px solid rgba(15, 23, 42, 0.08);
background: #ffffff;
box-shadow: 0 22px 48px rgba(15, 23, 42, 0.18);
}
.vh-events-toolbar__menu--sort .vh-events-toolbar__panel {
right: 0;
left: auto;
}
.vh-events-toolbar__menu--actors .vh-events-toolbar__panel {
min-width: 18rem;
}
.vh-events-toolbar__panel--sticky-action {
max-height: min(26rem, calc(100vh - 10rem));
overflow-y: auto;
padding-bottom: 0;
}
.vh-events-toolbar__options {
display: grid;
gap: 0.35rem;
margin: 0;
padding: 0;
border: 0;
}
.vh-events-toolbar__option {
display: flex;
align-items: center;
gap: 0.7rem;
padding: 0.75rem 0.8rem;
border-radius: 12px;
color: var(--vh-text);
cursor: pointer;
transition: background 0.2s ease;
}
.vh-events-toolbar__option:hover {
background: rgba(15, 23, 42, 0.05);
}
.vh-events-toolbar__option input[type="radio"],
.vh-events-toolbar__option input[type="checkbox"] {
appearance: none;
display: grid;
place-content: center;
width: 1.08rem;
height: 1.08rem;
margin: 0;
flex: 0 0 auto;
border: 2px solid rgba(15, 23, 42, 0.24);
border-radius: 50%;
background: #fff;
cursor: pointer;
transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.vh-events-toolbar__option input[type="radio"]::before,
.vh-events-toolbar__option input[type="checkbox"]::before {
content: "";
width: 0.48rem;
height: 0.48rem;
border-radius: 50%;
background: var(--vh-accent);
transform: scale(0);
transition: transform 0.16s ease;
}
.vh-events-toolbar__option input[type="radio"]:checked,
.vh-events-toolbar__option input[type="checkbox"]:checked {
border-color: var(--vh-accent);
background: var(--vh-accent-soft);
}
.vh-events-toolbar__option input[type="radio"]:checked::before,
.vh-events-toolbar__option input[type="checkbox"]:checked::before {
transform: scale(1);
}
.vh-events-toolbar__option input[type="radio"]:focus-visible,
.vh-events-toolbar__option input[type="checkbox"]:focus-visible {
outline: none;
box-shadow: 0 0 0 3px rgba(219, 126, 128, 0.24);
}
.vh-events-toolbar__divider {
height: 1px;
margin: 0.8rem 0;
background: rgba(15, 23, 42, 0.08);
}
.vh-events-toolbar__custom-trigger,
.vh-events-toolbar__apply,
.vh-events-toolbar__reset {
appearance: none;
border: 0;
border-radius: 12px;
font: inherit;
}
.vh-events-toolbar__custom-trigger {
width: 100%;
padding: 0.8rem 0.85rem;
background: rgba(15, 23, 42, 0.06);
color: var(--vh-text);
text-align: left;
cursor: pointer;
font-weight: 600;
}
.vh-events-toolbar__custom-date {
display: none;
gap: 0.85rem;
margin-top: 0.8rem;
}
.vh-events-toolbar__custom-date.is-active {
display: grid;
}
.vh-events-toolbar__custom-date label {
display: grid;
gap: 0.35rem;
font-size: 0.92rem;
color: var(--vh-muted);
}
.vh-events-toolbar__custom-date input[type="date"] {
min-height: 2.75rem;
padding: 0.7rem 0.8rem;
border: 1px solid rgba(15, 23, 42, 0.12);
border-radius: 12px;
background: #fff;
color: var(--vh-text);
font: inherit;
}
.vh-events-toolbar__apply {
padding: 0.85rem 1rem;
background: var(--vh-accent);
color: #fff;
cursor: pointer;
font-weight: 700;
}
.vh-events-toolbar__sticky-action {
position: sticky;
bottom: 0;
margin: 0.8rem -0.9rem 0;
padding: 0.8rem 0.9rem 0.9rem;
border-top: 1px solid rgba(15, 23, 42, 0.08);
background: #fff;
}
.vh-events-toolbar__sticky-action .vh-events-toolbar__apply {
width: 100%;
}
.vh-events-toolbar__reset {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 3.35rem;
padding: 0.9rem 1rem;
background: rgba(255, 255, 255, 0.08);
color: var(--vh-toolbar-text);
text-decoration: none;
font-weight: 600;
transition: background 0.2s ease;
}
.vh-events-toolbar__reset:hover,
.vh-events-toolbar__reset:focus {
background: rgba(255, 255, 255, 0.14);
}
.vh-events-toolbar__hidden-radio {
position: absolute;
opacity: 0;
pointer-events: none;
}
.vh-events {
display: grid;
gap: 1rem;
}
.vh-events__item {
padding: 1.15rem 1.25rem;
border: 1px solid var(--vh-surface-border);
border-radius: 16px;
background: var(--vh-surface);
box-shadow: var(--vh-surface-shadow);
}
.vh-events__header {
margin-bottom: 0.85rem;
}
.vh-events__badges {
display: flex;
gap: 0.45rem;
flex-wrap: wrap;
margin: 0 0 0.65rem;
}
.vh-events__badge {
display: inline-flex;
align-items: center;
min-height: 1.9rem;
padding: 0.2rem 0.65rem;
border-radius: 999px;
background: var(--vh-accent-soft);
color: #8f4040;
font-size: 0.82rem;
font-weight: 700;
}
.vh-events__title {
margin: 0 0 0.4rem;
font-size: 1.15rem;
line-height: 1.3;
color: var(--vh-text);
}
.vh-events__title a {
color: inherit;
text-decoration: none;
}
.vh-events__title a:hover,
.vh-events__title a:focus {
text-decoration: underline;
}
.vh-events__meta {
display: flex;
gap: 0.75rem;
flex-wrap: wrap;
margin: 0;
color: var(--vh-muted);
font-size: 0.95rem;
}
.vh-events__details {
display: grid;
gap: 0.55rem;
margin: 0 0 0.85rem;
}
.vh-events__details div {
display: grid;
gap: 0.18rem;
}
.vh-events__details dt {
font-weight: 700;
color: var(--vh-text);
}
.vh-events__details dd {
margin: 0;
color: var(--vh-muted);
}
.vh-events__description {
margin: 0;
color: var(--vh-text);
}
.vh-events--empty {
padding: 1rem 1.25rem;
border-radius: 16px;
background: #f6f7f7;
}
@media (min-width: 700px) {
.vh-events {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 980px) {
.vh-events-toolbar__row {
flex-direction: column;
align-items: stretch;
}
.vh-events-toolbar__sort {
width: 100%;
}
.vh-events-toolbar__sort .vh-events-toolbar__menu,
.vh-events-toolbar__sort .vh-events-toolbar__summary {
width: 100%;
}
}
@media (max-width: 640px) {
.vh-events-toolbar {
padding: 0.85rem;
}
.vh-events-toolbar__main {
gap: 0.65rem;
}
.vh-events-toolbar__menu,
.vh-events-toolbar__summary,
.vh-events-toolbar__reset {
width: 100%;
}
.vh-events-toolbar__panel,
.vh-events-toolbar__menu--sort .vh-events-toolbar__panel {
position: static;
min-width: 0;
margin-top: 0.65rem;
}
.vh-events {
grid-template-columns: 1fr;
}
}
.vh-event-application {
--vh-application-bg: #e8ffe9;
--vh-application-text: #2f3137;
--vh-application-muted: #81858c;
--vh-application-panel: #ffffff;
--vh-application-accent: #24f000;
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.85fr);
gap: clamp(2rem, 5vw, 5rem);
align-items: start;
padding: clamp(2rem, 5vw, 4rem);
background: var(--vh-application-bg);
color: var(--vh-application-text);
}
.vh-event-application__form {
display: grid;
gap: 1rem;
}
.vh-event-application__title {
margin: 0 0 1.5rem;
color: var(--vh-application-text);
font-size: clamp(2rem, 4vw, 3.2rem);
line-height: 1;
text-transform: uppercase;
}
.vh-event-application__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
}
.vh-event-application__field {
display: grid;
gap: 0.45rem;
}
.vh-event-application__field label {
font-size: 1rem;
font-weight: 800;
line-height: 1.2;
}
.vh-event-application__field input,
.vh-event-application__field textarea {
width: 100%;
border: 0;
border-radius: 4px;
background: #fff;
padding: 1rem 1.1rem;
color: var(--vh-application-text);
font: inherit;
font-size: 1rem;
}
.vh-event-application__field textarea {
min-height: 9.5rem;
resize: vertical;
}
.vh-event-application__field input::placeholder,
.vh-event-application__field textarea::placeholder {
color: #9ca3af;
}
.vh-event-application__field input:focus,
.vh-event-application__field textarea:focus {
outline: 3px solid rgba(36, 240, 0, 0.28);
}
.vh-event-application__submit {
justify-self: start;
margin-top: 0.5rem;
border: 0;
border-radius: 999px;
background: var(--vh-application-accent);
padding: 1rem 2.2rem;
color: #25302a;
font: inherit;
font-weight: 900;
text-transform: uppercase;
cursor: pointer;
}
.vh-event-application__submit:hover,
.vh-event-application__submit:focus {
filter: brightness(0.96);
}
.vh-event-application__info {
border-radius: 8px;
background: var(--vh-application-panel);
padding: clamp(1.5rem, 4vw, 2.4rem);
}
.vh-event-application__info h3 {
margin: 0 0 0.75rem;
color: var(--vh-application-text);
font-size: clamp(1.7rem, 3vw, 2.4rem);
line-height: 1.12;
}
.vh-event-application__info p {
margin: 0 0 1.4rem;
color: #44484e;
font-size: 1.05rem;
line-height: 1.45;
}
.vh-event-application__notice {
border-radius: 6px;
padding: 0.85rem 1rem;
font-weight: 700;
}
.vh-event-application__notice--success {
background: #d7f8dd;
color: #185c24;
}
.vh-event-application__notice--error {
background: #ffe1e1;
color: #8a1f1f;
}
.vh-event-application__website {
position: absolute;
left: -9999px;
width: 1px;
height: 1px;
opacity: 0;
}
@media (max-width: 900px) {
.vh-event-application {
grid-template-columns: 1fr;
}
}
@media (max-width: 640px) {
.vh-event-application {
padding: 1.25rem;
}
.vh-event-application__grid {
grid-template-columns: 1fr;
}
.vh-event-application__submit {
width: 100%;
}
}