/* One workbook artwork for both dashboards and every visual theme.
   A separate icon layer survives theme button background/hover overrides. */
:root {
  --dashboard-excel-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='10' y='3' width='20' height='26' rx='2' fill='%23107c41'/%3E%3Cpath d='M12 3h16a2 2 0 0 1 2 2v5H10V5a2 2 0 0 1 2-2Z' fill='%2333c481'/%3E%3Cpath d='M10 10h20v6H10z' fill='%2321a366'/%3E%3Cpath d='M10 16h20v6H10z' fill='%23185c37'/%3E%3Cpath d='M20 5v22M12 10h16M12 16h16M12 22h16' fill='none' stroke='%23fff' stroke-opacity='.28' stroke-width='1'/%3E%3Crect x='3' y='9' width='17' height='18' rx='2' fill='%230b4026' fill-opacity='.25'/%3E%3Crect x='1' y='8' width='18' height='18' rx='2' fill='%23185c37'/%3E%3Cpath d='M5.2 11.5h2.7l2.2 3.8 2.2-3.8h2.5l-3.4 5.4 3.6 5.6h-2.7l-2.4-4-2.3 4H5l3.6-5.6Z' fill='%23fff'/%3E%3C/svg%3E");
}

html[data-style] button:is(.module-export, .excel-icon-btn) {
  box-sizing: border-box;
  width: var(--excel-button-size, 32px);
  height: var(--excel-button-size, 32px);
  min-width: var(--excel-button-size, 32px);
  min-height: var(--excel-button-size, 32px);
  padding: 0;
  flex-shrink: 0;
  background-image: none;
}
/* Exports beside form actions inherit that row's control size. Card headers
   retain the compact default, and the workbook artwork stays 24px. */
html[data-dashboard-surface="admin"] :is(.actions, .dash-ip-date-filter-actions) {
  --excel-button-size: var(--action-btn-height, 40px);
}
html[data-style] button:is(.module-export, .excel-icon-btn):not([hidden]) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
html[data-style] .module-export::before { content: ""; }
html[data-style] .module-export::before,
html[data-style] .excel-icon-btn .excel-icon {
  display: block;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  background: var(--dashboard-excel-icon) center / contain no-repeat;
  pointer-events: none;
}