.kff-events-filter-row-main{align-items:center;gap:12px;flex-wrap:wrap}
.kff-events-location-wrap{min-width:210px}
.kff-events-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.kff-events-view-toggle{display:inline-flex;border:1px solid #d9e1ea;border-radius:10px;overflow:hidden;background:#fff}
.kff-events-view-btn{border:0;background:#fff;padding:9px 14px;font-weight:700;color:#526072;cursor:pointer}
.kff-events-view-btn.active{background:#172033;color:#fff}
.kff-events-calendar-view{margin-top:18px}
.kff-events-calendar-head{display:flex!important;align-items:center!important;justify-content:center!important;gap:18px!important;margin:0 0 18px!important;padding:0!important}
.kff-events-calendar-head h3{margin:0!important;min-width:210px;text-align:center;font-size:24px!important;line-height:1.2!important;color:#172033!important}
.kff-calendar-nav{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;margin:0!important;border:1px solid #d9e1ea!important;border-radius:10px!important;background:#fff!important;color:#172033!important;font-size:20px!important;line-height:1!important;font-weight:800!important;box-shadow:none!important;cursor:pointer!important}
.kff-calendar-nav:hover{border-color:#1683d8!important;background:#f7fbff!important;color:#1683d8!important}
.kff-events-calendar-weekdays,.kff-events-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.kff-events-calendar-weekdays span{padding:10px;text-align:center;font-size:12px;font-weight:800;color:#718096;text-transform:uppercase}
.kff-calendar-cell{min-height:128px;border:1px solid #e8edf2;padding:8px;background:#fff;overflow:hidden}
.kff-calendar-cell.muted{background:#fafbfc}
.kff-calendar-cell.has-events{cursor:pointer}
.kff-calendar-cell.has-events:hover{background:#f7fbff}
.kff-calendar-day-button{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;min-height:auto!important;padding:0!important;margin:0 0 6px!important;border:0!important;background:transparent!important;color:#172033!important;box-shadow:none!important;text-align:left!important;cursor:default!important}
.kff-calendar-cell.has-events .kff-calendar-day-button{cursor:pointer!important}
.kff-calendar-day-number{display:inline-block!important;color:#172033!important;font-weight:800!important}
.kff-calendar-event-pill{display:block!important;width:100%!important;border:0!important;border-radius:6px!important;background:#eef7ff!important;text-align:left!important;text-decoration:none!important;padding:5px 6px!important;margin:4px 0!important;font-size:11px!important;line-height:1.25!important;color:#145c91!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;cursor:pointer!important}
.kff-calendar-event-pill:hover{background:#dff0ff!important;color:#0f5f9a!important}
.kff-calendar-more{border:0;background:none;color:#1683d8;font-size:11px;font-weight:700;cursor:pointer;padding:3px 0}
.kff-calendar-day-events{margin-top:22px;border:1px solid #e0e6ed;border-radius:16px;padding:18px;background:#fff}
.kff-calendar-day-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.kff-calendar-day-head h3{margin:0}
.kff-calendar-day-head button{border:0;background:none;font-size:26px;cursor:pointer}
.kff-event-user-actions{display:grid;gap:8px;margin-top:14px}
.kff-event-user-actions .kff-event-action{width:100%;cursor:pointer}
.kff-event-user-secondary-actions{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.kff-event-user-secondary-actions button{border:0;background:none;padding:0;text-align:left;color:#1683d8;font-size:13px;cursor:pointer}
.kff-event-modal{position:fixed;inset:0;background:rgba(15,23,42,.48);z-index:99999;display:flex;align-items:center;justify-content:center;padding:20px}
.kff-event-modal-panel{width:min(560px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.2)}
.kff-event-modal-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid #edf0f3}
.kff-event-modal-head h2{margin:0;font-size:22px}
.kff-event-modal-head button{border:0;background:none;font-size:28px;cursor:pointer}
.kff-event-modal-body{padding:22px}
.kff-event-form{display:grid;gap:14px}
.kff-event-form label{display:grid;gap:6px;font-size:13px;font-weight:700;color:#334155}
.kff-event-form input,.kff-event-form select,.kff-event-form textarea{width:100%;border:1px solid #ccd5df;border-radius:10px;padding:10px 12px;font:inherit;background:#fff}
.kff-event-form textarea{min-height:100px;resize:vertical}
.kff-event-modal-primary{border:0;border-radius:10px;background:#1683d8;color:#fff;padding:11px 16px;font-weight:800;cursor:pointer}
.kff-event-toast{position:fixed;right:22px;bottom:22px;z-index:100000;background:#172033;color:#fff;padding:12px 16px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.2)}
.kff-event-toast.error{background:#9b1c1c}

/* Event list */
.kff-events-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:16px!important;
}
.kff-event-image{
    height:170px!important;
    overflow:hidden!important;
    background:#f4f7fb!important;
}
.kff-event-image img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center!important;
}

/* Use the same pagination styles as Explore/Places */
#kffEventsPagination.kff-pagination{
    margin-top:22px!important;
    padding:18px 0 6px!important;
    border-top:1px solid var(--kff-border,#e1e7f0)!important;
}
#kffEventsPagination .kff-pagination-summary{
    margin-bottom:12px!important;
    color:var(--kff-muted,#667085)!important;
    font-size:12px!important;
    font-weight:600!important;
    text-align:center!important;
}
#kffEventsPagination .kff-pagination-controls{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:wrap!important;
    gap:7px!important;
}

@media(max-width:1250px){
    .kff-events-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:900px){
    .kff-events-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:780px){
    .kff-events-calendar-head{gap:10px!important}
    .kff-events-calendar-head h3{min-width:150px;font-size:20px!important}
    .kff-calendar-nav{width:38px!important;min-width:38px!important;height:38px!important}
    .kff-calendar-event-pill{font-size:0!important;height:8px!important;padding:0!important;margin:4px 0!important;border-radius:999px!important}
    .kff-events-toolbar{width:100%;justify-content:space-between}
    .kff-events-location-wrap{min-width:100%}
}
@media(max-width:650px){
    .kff-events-grid{grid-template-columns:1fr!important}
    .kff-event-image{height:190px!important}
}

/* ============================================================
   KFF EVENT DETAILS — colorful actions + comments/questions
   ============================================================ */

.kff-event-details-side-card {
    overflow: hidden;
}

.kff-event-user-actions {
    display: grid !important;
    gap: 10px !important;
    margin-top: 16px !important;
}

.kff-event-user-actions .kff-event-action,
.kff-event-user-actions button.kff-event-action {
    width: 100% !important;
    min-height: 48px !important;
    padding: 0 15px !important;
    border: 1px solid transparent !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transition:
        transform .16s ease,
        box-shadow .16s ease,
        border-color .16s ease !important;
}

.kff-event-user-actions .kff-event-action:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 7px 16px rgba(21, 35, 59, .08) !important;
}

.kff-event-user-actions [data-kff-event-action="save"] {
    border-color: #f7c8da !important;
    background: #fff1f6 !important;
    color: #d6336c !important;
}

.kff-event-user-actions [data-kff-event-action="save"].is-saved {
    border-color: #f4a9c7 !important;
    background: #ffe5ef !important;
    color: #c2255c !important;
}

.kff-event-user-actions [data-kff-event-action="list"] {
    border-color: #bfe9d1 !important;
    background: #edf9f2 !important;
    color: #248451 !important;
}

.kff-event-user-actions [data-kff-event-action="calendar"] {
    border-color: #b9cff9 !important;
    background: #edf4ff !important;
    color: #2f66cc !important;
}

.kff-event-user-secondary-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 9px !important;
    margin-top: 12px !important;
}

.kff-event-user-secondary-actions button,
.kff-event-user-secondary-actions .kff-add-photo-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    border: 1px solid #e1e7f0 !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: #344054 !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-align: left !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.kff-event-user-secondary-actions button:hover,
.kff-event-user-secondary-actions .kff-add-photo-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 14px rgba(21, 35, 59, .07) !important;
}

.kff-event-user-secondary-actions [data-kff-event-action="comment"] {
    border-color: #f1d59a !important;
    background: #fff8e8 !important;
    color: #9a6516 !important;
}

.kff-event-user-secondary-actions [data-kff-event-action="attended"] {
    border-color: #bde4df !important;
    background: #eefaf8 !important;
    color: #207c72 !important;
}

.kff-event-user-secondary-actions [data-kff-event-action="review"] {
    border-color: #dac9f7 !important;
    background: #f6f0ff !important;
    color: #7146b5 !important;
}

.kff-event-user-secondary-actions [data-kff-add-photo="event"] {
    border-color: #c9ddf9 !important;
    background: #f1f7ff !important;
    color: #2b69b1 !important;
}

.kff-event-user-secondary-actions [data-kff-event-action="correction"] {
    grid-column: 1 / -1 !important;
    border-color: #f4caca !important;
    background: #fff4f3 !important;
    color: #b42318 !important;
}

/* Event modal */
.kff-event-modal-panel {
    width: min(640px, 100%) !important;
    max-height: 90vh !important;
    border-radius: 20px !important;
}

.kff-event-modal-head {
    padding: 20px 24px !important;
}

.kff-event-modal-body {
    padding: 22px 24px 26px !important;
}

.kff-event-form {
    display: grid !important;
    gap: 16px !important;
}

.kff-event-form-note {
    padding: 12px 14px !important;
    border: 1px solid #f0d8a8 !important;
    border-radius: 12px !important;
    background: #fff9eb !important;
    color: #7a5a1f !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

.kff-event-form-note.review-note {
    border-color: #d9cafa !important;
    background: #f7f2ff !important;
    color: #65439a !important;
}

.kff-event-form label {
    gap: 7px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.kff-event-form input,
.kff-event-form select,
.kff-event-form textarea {
    border-color: #ccd7e5 !important;
    border-radius: 12px !important;
    padding: 11px 13px !important;
}

.kff-event-form textarea {
    min-height: 120px !important;
}

.kff-event-modal-primary {
    min-height: 48px !important;
    border-radius: 12px !important;
    background: #3478f6 !important;
    font-size: 13px !important;
}

.kff-event-modal-primary:hover {
    background: #2868df !important;
}

/* Questions & comments section */
.kff-event-comments-section {
    max-width: 1180px;
    margin: 56px auto 0;
    padding: 32px 0 0;
    border-top: 1px solid #e8edf2;
}

.kff-event-comments-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.kff-event-comments-head h2 {
    margin: 4px 0 6px;
    color: #172033;
    font-size: 27px;
}

.kff-event-comments-head p {
    margin: 0;
    color: #667085;
    font-size: 13px;
}

.kff-event-comment-cta {
    flex: 0 0 auto;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid #f1d59a;
    border-radius: 11px;
    background: #fff8e8;
    color: #9a6516;
    font-weight: 800;
    cursor: pointer;
}

.kff-event-comments-list {
    display: grid;
    gap: 12px;
}

.kff-event-comment-card {
    padding: 15px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
}

.kff-event-comment-card.is-pending {
    border-style: dashed;
    background: #fbfcfe;
}

.kff-event-comment-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 9px;
}

.kff-event-comment-top > div:first-child {
    display: grid;
    gap: 2px;
}

.kff-event-comment-top strong {
    color: #172033;
    font-size: 13px;
}

.kff-event-comment-top span {
    color: #7a8699;
    font-size: 10px;
}

.kff-event-comment-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.kff-event-comment-type,
.kff-event-comment-pending {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 9px !important;
    font-weight: 800;
}

.kff-event-comment-type.question {
    background: #fff5dc;
    color: #9a6516;
}

.kff-event-comment-type.comment {
    background: #eef5ff;
    color: #2f66cc;
}

.kff-event-comment-pending {
    background: #f3f4f6;
    color: #667085;
}

.kff-event-comment-card p {
    margin: 0;
    color: #475467;
    font-size: 13px;
    line-height: 1.6;
}

.kff-event-comments-empty {
    padding: 18px;
    border: 1px dashed #d8e0eb;
    border-radius: 14px;
    background: #fafcff;
    color: #667085;
    font-size: 12px;
    text-align: center;
}

@media (max-width: 700px) {
    .kff-event-user-secondary-actions {
        grid-template-columns: 1fr !important;
    }

    .kff-event-user-secondary-actions [data-kff-event-action="correction"] {
        grid-column: auto !important;
    }

    .kff-event-comments-head {
        flex-direction: column;
    }

    .kff-event-comment-cta {
        width: 100%;
    }
}
