@import "ecosystem-style.css";

@media (max-width: 767.98px) {
    .hideformob {
      display: none;
    }
  }
  
@media (max-width: 900px) 
{

    .faq_select_button
{

    font-size: 25px !important;
    padding: 16px !important;
}
.mobresponse
{
    width: 100%;
}
  
#faqbody{
    padding-left: 0px !important;
    padding-top: 20px !important;
}

.allsectiontitlefaq
{
    margin-top: 30%;
}

.book_flex_body
{
    display: none !important;
 
}

.general_QA_body
{
padding: 0px !important;
}

.general_body
{
    padding: 0px 0px !important;
 
}

.section_5_faq_body
{

padding: 24px 10px !important;
}

.faq_product_dropdown
{
    background-color: #E2EEF8 !important;
    color: #000 !important;
}


.active, .product_tab:hover {
    background: var(--Surface-Background-Surface-Secondary, #fff) !important;   
      color: #000 !important;
    
  }

.flex_producttab_body_mobile
{
display: flex !important;
/* width: 277px; */
/* padding: 12px; */
flex-direction: column !important;
align-items: center !important;
gap: 4px !important;
}


.flex_producttab_body
{
    display: none !important;
}
}

/* Media Query for smaller screens (max-width 768px) */
@media (max-width: 768px) {
    .faq_li {
        font-size: 16px;              /* Smaller font size for mobile */
        padding: 8px 0;               /* Slightly less padding */
        list-style-type: circle;      /* Change bullet style to circle */
    }

    .faq_ul {
        padding-left: 20px;           /* Add some left padding to make the bullets look better */
    }

    .faq_banner
{
   
    height: 576px !important;
    /* padding: 8px 80px 40px 80px; */
    flex-direction: column;
    align-items: center !important;
    justify-content: center !important;
    gap: 106px;
    background: url('../faq/faq_banner.png') lightgray 50% / cover no-repeat;
   margin-top: -80px; 
 
}

.banner_part1_body
{

   margin-top: 0px !important; 

}


.allsectiontitlefaq
{
    margin-top: 5%;
}

    
}

/* Media Query for very small screens (max-width 480px) */
@media (max-width: 480px) {
    .faq_li {
        font-size: 14px;              /* Even smaller font for tiny screens */
        padding: 6px 0;               /* Reduce padding further */
    }

    .faq_ul {
        padding-left: 15px;           /* Reduce left padding slightly */
    }
}







.faq_banner
{
    display: flex;
    width: 100%;
    height: 676px;
    /* padding: 8px 80px 40px 80px; */
    flex-direction: column;
    align-items: flex-start;
    gap: 106px;
    background: url('../faq/faq_banner.png') lightgray 50% / cover no-repeat;
   margin-top: -80px; 
 
}

.banner_part1_body
{
    display: flex;
    max-width: 1600px;
    justify-content: left;
    align-items: center;
    align-content: center;
    gap: var(--Space-800, 32px) var(--Space-1200, 48px);
    align-self: stretch;
    flex-wrap: wrap;
   margin-top: 10%; 

}

.breadcrumb_nav
{
    background-color: black;
}

.section_faq_body
{
    display: flex;
width: 100%;
/* padding: 24px 80px; */
flex-direction: column;
align-items: flex-start;
gap: 24px;
overflow: hidden;
}

.general_QA_body
{
    padding: 24px 80px; 
}

.faq_select_body
{
    overflow-x: auto; 
    white-space: nowrap; 
    -ms-overflow-style: none;  
    scrollbar-width: none;    
}

.scroll-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
}



.faq_select_button
{
    display: flex;
    white-space: nowrap;
    width: auto; 
    /* min-width: 200px; */
    /* max-width:520px; */
padding: 6px 12px;
margin: 5px;
justify-content: center;
align-items: center;    
/* gap: 10px; */
border-radius: var(--Medium, 6px);
background: var(--Surface-Background-Surface, #F6F6F6);
color: var(--Text-Text-MegaMenu-Content, #000);

/* Labels/medium/Semibold 600 */
font-family: var(--labels-medium-semibold-600-font-family, Montserrat);
font-size: var(16px);
font-style: normal;
font-weight: var(--labels-medium-semibold-600-font-weight);
line-height: var(--labels-medium-semibold-600-line-height, 20px); /* 142.857% */
letter-spacing: 0.28px;


}

.activeeco
{
    border-radius: var(--Medium, 6px);
    border: 1px solid var(--Border-Border-light, #F5F5F5);
    background: var(--Gradient-2, linear-gradient(104deg, #F3F8FC 17.59%, #E2EEF8 100%));
    
    /* shadow/lg */
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.10), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.activscroll
{
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.10), 0px 4px 6px -2px rgba(0, 0, 0, 0.05);


}

.selected_faq_body
{
    display: flex;
/* padding: 0px 80px; */
flex-direction: column;
align-items: flex-start;
gap: 40px;
align-self: stretch;
}

.flex_producttab_body_mobile
{
    display: none;
}
.flex_producttab_body
{
display: flex;
/* width: 277px; */
/* padding: 12px; */
flex-direction: column;
align-items: center;
gap: 4px;
}

.product_tab
{   
    display: flex;
    width: 100%;
    padding: 12px;
    padding-right: 40px; /* ✅ Add right padding so text doesn't collide with arrow */
    align-items: center;
    border: none;
    background: var(--Surface-Background-Surface, #F6F6F6);
    color: var(--Text-Text-Heading, #000);
    position: relative;
    font-family: var(--labels-medium-semibold-600-font-family, Montserrat);
    font-size: var(--labels-medium-semibold-600-font-size, 14px);
    font-style: normal;
    font-weight: var(--labels-medium-semibold-600-font-weight);
    line-height: var(--labels-medium-semibold-600-line-height, 20px);
    letter-spacing: 0.28px;
    
    /* Arrow Icon */
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M6.75 3.75L12 9L6.75 14.25" stroke="%23A3A3A3" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    
    /* ✅ Ensure text wraps and doesn't overflow */
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    
}


/* Hover effect */
.product_tab:hover {
    background: var(--Surface-Background-Surface-Secondary, #E5383B);
    color: white;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M10.5 3.75L15.75 9M15.75 9L10.5 14.25M15.75 9L2.25 9" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
}

/* Active state */
.product_tab.active {
    background: var(--Surface-Background-Surface-Secondary, #E5383B);
    color: white;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M10.5 3.75L15.75 9M15.75 9L10.5 14.25M15.75 9L2.25 9" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
} 

.product_tab_arrow
{
    
position: absolute;
right:5%;

}

.main_faq_body
{
    width:100%;
    display: flex;
align-items: flex-start;
/* padding: 0 80px; */
gap: 80px;
align-self: stretch;
}


.body_product_QA{
    width: 100%;
display: flex;
flex-direction: row;
align-items: flex-start;
/* gap: 40px; */
align-self: stretch;
}

.faq_que
{
    display: flex;
padding: 24px;
flex-direction: column;
align-items: center;
gap: 12px;
align-self: stretch;
color: var(--Text-Text-Heading, #000);

/* Labels/large/Semibold 600 */
font-family: var(--labels-large-semibold-600-font-family);
font-size: var(--labels-large-semibold-600-font-size);
font-style: normal;
font-weight: var(--labels-large-semibold-600-font-weight);
line-height: var(--labels-large-semibold-600-line-height); /* 150% */
letter-spacing: var(--labels-large-semibold-600-letter-spacing);
}


.book_body
{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;

}

.book_titl_P_body
{
    display: flex;
flex-direction: column;
align-items: flex-start;
gap: 10px;
}

.book_title
{
    color: var(--Text-Text-Heading, #000);

/* Desktop/H4/H4 Bold */
font-family: var(--desktop-h4-h4-bold-font-family);
font-size: var(--desktop-h4-h4-bold-font-size);
font-style: normal;
font-weight: var(--desktop-h4-h4-bold-font-weight);
line-height: var(--desktop-h4-h4-bold-line-height); /* 128.571% */
}


.general_contact_box
{
    display: flex;
width:100%;
/* min-width: 220px; */
min-height: auto;
padding: 24px;
flex-direction: column;
align-items: flex-start;
gap: 12px;
flex: 1 0 0;
border-radius: var(--Large, 8px);
border: 1px solid var(--Border-Border-light, #F5F5F5);
background: var(--Surface-Background-Surface-Card, #FFF);
}

.general_contact_box_details_body
{
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 6px;
align-self: stretch;
}


.general_contact_box_icon
{
    display: flex;
    padding: 10px;
    align-items: center;
    gap: 10px;
border-radius: var(--Small, 4px);
background: var(--Surface-Background-Surface, #F6F6F6);
}

.general_contact_box_title
{
color: var(--Text-Text-Heading, #000);

/* Labels/medium/Semibold 600 */
font-family: var(--labels-medium-semibold-600-font-family);
font-size: var(--labels-medium-semibold-600-font-size);
font-style: normal;
font-weight: var(--labels-medium-semibold-600-font-weight);
line-height: var(--labels-medium-semibold-600-line-height); /* 142.857% */
letter-spacing: var(--labels-medium-semibold-600-letter-spacing);
}

.general_contact_details
{
color: var(--Text-Text-Body, #161A1D);
height: 48px;
/* Paragraphs/Small/Light 300 */
font-family: var(--paragraphs-small-light-300-font-family, Poppins);
font-size: var(--paragraphs-small-light-300-font-size);
font-style: normal;
font-weight: var(--paragraphs-small-light-300-font-weight);
line-height: var(--paragraphs-small-light-300-line-height); /* 142.857% */
letter-spacing: var(--paragraphs-small-light-300-letter-spacing);
}

.faq_general_btn
{
   
display: flex;
padding: 8px !important;
justify-content: center;
align-items: center;
gap: 4px;
border:none;

border-radius: var(--button-border-radius);
background: var(--button-bgcolor);   
color: var(--button-color);

/* Labels/medium/Semibold 600 */
font-family: var(--labels-medium-semibold-600-all-caps-font-family);
font-size: 10px;
font-style: normal;
font-weight: var(--labels-medium-semibold-600-all-caps-font-weight);
line-height: var(--labels-medium-semibold-600-all-caps-line-height, 20px); /* 142.857% */
letter-spacing: 0.28px;

}


.faqtypestitle
{
    color: var(--Text-Text-Keywords, #BA2A2D);

    /* Labels/large/Bold 700 All caps */
    font-family: var(--labels-large-bold-700-all-caps-font-family, Montserrat);
    font-size: var(--labels-large-bold-700-all-caps-font-size);
    font-style: normal;
    font-weight: var(--labels-large-bold-700-all-caps-font-weight);
    line-height: var(--labels-large-bold-700-all-caps-line-height); /* 150% */
    letter-spacing: var(--labels-large-bold-700-all-caps-letter-spacing);
    text-transform: uppercase;
    padding: 0 24px 24px 0;
}

.allsectiontitlefaq
{
    font-size: 52px;
 
/* Desktop/Display Large/Display 1 Bold */
font-family: var(--desktop-h2-h2-bold-font-family,Montserrat);
font-size: var(--desktop-h2-h2-bold-font-size);
font-style: normal;
font-weight: var(--desktop-h2-h2-bold-font-weight);
line-height: var(--desktop-h2-h2-bold-line-height); /* 119.231% */
letter-spacing: -1.04px;
}

.faq_contacts
{
    font-size: var(--Typeface-Labels-Size-XSmall, 12px);
font-style: normal;
font-weight: 600;
line-height: var(--Typeface-Labels-Line-Height-XSmall, 14px); /* 140% */
letter-spacing: 0.4px;
}

.product_tab_arrow_right
{
position: absolute;
right:2%;
}

.product_tab_arrow_down
{
position: absolute;
right:2%;
}

span[aria-expanded=true] .product_tab_arrow_right {
display: none;
}

span[aria-expanded=false] .product_tab_arrow_down {
 display: none;
}


.book_flex_body
{
    display: flex;
    gap: 12px;
flex-direction: column;


}

.book_flex_1{
    display: flex;
    gap: 12px;
    justify-content: center;
    align-items: end;
}

.faq_strong
{
   font-weight: bold; 
}

/* .faq_li
{

    display: list-item;     
    list-style-type: square; 
    list-style-position: outside;
    
  
}

.faq_ul
{
    display: block;          
} */

/* General styles for the FAQ list */
.faq_li {
    display: list-item;           /* Ensure it is a list item */
    list-style-type: square;      /* Square bullets for list items */
    list-style-position: outside; /* Position bullets outside the list item */
    padding: 10px 0;              /* Add some spacing between list items */
}

/* General styles for the FAQ list container */
.faq_ul {
    display: block;                /* Each item on a new line */
    margin: 0;
    padding-left: 45px;           /* Indent */
    white-space: normal;          /* Allow wrapping */
    overflow-wrap: break-word;    /* Break long words */
    word-break: break-word;       /* Extra fallback */
    box-sizing: border-box;       /* Include padding in width */
    width: 100%;
    max-width: 100%;

}



.section_5_faq_body:has(.navisworksfaqtypetitle) {
    border-top: none;

}


.general_body
{
    padding: 0 80px;
 
}

.drift-frame-controller {
    bottom: 0px !important;
    right: 10px !important;
  }

  #nextBtn,
  #prevBtn {
      width: 40px;
      height: 35px;
      background: #f6f6f6;
      color: #000;
      border: 1px solid gray;
      font-family: var(--labels-medium-semibold-600-font-family);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      padding: 0;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* soft shadow glow */
      transition: box-shadow 0.3s ease, background 0.3s ease;
  }
  
  /* Right half-circle */
  #nextBtn {
      border-radius: 0 40px 40px 0;
  }
  
  /* Left half-circle */
  #prevBtn {
      border-radius: 40px 0 0 40px;
  }
  
  /* Hover and Focus Effects */
  #nextBtn:hover,
  #prevBtn:hover,
  #nextBtn:focus,
  #prevBtn:focus {
      background: #ba2a2d;
      color: #fff ;
      box-shadow: 0 6px 12px rgba(63, 63, 63, 0.25); /* stronger glow on hover */
      outline: none;
  }
  
  #nextBtn:hover {
    box-shadow: -8px 0 12px rgba(63, 63, 63, 0.5); /* heavier left shadow */

}

#prevBtn:hover {
    box-shadow: 8px 0 12px rgba(63, 63, 63, 0.5); /* heavier right shadow */

}


.selectfaq
{
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 20px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

option{
    font-size: 12px !important;
    

}

.select-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
}

.select-icon {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    pointer-events: none; /* icon won't block clicks */
    color: #000;
}