/*!
 * Booterial: customizer panel styles (m3-customizer.css)
 * Only needed on pages that load m3-customizer.js.
 */

.m3c.offcanvas-end { --bs-offcanvas-width: 380px; }
.m3c .offcanvas-header { padding-bottom: 8px; }
.m3c .accordion { --bs-accordion-bg: transparent; --bs-accordion-btn-bg: transparent; --bs-accordion-active-bg: transparent; }
.m3c .accordion-button { padding: 14px 24px; }
.m3c .accordion-body { padding: 4px 24px 20px; }
.m3c .form-label { margin-bottom: 4px; }
.m3c .form-select-sm { min-height: 40px; }
.m3c .form-text { margin-top: 6px; }

.m3c-color + .m3c-color { margin-top: 12px; }
.m3c-color .form-control-color { flex: 0 0 56px; width: 56px; min-height: 48px; padding: 6px; }
.m3c-color .form-control:not(.form-control-color) { min-height: 48px; padding-block: 11px; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; text-transform: uppercase; }

.m3c-override { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; }
.m3c-override .form-check { margin: 0; }
.m3c-override .form-control-color { width: 48px; min-height: 40px; height: 40px; padding: 4px; flex: 0 0 48px; }
.m3c-override .form-control-color:disabled { opacity: .38; }
.m3c-color.form-floating > .form-control { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; text-transform: uppercase; }
.m3c-ov-field { flex: 0 0 148px; }
.m3c-ov-field .form-control { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; text-transform: uppercase; }
.m3c-ov-field .datepicker-toggle.btn-icon { top: 50%; translate: 0 -50%; }

.m3c-val { font-size: var(--md-sys-typescale-label-medium-size); color: var(--md-sys-color-on-surface-variant); font-variant-numeric: tabular-nums; }

.m3c-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  border-top: 1px solid var(--md-sys-color-outline-variant);
  background: var(--md-sys-color-surface-container-low);
}
.m3c-footer .dropdown { margin-left: auto; }

.m3c-report { font-size: var(--md-sys-typescale-body-small-size); margin-bottom: 0; }
.m3c-report > :not(caption) > * > * { padding: 6px 4px; vertical-align: middle; }
.m3c-report { table-layout: fixed; }
.m3c-report th:last-child, .m3c-report td:last-child { width: 64px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.m3c-report .text-truncate { min-width: 0; }
.m3c-on { font-size: 11px; color: var(--md-sys-color-on-surface-variant); }
.m3c-sample {
  flex: 0 0 auto;
  display: inline-block;
  width: 28px;
  margin-right: 8px;
  border-radius: var(--md-sys-shape-corner-extra-small);
  text-align: center;
  font-weight: 500;
  outline: 1px solid var(--md-sys-color-outline-variant);
}
