/*
 Theme Name:   Phlox Child
 Theme URI:    https://phlox.pro/
 Description: Child theme for Phlox
 Author:       Your Name
 Author URI:   https://yourwebsite.com
 Template:     phlox
 Version:      1.0.0
 Text Domain:  phlox-child
*/

/* Add your custom CSS below */

/* Marquee outer safety */
/* Marquee wrapper */
.gsap-marquee-wrap {
  width: 100%;
  overflow: hidden;
  position: relative;
}

/* Marquee track */
.gsap-marquee {
  display: flex;
  align-items: center;
  gap: 60px;
  white-space: nowrap;
}

/* Each heading */
.gsap-marquee > * {
  flex: 0 0 auto; /* 🔥 stops shrinking */
  white-space: nowrap;
}

/* 🌙 DARK MODE Toggle Button */
@media (max-width: 575px) {
  .slider {
    width: 50px !important;
    height: 20px !important;
  }
  .slider::before {
    width: 16px !important;
    height: 16px !important;
  }
  .theme-switch {
    right: -5px !important;
  }
}

/* 🌙 DARK MODE GLOBAL COLORS */
body.dark-mode {
  --e-global-color-primary: #0070c0;
  --e-global-color-secondary: #7a8cff;
  --e-global-color-text: #45556c;
  --e-global-color-accent: #ed1c24;
  --e-global-color-b1f8b6c: #ffffff;
  --e-global-color-a1e41cd: #080808;

  background-color: #121212;
}

/* Only main layout backgrounds */
body.dark-mode .site,
body.dark-mode .site-content,
body.dark-mode .elementor,
body.dark-mode .elementor-section {
  /* background-color: #121212 !important; */
}

/* Inner containers transparent ठेव */
body.dark-mode .elementor-container,
body.dark-mode .elementor-column,
body.dark-mode .elementor-widget-wrap {
  background-color: transparent !important;
}

/* Cards / boxes */
body.dark-mode .elementor-widget-container {
  /* background-color: #1e1e1e !important; */
}

/*Card Dark Mode */
body.dark-mode .card {
  background-color: #e2dfdf47 !important;
  border: 2px solid #c7d6df !important;
}
body.dark-mode .card:hover {
  background-color: #0070c012 !important;
  border: 2px solid #8ab7d3 !important;
}

/* Project sectionDark Mode */
body.dark-mode .projects {
  background-color: #f1f5f9 !important;
}
/* feature sectionDark Mode */
body.dark-mode .feature {
  background-color: #0070c03a !important;
}
/* feature sectionDark Mode */
body.dark-mode .counter {
  background-color: #f1f5f9 !important;
}

body.dark-mode .elementor-view-stacked .elementor-icon {
  fill: #ffffff;
}
.aux-full-width .aux-wrapper {
  overflow-x: hidden;
  background: #080808;
}
body.dark-mode .aux-wrapper {
  background: #ffffff !important;
}
/* .body.dark-mode input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
  background: #868686 !important;
} */

.custom-form label {
  display: block !important;
  margin-bottom: 0 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  color: #90a1b9 !important;
}

.custom-form select,
.custom-form input[type="text"],
.custom-form input[type="email"],
.custom-form input[type="password"],
.custom-form input[type="tel"],
.custom-form input[type="url"],
.custom-form input[type="date"],
textarea {
  color: #969494 !important;
  width: 100% !important;
  height: 60px !important;
  border-radius: 12px !important;
  background: rgb(0, 0, 0) !important;
}
body.dark-mode .custom-form select,
body.dark-mode .custom-form input[type="text"],
body.dark-mode .custom-form input[type="email"],
body.dark-mode .custom-form input[type="password"],
body.dark-mode .custom-form input[type="tel"],
body.dark-mode .custom-form input[type="url"],
body.dark-mode .custom-form input[type="date"] {
  color: rgb(2, 2, 2) !important;
  width: 100% !important;
  height: 60px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
}
body.dark-mode .custom-form textarea {
  background: #ffffff !important;
  color: rgb(2, 2, 2) !important;
}
.custom-form select:not([multiple]) {
  padding: 10px 40px 10px 12px !important;
  border: solid 1px #77767654 !important;
}
.wpcf7 textarea {
  min-height: 120px !important;
  height: 50px !important;
  max-width: 100%;
}
.double {
  display: flex !important;
  gap: 20px !important;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="password"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="date"],
.wpcf7 textarea {
  display: block;
  width: 100%;
  height: 60px;
  max-width: none;
  margin-bottom: 0;
  padding: 10px;
}
.custom-form p {
  margin-bottom: 20px !important;
}
.custom-form input[type="submit"] {
  margin: 0 !important;
}
.custom-form input[type="text"],
.custom-form input[type="password"],
.custom-form input[type="email"],
.custom-form input[type="tel"],
.custom-form input[type="url"],
.custom-form textarea,
.custom-form input.aux-outline[type="text"],
.custom-form input.aux-outline[type="password"],
.custom-form input.aux-outline[type="email"],
.custom-form input.aux-outline[type="tel"],
.custom-form input.aux-outline[type="url"],
.custom-form textarea.aux-outline {
  border: solid 1px #77767654;
  background: transparent;
}
.wpcf7-form label span {
  display: block;
  margin-top: 8px; /* space between label text & input */
}
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: #8f84e083;
}

.custom-form input[type="submit"] {
  height: 60px;
  padding: 20px;
  border: none;
  background: #0070c0;
  color: #ffffff;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  margin: 0;
  width: 100%;
}
body.dark-mode .custom-form input[type="submit"] {
  height: 60px;
  padding: 20px;
  border: none;
  background: #000000;
  color: #ffffff;
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
  margin: 0;
  width: 100%;
}

/*  ======================= */
@media (max-width: 575px) {
  .custom-form input[type="submit"] {
    width: 100%;
  }
  .custom-form label {
    font-size: 12px !important;
  }
}

body.dark-mode .p-btn .wpr-button {
  background-color: #000000 !important;
  color: #ffffff !important;
}
body.dark-mode .p-btn .wpr-button .wpr-button-text {
  background-color: #000000 !important;
  color: #ffffff !important;
}