/*
Theme Name: Hello Elementor Child
Author: EduCyber
Description: Created by EduCyber
Version: 1.0
Template: hello-elementor

This is the child theme for Hello Elementor theme, generated with Generate Child Theme plugin by catchthemes.

(optional values you can add: Theme URI, Author URI, License, License URI, Tags, Text Domain)
*/

#hot-deal-display {
	padding:0;
}
#hot-deal-display li {
    padding: 25px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
    margin: 0;
    box-sizing: border-box;
    list-style: none;
    margin-bottom: 15px;
}
/* ==========================================
   RSVP Card
========================================== */
.member-rsvp-form {
    margin-bottom: 25px;
}

.member-rsvp-form label {
    display: block;
    margin-bottom: 10px;
    font-weight: 600;
}

.member-select-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.member-select-row select {
    flex: 1;
    height: 42px;
    margin: 0;
}

.member-submit-btn {
    min-width: 120px;
    height: 42px;
    margin: 0 !important;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .member-select-row {
        flex-direction: column;
        align-items: stretch;
    }

    .member-submit-btn {
        width: 100%;
    }
}
.rsvp-card {
    padding: 20px;
    margin: 20px 0 0;
    border: 1px solid #E6EAED;
    background: #fff;
}

.rsvp-title {
    margin-bottom: 15px;
    font-family: "Poppins", sans-serif;
    font-size: 20px;
    font-weight: 600;
}
#members-attended p {
    column-count: 3;
}
/* ==========================================
   Card Layout
========================================== */
.card-body {
    display: flex;
    justify-content: space-between;
    align-items: center;
	gap: 25px;
}

.card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 0 20px;
    background: #7f1e21;
    margin-top: 15px;
    border-radius: 50px;
}
.card-footer p,
.card-footer p a {
    margin: 0;
    color: #fff;
    font-family: "League Spartan", Sans-serif;
    font-size: 18px;
    font-weight: 400;
	vertical-align: middle;
}
.card-footer p a {
    background: #ff0008;
    padding: 4px 8px;
    border-radius: 5px;
}

/* ==========================================
   RSVP List
========================================== */
.rsvp-style {
    list-style: none;
    padding-left: 15px;
}

.rsvp-style li {
    color: var(--e-global-color-text);
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 8px;
}
.rsvp-style li i {
    color: #681e1f;
    margin-right: 10px;
}
.status-going {
    background: #dcfce7;
    color: #15803d;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
}

.status-pending {
    background: #fef3c7;
    color: #b45309;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
}

.status-no {
    background: #fee2e2;
    color: #b91c1c;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
}
/* ==========================================
   RSVP Buttons
========================================== */
.rsvp-button {
    background-color: var(--e-global-color-accent);
    font-family: "League Spartan", Sans-serif;
    font-size: 18px;
    font-weight: 600;
    fill: var(--e-global-color-primary);
    color: var(--e-global-color-primary);
    border-radius: 5px 5px 5px 5px;
    padding: 8px 24px;
}
.rsvp_button:hover {
    background: #7f1e21 !important;
    color: #ffffff !important;
}

.btn-details {
    padding: 5px 20px;
    border-radius: 0;
    background-color: #2c2828;
    color: #fff!important;
    font-family: "League Spartan", Sans-serif;
    font-size: 18px;
    font-weight: 600;
}

.btn-details:hover {
    color: #ffffff !important;
}

/* ==========================================
   Guest Section
========================================== */
#guest_add_button {
    float: right;
}

/* ==========================================
   RSVP Form Container
========================================== */
#rsvp_input {
    margin: 20px 0;
    border: none;
}

#rsvp_input button,
form button {
    background: #013f7e;
    max-width: 300px;
    min-width: 140px;
    margin-top: 20px;
}

#rsvp_input button {
    position: absolute;
    right: 2%;
    bottom: 12px;
    float: right !important;
    clear: none !important;
    width: 23%;
    max-width: 300px;
    min-width: 120px;
    margin-top: -15px;
    background: #013f7e;
}

#rsvp_input button:hover,
#rsvp_input button:focus,
form button:hover {
    background: #313131;
    -webkit-box-shadow: 0 0 4px 0 rgba(188, 188, 188, 0.62),
        0 4px 12px 0 rgba(188, 188, 188, 0.62);
    box-shadow: 0 0 4px 0 rgba(188, 188, 188, 0.62),
        0 4px 12px 0 rgba(188, 188, 188, 0.62);
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
}

/* ==========================================
   RSVP Form Labels
========================================== */
#member-rsvp-form label {
    display: inline-block;
    margin-right: 4px;
    margin-left: 20px;
}

#member-rsvp-form #guest_name_div label {
    display: block;
    width: auto;
    margin-bottom: -20px;
    margin-left: 0;
    font-weight: bold;
}
/* ==========================================
   member profile page
========================================== */
.member-hero{
display:grid;
grid-template-columns:320px 1fr;
gap:30px;
margin-bottom:30px;
}

.member-photo img{
width:100%;
border-radius:12px;
display:block;
}

.member-details{
background:#fff;
border:1px solid #e5e5e5;
border-radius:12px;
padding:30px;
}

.member-category{
color:#681e1f;
font-weight:600;
margin-bottom:10px;
}

.member-details h2{
margin:0 0 20px;
}

.info-row{
margin-bottom:12px;
line-height:1.6;
}
.info-row a {
color: #7c1e1c;
}

.member-card{
background:#fff;
border:1px solid #e5e5e5;
border-radius:12px;
padding:25px;
margin-bottom:25px;
}

.member-card h3{
margin-top:0;
margin-bottom:15px;
}

.member-gallery{
    display:grid;
	align-items: center;
    grid-template-columns:repeat(auto-fit,minmax(250px,320px));
    gap:20px;
    justify-content:flex-start;
}

.member-gallery img{
    width:100%;
    border-radius:10px;
    display:block;
}

#canvas{
width:100%;
height:400px;
}

@media(max-width:768px){

.member-hero{
    grid-template-columns:1fr;
}
}

/* ==========================================
   Modal Headings
========================================== */
#rsvp_input_modal h3 {
    display: none;
}

#rsvp_input_modal .modal-content h3 {
    display: block;
}
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1320; /* Sit on top */
    padding-top: 20%; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal input {
	margin-bottom: 8px;
}

/* Modal Content */

.modal-content {
    background-color: #fefefe;
    margin: auto;
	bottom: 150px;
	position: relative;
    width: 50%;
    padding: 20px;
    border: 1px solid #888;
	-moz-box-shadow: 0 0 6px #555555;
	box-shadow: 0 0 6px #555555;
}

.modal-content .modal-content {
	-moz-box-shadow: 0 0 0px #555555;
	box-shadow: 0 0 0px #555555;
	border-top: 0;
	width: 100%;
}
.modal-content .modal-content:first-of-type {
	border-top: 8px solid #555555;
}

/* The Close Button */

.close {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    line-height: 28px;
    width: 28px;
    text-align: center;
    margin-top: -10px;
}

.close:hover, .close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

#educyber-crm-modal-edit-member-note-field {
    width: 100%;
}
#member-rsvp-form label:first-of-type {
    font-family: 'Poppins';
    font-size: 16px !important;
    line-height: 22px;
    display: block;
    width: auto;
    margin-left: 0;
    font-weight: 500;
}

/* ==========================================
   Animations
========================================== */
@keyframes fadeIn {
    99% {
        visibility: hidden;
    }

    100% {
        visibility: visible;
    }
}

@media screen and (max-width: 780px) {
	.modal:before {
		content: '';
		height: 40%;
		display: inline-block;
	  }
	.modal-content {
		width: 100%!important;
	}
}

/* ==========================================
   Renew Membership page
========================================== */

.checkout-card {
    background: #fff;
    padding: 30px;
    border: 1px solid #ffe6e6;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .08);
    margin-bottom: 30px;
}

.checkout-card h2{
    margin:0 0 25px;
}

.checkout-notice{
    background:#fff7ed;
    border-left:4px solid #f97316;
    padding:15px;
    margin-bottom:20px;
}

.order-item{
    display:flex;
    justify-content:space-between;
    gap:30px;
    padding:20px 0;
    border-bottom:1px solid #eee;
}

.order-item:last-child{
    border-bottom:none;
}

.order-item-info{
    flex:1;
}

.order-item-info h4{
    margin:0 0 5px;
}

.order-item-info p{
    margin:0;
    color:#666;
}

.order-item-price{
    text-align:right;
    min-width:250px;
}

.qty-price-wrap{
    display:flex;
    align-items:center;
    gap:12px;
    justify-content:flex-end;
}

.qty-field{
    width:80px !important;
}

.price-label{
    font-weight:600;
    color:#7a1d1d;
}

.checkout-total{
    display:flex;
    justify-content:space-between;
    font-size:24px;
    font-weight:700;
    margin-top:25px;
    padding-top:20px;
    border-top:2px solid #eee;
}

.membership-option{
    display:block;
    margin-bottom:10px;
}

@media(max-width:768px){

    .order-item{
        flex-direction:column;
    }

    .order-item-price{
        text-align:left;
        min-width:100%;
    }

    .qty-price-wrap{
        justify-content:flex-start;
    }
}
.billing-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.form-group{
    display:flex;
    flex-direction:column;
}

.form-group label{
    font-weight:600;
    margin-bottom:6px;
}

.form-group input,
.form-group select{
    width:100%;
    height:48px;
    border:1px solid #ddd;
    border-radius:8px;
    padding:0 12px;
}

.full-width{
    grid-column:1 / -1;
}

.payment-options{
    display:flex;
    gap:20px;
}

.payment-option{
    border:1px solid #ddd;
    padding:15px 20px;
    border-radius:10px;
    cursor:pointer;
}

.payment-option input{
    margin-right:8px;
}

@media(max-width:768px){

    .billing-grid{
        grid-template-columns:1fr;
    }

    .payment-options{
        flex-direction:column;
    }
}
.membership-notice{
    margin-bottom:30px;
}

.dues-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-bottom:30px;
}

.dues-item{
    background:#f8f9fa;
    border-radius:12px;
    padding:20px;
    text-align:center;
}

.dues-label{
    display:block;
    font-weight:600;
    margin-bottom:10px;
}

.dues-price{
    display:block;
    font-size:32px;
    font-weight:700;
    color:#7a1d1d;
}

.dues-item small{
    color:#666;
}

.mailing-address{
    border-top:1px solid #eee;
    padding-top:25px;
}

.mailing-address h3{
    margin-bottom:10px;
}

.checkout-submit-wrap{
    text-align:center;
    margin-top:30px;
}

.checkout-submit-btn{
    background:#7a1d1d;
    color:#fff;
    border:none;
    border-radius:10px;
    padding:16px 40px;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
    transition:.3s;
}

.checkout-submit-btn:hover{
    opacity:.9;
}

@media(max-width:768px){

    .dues-grid{
        grid-template-columns:1fr;
    }

    .checkout-submit-btn{
        width:100%;
    }
}

/* ==========================================
   RVSP Email page
========================================== */
.rsvp-dashboard{
    max-width:1200px;
    margin:0 auto;
}

.event-grid{
    display:grid;
    gap:30px;
}

.event-card {
    background: #fff;
    padding: 25px;
    border: 1px solid #681e1f26;
    box-shadow: 0 4px 15px rgba(0, 0, 0, .08);
}

.event-card-header{
    margin-bottom:20px;
}

.event-card-header h3 {
    margin: 0 0 10px;
    font-size: 20px;
    line-height: 30px;
    font-weight: 700;
}

.event-date{
    color:#666;
}

.event-card-actions{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

.btn-rsvp{
    border:none;
    border-radius:8px;
    padding:12px 20px;
    cursor:pointer;
    font-weight:600;
}

.btn-yes{
    background:#198754;
    color:#fff;
}

.btn-no{
    background:#dc3545;
    color:#fff;
}

.btn-pending{
    background:#fd7e14;
    color:#fff;
}

.modern-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.5);
    z-index:9999;
	overflow-y:auto;
}

.modern-modal-content{
    width:800px;
    max-width:95%;
    margin:50px auto;
    background:#fff;
    border-radius:14px;
    padding:25px;
	overflow-y:auto; /* scroll inside modal */
}

.modal-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.form-group{
    margin-bottom:20px;
}

.form-group label{
    display:block;
    margin-bottom:8px;
    font-weight:600;
}

.form-group input,
.form-group textarea{
    width:100%;
    border:1px solid #ddd;
    border-radius:8px;
    padding:12px;
}
.form-group textarea {
    height: 70px;
}
.modal-actions{
    display:flex;
    gap:15px;
    margin-bottom:20px;
}

.primary-btn{
    background:#7b1d1d;
    color:#fff;
    border:none;
    padding:12px 25px;
    border-radius:8px;
}

.secondary-btn{
    background:#f3f4f6;
    border:none;
    padding:12px 25px;
    border-radius:8px;
}

.close{
    cursor:pointer;
    font-size:28px;
}
