/* Ticketmaster Events - Frontend Styles */
.tm-events-wrap { --tm-primary: #026CDF; --tm-primary-dark: #0050b3; --tm-radius: 12px; --tm-shadow: 0 4px 24px rgba(0,0,0,.10); font-family: inherit; }
.tm-theme-dark { --tm-bg: #0f1117; --tm-card-bg: #1a1f2e; --tm-text: #f0f2f7; --tm-muted: #8892a4; --tm-border: #2a2f3e; }
.tm-theme-light { --tm-bg: #f5f7fa; --tm-card-bg: #ffffff; --tm-text: #1a1f2e; --tm-muted: #6b7280; --tm-border: #e5e7eb; }
.tm-events-wrap { background: var(--tm-bg, transparent); border-radius: var(--tm-radius); padding: 8px 0; }
.tm-events-grid { display: grid; gap: 24px; }
.tm-layout-grid .tm-events-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.tm-layout-list .tm-events-grid { grid-template-columns: 1fr; }
.tm-event-card { background: var(--tm-card-bg, #fff); border: 1px solid var(--tm-border, #e5e7eb); border-radius: var(--tm-radius); overflow: hidden; box-shadow: var(--tm-shadow); transition: transform .2s ease, box-shadow .2s ease; display: flex; flex-direction: column; }
.tm-event-card:hover { transform: translateY(-4px); box-shadow: 0 8px 32px rgba(0,0,0,.15); }
.tm-layout-list .tm-event-card { flex-direction: row; }
.tm-event-image { position: relative; overflow: hidden; }
.tm-layout-grid .tm-event-image { height: 200px; }
.tm-layout-list .tm-event-image { width: 220px; flex-shrink: 0; }
.tm-event-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.tm-event-card:hover .tm-event-image img { transform: scale(1.05); }
.tm-badge { position: absolute; top: 12px; left: 12px; background: var(--tm-primary, #026CDF); color: #fff; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 20px; text-transform: uppercase; letter-spacing: .5px; }
.tm-event-body { padding: 20px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.tm-event-title { margin: 0 0 4px; font-size: 1.05rem; font-weight: 700; line-height: 1.3; }
.tm-event-title a { color: var(--tm-text, #1a1f2e); text-decoration: none; }
.tm-event-title a:hover { color: var(--tm-primary, #026CDF); }
.tm-event-meta { display: flex; align-items: center; gap: 7px; font-size: .875rem; color: var(--tm-muted, #6b7280); }
.tm-status-badge { display: inline-block; font-size: 11px; font-weight: 700; padding: 2px 10px; border-radius: 20px; text-transform: uppercase; margin-top: 4px; }
.tm-onsale { background: #d1fae5; color: #065f46; }
.tm-offsale { background: #fee2e2; color: #991b1b; }
.tm-theme-dark .tm-onsale { background: #065f46; color: #d1fae5; }
.tm-theme-dark .tm-offsale { background: #991b1b; color: #fee2e2; }
.tm-buy-btn { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; background: var(--tm-primary, #026CDF); color: #fff !important; text-decoration: none !important; padding: 10px 20px; border-radius: 8px; font-size: .9rem; font-weight: 600; transition: background .2s ease, transform .1s ease; align-self: flex-start; }
.tm-buy-btn:hover { background: var(--tm-primary-dark, #0050b3); transform: translateX(2px); }
.tm-btn-arrow { transition: transform .2s ease; }
.tm-buy-btn:hover .tm-btn-arrow { transform: translateX(4px); }
.tm-load-more-wrap { text-align: center; margin-top: 32px; }
.tm-load-more-btn { background: transparent; border: 2px solid var(--tm-primary, #026CDF); color: var(--tm-primary, #026CDF); padding: 12px 32px; border-radius: 8px; font-size: .95rem; font-weight: 600; cursor: pointer; transition: all .2s ease; }
.tm-load-more-btn:hover { background: var(--tm-primary, #026CDF); color: #fff; }
.tm-load-more-btn:disabled { opacity: .5; cursor: default; }
.tm-events-error { padding: 16px; border-radius: 8px; background: #fee2e2; color: #991b1b; }
.tm-no-events { padding: 20px; border-radius: 8px; background: var(--tm-card-bg, #f5f7fa); color: var(--tm-muted, #6b7280); text-align: center; }
@media (max-width: 640px) { .tm-layout-list .tm-event-card { flex-direction: column; } .tm-layout-list .tm-event-image { width: 100%; height: 180px; } }

.tm-btn-search { background: #6b7280; }
.tm-btn-search:hover { background: #4b5563; }

/* ===================== Filter Bar ===================== */
.tm-filter { --tf-bg: #ffffff; --tf-border: #e5e7eb; --tf-text: #1a1f2e; --tf-muted: #6b7280; --tf-primary: #026CDF; --tf-primary-dark: #0050b3; --tf-radius: 10px; --tf-shadow: 0 2px 16px rgba(0,0,0,.08); font-family: inherit; display: block; }
.tm-theme-dark.tm-filter { --tf-bg: #1a1f2e; --tf-border: #2a2f3e; --tf-text: #f0f2f7; --tf-muted: #8892a4; }

.tm-filter__form { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; background: var(--tf-bg); border: 1px solid var(--tf-border); border-radius: var(--tf-radius); box-shadow: var(--tf-shadow); padding: 20px 24px; }
.tm-filter__field { display: flex; flex-direction: column; gap: 5px; flex: 1 1 160px; min-width: 130px; }
.tm-filter__field--keyword { flex: 2 1 220px; }
.tm-filter__label { font-size: .78rem; font-weight: 600; color: var(--tf-muted); text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }
.tm-filter__input-wrap { position: relative; }
.tm-filter__input-wrap--icon .tm-filter__icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--tf-muted); pointer-events: none; }
.tm-filter__input-wrap--icon .tm-filter__input,
.tm-filter__input-wrap--icon .tm-filter__select { padding-left: 34px; }
.tm-filter__input,
.tm-filter__select { width: 100%; height: 40px; padding: 0 12px; border: 1.5px solid var(--tf-border); border-radius: 8px; background: var(--tf-bg); color: var(--tf-text); font-size: .9rem; font-family: inherit; appearance: none; -webkit-appearance: none; transition: border-color .2s, box-shadow .2s; box-sizing: border-box; }
.tm-filter__select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 30px; }
.tm-filter__input:focus,
.tm-filter__select:focus { outline: none; border-color: var(--tf-primary); box-shadow: 0 0 0 3px rgba(2,108,223,.15); }
.tm-filter__input::placeholder { color: var(--tf-muted); }
.tm-theme-dark .tm-filter__input,
.tm-theme-dark .tm-filter__select { background: #0f1117; border-color: #2a2f3e; color: #f0f2f7; }
.tm-theme-dark .tm-filter__select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238892a4' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); }
.tm-filter__input[type="date"] { cursor: pointer; }

.tm-filter__actions { display: flex; align-items: flex-end; gap: 8px; flex-shrink: 0; padding-top: 20px; }
.tm-filter__btn { height: 40px; padding: 0 20px; border-radius: 8px; font-size: .9rem; font-weight: 600; cursor: pointer; border: none; display: inline-flex; align-items: center; gap: 7px; transition: background .2s, transform .1s; white-space: nowrap; font-family: inherit; }
.tm-filter__btn--primary { background: var(--tf-primary); color: #fff; }
.tm-filter__btn--primary:hover { background: var(--tf-primary-dark); transform: translateY(-1px); }
.tm-filter__btn--reset { background: transparent; color: var(--tf-muted); border: 1.5px solid var(--tf-border); }
.tm-filter__btn--reset:hover { color: var(--tf-text); border-color: var(--tf-text); }

.tm-filter__loading { display: none; font-size:.8rem; color:var(--tf-muted); padding:2px 6px; }
.tm-filter__loading.is-visible { display:inline; }

@media (max-width: 768px) { .tm-filter__form { padding: 16px; gap: 10px; } .tm-filter__field { flex: 1 1 calc(50% - 10px); } .tm-filter__field--keyword { flex: 1 1 100%; } .tm-filter__actions { width: 100%; flex: 1 1 100%; padding-top: 4px; } .tm-filter__btn--primary { flex: 1; justify-content: center; } }
@media (max-width: 480px) { .tm-filter__field { flex: 1 1 100%; } }