/* v2 styles: ESG report builder chrome (owner W2-ESGR).

   Loaded by base.html after the page's own stylesheets, so it sits after
   core.css.  Only the chrome around the report -- the options sidebar, the
   stage toolbar and the reset dialog -- takes the app's v2 look; the report
   pages keep the report's own type and neutrals, which
   v2/esg_report_print.css switches for the builder and the PDF alike.

   The chrome markup (_builder_chrome.html) is pinned by drift guards, so
   every change here is CSS only. */

/* ---- options sidebar ---- */
.dp-v2 .esg-report-builder .builder{font-family:var(--dp-font);font-size:var(--dp-font-size);
  background:var(--dp-card);border-right-color:var(--dp-border)}
.dp-v2 .esg-report-builder .bsub{color:var(--dp-muted-fg)}
.dp-v2 .esg-report-builder .bgroup{border-color:var(--dp-border);border-radius:var(--dp-radius)}
.dp-v2 .esg-report-builder .bgroup .gh{font-size:12px;font-weight:600;color:var(--bs-primary) !important;
  background:var(--dp-card);border-bottom-color:var(--dp-border)}
.dp-v2 .esg-report-builder .countpill{font-size:11px;font-weight:500;color:var(--dp-muted-fg);
  background:var(--dp-card);border:1px solid var(--dp-border);border-radius:var(--dp-radius-pill)}
.dp-v2 .esg-report-builder .fld label{font-size:12px;font-weight:500;color:var(--dp-fg)}
.dp-v2 .esg-report-builder .fld input,
.dp-v2 .esg-report-builder .fld select{height:32px;padding:0 .625rem;font-size:var(--dp-font-size);
  color:var(--dp-fg);background:var(--dp-card);border-color:var(--dp-input-border);
  border-radius:var(--dp-radius-ctl)}
.dp-v2 .esg-report-builder .fld input:focus,
.dp-v2 .esg-report-builder .fld select:focus{outline:none;border-color:var(--dp-ring);
  box-shadow:0 0 0 2px rgba(var(--dp-primary-rgb), .25)}
.dp-v2 .esg-report-builder .bnote{color:var(--dp-muted-fg)}
.dp-v2 .esg-report-builder .bwarn{color:var(--dp-warning-fg);background:var(--dp-warning-bg);
  border:1px solid var(--dp-warning-border);border-radius:var(--dp-radius)}
.dp-v2 .esg-report-builder .picktools button{color:var(--dp-accent-fg);font-weight:500}
.dp-v2 .esg-report-builder .trow{font-size:var(--dp-font-size)}
.dp-v2 .esg-report-builder .trow.sub{color:var(--dp-fg)}
.dp-v2 .esg-report-builder .trow.off .name{color:var(--dp-muted-fg)}
.dp-v2 .esg-report-builder .divh{border-top-color:var(--dp-border)}
.dp-v2 .esg-report-builder .sw input:focus-visible + .tk{box-shadow:0 0 0 2px rgba(var(--dp-primary-rgb), .35)}

/* the three-way choice: outlined, active segment filled with the brand colour (prototype) */
.dp-v2 .esg-report-builder .seg3{gap:0;padding:0;overflow:hidden;background:var(--dp-card);
  border-color:var(--dp-border);border-radius:var(--dp-radius)}
.dp-v2 .esg-report-builder .seg3 button{border-radius:0;background:transparent;
  font-size:12px;font-weight:500;color:var(--dp-muted-fg)}
.dp-v2 .esg-report-builder .seg3 button.on{background:var(--bs-primary);color:var(--bs-white)}

/* ---- stage toolbar ---- */
.dp-v2 .esg-report-builder .stage-toolbar{font-family:var(--dp-font)}
.dp-v2 .esg-report-builder .stage-toolbar .liveflag{color:var(--dp-muted-fg)}
.dp-v2 .esg-report-builder .stage-toolbar .edithint{color:var(--dp-muted-fg)}

/* The builder's own `.btn` (not Bootstrap's) in the v2 button shape:
   32px, 6px radius, weight 500, outline by default. */
.dp-v2 .esg-report-builder .stage-toolbar .btn,
.dp-v2 .rmodal .btn{display:inline-flex;align-items:center;height:32px;padding:0 .75rem;
  font-family:var(--dp-font);font-size:var(--dp-font-size);font-weight:500;
  color:var(--dp-accent-fg);background:var(--dp-card);border:1px solid var(--dp-border);
  border-radius:var(--dp-radius)}
.dp-v2 .esg-report-builder .stage-toolbar .btn:hover,
.dp-v2 .rmodal .btn:hover{background:var(--dp-accent)}
.dp-v2 .esg-report-builder .stage-toolbar .btn.primary{color:var(--bs-white);
  background:var(--teal);border-color:var(--teal)}
.dp-v2 .esg-report-builder .stage-toolbar .btn.primary:hover{background:var(--teal-dark);
  border-color:var(--teal-dark)}
.dp-v2 .rmodal .btn.danger{color:var(--bs-white);background:var(--dp-destructive);
  border-color:var(--dp-destructive)}

/* ---- reset confirmation (appended to body by core.js) ---- */
.dp-v2 .rmodal{background:rgba(0,0,0,.4)}
.dp-v2 .rmodal-box{font-family:var(--dp-font);background:var(--dp-card);
  border:1px solid var(--dp-border);border-radius:var(--dp-radius);box-shadow:var(--dp-shadow-md)}
.dp-v2 .rmodal-box h2{font-size:14px;font-weight:600;color:var(--dp-fg)}
.dp-v2 .rmodal-box p{font-size:var(--dp-font-size);color:var(--dp-muted-fg)}