/* ================================================================
   JAGGI EVENT PORTAL v3 — Frontend CSS
   Primary: #E0370E  |  All !important for Elementor compat
   ================================================================ */

/* ── 1. ISOLATION WRAPPER — prevents bleed into Elementor ───── */
.jaggi-section {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    padding: 80px 0 !important;
    margin: 0 !important;
    font-family: 'Segoe UI', system-ui, -apple-system, Arial, sans-serif !important;
    line-height: 1.5 !important;
    color: #333 !important;
    box-sizing: border-box !important;
}
.jaggi-section * { box-sizing: border-box !important; }

/* Section backgrounds */
.jaggi-upcoming    { background: #f6f6f6 !important; }
.jaggi-cal-section { background: #ffffff !important; }
.jaggi-gallery-section { background: #f0f0f0 !important; }
.jaggi-form-section    { background: #ffffff !important; }

/* ── 2. CONTAINER — the only thing that constrains width ─────── */
.jaggi-wrap {
    width: 100% !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
}

/* ── 3. SECTION HEADER ──────────────────────────────────────── */
.jaggi-section-hd {
    text-align: center !important;
    margin-bottom: 48px !important;
}
.jaggi-title {
    display: inline-block !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #111 !important;
    line-height: 1.2 !important;
    margin: 0 0 0 0 !important;
    padding: 0 !important;
    letter-spacing: -0.4px !important;
    position: relative !important;
}
.jaggi-title::after {
    content: '' !important;
    display: block !important;
    width: 44px !important;
    height: 3px !important;
    background: #E0370E !important;
    border-radius: 2px !important;
    margin: 10px auto 0 !important;
}
.jaggi-subtitle {
    font-size: 0.97rem !important;
    color: #888 !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    line-height: 1.55 !important;
}

/* ── 4. FILTER PILLS ────────────────────────────────────────── */
.jaggi-filter-row {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    margin-bottom: 12px !important;
}
.jaggi-filter-row:last-of-type { margin-bottom: 28px !important; }
.jaggi-filter-lbl {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    color: #666 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    min-width: 36px !important;
    flex-shrink: 0 !important;
}
.jaggi-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}
.jaggi-pill {
    display: inline-block !important;
    padding: 5px 16px !important;
    border: 1.5px solid #d8d8d8 !important;
    border-radius: 100px !important;
    background: #fff !important;
    color: #555 !important;
    font-size: 0.79rem !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    font-family: inherit !important;
    line-height: 1.5 !important;
    transition: none !important;
    outline: none !important;
    margin: 0 !important;
}
.jaggi-pill.active {
    border-color: #E0370E !important;
    color: #E0370E !important;
    background: #fff5f3 !important;
    font-weight: 600 !important;
}

/* ── 5. EVENT CARDS GRID ────────────────────────────────────── */
.jaggi-cards-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    align-items: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
}
.jaggi-event-card {
    width: calc(33.333% - 16px) !important;
    background: #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #ebebeb !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
}
.jaggi-event-card.jaggi-hidden { display: none !important; }
.jaggi-empty,
.jaggi-no-results {
    width: 100% !important;
    text-align: center !important;
    color: #bbb !important;
    font-size: 0.9rem !important;
    padding: 40px 0 !important;
    margin: 0 !important;
}
.jaggi-no-results {
    display: none !important;
    background: #fff !important;
    border-radius: 10px !important;
    border: 1.5px dashed #e5e5e5 !important;
    padding: 36px 20px !important;
    color: #aaa !important;
}

/* Card image */
.jaggi-card-image {
    height: 210px !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: #e8e8e8 !important;
    position: relative !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}
.jaggi-no-img {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ccc !important;
}

/* Badges on image */
.jaggi-badge {
    position: absolute !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 4px 10px !important;
    border-radius: 5px !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    top: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.1px !important;
}
.jaggi-badge svg { width: 11px !important; height: 11px !important; flex-shrink: 0 !important; }
.jaggi-badge-city {
    left: 12px !important;
    background: rgba(0,0,0,0.58) !important;
    color: #fff !important;
}
.jaggi-badge-type { right: 12px !important; color: #fff !important; background: #E0370E !important; }
.jaggi-type-expo      { background: #E0370E !important; }
.jaggi-type-seminar   { background: #1565c0 !important; }
.jaggi-type-online    { background: #2e7d32 !important; }
.jaggi-type-product   { background: #6a1b9a !important; }
.jaggi-type-webinar   { background: #00838f !important; }
.jaggi-type-workshop  { background: #e65100 !important; }

.jaggi-status-badge {
    position: absolute !important;
    top: 12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    padding: 3px 10px !important;
    border-radius: 4px !important;
    font-size: 0.67rem !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
    color: #fff !important;
}
.jaggi-sbadge-upcoming  { background: #1565c0 !important; }
.jaggi-sbadge-ongoing   { background: #2e7d32 !important; }
.jaggi-sbadge-completed { background: #757575 !important; }
.jaggi-sbadge-sold_out  { background: #b71c1c !important; }

.jaggi-labels {
    position: absolute !important;
    bottom: 10px !important;
    left: 10px !important;
    display: flex !important;
    gap: 5px !important;
    flex-wrap: wrap !important;
}
.jaggi-label-tag {
    background: rgba(224,55,14,0.9) !important;
    color: #fff !important;
    font-size: 0.62rem !important;
    font-weight: 700 !important;
    padding: 2px 8px !important;
    border-radius: 3px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Card body */
.jaggi-card-body {
    padding: 18px 18px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex: 1 !important;
}
.jaggi-countdown {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: #fff8f0 !important;
    border: 1px solid #fde0cc !important;
    color: #E0370E !important;
    font-size: 0.73rem !important;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    width: fit-content !important;
    margin: 0 !important;
}
.jaggi-countdown svg { width: 12px !important; height: 12px !important; }
/* jaggi-card-date is now an info-row inside jaggi-card-info */
.jaggi-card-date {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 0.75rem !important;
    color: #E0370E !important;
    font-weight: 700 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.jaggi-card-date svg { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; color: #E0370E !important; }
.jaggi-card-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #111 !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.jaggi-card-title a { color: #111 !important; text-decoration: none !important; }
.jaggi-card-desc {
    font-size: 0.83rem !important;
    color: #777 !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}
.jaggi-card-info {
    border-top: 1px solid #f0f0f0 !important;
    padding-top: 10px !important;
    margin-top: 2px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
}
.jaggi-info-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 6px !important;
    font-size: 0.79rem !important;
    color: #555 !important;
    line-height: 1.4 !important;
    flex-wrap: wrap !important;
    margin: 0 !important;
}
.jaggi-info-row svg { width: 14px !important; height: 14px !important; color: #E0370E !important; flex-shrink: 0 !important; margin-top: 1px !important; }
.jaggi-dur { color: #E0370E !important; font-style: normal !important; font-size: 0.72rem !important; font-weight: 600 !important; }
.jaggi-map-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    color: #1565c0 !important;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    margin-left: 4px !important;
}
.jaggi-map-btn svg { width: 11px !important; height: 11px !important; color: #1565c0 !important; }
.jaggi-booked      { color: #b71c1c !important; font-weight: 700 !important; }
.jaggi-seats-left  { color: #e65100 !important; font-weight: 700 !important; }

/* Host row */
.jaggi-host-row {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: #f9f9f9 !important;
    border-radius: 8px !important;
    padding: 10px 12px !important;
    margin-top: 4px !important;
    border: 1px solid #ebebeb !important;
}
.jaggi-host-img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 2px solid #ebebeb !important;
    flex-shrink: 0 !important;
}
.jaggi-host-avatar {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: #e8e8e8 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #aaa !important;
    flex-shrink: 0 !important;
}
.jaggi-host-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    min-width: 0 !important;
}
.jaggi-host-name {
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    color: #222 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.jaggi-host-desc {
    font-size: 0.74rem !important;
    color: #888 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Buttons */
.jaggi-card-actions {
    display: flex !important;
    gap: 10px !important;
    margin-top: auto !important;
    padding-top: 14px !important;
}
.jaggi-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 9px 14px !important;
    border-radius: 7px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    border: 1.5px solid transparent !important;
    font-family: inherit !important;
    line-height: 1.2 !important;
    transition: none !important;
    outline: none !important;
    background: none !important;
}
.jaggi-btn svg { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; }
.jaggi-btn-primary { background: #E0370E !important; color: #fff !important; border-color: #E0370E !important; flex: 1 !important; }
.jaggi-btn-wa      { background: #fff !important; color: #25D366 !important; border-color: #25D366 !important; flex: 1 !important; }
.jaggi-btn-lg      { padding: 13px 32px !important; font-size: 0.92rem !important; flex: unset !important; }

/* ── 6. CALENDAR ────────────────────────────────────────────── */
.jaggi-cal-layout {
    display: flex !important;
    gap: 28px !important;
    align-items: flex-start !important;
}
.jaggi-cal-picker {
    flex: 0 0 320px !important;
    background: #fff !important;
    border: 1.5px solid #e8e8e8 !important;
    border-radius: 14px !important;
    padding: 22px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.05) !important;
}
.jaggi-cal-results-wrap { flex: 1 !important; min-height: 380px !important; }
.jaggi-cal-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 16px !important;
}
.jaggi-cal-month {
    font-size: 0.92rem !important;
    font-weight: 800 !important;
    color: #111 !important;
}
.jaggi-cal-arrow {
    background: none !important;
    border: 1.5px solid #ddd !important;
    border-radius: 7px !important;
    cursor: pointer !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #444 !important;
    padding: 0 !important;
    transition: none !important;
}
.jaggi-cal-wdays {
    display: grid !important;
    grid-template-columns: repeat(7,1fr) !important;
    text-align: center !important;
    font-size: 0.67rem !important;
    font-weight: 700 !important;
    color: #aaa !important;
    text-transform: uppercase !important;
    margin-bottom: 5px !important;
}
.jaggi-cal-wdays span { padding: 4px 0 !important; }
.jaggi-cal-days {
    display: grid !important;
    grid-template-columns: repeat(7,1fr) !important;
    gap: 2px !important;
}
.jaggi-cal-day {
    aspect-ratio: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.79rem !important;
    color: #333 !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    font-weight: 500 !important;
}
.jaggi-cal-day.empty   { cursor: default !important; }
.jaggi-cal-day.has-up  { background: #fff0ec !important; color: #E0370E !important; font-weight: 800 !important; }
.jaggi-cal-day.has-past{ background: #e8f0ff !important; color: #1565c0 !important; font-weight: 800 !important; }
.jaggi-cal-day.is-today{ border: 2px solid #E0370E !important; }
.jaggi-cal-day.selected{ background: #E0370E !important; color: #fff !important; }

.jaggi-cal-legend {
    display: flex !important;
    gap: 12px !important;
    margin-top: 14px !important;
    font-size: 0.71rem !important;
    color: #777 !important;
    flex-wrap: wrap !important;
}
.jdot {
    display: inline-block !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    margin-right: 4px !important;
    vertical-align: middle !important;
}
.jdot-up   { background: #E0370E !important; }
.jdot-past { background: #1565c0 !important; }
.jdot-today{ border: 2px solid #E0370E !important; }

.jaggi-cal-results {
    background: #f8f8f8 !important;
    border-radius: 14px !important;
    padding: 24px !important;
    min-height: 380px !important;
    border: 1.5px solid #e8e8e8 !important;
}
.jaggi-cal-placeholder {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 330px !important;
    color: #ccc !important;
    gap: 12px !important;
    font-size: 0.88rem !important;
}
.jaggi-cal-date-hd {
    font-size: 0.9rem !important;
    font-weight: 800 !important;
    color: #111 !important;
    margin-bottom: 16px !important;
    padding-bottom: 12px !important;
    border-bottom: 1.5px solid #ebebeb !important;
}
.jaggi-cal-item {
    background: #fff !important;
    border-radius: 10px !important;
    padding: 14px !important;
    margin-bottom: 10px !important;
    display: flex !important;
    gap: 14px !important;
    border-left: 3px solid #E0370E !important;
}
.jaggi-cal-item.past { border-left-color: #1565c0 !important; }
.jaggi-cal-thumb {
    width: 54px !important;
    height: 54px !important;
    border-radius: 7px !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: #eee !important;
    flex-shrink: 0 !important;
}
.jaggi-cal-info { flex: 1 !important; }
.jaggi-cal-ititle { font-size: 0.86rem !important; font-weight: 700 !important; color: #111 !important; margin-bottom: 5px !important; }
.jaggi-cal-imeta  { font-size: 0.74rem !important; color: #888 !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
.jaggi-cal-ibtns  { display: flex !important; gap: 7px !important; margin-top: 9px !important; }
.jaggi-cal-ibtn {
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    padding: 4px 10px !important;
    border-radius: 5px !important;
    text-decoration: none !important;
    border: 1.5px solid currentColor !important;
    background: transparent !important;
}
.jaggi-cal-ibtn-a { color: #E0370E !important; }
.jaggi-cal-ibtn-w { color: #25D366 !important; }
.jaggi-cal-none   { text-align: center !important; color: #bbb !important; padding: 40px 20px !important; font-size: 0.86rem !important; }

/* ── 7. GALLERY GRID ────────────────────────────────────────── */
.jaggi-gallery-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
}
.jaggi-gallery-card {
    width: calc(25% - 15px) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    background: #222 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    position: relative !important;
}
.jaggi-gallery-img {
    height: 220px !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: #444 !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
}
/* Eye icon — top right, shows on hover */
.jaggi-gallery-zoom {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    background: rgba(255,255,255,0.92) !important;
    border-radius: 50% !important;
    width: 34px !important;
    height: 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #E0370E !important;
    opacity: 0 !important;
    z-index: 2 !important;
}
.jaggi-gallery-card:hover .jaggi-gallery-zoom { opacity: 1 !important; }
/* Overlay: gradient + title + city + date at bottom of image */
.jaggi-gallery-overlay {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: linear-gradient(0deg, rgba(0,0,0,0.84) 0%, rgba(0,0,0,0.4) 55%, transparent 100%) !important;
    padding: 36px 14px 14px !important;
    z-index: 1 !important;
}
.jaggi-gallery-title {
    font-size: 0.86rem !important;
    font-weight: 700 !important;
    color: #fff !important;
    line-height: 1.3 !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
}
.jaggi-gallery-meta {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}
.jaggi-gallery-meta span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 0.7rem !important;
    color: rgba(255,255,255,0.85) !important;
    font-weight: 500 !important;
}
.jaggi-gallery-meta svg { width: 11px !important; height: 11px !important; }

/* ── 8. POPUP ───────────────────────────────────────────────── */
.jaggi-popup-bg {
    display: none !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,0.86) !important;
    z-index: 999999 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
}
.jaggi-popup-bg.active { display: flex !important; }

.jaggi-popup-box {
    background: #fff !important;
    border-radius: 14px !important;
    width: 100% !important;
    max-width: 900px !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    position: relative !important;
}
.jaggi-popup-x {
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    z-index: 10 !important;
    background: #f5f5f5 !important;
    border: none !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: #444 !important;
    padding: 0 !important;
}

/* Popup body: left description + right images */
.jaggi-popup-body {
    display: flex !important;
    gap: 0 !important;
    min-height: 460px !important;
}
.jaggi-popup-left {
    flex: 0 0 300px !important;
    padding: 28px 24px 28px 28px !important;
    border-right: 1px solid #ebebeb !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    overflow-y: auto !important;
}
.jaggi-popup-title {
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    color: #111 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding-right: 28px !important;
}
.jaggi-popup-meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}
.jaggi-popup-meta span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 0.78rem !important;
    color: #777 !important;
}
.jaggi-popup-meta svg { width: 13px !important; height: 13px !important; color: #E0370E !important; flex-shrink: 0 !important; }
.jaggi-popup-desc {
    font-size: 0.84rem !important;
    color: #555 !important;
    line-height: 1.65 !important;
    white-space: pre-line !important;
}
.jaggi-popup-desc-placeholder {
    font-size: 0.82rem !important;
    color: #bbb !important;
    font-style: italic !important;
}

/* Right side: main image + counter + thumb grid */
.jaggi-popup-right {
    flex: 1 !important;
    padding: 20px 22px 22px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}
.jaggi-popup-viewer {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.jaggi-popup-img-frame {
    flex: 1 !important;
    background: #111 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 320px !important;
}
.jaggi-popup-img-frame img {
    max-width: 100% !important;
    max-height: 320px !important;
    object-fit: contain !important;
    display: block !important;
}
.jaggi-popup-nav {
    background: #f5f5f5 !important;
    border: 1.5px solid #ddd !important;
    border-radius: 8px !important;
    width: 36px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    color: #333 !important;
    padding: 0 !important;
    transition: none !important;
}
.jaggi-popup-counter {
    text-align: center !important;
    font-size: 0.75rem !important;
    color: #aaa !important;
}
.jaggi-popup-thumbs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}
.jaggi-popup-thumb {
    width: 56px !important;
    height: 56px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    cursor: pointer !important;
    border: 2px solid transparent !important;
    opacity: 0.65 !important;
    display: block !important;
}
.jaggi-popup-thumb.active { border-color: #E0370E !important; opacity: 1 !important; }

/* ── 9. REGISTER FORM ───────────────────────────────────────── */
.jaggi-form-outer { max-width: 800px !important; margin: 0 auto !important; }
.jaggi-form-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
}
.jaggi-field {
    width: calc(50% - 10px) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}
.jaggi-field-full { width: 100% !important; }
.jaggi-field label {
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin: 0 !important;
}
.jaggi-field label span { color: #E0370E !important; }
.jaggi-field label em   { font-style: normal !important; color: #bbb !important; font-weight: 400 !important; font-size: 0.77rem !important; }
.jaggi-field input,
.jaggi-field select,
.jaggi-field textarea {
    width: 100% !important;
    padding: 10px 14px !important;
    border: 1.5px solid #ddd !important;
    border-radius: 8px !important;
    font-size: 0.87rem !important;
    color: #333 !important;
    font-family: inherit !important;
    background: #fff !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
}
.jaggi-field input:focus,
.jaggi-field select:focus,
.jaggi-field textarea:focus {
    border-color: #E0370E !important;
    box-shadow: 0 0 0 3px rgba(224,55,14,0.09) !important;
}
.jaggi-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 15px !important;
    padding-right: 34px !important;
}
.jaggi-field textarea { resize: vertical !important; }
.jaggi-file {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}
.jaggi-file input[type="file"] { display: none !important; }
.jaggi-file-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 9px 16px !important;
    background: #f5f5f5 !important;
    border: 1.5px solid #ddd !important;
    border-radius: 8px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    color: #444 !important;
    white-space: nowrap !important;
}
.jaggi-file-btn svg { width: 13px !important; height: 13px !important; }
#jaggi-fname { font-size: 0.77rem !important; color: #aaa !important; }
.jaggi-form-foot {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    margin-top: 28px !important;
    flex-wrap: wrap !important;
}
.jaggi-form-note { font-size: 0.77rem !important; color: #bbb !important; margin: 0 !important; }
.jaggi-errors {
    background: #fff5f5 !important;
    border: 1.5px solid #fcc !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    margin-bottom: 20px !important;
    font-size: 0.83rem !important;
    color: #c0392b !important;
}
.jaggi-errors p { margin: 2px 0 !important; }
.jaggi-success {
    text-align: center !important;
    padding: 60px 24px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    color: #2e7d32 !important;
}
.jaggi-success svg { color: #2e7d32 !important; }
.jaggi-success h3 { font-size: 1.3rem !important; font-weight: 800 !important; color: #2e7d32 !important; margin: 0 !important; }
.jaggi-success p  { color: #666 !important; font-size: 0.9rem !important; margin: 0 !important; }

/* ── 10. RESPONSIVE ─────────────────────────────────────────── */
@media (max-width: 1100px) {
    .jaggi-event-card   { width: calc(50% - 12px) !important; }
    .jaggi-gallery-card { width: calc(50% - 10px) !important; }
}
@media (max-width: 860px) {
    .jaggi-cal-layout { flex-direction: column !important; }
    .jaggi-cal-picker { flex: unset !important; width: 100% !important; }
    .jaggi-popup-body { flex-direction: column !important; }
    .jaggi-popup-left { flex: unset !important; border-right: none !important; border-bottom: 1px solid #ebebeb !important; padding: 24px !important; }
    .jaggi-popup-right { padding: 20px !important; }
}
@media (max-width: 700px) {
    .jaggi-event-card   { width: 100% !important; }
    .jaggi-gallery-card { width: calc(50% - 10px) !important; }
    .jaggi-field        { width: 100% !important; }
    .jaggi-section      { padding: 54px 0 !important; }
    .jaggi-title        { font-size: 1.55rem !important; }
    .jaggi-popup-img-frame { height: 220px !important; }
    .jaggi-popup-img-frame img { max-height: 220px !important; }
    .jaggi-section-hd   { margin-bottom: 32px !important; }
}
@media (max-width: 480px) {
    .jaggi-gallery-card { width: 100% !important; }
    .jaggi-card-actions { flex-direction: column !important; }
    .jaggi-btn-primary,
    .jaggi-btn-wa       { flex: unset !important; width: 100% !important; }
    .jaggi-wrap         { padding-left: 16px !important; padding-right: 16px !important; }
}
