@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

/* reset css  */

/* global colors */

/* Global color variables */

:root {
  --primary-color: #231F1F;
  --secondary-color: #006571; 
  --background-color: #11213B; 
  --text-color: #231F1F; 
  --white-text:#fff;
  --link-color: #78A9F6;
  --grey-color: #727272;
  --border-color: #e0e0e0; 
  --black-color:#11213B;
  --light-black-grey-color:#1C2D4C;
  --dm-sans: "DM Sans", sans-serif;
}
body {background-color: var(--white-text);color: var( --grey-color);}
a {color: var(--grey-color);text-decoration: none;}
a:hover {color: var( --secondary-color);}
button { background-color: var(--primary-color); color: white; border: 2px solid var(--primary-color); }
/* button:hover { background-color: transparent; } */
/* button.white { background-color: var(--text-color); color: var(--black-color); border: 2px solid transparent; } */
/* .outline-btn a { background-color: transparent !important; padding: 15px 35px; transition: all .5s ease; min-width: 206px; } */
/* .outline-btn a:hover{ background-color: var(--secondary-color) !important; border: 2px solid var(--secondary-color) !important; } */
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button),
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) img{outline: none;}
.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { background: transparent; outline: none; text-decoration: underline; }
input[type="text"]:focus {outline: none;}
/* body .outline-btn-wrap:hover{ background-color: var(--secondary-color) !important; border: 2px solid var(--secondary-color) !important; } */
/* :is(.elementor-section-wrap,[data-elementor-id])>.e-con{ padding-left: 0; padding-right: 0; } */
body .e-con>.e-con-inner{ padding-inline-end: 20px; padding-inline-start: 20px; }
.text-content .elementor-widget-container, .text-content p { font-size: 16px; color: var(--text-color); }
.text-content a{color:#78A9F6;font-size: 16px !important;text-decoration: underline !important;}
.content-normal-size p,.content-normal-size .elementor-widget-container{ font-size: 16px !important; line-height: 1.6; }
.scam-badge {
    background-color: #F5BB01;
    padding: 4px 12px;
    border-radius: 30px;
    color: var(--white-text);
    display: inline;
    font-size: 16px;
}
.custom-simple-text p, .custom-simple-text .elementor-widget-container {
    font-size: 16px;
    line-height: 24px;
}
/* closed  */

/* Resetting margins, paddings, and box-sizing */

*,

*::before,

*::after {margin: 0;padding: 0;box-sizing: border-box;}
.mr-10{margin-right: 10px;}
.site .button:focus, button:focus, 
input[type=submit]:focus, 
input[type=reset]:focus, 
.wp-block-search .wp-block-search__button:focus, 
.wp-block-button .wp-block-button__link:focus, 
.wp-block-file a.wp-block-file__button:focus{
  outline: none;
}
/* Remove default font settings */

body { font-family: var( --dm-sans) !important; line-height: 1.5; overflow-x: hidden; }
div{ font-family: var( --dm-sans) !important; }


/* Reset heading and paragraph spacing */
.mx-800 {
    max-width: 800px !important;
    margin: 0 auto;
}
h1.fz-32 {font-size: 32px;}
h1, h2, h3, h4, h5, h6, p { margin: 0; padding: 0; line-height: normal; }
h1, h2, h3, h4, h5, h6{ font-family: var( --dm-sans) !important; font-weight: 600 !important; color:var(--text-color); line-height: normal !important; }
h1{font-size: 48px;}
h2{font-size: 2.25rem;}
body p,body .elementor-widget-container{ font-family: var( --dm-sans) !important; line-height:20px; font-size: 16px; color: var(--grey-color); }

/* Remove default list styling */

ul, ol { list-style: none; padding: 0; margin: 0; }

/* Set images and videos to block display to remove inline gaps */
img, video { display: block; max-width: 100%; height: auto; }
/* Remove underline from links */
a {text-decoration: none;color: #006571;}
body select:focus {outline: none;}
/* closed  */
/* loginForms */
.login-content-text { margin-bottom: 34px; margin-top: 34px; }
.login-content-text h2{ margin-bottom: 16px; font-size: 32px;}
.auth-container input:focus,
.loginModal .inputField input:focus { outline: none; }
form#loginForm button,
form#signupForm button,
.loginModal .inputField button { margin-top: 24px; width: 100%; border-radius: 8px; background-color: var(--primary-color) !important; border: none; color: var(--white-text) !important; transition: all .3s ease; border: 1px solid #231f1f; }
form#loginForm button:hover,
form#signupForm button:hover {background-color: var(--white-text) !important;color: var(--primary-color) !important;border: 1px solid #231f1f;}
.auth-container .social-btn p { color: var(--primary-color); font-size: 18px; font-weight: 700; }
.social-login .flexContent{ display: flex; align-items: center; justify-content: center; gap: 12px; }
.password-input-field {position: relative;}
.password-input-field img {position: absolute;top: 60px;right: 14px;cursor: pointer;}
/* closed  */

.flexContent{
  display: flex;
  align-items: center;
  gap: 10px;
}
.mt-3 {margin-top: 10px;}
main#main {
    padding-top: 0;
}

.elementor-widget-image img {
    height: auto !important;
}
/* home css  */
.elementor-widget-n-carousel .swiper-wrapper {
  height: auto !important;
  display: flex !important;
  align-items: center;
}
.elementor-widget-n-carousel .swiper-slide {
  min-height: 300px; 
  display: flex;
  justify-content: center;
  align-items: center;
}
.hero-section .slider-wrapper .slide img{
  height: 500px;
  width: 100%;
  object-fit: cover;
}
.hero-section button{
  cursor: pointer;
}
/* slick slider css  */

body .slick-next {
    right: 30px;
}
body .slick-prev {
    left: 30px;
}

 /* .slick-arrow,
.slick-arrow { z-index: 1; width: 14px; height: 20px; border-radius: 0; border: none !important; font-size: 0; background-color: transparent !important; background-position: center; background-size: contain; background-repeat: no-repeat;}
.slick-prev{margin-top: -40px;}
.slick-next{margin-top: -40px;} */
.slick-prev,.slick-prev,
.slick-prev:hover,.slick-prev:hover {z-index: 1; background: url("data:image/svg+xml,%3Csvg stroke='%23c9c9c9' fill='%23c9c9c9' stroke-width='0' viewBox='0 0 320 512' height='100px' width='70px' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'%3E%3C/path%3E%3C/svg%3E") center / contain no-repeat !important;}
.slick-next,
.slick-next,
 .slick-next:hover,
 .slick-next:hover {background: url("data:image/svg+xml,%3Csvg stroke='%23c9c9c9' fill='%23c9c9c9' stroke-width='0' viewBox='0 0 320 512' height='100px' width='70px' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'%3E%3C/path%3E%3C/svg%3E")  center / contain no-repeat !important;}
.slick-arrow::before,
 .slick-arrow::before {display: none !important;}


/* social image slider */
.social-image-slider .swiper .swiper-image-stretch .swiper-slide .swiper-slide-image{
  height: 16rem !important;
  object-fit: cover;
  border-radius: 10px !important;
}
.about-image-wrap img {
    border-radius: 10px !important;
}
/* closed */


/* faq  */
/* faq page  */

body .accordion-wrapper .e-n-accordion-item {border: 1px solid #E5E5E5;border-radius: 20px;}
body .accordion-wrapper .e-n-accordion-item-title-text {font-size: 20px !important;color: #231F1F;}
body .accordion-wrapper .e-n-accordion-item-title {justify-content: space-between;}
body .accordion-wrapper .e-n-accordion-item-title-text {font-weight: 500;}

/* closed */

/* contact us page */


/* contact us page  */
.contactFormWrap .formRightContent {border: 1px solid #E5E5E5;border-radius: 0px 30px 30px 0px;}
.contactFormWrap .formLeftContent .elementor-widget-text-editor p {font-size: 18px;line-height: 22px;color: #fff;}
.contactFormWrap .formLeftContent h6.elementor-icon-box-title {color: #fff !important;}
.contactFormWrap .formLeftContent h3.elementor-heading-title.elementor-size-default {color: #fff !important;}
.contactFormWrap .formwrap .fullWrap label,.contactFormWrap .formwrap  .fullwidthdata  label {display: block;margin-bottom: 5px;color: #231F1F;font-size: 16px;}
.contactFormWrap .fullWrap input {border: 1px solid #E5E5E5;border-radius: 8px;margin-bottom: 12px;width: 100%;}
.contactFormWrap .e-con-inner{ flex-direction: row !important;align-items: stretch !important;display: flex;}
.contactFormWrap .formLeftContent {  flex: 1 1 50% !important;min-height: auto !important;  padding: 40px;}
.contactFormWrap .formRightContent{  flex: 1 1 50% !important;min-height: auto !important; padding: 30px 30px 10px 30px;}

.contactFormWrap .formRightContent textarea {width: 100%;border: 1px solid #E5E5E5 !important;resize: none;border-radius: 10px !important;margin-top: 10px !important;height: 150px;margin-bottom: 10px !important;}
.formRightContent input.wpcf7-form-control.wpcf7-submit.has-spinner {background: #231F1F !important;transition: all .3s ease;padding: 10px;color: #fff !important;width: 100% !important;border-radius: 8px;border: 1px solid transparent;}
.formRightContent input.wpcf7-form-control.wpcf7-submit.has-spinner:hover {background: #fff !important;color: #231F1F !important;border: 1px solid #231F1F;}
.formRightContent  .formwrap .fullWrap {margin-bottom: 0px;}
.formRightContent .buttonwrap {position: relative;margin-top: 10px;}
.formRightContent  .wpcf7-spinner{position: absolute;right: 10px;top: 12px;}
.formRightContent .formwrap .fullWrap .iti--allow-dropdown{width: 100%;}
.contactFormWrap .formwrap .fullwidthdata label{margin-top: 10px;}
.contactFormWrap .formRightContent textarea{margin-top: 0 !important;}
.formLeftContent a {color: #fff;}
.formLeftContent a:hover {color: #f5bb01;}
@media (max-width: 767px) {
    body .contactFormWrap .e-con-inner {display: block !important;}
    body .contactFormWrap .formLeftContent, body .contactFormWrap .formRightContent {border-radius: 0;}
    body .contactFormWrap .formLeftContent, body .contactFormWrap .formRightContent {width: 100%;flex: 1 1 auto;}
}
/* closed */

/* closed */





 /* event home page  */

@media (min-width: 768px) {}

.upcoming-events-section {padding-top: 4rem;padding-bottom: 4rem;background-color: #ffffff;}
@media (min-width: 768px) {
    .upcoming-events-section {padding-top: 3rem;padding-bottom: 3rem;}
}
.section-title {font-size: 2.25rem;font-weight: 700;text-align: center;color: #1e293b;margin-bottom: 1.5rem;}
.section-subtitle {text-align: center;color: #475569;max-width: 48rem;margin-left: auto;margin-right: auto;margin-bottom: 3rem;}
.event-list-container {display: flex;flex-direction: column;gap: 1rem;max-width: 48rem;margin-left: auto;margin-right: auto;}
.event-item {
    background-color: #f1f5f9;padding: 1.5rem;border-radius: 0.5rem;box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;transition-property: box-shadow;transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}
.event-item:hover {box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);}
.event-date {font-size: 1.125rem;font-weight: 600;color: #334155;margin-bottom: 0.5rem;}
.event-name {color: #006571;font-weight: 500;margin-bottom: 0.5rem;}
@media (min-width: 640px) {
    .event-item {flex-wrap: nowrap;}.event-date,.event-name {margin-bottom: 0;}
}
.event-item-highlight {background-color: #006571;color: #ffffff;transition-property: background-color;}
.event-item-highlight:hover {background-color: #006571;}
.event-item-highlight .event-date {color: #ffffff;}
.event-item-highlight .event-name {color: #ffffff;font-weight: 500;}



/* gallery images  */
.codeminator-gallery-wrapper {
    column-count: 4;
    column-gap: 1rem;
}

.codeminator-gallery-item {
    break-inside: avoid;
    margin-bottom: 1rem;
}

.codeminator-gallery-item img {
    width: 100%;
    display: block;
    border-radius: 8px;
}

.read-more-gallery {
    margin-top: 1rem;
    text-align: center;
}
.read-more-gallery a {
    background: #000;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 4px;
}

/* closed */

/* listing content  */
.listing-content-text.elementor-widget-icon-list .elementor-icon-list-icon svg{fill: #11213B;width: 6px;}
.listing-content-text  ul.elementor-icon-list-items li {margin-bottom: 5px !important;}
/* closed  */


/* dashboard css  */
.student-wrap{
  padding: 0px 20px;
}
.student-dashboard {
  max-width: 1000px;
  margin: 40px auto;
  padding: 20px;
  background: #fff;
  border-radius: 12px;
 
}
.student-dashboard h2{
 color: var(--secondary-color);
}

.dashboard-heading {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #222;
  border-bottom: 2px solid #eee;
  padding-bottom: 10px;
}

.dashboard-table-wrapper {
  overflow-x: auto;
  padding: 0px 20px;
}

.dashboard-table {
    width: 100%;
    border-collapse: collapse;
    font-family: inherit;
    border: 1px solid #eaeaea;
}

.dashboard-table th,
.dashboard-table td {
  padding: 14px 16px;
  text-align: left;
  font-size: 16px;
  border: none;
border-bottom: 1px solid #eaeaea;
  /* border-bottom: 1px solid #eaeaea; */
}

.dashboard-table th {
    background-color: #006571;
    font-weight: 600;
    color: #fff;
}

.dashboard-table tr:hover {
  background-color: #ededed;
  transition: 0.3s ease;
}


/* closed  */

/* auth-container  */
.auth-container .small-text {font-size: 20px;text-align: center;margin-top: 22px;margin-bottom: 22px;color: #231F1F;text-decoration: none !important;font-weight: 500;}
body .auth-container .auth-form{padding-bottom: 0;padding-left: 100px;}
body .auth-container {margin: 80px auto !important;}
body #forgotPasswordBtn:hover{color:#F5BB01;}


/* galery */

.elementor-image-gallery .gallery-item img {margin-bottom: 10px !important;height: 200px !important;width: 100% !important}

/* closed  */


/* student-dashboard-banner-wrap */
.student-dashboard-banner-wrap,
.enrollment-details-banner-wrap{
  background-image: url('/wp-content/themes/twentytwentyone-child/assets/images/student-banner-image.webp');
  padding: 200px 0px;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  margin-top: 0;
  z-index: 1;
}

.student-dashboard-banner-wrap h2,
.enrollment-details-banner-wrap h2{
    color: #fff;
    text-align: center;
}
.student-dashboard-banner-wrap:after,
.enrollment-details-banner-wrap:after{
  position: absolute;
  left: 0;
  right: 0;
  content: '';
  bottom: 0;
  top: 0;
  background-color: rgba(0, 0, 0, .6);
  z-index: -1;
}
/* closed  */

/* enrollment card design  */

.student-dashboard {
  max-width: 100%;
  padding: 30px;
  background: #f7f7f7;
  border-radius: 16px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  margin: 20px auto;
  font-family: 'Inter', sans-serif;
}

.student-dashboard h2 {
  font-size: 32px;
  /* color: #333; */
  margin-bottom: 10px;
}

.student-dashboard p {
  margin: 0 0 8px;
  color: #555;
  font-size: 16px;
}

.student-dashboard h3 {
  font-size: 24px;
  margin-top: 30px;
  color: #222;
  border-bottom: 2px solid #ddd;
  padding-bottom: 10px;
}
.enrollment-card .sub-heading-title {
    color: #11213B;
}
.enrollment-card {
  background: #fff;
  padding: 20px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  margin-top: 20px;
  font-size: 18px;
  transition: transform 0.2s ease;
}

.enrollment-card:hover {
  transform: translateY(-3px);
}

.enrollment-card h4 {
  font-size: 20px;
  margin-bottom: 5px;
}

.enrollment-card p {
  font-size: 14px;
  color: #666;
  margin-bottom: 8px;
}

.enroll-button {
  background: #007bff;
  color: #fff;
  padding: 8px 16px;
  border-radius: 6px;
  text-decoration: none;
  display: inline-block;
  font-weight: 500;
  margin-top: 10px;
}
.enroll-button:hover {
  background: #0056d2;
}


.enrollment-details {
  max-width: 720px;
  margin: 40px auto;
  padding: 30px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  font-family: 'Inter', sans-serif;
  text-align: center;
  border: none;
}

.enrollment-details h2 {
  font-size: 28px;
  color: #222;
  margin-bottom: 10px;
}

.enrollment-details p {
  font-size: 16px;
  color: #555;
  margin: 5px 0;
}

.enrollment-details form {
  margin-top: 20px;
}

.enrollment-details form input[type="submit"],
.enrollment-details .paypal-button {
  background-color: #006571;
  color: white;
  padding: 12px 30px;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s ease;
}
.youtube-img:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    background: rgb(0, 0, 0);
    opacity: 0.4;
    border-radius: 20px;
    z-index: 0;
    pointer-events: none;
    right: 0;
    bottom: 0;
}
.enrollment-details form input[type="submit"]:hover,
.enrollment-details .paypal-button:hover {
  background-color: #F5BB01;
}

@media (max-width:767px){
  .student-dashboard h2{
    font-size: 20px;
    word-wrap: break-word;
  }
  .student-wrap {
    margin-bottom: 50px;
  }
  .student-dashboard-banner-wrap, .enrollment-details-banner-wrap{
    padding: 120px 0px;
    word-wrap: break-word;
    margin-bottom: 60px;
    margin-top: 0;
  }
  .dashboard-table th, .dashboard-table td{
    font-size: 16px;
  }
  .enrollment-details{
    margin: 0px 20px !important;
  }
}

.potentialFormWrapper .formWrapper{
  margin-top: 30px;
}
.potentialFormWrapper .formWrapper .formBox {display: flex;gap: 10px;margin-bottom: 20px;flex-wrap: wrap;}
.potentialFormWrapper  input,.potentialFormWrapper textarea{
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    margin-bottom: 12px;
    width: 100%;
}
.potentialFormWrapper textarea{
  height: 200px;
  resize: none;
}
.site textarea:focus,
.site input:focus{
    outline: none !important;
}

.potentialFormWrapper .formWrapper .formBox  label,
.potentialFormWrapper .formFullwrapper label {
    margin-bottom: 10px;
    display: inline-block;
}
.potentialFormWrapper  .fullButtonInput {
  position: relative;
}
.potentialFormWrapper  .fullButtonInput .wpcf7-submit{
    background: #231F1F !important;
    transition: all .3s ease;
    padding: 10px;
    color: #fff !important;
    width: 100% !important;
    border-radius: 8px;
    border: 1px solid transparent;
}

.potentialFormWrapper  .fullButtonInput .wpcf7-spinner {
      position: absolute;
      right: 10px;
      top: 12px;
  }


  /* youtube icon  */

body  .youtube-img img {
  height: 310px;
  object-fit: cover;
  border-radius: 10px;
}
.youtube-img .popup-video{
  position: relative;
}
.youtube-img .popup-video::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  background-color: rgba(255, 0, 0, 0.9);
  border-radius: 50%;
  z-index: 0;
  animation: rippleEffect 2s infinite ease-out;
}
.youtube-img  .popup-video:after {
  position: absolute;
  content: '';
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  background-image: url(/wp-content/themes/twentytwentyone-child/assets/images/video_youtube_icon.svg);
  background-size: cover;
  background-repeat: no-repeat;
  width: 50px;
  height: 50px;
  z-index: 1;
}
/* Ripple Effect Animation */
@keyframes rippleEffect {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.6;
    }

    100% {
        transform: translate(-50%, -50%) scale(2.5);
        opacity: 0;
    }
}
.youtube-img .popup-video:after {
    position: absolute;
    content: '';
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    background-image: url(/wp-content/themes/twentytwentyone-child/assets/images/video_youtube_icon.svg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 50px;
    height: 50px;
    z-index: 1;
}
@media (max-width: 767px) {
    body .auth-container {
        display: block;
        margin-bottom: 0 !important;
        margin-top: 40px !important;
    }
    body .auth-container .auth-form {
        padding-left: 0;
    }
    body .login-content-text h2{font-size: 26px;}
    body .socialContentWrap{justify-content: center;}
}