.error-message {
     color: red;
     font-size: 0.9em;
     display: block;
     margin-top: 5px;
 }

 /* Style for the eye icon in the password field */

 .position-relative {
     position: relative;
 }

 .modal-form.position-relative i {
     position: absolute;
     top: 56%;
     right: 25px;
     cursor: pointer;
     font-size: 20px;
     color: rgba(128, 128, 128, 0.6);
     /* Translucent grey color */
     transition: color 0.3s ease;
     /* Smooth transition for color change */
 }

 .modal-form.position-relative i:hover {
     color: rgba(128, 128, 128, 1);
     /* Full grey color on hover */
 }


 .bg-color-primary {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     background-color: #034a7a !important;
     /* fallback solid */
     color: #fff !important;
     /* makes text readable */
 }

 .btn-hover-primary {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     background-color: #034a7a !important;
     color: #fff !important;
     transition: background 0.5s ease-in-out, transform 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }

 .btn-hover-primary:hover {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
     background-color: #1c8245 !important;

         {
         % comment %
     }

     transform: translateY(-2px);

     /* slight lift */
         {
         % endcomment %
     }

     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
 }

 .btn-hover-primary:active {
     transform: translateY(0);
     /* pressed down */
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
 }

 .btn-hover-primary:focus {
     outline: none !important;
     box-shadow: 0 0 0 3px rgba(28, 130, 69, 0.4);
     /* green glow */
 }




 /* Default state */
 .header-serach__btn {

     color: #031322 !important;

 }

 .header-serach__btn:hover {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
     color: #fff !important;

     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
 }

 .header-serach__btn:focus {
     outline: none !important;
     box-shadow: 0 0 0 3px rgba(28, 130, 69, 0.4);
     /* green glow outline */
 }

 .header-serach__btn:active {
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
 }


 /* Force all icons (font icons & SVG) to use the blue gradient */
 i,
 svg {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }


 .slider-image-widget__icon {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .slider-caption__main-title mark {

     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;

 }

 .slider-caption__sub-title {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .slider-caption__main-title mark::before {

     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .call-to-action__icon {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .call-to-action__icon i,
 .call-to-action__icon svg {
     background: none !important;
     -webkit-background-clip: unset !important;
     -webkit-text-fill-color: #fff !important;
     color: #fff !important;
 }

 .call-to-action__icon svg {
     color: #fff !important;
     fill: #fff !important;
 }

 .back-to-top i,
 .back-to-top svg {
     background: none !important;
     -webkit-background-clip: unset !important;
     -webkit-text-fill-color: #fff !important;
     color: #fff !important;
 }

 .back-to-top {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     color: #fff !important;
 }



 .btn-hover-secondary {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     color: #fff !important;
     border: none;
     transition: background 0.5s ease-in-out;
 }

 .btn-hover-secondary:hover,
 .btn-hover-secondary:focus,
 .btn-hover-secondary:active {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
     color: #fff !important;
     outline: none !important;
 }

 .tooltip-inner {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
     color: #fff !important;
 }

 .tooltip.bs-tooltip-top .tooltip-arrow::before,
 .tooltip.bs-tooltip-bottom .tooltip-arrow::before,
 .tooltip.bs-tooltip-start .tooltip-arrow::before,
 .tooltip.bs-tooltip-end .tooltip-arrow::before {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .footer-widget__info .number {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .menu-primary__container>li>a.active span::before,
 .menu-primary__container>li>a:hover span::before {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
 }

 .menu-primary__container>li>a.active,
 .menu-primary__container>li>a:hover {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .menu-primary .sub-menu li:hover>a {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .header-user__login:hover {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .call-to-action__sub-title {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .courses-tab-menu .nav li button {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .courses-tab-menu .nav li:hover button,
 .courses-tab-menu .nav li button:active,
 .courses-tab-menu .nav li button:focus {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     -webkit-background-clip: text !important;
     -webkit-text-fill-color: transparent !important;
     color: transparent !important;
 }

 .about-image-widget__icon {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .section-title__title mark::after {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .section-title__title-03 mark::after {
     background: linear-gradient(90deg, #1c8245, #27ae60) !important;
 }

 .contact-form__input.text-center i,
 .contact-form__input.text-center svg,
 .tutor-course-price-preview__btn i,
 .tutor-course-price-preview__btn svg {
     background: none !important;
     -webkit-background-clip: unset !important;
     -webkit-text-fill-color: #fff !important;
     color: #fff !important;
 }






 .slider-section__shape-02,
 .slider-section__shape-03,
 .call-to-action__shape-01,
 .call-to-action__shape-02,
 .call-to-action__shape-03 {
     border-color: #034a7a !important;
 }

 .call-to-action__content {
     background-color: #e4f1faff !important;
 }

 .course-info__instructor {
     color: #034a7a !important;
     /* blue */
     transition: color 0.5s ease-in-out;
 }

 .course-info__instructor:hover,
 .course-info__instructor:focus,
 .course-info__instructor:active {
     color: #27ae60 !important;
     /* green */
 }

 .course-info__title a {
     transition: color 0.4s ease-in-out;
 }

 .course-info__title a:hover {
     color: #27ae60 !important;
 }

 .course-info__badge-text.badge-all {
     background: #e4f1faff !important;
     color: #5da1cfff !important;
 }


 .page-pagination .pagination li a.active {
     background: linear-gradient(90deg, #034a7a, #031322) !important;
     color: #fff !important;
     /* keep text readable */
     border-color: #034a7a !important;
     /* optional: match border to blue */
 }

 .slider-caption-04__main-title span {
     color: #47ca7dff !important;
     border-bottom: 2px solid #47ca7dff !important;
 }


 .spinner-border {
     border: 2px solid rgba(255, 255, 255, 0.6);
     border-top: 2px solid transparent;
     border-radius: 50%;
     width: 1rem;
     height: 1rem;
     vertical-align: middle;
     /* Align spinner vertically with text */
     margin-right: 8px;
     /* Space between spinner and text */
     animation: spinner-border 0.75s linear infinite;
 }

 @keyframes spinner-border {
     to {
         transform: rotate(360deg);
     }
 }

 .btn-primary:disabled {
     cursor: not-allowed;
     /* Change cursor when disabled */
 }

 .banner-big-box__arrow {
  position: absolute;
  left: 411px !important;
  bottom: 76px !important;
 }