@charset "UTF-8";
/*
Theme Name: SP Fort Hospital
Author: Onetikk
Author URI: https://onetikk.org/
Version: 1.3
*/

/*----------------------
Contact form 7 Start
----------------------*/

form.wpcf7-form p{ margin: 0px !important; }
span.ajax-loader{ display: none !important; }
div.wpcf7-response-output, div.wpcf7-validation-errors { display: none !important; }
span.wpcf7-not-valid-tip { display: none; }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: red !important; background-color: rgba(153, 0, 0, 0.3) !important; outline: 1px solid red; }
span.wpcf7-form-control-wrap {display:block !important;}/*keeps forms from jumping on render*/
.wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label{ font-size: 0.9em; font-weight: 300; color: var(--secondary-font-color); font-family: "Outfit", sans-serif; }
.wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a{ color: var(--primary-color); }
.wpcf7-not-valid .wpcf7-list-item-label{ color: red !important; }
.contact_details_form input[type="checkbox"] { width: 15px; height: 15px; position: relative; top: 2px; margin-right: 10px; border: 1px solid #ededed; color: #232323; padding: 0 20px; background: none; }

/*----------------------
Contact form 7 End
----------------------*/

/*----------------
404 Page Start
------------------*/

.error-box{ text-align:center; position:relative; width:100%; height:100%; margin:100px auto; text-align:center; max-height: 500px; }
.error-box-text{ position:relative; top:-350px; }
.error-box-text h1{ font-size:200px; color:#d3282a; line-height:1; }
.error-box-text h3{ font-size:40px; color:#111; }
.error-box-text h4{ font-size:20px; color:#333; margin-top:20px; }
.back-box{ z-index:-999999; background:#f9f9f9; position:relative; top:150px; padding:50px; }
.error-box h2{ color:rgba(204,204,204,.2); font-size:250px; font-weight:600; letter-spacing:10px; text-transform:uppercase; }
.error-box-text .dark-button { background: #111; color: #fff; font-size: 11px; font-weight: 500; border-radius: 50px; padding: 10px 15px 10px 15px; -webkit-transition-duration: .3s; transition-duration: .3s; text-decoration: none; margin-top: 30px; }
.error-box-text .dark-button:hover { color: #fff; background: #d3282a; }
.error-box-text .button-md { display: inline-block; font-size: 14px; font-weight: 500; padding: 13px 25px 13px 25px; }

/*----------------
404 Page End
------------------*/

/*----------------
Thank you Page Start
------------------*/

.count-back-box { width: 100%; height: 100%; min-height: 80vh; padding: 100px 0px; text-align: center; position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; }
.count-back-box:before{ position: absolute; content: ""; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); top: 0; left: 0;}
.thankyou-box { margin: auto; }
.thankyou-icons { position: relative; text-align: center; }
.count-back-box-text { text-align: center; margin: 30px auto 0 auto; }
.count-back-box-text h3 { color: #111; font-size: 1.5rem; font-weight: 400; line-height: 6;}
.count-back-box-text h6 { color: #777; font-size: 18px; font-weight: 400; margin-top: 10px; }
.thankyou-page{ min-height: calc(100vh - 600px); }

/*----------------
Thank you Page End
------------------*/
.doctor-card { position: relative; perspective: 1000px; }
.doctor-card .doctor-img-front, .doctor-card .doctor-img-back { width: 100%; height: 100%; text-align: center; transform-style: preserve-3d; backface-visibility: hidden; perspective: inherit; border-radius: 20px; transition: transform 0.8s cubic-bezier(0.5, 1.3, 0.5, 1.3); }
.doctor-card .doctor-img-front { position: relative; z-index: 1; 
	background:linear-gradient(150deg, #ffffff 6%, #ffffff 35%, #870064 65%, #870064 60%);
	transform: rotateY(0deg); }
.doctor-card .doctor-img-front img { width: 100%; border-radius: 20px; }
.doctor-card .doctor-img-front .content-wrap { width: 100%; transform: translate3d(0, 0, 50px) scale(0.9); transform-style: preserve-3d; }
.doctor-card .doctor-img-front .inner-back-side h4 { font-size: 16px; font-weight: 600; color: #870064; }
.doctor-card .doctor-img-back { position: absolute; top: 0; left: 0; background: linear-gradient( 140deg, #6a1058 0%, #a12b82 30%, #b3609c 60%, #ffffff 100% ); background-color: rgba(245, 245, 245, 0.9); transform: rotateY(-180deg); display: flex; align-items: center; }
.doctor-card .doctor-img-back img { position: absolute; inset: 30px; width: calc(100% - 60px); height: calc(100% - 60px); border-radius: 20px; z-index: 0; }
.doctor-card .doctor-img-back .content-wrap { position: relative; width: 100%; height: 100%; padding: 30px; transform: translate3d(0, 0, 50px) scale(0.9); transform-style: preserve-3d; }
.doctor-card .doctor-img-back .box-overlay { position: absolute; inset: 0; background-color: rgba(245, 245, 245, 0.9); border-radius: 20px; z-index: 0; }
.doctor-card .doctor-img-back .inner-back-side { position: absolute; inset: 30px; z-index: 1; border: 1px solid #870064; border-radius: 20px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.06); overflow: hidden; }
.doctor-card:hover .doctor-img-front { transform: rotateY(180deg); }
.doctor-card:hover .doctor-img-back { transform: rotateY(0deg); }

.appointment-form label{ font-size: 0.8rem; padding: 5px 0; }


.job-form .form-group input, .job-form .form-group textarea{ padding: 13px 20px;  }
.job-form label{ font-size: 0.8rem; padding: 5px 0; }
.job-form .form-group select {
    padding: 10px 15px;
    background-image: url(assets/img/icons/down-arrow-1.svg);
    background-size: 12px;
    background-repeat: no-repeat;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-position: calc(100% - 18px) 50%;
}

.calendar-wrapper { min-height: 280px; }
.calendar-preloader { position: absolute; inset: 0; z-index: 10; background: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-content: center; flex-direction: column; font-size: 14px; color: #555; }




.floating-btns {
  position: fixed;
  left: 20px;
  bottom: 70%;
  z-index: 99999;
}

/* Button */
.floating-btns a {
  width: 56px;
  height: 56px;
/*   background: #fff; */
  color: #fff;
  font-size: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
  z-index: 2;
}

/* Ripple effect */
.ripple-focus::before,
.ripple-focus::after {
  content: "";
  position: absolute;
  left: 0%;
  top: 50%;
  width: 56px;
  height: 56px;
/*   background: #870064;  */
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: ripple 2s infinite;
  z-index: 1;
}

.ripple-focus::after {
  animation-delay: 1s;
}

/* Ripple animation */
@keyframes ripple {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.7;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}
/* Arrow pointing to button */
.focus-arrows {
  position: absolute;
  left: 0px;               /* arrow outside button */
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  border-right: 15px solid #870064; /* arrow color */
}

/* Subtle attention animation */
@keyframes nudge {
  0%, 100% { transform: translate(-5px, -50%); }
  50% { transform: translate(0, -50%); }
}

.focus-arrows {
  animation: nudge 1.2s infinite ease-in-out;
}