/* Dark Mode Styles for Seventy Landing Page */
/* Based on the dark mode colors from main.css */

html.dark-mode,
body.dark-mode {
  background-color: #1c1c1c !important;
  color: #ffffff !important;
}

/* Text colors */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: #ffffff !important;
}

body.dark-mode p {
  color: #cccccc !important;
}

/* Estilos para listas y elementos de lista */
body.dark-mode ul,
body.dark-mode ol,
body.dark-mode li,
body.dark-mode .saas_list li {
  color: #ffffff !important;
}

body.dark-mode .saas_list li .icon {
  background-color: #08d106 !important;
  border: 1px solid #ffffff !important;
  box-shadow: 0 0 5px rgba(255, 255, 255, 0.3) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.dark-mode .saas_list li .icon img {
  filter: brightness(0) invert(1) !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 16px !important;
  height: 16px !important;
}

/* Navbar styles */
body.dark-mode .navbar {
  background-color: #161717 !important;
  border-color: #4a4a4a !important;
}

body.dark-mode .nav-link {
  color: #ffffff !important;
}

body.dark-mode .nav-link:hover {
  color: #08d106 !important;
}

/* Banner area */
body.dark-mode .saas_banner_area {
  background-color: #1c1c1c !important;
}

/* Cards and sections */
body.dark-mode .card-corporate,
body.dark-mode .card-corporate-accent {
  background-color: #161717 !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

body.dark-mode .card-corporate-accent {
  border-left: 4px solid #08d106 !important;
}

/* Features sections */
body.dark-mode .saas_features_img[data-bg-color="#E6D8F5"],
body.dark-mode .saas_features_img[data-bg-color="#ADDEF0"],
body.dark-mode .saas_features_img[data-bg-color="#B3F7D5"] {
  background-color: #2d2e2e !important;
}

/* Testimonial area */
body.dark-mode .testimonial_area_one {
  background: #161717 !important;
  background-image: none !important;
}

body.dark-mode .testimonial_area_one .section_title h2,
body.dark-mode .testimonial_area_one .section_title p {
  color: #ffffff !important;
}

body.dark-mode .testimonial_slider_two .item {
  background-color: #2d2e2e !important;
  color: #ffffff !important;
  border: 1px solid #373737 !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.3) !important;
}

body.dark-mode .testimonial_slider_two .item p {
  color: #ffffff !important;
}

body.dark-mode .testimonial_slider_two .ratting i {
  color: #08d106 !important;
}

/* Buttons */
body.dark-mode .saas_btn,
body.dark-mode .btn-primary-corporate,
body.dark-mode .btn-secondary-corporate,
body.dark-mode .btn-accent-corporate {
  background-color: #08d106 !important;
  color: #ffffff !important;
  box-shadow: 0px 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

body.dark-mode .saas_btn:hover,
body.dark-mode .btn-primary-corporate:hover {
  background-color: rgba(8, 209, 6, 0.8) !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

body.dark-mode .btn-secondary-corporate,
body.dark-mode .btn-accent-corporate {
  background-color: #4c0c7c !important;
}

body.dark-mode .btn-secondary-corporate:hover,
body.dark-mode .btn-accent-corporate:hover {
  background-color: rgba(76, 12, 124, 0.8) !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

/* Login and signup buttons */
body.dark-mode .login_btn,
body.dark-mode .signup_btn {
  background-color: #373737 !important;
  color: #ffffff !important;
}

body.dark-mode .login_btn:hover,
body.dark-mode .signup_btn:hover {
  background-color: #4a4a4a !important;
}

/* Service tabs */
body.dark-mode .service_tab_inner {
  background-color: #161717 !important;
  border-color: #4a4a4a !important;
}

body.dark-mode .service_tab_button {
  background-color: #2d2e2e !important;
  color: #ffffff !important;
}

body.dark-mode .service_tab_button.active {
  background-color: #373737 !important;
  color: #08d106 !important;
}

/* Service Tab Area */
body.dark-mode .service_tab_area {
  background-color: #161717 !important;
  padding: 30px 0 !important;
  border-top: 1px solid #373737 !important;
}

body.dark-mode .service_tab_inner {
  background-color: #1c1c1c !important;
  border-radius: 12px !important;
  padding: 30px !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.3) !important;
}

body.dark-mode .nav-tabs {
  border-bottom: 1px solid #373737 !important;
  margin-bottom: 20px !important;
}

body.dark-mode .service_tab_button {
  background-color: transparent !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  margin-right: 10px !important;
  padding: 15px !important;
  transition: all 0.3s ease !important;
}

body.dark-mode .service_tab_button:hover {
  background-color: #2d2e2e !important;
}

body.dark-mode .service_tab_button.active {
  background-color: #2d2e2e !important;
  color: #08d106 !important;
  border-bottom: 2px solid #08d106 !important;
}

body.dark-mode .service_tab_button .icon {
  background-color: #2d2e2e !important;
  border-radius: 8px !important;
  padding: 10px !important;
  margin-bottom: 8px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

body.dark-mode .service_tab_button.active .icon {
  background-color: rgba(8, 209, 6, 0.2) !important;
}

body.dark-mode .service_tab_button svg path {
  stroke: #ffffff !important;
}

body.dark-mode .service_tab_button.active svg path {
  stroke: #08d106 !important;
}

body.dark-mode .service_tab_content {
  background-color: #1c1c1c !important;
  border-radius: 8px !important;
  padding: 20px !important;
}

body.dark-mode .service_tab_content .accordion-item {
  background-color: #1c1c1c !important;
  border: none !important;
  border-bottom: 1px solid #373737 !important;
}

body.dark-mode .service_tab_content .tab_item_content h3,
body.dark-mode .service_tab_content .tab_item_content h4 {
  color: #ffffff !important;
}

body.dark-mode .service_tab_content .tab_item_content p {
  color: #cccccc !important;
}

body.dark-mode .service_tab_item {
  border-left: 3px solid #08d106 !important;
  padding-left: 15px !important;
  margin-bottom: 20px !important;
  background-color: #2d2e2e !important;
  border-radius: 0 8px 8px 0 !important;
  padding: 15px 15px 15px 20px !important;
}

/* Contact Form */
body.dark-mode .contact_form {
  background-color: #161717 !important;
  border: 1px solid #373737 !important;
}

body.dark-mode .contact_form h3 {
  color: #ffffff !important;
}

body.dark-mode .contact_form .form-control {
  background-color: #2d2e2e !important;
  border-color: #373737 !important;
  color: #ffffff !important;
}

body.dark-mode .contact_form .form-control::placeholder {
  color: #cccccc !important;
}

body.dark-mode .contact_form .select {
  background-color: #2d2e2e !important;
  border-color: #373737 !important;
  color: #ffffff !important;
}

body.dark-mode .contact_form .saas_btn {
  background-color: #08d106 !important;
  color: #ffffff !important;
  box-shadow: 0px 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

body.dark-mode .contact_form .saas_btn:hover {
  background-color: rgba(8, 209, 6, 0.8) !important;
}

/* Contact info icons */
body.dark-mode .contact_info_item .icon i {
  color: #08d106 !important;
}

body.dark-mode .contact_info_item .contect_text p,
body.dark-mode .contact_info_item .contect_text a {
  color: #ffffff !important;
}

body.dark-mode .contact_info_item .contect_text a:hover {
  color: #08d106 !important;
}

/* Pricing Section */
body.dark-mode .saas_price_area {
  background: #161717 !important;
  background-image: none !important;
}

body.dark-mode .saas_price_item {
  background-color: #1c1c1c !important;
  border: 1px solid #373737 !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.3) !important;
}

body.dark-mode .saas_price_item:hover {
  border-color: #08d106 !important;
  box-shadow: 0 4px 12px -2px rgba(76, 12, 124, 0.5) !important;
}

body.dark-mode .saas_price_item .price_header h3 {
  color: #ffffff !important;
}

body.dark-mode .saas_price_item .price_header h2 {
  color: #ffffff !important;
}

body.dark-mode .saas_price_item:hover .price_header h2 {
  color: #08d106 !important;
}

body.dark-mode .saas_price_item ul li {
  color: #cccccc !important;
}

body.dark-mode .saas_price_item ul li img {
  filter: brightness(0) invert(1) sepia(100%) saturate(10000%) hue-rotate(80deg) !important;
}

body.dark-mode .saas_price_item .price_btn {
  background-color: #2d2e2e !important;
  color: #ffffff !important;
  border: 1px solid #373737 !important;
}

body.dark-mode .saas_price_item .price_btn:hover {
  background-color: #08d106 !important;
  color: #ffffff !important;
  border-color: #08d106 !important;
}

body.dark-mode .price_note {
  color: #cccccc !important;
}

body.dark-mode .price_note a {
  color: #08d106 !important;
}

/* FAQ Section */
body.dark-mode .saas_faq_area {
  background: #161717 !important;
  background-image: none !important;
}

body.dark-mode .faq_inner .accordion-item {
  background-color: #1c1c1c !important;
  border-bottom: 1px solid #373737 !important;
  margin-bottom: 15px !important;
  border-radius: 8px !important;
}

body.dark-mode .faq_inner .accordion-item .accordion-header .accordion-button {
  background-color: #1c1c1c !important;
  color: #ffffff !important;
  border-radius: 8px !important;
}

body.dark-mode .faq_inner .accordion-item .accordion-header .accordion-button:not(.collapsed) {
  background-color: #2d2e2e !important;
  color: #08d106 !important;
  box-shadow: none !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

body.dark-mode .faq_inner .accordion-item .accordion-body {
  background-color: #2d2e2e !important;
  color: #cccccc !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}

body.dark-mode .faq_inner .accordion-item .accordion-header .accordion-button::after {
  filter: brightness(0) invert(1) !important;
}

body.dark-mode .faq_inner .accordion-item .accordion-header .accordion-button:not(.collapsed)::after {
  filter: brightness(0) invert(1) sepia(100%) saturate(10000%) hue-rotate(80deg) !important;
}

/* Footer */
body.dark-mode footer {
  background-color: #161717 !important;
  color: #ffffff !important;
  border-color: #4a4a4a !important;
}

body.dark-mode footer a {
  color: #cccccc !important;
}

body.dark-mode footer a:hover {
  color: #08d106 !important;
}

/* Preloader */
body.dark-mode .preloader {
  background-color: #1c1c1c !important;
}

body.dark-mode .preloader .bg {
  background-color: #161717 !important;
}

/* Custom scrollbar for dark mode */
body.dark-mode .custom-scrollbar::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1);
}

body.dark-mode .custom-scrollbar::-webkit-scrollbar-thumb {
  background: #08d106;
}

/* Animations for dark mode */
body.dark-mode .animate-pulse-primary {
  animation: pulse-primary-dark 2s infinite;
}

@keyframes pulse-primary-dark {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(8, 209, 6, 0.4);
  }
  50% {
    box-shadow: 0 0 20px 0 rgba(8, 209, 6, 0.7);
  }
}

/* Gradient for dark mode */
body.dark-mode .bg-gradient-corporate {
  background: linear-gradient(135deg, #08d106, #4c0c7c);
  background-size: 200% 200%;
}