/**
 * BWA Product Sections - Front Office Styles
 */

.bwa-product-sections {
  margin : 2rem 0;
}

/* Accordion Container */
.bwa-sections-accordion {
  display        : flex;
  flex-direction : column;
  gap            : 32px;
  overflow       : hidden;
}

.bwa-section-accordion-item:last-child {
  border-bottom : none;
}

/* Accordion Header */
.bwa-section-header {
  display     : flex;
  align-items : center;
  border      : none;
  cursor      : pointer;
  text-align  : left;
  gap         : 15px;
  background  : transparent;
  padding     : 0;
}

.bwa-section-header:focus {
  outline : none;
}

.bwa-section-title {
  color       : #3B3B3B;
  font-size   : 24px;
  font-style  : normal;
  font-weight : 500;
  line-height : 32px;
}

.bwa-section-icon {
  display         : flex;
  align-items     : center;
  justify-content : center;
  transition      : transform 0.3s ease;
  color           : #666;
}

.bwa-section-header[aria-expanded="true"] .bwa-section-icon {
  transform : rotate(180deg);
}

/* Accordion Content */
.bwa-section-content {
  max-height : 0;
  overflow   : hidden;
  transition : max-height 0.3s ease-out;
}

.bwa-section-content.is-open {
  max-height : 2000px;
  transition : max-height 0.5s ease-in;
}

.bwa-section-content-inner {
  color          : #3B3B3B;
  font-size      : 16px;
  font-style     : normal;
  font-weight    : 300;
  line-height    : 23px;
  letter-spacing : 0.5px;
  padding-top    : 16px;
}

.bwa-section-content-inner a {
  color : #ff9977;
}

.bwa-section-content-inner ul {
  margin       : 0;
  padding-left : 1.5rem;
  list-style   : disc;
}

.bwa-section-content-inner li {
  margin-bottom : 0.75rem;
}

.bwa-section-content-inner img {
  max-width      : 100%;
  height         : auto;
  mix-blend-mode : darken;
}

/* Document Links */
.bwa-product-documents {
  display     : flex;
  flex-wrap   : wrap;
  gap         : 1rem;
  margin-top  : 1.5rem;
  padding-top : 1.5rem;
}

.tab-pane .bwa-product-documents {
  margin  : 0;
  padding : 0;
}

.product__images__wrapper .bwa-product-documents {
  justify-content : center;
  margin          : 0.5rem;
  padding         : 0;
}

.bwa-document-link {
  display         : inline-flex;
  align-items     : center;
  gap             : 0.5rem;
  padding         : 0.75rem 1.25rem;
  border          : 1px solid #333;
  border-radius   : 4px;
  color           : #333;
  text-decoration : none;
  font-weight     : 500;
  transition      : all 0.2s ease;
}

.bwa-document-link:hover {
  background-color : #333;
  border-color     : #333;
  color            : #fff;
  text-decoration  : none;
}

.bwa-document-link svg {
  flex-shrink : 0;
}

/* Product Warning */
.bwa-product-warning {
  margin : 1.5rem 0;
}

.bwa-warning-box {
  display       : flex;
  padding       : 12px 16px;
  align-items   : center;
  gap           : 16px;
  border-radius : 3px;
  background    : #F8F7F5;
}

.bwa-warning-icon {
  flex-shrink : 0;
  width       : 40px;
  height      : auto;
  margin-top  : 0.25rem;
}

.bwa-warning-icon.bwa-warning-emoji {
  display         : flex;
  align-items     : center;
  justify-content : center;
  font-size       : 22px;
  line-height     : 1;
  width           : 32px;
  margin-top      : 0;
}

.bwa-warning-content {
  color       : var(--color-quinary);
  font-size   : 13px;
  font-style  : normal;
  font-weight : 400;
  line-height : 18px;
}

.bwa-warning-content a {
  color                : var(--color-quinary);
  font-size            : 13px;
  font-style           : normal;
  font-weight          : 600;
  line-height          : 18px;
  text-decoration-line : underline;
  transition           : all 0.3s ease;
}

.bwa-warning-content a:hover {
  color : #ff9977;
}

.bwa-warning-content strong {
  font-weight : 600;
}

/* Responsive */
@media (max-width : 768px) {
  .bwa-section-title {
    font-size : 0.875rem;
  }

  .bwa-section-content-inner {
    padding : 1rem;
  }

  .bwa-product-documents {
    flex-direction : column;
  }

  .bwa-document-link {
    justify-content : center;
  }

  .bwa-warning-box {
    flex-direction : column;
    align-items    : center;
    text-align     : center;
  }

  .bwa-warning-icon {
    margin-top : 0;
  }
}
