/* ----------------------------------

Template Name: Digalu - Digital Marketing Agency Template
Author: validtheme
Description:
Version: 1.0

Main Font    : Roboto
Main Color   : #8A6552

-------------------------------------

[Typography]

Body copy:    15px 'Roboto', sans-serif
Header:     36px 'Roboto', sans-serif
Input, textarea:  15px 'Roboto', sans-serif
Sidebar heading:  20px 'Roboto', sans-serif

>>> TABLE OF CONTENTS:
=======================
        
    01. Template default css
        - Animations
        - General
        - Section Title
        - Video Button
        - Typography
        - Tables
        - Forms
        - Buttons
        - Pagination
        - Colors
        - Accordion
        - Tabs
    02. Preloader
    03. Topbar
    04 Navbar
        - Navbar Default
        - Navbar Transparent
        - Navbar Sticky
        - Navbar Box
    05. Banner
        - Slide Effect
        - Fade Effect
    06. Features
    07. About Us
        - Full Width Version
        - Default Version
    08. Services
        - Version One
        - Version Two
        - Version Three
    09. Why Choose Us
    10. Company Analysis/Graph
    11. Companies/Clients/Partner
    12. Team
    13. Testimonials
    14. Projects
    15. Gallery
    16. Our Expertise
    17. Work Process
    18. FAQ
    19. Blog
        - Standard
        - Left Sidebar
        - Right Sidebar
        - Single
    20. Error 404
    21. Footer
    22. PHP Contact Form
    23. Others

*/

/*
** General Styles for HTML tags
*/
/* Equal height cards */
.feature-style-one {
  display: flex;
  margin-bottom: 30px;
}

.feature-style-one .item {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.feature-style-one .item p {
  flex-grow: 1;
}

/* Color 1 - Items 1 & 5 (Primary color) */
.feature-style-one:nth-child(1) i,
.feature-style-one:nth-child(5) i {
  color: var(--color-primary);
}

.feature-style-one:nth-child(1) i::after,
.feature-style-one:nth-child(5) i::after {
  background: var(--color-primary);
}

/* Color 2 - Items 2 & 6 (Optional color) */
.feature-style-one:nth-child(2) i,
.feature-style-one:nth-child(6) i {
  color: var(--color-optional);
}

.feature-style-one:nth-child(2) i::after,
.feature-style-one:nth-child(6) i::after {
  background: var(--color-optional);
}

/* Color 3 - Items 3 & 7 (Cyan) */
.feature-style-one:nth-child(3) i,
.feature-style-one:nth-child(7) i {
  color: #26c6da;
}

.feature-style-one:nth-child(3) i::after,
.feature-style-one:nth-child(7) i::after {
  background: #26c6da;
}

/* Color 4 - Items 4 & 8 (New color - you can change this) */
.feature-style-one:nth-child(4) i,
.feature-style-one:nth-child(8) i {
  color: #ff6b6b;
}

.feature-style-one:nth-child(4) i::after,
.feature-style-one:nth-child(8) i::after {
  background: #ff6b6b;
}
.single-item {
  display: flex;
  margin-bottom: 30px;
}
/* Custom layout: 3 + 3 + 2 centered */
.custom-services-layout {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

/* Center last two items */

@media (min-width: 992px) {
  .custom-services-layout .last-row-item:nth-last-child(-n + 2) {
    margin-left: auto;
    margin-right: auto;
  }

  .project-style-one {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
  }

  .project-style-one .content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
  }
}

/* Center the last row with 2 items */
@media (min-width: 992px) {
  /* Keep the default 33.333% width for all items on large screens */
  .col-lg-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .custom-services-layout .last-row-item {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .custom-services-layout .last-row-item:nth-last-child(-n + 2) {
    margin-left: auto;
    margin-right: auto;
  }

  /* 3. NEW: Apply a negative margin to reduce the gap between the two centered items. */
  /* This rule targets the 7th item (second-to-last) */
  .custom-services-layout .last-row-item:nth-last-child(2) {
    /* Adjust this value (e.g., -60px) to control how close they get */
    margin-right: -60px;
  }
}
/* search */
.search-results {
  position: absolute !important; /* Changed from relative to absolute */
  width: calc(100% - 60px) !important; /* Match input group width */
  left: 30px !important; /* Align with input group */
  top: calc(50% + 50px) !important; /* Position below the input group */
  border-radius: 8px !important;
  background: #1e2a3c !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45) !important;
  max-height: 400px !important;
  overflow-y: auto !important;
  margin-top: 0 !important; /* Changed from 20px to 0 since we're using top positioning */
  z-index: 8 !important; /* Changed from 9999 to 8 so it stays below input group */
}

.results-container {
  padding: 10px 0 !important;
  background: #1e2a3c !important;
}

.search-result-item {
  padding: 15px 20px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
  display: block !important;
  background: #1e2a3c !important;
  border-bottom: 1px solid #2b394d !important;
}

.search-result-item:hover {
  background: #2b394d !important;
}

.search-result-item:last-child {
  border-bottom: none !important;
}

.result-title {
  font-weight: 600 !important;
  color: #ffffff !important;
  margin-bottom: 5px !important;
  font-size: 16px !important;
  display: block !important;
}

.result-description {
  color: #cccccc !important;
  font-size: 14px !important;
  margin: 0 !important;
  display: block !important;
}

.no-results {
  padding: 20px !important;
  text-align: center !important;
  color: #cccccc !important;
  background: #1e2a3c !important;
}

.search-highlight {
  background-color: #f1c40f !important;
  color: #1e2a3c !important;
  font-weight: 700 !important;
  padding: 0 2px !important;
}
.input-group-addon {
  background: transparent !important;
  border: none !important;
}
.input-group-addon i.fa {
  color: #ffffff !important;
}

.testimonial-style-one-carousel .swiper-wrapper {
  display: flex;
  align-items: stretch; /* Makes children fill equal height */
}

.testimonial-style-one-carousel .swiper-slide {
  display: flex;
  height: auto; /* Let Swiper handle slide height */
}

.testimonial-style-one-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: #fff; /* optional: keep consistent background */
  padding: 30px;
  border-radius: 10px;
  height: 100%;
}