/* ==========================================
   IkoForm - My Events
========================================== */


/* ==========================================
   My Events Page
========================================== */

.ikoform-my-events {

    max-width: 1200px;

    margin: 0 auto;

    padding: 40px 20px;

}

.ikoform-my-events h2 {

    margin: 0 0 10px;

    font-size: 32px;

    color: #222;

}

.ikoform-my-events > p {

    color: #666;

    font-size: 17px;

    line-height: 1.6;

}

.ikoform-my-events > p strong {

    color: #222;

}


/* ==========================================
   Success Message
========================================== */

.ikoform-success-message {

    max-width: 1200px;

    margin: 0 auto 25px;

    padding: 15px 20px;

    border: 1px solid #b7dfc3;

    border-radius: 8px;

    background: #eefaf1;

    color: #256b36;

}

.ikoform-success-message p {

    margin: 0;

    line-height: 1.6;

}


/* ==========================================
   My Events Grid
========================================== */

.ikoform-my-events .ikoform-event-list {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 24px;

    margin-top: 30px;

}


/* ==========================================
   My Event Cards
========================================== */

.ikoform-my-events .ikoform-event-card {

    height: 100%;

    display: flex;

    flex-direction: column;

    padding: 0;

    border: none;

    border-radius: 12px;

    background: #ffffff;

    overflow: hidden;

    box-shadow: 0 6px 18px rgba(0,0,0,.08);

    transition:
        transform .3s ease,
        box-shadow .3s ease;

}

.ikoform-my-events .ikoform-event-card:hover {

    transform: translateY(-5px);

    box-shadow: 0 12px 30px rgba(0,0,0,.12);

}


/* ==========================================
   Event Poster
========================================== */

.ikoform-my-events .ikoform-event-poster {

    width: 100%;

    flex: none;

    overflow: hidden;

}

.ikoform-my-events .ikoform-event-poster img {

    width: 100%;

    height: 260px;

    object-fit: cover;

    display: block;

    border-radius: 0;

    transition: transform .4s ease;

}

.ikoform-my-events .ikoform-event-card:hover
.ikoform-event-poster img {

    transform: scale(1.05);

}


/* ==========================================
   Event Details
========================================== */

.ikoform-my-events .ikoform-event-details {

    flex: 1;

    padding: 20px;

    border: none;

    border-radius: 0;

    background: #ffffff;

}

.ikoform-my-events .ikoform-event-details strong {

    display: block;

    margin-bottom: 12px;

    font-size: 21px;

    color: #222;

}

.ikoform-my-events .ikoform-event-details p {

    margin: 10px 0;

    color: #555;

    line-height: 1.5;

}


/* ==========================================
   My Event Buttons
========================================== */

.ikoform-my-events .ikoform-button {

    display: inline-block;

    margin: 10px 8px 0 0;

    padding: 10px 16px;

    background: #0d6efd;

    color: #ffffff;

    text-decoration: none;

    border: none;

    border-radius: 8px;

    font-size: 14px;

    font-weight: 600;

    transition:
        background .3s ease,
        transform .3s ease;

}

.ikoform-my-events .ikoform-button:hover {

    background: #0b5ed7;

    color: #ffffff;

    transform: translateY(-2px);

}

.ikoform-my-events .ikoform-button-danger {

    background: #dc3545;

}

.ikoform-my-events .ikoform-button-danger:hover {

    background: #bb2d3b;

    color: #ffffff;

}


/* ==========================================
   Submit New Event
========================================== */

.ikoform-my-events > p:last-child {

    margin-top: 35px;

}

.ikoform-my-events > p:last-child a {

    display: inline-block;

    padding: 12px 24px;

    background: #0d6efd;

    color: #ffffff;

    border-radius: 8px;

    text-decoration: none;

    font-weight: 600;

    transition:
        background .3s ease,
        transform .3s ease;

}

.ikoform-my-events > p:last-child a:hover {

    background: #0b5ed7;

    color: #ffffff;

    transform: translateY(-2px);

}


/* ==========================================
   Responsive
========================================== */

@media (max-width: 900px) {

    .ikoform-my-events .ikoform-event-list {

        grid-template-columns: repeat(2, 1fr);

    }

}

@media (max-width: 600px) {

    .ikoform-my-events {

        padding: 30px 15px;

    }

    .ikoform-my-events h2 {

        font-size: 28px;

    }

    .ikoform-my-events .ikoform-event-list {

        grid-template-columns: 1fr;

    }

    .ikoform-my-events .ikoform-button {

        width: 100%;

        margin-right: 0;

        text-align: center;

        box-sizing: border-box;

    }

    .ikoform-my-events > p:last-child a {

        width: 100%;

        box-sizing: border-box;

        text-align: center;

    }

}
/* ==========================================
   My Events Action Buttons
========================================== */

.ikoform-my-events .ikoform-event-actions {

    display: flex;

    gap: 10px;

    align-items: center;

    margin-top: 15px;

}

.ikoform-my-events .ikoform-event-actions .ikoform-button {

    flex: 1;

    margin: 0;

    text-align: center;

}
/* ==========================================
   My Events Actions
========================================== */

.ikoform-my-events .ikoform-event-actions {

    display: flex;

    gap: 10px;

    margin-top: 15px;

}

.ikoform-my-events .ikoform-event-actions .ikoform-button {

    flex: 1;

    margin: 0;

    text-align: center;

}

@media (max-width: 600px) {

    .ikoform-my-events .ikoform-event-actions {

        flex-direction: row;

    }

    .ikoform-my-events .ikoform-event-actions .ikoform-button {

        width: auto;

    }

}