/* Container */
.bs-wrap { max-width: 960px; margin: 0 auto; }

/* Accordion */
.bs-accordion { margin: 1rem 0; border-radius: 12px; overflow: hidden; }
.bs-accordion details { border: 1px solid #e5e7eb; border-radius: 12px; background: #fff; margin-bottom: .75rem; }
.bs-accordion details[open] { box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.bs-accordion summary {
  list-style: none; cursor: pointer; padding: .9rem 1.1rem;
  display: flex; align-items: center; justify-content: space-between;
  font-weight: 600; background: #f9fafb;
}
.bs-accordion summary::-webkit-details-marker { display: none; }
.bs-acc-title { display: flex; gap: .6rem; align-items: baseline; }
.bs-acc-kpi { font-size: .85rem; color: #6b7280; }

/* Questions list */
.bs-questions { padding: .75rem 1.1rem 1.1rem; }
.bs-q { display: grid; grid-template-columns: 1fr auto; gap: .75rem; padding: .5rem 0; border-bottom: 1px solid #f1f5f9; }
.bs-q:last-child { border-bottom: 0; }
.bs-q-theme { font-weight: 500; margin-bottom: 0rem; color:rgb(1, 106, 53) }
.bs-q-text { line-height: 1.45; }
.bs-q-options label { margin-left: .6rem; }

/* Form footer */
.bs-controls { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin:1rem 0; }
.bs-btn { appearance:none; border:1px solid #111827; background:#111827; color:#fff; padding:.6rem .9rem; border-radius:8px; cursor:pointer; }
.bs-btn.secondary { background:#fff; color:#111827; }

/* Chart block */
#bsChart { width:100%; max-width: 680px; margin: 1.25rem 0; }
#bsThanks { background:#f9fafb; border:1px solid #e5e7eb; padding:1rem; border-radius:12px; }

/* Put Da/Nu on one line */
.bs-questions .bs-q-options{
  display: flex;
  align-items: center;
  gap: .9rem;          /* space between options */
  flex-wrap: wrap;     /* allow wrap on very narrow screens */
}

.bs-questions .bs-q-options label{
  display: inline-flex;
  align-items: center;
  gap: .35rem;         /* space between dot and text */
  margin: 0;           /* override theme margins if any */
}

/* Colored accordion headers by category */
.bs-accordion details > summary { 
  border-bottom: 1px solid transparent;
}

/* (E) Mediu – light green */
.bs-accordion details.cat-e > summary {
  background: #e9f7ef;            /* light green */
  border-color: #d6f0e2;
}

/* (G) Guvernenta – light blue */
.bs-accordion details.cat-g > summary {
  background: #eaf4ff;            /* light blue */
  border-color: #d6e9ff;
}

/* (S) Social – light yellow */
.bs-accordion details.cat-s > summary {
  background: #fff8e1;            /* light yellow */
  border-color: #ffefb0;
}

/* ESG – light pink */
.bs-accordion details.cat-esg > summary {
  background: #ffeaf0;            /* light pink */
  border-color: #ffd1de;
}

/* optional: a subtle colored left bar for each */
.bs-accordion details.cat-e   { border-left: 6px solid #9ad4b0; }
.bs-accordion details.cat-g   { border-left: 6px solid #9ec6ff; }
.bs-accordion details.cat-s   { border-left: 6px solid #ffd86b; }
.bs-accordion details.cat-esg { border-left: 6px solid #ff9fbc; }

/* Caret icon */
.bs-accordion summary {
  position: relative;
}
.bs-accordion summary .bs-caret::before {
  content: "▸";                   /* your triangle */
  display: inline-block;
  transition: transform .2s ease;
  transform-origin: 50% 50%;
  font-size: 2rem;
  line-height: 1;
  margin-left: .5rem;
  color: #6b7280;                 /* muted */
}
/* Rotate on open */

.bs-accordion details[open] > summary .bs-caret::before {
  transform: rotate(90deg);
}

.bs-accordion summary::-webkit-details-marker { display: none; }
.bs-accordion summary::marker { content: ""; }  /* Firefox */

.bs-wrap .bs-accordion details > summary {
  display:flex; align-items:center; justify-content:space-between;
}
.bs-wrap .bs-accordion details > summary .bs-caret::before{
  content:"▸";
  display:inline-block;
  transition:transform .2s ease;
  transform-origin:50% 50%;
  margin-left:.5rem;
}
.bs-wrap .bs-accordion details[open] > summary .bs-caret::before{
  transform:rotate(90deg) !important;
}