/* Scoped box-sizing for plugin elements only - prevent admin table conflicts */
#booking-popup *,
#booking-popup-content *,
#booking-form-response *,
.relayout-booking-suite *,
.relayout-stay-metabox *,
.relayout-experience-metabox *,
.relayout-event-metabox * {
    box-sizing: border-box;
}


#booking-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

#booking-popup-content {
    background: #fff;
    padding: 20px;
    border-radius: 5px;
    position: relative;
    width: 90%;
    max-width: 500px;
}

#booking-popup-close {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    font-size: 24px;
}



/* Form Response Messages */
#booking-form-response {
    padding: 12px 15px;
    border-radius: 4px;
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 1.4;
}

#booking-form-response.error {
    background-color: #ffeaea;
    border: 1px solid #ff6b6b;
    color: #d63031;
}

#booking-form-response.success {
    background-color: #eafaf1;
    border: 1px solid #00b894;
    color: #00a085;
}

/* Field Error Messages */
.field-error {
    color: #d63031 !important;
    font-size: 12px !important;
    margin-top: 5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    background-color: #ffeaea !important;
    padding: 5px 8px !important;
    border-radius: 3px !important;
    border: 1px solid #ff6b6b !important;
    margin-bottom: 10px !important;
    display: none !important;
}

.field-error.show {
    display: block !important;
}

/* Room Availability Status */
.availability-status {
    font-weight: 500;
    text-align: center;
}

.availability-status.available {
    background-color: #eafaf1;
    border: 1px solid #00b894;
    color: #00a085;
}

.availability-status.unavailable {
    background-color: #ffeaea;
    border: 1px solid #ff6b6b;
    color: #d63031;
}

.availability-status.checking {
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    color: #856404;
}

/* Form Input Validation States */
.e-booking-form-input input.error,
.e-booking-form-input select.error,
.e-booking-form-input textarea.error {
    border-color: #ff6b6b;
    box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.2);
}

.e-booking-form-input input.success,
.e-booking-form-input select.success,
.e-booking-form-input textarea.success {
    border-color: #00b894;
    box-shadow: 0 0 0 2px rgba(0, 184, 148, 0.2);
}

/* Capacity display styling */
.capacity-info {
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    display: none;
}

.capacity-info.show {
    display: block;
}

.capacity-available {
    color: #2e7d32;
    background-color: #e8f5e8;
    border-left: 3px solid #4caf50;
}

.capacity-limited {
    color: #f57c00;
    background-color: #fff3e0;
    border-left: 3px solid #ff9800;
}

.capacity-full {
    color: #d32f2f;
    background-color: #ffebee;
    border-left: 3px solid #f44336;
}

.capacity-info span {
    display: block;
}

/* Submit Button States */
#booking-form button {
   color: #fff !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}

#booking-form button:disabled {
    background-color: #ccc !important;
    cursor: not-allowed;
    opacity: 0.7;
}

#booking-form button .loading-text {
    display: none;
}

#booking-form button:disabled .loading-text {
    display: inline;
}

#booking-form button:disabled .submit-text {
    display: none;
}

#booking-form p {
    margin-top: 10px;
}
#room-availability-status {
    color: red;
    padding: 10px;
    text-align: center;
}

#booking-popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}



.availability-status {
    margin-left: 10px;
    font-weight: bold;
}


/* rebooking form
 */

.re-booking-form {
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 20px;
}

.re-booking-form-admin {
	width:100%
		
}



.re-booking-ainput {
	padding:10px 0px;

}

.re-booking-ainput label {
	display: block;
    color: #000000;
    margin: 8px 0px;
    font-weight: bold;
    font-size: 12px;
	
	
}


.re-booking-ainput input[type="text"], 
.re-booking-ainput input[type="password"], 
.re-booking-ainput input[type="number"],
.re-booking-ainput input[type="email"],
.re-booking-ainput input[type="datetime"],
.re-booking-ainput input[type="date"],
.re-booking-ainput input[type="time"],
.re-booking-ainputinput[type="datetime-local"], 
.re-booking-ainput textarea, 
.re-booking-ainput select

 {
	   margin-top: 5px !important;
	    background: #F3F7FA !important;
    border: 1px solid #38364B !important;
    border-radius: 5px !important;
       padding: 5px 10px !important;

    display: block !important;
    font-size: 14px !important;
    width: 100%;
    line-height: normal !important;
    color: #8B87A8 !important;
    outline: none;
}

.remove-experience {
	margin-top:20px  !important;
	font-weight: normal;
    font-size: 14px !important;
    line-height: 18px  !important;
    color: #ffffff  !important;
    background: red  !important;
    border-radius: 5px  !important;
    width:200px;
    padding: 10px 20px  !important;
    cursor: pointer  !important;
    outline: none !important;
    border: none !important;
}

.remove-room {
	margin-top:20px  !important;
	font-weight: normal;
    font-size: 14px !important;
    line-height: 18px  !important;
    color: #ffffff  !important;
    background: red  !important;
    border-radius: 5px  !important;
    width:200px;
    padding: 10px 20px  !important;
    cursor: pointer  !important;
    outline: none !important;
    border: none !important;
}

.add-experience {
	margin-top:20px  !important;
	font-weight: normal;
    font-size: 14px !important;
    line-height: 18px  !important;
    color: #ffffff  !important;
    background: green  !important;
    border-radius: 5px  !important;
    width:200px;
    padding: 10px 20px  !important;
    cursor: pointer  !important;
    outline: none !important;
    border: none !important;
}


.add-room  {
	margin-top:20px  !important;
	font-weight: normal;
    font-size: 14px !important;
    line-height: 18px  !important;
    color: #ffffff  !important;
    background: green  !important;
    border-radius: 5px  !important;
    width:200px;
    padding: 10px 20px  !important;
    cursor: pointer  !important;
    outline: none !important;
    border: none !important;
}
.re-book-img {
    margin: 10px;
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 32px;
}

.re-greenbtn {
	margin-top:20px  !important;
	font-weight: normal;
    font-size: 14px !important;
    line-height: 18px  !important;
    color: #ffffff  !important;
    background: green  !important;
    border-radius: 5px  !important;
    width:200px;
    padding: 10px 20px  !important;
    cursor: pointer  !important;
    outline: none !important;
    border: none !important;
}


.display-none {
display:none;
}

.re-heading {
    font-family: "Poppins", Sans-serif;
   font-size: 18px !important;
    font-weight: 500;
    color: #757575;
}

.re-booking-form img {
    width: 200px !important;
    height: 180px !important;
    border-radius: 10px !important;
}

.re-booking-form h2 {
       padding: 10px 0px;
    border-radius: 0px;
    font-family: "Poppins", Sans-serif;
    font-size: 17px !important;
    font-weight: 500;
    color: darkblue;
    border-bottom: 1px solid;
}

.re-booking-form button {
	    color: #fff  !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}




#booking-form label {
    font-size: 14px;
    padding: 10px 0px 0px 0px;
    font-family: "Poppins", Sans-serif;
    font-weight: 400;
    color: #130a0a;
    display: block;
}




#booking-form  input[type="text"], 
#booking-form  input[type="password"], 
#booking-form  input[type="number"],
#booking-form  input[type="email"],
#booking-form  input[type="datetime"],
#booking-form  input[type="date"],
#booking-form  input[type="time"],
#booking-form  iput[type="datetime-local"], 
#booking-form  textarea, 
#booking-form  select


{
	    border: none !important;
    padding: 15px 15px !important;
    width: 100% !important;
    background-color: #F3F7FA !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    margin: 0px !important;
    color: #686E7A !important;
    font-family: inherit;
}

h3#pleaseselect {
    font-family: "Poppins", Sans-serif;
    text-align: center;
    font-size: 16px;
    text-transform: capitalize;
    color: darkblue;
}


.re-block {
	width:100%;
	display: block;
}
.re-align {
    display: flex;
    align-items: stretch;
    column-gap: 10px;
}







#event-enquiry-form label {
    font-size: 14px;
    padding: 10px 0px 0px 0px;
    font-family: "Poppins", Sans-serif;
    font-weight: 400;
    color: #130a0a;
    display: block;
}

#event-enquiry-form button {
   color: #fff !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}

#event-enquiry-form  input[type="text"], 
#event-enquiry-form  input[type="password"], 
#event-enquiry-form   input[type="number"],
#event-enquiry-form   input[type="email"],
#event-enquiry-form   input[type="datetime"],
#event-enquiry-form  input[type="date"],
#event-enquiry-form   input[type="time"],
#event-enquiry-form  input[type="datetime-local"], 
#event-enquiry-form   textarea, 
#event-enquiry-form   select
{
	 border: none !important;
    padding: 15px 15px !important;
    width: 100% !important;
    background-color: #F3F7FA !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    margin: 0px !important;
    color: #686E7A !important;
    font-family: inherit;
}



#experience-booking-form label {
    font-size: 14px;
    padding: 10px 0px 0px 0px;
    font-family: "Poppins", Sans-serif;
    font-weight: 400;
    color: #130a0a;
    display: block;
}

#experience-booking-form button {
   color: #fff !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}

#experience-booking-form  input[type="text"], 
#experience-booking-form   input[type="password"], 
#experience-booking-form   input[type="number"],
#experience-booking-form   input[type="email"],
#experience-booking-form   input[type="datetime"],
#experience-booking-form   input[type="date"],
#experience-booking-form   input[type="time"],
#experience-booking-form   input[type="datetime-local"], 
#experience-booking-form   textarea, 
#experience-booking-form   select
{
	 border: none !important;
    padding: 15px 15px !important;
    width: 100% !important;
    background-color: #F3F7FA !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    margin: 0px !important;
    color: #686E7A !important;
    font-family: inherit;
}

#event-booking-form label {
    font-size: 14px;
    padding: 10px 0px 0px 0px;
    font-family: "Poppins", Sans-serif;
    font-weight: 400;
    color: #130a0a;
    display: block;
}

#event-booking-form button {
   color: #fff !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}

#event-booking-form  input[type="text"], 
#event-booking-form   input[type="password"], 
#event-booking-form   input[type="number"],
#event-booking-form   input[type="email"],
#event-booking-form   input[type="datetime"],
#event-booking-form   input[type="date"],
#event-booking-form   input[type="time"],
#event-booking-form   iput[type="datetime-local"], 
#event-booking-form   textarea, 
#event-booking-form   select
{
	 border: none !important;
    padding: 15px 15px !important;
    width: 100% !important;
    background-color: #F3F7FA !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    margin: 0px !important;
    color: #686E7A !important;
    font-family: inherit;
}




#enquiry-form label {
    font-size: 14px;
    padding: 10px 0px 0px 0px;
    font-family: "Poppins", Sans-serif;
    font-weight: 400;
    color: #130a0a;
    display: block;
}


#enquiry-form  input[type="text"], 
#enquiry-form  input[type="password"], 
#enquiry-form  input[type="number"],
#enquiry-form  input[type="email"],
#enquiry-form  input[type="datetime"],
#enquiry-form  input[type="date"],
#enquiry-form  input[type="time"],
#enquiry-form  iput[type="datetime-local"], 
#enquiry-form  textarea, 
#enquiry-form  select


{
	    border: none !important;
    padding: 15px 15px !important;
    width: 100% !important;
    background-color: #F3F7FA !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    margin: 0px !important;
    color: #686E7A !important;
    font-family: inherit;
}


#enquiry-form button {
   color: #fff !important;
    background-color: red !important;
    padding: 12px 24px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 500;
    display: block;
    text-align: center;
    transition: all .6s ease;
    font-family: inherit;
    border: 0px !important;
    cursor: pointer;
}

.re-total {
	font-size:36px;
	color: red;
	font-weight:500;
}

.col-50 {
	width:45%;
	float:left;
}
.mr-20 {
margin-right:20px;
}

.pr-20 {
padding-right:20px;
}

.color-green {
	color: green !important;
}






.row-center {
	width: 100%;
	overflow: auto;
	display: flex;
	align-items: center;
}
.row {
    width: 100%;
    overflow: auto;
    overflow-x: hidden;

}
.float-left {
	float: left;
}
.float-right {
	float: right;
}
.container-height {
	width: 90%;
	height: 100%;
	overflow: auto;
	margin: 0 auto;
}
.container-short {
	max-width: 70%;
	overflow: auto;
	margin: 0 auto;
}
.container {
	width: 90%;
	overflow: auto;
	margin: 0 auto;
}
.container-fluid {
	width: 100%;
	overflow: auto;
	margin: 0 auto;
}
.img-fluid {
	width: 100%;
}
.show-on-mobile {
	display: none;
}
.height-x {
	height: 100vh;
}
.col-100 {
	width: 100%;
}
.col-90 {
	width: 90%;
	float: left;
}
.col-80 {
	width: 80%;
	float: left;
}
.col-70 {
	width: 70%;
	float: left;
}
.col-60 {
	width: 60%;
	float: left;
}
.col-50 {
	width: 45%;
	float: left;
}
.col-40 {
	width: 40%;
	float: left;
}
.col-30 {
	width: 30%;
	float: left;
}
.col-33 {
	width: 33.33%;
	float: left;
}
.col-25 {
	width: 25%;
	float: left;
}
.col-20 {
	width: 20%;
	float: left;
}
.col-10 {
	width: 10%;
	float: left;
}
.m-10 {
	margin: 10px;
}
.m-20 {
	margin: 20px;
}
.m-30 {
	margin: 30px;
}
.m-40 {
	margin: 40px;
}
.m-50 {
	margin: 50px;
}
.m-60 {
	margin: 60px;
}
.m-70 {
	margin: 70px;
}
.m-80 {
	margin: 80px;
}
.m-90 {
	margin: 90px;
}
.m-100 {
	margin: 100px;
}
.mt-10 {
	margin-top: 10px;
}
.mt-20 {
	margin-top: 20px;
}
.mt-30 {
	margin-top: 30px;
}
.mt-40 {
	margin-top: 40px;
}
.mt-50 {
	margin-top: 50px;
}
.mt-60 {
	margin-top: 60px;
}
.mt-70 {
	margin-top: 70px;
}
.mt-80 {
	margin-top: 80px;
}
.mt-90 {
	margin-top: 90px;
}
.mt-100 {
	margin-top: 100px;
}
.mr-10 {
	margin-right: 10px;
}
.mr-20 {
	margin-right: 20px;
}
.mr-30 {
	margin-right: 30px;
}
.mr-40 {
	margin-right: 40px;
}
.mr-50 {
	margin-right: 50px;
}
.mr-60 {
	margin-right: 60px;
}
.mr-70 {
	margin-right: 70px;
}
.mr-80 {
	margin-right: 80px;
}
.mr-90 {
	margin-right: 90px;
}
.mr-100 {
	margin-right: 100px;
}
.mb-10 {
	margin-bottom: 10px;
}
.mb-20 {
	margin-bottom: 20px;
}
.mb-30 {
	margin-bottom: 30px;
}
.mb-40 {
	margin-bottom: 40px;
}
.mb-50 {
	margin-bottom: 50px;
}
.mb-60 {
	margin-bottom: 60px;
}
.mb-70 {
	margin-bottom: 70px;
}
.mb-80 {
	margin-bottom: 80px;
}
.mb-90 {
	margin-bottom: 90px;
}
.mb-100 {
	margin-bottom: 100px;
}
.ml-10 {
	margin-left: 10px;
}
.ml-20 {
	margin-left: 20px;
}
.ml-30 {
	margin-left: 30px;
}
.ml-40 {
	margin-left: 40px;
}
.ml-50 {
	margin-left: 50px;
}
.ml-60 {
	margin-left: 60px;
}
.ml-70 {
	margin-left: 70px;
}
.ml-80 {
	margin-left: 80px;
}
.ml-90 {
	margin-left: 90px;
}
.ml-100 {
	margin-left: 100px;
}
.p-10 {
	padding: 10px;
}
.p-20 {
	padding: 20px !important;
}
.p-30 {
	padding: 30px;
}
.p-40 {
	padding: 40px;
}
.p-50 {
	padding: 50px;
}
.p-60 {
	padding: 60px;
}
.p-70 {
	padding: 70px;
}
.p-80 {
	padding: 80px;
}
.p-90 {
	padding: 90px;
}
.p-100 {
	padding: 100px;
}
.pt-10 {
	padding-top: 10px;
}
.pt-20 {
	padding-top: 20px;
}
.pt-30 {
	padding-top: 30px;
}
.pt-40 {
	padding-top: 40px;
}
.pt-50 {
	padding-top: 50px;
}
.pt-60 {
	padding-top: 60px;
}
.pt-70 {
	padding-top: 70px;
}
.pt-80 {
	padding-top: 80px;
}
.pt-90 {
	padding-top: 90px;
}
.pt-100 {
	padding-top: 100px;
}
.pr-10 {
	padding-right: 10px;
}
.pr-20 {
	padding-right: 20px;
}
.pr-30 {
	padding-right: 30px;
}
.pr-40 {
	padding-right: 40px;
}
.pr-50 {
	padding-right: 50px;
}
.pr-60 {
	padding-right: 60px;
}
.pr-70 {
	padding-right: 70px;
}
.pr-80 {
	padding-right: 80px;
}
.pr-90 {
	padding-right: 90px;
}
.pr-100 {
	padding-right: 100px;
}
.pb-10 {
	padding-bottom: 10px;
}
.pb-20 {
	padding-bottom: 20px;
}
.pb-30 {
	padding-bottom: 30px;
}
.pb-40 {
	padding-bottom: 40px;
}
.pb-50 {
	padding-bottom: 50px;
}
.pb-60 {
	padding-bottom: 60px;
}
.pb-70 {
	padding-bottom: 70px;
}
.pb-80 {
	padding-bottom: 80px;
}
.pb-90 {
	padding-bottom: 90px;
}
.pb-100 {
	padding-bottom: 100px;
}
.pl-10 {
	padding-left: 10px;
}
.pl-20 {
	padding-left: 20px;
}
.pl-30 {
	padding-left: 30px;
}
.pl-40 {
	padding-left: 40px;
}
.pl-50 {
	padding-left: 50px;
}
.pl-60 {
	padding-left: 60px;
}
.pl-70 {
	padding-left: 70px;
}
.pl-80 {
	padding-left: 80px;
}
.pl-90 {
	padding-left: 90px;
}
.pl-100 {
	padding-left: 100px;
}
@media only screen and (max-width: 6000px) {
	.col-lg-100 {
		width: 100%;
	}
	.col-lg-90 {
		width: 90%;
		float: left;
	}
	.col-lg-80 {
		width: 80%;
		float: left;
	}
	.col-lg-70 {
		width: 70%;
		float: left;
	}
	.col-lg-60 {
		width: 60%;
		float: left;
	}
	.col-lg-50 {
		width: 50%;
		float: left;
	}
	.col-lg-40 {
		width: 40%;
		float: left;
	}
	.col-lg-30 {
		width: 30%;
		float: left;
	}
	.col-lg-33 {
		width: 33.33%;
		float: left;
	}
	.col-lg-25 {
		width: 25%;
		float: left;
	}
	.col-lg-20 {
		width: 20%;
		float: left;
	}
	.col-lg-10 {
		width: 10%;
		float: left;
	}
}
@media only screen and (max-width: 958px) {
	
	.re-booking-form img {
    width:100% !important;
    height: 200px !important;
	object-fit:cover;
    border-radius: 10px !important;
}
	.hide-on-tablet {
		display: none;
	}
	.col-md-100 {
		width: 100%;
	}
	.col-md-90 {
		width: 90%;
		float: left;
	}
	.col-md-80 {
		width: 80%;
		float: left;
	}
	.col-md-70 {
		width: 70%;
		float: left;
	}
	.col-md-60 {
		width: 60%;
		float: left;
	}
	.col-md-50 {
		width: 50%;
		float: left;
	}
	.col-md-40 {
		width: 40%;
		float: left;
	}
	.col-md-30 {
		width: 30%;
		float: left;
	}
	.col-md-33 {
		width: 33.33%;
		float: left;
	}
	.col-md-25 {
		width: 25%;
		float: left;
	}
	.col-md-20 {
		width: 20%;
		float: left;
	}
	.col-md-10 {
		width: 10%;
		float: left;
	}
}
@media only screen and (max-width: 958px) {

.pl-40 {
    padding-left: 0px;
}


	.absolute {
		position: relative;
		background-color: #ffffff;
	}
	.container-short {
		max-width: 95%;
		overflow: auto;
		margin: 0 auto;
	}
	.hide-on-mobile {
		display: none;
	}
	.show-on-mobile {
		display: block;
	}
	.col-sm-100 {
		width: 100%;
	}
	.col-sm-90 {
		width: 90%;
		float: left;
	}
	.col-sm-80 {
		width: 80%;
		float: left;
	}
	.col-sm-70 {
		width: 70%;
		float: left;
	}
	.col-sm-60 {
		width: 60%;
		float: left;
	}
	.col-sm-50 {
		width: 50%;
		float: left;
	}
	.col-sm-40 {
		width: 40%;
		float: left;
	}
	.col-sm-30 {
		width: 30%;
		float: left;
	}
	.col-sm-33 {
		width: 33.33%;
		float: left;
	}
	.col-sm-25 {
		width: 25%;
		float: left;
	}
	.col-sm-20 {
		width: 20%;
		float: left;
	}
	.col-sm-10 {
		width: 10%;
		float: left;
	}
}






.features {
    display: inline-block;
    padding: 10px 20px;
    background: aliceblue;
    margin: 5px;
    border-radius: 5px;
	    color: #040438;
	font-size: 13px;
}

.features b {
    padding: 5px 5px;
    font-size: 14px;
}
.features strong {
    padding-left: 5px;
}

.feature-price {
    font-weight: bold;
    color: red;
    font-size: 23px;
}

.features-pricelist {
    display: inline-block;
    padding: 10px 20px;
    background: #ffdcdc;
    margin: 5px;
    border-radius: 5px;
    color: #ff0000;
    font-size: 13px;
}

.features-pricelist  b {
    padding: 5px 5px;
    font-size: 14px;
}
.features-pricelist  strong {
    padding-left: 5px;
}

/* ========================================
   MODERN ADMIN STYLING FOR RELAYOUT BOOKING SUITE
   ======================================== */

/* Admin Meta Box Container */
.relayout-booking-admin-container {
    background: #ffffff;
    border: 1px solid #e1e5e9;
    border-radius: 8px;
    padding: 24px;
    margin: 16px 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Enhanced Admin Form Styling */
.re-booking-form-admin {
    background: #ffffff;
    border: 1px solid #e1e5e9;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    position: relative;
}

.re-booking-form-admin:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

.re-booking-form-admin h4 {
    color: #2c3e50;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 20px 0;
    padding: 0 0 12px 0;
    border-bottom: 2px solid #3498db;
    display: flex;
    align-items: center;
}

.re-booking-form-admin h4:before {
    content: "📋";
    margin-right: 8px;
    font-size: 16px;
}

/* Modern Input Field Styling */
.re-booking-ainput {
    margin-bottom: 20px;
    position: relative;
}

.re-booking-ainput label {
    display: block;
    color: #34495e;
    margin: 0 0 8px 0;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
}

.re-booking-ainput label:after {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 30px;
    height: 2px;
    background: linear-gradient(90deg, #3498db, #2ecc71);
    border-radius: 1px;
}

/* Enhanced Input Fields */
.re-booking-ainput input[type="text"], 
.re-booking-ainput input[type="password"], 
.re-booking-ainput input[type="number"],
.re-booking-ainput input[type="email"],
.re-booking-ainput input[type="datetime"],
.re-booking-ainput input[type="date"],
.re-booking-ainput input[type="time"],
.re-booking-ainput input[type="datetime-local"], 
.re-booking-ainput textarea, 
.re-booking-ainput select {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 2px solid #e8ecef !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #2c3e50 !important;
    background: #ffffff !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
    outline: none !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

.re-booking-ainput input:focus,
.re-booking-ainput textarea:focus,
.re-booking-ainput select:focus {
    border-color: #3498db !important;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1) !important;
    background: #fafbfc !important;
}

.re-booking-ainput input:hover,
.re-booking-ainput textarea:hover,
.re-booking-ainput select:hover {
    border-color: #bdc3c7 !important;
}

/* Select Dropdown Styling */
.re-booking-ainput select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e") !important;
    background-position: right 12px center !important;
    background-repeat: no-repeat !important;
    background-size: 16px !important;
    padding-right: 40px !important;
    appearance: none !important;
}

/* Modern Button Styling */
.add-room, .add-experience, .add-event {
    background: linear-gradient(135deg, #2ecc71, #27ae60) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 14px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 20px 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.add-room:before, .add-experience:before, .add-event:before {
    content: "➕";
    font-size: 12px;
}

.add-room:hover, .add-experience:hover, .add-event:hover {
    background: linear-gradient(135deg, #27ae60, #229954) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(46, 204, 113, 0.4) !important;
}

.add-room:active, .add-experience:active, .add-event:active {
    transform: translateY(0) !important;
}

/* Remove Button Styling */
.remove-room, .remove-experience, .remove-event {
    background: linear-gradient(135deg, #e74c3c, #c0392b) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 16px 0 0 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.remove-room:before, .remove-experience:before, .remove-event:before {
    content: "🗑️";
    font-size: 12px;
}

.remove-room:hover, .remove-experience:hover, .remove-event:hover {
    background: linear-gradient(135deg, #c0392b, #a93226) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(231, 76, 60, 0.4) !important;
}

/* Upload Button Styling */
.relayout_booking_suite_upload_image_button {
    background: linear-gradient(135deg, #3498db, #2980b9) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 20px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(52, 152, 219, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 8px 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.relayout_booking_suite_upload_image_button:before {
    content: "📷";
    font-size: 12px;
}

.relayout_booking_suite_upload_image_button:hover {
    background: linear-gradient(135deg, #2980b9, #1f618d) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4) !important;
}

/* Image Preview Styling */
.re-book-img {
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease !important;
    border: 3px solid #ffffff !important;
    margin: 12px 0 !important;
}

.re-book-img:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

/* Row Layout Improvements */
.relayout-booking-suite-admin .row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin: 16px 0 !important;
}

.relayout-booking-suite-admin .row .re-booking-ainput {
    flex: 1 !important;
    min-width: 200px !important;
}

/* Column Responsive Improvements */
.col-25 {
    width: calc(25% - 12px) !important;
    min-width: 200px !important;
}

.col-50 {
    width: calc(50% - 8px) !important;
    min-width: 250px !important;
}

/* Status Indicators */
.status-indicator {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-enabled {
    background: #d5f4e6;
    color: #27ae60;
}

.status-disabled {
    background: #fadbd8;
    color: #e74c3c;
}

/* Loading States */
.loading {
    opacity: 0.6;
    pointer-events: none;
    position: relative;
}

.loading:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #3498db;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Success/Error Messages */
.admin-message {
    padding: 16px 20px;
    border-radius: 8px;
    margin: 16px 0;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 12px;
}

.admin-message.success {
    background: #d5f4e6;
    color: #27ae60;
    border-left: 4px solid #27ae60;
}

.admin-message.error {
    background: #fadbd8;
    color: #e74c3c;
    border-left: 4px solid #e74c3c;
}

.admin-message.info {
    background: #d6eaf8;
    color: #3498db;
    border-left: 4px solid #3498db;
}

/* Responsive Design for Admin */
@media (max-width: 1200px) {
    .col-25 {
        width: calc(50% - 8px) !important;
    }
}

@media (max-width: 768px) {
    .re-booking-form-admin {
        padding: 16px !important;
    }
    
    .relayout-booking-suite-admin .row {
        flex-direction: column !important;
        gap: 0 !important;
    }
    
    .col-25, .col-50 {
        width: 100% !important;
        min-width: auto !important;
    }
    
    .add-room, .add-experience, .add-event,
    .remove-room, .remove-experience, .remove-event {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* Dark Mode Support (if WordPress admin uses dark mode) */
@media (prefers-color-scheme: dark) {
    .re-booking-form-admin {
        background: #1e1e1e;
        border-color: #333;
        color: #fff;
    }
    
    .re-booking-ainput label {
        color: #e0e0e0;
    }
    
    .re-booking-ainput input,
    .re-booking-ainput textarea,
    .re-booking-ainput select {
        background: #2a2a2a !important;
        border-color: #444 !important;
        color: #fff !important;
    }
}

/* Animation for adding/removing items */
.relayout_booking_suite_room,
.relayout_booking_suite_experience,
.relayout_booking_suite_event {
    animation: slideInUp 0.3s ease-out;
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
table.fixed {
    table-layout: auto !important;
}

/* Improved Typography */
.re-booking-form-admin * {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Focus Indicators for Accessibility */
.add-room:focus, .add-experience:focus, .add-event:focus,
.remove-room:focus, .remove-experience:focus, .remove-event:focus,
.relayout_booking_suite_upload_image_button:focus {
    outline: 3px solid rgba(52, 152, 219, 0.5) !important;
    outline-offset: 2px !important;
}

/* Relayout Booking Suite Meta Box Integration - SPECIFIC TO OUR PLUGIN ONLY */
#relayout_booking_suite_hotel_rooms_meta_box .inside,
#relayout_booking_suite_experience_meta_box .inside,
#relayout_booking_suite_event_meta_box .inside {
    margin: 0 !important;
    padding: 12px !important;
}

/* Meta Box Headers - ONLY FOR OUR PLUGIN META BOXES */
#relayout_booking_suite_rooms_meta_box h2.hndle,
#relayout_booking_suite_experience_meta_box h2.hndle,
#relayout_booking_suite_event_meta_box h2.hndle {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #ffffff !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    border-radius: 8px 8px 0 0 !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border: none !important;
}

#relayout_booking_suite_rooms_meta_box h2.hndle:before,
#relayout_booking_suite_experience_meta_box h2.hndle:before,
#relayout_booking_suite_event_meta_box h2.hndle:before {
    content: "⚙️";
    margin-right: 8px;
    font-size: 16px;
}

/* Container for all booking suite elements */
#relayout_booking_suite_rooms_container,
#relayout_booking_suite_experiences_container,
#relayout_booking_suite_events_container {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 16px;
    margin: 16px 0;
}

/* Empty state styling */
.booking-suite-empty-state {
    text-align: center;
    padding: 40px 20px;
    color: #6c757d;
    font-style: italic;
}

.booking-suite-empty-state:before {
    content: "📝";
    display: block;
    font-size: 48px;
    margin-bottom: 16px;
}

/* Improved table-like layout for better organization */
.re-booking-form-admin .form-section {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 20px;
    margin: 16px 0;
}

.re-booking-form-admin .form-section h5 {
    color: #495057;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 16px 0;
    padding: 0 0 8px 0;
    border-bottom: 1px solid #e9ecef;
}

/* Tooltip styling for help text */
.field-tooltip {
    position: relative;
    display: inline-block;
    margin-left: 8px;
    cursor: help;
}

.field-tooltip:before {
    content: "ℹ️";
    font-size: 14px;
}

.field-tooltip:hover:after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 125%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: #fff;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
}

/* Progress indicator for multi-step forms */
.form-progress {
    display: flex;
    justify-content: space-between;
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

.form-progress li {
    flex: 1;
    text-align: center;
    position: relative;
    color: #6c757d;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.form-progress li.active {
    color: #3498db;
}

.form-progress li.completed {
    color: #27ae60;
}

/* Improved spacing and typography */
.re-booking-form-admin .field-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin: 20px 0;
}

/* Enhanced visual hierarchy */
.re-booking-form-admin .primary-fields {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-left: 4px solid #3498db;
    padding: 20px;
    border-radius: 0 8px 8px 0;
    margin: 16px 0;
}

.re-booking-form-admin .secondary-fields {
    background: #ffffff;
    border: 1px dashed #dee2e6;
    padding: 20px;
    border-radius: 8px;
    margin: 16px 0;
}

/* WordPress Admin Compatibility Fixes */
.wp-admin #relayout_booking_suite_hotel_rooms_meta_box .inside,
.wp-admin #relayout_booking_suite_experience_meta_box .inside,
.wp-admin #relayout_booking_suite_event_meta_box .inside {
    margin: 0;
    padding: 0;
}

/* Fix WordPress admin button conflicts */
/* .wp-admin .relayout-booking-suite-admin input[type="button"],
.wp-admin .relayout-booking-suite-admin button {
    font-size: 13px;
    line-height: 26px;
    height: auto;
    margin: 0;
    padding: 6px 14px;
    cursor: pointer;
    border-width: 1px;
    border-style: solid;
    border-radius: 3px;
    white-space: nowrap;
    text-decoration: none;
    box-sizing: border-box;
} */

/* Ensure our add buttons override WordPress admin styles */
.wp-admin .add-room,
.wp-admin .add-experience,
.wp-admin .add-event {
    background: #0073aa !important;
    border-color: #006799 !important;
    color: #fff !important;
    text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799 !important;
    box-shadow: 0 1px 0 #006799 !important;
    vertical-align: top !important;
    display: inline-block !important;
    text-decoration: none !important;
}

.wp-admin .add-room:hover,
.wp-admin .add-experience:hover,
.wp-admin .add-event:hover {
    background: #005a87 !important;
    border-color: #004b72 !important;
    color: #fff !important;
}

/* Responsive fixes for WordPress admin */
@media screen and (max-width: 782px) {
    .wp-admin .add-room,
    .wp-admin .add-experience,
    .wp-admin .add-event,
    .wp-admin .remove-room,
    .wp-admin .remove-experience,
    .wp-admin .remove-event {
        padding: 6px 14px !important;
        line-height: 20px !important;
        font-size: 14px !important;
        vertical-align: middle !important;
        height: auto !important;
        margin-bottom: 4px !important;
    }
}

/* Fix for overlapping or missing containers */
#relayout_booking_suite_rooms_container:empty::before {
    content: "No rooms added yet. Click 'Add Room' to get started.";
    color: #666;
    font-style: italic;
    padding: 20px;
    display: block;
    text-align: center;
    background: #f9f9f9;
    border-radius: 4px;
    border: 1px dashed #ccc;
}

#relayout_booking_suite_experiences_container:empty::before {
    content: "No experiences added yet. Click 'Add Experience' to get started.";
    color: #666;
    font-style: italic;
    padding: 20px;
    display: block;
    text-align: center;
    background: #f9f9f9;
    border-radius: 4px;
    border: 1px dashed #ccc;
}

#relayout_booking_suite_events_container:empty::before {
    content: "No events added yet. Click 'Add Event' to get started.";
    color: #666;
    font-style: italic;
    padding: 20px;
    display: block;
    text-align: center;
    background: #f9f9f9;
    border-radius: 4px;
    border: 1px dashed #ccc;
}

/* Ensure meta boxes have proper structure */
.postbox .inside {
    margin: 11px 0;
    padding: 0 12px;
}

/* Clear any floats that might break layout */
#relayout_booking_suite_rooms_container::after,
#relayout_booking_suite_experiences_container::after,
#relayout_booking_suite_events_container::after {
    content: "";
    display: table;
    clear: both;
}

/* Plugin-specific clearfix */
.relayout-booking-suite-clearfix::after {
    content: "";
    display: table;
    clear: both;
}

/* Card-style layout for better organization */
.booking-card {
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 24px;
    margin: 16px 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.booking-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.booking-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e9ecef;
}

.booking-card-title {
    font-size: 18px;
    font-weight: 600;
    color: #2c3e50;
    margin: 0;
}

.booking-card-badge {
    background: #e3f2fd;
    color: #1976d2;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

/* Improved button grouping */
.button-group {
    display: flex;
    gap: 12px;
    margin: 20px 0;
    flex-wrap: wrap;
}

.button-group .button {
    flex: 1;
    min-width: 120px;
}

/* Status badges for different states */
.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.status-badge.enabled {
    background: #d4edda;
    color: #155724;
}

.status-badge.enabled:before {
    content: "✅";
}

.status-badge.disabled {
    background: #f8d7da;
    color: #721c24;
}

.status-badge.disabled:before {
    content: "❌";
}

/* Improved mobile responsiveness */
@media (max-width: 480px) {
    .re-booking-form-admin {
        padding: 12px !important;
        margin: 8px 0 !important;
    }
    
    .re-booking-ainput {
        margin-bottom: 16px !important;
    }
    
    .button-group {
        flex-direction: column;
    }
    
    .button-group .button {
        width: 100% !important;
        margin: 4px 0 !important;
    }
}

/* ========================================
   PLUGIN-SPECIFIC COMPONENT STYLING ONLY
   ======================================== */

/* WordPress Media Uploader Support */
.wp-core-ui .button-primary {
    background: #0073aa !important;
    border-color: #006799 !important;
}

/* Ensure our plugin admin buttons are properly styled and functional */
.relayout-booking-suite-admin .add-room,
.relayout-booking-suite-admin .add-experience, 
.relayout-booking-suite-admin .add-event,
#relayout_booking_suite_hotel_rooms_meta_box .add-room,
#relayout_booking_suite_experience_meta_box .add-experience,
#relayout_booking_suite_event_meta_box .add-event {
    background: linear-gradient(135deg, #2ecc71, #27ae60) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 14px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 20px 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    height: auto !important;
    min-height: 48px !important;
}

.relayout-booking-suite-admin .add-room:hover,
.relayout-booking-suite-admin .add-experience:hover, 
.relayout-booking-suite-admin .add-event:hover,
#relayout_booking_suite_hotel_rooms_meta_box .add-room:hover,
#relayout_booking_suite_experience_meta_box .add-experience:hover,
#relayout_booking_suite_event_meta_box .add-event:hover {
    background: linear-gradient(135deg, #27ae60, #229954) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(46, 204, 113, 0.4) !important;
    color: #ffffff !important;
}

/* Ensure containers exist and are visible */
#relayout_booking_suite_rooms_container,
#relayout_booking_suite_experiences_container,
#relayout_booking_suite_events_container {
    min-height: 50px;
    background: #f8f9fa;
    border-radius: 8px;
    padding: 16px;
    margin: 16px 0;
    border: 1px dashed #dee2e6;
}

/* ONLY target our specific plugin containers and elements */
#relayout_booking_suite_rooms_container .re-booking-form-admin,
#relayout_booking_suite_experiences_container .re-booking-form-admin,
#relayout_booking_suite_events_container .re-booking-form-admin {
    background: #ffffff !important;
    border: 1px solid #e1e5e9 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

#relayout_booking_suite_rooms_container .re-booking-form-admin:hover,
#relayout_booking_suite_experiences_container .re-booking-form-admin:hover,
#relayout_booking_suite_events_container .re-booking-form-admin:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12) !important;
    transform: translateY(-2px) !important;
}

#relayout_booking_suite_rooms_container .re-booking-form-admin h4,
#relayout_booking_suite_experiences_container .re-booking-form-admin h4,
#relayout_booking_suite_events_container .re-booking-form-admin h4 {
    color: #2c3e50 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    margin: 0 0 20px 0 !important;
    padding: 0 0 12px 0 !important;
    border-bottom: 2px solid #3498db !important;
    display: flex !important;
    align-items: center !important;
}

/* Plugin-specific input field styling */
#relayout_booking_suite_rooms_container .re-booking-ainput input,
#relayout_booking_suite_rooms_container .re-booking-ainput select,
#relayout_booking_suite_rooms_container .re-booking-ainput textarea,
#relayout_booking_suite_experiences_container .re-booking-ainput input,
#relayout_booking_suite_experiences_container .re-booking-ainput select,
#relayout_booking_suite_experiences_container .re-booking-ainput textarea,
#relayout_booking_suite_events_container .re-booking-ainput input,
#relayout_booking_suite_events_container .re-booking-ainput select,
#relayout_booking_suite_events_container .re-booking-ainput textarea {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 2px solid #e8ecef !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #2c3e50 !important;
    background: #ffffff !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04) !important;
    outline: none !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    line-height: 1.4 !important;
    height: auto !important;
    min-height: 46px !important;
}

#relayout_booking_suite_rooms_container .re-booking-ainput input:focus,
#relayout_booking_suite_rooms_container .re-booking-ainput select:focus,
#relayout_booking_suite_rooms_container .re-booking-ainput textarea:focus,
#relayout_booking_suite_experiences_container .re-booking-ainput input:focus,
#relayout_booking_suite_experiences_container .re-booking-ainput select:focus,
#relayout_booking_suite_experiences_container .re-booking-ainput textarea:focus,
#relayout_booking_suite_events_container .re-booking-ainput input:focus,
#relayout_booking_suite_events_container .re-booking-ainput select:focus,
#relayout_booking_suite_events_container .re-booking-ainput textarea:focus {
    border-color: #3498db !important;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1) !important;
    background: #fafbfc !important;
}

/* Plugin-specific button styling */
#relayout_booking_suite_hotel_rooms_meta_box .add-room,
#relayout_booking_suite_experience_meta_box .add-experience,
#relayout_booking_suite_event_meta_box .add-event {
    background: linear-gradient(135deg, #2ecc71, #27ae60) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 14px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(46, 204, 113, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 20px 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    height: auto !important;
}

#relayout_booking_suite_hotel_rooms_meta_box .add-room:hover,
#relayout_booking_suite_experience_meta_box .add-experience:hover,
#relayout_booking_suite_event_meta_box .add-event:hover {
    background: linear-gradient(135deg, #27ae60, #229954) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(46, 204, 113, 0.4) !important;
    color: #ffffff !important;
}

#relayout_booking_suite_rooms_container .remove-room,
#relayout_booking_suite_experiences_container .remove-experience,
#relayout_booking_suite_events_container .remove-event {
    background: linear-gradient(135deg, #e74c3c, #c0392b) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 16px 0 0 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    height: auto !important;
}

#relayout_booking_suite_rooms_container .remove-room:hover,
#relayout_booking_suite_experiences_container .remove-experience:hover,
#relayout_booking_suite_events_container .remove-event:hover {
    background: linear-gradient(135deg, #c0392b, #a93226) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(231, 76, 60, 0.4) !important;
    color: #ffffff !important;
}

/* Plugin-specific label styling */
#relayout_booking_suite_rooms_container .re-booking-ainput label,
#relayout_booking_suite_experiences_container .re-booking-ainput label,
#relayout_booking_suite_events_container .re-booking-ainput label {
    display: block !important;
    color: #34495e !important;
    margin: 0 0 8px 0 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    position: relative !important;
    line-height: 1.4 !important;
}

/* Plugin-specific upload button styling */
#relayout_booking_suite_rooms_container .relayout_booking_suite_upload_image_button {
    background: linear-gradient(135deg, #3498db, #2980b9) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 12px 20px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(52, 152, 219, 0.3) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 8px 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    text-decoration: none !important;
    line-height: 1 !important;
    height: auto !important;
}

#relayout_booking_suite_rooms_container .relayout_booking_suite_upload_image_button:hover {
    background: linear-gradient(135deg, #2980b9, #1f618d) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4) !important;
    color: #ffffff !important;
}